/* ATENA header (5.2), nav + mega meni (5.3), pretraga, mobilni drawer (5.4), topbar. */

.at-topbar{background:var(--at-panel);color:var(--at-panel-ink);font-size:var(--at-fs-small);height:36px;display:flex;align-items:center}
.at-topbar .at-container{display:flex;align-items:center;justify-content:center;gap:var(--at-s-4)}
.at-topbar a{text-decoration:underline;text-underline-offset:3px}
.at-topbar__close{position:absolute;right:var(--at-gutter);color:var(--at-panel-muted);display:grid;place-content:center;width:28px;height:28px}
.at-topbar.is-hidden{display:none}

.at-header{position:sticky;top:0;z-index:var(--at-z-header);background:var(--at-bg);border-bottom:1px solid var(--at-line);height:var(--at-header-h);transition:transform var(--at-d-slow) var(--at-ease-in-out),background-color var(--at-d-slow) var(--at-ease-out),border-color var(--at-d-slow) var(--at-ease-out),box-shadow var(--at-d-slow) var(--at-ease-out)}
.at-header.is-up{transform:translateY(-100%)}
/* Otvoren dropdown/pretraga/mega meni ide preko sticky trake filtera (z 150) i sadržaja */
.at-header:hover,.at-header:focus-within{z-index:var(--at-z-dropdown)}
.at-header.is-scrolled{box-shadow:var(--at-shadow-xs)}
.at-header--classic{background:var(--at-surface)}
.at-header__bar{height:100%;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:var(--at-s-5)}
.at-header--split .at-header__bar{grid-template-columns:1fr auto 1fr}
.at-header--minimal .at-header__bar{grid-template-columns:auto 1fr auto}
@media (max-width:63.99em){
  :root{--at-header-h:60px}
  .at-header__bar,.at-header--split .at-header__bar{grid-template-columns:auto 1fr}
}

/* Logo */
.at-header__logo{display:inline-flex;align-items:center;gap:10px;color:var(--at-ink);line-height:0;font-family:var(--at-font-display);font-weight:700;font-size:1.375rem;letter-spacing:-.03em;line-height:1}
.at-header__logo img{height:var(--at-logo-h);width:auto;max-height:36px}
.at-header__logo svg{height:var(--at-logo-h);width:auto}
.at-wordmark{display:inline-flex;align-items:center;gap:10px}
.at-wordmark__mark{width:28px;height:28px;border:1.5px solid currentColor;border-radius:8px;display:grid;place-content:center}
.at-wordmark__mark svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.at-wordmark__text{transform:translateY(1px)}

/* Nav */
.at-nav{display:none}
@media (min-width:64em){.at-nav{display:flex;justify-content:center}}
.at-header--split .at-nav--left{justify-content:flex-end}
.at-header--split .at-nav--right{justify-content:flex-start}
.at-nav__list{display:flex;align-items:center;gap:var(--at-s-2);height:var(--at-header-h)}
.at-nav__item{position:relative;height:100%;display:flex;align-items:center}
.at-nav__link{display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 var(--at-s-3);border-radius:var(--at-radius-sm);font-weight:500;font-size:.9375rem;color:var(--at-ink);position:relative;transition:color var(--at-d-base) var(--at-ease-out)}
.at-nav__link::after{content:"";position:absolute;left:var(--at-s-3);right:var(--at-s-3);bottom:6px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform var(--at-d-base) var(--at-ease-out)}
.at-nav__link:hover::after,.at-nav__link[aria-expanded="true"]::after,.at-nav__item.is-current > .at-nav__link::after{transform:scaleX(1)}
.at-nav__link svg{width:14px;height:14px;transition:transform var(--at-d-base) var(--at-ease-out)}
.at-nav__link[aria-expanded="true"] svg{transform:rotate(180deg)}

