/* ========================================================================
   AKREI V18 — Final Catalog State, Header & Mobile Polish
   Loaded last. Resolves residual visual states without changing SellAuth logic.
   ======================================================================== */

/* Hidden must always win over component display declarations. */
.ak-v12-empty[hidden],
[data-v12-empty][hidden],
.ak-product-grid-item[hidden],
[data-ak-grid-product][hidden]{display:none!important}
.ak-v12-empty:not(.is-visible){display:none!important}
.ak-v12-empty.is-visible{display:grid!important}

/* Never render the empty-state as a permanent catalog section. */
.ak-v12-empty{min-height:220px;margin:20px 0 0!important}

/* Remove the one-pixel inactive navigation marker caused by fractional layout. */
.ak-nav-link::after{
  left:50%!important;
  right:auto!important;
  width:0!important;
  opacity:0!important;
  transform:translateX(-50%)!important;
  transition:width .2s ease,opacity .2s ease,background .2s ease!important;
}
.ak-nav-link:hover::after{width:10px!important;opacity:.32!important}
.ak-nav-link.is-active::after{width:26px!important;opacity:1!important}

/* V15 desktop Discord slab is intentionally retired: the announcement is the
   single desktop Discord CTA; mobile keeps its dedicated menu card. */
.ak-v15-discord-banner{display:none!important}

/* Premium, compact Discord community ribbon in the announcement bar. */
.ak-announcement{margin-bottom:10px!important}
.ak-announcement-inner{
  min-height:40px!important;
  grid-template-columns:32px minmax(0,1fr) auto!important;
  gap:10px!important;
  padding:4px 8px!important;
  border-color:rgba(88,101,242,.22)!important;
  background:
    radial-gradient(circle at 50% 140%,rgba(88,101,242,.17),transparent 48%),
    linear-gradient(90deg,rgba(88,101,242,.055),rgba(var(--cl-card),.92) 32%,rgba(var(--cl-card),.96))!important;
  box-shadow:inset 0 1px rgba(255,255,255,.055),0 10px 34px rgba(0,0,0,.12)!important;
}
.ak-announcement-icon{
  width:30px!important;height:30px!important;border-radius:10px!important;
  color:#fff!important;background:linear-gradient(145deg,#5865f2,#8068ff)!important;
  box-shadow:0 0 0 4px rgba(88,101,242,.09),0 7px 18px rgba(88,101,242,.23)!important;
}
.ak-announcement-icon svg{display:none!important}
.ak-announcement-icon::before{content:"\f392";font-family:"Font Awesome 6 Brands";font-size:14px;font-weight:400}
.ak-announcement-content{min-width:0!important;text-align:center!important}
.ak-announcement-link[href*="discord"]{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;
  max-width:100%;color:rgba(var(--cl-t-primary),.92)!important;font-size:10px!important;font-weight:800!important;
  letter-spacing:-.01em;text-decoration:none!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.ak-announcement-link[href*="discord"]::before{
  content:""!important;width:7px!important;height:7px!important;flex:none;border-radius:50%!important;
  background:#34d98b!important;box-shadow:0 0 0 4px rgba(52,217,139,.10),0 0 14px rgba(52,217,139,.45)!important;
}
.ak-announcement-link[href*="discord"] svg{width:9px!important;height:9px!important;opacity:.55}
.ak-announcement-label{
  min-width:auto!important;padding:5px 9px!important;border:1px solid rgba(88,101,242,.16)!important;
  border-radius:999px!important;color:rgba(var(--cl-t-primary),.5)!important;background:rgba(88,101,242,.055)!important;
  font-size:7px!important;font-weight:850!important;letter-spacing:.09em!important;
}

/* Header rhythm after removing the redundant second Discord row. */
.ak-navbar{border-radius:20px!important}
.ak-header+.ak-final-store,.ak-header+main{margin-top:0}

/* Catalog controller: cleaner separation from products and dependable clipping. */
.ak-v12-command{isolation:isolate!important}
.ak-v12-filter-panel{isolation:isolate!important}
.ak-v12-filter-grid{isolation:isolate!important}
.ak-v12-field{isolation:isolate!important}
.ak-v12-field.is-open{z-index:250!important}
.ak-v12-menu{z-index:9999!important}
.ak-final-catalog-head{position:relative;z-index:1}

/* Empty state is compact on phones and never creates a false giant gap. */
@media(max-width:900px){
  .ak-v12-empty{min-height:170px!important;padding:28px 16px!important;border-radius:18px!important}
  .ak-announcement-inner{grid-template-columns:30px minmax(0,1fr)!important}
  .ak-announcement-label{display:none!important}
  .ak-announcement-content{text-align:left!important}
  .ak-announcement-link[href*="discord"]{justify-content:flex-start!important;font-size:9px!important}

  /* Mobile menu Discord card: compact, balanced, no duplicate desktop slab. */
  .ak-v14-discord-cta-mobile{
    min-height:54px!important;margin:0 0 9px!important;padding:7px 10px!important;border-radius:15px!important;
    background:linear-gradient(135deg,rgba(88,101,242,.18),rgba(124,92,255,.08))!important;
  }
  .ak-v14-discord-icon{width:36px!important;height:36px!important;border-radius:12px!important}
  .ak-v14-discord-copy strong{font-size:11px!important}

  /* Prevent horizontal bleed and keep every store section inside the viewport. */
  .ak-products-section,.ak-final-store,.ak-v12-command,.ak-final-catalog-head,.ak-product-grid,.ak-final-benefits{
    width:100%!important;max-width:100%!important;min-width:0!important
  }
  .ak-product-grid-item,.ak-v7-product-card,.ak-v7-card-body,.ak-v7-card-visual{min-width:0!important;max-width:100%!important}
}

@media(max-width:600px){
  .ak-announcement{margin-bottom:7px!important}
  .ak-announcement-inner{min-height:39px!important;padding:4px 7px!important;border-radius:13px!important}
  .ak-announcement-icon{width:29px!important;height:29px!important}
  .ak-announcement-link[href*="discord"]::before{width:6px!important;height:6px!important}

  /* Refine the catalog header/card transition on narrow iPhones. */
  .ak-final-catalog-head{gap:12px!important;margin-top:18px!important;margin-bottom:12px!important}
  .ak-final-catalog-head h2{font-size:clamp(25px,7vw,31px)!important}
  .ak-final-catalog-head p{font-size:12px!important;line-height:1.55!important}
  .ak-v12-empty{min-height:150px!important;margin-top:12px!important}
  .ak-final-benefits{margin-top:16px!important}
}

/* White theme retains contrast without grey overlays. */
html[data-ak-theme="light"] .ak-announcement-inner{
  border-color:rgba(88,101,242,.15)!important;
  background:linear-gradient(90deg,rgba(88,101,242,.075),rgba(255,255,255,.985) 34%,rgba(250,251,253,.985))!important;
}
html[data-ak-theme="light"] .ak-announcement-link[href*="discord"]{color:#20232b!important}
html[data-ak-theme="light"] .ak-announcement-label{color:#5d6370!important;background:rgba(88,101,242,.05)!important}

@media(prefers-reduced-motion:reduce){
  .ak-nav-link::after,.ak-announcement-inner,.ak-announcement-icon{transition:none!important;animation:none!important}
}