/* Dropdown (obican podmeni) */
.at-nav__sub{position:absolute;top:100%;left:0;min-width:220px;padding:var(--at-s-2);background:var(--at-surface);border:1px solid var(--at-line);border-radius:var(--at-radius-md);box-shadow:var(--at-shadow-sm);opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity var(--at-d-base) var(--at-ease-out),transform var(--at-d-base) var(--at-ease-out),visibility 0s linear var(--at-d-base);z-index:var(--at-z-dropdown)}
.at-nav__item.is-open > .at-nav__sub{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.at-nav__sub a{display:block;padding:10px var(--at-s-3);border-radius:var(--at-radius-sm);font-size:var(--at-fs-small);color:var(--at-ink-2)}
.at-nav__sub a:hover{background:var(--at-surface-2);color:var(--at-ink)}

/* Mega meni */
.at-nav__item--mega{position:static}
.at-mega{position:absolute;left:0;right:0;top:100%;z-index:var(--at-z-dropdown);opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity var(--at-d-base) var(--at-ease-out),transform var(--at-d-base) var(--at-ease-out),visibility 0s linear var(--at-d-base)}
.at-nav__item.is-open > .at-mega{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.at-mega__panel{background:var(--at-surface);border:1px solid var(--at-line);border-top:0;border-radius:0 0 var(--at-radius-lg) var(--at-radius-lg);box-shadow:var(--at-shadow-md);padding:var(--at-s-7) var(--at-s-7) var(--at-s-6);display:grid;grid-template-columns:repeat(12,1fr);gap:var(--at-gap)}
.at-mega__cols{grid-column:span 7;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:var(--at-s-6)}
.at-mega__title{display:block;font-size:var(--at-fs-micro);font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--at-muted);margin-bottom:var(--at-s-3)}
.at-mega__title a{color:var(--at-ink)}
.at-mega__title a:hover{color:var(--at-accent)}
.at-mega__list a{display:block;padding:6px 0;font-size:.9375rem;color:var(--at-ink-2);transition:color var(--at-d-base) var(--at-ease-out),transform var(--at-d-base) var(--at-ease-out)}
.at-mega__list a:hover{color:var(--at-ink);transform:translateX(3px)}
.at-mega__all{margin-top:var(--at-s-4);display:inline-flex;align-items:center;gap:6px;font-size:var(--at-fs-small);font-weight:600;color:var(--at-accent)}
.at-mega__all svg{width:16px;height:16px;transition:transform var(--at-d-base) var(--at-ease-out)}
.at-mega__all:hover svg{transform:translateX(4px)}
.at-mega__feature{grid-column:span 5;display:grid;grid-template-columns:1fr 1fr;gap:var(--at-gap)}
.at-mega__card{display:block;position:relative;border-radius:var(--at-radius-md);overflow:hidden;background:var(--at-surface-2);aspect-ratio:var(--at-img-ratio-card)}
.at-mega__card img{width:100%;height:100%;object-fit:cover;transition:transform var(--at-d-slow) var(--at-ease-out)}
.at-mega__card:hover img{transform:scale(1.03)}
.at-mega__card span{position:absolute;left:var(--at-s-4);right:var(--at-s-4);bottom:var(--at-s-4);padding:6px 10px;background:color-mix(in srgb,var(--at-surface) 86%,transparent);backdrop-filter:blur(8px);border-radius:var(--at-radius-sm);font-size:var(--at-fs-small);font-weight:600;color:var(--at-ink)}
.at-mega__count{color:var(--at-muted);font-weight:400;font-variant-numeric:tabular-nums}

/* Akcije */
.at-header__actions{display:flex;align-items:center;gap:var(--at-s-1);justify-self:end}
.at-header__cta{margin-left:var(--at-s-3)}
.at-header__badge{position:absolute;top:6px;right:4px;min-width:18px;height:18px;padding:0 5px;border-radius:var(--at-radius-pill);background:var(--at-accent);color:var(--at-accent-ink);font-size:11px;font-weight:700;font-variant-numeric:tabular-nums;display:grid;place-content:center;line-height:1;transition:transform var(--at-d-slow) var(--at-ease-spring)}
.at-header__badge:empty,.at-header__badge[data-count="0"]{display:none}
.at-header__badge.is-bump{transform:scale(1.3)}

/* Hover dropdown nalog / mini korpa - samo desktop sa mišem; mobilni = link / bočna korpa */
.at-hmenu{position:relative;display:flex}
.at-hmenu__panel{display:none}
@media (hover:hover) and (min-width:64em){
  .at-hmenu__panel{display:grid;gap:var(--at-s-2);position:absolute;right:0;top:calc(100% + var(--at-s-2));z-index:var(--at-z-dropdown);min-width:220px;padding:var(--at-s-4);background:var(--at-surface);border:1px solid var(--at-line);border-radius:var(--at-radius-md);box-shadow:var(--at-shadow-md);opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity var(--at-d-base) var(--at-ease-out),transform var(--at-d-base) var(--at-ease-out),visibility 0s linear var(--at-d-base)}
  .at-hmenu__panel::before{content:"";position:absolute;left:0;right:0;bottom:100%;height:var(--at-s-3)}
  .at-hmenu:hover .at-hmenu__panel,.at-hmenu:has(:focus-visible) .at-hmenu__panel{opacity:1;visibility:visible;transform:none;transition-delay:0s}
}
.at-hmenu__name{margin:0 0 var(--at-s-1);padding-bottom:var(--at-s-2);border-bottom:1px solid var(--at-line);font-weight:600;color:var(--at-ink)}
.at-hmenu__link{display:block;padding:6px var(--at-s-2);margin:0 calc(-1 * var(--at-s-2));border-radius:var(--at-radius-sm);font-size:var(--at-fs-small);color:var(--at-ink-2)}
.at-hmenu__link:hover{background:var(--at-surface-2);color:var(--at-ink)}
.at-minicart{width:360px;gap:0;padding:var(--at-s-2) var(--at-s-4) var(--at-s-4)}
.at-minicart__items{max-height:min(50vh,340px);overflow-y:auto;overscroll-behavior:contain}
.at-minicart__item{display:grid;grid-template-columns:48px minmax(0,1fr) auto;grid-template-rows:auto auto;column-gap:var(--at-s-3);align-items:center;padding:var(--at-s-3) 0;border-bottom:1px solid var(--at-line)}
.at-minicart__img{grid-row:1/3;width:48px;height:48px;border-radius:var(--at-radius-sm);overflow:hidden;background:var(--at-surface-2)}
.at-minicart__img img{width:100%;height:100%;object-fit:cover}
.at-minicart__name{font-size:var(--at-fs-small);font-weight:500;color:var(--at-ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-self:end}
.at-minicart__name a{color:inherit}
.at-minicart__name a:hover{color:var(--at-accent)}
.at-minicart__qty{grid-column:2;font-size:var(--at-fs-micro);color:var(--at-muted);align-self:start}
.at-minicart__price{grid-column:3;grid-row:1/3;font-family:var(--at-font-display);font-weight:600;font-size:var(--at-fs-small);font-variant-numeric:tabular-nums;color:var(--at-ink)}
.at-minicart__empty{margin:var(--at-s-3) 0 0;font-size:var(--at-fs-small);color:var(--at-muted)}
.at-minicart__foot{display:grid;gap:var(--at-s-3);padding-top:var(--at-s-3)}
.at-minicart__foot[hidden],.at-minicart__empty[hidden]{display:none}
.at-minicart__total{margin:0;display:flex;justify-content:space-between;font-size:var(--at-fs-small);color:var(--at-muted)}
.at-minicart__total b{font-family:var(--at-font-display);font-size:var(--at-fs-body);color:var(--at-ink);font-variant-numeric:tabular-nums}
.at-shop-off .at-hmenu,body[data-shop="off"] .at-hmenu,.at-shop-off .at-drawer__shop,body[data-shop="off"] .at-drawer__shop{display:none}
.at-header__cta{display:none}
.at-shop-off .at-header__cta,body[data-shop="off"] .at-header__cta{display:inline-flex}
@media (max-width:47.99em){.at-header__cta{display:none}}
.at-header__burger{display:inline-flex}
@media (min-width:64em){.at-header__burger{display:none}.at-header--minimal .at-header__burger{display:inline-flex}}
.at-header__menu-label{display:none;font-size:var(--at-fs-small);font-weight:600;margin-right:6px}
@media (min-width:64em){.at-header--minimal .at-header__menu-label{display:inline}}
.at-header--minimal .at-header__burger{width:auto;padding:0 var(--at-s-3)}
.at-burger{position:relative;width:22px;height:14px;display:block}
.at-burger span{position:absolute;left:0;width:100%;height:1.5px;background:currentColor;border-radius:2px;transition:transform var(--at-d-slow) var(--at-ease-in-out),opacity var(--at-d-base) var(--at-ease-out),width var(--at-d-slow) var(--at-ease-out)}
.at-burger span:nth-child(1){top:0}.at-burger span:nth-child(2){top:6px;width:70%}.at-burger span:nth-child(3){top:12px}
.at-icon-btn:hover .at-burger span:nth-child(2){width:100%}

/* Pretraga - ikona širi partial shop/partials/search (.at-suggest, kompaktan) inline; panel predloga ide ispod polja */
.at-search{position:relative;display:flex;align-items:center}
.at-search .at-suggest{width:0;opacity:0;visibility:hidden;transition:width var(--at-d-slow) var(--at-ease-out),opacity var(--at-d-base) var(--at-ease-out),visibility 0s linear var(--at-d-slow)}
.at-search .at-suggest__input{min-width:0}
.at-search.is-open .at-suggest{width:min(320px,50vw);opacity:1;visibility:visible;transition-delay:0s}
/* Polje je apsolutno (levo od ikone, preko nav-a) - ništa u headeru se ne pomera */
@media (min-width:48em){.at-search .at-suggest{position:absolute;right:calc(100% + var(--at-s-2));top:50%;translate:0 -50%}}
@media (max-width:47.99em){
  .at-header__actions{position:relative}
  .at-search{position:static}
  .at-search.is-open .at-suggest{position:absolute;right:0;top:calc(100% + 4px);width:calc(100vw - 2*var(--at-gutter));margin:0;background:var(--at-surface);padding:var(--at-s-2);border:1px solid var(--at-line);border-radius:var(--at-radius-md);box-shadow:var(--at-shadow-sm)}
  .at-search .at-suggest--compact .at-suggest__panel{left:0;right:0;min-width:0}
}

/* Overlay varijanta (minimal preko hero-a) */
.at-header--minimal.at-header--overlay{background:transparent;border-color:transparent;color:var(--at-panel-ink)}
.at-header--minimal.at-header--overlay .at-header__logo,.at-header--minimal.at-header--overlay .at-icon-btn{color:var(--at-panel-ink)}
.at-header--minimal.at-header--overlay .at-icon-btn:hover{background:rgba(255,255,255,.12)}
.at-header--minimal.is-scrolled:not(.at-header--overlay){background:color-mix(in srgb,var(--at-bg) 86%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}

/* ===== Drawer (generički) + mobilni meni ===== */
.at-overlay{position:fixed;inset:0;z-index:calc(var(--at-z-drawer) - 1);background:color-mix(in srgb,var(--at-overlay) 55%,transparent);backdrop-filter:blur(14px) saturate(1.4);-webkit-backdrop-filter:blur(14px) saturate(1.4);opacity:0;visibility:hidden;transition:opacity var(--at-d-slow) var(--at-ease-out),visibility 0s linear var(--at-d-slow)}
.at-overlay.is-open{opacity:1;visibility:visible;transition-delay:0s}
.at-drawer{position:fixed;top:0;right:0;bottom:0;z-index:var(--at-z-drawer);width:100%;max-width:100%;background:var(--at-bg);display:flex;flex-direction:column;transform:translateX(100%);visibility:hidden;transition:transform 240ms var(--at-ease-in),visibility 0s linear 240ms;overscroll-behavior:contain}
@media (min-width:40em){.at-drawer{width:400px;box-shadow:var(--at-shadow-lg)}}
.at-drawer.is-open{transform:none;visibility:visible;transition:transform var(--at-d-slow) var(--at-ease-out),visibility 0s}
.at-drawer__head{display:flex;align-items:center;justify-content:space-between;height:var(--at-header-h);padding:0 var(--at-s-5);border-bottom:1px solid var(--at-line);flex:none}
.at-drawer__body{flex:1;overflow-y:auto;padding:var(--at-s-5)}
.at-drawer__body > * + *{margin-top:var(--at-s-6)}
.js .at-drawer [data-stagger]{opacity:0;transform:translateX(16px);transition:opacity var(--at-d-slow) var(--at-ease-out),transform var(--at-d-slow) var(--at-ease-out);transition-delay:calc(var(--i,0) * 40ms)}
.js .at-drawer.is-open [data-stagger]{opacity:1;transform:none}
.at-drawer__search{display:flex;gap:var(--at-s-2)}
.at-drawer__search input{flex:1;height:var(--at-input-h);padding:0 14px;border:1px solid var(--at-line-strong);border-radius:var(--at-radius-sm);background:var(--at-surface)}
.at-drawer__search input:focus{outline:none;border-color:var(--at-accent);box-shadow:var(--at-ring)}
.at-drawer__search button{width:var(--at-input-h);height:var(--at-input-h);border-radius:var(--at-radius-sm);background:var(--at-ink);color:var(--at-bg);display:grid;place-content:center}
.at-drawer__search button svg{width:20px;height:20px}
.at-mnav__item{border-bottom:1px solid var(--at-line)}
.at-mnav__row{display:flex;align-items:center}
.at-mnav__link{flex:1;display:block;padding:14px 0;font-family:var(--at-font-display);font-weight:var(--at-display-weight);font-size:1.5rem;letter-spacing:-.02em;color:var(--at-ink)}
.at-mnav__toggle{width:44px;height:44px;display:grid;place-content:center;color:var(--at-muted);border-radius:var(--at-radius-sm)}
.at-mnav__toggle svg{width:20px;height:20px;transition:transform var(--at-d-slow) var(--at-ease-out)}
.at-mnav__toggle[aria-expanded="true"] svg{transform:rotate(45deg)}
.at-mnav__sub{display:grid;grid-template-rows:0fr;transition:grid-template-rows var(--at-d-slow) var(--at-ease-out)}
.at-mnav__sub > div{overflow:hidden;min-height:0}
.at-mnav__item.is-open .at-mnav__sub{grid-template-rows:1fr}
.at-mnav__sub ul{padding:0 0 var(--at-s-4) var(--at-s-2)}
.at-mnav__sub a{display:block;padding:8px 0;font-size:1rem;color:var(--at-ink-2)}
.at-mnav__sub ul ul{padding:0 0 var(--at-s-2) var(--at-s-4)}
.at-mnav__sub ul ul a{font-size:var(--at-fs-small);color:var(--at-muted)}
.at-drawer__links{display:grid;gap:var(--at-s-2)}
.at-drawer__links a{display:flex;align-items:center;gap:var(--at-s-3);padding:10px 0;font-weight:500;color:var(--at-ink-2)}
.at-drawer__links svg{width:20px;height:20px;color:var(--at-muted)}
.at-drawer__contact{display:grid;gap:6px;font-size:var(--at-fs-small);color:var(--at-muted)}
.at-drawer__contact a{color:var(--at-ink);font-weight:500}
.at-drawer__foot{padding:var(--at-s-4) var(--at-s-5);border-top:1px solid var(--at-line);flex:none;display:flex;align-items:center;justify-content:space-between}

/* Full-screen meni (minimal header) */
.at-drawer--full{width:100%;max-width:none;box-shadow:none}
@media (min-width:64em){
  .at-drawer--full .at-drawer__body{display:grid;grid-template-columns:1fr 1fr;gap:var(--at-s-8);padding:var(--at-s-8) var(--at-gutter);width:min(100%,var(--at-container));margin-inline:auto}
  .at-drawer--full .at-drawer__body > * + *{margin-top:0}
  .at-drawer--full .at-mnav__link{font-size:2.5rem}
  .at-drawer--full .at-drawer__search{grid-column:1;order:-1}
  .at-drawer--full .at-drawer__feature{grid-column:2;grid-row:1/span 4;align-self:start;position:sticky;top:0}
  .at-drawer--full .at-drawer__feature .at-media{aspect-ratio:4/5;max-height:70vh}
}
.at-drawer__feature{display:none}
@media (min-width:64em){.at-drawer--full .at-drawer__feature{display:block}}