/*
 * TechStore Premium Storefront
 * Single override layer for the existing Django storefront.
 * Keeps the current templates, routes and JS contracts intact.
 */

:root{
  --ts-blue:var(--primary,#0071e3);
  --ts-blue-hover:var(--primary-2,#0077ed);
  --ts-bg:#f5f5f7;
  --ts-surface:#ffffff;
  --ts-surface-soft:#fbfbfd;
  --ts-text:#1d1d1f;
  --ts-muted:#6e6e73;
  --ts-line:rgba(0,0,0,.08);
  --ts-line-strong:rgba(0,0,0,.14);
  --ts-shadow:0 18px 60px rgba(0,0,0,.08);
  --ts-shadow-soft:0 8px 30px rgba(0,0,0,.055);
  --ts-radius-xl:32px;
  --ts-radius-lg:24px;
  --ts-radius-md:18px;
  --ts-radius-sm:12px;
  --ts-header-h:64px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  background:var(--ts-bg);
  color:var(--ts-text);
  font-feature-settings:"ss01" 1,"kern" 1;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
body:not(.dark){
  --ts-bg:#f5f5f7;
  --ts-surface:#fff;
  --ts-surface-soft:#fbfbfd;
  --ts-text:#1d1d1f;
  --ts-muted:#6e6e73;
  --ts-line:rgba(0,0,0,.08);
  --ts-line-strong:rgba(0,0,0,.14);
  --ts-shadow:0 18px 60px rgba(0,0,0,.08);
  --ts-shadow-soft:0 8px 30px rgba(0,0,0,.055);
}
body.dark{
  --ts-bg:#000;
  --ts-surface:#111113;
  --ts-surface-soft:#17171a;
  --ts-text:#f5f5f7;
  --ts-muted:#a1a1a6;
  --ts-line:rgba(255,255,255,.10);
  --ts-line-strong:rgba(255,255,255,.18);
  --ts-shadow:0 20px 70px rgba(0,0,0,.36);
  --ts-shadow-soft:0 8px 30px rgba(0,0,0,.24);
  background:#000;
  color:var(--ts-text);
}

::selection{background:rgba(0,113,227,.18)}
a{transition:color .2s ease,opacity .2s ease,background-color .2s ease,border-color .2s ease,transform .2s ease,box-shadow .2s ease}
button,input,select,textarea{font:inherit}
img{max-width:100%}
.container{width:min(1220px,calc(100% - 40px));margin-inline:auto}
.page-body{min-height:60vh}
.home-page-body{padding-top:0!important}
.home-page-shell{margin-top:0}
.page-body:has(.home-page-shell){padding-top:0!important}

/* Header */
.header{
  position:sticky;
  top:0;
  z-index:1200;
  min-height:var(--ts-header-h);
  border-bottom:1px solid var(--ts-line);
  background:color-mix(in srgb,var(--ts-surface) 82%,transparent);
  backdrop-filter:saturate(180%) blur(22px);
  -webkit-backdrop-filter:saturate(180%) blur(22px);
  box-shadow:none!important;
}
.header .header-top-row{
  min-height:var(--ts-header-h);
  display:grid;
  grid-template-columns:auto minmax(0,1fr) minmax(340px,430px) auto;
  gap:12px;
  align-items:center;
}
.logo{
  color:var(--ts-text)!important;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  gap:9px;
  font-size:.92rem;
  font-weight:720;
  letter-spacing:-.03em;
  white-space:nowrap;
}
.logo-img{max-height:34px;width:auto}
.header-navbar{min-width:0}
.header nav>ul{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:4px!important;
  margin:0;
  padding:0;
  list-style:none;
}
.header nav>ul>li>a,
.nav-dropdown-toggle,
.nav-theme-btn{
  min-height:34px;
  padding:0 10px!important;
  border-radius:999px!important;
  display:inline-flex!important;
  align-items:center;
  gap:6px;
  border:0!important;
  background:transparent!important;
  color:var(--ts-text)!important;
  font-size:.70rem!important;
  font-weight:540!important;
  text-decoration:none;
  white-space:nowrap;
}
.header nav>ul>li>a:hover,
.nav-dropdown-toggle:hover,
.nav-theme-btn:hover{
  background:color-mix(in srgb,var(--ts-text) 6%,transparent)!important;
}
.nav-dropdown-arrow{font-size:.56rem;opacity:.48}
.nav-dropdown{
  border:1px solid var(--ts-line)!important;
  border-radius:22px!important;
  background:color-mix(in srgb,var(--ts-surface) 94%,transparent)!important;
  backdrop-filter:blur(26px);
  -webkit-backdrop-filter:blur(26px);
  box-shadow:0 26px 70px rgba(0,0,0,.14)!important;
  overflow:hidden;
}
.nav-mega{padding:18px!important}
.nav-mega-head{color:var(--ts-muted)!important}
.nav-mega-col-title,
.nav-mega-col-link,
.nav-dropdown-all{color:var(--ts-text)!important}
.nav-mega-sub a{color:var(--ts-muted)!important}
.nav-mega-sub a:hover{color:var(--ts-blue)!important}

.header-search{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  min-width:0;
}
.search-form{
  width:100%;
  min-width:0;
  min-height:40px;
  display:flex;
  align-items:center;
  gap:9px;
  padding:4px 5px 4px 12px;
  border:1px solid color-mix(in srgb,var(--ts-line-strong) 72%,transparent);
  border-radius:16px;
  background:color-mix(in srgb,var(--ts-text) 4%,transparent);
  overflow:hidden;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
  transition:border-color .2s ease,box-shadow .2s ease,background .2s ease,transform .2s ease;
}
.search-form:focus-within{
  border-color:rgba(0,113,227,.42);
  background:color-mix(in srgb,var(--ts-surface) 94%,transparent);
  box-shadow:0 0 0 3px rgba(0,113,227,.08),0 8px 28px rgba(0,0,0,.08);
}
.header-search-icon{
  flex:0 0 auto;
  color:var(--ts-muted);
  font-size:.74rem;
  opacity:.78;
}
.search-form input{
  flex:1 1 auto;
  width:100%;
  min-width:0;
  min-height:30px!important;
  padding:0!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  color:var(--ts-text)!important;
  font-size:.76rem!important;
}
.search-form input::placeholder{color:var(--ts-muted);opacity:.78}
.header-search-submit{
  flex:0 0 auto;
  width:30px;
  height:30px;
  border:0;
  border-radius:11px;
  display:grid;
  place-items:center;
  background:rgba(0,113,227,.13);
  color:var(--ts-blue);
  cursor:pointer;
  font-size:.62rem;
  transition:background .2s ease,color .2s ease,transform .2s ease;
}
.header-search-submit:hover{
  background:var(--ts-blue);
  color:#fff;
  transform:translateX(-1px);
}
.search-toggle{display:none!important}

/* Header search hard reset: home.css used a higher-specificity collapsed search. */
@media (min-width:901px){
  .header .header-search{
    position:relative!important;
    display:flex!important;
    width:auto!important;
    min-width:340px!important;
    max-width:430px!important;
    height:auto!important;
    justify-self:stretch!important;
    flex-shrink:1!important;
  }
  .header .header-search .search-form,
  .header .header-search.is-open .search-form{
    position:relative!important;
    inset:auto!important;
    top:auto!important;
    right:auto!important;
    left:auto!important;
    transform:none!important;
    display:flex!important;
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    min-height:40px!important;
    padding:4px 5px 4px 12px!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    overflow:hidden!important;
    transition:border-color .2s ease,box-shadow .2s ease,background .2s ease,transform .2s ease!important;
  }
  .header .header-search .search-form:focus-within{
    transform:translateY(-1px)!important;
    box-shadow:0 0 0 3px rgba(0,113,227,.08),0 10px 30px rgba(0,0,0,.10)!important;
  }
  .header .header-search .search-toggle{
    display:none!important;
  }
}

/* Keep desktop navigation deliberately compact even over legacy home.css rules. */
@media (min-width:901px){
  .header .header-navbar nav > ul > li > a,
  .header .header-navbar .nav-dropdown-toggle,
  .header .header-navbar .nav-theme-btn{
    min-height:30px!important;
    padding:0 8px!important;
    gap:5px!important;
    font-size:10px!important;
    line-height:1!important;
    font-weight:520!important;
  }
  .header .header-navbar .nav-dropdown-arrow{
    font-size:8px!important;
  }
  .header .logo{
    font-size:.84rem!important;
  }
  .header .logo-img{
    max-height:30px!important;
  }
}

.actions{display:flex;align-items:center;gap:4px}
.actions>a,
.actions>button,
.cart-action,
.theme-toggle,
.bell-btn{
  width:34px!important;
  height:34px!important;
  min-width:34px!important;
  padding:0!important;
  border:1px solid transparent!important;
  border-radius:999px!important;
  display:grid!important;
  place-items:center!important;
  background:transparent!important;
  color:var(--ts-text)!important;
  text-decoration:none!important;
}
.actions>a:hover,
.actions>button:hover,
.cart-action:hover,
.theme-toggle:hover{
  background:color-mix(in srgb,var(--ts-text) 6%,transparent)!important;
}
.actions .login-nav-btn,
.actions .register-btn,
.actions .admin-nav-btn{
  width:auto!important;
  min-width:34px!important;
  padding-inline:10px!important;
  display:inline-flex!important;
  gap:7px;
}
.actions .register-btn{
  background:var(--ts-blue)!important;
  color:#fff!important;
}
.actions .register-btn:hover{background:var(--ts-blue-hover)!important}
.cart-count-badge,.wishlist-count-badge,.mb-cart-badge{
  border:2px solid var(--ts-surface)!important;
  background:#ff3b30!important;
  color:#fff!important;
}
.mobile-nav-head{border-bottom:1px solid var(--ts-line)}
.mobile-nav-title{color:var(--ts-text)}
.mobile-nav-close{color:var(--ts-text)!important}

/* Buttons / forms */
.btn,
.apple-btn{
  min-height:44px;
  border-radius:999px!important;
  padding:0 20px!important;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  font-weight:650;
  border:1px solid transparent;
  text-decoration:none;
  transition:.2s ease;
}
.btn-primary,
.apple-btn-primary{
  background:var(--ts-blue)!important;
  border-color:var(--ts-blue)!important;
  color:#fff!important;
  box-shadow:none!important;
}
.btn-primary:hover,
.apple-btn-primary:hover{
  background:var(--ts-blue-hover)!important;
  border-color:var(--ts-blue-hover)!important;
  transform:translateY(-1px);
}
.btn-outline{
  border-color:var(--ts-line-strong)!important;
  background:var(--ts-surface)!important;
  color:var(--ts-text)!important;
}
.btn-outline:hover{
  border-color:var(--ts-text)!important;
  background:var(--ts-surface-soft)!important;
}
.btn-green{border-radius:999px!important}
.btn-sm,.btn-sm-inline{min-height:34px!important;border-radius:999px!important;padding-inline:13px!important}
.form-control,
.auth-form input,
.auth-form select,
.auth-form textarea{
  min-height:48px;
  border:1px solid var(--ts-line-strong)!important;
  border-radius:14px!important;
  background:var(--ts-surface)!important;
  color:var(--ts-text)!important;
  box-shadow:none!important;
  outline:none!important;
  transition:border-color .2s ease,box-shadow .2s ease;
}
.form-control:focus,
.auth-form input:focus,
.auth-form select:focus,
.auth-form textarea:focus{
  border-color:rgba(0,113,227,.55)!important;
  box-shadow:0 0 0 4px rgba(0,113,227,.10)!important;
}
.form-group label{color:var(--ts-text)}
.field-help,.muted,.auth-hint{color:var(--ts-muted)!important}

/* Homepage hero */
.apple-hero{
  position:relative;
  padding:clamp(64px,7.5vw,116px) 0 clamp(56px,7vw,102px)!important;
  overflow:hidden;
  background:
    radial-gradient(circle at 75% 20%,rgba(0,113,227,.10),transparent 27%),
    linear-gradient(180deg,var(--ts-surface) 0%,var(--ts-bg) 100%);
}
.apple-hero::after{
  content:"";
  position:absolute;
  inset:auto -10% -45% 30%;
  height:70%;
  background:radial-gradient(circle,rgba(126,87,255,.10),transparent 65%);
  pointer-events:none;
}
.apple-hero-layout{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0,.86fr) minmax(480px,1.14fr);
  align-items:center;
  gap:clamp(36px,6vw,88px);
}
.apple-hero-copy{max-width:580px}
.apple-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:9px;
  margin-bottom:22px;
  color:var(--ts-muted);
  font-size:.8rem;
  font-weight:650;
}
.apple-eyebrow-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--ts-blue);
  box-shadow:0 0 0 5px rgba(0,113,227,.10);
}
.apple-display-title{
  margin:0;
  color:var(--ts-text);
  font-size:clamp(3rem,5.6vw,5.75rem);
  line-height:.98;
  font-weight:800;
  letter-spacing:-.065em;
  text-wrap:balance;
}
.apple-display-subtitle{
  max-width:540px;
  margin:26px 0 0;
  color:var(--ts-muted);
  font-size:clamp(1rem,1.35vw,1.28rem);
  line-height:1.9;
}
.apple-hero-actions{display:flex;align-items:center;gap:18px;margin-top:32px;flex-wrap:wrap}
.apple-link-btn{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:var(--ts-blue);
  text-decoration:none;
  font-weight:650;
}
.apple-link-btn:hover{gap:12px}
.apple-hero-proof{
  display:flex;
  align-items:stretch;
  gap:0;
  margin-top:40px;
  padding-top:24px;
  border-top:1px solid var(--ts-line);
}
.apple-hero-proof>div{
  min-width:0;
  padding-inline:18px;
  border-inline-start:1px solid var(--ts-line);
}
.apple-hero-proof>div:first-child{padding-inline-start:0;border-inline-start:0}
.apple-hero-proof strong{display:block;color:var(--ts-text);font-size:.92rem}
.apple-hero-proof span{display:block;margin-top:3px;color:var(--ts-muted);font-size:.72rem}

.apple-product-stage{
  position:relative;
  min-height:clamp(430px,42vw,610px);
  border:1px solid color-mix(in srgb,var(--ts-line-strong) 58%,transparent)!important;
  border-radius:30px!important;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 34%,rgba(0,113,227,.08),transparent 42%),
    linear-gradient(145deg,color-mix(in srgb,var(--ts-surface) 96%,transparent),color-mix(in srgb,var(--ts-surface-soft) 92%,transparent))!important;
  box-shadow:
    0 34px 95px rgba(0,0,0,.16),
    inset 0 1px 0 rgba(255,255,255,.04)!important;
  isolation:isolate;
}
.apple-product-stage::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 14% 12%,rgba(123,67,255,.10),transparent 24%),
    radial-gradient(circle at 86% 88%,rgba(0,113,227,.09),transparent 26%);
  z-index:0;
}
.hero-photo-slide{
  position:absolute;
  inset:0;
  z-index:1;
  display:grid;
  place-items:center;
  opacity:0;
  transform:scale(1.018);
  pointer-events:none;
  transition:opacity .5s ease,transform .7s cubic-bezier(.2,.7,.2,1);
}
.hero-photo-slide.active{opacity:1;transform:scale(1);pointer-events:auto}
.hero-product-showcase{
  position:relative;
  width:82%;
  height:86%;
}
.hero-product-media{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--ts-line-strong) 78%,transparent);
  border-radius:26px;
  background:
    radial-gradient(circle at 50% 22%,rgba(255,255,255,.99),rgba(246,247,250,.98) 74%),
    var(--ts-surface-soft);
  box-shadow:
    0 20px 50px rgba(0,0,0,.16),
    inset 0 1px 0 rgba(255,255,255,.72);
  transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s ease,border-color .35s ease;
}
.hero-product-media::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,transparent 54%,rgba(0,0,0,.05) 72%,rgba(0,0,0,.36) 100%);
  z-index:1;
}
body.dark .hero-product-media{
  background:
    radial-gradient(circle at 50% 20%,rgba(255,255,255,.09),rgba(255,255,255,.025) 72%),
    #151518;
}
body.dark .hero-product-media::after{
  background:linear-gradient(180deg,transparent 52%,rgba(0,0,0,.08) 68%,rgba(0,0,0,.58) 100%);
}
.hero-product-media:hover{
  transform:translateY(-3px) scale(1.006);
  border-color:rgba(0,113,227,.34);
  box-shadow:
    0 26px 64px rgba(0,0,0,.22),
    0 0 0 1px rgba(0,113,227,.06);
}
.hero-product-media img{
  position:relative;
  z-index:0;
  width:100%;
  height:100%;
  padding:clamp(20px,2.2vw,32px);
  object-fit:contain;
  display:block;
  border-radius:inherit;
  transition:transform .55s cubic-bezier(.2,.7,.2,1),filter .35s ease;
}
.hero-product-media:hover img{transform:scale(1.022)}
.hero-product-overlay{
  position:absolute;
  z-index:4;
  right:18px;
  left:18px;
  bottom:18px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-width:0;
  pointer-events:none;
}
.hero-product-title{
  min-width:0;
  max-width:62%;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  color:#fff;
  font-size:.80rem;
  font-weight:720;
  text-shadow:0 2px 16px rgba(0,0,0,.7);
}
.hero-product-view-btn{
  pointer-events:auto;
  flex:0 0 auto;
  min-height:36px;
  padding:0 15px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  border:1px solid rgba(255,255,255,.30);
  background:rgba(0,113,227,.92);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  color:#fff!important;
  text-decoration:none;
  font-size:.72rem;
  font-weight:750;
  box-shadow:0 10px 28px rgba(0,0,0,.24);
  transition:transform .2s ease,background .2s ease,box-shadow .2s ease;
}
.hero-product-view-btn:hover{
  transform:translateY(-2px);
  background:var(--ts-blue-hover);
  box-shadow:0 14px 34px rgba(0,0,0,.28);
}
.hero-product-view-btn i{font-size:.65rem;transition:transform .2s ease}
.hero-product-view-btn:hover i{transform:translateX(-3px)}
.apple-hero-static-art img{width:100%;height:100%;object-fit:cover}

.hero-photo-controls{
  position:absolute;
  inset:0;
  z-index:8;
  pointer-events:none;
}
.hero-photo-nav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  pointer-events:auto;
  width:38px;
  height:38px;
  border:1px solid rgba(255,255,255,.32);
  border-radius:999px;
  display:grid;
  place-items:center;
  background:rgba(15,15,18,.58);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  color:#fff;
  cursor:pointer;
  box-shadow:0 10px 30px rgba(0,0,0,.22);
  transition:transform .2s ease,background .2s ease,border-color .2s ease;
}
.hero-photo-nav:hover{
  background:rgba(0,113,227,.92);
  border-color:rgba(255,255,255,.45);
}
.hero-photo-nav--prev{right:calc(9% + 14px)}
.hero-photo-nav--next{left:calc(9% + 14px)}
.hero-photo-nav--prev:hover{transform:translateY(-50%) translateX(2px)}
.hero-photo-nav--next:hover{transform:translateY(-50%) translateX(-2px)}
.hero-photo-dots{
  position:absolute;
  top:calc(7% + 12px);
  left:50%;
  transform:translateX(-50%);
  display:flex;
  align-items:center;
  gap:7px;
  padding:7px 10px;
  border-radius:999px;
  background:rgba(15,15,18,.42);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  box-shadow:0 8px 24px rgba(0,0,0,.15);
  pointer-events:auto;
}
.hero-photo-dot{
  width:8px;
  height:8px;
  padding:0;
  border:0;
  border-radius:999px;
  background:rgba(255,255,255,.58);
  box-shadow:none;
  cursor:pointer;
  transition:transform .2s ease,background .2s ease,opacity .2s ease;
}
.hero-photo-dot:hover{background:#fff;transform:scale(1.16)}
.hero-photo-dot.active{
  width:8px;
  height:8px;
  background:var(--ts-blue);
  box-shadow:0 0 0 3px rgba(0,113,227,.18);
  transform:scale(1.12);
}

/* Technology worlds */
.apple-tech-worlds{
  padding:clamp(64px,7vw,104px) 0;
  background:var(--ts-bg);
}
.apple-section-head,
.section-head-row{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
  margin-bottom:28px;
}
.section-head-copy{min-width:0}
.section-kicker{
  display:block;
  margin-bottom:8px;
  color:var(--ts-blue)!important;
  font-size:.76rem!important;
  font-weight:750!important;
  letter-spacing:0;
}
.section-head-copy h2,
.apple-section-head h2{
  margin:0;
  color:var(--ts-text);
  font-size:clamp(1.75rem,3vw,3.15rem)!important;
  line-height:1.12;
  letter-spacing:-.045em;
}
.section-head-copy p{margin:9px 0 0;color:var(--ts-muted)}
.section-link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:var(--ts-blue)!important;
  text-decoration:none;
  font-size:.84rem;
  font-weight:650;
  white-space:nowrap;
}
.section-link:hover{gap:11px}

.tech-world-grid{
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:12px;
}

@media (min-width:901px){
  .tech-world-grid{
    grid-template-columns:minmax(0,520px) minmax(0,360px);
    justify-content:center;
    align-items:start;
    column-gap:12px;
  }
  .tech-world-card:first-child,
  .tech-world-card:nth-child(2){
    grid-column:auto;
  }
  .tech-world-card:nth-child(3){
    grid-column:1 / -1;
    width:100%;
    justify-self:center;
  }
  .tech-world-mobile{
    width:100%!important;
    justify-self:stretch!important;
  }
}
.tech-world-card{
  position:relative;
  min-height:510px;
  border-radius:var(--ts-radius-xl);
  overflow:hidden;
  text-decoration:none;
  isolation:isolate;
  background:#e9eef5;
  box-shadow:var(--ts-shadow-soft);
}
.tech-world-card:first-child{grid-column:span 7}
.tech-world-card:nth-child(2){grid-column:span 5}
.tech-world-card:nth-child(3){grid-column:1/-1;min-height:460px}
.tech-world-card img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .75s cubic-bezier(.2,.7,.2,1);
}
.tech-world-card:hover img{transform:scale(1.025)}

/* Mobile world: size the card around the portrait iPhone artwork. */
.tech-world-mobile{
  justify-self:end!important;
  align-self:start!important;
  width:min(100%,360px)!important;
  min-height:0!important;
  aspect-ratio:.72 / 1!important;
  background:transparent!important;
  box-shadow:0 22px 58px rgba(0,0,0,.18)!important;
}
.tech-world-mobile img{
  object-fit:cover!important;
  object-position:center center!important;
  width:100%!important;
  height:100%!important;
  inset:0!important;
  transform:none!important;
}
.tech-world-mobile:hover img{
  transform:scale(1.015)!important;
}
.tech-world-mobile .tech-world-copy{
  padding:22px!important;
}
.tech-world-mobile .tech-world-copy h3{
  font-size:clamp(1.35rem,2vw,2rem)!important;
  line-height:1.2!important;
}
.tech-world-mobile .tech-world-copy p{
  font-size:.76rem!important;
  line-height:1.65!important;
  margin:8px 0 12px!important;
}
.tech-world-mobile .tech-world-copy strong{
  font-size:.76rem!important;
}
body.dark .tech-world-mobile{
  background:transparent!important;
}

.tech-world-overlay{
  position:absolute;
  inset:0;
  z-index:1;
  background:linear-gradient(180deg,rgba(0,0,0,.02) 35%,rgba(0,0,0,.62) 100%);
}
.tech-world-copy{
  position:absolute;
  z-index:2;
  inset:auto 0 0;
  padding:32px;
  color:#fff;
}
.tech-world-copy>span{
  display:block;
  margin-bottom:8px;
  opacity:.78;
  font-size:.75rem;
  font-weight:700;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.tech-world-copy h3{
  margin:0;
  font-size:clamp(1.55rem,2.5vw,2.65rem);
  letter-spacing:-.04em;
}
.tech-world-copy p{max-width:480px;margin:10px 0 16px;color:rgba(255,255,255,.8);line-height:1.8}
.tech-world-copy strong{display:inline-flex;align-items:center;gap:8px;font-size:.83rem}
.tech-world-card:hover .tech-world-copy strong{gap:12px}

/* Categories */
.apple-categories,
.categories-section{
  padding:clamp(58px,6vw,92px) 0!important;
  background:var(--ts-surface)!important;
}
.category-mini-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:14px!important;
}
.category-mini-card{
  min-height:118px!important;
  padding:20px!important;
  border:1px solid var(--ts-line)!important;
  border-radius:var(--ts-radius-lg)!important;
  display:grid!important;
  grid-template-columns:44px 1fr auto!important;
  align-items:center!important;
  gap:13px!important;
  background:var(--ts-surface-soft)!important;
  color:var(--ts-text)!important;
  text-decoration:none!important;
  box-shadow:none!important;
  transition:.25s ease!important;
}
.category-mini-card:hover{
  transform:translateY(-3px)!important;
  border-color:rgba(0,113,227,.25)!important;
  box-shadow:var(--ts-shadow-soft)!important;
}
.category-mini-icon{
  width:44px;
  height:44px;
  border-radius:14px;
  display:grid;
  place-items:center;
  background:var(--ts-surface);
  color:var(--ts-blue);
  border:1px solid var(--ts-line);
}
.category-mini-copy{display:flex;flex-direction:column;gap:4px;min-width:0}
.category-mini-copy strong{color:var(--ts-text);font-size:.9rem!important}
.category-mini-copy>span{color:var(--ts-muted)!important;font-size:.72rem!important}
.category-mini-arrow{color:var(--ts-muted);font-size:.7rem;transition:transform .2s ease}
.category-mini-card:hover .category-mini-arrow{transform:translateX(-3px);color:var(--ts-blue)}

/* Product sections */
.product-rail-section,
.special-products,
.new-products-section,
.best-sellers-section{
  padding:clamp(58px,6vw,90px) 0!important;
  background:var(--ts-bg);
}
.product-rail-section:nth-of-type(even){background:var(--ts-surface)}
.products-scroll-wrap{
  position:relative;
  isolation:isolate;
}
.product-rail{
  display:flex!important;
  grid-template-columns:none!important;
  gap:16px!important;
  overflow-x:auto;
  overscroll-behavior-inline:contain;
  -webkit-overflow-scrolling:touch;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  scrollbar-width:none;
  padding:6px 48px 14px;
}
.product-rail::-webkit-scrollbar{display:none}
.product-rail>.product-card{
  flex:0 0 clamp(176px,17vw,214px);
  scroll-snap-align:start;
  scroll-snap-stop:always;
}

.rail-footer.rail-overlay-controls{
  position:absolute;
  inset:0;
  z-index:9;
  pointer-events:none;
  margin:0;
}
.rail-footer.rail-overlay-controls .scroll-btn{
  position:absolute!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  width:42px!important;
  height:42px!important;
  border:1px solid color-mix(in srgb,var(--section-accent,var(--ts-blue)) 35%,var(--ts-line))!important;
  border-radius:999px!important;
  display:grid!important;
  place-items:center!important;
  background:color-mix(in srgb,var(--ts-surface) 86%,transparent)!important;
  color:var(--ts-text)!important;
  cursor:pointer;
  pointer-events:auto;
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  box-shadow:0 10px 28px rgba(0,0,0,.16);
  transition:transform .2s ease,background .2s ease,border-color .2s ease,color .2s ease,box-shadow .2s ease;
}
.rail-footer.rail-overlay-controls .scroll-btn-prev{right:4px!important}
.rail-footer.rail-overlay-controls .scroll-btn-next{left:4px!important}
.rail-footer.rail-overlay-controls .scroll-btn:hover{
  color:#fff!important;
  border-color:transparent!important;
  background:linear-gradient(135deg,var(--section-accent,var(--ts-blue)),color-mix(in srgb,var(--section-accent,var(--ts-blue)) 72%,var(--ts-purple)))!important;
  box-shadow:0 12px 30px color-mix(in srgb,var(--section-accent,var(--ts-blue)) 24%,rgba(0,0,0,.16));
}
.rail-footer.rail-overlay-controls .scroll-btn-prev:hover{transform:translateY(-50%) translateX(2px)!important}
.rail-footer.rail-overlay-controls .scroll-btn-next:hover{transform:translateY(-50%) translateX(-2px)!important}
.rail-footer.rail-overlay-controls .scroll-btn:disabled{
  opacity:.28!important;
  cursor:default!important;
  filter:saturate(.35);
  box-shadow:none!important;
  pointer-events:none!important;
}
.rail-footer.rail-overlay-controls .scroll-btn:focus-visible{
  outline:2px solid var(--section-accent,var(--ts-blue));
  outline-offset:3px;
}

/* Product cards */
.product-card{
  position:relative;
  overflow:hidden;
  border:1px solid var(--ts-line)!important;
  border-radius:16px!important;
  background:var(--ts-surface)!important;
  box-shadow:none!important;
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease!important;
}
.product-card:hover{
  transform:translateY(-2px)!important;
  border-color:rgba(0,0,0,.10)!important;
  box-shadow:0 8px 24px rgba(0,0,0,.07)!important;
}
body.dark .product-card:hover{border-color:rgba(255,255,255,.18)!important}
.product-card-media,
.product-card-image-wrap{
  position:relative;
  aspect-ratio:4 / 3!important;
  background:var(--ts-surface-soft)!important;
}
.product-card-media::after{display:none!important;}
.product-card-media img,
.product-card-image-wrap img{
  object-fit:contain!important;
  padding:10px!important;
  mix-blend-mode:normal!important;
  transition:transform .35s cubic-bezier(.2,.7,.2,1)!important;
}
.product-card:hover .product-card-media img,
.product-card:hover .product-card-image-wrap img{transform:scale(1.02)!important}
.product-card-body{padding:9px 10px 10px!important;gap:3px!important}
.product-card-meta{display:flex;align-items:center;gap:5px;color:var(--ts-muted)!important;font-size:.62rem!important;line-height:1.3!important}
.pc-brand{color:var(--ts-blue)!important;font-weight:700}
.product-card-title{
  margin:4px 0 3px!important;
  min-height:0!important;
  color:var(--ts-text)!important;
  font-size:.76rem!important;
  line-height:1.42!important;
  font-weight:680!important;
}
.product-card-desc,.pc-cat{display:none!important}
.card-rating .stars,.rating-stars,.stars{color:#ff9f0a!important}
.product-card-prices{margin-top:5px!important;gap:4px!important}
.price{color:var(--ts-text)!important;font-size:.84rem!important;font-weight:750!important;line-height:1.35!important}
.price-old{color:var(--ts-muted)!important;font-size:.63rem!important}
.pc-discount,.discount-badge{background:#ff3b30!important;color:#fff!important;border-radius:999px!important}
.pc-rank{background:var(--ts-text)!important;color:var(--ts-surface)!important;border-radius:999px!important}
.card-add-btn{
  min-height:28px!important;
  padding-inline:8px!important;
  font-size:.66rem!important;
  border-radius:999px!important;
  background:var(--ts-blue)!important;
  color:#fff!important;
  border:0!important;
}
.card-add-btn:hover{background:var(--ts-blue-hover)!important}
.card-add-btn.is-muted{background:color-mix(in srgb,var(--ts-muted) 18%,transparent)!important;color:var(--ts-muted)!important}
.pc-floating-actions{display:flex!important;gap:4px!important}
.pc-floating-actions button,
.wishlist-btn,
.card-action{
  border:1px solid var(--ts-line)!important;
  background:color-mix(in srgb,var(--ts-surface) 88%,transparent)!important;
  color:var(--ts-text)!important;
  backdrop-filter:blur(12px);
  border-radius:999px!important;
}
.wishlist-btn.saved{background:#ff375f!important;color:#fff!important;border-color:#ff375f!important}
.stock-line{font-size:.58rem!important}
.product-card .pc-floating-actions{
  position:absolute!important;
  top:7px!important;
  left:7px!important;
  z-index:6!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  gap:5px!important;
}
.product-card .pc-floating-actions .quick-view-btn,
.product-card .pc-floating-actions .wishlist-btn,
.product-card .pc-floating-actions .card-action{
  position:static!important;
  inset:auto!important;
  margin:0!important;
  width:28px!important;
  height:28px!important;
  min-width:28px!important;
  flex:0 0 28px!important;
  font-size:.7rem!important;
  box-shadow:none!important;
}
.product-card .pc-badges{top:7px!important;right:7px!important}
.product-card .pc-discount,
.product-card .pc-rank,
.product-card .pstock-badge{
  padding:3px 7px!important;
  font-size:.58rem!important;
  box-shadow:none!important;
}
.product-card .pstock-badge{bottom:7px!important;left:7px!important}
.product-card .card-rating{
  margin-top:3px!important;
  gap:3px!important;
  font-size:.6rem!important;
}
.product-card .card-rating .stars{font-size:.58rem!important}
.product-card .rating-count{display:none!important}
.product-card .price::after{display:none!important}
.product-card .sold-badge{display:none!important}
.product-card-footer{
  margin-top:7px!important;
  padding-top:7px!important;
  gap:6px!important;
  border-top:1px solid var(--ts-line)!important;
}

/* Brand / feature / newsletter sections */
.brand-logo-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(130px,1fr));
  border:1px solid var(--ts-line)!important;
  border-radius:var(--ts-radius-lg)!important;
  overflow:hidden;
  background:var(--ts-surface)!important;
}
.brand-logo-card{
  min-height:112px;
  padding:16px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:9px;
  border-inline-end:1px solid var(--ts-line)!important;
  border-bottom:1px solid var(--ts-line)!important;
  color:var(--ts-text)!important;
  text-decoration:none;
}
.brand-logo-card img{
  max-width:86px;
  max-height:42px;
  object-fit:contain;
  transition:transform .2s ease,opacity .2s ease,filter .2s ease;
}
.brand-logo-card .brand-logo-mark{
  width:auto;
  height:34px;
  max-width:96px;
  max-height:34px;
  opacity:.94;
  filter:none;
}
.brand-logo-card .brand-logo-mark--word{
  width:min(92px,82%);
  height:28px;
}
body:not(.dark) .brand-logo-card .brand-logo-mark{
  filter:invert(1);
}
.brand-logo-card:hover .brand-logo-mark{
  transform:scale(1.06);
  opacity:1;
}
.brand-logo-card .brand-logo-fallback{
  font-size:.86rem;
  font-weight:760;
  color:var(--ts-text);
}
.brand-logo-card span{font-size:.68rem;color:var(--ts-muted)}
.features-grid,.trust-strip-grid,.trust-strip-grid--four{gap:12px!important}
.feature-card,.trust-item{
  border:1px solid var(--ts-line)!important;
  border-radius:var(--ts-radius-md)!important;
  background:var(--ts-surface)!important;
  box-shadow:none!important;
}
.newsletter-section,.newsletter-box{
  border-radius:var(--ts-radius-xl)!important;
  overflow:hidden;
}

/* Shop */
.products-page{
  width:min(1280px,calc(100% - 40px));
  margin:0 auto;
  padding:34px 0 80px;
}
.shop-hero-panel{
  margin-bottom:22px!important;
  padding:clamp(24px,4vw,44px)!important;
  border:1px solid var(--ts-line)!important;
  border-radius:var(--ts-radius-xl)!important;
  background:
    radial-gradient(circle at 80% 0,rgba(0,113,227,.09),transparent 28%),
    var(--ts-surface)!important;
  box-shadow:none!important;
}
.shop-hero-panel h1{
  margin:0;
  color:var(--ts-text);
  font-size:clamp(2rem,4vw,4rem);
  letter-spacing:-.055em;
}
.shop-hero-panel p{color:var(--ts-muted)}
.shop-search-row{
  display:grid!important;
  grid-template-columns:minmax(240px,1fr) minmax(190px,.35fr) auto!important;
  gap:10px!important;
  margin-top:22px!important;
}
.shop-toolbar{
  padding:10px 0 18px!important;
  border-bottom:1px solid var(--ts-line)!important;
  background:transparent!important;
}
.shop-result-count{color:var(--ts-muted)!important}
.shop-result-count strong{color:var(--ts-text)}
.shop-layout{gap:22px!important}
.filter-sidebar-inner{
  position:sticky;
  top:calc(var(--ts-header-h) + 18px);
  border:1px solid var(--ts-line)!important;
  border-radius:var(--ts-radius-lg)!important;
  background:var(--ts-surface)!important;
  box-shadow:none!important;
  overflow:hidden;
}
.filter-sidebar-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin:0!important;
  padding:18px!important;
  border-bottom:1px solid var(--ts-line);
}
.filter-section{padding:16px 18px!important}
.filter-section+.filter-section{border-top:1px solid var(--ts-line)!important}
.filter-section-title{margin:0 0 10px;color:var(--ts-text)}
.filter-toggle-row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  min-height:39px;
  padding:6px 0!important;
  color:var(--ts-muted);
}
.filter-toggle-row input{accent-color:var(--ts-blue)}
.filter-option-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}
.filter-choice{
  min-height:38px;
  padding:8px 10px;
  border:1px solid var(--ts-line)!important;
  border-radius:12px!important;
  background:var(--ts-surface-soft)!important;
  color:var(--ts-text)!important;
  font-size:.76rem;
  cursor:pointer;
}
.filter-choice:hover,.filter-choice.active{
  border-color:rgba(0,113,227,.35)!important;
  color:var(--ts-blue)!important;
  background:rgba(0,113,227,.06)!important;
}
.filter-category-list{display:flex;flex-direction:column;gap:4px;max-height:320px;overflow:auto}
.filter-category-item,.rating-filter-item{
  width:100%;
  border:0!important;
  background:transparent!important;
  color:var(--ts-muted)!important;
  padding:9px 10px!important;
  border-radius:11px!important;
  text-align:right;
  cursor:pointer;
}
.filter-category-item:hover,.filter-category-item.active,
.rating-filter-item:hover,.rating-filter-item.active{
  background:rgba(0,113,227,.07)!important;
  color:var(--ts-blue)!important;
}
.brand-check-item{border-radius:10px!important}
.active-filters-bar{gap:6px!important}
.filter-chip-sm{border-radius:999px!important;background:var(--ts-surface)!important;border:1px solid var(--ts-line)!important;color:var(--ts-text)!important}
.products-grid{grid-template-columns:repeat(auto-fill,minmax(176px,1fr))!important;gap:11px!important}

/* Product detail */
.product-detail{
  width:min(1220px,calc(100% - 40px));
  margin:0 auto;
  padding:42px 0 58px;
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);
  gap:clamp(34px,5vw,72px);
  align-items:start;
}
.product-gallery{
  border:1px solid var(--ts-line)!important;
  border-radius:var(--ts-radius-xl)!important;
  background:var(--ts-surface)!important;
  overflow:hidden;
  box-shadow:none!important;
}
.product-image-swiper{
  position:relative;
  background:linear-gradient(180deg,var(--ts-surface-soft),var(--ts-surface))!important;
}
.product-gallery-counter{
  position:absolute;
  z-index:6;
  top:14px;
  left:14px;
  min-width:54px;
  height:30px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  padding:0 10px;
  border:1px solid var(--ts-line);
  border-radius:999px;
  background:color-mix(in srgb,var(--ts-surface) 88%,transparent);
  color:var(--ts-text);
  font-size:.76rem;
  font-weight:700;
  backdrop-filter:blur(10px);
}
.product-swiper-prev,
.product-swiper-next{
  opacity:1!important;
  visibility:visible!important;
}
.product-image-swiper .swiper-slide{min-height:540px;display:grid;place-items:center}
.product-image-swiper img{width:100%;height:540px;object-fit:contain!important;padding:24px}
.product-thumbs{padding:14px!important;border-top:1px solid var(--ts-line)!important}
.thumb-btn{
  border:1px solid var(--ts-line)!important;
  border-radius:12px!important;
  background:var(--ts-surface-soft)!important;
}
.thumb-btn.active{border-color:var(--ts-blue)!important;box-shadow:0 0 0 2px rgba(0,113,227,.10)!important}
.gallery-hint{color:var(--ts-muted)!important}
.product-info{
  padding:8px 0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.product-brand{color:var(--ts-blue)!important;font-size:.8rem!important;font-weight:650!important}
.product-info h1{
  margin:10px 0 12px!important;
  color:var(--ts-text)!important;
  font-size:clamp(2rem,3.6vw,3.9rem)!important;
  line-height:1.08!important;
  letter-spacing:-.055em!important;
}
.product-rating-summary{color:var(--ts-muted)!important}
.product-price{
  margin-top:20px!important;
  color:var(--ts-text)!important;
  font-size:clamp(1.55rem,2.4vw,2.35rem)!important;
  font-weight:780!important;
}
.old-price{color:var(--ts-muted)!important}
.product-short,.product-description{color:var(--ts-muted)!important;line-height:1.9!important}
.product-meta,.product-colors-block,.buy-box,.stock-status-banner,.review-form-panel,.review-card{
  border:1px solid var(--ts-line)!important;
  border-radius:var(--ts-radius-lg)!important;
  background:var(--ts-surface)!important;
  box-shadow:none!important;
}
.buy-box{padding:18px!important}
.color-swatch{
  border:1px solid var(--ts-line)!important;
  border-radius:14px!important;
  background:var(--ts-surface-soft)!important;
}
.color-swatch.selected,.color-swatch.active{border-color:var(--ts-blue)!important;box-shadow:0 0 0 3px rgba(0,113,227,.09)!important}
.qty-selector{
  border:1px solid var(--ts-line)!important;
  border-radius:999px!important;
  background:var(--ts-surface-soft)!important;
  overflow:hidden;
}
.qty-btn{border:0!important;background:transparent!important;color:var(--ts-text)!important}
.buy-btn{border-radius:999px!important}
.similar-products-section,.product-reviews{
  width:min(1220px,calc(100% - 40px));
  margin-inline:auto;
}
.similar-products-grid{gap:16px!important}
.review-card{padding:18px!important}

/* Profile, cart, wishlist, orders */
.profile-page{
  width:min(1220px,calc(100% - 40px));
  margin:0 auto;
  padding:34px 0 72px;
}
.profile-layout{gap:22px!important}
.profile-main{
  min-width:0;
  border:1px solid var(--ts-line)!important;
  border-radius:var(--ts-radius-xl)!important;
  background:var(--ts-surface)!important;
  box-shadow:none!important;
  padding:clamp(20px,3vw,34px)!important;
}
.profile-header{
  border:1px solid var(--ts-line)!important;
  border-radius:var(--ts-radius-lg)!important;
  background:var(--ts-surface-soft)!important;
}
.profile-section-head{border-bottom:1px solid var(--ts-line)!important}
.dashboard-stat-card,.quick-action-card,.dashboard-card,.order-card,
.wishlist-item-card,.cart-item-card,.address-confirm-box,.cart-summary-bar{
  border:1px solid var(--ts-line)!important;
  border-radius:var(--ts-radius-lg)!important;
  background:var(--ts-surface-soft)!important;
  box-shadow:none!important;
}
.dashboard-stat-card:hover,.quick-action-card:hover,.wishlist-item-card:hover{
  transform:translateY(-2px);
  border-color:var(--ts-line-strong)!important;
}
.page-title{color:var(--ts-text)!important;letter-spacing:-.035em}
.page-subtitle{color:var(--ts-muted)!important}
.cart-list,.wishlist-list,.orders-list{gap:12px!important}
.cart-item-card{padding:14px!important}
.cart-item-card img{border-radius:14px!important;background:var(--ts-surface)!important;object-fit:contain!important}
.cart-item-body h3 a{color:var(--ts-text)!important}
.cart-item-price{color:var(--ts-text)!important;font-weight:750}
.cart-summary-bar{padding:18px!important}
.address-confirm-box{padding:18px!important}
.cart-actions{gap:10px!important;flex-wrap:wrap}

/* Auth */
.auth-page{
  min-height:calc(100vh - var(--ts-header-h));
  background:var(--ts-bg)!important;
}
.auth-split{
  width:min(1180px,calc(100% - 40px));
  margin:34px auto;
  min-height:650px;
  border:1px solid var(--ts-line);
  border-radius:36px!important;
  overflow:hidden;
  background:var(--ts-surface);
  box-shadow:var(--ts-shadow);
}
.auth-side{
  border:0!important;
  background-color:#0c0c0f!important;
  background-size:cover!important;
  background-position:center!important;
}
.auth-side::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(0,0,0,.02),rgba(0,0,0,.42));
  pointer-events:none;
}
.auth-side-inner{position:relative;z-index:2}
.auth-side h2{font-size:clamp(2rem,4vw,4rem)!important;letter-spacing:-.055em!important}
.auth-side p,.auth-side-points{color:rgba(255,255,255,.78)!important}
.auth-main{background:var(--ts-surface)!important}
.auth-card{
  border:0!important;
  box-shadow:none!important;
  background:transparent!important;
  max-width:520px!important;
}
.auth-card h1,.auth-card h2{color:var(--ts-text)!important;letter-spacing:-.045em!important}
.auth-switch{color:var(--ts-muted)!important}
.auth-switch a{color:var(--ts-blue)!important}

/* Messages, modal, cart drawer */
.messages-wrap{position:fixed;z-index:9999;top:78px;inset-inline:0;pointer-events:none}
.messages-wrap .container{display:flex;flex-direction:column;align-items:center;gap:8px}
.messages-wrap .alert{
  pointer-events:auto;
  width:min(540px,calc(100vw - 28px));
  border:1px solid var(--ts-line)!important;
  border-radius:16px!important;
  background:color-mix(in srgb,var(--ts-surface) 92%,transparent)!important;
  color:var(--ts-text)!important;
  backdrop-filter:blur(18px);
  box-shadow:0 18px 55px rgba(0,0,0,.14)!important;
}
.alert-success{border-color:rgba(52,199,89,.35)!important}
.alert-error,.alert-danger{border-color:rgba(255,59,48,.38)!important}
.modal-overlay{backdrop-filter:blur(10px);background:rgba(0,0,0,.34)!important}
.modal{
  border:1px solid var(--ts-line)!important;
  border-radius:var(--ts-radius-xl)!important;
  background:var(--ts-surface)!important;
  color:var(--ts-text)!important;
  box-shadow:0 28px 90px rgba(0,0,0,.24)!important;
}
.cart-drawer-overlay{
  position:fixed;
  inset:0;
  z-index:9996;
  background:rgba(0,0,0,.38);
  opacity:0;
  pointer-events:none;
  transition:.22s;
  backdrop-filter:blur(6px);
}
.cart-drawer{
  position:fixed;
  top:0;
  bottom:0;
  inset-inline-end:0;
  width:min(390px,94vw);
  z-index:9997;
  display:flex;
  flex-direction:column;
  border-inline-start:1px solid var(--ts-line);
  background:var(--ts-surface);
  color:var(--ts-text);
  transform:translateX(calc(100% + 24px));
  transition:.3s cubic-bezier(.2,.75,.2,1);
  box-shadow:-30px 0 80px rgba(0,0,0,.18);
}
html[dir="rtl"] .cart-drawer{transform:translateX(calc(-100% - 24px))}
.cart-drawer.open{transform:translateX(0)!important}
.cart-drawer-overlay.open{opacity:1;pointer-events:auto}
.cart-drawer-head{display:flex;align-items:center;justify-content:space-between;padding:16px 18px;border-bottom:1px solid var(--ts-line)}
.cart-drawer-body{overflow:auto;padding:10px 18px;flex:1}
.cart-drawer-item{display:grid;grid-template-columns:64px 1fr auto;gap:10px;padding:12px 0;border-bottom:1px solid var(--ts-line);align-items:center}
.cart-drawer-item img{width:64px;height:64px;object-fit:contain;border-radius:12px;background:var(--ts-surface-soft)}
.cart-drawer-foot{padding:16px 18px;border-top:1px solid var(--ts-line)}
.cart-drawer-media{width:64px;height:64px;border-radius:12px;overflow:hidden;display:grid;place-items:center;background:var(--ts-surface-soft);color:var(--ts-muted)}
.cart-drawer-copy{min-width:0}
.cart-drawer-copy>a{color:var(--ts-text)!important;text-decoration:none;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cart-drawer-copy small{display:block;color:var(--ts-muted);margin-top:3px}
.cart-drawer-qty{display:flex;align-items:center;gap:4px;margin-top:8px}
.cart-drawer-qty input{width:44px;height:30px;border:1px solid var(--ts-line);border-radius:9px;background:var(--ts-surface);color:var(--ts-text);text-align:center}
.drawer-qty-btn,.drawer-qty-save{width:30px;height:30px;border:1px solid var(--ts-line);border-radius:9px;background:var(--ts-surface);color:var(--ts-text);cursor:pointer;display:grid;place-items:center}
.cart-drawer-total{display:flex;justify-content:space-between;gap:12px;margin-bottom:10px}

/* Footer */
.footer{
  margin-top:0!important;
  padding:54px 0 18px!important;
  border-top:1px solid var(--ts-line)!important;
  background:var(--ts-surface)!important;
  color:var(--ts-text)!important;
}
.footer-grid{
  display:grid!important;
  grid-template-columns:minmax(260px,1.5fr) repeat(3,minmax(130px,.7fr))!important;
  gap:34px!important;
}
.footer h2,.footer h3{color:var(--ts-text)!important}
.footer h3{font-size:.82rem!important}
.footer-about,.footer-contact,.footer-links a,.footer-bottom{color:var(--ts-muted)!important}
.footer-links a:hover{color:var(--ts-text)!important}
.footer-bottom{margin-top:34px!important;padding-top:16px!important;border-top:1px solid var(--ts-line)!important}
.social-link{
  border:1px solid var(--ts-line)!important;
  border-radius:999px!important;
  background:var(--ts-surface-soft)!important;
  color:var(--ts-text)!important;
}

/* Floating / mobile navigation */
#topButton{
  border:1px solid var(--ts-line)!important;
  border-radius:999px!important;
  background:color-mix(in srgb,var(--ts-surface) 88%,transparent)!important;
  color:var(--ts-text)!important;
  backdrop-filter:blur(16px);
}
.mobile-bottom-bar{
  border-top:1px solid var(--ts-line)!important;
  background:color-mix(in srgb,var(--ts-surface) 88%,transparent)!important;
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
}
.mb-item{color:var(--ts-muted)!important}
.mb-item:hover,.mb-item.active{color:var(--ts-blue)!important}

/* Admin/customer neutral cards */
.admin-panel,.admin-form-card,.admin-panel-header{
  border-color:var(--ts-line)!important;
}
.admin-panel,.admin-form-card{
  border-radius:var(--ts-radius-lg)!important;
  box-shadow:none!important;
}

/* Dark refinements */
body.dark .apple-hero{
  background:
    radial-gradient(circle at 75% 18%,rgba(0,113,227,.17),transparent 28%),
    radial-gradient(circle at 20% 85%,rgba(123,67,255,.12),transparent 30%),
    #000!important;
}
body.dark .apple-product-stage{box-shadow:0 35px 100px rgba(0,0,0,.6)!important}
body.dark .apple-categories{background:#08080a!important}
body.dark .product-rail-section{background:#000!important}
body.dark .product-rail-section:nth-of-type(even){background:#08080a!important}
body.dark .tech-world-card{box-shadow:0 20px 60px rgba(0,0,0,.34)}
body.dark .product-card-media img,
body.dark .product-card-image-wrap img{filter:none!important}

/* Responsive */
@media (max-width:1100px){
  .header .header-top-row{grid-template-columns:auto minmax(0,1fr) minmax(260px,300px) auto;gap:8px}
  .header-search{display:flex}
  .search-toggle{display:none!important}
  .apple-hero-layout{grid-template-columns:1fr 1fr;gap:34px}
  .apple-product-stage{min-height:460px}
  .category-mini-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .product-detail{grid-template-columns:1fr 1fr;gap:32px}
  .footer-grid{grid-template-columns:1.35fr repeat(3,.7fr)!important}
}
@media (max-width:900px){
  :root{--ts-header-h:58px}
  .container,
  .products-page,
  .product-detail,
  .profile-page,
  .similar-products-section,
  .product-reviews{width:min(100% - 28px,1220px)}
  .header .header-top-row{display:flex;justify-content:space-between}
  .header-search{
    display:flex!important;
    width:36px!important;
    min-width:36px!important;
    height:36px!important;
    order:0;
  }
  .header-search .search-form{
    position:fixed;
    top:calc(var(--ts-header-h) + 10px);
    left:14px;
    right:14px;
    width:auto;
    max-width:none;
    min-height:42px;
    padding:4px 5px 4px 12px;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(-8px) scale(.985);
    z-index:1300;
    background:color-mix(in srgb,var(--ts-surface) 96%,transparent);
    box-shadow:0 18px 50px rgba(0,0,0,.22);
  }
  .header-search.is-open .search-form{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:translateY(0) scale(1);
  }
  .header-search .search-toggle{
    width:36px!important;
    height:36px!important;
    min-width:36px!important;
    border:1px solid transparent!important;
    border-radius:999px!important;
    display:grid!important;
    place-items:center;
    background:transparent!important;
    color:var(--ts-text)!important;
  }
  .header-search .search-toggle:hover{background:color-mix(in srgb,var(--ts-text) 6%,transparent)!important}
  .header-navbar{order:-1}
  .nav-toggle{display:grid!important}
  .header-navbar nav{
    background:var(--ts-surface)!important;
    border-inline-end:1px solid var(--ts-line)!important;
  }
  .header-navbar nav>ul{display:block!important;padding:12px!important}
  .header-navbar nav>ul>li>a,.nav-dropdown-toggle,.nav-theme-btn{
    width:100%!important;
    min-height:46px!important;
    justify-content:flex-start!important;
    border-radius:13px!important;
  }
  .logo{margin-inline:auto}
  .actions .btn-label{display:none}
  .actions .login-nav-btn,.actions .register-btn,.actions .admin-nav-btn{width:38px!important;padding:0!important;display:grid!important}
  .apple-hero{padding-top:46px!important}
  .apple-hero-layout{grid-template-columns:1fr;gap:36px;text-align:center}
  .apple-hero-copy{margin-inline:auto}
  .apple-eyebrow,.apple-hero-actions,.apple-hero-proof{justify-content:center}
  .apple-display-subtitle{margin-inline:auto}
  .apple-product-stage{min-height:clamp(350px,78vw,540px)}
  .tech-world-grid{grid-template-columns:1fr}
  .tech-world-card,.tech-world-card:first-child,.tech-world-card:nth-child(2),.tech-world-card:nth-child(3){grid-column:auto;min-height:430px}
  .shop-search-row{grid-template-columns:1fr!important}
  .filter-sidebar{display:none!important}
  .shop-layout{display:block!important}
  .product-detail{grid-template-columns:1fr;padding-top:26px}
  .product-image-swiper .swiper-slide,.product-image-swiper img{height:clamp(360px,70vw,520px);min-height:0}
  .profile-layout{grid-template-columns:1fr!important}
  .auth-split{grid-template-columns:1fr!important;min-height:0}
  .auth-side{min-height:320px}
  .footer-grid{grid-template-columns:1fr 1fr!important}
}
@media (max-width:620px){
  .container,
  .products-page,
  .product-detail,
  .profile-page,
  .similar-products-section,
  .product-reviews{width:min(100% - 22px,1220px)}
  .header{min-height:56px}
  .header .header-top-row{min-height:56px}
  .logo-site-name{display:none}
  .actions{gap:2px}
  .actions>a,.actions>button,.cart-action,.theme-toggle,.bell-btn{width:34px!important;height:34px!important;min-width:34px!important}
  .actions .register-btn,.actions .login-nav-btn,.actions .admin-nav-btn{width:34px!important}
  .apple-hero{padding:38px 0 52px!important}
  .apple-display-title{font-size:clamp(2.65rem,14vw,4.5rem);letter-spacing:-.06em}
  .apple-display-subtitle{font-size:.96rem;line-height:1.8}
  .apple-hero-actions{gap:12px}
  .apple-btn{width:100%}
  .apple-link-btn{justify-content:center;width:100%}
  .apple-hero-proof{margin-top:28px}
  .apple-hero-proof>div{padding-inline:11px}
  .apple-hero-proof strong{font-size:.78rem}
  .apple-hero-proof span{font-size:.64rem}
  .apple-product-stage{min-height:330px;border-radius:24px!important}
  .hero-product-showcase{width:88%;height:84%}
  .hero-product-media{border-radius:20px}
  .hero-product-media img{padding:16px}
  .hero-product-overlay{right:12px;left:12px;bottom:12px;gap:8px}
  .hero-product-title{font-size:.69rem;max-width:54%}
  .hero-product-view-btn{min-height:32px;padding:0 11px;font-size:.66rem}
  .hero-photo-nav{width:34px;height:34px}
  .hero-photo-nav--prev{right:calc(6% + 10px)}
  .hero-photo-nav--next{left:calc(6% + 10px)}
  .hero-photo-dots{top:calc(8% + 8px);padding:6px 8px;gap:6px}
  .hero-photo-dot,.hero-photo-dot.active{width:7px;height:7px}
  .apple-hero-static-art img{width:100%;height:100%}
  .apple-tech-worlds,.apple-categories,.product-rail-section{padding:48px 0!important}
  .apple-section-head,.section-head-row{align-items:flex-start;flex-direction:column;gap:12px;margin-bottom:22px}
  .section-head-copy h2,.apple-section-head h2{font-size:1.8rem!important}
  .tech-world-card,.tech-world-card:first-child,.tech-world-card:nth-child(2),.tech-world-card:nth-child(3){min-height:390px;border-radius:24px}
  .tech-world-mobile{width:min(86vw,340px)!important;min-height:0!important;aspect-ratio:.72 / 1!important;justify-self:center!important}
  .tech-world-mobile .tech-world-copy{padding:18px!important}
  .tech-world-mobile .tech-world-copy h3{font-size:1.45rem!important}
  .tech-world-copy{padding:23px}
  .tech-world-copy h3{font-size:1.7rem}
  .tech-world-copy p{font-size:.8rem}
  .category-mini-grid{grid-template-columns:1fr!important;gap:9px!important}
  .category-mini-card{min-height:88px!important;padding:15px!important;border-radius:18px!important}
  .product-rail{padding-inline:40px}
  .product-rail>.product-card{flex-basis:min(58vw,198px)}
  .rail-footer.rail-overlay-controls .scroll-btn{width:34px!important;height:34px!important;font-size:.7rem!important}
  .rail-footer.rail-overlay-controls .scroll-btn-prev{right:2px!important}
  .rail-footer.rail-overlay-controls .scroll-btn-next{left:2px!important}
  .products-page{padding-top:18px}
  .shop-hero-panel{padding:22px!important;border-radius:24px!important}
  .shop-hero-panel h1{font-size:2.1rem}
  .shop-toolbar{align-items:flex-start!important;gap:10px!important}
  .shop-toolbar-actions{width:100%;justify-content:space-between!important}
  .shop-sort-select{min-width:0!important}
  .products-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}
  .products-grid .product-card-body{padding:8px!important}
  .products-grid .product-card-title{font-size:.71rem!important}
  .products-grid .product-card-desc,.products-grid .stock-line,.products-grid .pc-cat{display:none!important}
  .products-grid .card-add-btn{min-width:30px!important;padding-inline:7px!important;font-size:.63rem!important}
  .product-gallery,.profile-main,.auth-split{border-radius:24px!important}
  .product-info h1{font-size:2.2rem!important}
  .product-image-swiper .swiper-slide,.product-image-swiper img{height:330px}
  .profile-page{padding-top:18px}
  .profile-main{padding:18px!important}
  .cart-item-card{grid-template-columns:74px 1fr!important}
  .cart-item-remove{grid-column:2!important}
  .auth-split{width:calc(100% - 22px);margin:18px auto}
  .auth-side{min-height:260px}
  .auth-main{padding:18px!important}
  .footer{padding-top:40px!important}
  .footer-grid{grid-template-columns:1fr!important;gap:24px!important}
  .mobile-bottom-bar{display:grid!important}
  body:not(.staff-user){padding-bottom:70px}
}
@media (max-width:380px){
  .products-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}
  .products-grid .product-card-body{padding:7px!important}
  .products-grid .product-card-title{font-size:.68rem!important}
  .products-grid .product-card-prices{margin-top:7px!important}
  .product-rail>.product-card{flex-basis:min(62vw,188px)}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}


/* Secondary customer pages */
.category-grid{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr))!important;
  gap:14px!important;
}
.category-card{
  min-height:150px;
  padding:22px!important;
  border:1px solid var(--ts-line)!important;
  border-radius:var(--ts-radius-lg)!important;
  background:var(--ts-surface)!important;
  color:var(--ts-text)!important;
  box-shadow:none!important;
  text-decoration:none;
  transition:transform .24s ease,border-color .24s ease,box-shadow .24s ease!important;
}
.category-card:hover{
  transform:translateY(-3px)!important;
  border-color:var(--ts-line-strong)!important;
  box-shadow:var(--ts-shadow-soft)!important;
}
.category-icon{
  width:48px!important;
  height:48px!important;
  border-radius:15px!important;
  display:grid!important;
  place-items:center!important;
  background:rgba(0,113,227,.08)!important;
  color:var(--ts-blue)!important;
}
.category-subcats{color:var(--ts-muted)!important}
.about-page-image{
  border-radius:var(--ts-radius-xl)!important;
  border:1px solid var(--ts-line)!important;
  box-shadow:var(--ts-shadow-soft)!important;
}
.stats{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:12px!important;
}
.stat-box{
  border:1px solid var(--ts-line)!important;
  border-radius:var(--ts-radius-lg)!important;
  background:var(--ts-surface)!important;
  box-shadow:none!important;
}
.stat-icon{color:var(--ts-blue)!important}
.contact-grid{
  display:grid!important;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr))!important;
  gap:14px!important;
}
.profile-section{
  border:1px solid var(--ts-line)!important;
  border-radius:var(--ts-radius-lg)!important;
  background:var(--ts-surface-soft)!important;
  box-shadow:none!important;
}
.notifications-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
}
.notifications-full-list,
.orders-page .profile-section{
  border:1px solid var(--ts-line)!important;
  border-radius:var(--ts-radius-lg)!important;
  background:var(--ts-surface)!important;
}
.notifications-full-list .bell-list>li{
  border-bottom:1px solid var(--ts-line)!important;
}
.notifications-full-list .bell-list>li:last-child{border-bottom:0!important}
.notifications-full-list .bell-list a{
  color:var(--ts-text)!important;
  border-radius:12px;
}
.notifications-full-list .bell-list a.unread{
  background:rgba(0,113,227,.06)!important;
}
.order-detail-head,
.order-detail-total,
.order-status-steps{
  border:1px solid var(--ts-line)!important;
  border-radius:var(--ts-radius-lg)!important;
  background:var(--ts-surface-soft)!important;
}
.order-status-badge{border-radius:999px!important}
.order-items{gap:10px!important}

.auth-page:not(.auth-page--split){
  display:grid;
  place-items:center;
  padding:40px 20px;
}
.auth-page:not(.auth-page--split) .auth-card{
  width:min(520px,100%);
  padding:clamp(24px,4vw,42px)!important;
  border:1px solid var(--ts-line)!important;
  border-radius:var(--ts-radius-xl)!important;
  background:var(--ts-surface)!important;
  box-shadow:var(--ts-shadow-soft)!important;
}
.profile-form{
  display:flex;
  flex-direction:column;
  gap:18px;
}
.form-row{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px!important;
}
.form-row--single,
.auth-form-row--single{
  grid-template-columns:1fr!important;
}
.password-wrap{position:relative}
.password-toggle-btn,.toggle-pw{
  border:0!important;
  background:transparent!important;
  color:var(--ts-muted)!important;
}
.crop-box,.crop-preview-box{
  border:1px solid var(--ts-line)!important;
  border-radius:var(--ts-radius-lg)!important;
  background:var(--ts-surface-soft)!important;
}

@media (max-width:700px){
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .form-row{grid-template-columns:1fr!important}
  .notifications-head{flex-direction:column}
  .category-grid{grid-template-columns:1fr!important}
}


/* Homepage feature cards — theme-aware, no template-local CSS */
.apple-features{
  padding:clamp(58px,6vw,92px) 0!important;
  background:var(--ts-surface)!important;
}
.apple-features .trust-strip-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:14px!important;
}
.apple-features .trust-item{
  position:relative;
  min-height:196px;
  padding:28px!important;
  border:1px solid var(--ts-line)!important;
  border-radius:var(--ts-radius-lg)!important;
  display:flex!important;
  flex-direction:column;
  align-items:flex-start!important;
  justify-content:flex-end!important;
  gap:8px!important;
  overflow:hidden;
  background:var(--ts-surface-soft)!important;
  color:var(--ts-text)!important;
  text-align:start!important;
  text-decoration:none!important;
  box-shadow:none!important;
  transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease!important;
}
.apple-features .trust-item::before{
  content:"";
  position:absolute;
  width:150px;
  height:150px;
  inset:-76px -54px auto auto;
  border-radius:50%;
  background:radial-gradient(circle,rgba(0,113,227,.13),transparent 70%);
  pointer-events:none;
}
.apple-features .trust-item:hover{
  transform:translateY(-4px)!important;
  border-color:rgba(0,113,227,.24)!important;
  box-shadow:var(--ts-shadow-soft)!important;
}
.apple-features .feature-icon{
  width:46px;
  height:46px;
  margin:0 0 auto!important;
  border:1px solid var(--ts-line);
  border-radius:15px;
  display:grid;
  place-items:center;
  background:var(--ts-surface);
  color:var(--ts-blue)!important;
  font-size:1.08rem!important;
}
.apple-features h3{
  margin:18px 0 0!important;
  color:var(--ts-text)!important;
  font-size:1rem!important;
  font-weight:720!important;
  letter-spacing:-.02em;
}
.apple-features p{
  margin:0!important;
  color:var(--ts-muted)!important;
  font-size:.78rem!important;
  line-height:1.8!important;
}
body.dark .apple-features{background:#08080a!important}
body.dark .apple-features .trust-item{background:#111113!important}
@media(max-width:900px){
  .apple-features .trust-strip-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:520px){
  .apple-features{padding:48px 0!important}
  .apple-features .trust-strip-grid{grid-template-columns:1fr!important;gap:9px!important}
  .apple-features .trust-item{min-height:154px;padding:22px!important}
}


/* Store and product-detail interaction polish */
.filter-drawer-open{overflow:hidden!important}
.shop-filter-toggle[aria-expanded="true"]{
  border-color:rgba(0,113,227,.38)!important;
  color:var(--ts-blue)!important;
  background:rgba(0,113,227,.07)!important;
}
.filter-drawer-overlay{
  background:rgba(0,0,0,.34)!important;
  backdrop-filter:blur(6px);
  -webkit-backdrop-filter:blur(6px);
}
.filter-drawer{
  width:min(430px,94vw)!important;
  border-inline-start:1px solid var(--ts-line)!important;
  background:var(--ts-surface)!important;
  color:var(--ts-text)!important;
  box-shadow:-28px 0 80px rgba(0,0,0,.18)!important;
}
.filter-drawer-head{
  min-height:68px;
  padding:14px 18px!important;
  border-bottom:1px solid var(--ts-line)!important;
  background:color-mix(in srgb,var(--ts-surface) 92%,transparent)!important;
  backdrop-filter:blur(18px);
}
.filter-drawer-head h3{margin:0!important;color:var(--ts-text)!important;font-size:1rem!important}
.filter-drawer-body{padding:8px 18px 28px!important}
.filter-drawer-body .filter-sidebar-inner{
  border:0!important;
  background:transparent!important;
  box-shadow:none!important;
  padding:0!important;
}
.filter-drawer-body .filter-sidebar-head{display:none!important}
.filter-drawer-body .filter-section{
  padding:20px 0!important;
  border-bottom:1px solid var(--ts-line)!important;
}
.filter-drawer-body .filter-section:last-child{border-bottom:0!important}
.filter-drawer-body .brand-list{max-height:250px;overflow:auto;padding-inline-end:4px}

.product-techcoin{
  margin-top:8px;
  display:inline-flex;
  align-items:center;
  gap:7px;
  color:var(--ts-muted);
  font-size:.76rem;
}
.product-techcoin i{color:#ff9f0a}
.product-assurance-grid{
  margin-top:18px;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:8px;
}
.product-assurance-item{
  min-width:0;
  padding:13px;
  border:1px solid var(--ts-line);
  border-radius:16px;
  display:flex;
  align-items:center;
  gap:10px;
  background:var(--ts-surface-soft);
}
.product-assurance-icon{
  width:34px;
  height:34px;
  flex:0 0 34px;
  border-radius:11px;
  display:grid;
  place-items:center;
  background:rgba(0,113,227,.08);
  color:var(--ts-blue);
}
.product-assurance-item>span:last-child{display:flex;flex-direction:column;min-width:0}
.product-assurance-item strong{
  color:var(--ts-text);
  font-size:.72rem;
  line-height:1.5;
}
.product-assurance-item small{
  margin-top:2px;
  color:var(--ts-muted);
  font-size:.61rem;
  line-height:1.55;
}
.product-info .buy-box{
  margin-top:20px!important;
  padding-top:18px!important;
  border-top:1px solid var(--ts-line);
}
.product-info .staff-actions{margin-top:18px!important}

@media(max-width:720px){
  .product-assurance-grid{grid-template-columns:1fr}
  .product-assurance-item{padding:12px 14px}
}


/* Account, cart and auth flow polish */
.profile-layout{
  display:grid!important;
  grid-template-columns:238px minmax(0,1fr)!important;
  align-items:start;
}
.profile-nav{
  position:sticky!important;
  top:calc(var(--ts-header-h) + 20px);
  padding:10px!important;
  border:1px solid var(--ts-line)!important;
  border-radius:var(--ts-radius-lg)!important;
  display:flex!important;
  flex-direction:column!important;
  gap:3px!important;
  background:var(--ts-surface)!important;
  box-shadow:none!important;
}
.profile-nav-link{
  min-height:43px;
  padding:0 12px!important;
  border-radius:13px!important;
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  color:var(--ts-muted)!important;
  text-decoration:none!important;
  font-size:.78rem!important;
  transition:.2s ease!important;
}
.profile-nav-link i{
  width:18px;
  text-align:center;
  color:inherit!important;
}
.profile-nav-link:hover{
  background:var(--ts-surface-soft)!important;
  color:var(--ts-text)!important;
}
.profile-nav-link.active{
  background:rgba(0,113,227,.09)!important;
  color:var(--ts-blue)!important;
}
.profile-nav-exit{
  margin-top:8px;
  padding-top:10px!important;
  border-top:1px solid var(--ts-line)!important;
  color:#ff3b30!important;
}
.profile-header{padding:18px!important;margin-bottom:20px!important}
.profile-avatar{border:1px solid var(--ts-line)!important;box-shadow:none!important}
.dashboard-cards{gap:10px!important}
.dashboard-stat-card{min-height:110px;padding:16px!important}
.dashboard-stat-icon{
  width:42px!important;
  height:42px!important;
  border-radius:14px!important;
  background:rgba(0,113,227,.08)!important;
  color:var(--ts-blue)!important;
}
.quick-actions-grid{gap:10px!important}
.quick-action-card{min-height:92px;padding:16px!important}

.cart-summary-bar{
  margin-top:14px!important;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  font-size:1rem;
}
.cart-stock-alert{
  border-radius:12px!important;
  border:1px solid rgba(255,59,48,.18)!important;
  background:rgba(255,59,48,.06)!important;
  color:#d52f27!important;
}
.address-confirm-box{
  margin-top:14px!important;
  background:var(--ts-surface-soft)!important;
}
.address-confirm-question{
  color:var(--ts-text)!important;
  font-weight:650;
}
.address-confirm-check{
  min-height:46px;
  padding:10px 12px!important;
  border:1px solid var(--ts-line)!important;
  border-radius:14px!important;
  background:var(--ts-surface)!important;
}
.address-confirm-check input{accent-color:var(--ts-blue)}
.techcoin-checkout-box{
  width:min(520px,100%);
  margin-bottom:12px;
  padding:16px;
  border:1px solid var(--ts-line);
  border-radius:18px;
  background:var(--ts-surface-soft);
}
.techcoin-checkout-meta{
  margin:5px 0 10px!important;
  font-size:.72rem!important;
  line-height:1.8;
}
.techcoin-amount-input{max-width:240px!important}
.cart-buy-hint{
  margin-top:13px!important;
  color:var(--ts-muted)!important;
  font-size:.72rem!important;
}
.cart-actions .buy-product-form{min-width:min(100%,420px)}

.auth-side:not([style]){
  background-image:
    linear-gradient(180deg,rgba(4,7,14,.12),rgba(4,7,14,.62)),
    url("../images/apple-gaming-world.svg?v=2")!important;
}
.auth-side{position:relative!important}
.auth-side-glow{
  position:absolute;
  width:360px;
  height:360px;
  inset:auto -120px -120px auto;
  border-radius:50%;
  background:radial-gradient(circle,rgba(0,113,227,.28),transparent 70%);
  pointer-events:none;
}
.auth-form .btn-block{width:100%!important}

.category-subcats{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:5px!important;
  margin-top:12px!important;
}
.category-subcat-chip{
  padding:5px 8px;
  border:1px solid var(--ts-line);
  border-radius:999px;
  background:var(--ts-surface-soft);
  color:var(--ts-muted);
  font-size:.66rem;
  text-decoration:none;
}
.category-card--linked{cursor:pointer}
.category-card--linked .category-card-hitarea{
  position:absolute!important;
  inset:0;
  z-index:1!important;
  border-radius:inherit;
}
.category-card--linked > .category-icon,
.category-card--linked > h3,
.category-card--linked > p{
  position:relative;
  z-index:2!important;
  pointer-events:none;
}
.category-card--linked .category-subcats{
  position:relative;
  z-index:3!important;
}
.category-card--linked .category-subcat-chip{
  position:relative;
  z-index:4!important;
  pointer-events:auto;
}
.category-card--linked .category-subcat-chip:hover{
  color:var(--ts-text);
  border-color:var(--ts-line-strong);
}

@media(max-width:900px){
  .profile-layout{grid-template-columns:1fr!important}
  .profile-nav{
    position:static!important;
    flex-direction:row!important;
    overflow-x:auto;
    scrollbar-width:none;
    padding:7px!important;
  }
  .profile-nav::-webkit-scrollbar{display:none}
  .profile-nav-link{
    flex:0 0 auto;
    white-space:nowrap;
    min-height:40px;
  }
  .profile-nav-exit{
    margin-top:0;
    padding-top:0!important;
    border-top:0!important;
    border-inline-start:1px solid var(--ts-line)!important;
  }
}
@media(max-width:560px){
  .profile-header{padding:14px!important}
  .dashboard-cards{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .dashboard-stat-card{min-height:96px}
  .quick-actions-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .cart-actions>a,.cart-actions>form{width:100%}
  .cart-actions .btn,.cart-actions .buy-product-btn{width:100%!important;justify-content:center}
  .techcoin-amount-input{max-width:none!important}
}


/* Final customer-facing state polish */
.auth-page:not(.auth-page--split){
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 80% 10%,rgba(0,113,227,.10),transparent 28%),
    radial-gradient(circle at 15% 90%,rgba(126,87,255,.08),transparent 26%),
    var(--ts-bg)!important;
}
.auth-page:not(.auth-page--split)::before{
  content:"";
  position:absolute;
  width:420px;
  height:420px;
  inset:-220px auto auto -170px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(0,113,227,.12),transparent 70%);
  pointer-events:none;
}
.auth-page:not(.auth-page--split) .auth-card{position:relative;z-index:1}
.toggle-pw,.password-toggle-btn{
  width:40px!important;
  height:40px!important;
  border-radius:11px!important;
  display:grid!important;
  place-items:center!important;
  cursor:pointer;
}
.toggle-pw:hover,.password-toggle-btn:hover{
  background:color-mix(in srgb,var(--ts-text) 6%,transparent)!important;
  color:var(--ts-text)!important;
}
.code-input{
  text-align:center!important;
  letter-spacing:.42em!important;
  font-size:1.35rem!important;
  font-weight:720!important;
}

.error-page-wrap,.maintenance-page{
  min-height:calc(100vh - var(--ts-header-h) - 160px);
  display:grid;
  place-items:center;
  padding:48px 20px!important;
  background:
    radial-gradient(circle at 50% 0%,rgba(0,113,227,.08),transparent 32%),
    var(--ts-bg)!important;
}
.error-404-card,.maintenance-card{
  width:min(720px,100%);
  padding:clamp(26px,5vw,54px)!important;
  border:1px solid var(--ts-line)!important;
  border-radius:36px!important;
  background:var(--ts-surface)!important;
  color:var(--ts-text)!important;
  box-shadow:var(--ts-shadow-soft)!important;
  text-align:center;
}
.error-404-lead,.maintenance-card p{color:var(--ts-muted)!important;line-height:1.9}
.error-404-search{
  border:1px solid var(--ts-line)!important;
  border-radius:999px!important;
  background:var(--ts-surface-soft)!important;
  overflow:hidden;
}
.error-404-search input{color:var(--ts-text)!important;background:transparent!important}
.error-404-search button{
  border-radius:999px!important;
  background:var(--ts-blue)!important;
  color:#fff!important;
}
.maintenance-icon,.error-404-icon{
  color:var(--ts-blue)!important;
}


/* Single product filter: desktop right sidebar, mobile off-canvas */
.filter-sidebar-head-actions{
  display:flex;
  align-items:center;
  gap:7px;
}
.filter-sidebar-mobile-close{display:none!important}

@media (max-width:992px){
  .filter-sidebar{
    display:flex!important;
    position:fixed!important;
    top:0!important;
    right:0!important;
    bottom:0!important;
    width:min(430px,94vw)!important;
    max-height:none!important;
    z-index:9999!important;
    overflow:visible!important;
    background:var(--ts-surface)!important;
    border-inline-start:1px solid var(--ts-line)!important;
    box-shadow:-28px 0 80px rgba(0,0,0,.20)!important;
    transform:translateX(105%);
    transition:transform .28s cubic-bezier(.2,.75,.2,1)!important;
  }
  .filter-sidebar.open{transform:translateX(0)!important}
  .filter-sidebar-inner{
    position:static!important;
    top:auto!important;
    width:100%!important;
    height:100%!important;
    max-height:none!important;
    overflow-y:auto!important;
    border:0!important;
    border-radius:0!important;
    background:var(--ts-surface)!important;
  }
  .filter-sidebar-head{
    position:sticky;
    top:0;
    z-index:3;
    min-height:68px;
    background:color-mix(in srgb,var(--ts-surface) 94%,transparent)!important;
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);
  }
  .filter-sidebar-mobile-close{display:grid!important}
  .filter-drawer-overlay{z-index:9998!important}
  .shop-layout{display:block!important}
}


/* =========================================================
   TechStore Color Vitality System
   Multi-accent palette with restrained dark-premium usage.
   ========================================================= */
:root{
  --ts-purple:var(--secondary,#8b5cf6);
  --ts-indigo:var(--secondary-2,#6366f1);
  --ts-cyan:var(--accent,#22d3ee);
  --ts-pink:#f472b6;
  --ts-rose:#fb7185;
  --ts-orange:#fb923c;
  --ts-amber:#fbbf24;
  --ts-green:#34d399;
}

/* Global accents */
::selection{background:rgba(139,92,246,.34)}
.logo-site-name{
  background:linear-gradient(105deg,#60a5fa 0%,#8b5cf6 48%,#f472b6 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent!important;
}
.header .search-form:focus-within{
  border-color:rgba(139,92,246,.52)!important;
  box-shadow:0 0 0 3px rgba(139,92,246,.10),0 10px 34px rgba(34,211,238,.07)!important;
}
.header-search-submit{
  background:linear-gradient(135deg,var(--ts-blue),var(--ts-purple))!important;
  color:#fff!important;
  box-shadow:0 5px 16px rgba(99,102,241,.22);
}
.header-search-submit:hover{
  background:linear-gradient(135deg,#1687f8,#9b6cff)!important;
  box-shadow:0 7px 22px rgba(139,92,246,.30);
}
.header nav>ul>li>a:hover,
.nav-dropdown-toggle:hover{
  color:#a78bfa!important;
  background:rgba(139,92,246,.08)!important;
}
.cart-count-badge{background:var(--ts-orange)!important}
.wishlist-count-badge{background:var(--ts-rose)!important}

/* Hero: colorful but still premium */
.apple-hero,
body.dark .apple-hero{
  background:
    radial-gradient(circle at 78% 18%,rgba(34,211,238,.14),transparent 27%),
    radial-gradient(circle at 22% 78%,rgba(139,92,246,.16),transparent 30%),
    radial-gradient(circle at 52% 112%,rgba(244,114,182,.10),transparent 32%),
    #000!important;
}
.apple-hero::after{
  background:radial-gradient(circle,rgba(99,102,241,.16),rgba(244,114,182,.06) 44%,transparent 69%)!important;
}
.apple-eyebrow{color:#a7b7c9!important}
.apple-eyebrow-dot{
  background:var(--ts-cyan)!important;
  box-shadow:0 0 0 5px rgba(34,211,238,.11),0 0 22px rgba(34,211,238,.28)!important;
}
.apple-display-title{
  background:linear-gradient(110deg,#f8fafc 4%,#c4b5fd 42%,#7dd3fc 70%,#f9a8d4 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent!important;
}
.apple-btn-primary,
.btn-primary{
  background:linear-gradient(135deg,var(--ts-blue),var(--ts-purple))!important;
  border-color:transparent!important;
  box-shadow:0 10px 26px rgba(99,102,241,.20)!important;
}
.apple-btn-primary:hover,
.btn-primary:hover{
  background:linear-gradient(135deg,#1687f8,#9b6cff)!important;
  box-shadow:0 14px 32px rgba(139,92,246,.28)!important;
}
.apple-link-btn{color:var(--ts-cyan)!important}
.apple-product-stage{
  background:
    radial-gradient(circle at 15% 12%,rgba(139,92,246,.14),transparent 24%),
    radial-gradient(circle at 86% 88%,rgba(34,211,238,.11),transparent 27%),
    linear-gradient(145deg,#121218,#0c0c12)!important;
  border-color:rgba(139,92,246,.20)!important;
}
.hero-photo-dot{background:rgba(196,181,253,.70)!important}
.hero-photo-dot.active{
  background:var(--ts-cyan)!important;
  box-shadow:0 0 0 3px rgba(34,211,238,.16),0 0 14px rgba(34,211,238,.30)!important;
}
.hero-photo-nav:hover{
  background:linear-gradient(135deg,var(--ts-blue),var(--ts-purple))!important;
}
.hero-product-view-btn{
  background:linear-gradient(135deg,rgba(0,113,227,.96),rgba(139,92,246,.96))!important;
  border-color:rgba(255,255,255,.34)!important;
}

/* Technology worlds get distinct identities */
.tech-world-mobile .tech-world-overlay{
  background:linear-gradient(180deg,rgba(34,211,238,.03) 22%,rgba(8,47,73,.30) 62%,rgba(2,28,48,.88) 100%)!important;
}
.tech-world-laptop .tech-world-overlay{
  background:linear-gradient(180deg,rgba(139,92,246,.04) 20%,rgba(76,29,149,.34) 62%,rgba(32,12,58,.90) 100%)!important;
}
.tech-world-gaming .tech-world-overlay{
  background:linear-gradient(180deg,rgba(251,146,60,.03) 18%,rgba(159,18,57,.28) 60%,rgba(56,15,28,.92) 100%)!important;
}
.tech-world-mobile .tech-world-copy>span{color:#67e8f9!important}
.tech-world-laptop .tech-world-copy>span{color:#c4b5fd!important}
.tech-world-gaming .tech-world-copy>span{color:#fdba74!important}
.tech-world-mobile:hover{box-shadow:0 24px 70px rgba(34,211,238,.13)!important}
.tech-world-laptop:hover{box-shadow:0 24px 70px rgba(139,92,246,.14)!important}
.tech-world-gaming:hover{box-shadow:0 24px 70px rgba(244,114,182,.12)!important}

/* Section-level accent identities */
.apple-tech-worlds .section-kicker{color:var(--ts-cyan)!important}
.apple-categories .section-kicker{color:var(--ts-green)!important}
.special-products .section-kicker{color:var(--ts-orange)!important}
.new-products-section .section-kicker{color:var(--ts-cyan)!important}
.best-sellers-section .section-kicker{color:var(--ts-purple)!important}
.brands-section .section-kicker{color:var(--ts-pink)!important}

.apple-categories .section-link{color:var(--ts-green)!important}
.special-products .section-link{color:var(--ts-orange)!important}
.new-products-section .section-link{color:var(--ts-cyan)!important}
.best-sellers-section .section-link{color:#a78bfa!important}

body.dark .apple-tech-worlds{
  background:
    radial-gradient(circle at 10% 20%,rgba(34,211,238,.055),transparent 24%),
    #050507!important;
}
body.dark .apple-categories,
.apple-categories{
  background:
    radial-gradient(circle at 88% 16%,rgba(52,211,153,.07),transparent 25%),
    #08090b!important;
}
body.dark .special-products,
.special-products{
  background:
    radial-gradient(circle at 14% 12%,rgba(251,146,60,.075),transparent 24%),
    #050506!important;
}
body.dark .new-products-section,
.new-products-section{
  background:
    radial-gradient(circle at 86% 18%,rgba(34,211,238,.065),transparent 24%),
    #08090b!important;
}
body.dark .best-sellers-section,
.best-sellers-section{
  background:
    radial-gradient(circle at 16% 18%,rgba(139,92,246,.075),transparent 25%),
    #050506!important;
}

/* Categories: six restrained accent families */
.category-mini-card{position:relative;overflow:hidden;--card-accent:var(--ts-blue)}
.category-mini-card:nth-child(6n+1){--card-accent:var(--ts-cyan)}
.category-mini-card:nth-child(6n+2){--card-accent:var(--ts-purple)}
.category-mini-card:nth-child(6n+3){--card-accent:var(--ts-green)}
.category-mini-card:nth-child(6n+4){--card-accent:var(--ts-orange)}
.category-mini-card:nth-child(6n+5){--card-accent:var(--ts-pink)}
.category-mini-card:nth-child(6n+6){--card-accent:var(--ts-indigo)}
.category-mini-card::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:3px;
  background:var(--card-accent);
  opacity:.72;
}
.category-mini-card{
  background:
    linear-gradient(135deg,color-mix(in srgb,var(--card-accent) 7%,var(--ts-surface-soft)),var(--ts-surface-soft) 55%)!important;
}
.category-mini-icon{
  color:var(--card-accent)!important;
  background:color-mix(in srgb,var(--card-accent) 10%,var(--ts-surface))!important;
  border-color:color-mix(in srgb,var(--card-accent) 24%,var(--ts-line))!important;
}
.category-mini-card:hover{
  border-color:color-mix(in srgb,var(--card-accent) 45%,var(--ts-line))!important;
  box-shadow:0 12px 34px color-mix(in srgb,var(--card-accent) 12%,transparent)!important;
}
.category-mini-card:hover .category-mini-arrow{color:var(--card-accent)!important}

/* Product cards: tiny color cues, not rainbow blocks */
.product-card{--card-accent:var(--ts-blue)}
.product-card:nth-child(6n+1){--card-accent:var(--ts-cyan)}
.product-card:nth-child(6n+2){--card-accent:var(--ts-purple)}
.product-card:nth-child(6n+3){--card-accent:var(--ts-green)}
.product-card:nth-child(6n+4){--card-accent:var(--ts-orange)}
.product-card:nth-child(6n+5){--card-accent:var(--ts-pink)}
.product-card:nth-child(6n+6){--card-accent:var(--ts-indigo)}
.product-card::before{
  content:"";
  position:absolute;
  z-index:5;
  top:0;
  right:12px;
  left:12px;
  height:2px;
  border-radius:0 0 999px 999px;
  background:linear-gradient(90deg,transparent,var(--card-accent),transparent);
  opacity:.72;
  pointer-events:none;
}
.product-card:hover{
  border-color:color-mix(in srgb,var(--card-accent) 34%,var(--ts-line))!important;
  box-shadow:0 12px 30px color-mix(in srgb,var(--card-accent) 9%,rgba(0,0,0,.14))!important;
}
.product-card .pc-brand{color:var(--card-accent)!important}
.product-card .quick-view-btn:hover,
.product-card .card-action:hover{
  color:var(--card-accent)!important;
  border-color:color-mix(in srgb,var(--card-accent) 34%,var(--ts-line))!important;
}
.product-card .pc-discount{background:linear-gradient(135deg,#fb7185,#f43f5e)!important}
.product-card .pc-rank{background:linear-gradient(135deg,#8b5cf6,#6366f1)!important;color:#fff!important}
.product-card .pstock-badge{
  background:rgba(52,211,153,.14)!important;
  color:#6ee7b7!important;
  border:1px solid rgba(52,211,153,.20)!important;
}
.card-rating .stars,.rating-stars,.stars{color:var(--ts-amber)!important}

/* Rail controls inherit each section's accent */
.special-products{--section-accent:var(--ts-orange)}
.new-products-section{--section-accent:var(--ts-cyan)}
.best-sellers-section{--section-accent:var(--ts-purple)}
.product-rail-section .rail-footer .scroll-btn:hover{
  color:var(--section-accent,var(--ts-blue))!important;
  border-color:color-mix(in srgb,var(--section-accent,var(--ts-blue)) 38%,var(--ts-line))!important;
  background:color-mix(in srgb,var(--section-accent,var(--ts-blue)) 8%,var(--ts-surface))!important;
}

/* Brands: colored glow per tile */
.brand-logo-card{--brand-accent:var(--ts-blue);position:relative;overflow:hidden;transition:background .2s ease,border-color .2s ease}
.brand-logo-card:nth-child(6n+1){--brand-accent:var(--ts-cyan)}
.brand-logo-card:nth-child(6n+2){--brand-accent:var(--ts-purple)}
.brand-logo-card:nth-child(6n+3){--brand-accent:var(--ts-pink)}
.brand-logo-card:nth-child(6n+4){--brand-accent:var(--ts-orange)}
.brand-logo-card:nth-child(6n+5){--brand-accent:var(--ts-green)}
.brand-logo-card:nth-child(6n+6){--brand-accent:var(--ts-indigo)}
.brand-logo-card::before{
  content:"";
  position:absolute;
  inset:auto 18% 0;
  height:2px;
  border-radius:999px;
  background:var(--brand-accent);
  opacity:.56;
}
.brand-logo-card:hover{
  background:linear-gradient(180deg,color-mix(in srgb,var(--brand-accent) 9%,var(--ts-surface)),var(--ts-surface))!important;
}
.brand-logo-card:hover span{color:var(--brand-accent)!important}

/* Feature cards: each benefit gets its own color */
.apple-features .trust-item{--feature-accent:var(--ts-blue)}
.apple-features .trust-item:nth-child(4n+1){--feature-accent:var(--ts-cyan)}
.apple-features .trust-item:nth-child(4n+2){--feature-accent:var(--ts-orange)}
.apple-features .trust-item:nth-child(4n+3){--feature-accent:var(--ts-green)}
.apple-features .trust-item:nth-child(4n+4){--feature-accent:var(--ts-purple)}
.apple-features .feature-icon{
  color:var(--feature-accent)!important;
  background:color-mix(in srgb,var(--feature-accent) 10%,var(--ts-surface))!important;
  border-color:color-mix(in srgb,var(--feature-accent) 26%,var(--ts-line))!important;
}
.apple-features .trust-item::before{
  background:radial-gradient(circle,color-mix(in srgb,var(--feature-accent) 16%,transparent),transparent 70%)!important;
}
.apple-features .trust-item:hover{
  border-color:color-mix(in srgb,var(--feature-accent) 38%,var(--ts-line))!important;
  box-shadow:0 14px 36px color-mix(in srgb,var(--feature-accent) 10%,transparent)!important;
}

/* Shop and customer pages */
.shop-hero-panel{
  background:
    radial-gradient(circle at 82% 0,rgba(34,211,238,.11),transparent 27%),
    radial-gradient(circle at 18% 100%,rgba(139,92,246,.10),transparent 30%),
    var(--ts-surface)!important;
}
.shop-hero-panel h1{
  background:linear-gradient(105deg,var(--ts-text) 15%,#a78bfa 62%,#67e8f9 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent!important;
}
.filter-toggle-row input,
input[type="checkbox"],
input[type="radio"]{accent-color:var(--ts-purple)}
.form-control:focus,
.auth-form input:focus,
.auth-form select:focus,
.auth-form textarea:focus{
  border-color:rgba(139,92,246,.52)!important;
  box-shadow:0 0 0 4px rgba(139,92,246,.10)!important;
}

/* Cart, floating controls and mobile nav */
.cart-drawer .btn-primary,
.cart-drawer-actions .btn-primary{
  background:linear-gradient(135deg,var(--ts-blue),var(--ts-purple))!important;
}
#topButton:hover{
  color:#fff!important;
  border-color:transparent!important;
  background:linear-gradient(135deg,var(--ts-purple),var(--ts-pink))!important;
}
.mb-item:hover,.mb-item.active{color:#a78bfa!important}

/* Footer gets a controlled spectrum line and varied headings */
.footer{
  position:relative;
  background:
    radial-gradient(circle at 18% 0,rgba(139,92,246,.055),transparent 25%),
    radial-gradient(circle at 88% 15%,rgba(34,211,238,.045),transparent 22%),
    var(--ts-surface)!important;
}
.footer::before{
  content:"";
  position:absolute;
  top:0;
  right:0;
  left:0;
  height:2px;
  background:linear-gradient(90deg,var(--ts-cyan),var(--ts-blue),var(--ts-purple),var(--ts-pink),var(--ts-orange));
  opacity:.82;
}
.footer-col:nth-child(2) h3{color:#67e8f9!important}
.footer-col:nth-child(3) h3{color:#c4b5fd!important}
.footer-col:nth-child(4) h3{color:#6ee7b7!important}
.footer-links a:hover{color:#a78bfa!important}
.social-link:nth-child(5n+1):hover{color:var(--ts-pink)!important;border-color:rgba(244,114,182,.30)!important}
.social-link:nth-child(5n+2):hover{color:var(--ts-cyan)!important;border-color:rgba(34,211,238,.30)!important}
.social-link:nth-child(5n+3):hover{color:var(--ts-green)!important;border-color:rgba(52,211,153,.30)!important}
.social-link:nth-child(5n+4):hover{color:var(--ts-purple)!important;border-color:rgba(139,92,246,.30)!important}
.social-link:nth-child(5n+5):hover{color:var(--ts-orange)!important;border-color:rgba(251,146,60,.30)!important}

/* Light mode keeps the same identities with softer fills */
body:not(.dark) .apple-hero{
  background:
    radial-gradient(circle at 78% 18%,rgba(34,211,238,.10),transparent 27%),
    radial-gradient(circle at 20% 82%,rgba(139,92,246,.10),transparent 30%),
    #f7f8fb!important;
}
body:not(.dark) .apple-display-title{
  background:linear-gradient(105deg,#111827 4%,#4f46e5 50%,#0284c7 76%,#db2777 100%);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent!important;
}
body:not(.dark) .apple-categories{
  background:
    radial-gradient(circle at 88% 16%,rgba(52,211,153,.08),transparent 25%),
    #fff!important;
}
body:not(.dark) .special-products,
body:not(.dark) .new-products-section,
body:not(.dark) .best-sellers-section{background-color:#f8f9fc!important}

@media(max-width:620px){
  .apple-display-title{
    background:linear-gradient(105deg,#f8fafc 8%,#c4b5fd 58%,#7dd3fc 100%);
    -webkit-background-clip:text;
    background-clip:text;
  }
  .category-mini-card::before{width:2px}
  .product-card::before{right:8px;left:8px}
}


/* =========================================================
   Light Mode Contrast Safety
   Prevent decorative gradients / muted tones from hiding text.
   ========================================================= */
body:not(.dark){
  --ts-text:#111827;
  --ts-muted:#4b5563;
  --ts-line:rgba(17,24,39,.11);
  --ts-line-strong:rgba(17,24,39,.20);
}

/* Critical hero copy: never allow transparent text in light mode. */
body:not(.dark) .apple-display-title{
  background:none!important;
  color:#111827!important;
  -webkit-text-fill-color:#111827!important;
  text-shadow:0 1px 0 rgba(255,255,255,.55);
}
body:not(.dark) .apple-eyebrow{
  color:#475569!important;
}
body:not(.dark) .apple-display-subtitle{
  color:#4b5563!important;
}
body:not(.dark) .apple-hero-proof{
  border-color:rgba(17,24,39,.12)!important;
}
body:not(.dark) .apple-hero-proof>div{
  border-color:rgba(17,24,39,.12)!important;
}
body:not(.dark) .apple-hero-proof strong{
  color:#111827!important;
}
body:not(.dark) .apple-hero-proof span{
  color:#64748b!important;
}
body:not(.dark) .apple-link-btn{
  color:#0284c7!important;
}

/* Section headings and descriptions */
body:not(.dark) .section-head-copy h2,
body:not(.dark) .apple-section-head h2{
  color:#111827!important;
  -webkit-text-fill-color:#111827!important;
}
body:not(.dark) .section-head-copy p{
  color:#5b6472!important;
}
body:not(.dark) .section-link{
  color:#2563eb!important;
}
body:not(.dark) .section-kicker{
  font-weight:800!important;
}
body:not(.dark) .apple-tech-worlds .section-kicker{color:#0891b2!important}
body:not(.dark) .apple-categories .section-kicker{color:#059669!important}
body:not(.dark) .special-products .section-kicker{color:#ea580c!important}
body:not(.dark) .new-products-section .section-kicker{color:#0891b2!important}
body:not(.dark) .best-sellers-section .section-kicker{color:#7c3aed!important}
body:not(.dark) .brands-section .section-kicker{color:#db2777!important}

/* Header / search */
body:not(.dark) .header nav>ul>li>a,
body:not(.dark) .header .nav-dropdown-toggle,
body:not(.dark) .header .nav-theme-btn{
  color:#1f2937!important;
}
body:not(.dark) .search-form input{
  color:#111827!important;
}
body:not(.dark) .search-form input::placeholder{
  color:#6b7280!important;
  opacity:1!important;
}

/* Categories */
body:not(.dark) .category-mini-copy strong,
body:not(.dark) .category-card h3{
  color:#111827!important;
}
body:not(.dark) .category-mini-copy>span,
body:not(.dark) .category-subcats{
  color:#64748b!important;
}
body:not(.dark) .category-mini-arrow{
  color:#64748b!important;
}

/* Product cards */
body:not(.dark) .product-card{
  color:#111827!important;
}
body:not(.dark) .product-card-title,
body:not(.dark) .price{
  color:#111827!important;
}
body:not(.dark) .product-card-meta,
body:not(.dark) .price-old,
body:not(.dark) .stock-line{
  color:#64748b!important;
}
body:not(.dark) .product-card-footer{
  border-color:rgba(17,24,39,.10)!important;
}
body:not(.dark) .pc-floating-actions button,
body:not(.dark) .wishlist-btn,
body:not(.dark) .card-action{
  color:#1f2937!important;
  background:rgba(255,255,255,.94)!important;
  border-color:rgba(17,24,39,.12)!important;
}

/* Brands */
body:not(.dark) .brand-logo-card span,
body:not(.dark) .brand-logo-fallback{
  color:#374151!important;
}
body:not(.dark) .brand-logo-card:hover span{
  color:var(--brand-accent)!important;
}

/* Feature cards */
body:not(.dark) .apple-features h3{
  color:#111827!important;
}
body:not(.dark) .apple-features p{
  color:#5b6472!important;
}

/* Shop filters / secondary surfaces */
body:not(.dark) .shop-result-count,
body:not(.dark) .filter-toggle-row,
body:not(.dark) .field-help,
body:not(.dark) .muted,
body:not(.dark) .auth-hint{
  color:#5b6472!important;
}
body:not(.dark) .shop-result-count strong,
body:not(.dark) .filter-section-title,
body:not(.dark) .form-group label{
  color:#111827!important;
}

/* Footer */
body:not(.dark) .footer{
  color:#111827!important;
}
body:not(.dark) .footer h2,
body:not(.dark) .footer h3{
  color:#111827!important;
}
body:not(.dark) .footer-about,
body:not(.dark) .footer-contact,
body:not(.dark) .footer-links a,
body:not(.dark) .footer-bottom{
  color:#5b6472!important;
}
body:not(.dark) .footer-links a:hover{
  color:#6d28d9!important;
}

/* Preserve readable overlay text over product imagery. */
body:not(.dark) .hero-product-title{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}


/* =========================================================
   Dark Mode Contrast Safety
   Keep decorative color while guaranteeing readable copy.
   ========================================================= */
body.dark{
  --ts-text:#f8fafc;
  --ts-muted:#b8c0cc;
  --ts-line:rgba(255,255,255,.11);
  --ts-line-strong:rgba(255,255,255,.19);
}

/* Critical hero copy: solid fallback avoids transparent gradient failures. */
body.dark .apple-display-title{
  background:none!important;
  color:#f8fafc!important;
  -webkit-text-fill-color:#f8fafc!important;
  text-shadow:0 2px 24px rgba(139,92,246,.12);
}
body.dark .apple-eyebrow{
  color:#cbd5e1!important;
}
body.dark .apple-display-subtitle{
  color:#b8c0cc!important;
}
body.dark .apple-hero-proof{
  border-color:rgba(255,255,255,.13)!important;
}
body.dark .apple-hero-proof>div{
  border-color:rgba(255,255,255,.13)!important;
}
body.dark .apple-hero-proof strong{
  color:#f8fafc!important;
}
body.dark .apple-hero-proof span{
  color:#aab4c2!important;
}
body.dark .apple-link-btn{
  color:#67e8f9!important;
}

/* Section titles and supporting copy */
body.dark .section-head-copy h2,
body.dark .apple-section-head h2{
  color:#f8fafc!important;
  -webkit-text-fill-color:#f8fafc!important;
}
body.dark .section-head-copy p{
  color:#aeb7c4!important;
}
body.dark .section-link{
  color:#7dd3fc!important;
}
body.dark .section-kicker{
  font-weight:800!important;
}
body.dark .apple-tech-worlds .section-kicker{color:#67e8f9!important}
body.dark .apple-categories .section-kicker{color:#6ee7b7!important}
body.dark .special-products .section-kicker{color:#fdba74!important}
body.dark .new-products-section .section-kicker{color:#67e8f9!important}
body.dark .best-sellers-section .section-kicker{color:#c4b5fd!important}
body.dark .brands-section .section-kicker{color:#f9a8d4!important}

/* Header / search */
body.dark .header nav>ul>li>a,
body.dark .header .nav-dropdown-toggle,
body.dark .header .nav-theme-btn{
  color:#f3f4f6!important;
}
body.dark .search-form input{
  color:#f8fafc!important;
}
body.dark .search-form input::placeholder{
  color:#9ca3af!important;
  opacity:1!important;
}

/* Categories */
body.dark .category-mini-copy strong,
body.dark .category-card h3{
  color:#f8fafc!important;
}
body.dark .category-mini-copy>span,
body.dark .category-subcats{
  color:#aab4c2!important;
}
body.dark .category-mini-arrow{
  color:#9ca3af!important;
}

/* Product cards */
body.dark .product-card{
  color:#f8fafc!important;
}
body.dark .product-card-title,
body.dark .price{
  color:#f8fafc!important;
}
body.dark .product-card-meta,
body.dark .price-old,
body.dark .stock-line{
  color:#aab4c2!important;
}
body.dark .product-card-footer{
  border-color:rgba(255,255,255,.10)!important;
}
body.dark .pc-floating-actions button,
body.dark .wishlist-btn,
body.dark .card-action{
  color:#f8fafc!important;
  background:rgba(17,17,19,.92)!important;
  border-color:rgba(255,255,255,.12)!important;
}

/* Brands and feature cards */
body.dark .brand-logo-card span,
body.dark .brand-logo-fallback{
  color:#d1d5db!important;
}
body.dark .brand-logo-card:hover span{
  color:var(--brand-accent)!important;
}
body.dark .apple-features h3{
  color:#f8fafc!important;
}
body.dark .apple-features p{
  color:#aeb7c4!important;
}

/* Shop / forms / footer */
body.dark .shop-result-count,
body.dark .filter-toggle-row,
body.dark .field-help,
body.dark .muted,
body.dark .auth-hint{
  color:#aeb7c4!important;
}
body.dark .shop-result-count strong,
body.dark .filter-section-title,
body.dark .form-group label{
  color:#f8fafc!important;
}
body.dark .footer{
  color:#f8fafc!important;
}
body.dark .footer h2,
body.dark .footer h3{
  color:#f8fafc!important;
}
body.dark .footer-about,
body.dark .footer-contact,
body.dark .footer-links a,
body.dark .footer-bottom{
  color:#aeb7c4!important;
}
body.dark .footer-links a:hover{
  color:#c4b5fd!important;
}

/* Hero image overlay remains intentionally white. */
body.dark .hero-product-title{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}


/* Dedicated product-carousel navigation: isolated from legacy rail controls. */
.products-scroll-wrap{
  position:relative!important;
  overflow:visible!important;
}
.product-rail-nav{
  position:absolute!important;
  inset:0!important;
  z-index:60!important;
  display:block!important;
  pointer-events:none!important;
  margin:0!important;
}
.product-rail-nav.is-static{
  display:none!important;
}
.product-rail-arrow{
  position:absolute!important;
  top:50%!important;
  transform:translateY(-50%)!important;
  width:44px!important;
  height:44px!important;
  border:1px solid color-mix(in srgb,var(--section-accent,var(--ts-blue)) 42%,var(--ts-line))!important;
  border-radius:999px!important;
  display:grid!important;
  place-items:center!important;
  background:rgba(18,18,22,.88)!important;
  color:#fff!important;
  cursor:pointer!important;
  pointer-events:auto!important;
  opacity:1!important;
  visibility:visible!important;
  backdrop-filter:blur(14px)!important;
  -webkit-backdrop-filter:blur(14px)!important;
  box-shadow:0 12px 34px rgba(0,0,0,.28)!important;
  transition:transform .18s ease,background .18s ease,border-color .18s ease,opacity .18s ease!important;
}
body:not(.dark) .product-rail-arrow{
  background:rgba(255,255,255,.94)!important;
  color:#111827!important;
  box-shadow:0 10px 28px rgba(15,23,42,.15)!important;
}
.product-rail-arrow-prev{right:8px!important}
.product-rail-arrow-next{left:8px!important}
.product-rail-arrow:hover{
  color:#fff!important;
  border-color:transparent!important;
  background:linear-gradient(135deg,var(--section-accent,var(--ts-blue)),var(--ts-purple))!important;
}
.product-rail-arrow-prev:hover{transform:translateY(-50%) translateX(2px)!important}
.product-rail-arrow-next:hover{transform:translateY(-50%) translateX(-2px)!important}
.product-rail-arrow:disabled{
  opacity:.28!important;
  cursor:default!important;
  pointer-events:none!important;
  filter:saturate(.4);
}
.product-rail-arrow:focus-visible{
  outline:2px solid var(--section-accent,var(--ts-blue))!important;
  outline-offset:3px!important;
}
@media(max-width:900px){
  .product-rail-arrow{
    width:36px!important;
    height:36px!important;
    font-size:.72rem!important;
  }
  .product-rail-arrow-prev{right:2px!important}
  .product-rail-arrow-next{left:2px!important}
}


/* Final desktop technology-world layout: keep Mobile + Laptop side-by-side. */
@media (min-width:901px){
  .apple-tech-worlds .tech-world-grid{
    display:grid!important;
    grid-template-columns:minmax(320px,360px) minmax(460px,520px)!important;
    grid-auto-flow:row!important;
    justify-content:center!important;
    align-items:stretch!important;
    gap:16px!important;
    direction:rtl;
  }

  .apple-tech-worlds .tech-world-mobile{
    grid-column:1!important;
    grid-row:1!important;
    width:100%!important;
    height:510px!important;
    min-height:510px!important;
    aspect-ratio:auto!important;
    justify-self:stretch!important;
    align-self:stretch!important;
  }

  .apple-tech-worlds .tech-world-laptop{
    grid-column:2!important;
    grid-row:1!important;
    width:100%!important;
    height:510px!important;
    min-height:510px!important;
    justify-self:stretch!important;
    align-self:stretch!important;
  }

  .apple-tech-worlds .tech-world-gaming{
    grid-column:1 / -1!important;
    grid-row:2!important;
    width:100%!important;
    min-height:460px!important;
    justify-self:stretch!important;
  }

  .apple-tech-worlds .tech-world-mobile,
  .apple-tech-worlds .tech-world-laptop{
    border-radius:28px!important;
    box-shadow:0 22px 58px rgba(0,0,0,.18)!important;
  }
}


/* =========================================================
   Simplified product filter UX
   ========================================================= */
.filter-sidebar{
  align-self:start!important;
}
.filter-sidebar-inner[data-filter-panel]{
  position:sticky!important;
  top:calc(var(--ts-header-h) + 14px)!important;
  max-height:calc(100vh - var(--ts-header-h) - 28px)!important;
  display:flex!important;
  flex-direction:column!important;
  overflow:hidden!important;
  border:1px solid var(--ts-line)!important;
  border-radius:20px!important;
  background:var(--ts-surface)!important;
  box-shadow:0 16px 42px rgba(0,0,0,.08)!important;
}
.filter-sidebar-head{
  flex:0 0 auto;
  min-height:64px!important;
  padding:12px 14px!important;
  background:color-mix(in srgb,var(--ts-surface) 94%,transparent)!important;
}
.filter-sidebar-title{
  min-width:0;
  display:flex;
  align-items:center;
  gap:10px;
}
.filter-sidebar-icon{
  width:34px;
  height:34px;
  flex:0 0 34px;
  border-radius:11px;
  display:grid;
  place-items:center;
  color:#fff;
  background:linear-gradient(135deg,var(--ts-blue),var(--ts-purple));
  box-shadow:0 7px 18px rgba(99,102,241,.18);
}
.filter-sidebar-title>span:last-child{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}
.filter-sidebar-title strong{
  color:var(--ts-text);
  font-size:.82rem;
  line-height:1.4;
}
.filter-sidebar-title small{
  color:var(--ts-muted);
  font-size:.59rem;
  line-height:1.5;
  white-space:nowrap;
}
.filter-active-count{
  min-width:24px;
  height:24px;
  padding:0 7px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:rgba(139,92,246,.12);
  color:#a78bfa;
  font-size:.66rem;
  font-weight:800;
}
.filter-sidebar-mobile-close{
  width:32px!important;
  height:32px!important;
  padding:0!important;
  border:1px solid var(--ts-line)!important;
  border-radius:10px!important;
  background:var(--ts-surface-soft)!important;
  color:var(--ts-text)!important;
  place-items:center!important;
  cursor:pointer;
}

.filter-sidebar-body{
  min-height:0;
  flex:1 1 auto;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:color-mix(in srgb,var(--ts-muted) 35%,transparent) transparent;
}
.filter-sidebar-body::-webkit-scrollbar{width:5px}
.filter-sidebar-body::-webkit-scrollbar-thumb{
  border-radius:999px;
  background:color-mix(in srgb,var(--ts-muted) 30%,transparent);
}

.filter-quick-section,
.filter-section-primary{
  padding:14px!important;
  border-bottom:1px solid var(--ts-line)!important;
}
.filter-mini-head{
  margin-bottom:10px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.filter-mini-head strong{
  color:var(--ts-text);
  font-size:.75rem;
}
.filter-mini-head>span{
  color:var(--ts-muted);
  font-size:.58rem;
}
.filter-quick-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px;
}
.filter-quick-pill{
  position:relative;
  cursor:pointer;
}
.filter-quick-pill:last-child{
  grid-column:1 / -1;
}
.filter-quick-pill input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}
.filter-quick-pill>span{
  min-height:36px;
  padding:0 9px;
  border:1px solid var(--ts-line);
  border-radius:11px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  background:var(--ts-surface-soft);
  color:var(--ts-muted);
  font-size:.65rem;
  font-weight:650;
  transition:.18s ease;
}
.filter-quick-pill>span i{
  font-size:.66rem;
}
.filter-quick-pill:hover>span{
  color:var(--ts-text);
  border-color:var(--ts-line-strong);
}
.filter-quick-pill input:checked+span{
  color:#fff;
  border-color:transparent;
  background:linear-gradient(135deg,var(--ts-blue),var(--ts-purple));
  box-shadow:0 7px 20px rgba(99,102,241,.16);
}

.filter-section-primary.filter-section{
  padding:14px!important;
}
.filter-section-primary+.filter-section-primary{
  border-top:0!important;
}
.filter-search-box{
  height:36px;
  padding:0 10px;
  border:1px solid var(--ts-line);
  border-radius:11px;
  display:flex;
  align-items:center;
  gap:7px;
  background:var(--ts-surface-soft);
}
.filter-search-box>i{
  color:var(--ts-muted);
  font-size:.67rem;
}
.filter-search-box .brand-search-input{
  width:100%;
  min-width:0;
  height:100%;
  padding:0!important;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  color:var(--ts-text)!important;
  font-size:.68rem!important;
  box-shadow:none!important;
}
.filter-search-box .brand-search-input::placeholder{
  color:var(--ts-muted)!important;
}
.filter-brand-list{
  max-height:170px!important;
  margin-top:8px;
  padding-inline-end:2px;
  overflow:auto;
}
.filter-brand-list .brand-check-item{
  min-height:35px;
  padding:5px 6px!important;
  display:grid;
  grid-template-columns:18px 28px minmax(0,1fr) auto;
  align-items:center;
  gap:7px;
  border-radius:9px!important;
  color:var(--ts-muted);
  font-size:.67rem;
}
.filter-brand-list .brand-check-item:hover{
  background:var(--ts-surface-soft);
  color:var(--ts-text);
}
.filter-brand-logo{
  width:26px;
  height:18px;
  object-fit:contain;
}
.filter-brand-list .brand-check-count{
  color:var(--ts-muted);
  font-size:.58rem;
}

.filter-accordion{
  border-bottom:1px solid var(--ts-line);
}
.filter-accordion>summary{
  min-height:46px;
  padding:0 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  list-style:none;
  cursor:pointer;
  color:var(--ts-text);
  font-size:.72rem;
  font-weight:700;
  user-select:none;
}
.filter-accordion>summary::-webkit-details-marker{display:none}
.filter-accordion>summary>span{
  display:flex;
  align-items:center;
  gap:8px;
}
.filter-accordion>summary>span>i{
  width:20px;
  color:var(--ts-muted);
  text-align:center;
  font-size:.67rem;
}
.filter-accordion-arrow{
  color:var(--ts-muted);
  font-size:.62rem;
  transition:transform .2s ease;
}
.filter-accordion[open] .filter-accordion-arrow{
  transform:rotate(180deg);
}
.filter-accordion[open]>summary{
  color:var(--ts-blue);
}
.filter-accordion-content{
  padding:0 14px 14px;
}
.filter-accordion-stack{
  display:flex;
  flex-direction:column;
  gap:16px;
}
.filter-subtitle{
  display:block;
  margin-bottom:7px;
  color:var(--ts-muted);
  font-size:.61rem;
  font-weight:700;
}
.filter-option-grid{
  gap:6px!important;
}
.filter-option-grid-three{
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
}
.filter-choice{
  min-height:34px!important;
  padding:6px 7px!important;
  border-radius:10px!important;
  font-size:.66rem!important;
}
.filter-category-list{
  max-height:220px!important;
}
.filter-category-item,
.rating-filter-item{
  min-height:34px;
  padding:7px 8px!important;
  border-radius:9px!important;
  font-size:.66rem!important;
}
.rating-filter-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.rating-stars{
  white-space:nowrap;
}
.filter-radio-list .filter-toggle-row,
.filter-extra-checks .filter-toggle-row{
  min-height:34px!important;
  padding:4px 2px!important;
  font-size:.67rem;
}
.filter-extra-checks{
  margin-top:8px;
  padding-top:8px;
  border-top:1px dashed var(--ts-line);
}
.filter-toggle-row input{
  width:15px;
  height:15px;
  flex:0 0 15px;
}

.filter-section-primary .price-range-slider{
  margin-top:4px;
}
.filter-section-primary .price-range-labels{
  margin-top:10px;
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:5px;
  color:var(--ts-muted);
  font-size:.57rem;
}
.filter-section-primary .price-range-labels span:first-child{text-align:right}
.filter-section-primary .price-range-labels span:last-child{text-align:left}

.filter-actions-sticky{
  flex:0 0 auto;
  padding:10px 12px;
  border-top:1px solid var(--ts-line);
  display:grid;
  grid-template-columns:auto 1fr;
  gap:7px;
  background:color-mix(in srgb,var(--ts-surface) 94%,transparent);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}
.filter-reset-btn,
.filter-apply-btn{
  min-height:38px;
  border-radius:11px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  cursor:pointer;
  font-size:.68rem;
  font-weight:750;
  transition:.18s ease;
}
.filter-reset-btn{
  padding:0 11px;
  border:1px solid var(--ts-line);
  background:var(--ts-surface-soft);
  color:var(--ts-muted);
}
.filter-reset-btn:hover{
  color:var(--ts-text);
  border-color:var(--ts-line-strong);
}
.filter-apply-btn{
  padding:0 14px;
  border:0;
  background:linear-gradient(135deg,var(--ts-blue),var(--ts-purple));
  color:#fff;
  box-shadow:0 8px 22px rgba(99,102,241,.18);
}
.filter-apply-btn:not(:disabled):hover{
  transform:translateY(-1px);
  box-shadow:0 10px 26px rgba(99,102,241,.25);
}
.filter-apply-btn:disabled{
  opacity:.38;
  cursor:default;
  box-shadow:none;
}
.filter-apply-btn.is-dirty{
  opacity:1;
}

/* Keep the desktop filter visually compact. */
@media (min-width:993px){
  .shop-layout{
    gap:18px!important;
    align-items:start!important;
  }
  .filter-sidebar{
    min-width:260px;
    max-width:286px;
  }
  .shop-filter-toggle{
    display:none!important;
  }
}

/* Drawer uses the same simplified hierarchy on tablets/mobile. */
@media (max-width:992px){
  .filter-sidebar-inner[data-filter-panel]{
    position:static!important;
    top:auto!important;
    max-height:none!important;
    height:100%!important;
    border-radius:0!important;
    box-shadow:none!important;
  }
  .filter-sidebar-body{
    flex:1 1 auto!important;
    overflow-y:auto!important;
  }
  .filter-actions-sticky{
    position:sticky;
    bottom:0;
    z-index:4;
    padding-bottom:max(10px,env(safe-area-inset-bottom));
  }
  .filter-sidebar-title small{
    white-space:normal;
  }
}


/* Interactive star picker inside product filters */
.filter-star-picker{
  padding:4px 0 2px;
}
.filter-star-buttons{
  direction:ltr;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
}
.filter-star-btn{
  width:38px;
  height:38px;
  padding:0;
  border:1px solid var(--ts-line);
  border-radius:11px;
  display:grid;
  place-items:center;
  background:var(--ts-surface-soft);
  color:color-mix(in srgb,var(--ts-muted) 55%,transparent);
  cursor:pointer;
  transition:transform .16s ease,border-color .16s ease,background .16s ease,color .16s ease,box-shadow .16s ease;
}
.filter-star-btn i{
  font-size:1rem;
  pointer-events:none;
}
.filter-star-btn:hover,
.filter-star-btn:focus-visible{
  transform:translateY(-2px) scale(1.04);
  outline:none;
  border-color:rgba(251,191,36,.48);
}
.filter-star-btn.is-filled{
  color:var(--ts-amber);
  border-color:rgba(251,191,36,.28);
  background:rgba(251,191,36,.08);
}
.filter-star-btn.is-preview{
  color:#fbbf24;
  border-color:rgba(251,191,36,.42);
  background:rgba(251,191,36,.11);
  box-shadow:0 6px 18px rgba(251,191,36,.10);
}
.filter-star-btn[aria-pressed="true"]{
  box-shadow:0 0 0 2px rgba(251,191,36,.13),0 7px 18px rgba(251,191,36,.10);
}
.filter-star-caption{
  min-height:28px;
  margin-top:8px;
  padding:0 3px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  color:var(--ts-muted);
  font-size:.61rem;
}
.filter-star-clear{
  padding:3px 7px;
  border:0;
  border-radius:7px;
  background:transparent;
  color:var(--ts-muted);
  font:inherit;
  cursor:pointer;
}
.filter-star-clear:hover{
  color:var(--ts-rose);
  background:rgba(251,113,133,.08);
}
.filter-star-clear[hidden]{
  display:none!important;
}
@media(max-width:420px){
  .filter-star-buttons{gap:4px}
  .filter-star-btn{width:36px;height:36px}
}


/* Themed product sorting dropdown */
.shop-sort-wrap{
  display:flex;
  align-items:center;
  gap:9px;
  position:relative;
}
.shop-sort-label{
  color:var(--ts-muted);
  font-size:.68rem;
  font-weight:650;
  white-space:nowrap;
}
.shop-sort-menu{
  position:relative;
  min-width:156px;
}
.shop-sort-menu>summary{
  list-style:none;
}
.shop-sort-menu>summary::-webkit-details-marker{display:none}
.shop-sort-trigger{
  min-height:40px;
  padding:0 10px 0 9px;
  border:1px solid var(--ts-line);
  border-radius:12px;
  display:grid;
  grid-template-columns:28px minmax(0,1fr) 16px;
  align-items:center;
  gap:7px;
  background:var(--ts-surface);
  color:var(--ts-text);
  cursor:pointer;
  user-select:none;
  transition:border-color .18s ease,background .18s ease,box-shadow .18s ease;
}
.shop-sort-trigger:hover{
  border-color:color-mix(in srgb,var(--ts-purple) 42%,var(--ts-line));
  background:color-mix(in srgb,var(--ts-purple) 5%,var(--ts-surface));
}
.shop-sort-menu[open] .shop-sort-trigger{
  border-color:rgba(139,92,246,.48);
  box-shadow:0 0 0 3px rgba(139,92,246,.10);
}
.shop-sort-trigger-icon{
  width:28px;
  height:28px;
  border-radius:9px;
  display:grid;
  place-items:center;
  color:#c4b5fd;
  background:rgba(139,92,246,.10);
  font-size:.67rem;
}
.shop-sort-current{
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  font-size:.70rem;
  font-weight:720;
}
.shop-sort-chevron{
  color:var(--ts-muted);
  font-size:.58rem;
  transition:transform .18s ease;
}
.shop-sort-menu[open] .shop-sort-chevron{
  transform:rotate(180deg);
}
.shop-sort-dropdown{
  position:absolute;
  z-index:120;
  top:calc(100% + 7px);
  inset-inline-end:0;
  width:100%;
  min-width:178px;
  padding:6px;
  border:1px solid var(--ts-line);
  border-radius:14px;
  background:color-mix(in srgb,var(--ts-surface) 96%,transparent);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  box-shadow:0 18px 46px rgba(0,0,0,.24);
}
.shop-sort-option{
  width:100%;
  min-height:36px;
  padding:0 10px;
  border:0;
  border-radius:9px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  background:transparent;
  color:var(--ts-muted);
  font-family:inherit;
  font-size:.68rem;
  font-weight:650;
  text-align:right;
  cursor:pointer;
  transition:background .15s ease,color .15s ease;
}
.shop-sort-option:hover{
  color:var(--ts-text);
  background:var(--ts-surface-soft);
}
.shop-sort-option.active{
  color:#c4b5fd;
  background:rgba(139,92,246,.10);
}
.shop-sort-option.active i{
  color:var(--ts-purple);
  font-size:.62rem;
}
body:not(.dark) .shop-sort-option.active{
  color:#6d28d9;
}
body:not(.dark) .shop-sort-dropdown{
  box-shadow:0 18px 42px rgba(15,23,42,.13);
}

@media(max-width:620px){
  .shop-sort-wrap{
    width:100%;
    justify-content:flex-end;
  }
  .shop-sort-label{
    font-size:.64rem;
  }
  .shop-sort-menu{
    min-width:144px;
  }
  .shop-sort-trigger{
    min-height:38px;
  }
  .shop-sort-dropdown{
    min-width:166px;
  }
}


/* =========================================================
   Professional product rails v2
   One stable visual system for special/new/best-seller rails.
   ========================================================= */
.special-products{--rail-accent:var(--ts-orange)}
.new-products-section{--rail-accent:var(--ts-cyan)}
.best-sellers-section{--rail-accent:var(--ts-purple)}

.product-rail-section,
.special-products,
.new-products-section,
.best-sellers-section{
  min-height:0!important;
  height:auto!important;
  padding:clamp(44px,5vw,68px) 0!important;
}

.product-rail-section .section-head-row{
  margin-bottom:18px!important;
  align-items:flex-end!important;
}

.product-rail-section .section-link{
  min-height:38px;
  padding:0 14px;
  border:1px solid var(--ts-line);
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:color-mix(in srgb,var(--ts-surface) 88%,transparent);
  color:var(--ts-text)!important;
  font-size:.68rem;
  font-weight:700;
  text-decoration:none;
  transition:border-color .18s ease,background .18s ease,color .18s ease,transform .18s ease;
}
.product-rail-section .section-link:hover{
  transform:translateY(-1px);
  border-color:color-mix(in srgb,var(--rail-accent) 42%,var(--ts-line));
  background:color-mix(in srgb,var(--rail-accent) 8%,var(--ts-surface));
  color:var(--rail-accent)!important;
}

.product-rail-section .products-scroll-wrap{
  position:relative!important;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  padding:10px 10px 58px!important;
  border:1px solid color-mix(in srgb,var(--rail-accent) 16%,var(--ts-line))!important;
  border-radius:24px!important;
  overflow:hidden!important;
  isolation:isolate!important;
  box-sizing:border-box!important;
  background:
    radial-gradient(circle at 100% 0,color-mix(in srgb,var(--rail-accent) 7%,transparent),transparent 28%),
    color-mix(in srgb,var(--ts-surface) 72%,transparent)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
}

.product-rail-section .product-rail{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  box-sizing:border-box!important;
  display:flex!important;
  gap:14px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  padding:4px 4px 8px!important;
  scroll-padding-inline:4px!important;
  scroll-snap-type:x mandatory!important;
  scroll-behavior:smooth!important;
  overscroll-behavior-inline:contain!important;
  scrollbar-width:none!important;
}
.product-rail-section .product-rail::-webkit-scrollbar{display:none!important}

.product-rail-section .product-rail>.product-card{
  flex:0 0 clamp(182px,15.5vw,210px)!important;
  width:clamp(182px,15.5vw,210px)!important;
  max-width:210px!important;
  min-width:182px!important;
  scroll-snap-align:start!important;
  scroll-snap-stop:always!important;
  align-self:stretch!important;
}

.product-rail-section .product-card{
  overflow:hidden!important;
  border-radius:18px!important;
}

.product-rail-section .product-card-media,
.product-rail-section .product-card-image-wrap{
  overflow:hidden!important;
}

.product-rail-section .product-card-media img,
.product-rail-section .product-card-image-wrap img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
}

/* Floating compact carousel controller */
.product-rail-section .product-rail-nav{
  position:absolute!important;
  z-index:70!important;
  inset:auto!important;
  left:50%!important;
  right:auto!important;
  top:auto!important;
  bottom:10px!important;
  transform:translateX(-50%)!important;
  width:auto!important;
  min-width:136px!important;
  height:40px!important;
  padding:4px!important;
  border:1px solid color-mix(in srgb,var(--rail-accent) 24%,var(--ts-line))!important;
  border-radius:999px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:7px!important;
  pointer-events:auto!important;
  background:color-mix(in srgb,var(--ts-surface) 92%,transparent)!important;
  backdrop-filter:blur(16px)!important;
  -webkit-backdrop-filter:blur(16px)!important;
  box-shadow:0 10px 28px rgba(0,0,0,.18)!important;
}
.product-rail-section .product-rail-nav.is-static{
  display:none!important;
}

.product-rail-section .product-rail-arrow{
  position:relative!important;
  inset:auto!important;
  top:auto!important;
  right:auto!important;
  left:auto!important;
  transform:none!important;
  flex:0 0 32px!important;
  width:32px!important;
  height:32px!important;
  min-width:32px!important;
  min-height:32px!important;
  padding:0!important;
  border:0!important;
  border-radius:999px!important;
  display:grid!important;
  place-items:center!important;
  background:transparent!important;
  color:var(--ts-text)!important;
  opacity:1!important;
  visibility:visible!important;
  cursor:pointer!important;
  pointer-events:auto!important;
  box-shadow:none!important;
  font-size:.66rem!important;
  transition:background .16s ease,color .16s ease,transform .16s ease,opacity .16s ease!important;
}
.product-rail-section .product-rail-arrow:hover:not(:disabled){
  transform:scale(1.06)!important;
  background:color-mix(in srgb,var(--rail-accent) 14%,transparent)!important;
  color:var(--rail-accent)!important;
}
.product-rail-section .product-rail-arrow:active:not(:disabled){
  transform:scale(.96)!important;
}
.product-rail-section .product-rail-arrow:disabled{
  opacity:.24!important;
  cursor:default!important;
  pointer-events:none!important;
  filter:none!important;
}
.product-rail-section .product-rail-arrow:focus-visible{
  outline:2px solid var(--rail-accent)!important;
  outline-offset:2px!important;
}

.product-rail-progress{
  position:relative;
  flex:0 0 54px;
  width:54px;
  height:4px;
  overflow:hidden;
  border-radius:999px;
  background:color-mix(in srgb,var(--ts-muted) 18%,transparent);
}
.product-rail-progress-fill{
  position:absolute;
  inset-block:0;
  inset-inline-start:0;
  width:0%;
  border-radius:inherit;
  background:linear-gradient(90deg,var(--rail-accent),color-mix(in srgb,var(--rail-accent) 55%,var(--ts-purple)));
  transition:width .18s ease;
}

/* Clean empty state without oversized blank sections */
.product-rail-section .products-scroll-wrap:has(.empty-state){
  padding-bottom:10px!important;
}
.product-rail-section .products-scroll-wrap:has(.empty-state) .product-rail{
  padding:0!important;
  overflow:hidden!important;
}
.product-rail-section .empty-state{
  width:100%!important;
  min-height:150px!important;
  padding:26px!important;
  border:1px dashed color-mix(in srgb,var(--rail-accent) 22%,var(--ts-line))!important;
  border-radius:18px!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  background:color-mix(in srgb,var(--rail-accent) 4%,var(--ts-surface-soft))!important;
  color:var(--ts-muted)!important;
}
.product-rail-section .empty-state h3{
  margin:0 0 6px!important;
  color:var(--ts-text)!important;
  font-size:.82rem!important;
}
.product-rail-section .empty-state p{
  margin:0!important;
  font-size:.66rem!important;
  line-height:1.7!important;
}

body:not(.dark) .product-rail-section .product-rail-nav{
  box-shadow:0 9px 24px rgba(15,23,42,.10)!important;
}

@media(max-width:900px){
  .product-rail-section,
  .special-products,
  .new-products-section,
  .best-sellers-section{
    padding:42px 0!important;
  }

  .product-rail-section .section-head-row{
    margin-bottom:14px!important;
  }

  .product-rail-section .products-scroll-wrap{
    padding:8px 8px 54px!important;
    border-radius:20px!important;
  }

  .product-rail-section .product-rail{
    gap:10px!important;
  }

  .product-rail-section .product-rail>.product-card{
    flex-basis:min(58vw,194px)!important;
    width:min(58vw,194px)!important;
    min-width:min(58vw,194px)!important;
  }

  .product-rail-section .product-rail-nav{
    bottom:8px!important;
    min-width:128px!important;
    height:38px!important;
  }

  .product-rail-section .product-rail-arrow{
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
    min-height:30px!important;
  }

  .product-rail-progress{
    flex-basis:50px;
    width:50px;
  }
}


/* Managed homepage slides */
.hero-managed-card{
  position:relative;
  width:82%;
  height:86%;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--ts-line-strong) 78%,transparent);
  border-radius:26px;
  background:var(--ts-surface-soft);
  box-shadow:0 20px 50px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.08);
}
.hero-managed-card::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(0,0,0,.04) 20%,rgba(0,0,0,.20) 56%,rgba(0,0,0,.76) 100%);
}
.hero-managed-card>img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}
.hero-managed-overlay{
  position:absolute;
  z-index:3;
  right:22px;
  left:22px;
  bottom:22px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:8px;
  color:#fff;
}
.hero-managed-kicker{
  display:inline-flex;
  align-items:center;
  min-height:25px;
  padding:3px 9px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:999px;
  background:rgba(15,15,18,.34);
  backdrop-filter:blur(10px);
  font-size:.66rem;
  font-weight:700;
}
.hero-managed-title{
  max-width:90%;
  font-size:clamp(1.2rem,2.3vw,2.25rem);
  line-height:1.12;
  font-weight:800;
  text-shadow:0 5px 24px rgba(0,0,0,.42);
}
.hero-managed-overlay p{
  max-width:88%;
  margin:0;
  color:rgba(255,255,255,.82);
  font-size:.78rem;
  line-height:1.75;
}
.hero-managed-overlay .hero-product-view-btn{
  margin-top:3px;
}


/* Homepage hero: four random product slides */
.hero-random-slider{
  position:relative;
  min-height:clamp(430px,42vw,610px);
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--ts-line-strong) 58%,transparent);
  border-radius:30px;
  background:
    radial-gradient(circle at 18% 12%,rgba(123,67,255,.10),transparent 25%),
    radial-gradient(circle at 86% 88%,rgba(0,113,227,.09),transparent 28%),
    linear-gradient(145deg,color-mix(in srgb,var(--ts-surface) 96%,transparent),color-mix(in srgb,var(--ts-surface-soft) 92%,transparent));
  box-shadow:
    0 34px 95px rgba(0,0,0,.15),
    inset 0 1px 0 rgba(255,255,255,.04);
  isolation:isolate;
}

.hero-random-slider::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:
    linear-gradient(120deg,rgba(255,255,255,.025),transparent 28%),
    radial-gradient(circle at 50% 110%,rgba(0,113,227,.12),transparent 38%);
}

.hero-random-slider-track{
  position:absolute;
  inset:0 0 58px;
  z-index:1;
}

.hero-random-product-slide{
  position:absolute;
  inset:0;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateX(-28px) scale(.985);
  transition:
    opacity .48s ease,
    transform .62s cubic-bezier(.2,.75,.2,1),
    visibility .48s ease;
}

.hero-random-product-slide.is-active{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateX(0) scale(1);
}

.hero-random-product-link{
  position:absolute;
  inset:18px;
  display:grid;
  grid-template-rows:minmax(0,1fr) auto;
  overflow:hidden;
  border:1px solid color-mix(in srgb,var(--ts-line-strong) 74%,transparent);
  border-radius:25px;
  background:color-mix(in srgb,var(--ts-surface) 96%,transparent);
  color:var(--ts-text);
  text-decoration:none;
  box-shadow:
    0 18px 54px rgba(0,0,0,.14),
    inset 0 1px 0 rgba(255,255,255,.05);
}

.hero-random-product-visual{
  position:relative;
  min-height:0;
  display:grid;
  place-items:center;
  overflow:hidden;
  padding:clamp(20px,3vw,38px);
  background:
    radial-gradient(circle at 50% 35%,rgba(255,255,255,.98),rgba(246,247,250,.90) 72%),
    var(--ts-surface-soft);
}

body.dark .hero-random-product-visual{
  background:
    radial-gradient(circle at 50% 30%,rgba(255,255,255,.10),rgba(255,255,255,.022) 72%),
    #111114;
}

.hero-random-product-visual::after{
  content:"";
  position:absolute;
  inset:auto 10% 0;
  height:22%;
  background:radial-gradient(ellipse,rgba(0,0,0,.22),transparent 68%);
  filter:blur(16px);
  opacity:.34;
  pointer-events:none;
}

.hero-random-product-visual img{
  position:relative;
  z-index:1;
  width:100%;
  height:100%;
  max-height:360px;
  display:block;
  object-fit:contain;
  filter:drop-shadow(0 22px 28px rgba(0,0,0,.18));
  transition:transform .55s cubic-bezier(.2,.75,.2,1);
}

.hero-random-product-slide.is-active .hero-random-product-visual img{
  animation:heroRandomProductIn .72s cubic-bezier(.2,.75,.2,1) both;
}

.hero-random-product-link:hover .hero-random-product-visual img{
  transform:scale(1.035) translateY(-3px);
}

@keyframes heroRandomProductIn{
  from{opacity:.15;transform:translateY(18px) scale(.965)}
  to{opacity:1;transform:translateY(0) scale(1)}
}

.hero-random-product-content{
  position:relative;
  z-index:2;
  display:grid;
  gap:8px;
  padding:16px 18px 17px;
  border-top:1px solid var(--ts-line);
  background:
    linear-gradient(180deg,color-mix(in srgb,var(--ts-surface) 92%,transparent),var(--ts-surface));
}

.hero-random-product-meta{
  display:flex;
  align-items:center;
  gap:7px;
  min-width:0;
}

.hero-random-product-brand,
.hero-random-product-discount{
  display:inline-flex;
  align-items:center;
  min-height:23px;
  padding:3px 8px;
  border-radius:999px;
  font-size:.60rem;
  font-weight:800;
  white-space:nowrap;
}

.hero-random-product-brand{
  overflow:hidden;
  max-width:170px;
  border:1px solid var(--ts-line);
  color:var(--ts-muted);
  background:var(--ts-surface-soft);
  text-overflow:ellipsis;
}

.hero-random-product-discount{
  color:#fff;
  background:#ff453a;
  box-shadow:0 6px 18px rgba(255,69,58,.20);
}

.hero-random-product-title{
  overflow:hidden;
  color:var(--ts-text);
  font-size:clamp(.95rem,1.25vw,1.18rem);
  font-weight:800;
  line-height:1.55;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.hero-random-product-bottom{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:14px;
}

.hero-random-product-price{
  display:flex;
  flex-direction:column;
  gap:1px;
}

.hero-random-product-price del{
  color:var(--ts-muted);
  font-size:.60rem;
}

.hero-random-product-price>strong{
  color:var(--ts-blue);
  font-size:.92rem;
  font-weight:900;
  white-space:nowrap;
}

.hero-random-product-price>strong span{
  color:var(--ts-muted);
  font-size:.58rem;
  font-weight:650;
}

.hero-random-product-cta{
  flex:0 0 auto;
  min-height:34px;
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:0 12px;
  border:1px solid rgba(0,113,227,.20);
  border-radius:999px;
  color:var(--ts-blue);
  background:rgba(0,113,227,.07);
  font-size:.66rem;
  font-weight:800;
  transition:.22s ease;
}

.hero-random-product-link:hover .hero-random-product-cta{
  color:#fff;
  background:var(--ts-blue);
  border-color:var(--ts-blue);
  transform:translateX(-2px);
}

.hero-random-slider-controls{
  position:absolute;
  z-index:8;
  right:14px;
  left:14px;
  bottom:11px;
  min-height:38px;
  display:grid;
  grid-template-columns:34px minmax(0,1fr) auto 34px;
  align-items:center;
  gap:9px;
  padding:4px 6px;
  border:1px solid color-mix(in srgb,var(--ts-line-strong) 70%,transparent);
  border-radius:13px;
  background:color-mix(in srgb,var(--ts-surface) 88%,transparent);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
  box-shadow:0 10px 30px rgba(0,0,0,.12);
}

.hero-random-slider-arrow{
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  border:1px solid var(--ts-line);
  border-radius:9px;
  background:var(--ts-surface-soft);
  color:var(--ts-text);
  cursor:pointer;
  transition:.2s ease;
}

.hero-random-slider-arrow:hover{
  border-color:rgba(0,113,227,.28);
  color:#fff;
  background:var(--ts-blue);
  transform:translateY(-1px);
}

.hero-random-slider-dots{
  min-width:0;
  display:flex;
  align-items:center;
  gap:5px;
}

.hero-random-slider-dot{
  position:relative;
  flex:1 1 0;
  height:16px;
  padding:6px 0;
  border:0;
  background:transparent;
  cursor:pointer;
}

.hero-random-slider-dot>span{
  display:block;
  width:100%;
  height:3px;
  overflow:hidden;
  border-radius:999px;
  background:color-mix(in srgb,var(--ts-muted) 24%,transparent);
}

.hero-random-slider-dot>span::after{
  content:"";
  display:block;
  width:0;
  height:100%;
  border-radius:inherit;
  background:var(--ts-blue);
  transition:width .28s ease;
}

.hero-random-slider-dot.is-active>span::after{
  width:100%;
}

.hero-random-slider-count{
  display:flex;
  align-items:center;
  gap:3px;
  color:var(--ts-muted);
  font-size:.58rem;
  font-variant-numeric:tabular-nums;
}

.hero-random-slider-count [data-hero-random-current]{
  color:var(--ts-text);
  font-weight:900;
}

.hero-random-slider-empty{
  position:absolute;
  inset:18px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  border:1px dashed var(--ts-line-strong);
  border-radius:24px;
  color:var(--ts-muted);
  text-decoration:none;
}

.hero-random-slider-empty i{
  color:var(--ts-blue);
  font-size:1.35rem;
}

.hero-random-slider-empty strong{
  color:var(--ts-text);
  font-size:.86rem;
}

@media(max-width:1100px){
  .hero-random-slider{min-height:460px}
  .hero-random-product-link{inset:15px}
}

@media(max-width:900px){
  .hero-random-slider{
    width:min(100%,680px);
    min-height:clamp(430px,76vw,570px);
    margin-inline:auto;
  }
}

@media(max-width:620px){
  .hero-random-slider{
    min-height:430px;
    border-radius:22px;
  }

  .hero-random-product-link{
    inset:10px 10px 54px;
    border-radius:17px;
  }

  .hero-random-slider-track{
    inset:0;
  }

  .hero-random-product-visual{
    padding:16px;
  }

  .hero-random-product-content{
    gap:6px;
    padding:11px 12px 12px;
  }

  .hero-random-product-title{
    font-size:.78rem;
  }

  .hero-random-product-price>strong{
    font-size:.76rem;
  }

  .hero-random-product-cta{
    min-height:30px;
    padding-inline:9px;
    font-size:.59rem;
  }

  .hero-random-slider-controls{
    right:10px;
    left:10px;
    bottom:9px;
    grid-template-columns:31px minmax(0,1fr) auto 31px;
    gap:6px;
  }

  .hero-random-slider-arrow{
    width:28px;
    height:28px;
  }

  .hero-random-product-brand,
  .hero-random-product-discount{
    min-height:21px;
    font-size:.55rem;
  }
}

@media(prefers-reduced-motion:reduce){
  .hero-random-product-slide,
  .hero-random-product-visual img,
  .hero-random-slider-dot>span::after{
    transition:none!important;
    animation:none!important;
  }
}


/* =========================================================
   Professional full-width header v3
   Desktop uses the whole viewport: brand + nav + fluid search + actions.
   Mobile keeps the existing drawer/search interaction.
   ========================================================= */
@media (min-width:901px){
  .header{
    --header-inline-pad:clamp(20px,2.4vw,42px);
    min-height:68px!important;
    background:color-mix(in srgb,var(--ts-surface) 88%,transparent)!important;
    border-bottom:1px solid color-mix(in srgb,var(--ts-line-strong) 70%,transparent)!important;
    box-shadow:0 10px 34px rgba(0,0,0,.08)!important;
  }

  .header .header-top-row{
    width:calc(100% - (var(--header-inline-pad) * 2))!important;
    max-width:none!important;
    min-height:68px!important;
    margin-inline:auto!important;
    padding:9px 0!important;
    display:grid!important;
    grid-template-columns:max-content max-content minmax(300px,1fr) max-content!important;
    align-items:center!important;
    justify-content:stretch!important;
    column-gap:clamp(13px,1.5vw,24px)!important;
    row-gap:0!important;
  }

  .header .nav-toggle{
    display:none!important;
  }

  .header .logo{
    min-width:max-content!important;
    margin:0!important;
    padding:0 2px!important;
    gap:9px!important;
    justify-self:start!important;
    font-size:1rem!important;
    font-weight:800!important;
    letter-spacing:-.025em!important;
    filter:none!important;
  }

  .header .logo:hover{
    transform:none!important;
    filter:none!important;
  }

  .header .logo-img{
    width:34px!important;
    height:34px!important;
    max-width:34px!important;
    max-height:34px!important;
    object-fit:contain!important;
    border-radius:8px!important;
  }

  .header .logo-site-name{
    display:inline!important;
    font-size:1.02rem!important;
    font-weight:850!important;
    letter-spacing:-.025em!important;
  }

  .header .header-navbar{
    width:max-content!important;
    min-width:0!important;
    justify-self:start!important;
  }

  .header .header-navbar nav{
    width:auto!important;
  }

  .header .header-navbar nav>ul{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:2px!important;
    margin:0!important;
    padding:0!important;
  }

  .header .header-navbar nav>ul>li>a,
  .header .header-navbar .nav-dropdown-toggle{
    min-height:38px!important;
    padding:0 11px!important;
    border-radius:11px!important;
    gap:6px!important;
    color:var(--ts-text)!important;
    font-size:.72rem!important;
    line-height:1!important;
    font-weight:650!important;
    letter-spacing:0!important;
    background:transparent!important;
    border:1px solid transparent!important;
    transition:background .18s ease,border-color .18s ease,color .18s ease!important;
  }

  .header .header-navbar nav>ul>li>a:hover,
  .header .header-navbar .nav-dropdown-toggle:hover{
    color:var(--ts-text)!important;
    border-color:color-mix(in srgb,var(--ts-line-strong) 60%,transparent)!important;
    background:color-mix(in srgb,var(--ts-text) 5%,transparent)!important;
  }

  .header .header-navbar nav>ul>li>a::after{
    display:none!important;
  }

  /* Desktop already has the theme control in the action cluster. */
  .header .nav-theme-li{
    display:none!important;
  }

  .header .header-search{
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    height:auto!important;
    justify-self:stretch!important;
  }

  .header .header-search .search-form,
  .header .header-search.is-open .search-form{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    min-width:0!important;
    max-width:none!important;
    min-height:44px!important;
    padding:4px 6px 4px 13px!important;
    border:1px solid color-mix(in srgb,var(--ts-line-strong) 78%,transparent)!important;
    border-radius:14px!important;
    background:color-mix(in srgb,var(--ts-text) 3.5%,transparent)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
    transform:none!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
  }

  .header .header-search .search-form:focus-within{
    border-color:color-mix(in srgb,var(--ts-blue) 48%,var(--ts-line))!important;
    background:color-mix(in srgb,var(--ts-surface) 96%,transparent)!important;
    box-shadow:0 0 0 3px color-mix(in srgb,var(--ts-blue) 9%,transparent),0 8px 24px rgba(0,0,0,.09)!important;
    transform:none!important;
  }

  .header .header-search-icon{
    font-size:.72rem!important;
  }

  .header .header-search .search-form input{
    min-height:34px!important;
    font-size:.76rem!important;
    font-weight:520!important;
  }

  .header .header-search-submit{
    width:34px!important;
    height:34px!important;
    border-radius:10px!important;
    background:var(--ts-blue)!important;
    color:#fff!important;
    box-shadow:0 6px 16px color-mix(in srgb,var(--ts-blue) 22%,transparent)!important;
  }

  .header .header-search-submit:hover{
    background:var(--ts-blue-hover)!important;
    transform:translateX(-1px)!important;
  }

  .header .header-search .search-toggle{
    display:none!important;
  }

  .header .actions{
    min-width:max-content!important;
    min-height:46px!important;
    margin:0!important;
    padding:4px 5px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:4px!important;
    justify-self:end!important;
    border:1px solid color-mix(in srgb,var(--ts-line-strong) 64%,transparent)!important;
    border-radius:15px!important;
    background:color-mix(in srgb,var(--ts-text) 2.8%,transparent)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.025)!important;
  }

  .header .actions>a,
  .header .actions>button,
  .header .cart-action,
  .header .theme-toggle,
  .header .bell-btn{
    width:36px!important;
    height:36px!important;
    min-width:36px!important;
    padding:0!important;
    border:1px solid transparent!important;
    border-radius:10px!important;
    display:grid!important;
    place-items:center!important;
    background:transparent!important;
    color:var(--ts-text)!important;
    box-shadow:none!important;
  }

  .header .actions>a:hover,
  .header .actions>button:hover,
  .header .cart-action:hover,
  .header .theme-toggle:hover,
  .header .bell-btn:hover{
    border-color:color-mix(in srgb,var(--ts-line-strong) 68%,transparent)!important;
    background:color-mix(in srgb,var(--ts-text) 6%,transparent)!important;
    transform:none!important;
  }

  .header .actions .login-nav-btn,
  .header .actions .register-btn,
  .header .actions .admin-nav-btn{
    width:auto!important;
    min-width:36px!important;
    padding-inline:11px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:7px!important;
  }

  .header .actions .register-btn{
    border-color:var(--ts-blue)!important;
    background:var(--ts-blue)!important;
    color:#fff!important;
  }

  .header .actions .register-btn:hover{
    border-color:var(--ts-blue-hover)!important;
    background:var(--ts-blue-hover)!important;
  }

  .header .actions .btn-label{
    font-size:.68rem!important;
    font-weight:750!important;
  }
}

@media (min-width:901px) and (max-width:1240px){
  .header{
    --header-inline-pad:18px;
  }

  .header .header-top-row{
    grid-template-columns:max-content minmax(0,auto) minmax(250px,1fr) max-content!important;
    column-gap:8px!important;
  }

  .header .logo-site-name{
    font-size:.88rem!important;
  }

  .header .header-navbar nav>ul>li>a,
  .header .header-navbar .nav-dropdown-toggle{
    min-height:36px!important;
    padding-inline:7px!important;
    font-size:.64rem!important;
  }

  .header .actions .btn-label{
    display:none!important;
  }

  .header .actions .login-nav-btn,
  .header .actions .register-btn,
  .header .actions .admin-nav-btn{
    width:36px!important;
    padding:0!important;
  }
}

@media (min-width:901px) and (max-width:1050px){
  .header .logo-site-name{
    display:none!important;
  }

  .header .logo-img{
    width:32px!important;
    height:32px!important;
  }

  .header .header-top-row{
    grid-template-columns:max-content minmax(0,auto) minmax(220px,1fr) max-content!important;
    column-gap:6px!important;
  }

  .header .header-navbar nav>ul>li>a,
  .header .header-navbar .nav-dropdown-toggle{
    padding-inline:6px!important;
    font-size:.61rem!important;
  }

  .header .actions{
    padding-inline:3px!important;
    gap:1px!important;
  }
}


/* =========================================================
   Header search v4 — centered, Digikala-inspired
   Keep the search physically centered regardless of side cluster widths.
   ========================================================= */
@media (min-width:901px){
  .header .header-top-row{
    position:relative!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:18px!important;
  }

  .header .header-primary{
    min-width:0;
    display:flex;
    align-items:center;
    gap:clamp(12px,1.25vw,20px);
    justify-content:flex-start;
    flex:0 1 auto;
    z-index:2;
  }

  .header .header-primary .logo,
  .header .header-primary .header-navbar{
    flex:0 0 auto;
  }

  .header .header-search{
    position:absolute!important;
    top:50%!important;
    left:50%!important;
    right:auto!important;
    width:clamp(440px,40vw,700px)!important;
    min-width:0!important;
    max-width:700px!important;
    height:46px!important;
    transform:translate(-50%,-50%)!important;
    z-index:3!important;
    display:block!important;
  }

  .header .header-search .search-form,
  .header .header-search.is-open .search-form{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    height:46px!important;
    min-height:46px!important;
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    gap:10px!important;
    padding:0 14px!important;
    border:1px solid transparent!important;
    border-radius:12px!important;
    background:#f0f0f1!important;
    box-shadow:none!important;
    transform:none!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    transition:background .18s ease,border-color .18s ease,box-shadow .18s ease!important;
  }

  body.dark .header .header-search .search-form,
  body.dark .header .header-search.is-open .search-form{
    background:#1b1b1f!important;
  }

  .header .header-search .search-form:focus-within{
    border-color:color-mix(in srgb,var(--ts-blue) 38%,transparent)!important;
    background:#f7f7f8!important;
    box-shadow:0 0 0 3px color-mix(in srgb,var(--ts-blue) 7%,transparent)!important;
    transform:none!important;
  }

  body.dark .header .header-search .search-form:focus-within{
    background:#202025!important;
  }

  .header .header-search-icon{
    order:0;
    flex:0 0 auto;
    color:#81858b!important;
    font-size:.86rem!important;
    opacity:1!important;
  }

  .header .header-search .search-form input{
    order:1;
    flex:1 1 auto!important;
    width:100%!important;
    min-width:0!important;
    min-height:44px!important;
    padding:0!important;
    border:0!important;
    outline:0!important;
    background:transparent!important;
    color:var(--ts-text)!important;
    font-size:.78rem!important;
    font-weight:520!important;
    line-height:1!important;
  }

  .header .header-search .search-form input::placeholder{
    color:#81858b!important;
    opacity:1!important;
  }

  .header .header-search-submit--sr{
    position:absolute!important;
    width:1px!important;
    height:1px!important;
    min-width:1px!important;
    padding:0!important;
    margin:-1px!important;
    overflow:hidden!important;
    clip:rect(0,0,0,0)!important;
    white-space:nowrap!important;
    border:0!important;
    opacity:0!important;
    pointer-events:none!important;
  }

  .header .actions{
    position:relative;
    z-index:2;
    flex:0 0 auto;
  }
}

@media (min-width:1181px) and (max-width:1450px){
  .header .header-search{
    width:clamp(400px,36vw,560px)!important;
  }

  .header .header-primary{
    gap:10px;
  }

  .header .header-navbar nav>ul>li>a,
  .header .header-navbar .nav-dropdown-toggle{
    padding-inline:8px!important;
  }
}

@media (min-width:901px) and (max-width:1180px){
  .header .header-search{
    width:clamp(300px,33vw,390px)!important;
  }

  .header .header-primary{
    gap:6px;
  }

  .header .logo-site-name{
    display:none!important;
  }

  .header .header-navbar nav>ul>li>a,
  .header .header-navbar .nav-dropdown-toggle{
    padding-inline:6px!important;
    font-size:.61rem!important;
  }
}

@media (max-width:900px){
  .header .header-primary{
    display:contents;
  }

  .header .header-search-submit--sr{
    position:absolute!important;
    width:1px!important;
    height:1px!important;
    min-width:1px!important;
    padding:0!important;
    margin:-1px!important;
    overflow:hidden!important;
    clip:rect(0,0,0,0)!important;
    white-space:nowrap!important;
    border:0!important;
  }
}


/* =========================================================
   Minimal catalog v4
   Professional storefront listing with restrained hierarchy.
   ========================================================= */
.products-page{
  width:min(1340px,calc(100% - 40px))!important;
  padding:28px 0 76px!important;
}

.shop-catalog-head{
  margin-bottom:14px;
  padding:0 0 18px;
  border-bottom:1px solid var(--ts-line);
}

.shop-catalog-heading{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:18px;
  margin-bottom:14px;
}

.shop-catalog-heading>div{
  min-width:0;
}

.shop-catalog-label{
  display:block;
  margin-bottom:4px;
  color:var(--ts-muted);
  font-size:.66rem;
  font-weight:700;
}

.shop-catalog-heading h1{
  margin:0;
  color:var(--ts-text);
  font-size:clamp(1.55rem,2.3vw,2.2rem);
  line-height:1.18;
  font-weight:820;
  letter-spacing:-.035em;
}

.shop-catalog-count{
  flex:0 0 auto;
  color:var(--ts-muted);
  font-size:.70rem;
  font-weight:650;
}

.shop-search-row--minimal{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(210px,280px) auto!important;
  gap:8px!important;
  margin:0!important;
}

.shop-search-field,
.shop-category-field{
  min-height:42px;
  display:flex;
  align-items:center;
  gap:9px;
  padding:0 12px;
  border:1px solid var(--ts-line);
  border-radius:10px;
  background:var(--ts-surface);
  color:var(--ts-muted);
  transition:border-color .18s ease,background .18s ease,box-shadow .18s ease;
}

.shop-search-field:focus-within,
.shop-category-field:focus-within{
  border-color:color-mix(in srgb,var(--ts-blue) 34%,var(--ts-line));
  background:color-mix(in srgb,var(--ts-surface) 96%,var(--ts-blue) 4%);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--ts-blue) 6%,transparent);
}

.shop-search-field>i,
.shop-category-field>i{
  flex:0 0 auto;
  color:var(--ts-muted);
  font-size:.72rem;
}

.shop-search-field input,
.shop-category-field select{
  width:100%;
  min-width:0;
  height:40px;
  padding:0;
  border:0;
  outline:0;
  background:transparent;
  color:var(--ts-text);
  font-family:inherit;
  font-size:.74rem;
}

.shop-search-field input::placeholder{
  color:var(--ts-muted);
}

.shop-category-field select{
  appearance:none;
  cursor:pointer;
}

.shop-category-field>i:last-child{
  font-size:.58rem;
}

.shop-search-submit-minimal{
  min-width:84px;
  min-height:42px;
  padding:0 16px;
  border:1px solid var(--ts-text);
  border-radius:10px;
  background:var(--ts-text);
  color:var(--ts-surface);
  font-family:inherit;
  font-size:.72rem;
  font-weight:800;
  cursor:pointer;
  transition:opacity .18s ease,transform .18s ease;
}

.shop-search-submit-minimal:hover{
  opacity:.88;
  transform:translateY(-1px);
}

/* Compact result / sort row */
.shop-toolbar{
  min-height:48px;
  margin:0 0 14px!important;
  padding:0 2px 10px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  border-bottom:1px solid var(--ts-line)!important;
}

.shop-result-count{
  display:flex;
  align-items:center;
  gap:5px;
  color:var(--ts-muted)!important;
  font-size:.68rem!important;
}

.shop-result-count strong{
  color:var(--ts-text)!important;
  font-size:.72rem;
}

.filter-badge{
  min-height:22px!important;
  padding:2px 7px!important;
  border:1px solid var(--ts-line)!important;
  border-radius:999px!important;
  background:transparent!important;
  color:var(--ts-muted)!important;
  font-size:.58rem!important;
}

.shop-toolbar-actions{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
}

.shop-sort-wrap{
  display:flex!important;
  align-items:center!important;
  gap:7px!important;
}

.shop-sort-label{
  color:var(--ts-muted)!important;
  font-size:.64rem!important;
}

.shop-sort-trigger{
  min-height:34px!important;
  padding:0 10px!important;
  border:1px solid var(--ts-line)!important;
  border-radius:9px!important;
  background:var(--ts-surface)!important;
  color:var(--ts-text)!important;
  box-shadow:none!important;
}

.shop-sort-trigger-icon{
  display:none!important;
}

.shop-sort-current{
  font-size:.66rem!important;
  font-weight:700!important;
}

.shop-sort-chevron{
  font-size:.52rem!important;
  color:var(--ts-muted)!important;
}

.shop-sort-dropdown{
  min-width:170px!important;
  padding:5px!important;
  border:1px solid var(--ts-line)!important;
  border-radius:10px!important;
  background:var(--ts-surface)!important;
  box-shadow:0 14px 34px rgba(0,0,0,.14)!important;
}

.shop-sort-option{
  min-height:34px!important;
  padding:0 9px!important;
  border-radius:7px!important;
  font-size:.66rem!important;
}

/* Catalog layout */
.shop-layout{
  display:grid!important;
  grid-template-columns:242px minmax(0,1fr)!important;
  gap:16px!important;
  align-items:start!important;
}

.products-main{
  min-width:0;
}

.filter-sidebar{
  min-width:0!important;
  max-width:none!important;
}

.filter-sidebar-inner{
  position:sticky!important;
  top:calc(var(--ts-header-h) + 14px)!important;
  border:1px solid var(--ts-line)!important;
  border-radius:12px!important;
  background:var(--ts-surface)!important;
  box-shadow:none!important;
  overflow:hidden!important;
}

.filter-sidebar-head{
  min-height:48px!important;
  padding:0 13px!important;
  border-bottom:1px solid var(--ts-line)!important;
  background:transparent!important;
}

.filter-sidebar-title{
  display:flex!important;
  align-items:center!important;
  min-width:0;
}

.filter-sidebar-title>strong{
  color:var(--ts-text)!important;
  font-size:.76rem!important;
  font-weight:800!important;
}

.filter-sidebar-icon,
.filter-sidebar-title small{
  display:none!important;
}

.filter-active-count{
  min-width:20px!important;
  height:20px!important;
  padding:0 5px!important;
  border-radius:999px!important;
  background:var(--ts-text)!important;
  color:var(--ts-surface)!important;
  font-size:.56rem!important;
  box-shadow:none!important;
}

.filter-sidebar-body{
  padding:0!important;
}

.filter-quick-section,
.filter-section,
.filter-section-primary,
.filter-accordion{
  margin:0!important;
  padding:13px!important;
  border:0!important;
  border-bottom:1px solid var(--ts-line)!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}

.filter-sidebar-body>*:last-child{
  border-bottom:0!important;
}

.filter-mini-head{
  min-height:22px;
  margin-bottom:8px!important;
}

.filter-mini-head strong,
.filter-accordion>summary{
  color:var(--ts-text)!important;
  font-size:.68rem!important;
  font-weight:750!important;
}

.filter-mini-head>span{
  display:none!important;
}

.filter-quick-grid{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:4px!important;
}

.filter-quick-pill{
  min-height:34px!important;
}

.filter-quick-pill>span{
  min-height:34px!important;
  padding:0 9px!important;
  justify-content:flex-start!important;
  gap:7px!important;
  border:0!important;
  border-radius:7px!important;
  background:transparent!important;
  color:var(--ts-muted)!important;
  font-size:.63rem!important;
}

.filter-quick-pill:hover>span,
.filter-quick-pill input:checked+span{
  color:var(--ts-text)!important;
  background:var(--ts-surface-soft)!important;
}

.filter-quick-pill input:checked+span{
  box-shadow:inset 2px 0 0 var(--ts-blue)!important;
}

.price-range-labels{
  color:var(--ts-muted)!important;
  font-size:.58rem!important;
}

.filter-search-box{
  min-height:34px!important;
  padding:0 9px!important;
  border:1px solid var(--ts-line)!important;
  border-radius:8px!important;
  background:var(--ts-surface-soft)!important;
}

.filter-search-box input{
  font-size:.63rem!important;
}

.filter-brand-list{
  max-height:210px!important;
  margin-top:7px!important;
  padding-left:2px!important;
}

.brand-check-item{
  min-height:34px!important;
  padding:5px 4px!important;
  border-radius:7px!important;
  background:transparent!important;
  font-size:.62rem!important;
}

.brand-check-item:hover{
  background:var(--ts-surface-soft)!important;
}

.brand-check-count{
  color:var(--ts-muted)!important;
  font-size:.55rem!important;
}

.filter-accordion>summary{
  min-height:34px!important;
  padding:0!important;
}

.filter-accordion>summary>span{
  display:flex;
  align-items:center;
  gap:7px;
}

.filter-accordion>summary>span>i{
  width:14px;
  color:var(--ts-muted)!important;
  font-size:.62rem!important;
}

.filter-accordion-content{
  padding:8px 0 0!important;
}

.filter-category-list{
  gap:2px!important;
  max-height:220px!important;
}

.filter-category-item{
  min-height:32px!important;
  padding:5px 7px!important;
  border-radius:7px!important;
  font-size:.62rem!important;
}

.filter-toggle-row{
  min-height:32px!important;
  padding:3px 0!important;
  font-size:.62rem!important;
}

.filter-option-grid{
  gap:5px!important;
}

.filter-choice{
  min-height:32px!important;
  padding:5px 7px!important;
  border-radius:8px!important;
  font-size:.60rem!important;
}

.filter-star-btn{
  width:32px!important;
  height:32px!important;
  border-radius:8px!important;
}

.filter-actions-sticky{
  min-height:50px!important;
  padding:8px!important;
  gap:6px!important;
  border-top:1px solid var(--ts-line)!important;
  background:var(--ts-surface)!important;
}

.filter-reset-btn,
.filter-apply-btn{
  min-height:34px!important;
  border-radius:8px!important;
  font-size:.62rem!important;
  box-shadow:none!important;
}

.filter-reset-btn{
  border:1px solid var(--ts-line)!important;
  background:transparent!important;
  color:var(--ts-muted)!important;
}

.filter-apply-btn{
  background:var(--ts-text)!important;
  color:var(--ts-surface)!important;
}

/* Product grid and cards: neutral, quiet, premium */
.products-grid{
  grid-template-columns:repeat(auto-fill,minmax(182px,1fr))!important;
  gap:10px!important;
}

.products-grid .product-card{
  --card-accent:var(--ts-blue)!important;
  border:1px solid var(--ts-line)!important;
  border-radius:12px!important;
  background:var(--ts-surface)!important;
  box-shadow:none!important;
}

.products-grid .product-card::before{
  display:none!important;
}

.products-grid .product-card:hover{
  transform:translateY(-2px)!important;
  border-color:var(--ts-line-strong)!important;
  box-shadow:0 10px 28px rgba(0,0,0,.08)!important;
}

.products-grid .product-card-media{
  aspect-ratio:1 / .84!important;
  border-bottom:1px solid var(--ts-line)!important;
  background:var(--ts-surface-soft)!important;
}

.products-grid .product-card-media img{
  padding:13px!important;
}

.products-grid .product-card-body{
  padding:10px 11px 11px!important;
}

.products-grid .product-card-meta{
  margin-bottom:4px!important;
  gap:4px!important;
}

.products-grid .pc-brand{
  color:var(--ts-muted)!important;
  font-size:.58rem!important;
  font-weight:700!important;
}

.products-grid .product-card-title{
  min-height:2.75em!important;
  margin:0 0 7px!important;
  color:var(--ts-text)!important;
  font-size:.72rem!important;
  line-height:1.45!important;
  font-weight:700!important;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.products-grid .product-card-prices{
  margin:0!important;
}

.products-grid .price{
  color:var(--ts-text)!important;
  font-size:.78rem!important;
  font-weight:800!important;
}

.products-grid .price-old{
  font-size:.58rem!important;
}

.products-grid .product-card-footer{
  margin-top:8px!important;
  padding-top:8px!important;
  border-top:1px solid var(--ts-line)!important;
}

.products-grid .stock-line{
  color:var(--ts-muted)!important;
  font-size:.54rem!important;
}

.products-grid .stock-line i{
  font-size:.42rem!important;
}

.products-grid .card-add-btn{
  min-height:30px!important;
  padding:0 9px!important;
  border:1px solid var(--ts-line)!important;
  border-radius:8px!important;
  background:transparent!important;
  color:var(--ts-text)!important;
  font-size:.60rem!important;
  box-shadow:none!important;
}

.products-grid .card-add-btn:hover{
  border-color:var(--ts-text)!important;
  background:var(--ts-text)!important;
  color:var(--ts-surface)!important;
}

.products-grid .pc-floating-actions{
  top:8px!important;
  left:8px!important;
  gap:4px!important;
}

.products-grid .pc-floating-actions .quick-view-btn,
.products-grid .pc-floating-actions .wishlist-btn,
.products-grid .pc-floating-actions .card-action{
  width:27px!important;
  height:27px!important;
  min-width:27px!important;
  border-radius:8px!important;
  background:color-mix(in srgb,var(--ts-surface) 90%,transparent)!important;
  box-shadow:none!important;
}

.products-grid .pc-badges{
  top:8px!important;
  right:8px!important;
}

.products-grid .pc-discount,
.products-grid .pc-rank,
.products-grid .pstock-badge{
  border-radius:6px!important;
  box-shadow:none!important;
  font-size:.53rem!important;
}

.active-filters-bar{
  margin:-4px 0 12px!important;
  gap:5px!important;
}

.filter-chip-sm{
  min-height:27px!important;
  padding:3px 8px!important;
  border-radius:7px!important;
  font-size:.58rem!important;
}

@media(max-width:992px){
  .products-page{
    width:min(100% - 26px,1340px)!important;
    padding-top:22px!important;
  }

  .shop-catalog-heading{
    align-items:flex-start;
  }

  .shop-search-row--minimal{
    grid-template-columns:minmax(0,1fr) minmax(180px,230px) auto!important;
  }

  .shop-layout{
    display:block!important;
  }

  .shop-filter-toggle{
    display:inline-flex!important;
  }
}

@media(max-width:720px){
  .shop-catalog-head{
    padding-bottom:14px;
  }

  .shop-catalog-heading{
    margin-bottom:10px;
  }

  .shop-catalog-heading h1{
    font-size:1.45rem;
  }

  .shop-search-row--minimal{
    grid-template-columns:1fr!important;
  }

  .shop-search-submit-minimal{
    width:100%;
  }

  .shop-toolbar{
    align-items:flex-start!important;
    flex-direction:column!important;
    gap:8px!important;
  }

  .shop-toolbar-actions{
    width:100%!important;
    justify-content:space-between!important;
  }

  .shop-sort-label{
    display:none!important;
  }

  .products-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }
}

@media(max-width:420px){
  .products-page{
    width:min(100% - 18px,1340px)!important;
  }

  .shop-catalog-count{
    display:none;
  }

  .products-grid .product-card-body{
    padding:8px!important;
  }

  .products-grid .product-card-title{
    font-size:.66rem!important;
  }

  .products-grid .stock-line{
    display:none!important;
  }

  .products-grid .card-add-btn{
    width:100%!important;
    justify-content:center!important;
  }
}


/* Catalog category dropdown — fully themed, no native browser menu */
.shop-category-control{
  position:relative;
  min-width:0;
}

.shop-category-menu{
  position:relative;
  width:100%;
}

.shop-category-menu>summary{
  list-style:none;
}

.shop-category-menu>summary::-webkit-details-marker{
  display:none;
}

.shop-category-trigger{
  min-height:42px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:0 12px;
  border:1px solid var(--ts-line);
  border-radius:10px;
  background:var(--ts-surface);
  color:var(--ts-text);
  cursor:pointer;
  user-select:none;
  transition:border-color .18s ease,background .18s ease,box-shadow .18s ease;
}

.shop-category-trigger:hover,
.shop-category-menu[open]>.shop-category-trigger{
  border-color:color-mix(in srgb,var(--ts-blue) 34%,var(--ts-line));
  background:color-mix(in srgb,var(--ts-surface) 96%,var(--ts-blue) 4%);
}

.shop-category-menu[open]>.shop-category-trigger{
  box-shadow:0 0 0 3px color-mix(in srgb,var(--ts-blue) 6%,transparent);
}

.shop-category-trigger-main{
  min-width:0;
  display:flex;
  align-items:center;
  gap:9px;
}

.shop-category-trigger-main>i{
  flex:0 0 auto;
  color:var(--ts-muted);
  font-size:.72rem;
}

.shop-category-trigger-main>span{
  overflow:hidden;
  color:var(--ts-text);
  font-size:.72rem;
  font-weight:650;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.shop-category-chevron{
  flex:0 0 auto;
  color:var(--ts-muted);
  font-size:.55rem;
  transition:transform .18s ease;
}

.shop-category-menu[open] .shop-category-chevron{
  transform:rotate(180deg);
}

.shop-category-dropdown{
  position:absolute;
  z-index:80;
  top:calc(100% + 6px);
  right:0;
  left:0;
  max-height:300px;
  overflow-y:auto;
  padding:5px;
  border:1px solid var(--ts-line);
  border-radius:11px;
  background:var(--ts-surface);
  box-shadow:0 18px 46px rgba(0,0,0,.22);
  scrollbar-width:thin;
  scrollbar-color:color-mix(in srgb,var(--ts-muted) 35%,transparent) transparent;
}

.shop-category-option{
  width:100%;
  min-height:36px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:0 10px;
  border:0;
  border-radius:7px;
  background:transparent;
  color:var(--ts-muted);
  font-family:inherit;
  font-size:.65rem;
  text-align:right;
  cursor:pointer;
  transition:background .15s ease,color .15s ease;
}

.shop-category-option:hover{
  background:var(--ts-surface-soft);
  color:var(--ts-text);
}

.shop-category-option.active{
  background:color-mix(in srgb,var(--ts-blue) 8%,var(--ts-surface));
  color:var(--ts-text);
  font-weight:750;
}

.shop-category-option>span{
  min-width:0;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.shop-category-option small{
  color:var(--ts-muted);
  font-size:.56rem;
}

.shop-category-option>i{
  flex:0 0 auto;
  color:var(--ts-blue);
  font-size:.58rem;
}

@media(max-width:720px){
  .shop-category-dropdown{
    position:static;
    margin-top:6px;
    max-height:240px;
  }
}


/* Catalog search action harmonization */
.shop-search-submit-minimal{
  border-color:transparent!important;
  background:linear-gradient(135deg,var(--ts-blue),var(--ts-purple))!important;
  color:#fff!important;
  box-shadow:0 6px 16px rgba(99,102,241,.14)!important;
}

.shop-search-submit-minimal:hover{
  opacity:1!important;
  background:linear-gradient(135deg,#1687f8,#8b5cf6)!important;
  box-shadow:0 8px 20px rgba(99,102,241,.20)!important;
}


/* Catalog sort control: keep full selected label visible */
.shop-sort-menu{
  min-width:150px!important;
}

.shop-sort-trigger{
  min-width:150px!important;
  justify-content:space-between!important;
  gap:10px!important;
}

.shop-sort-current{
  display:block!important;
  min-width:0!important;
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:nowrap!important;
}

.shop-sort-dropdown{
  width:100%!important;
  min-width:180px!important;
}

.shop-sort-option{
  white-space:nowrap!important;
}

@media(max-width:720px){
  .shop-sort-menu{
    min-width:142px!important;
  }

  .shop-sort-trigger{
    min-width:142px!important;
  }
}


/* =========================================================
   Professional cart / checkout v2
   ========================================================= */
.cart-checkout-page{
  width:min(1240px,calc(100% - 40px));
  margin-inline:auto;
  padding:34px 0 84px;
}

.cart-checkout-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:20px;
  margin-bottom:18px;
  padding-bottom:16px;
  border-bottom:1px solid var(--ts-line);
}

.cart-checkout-kicker{
  display:block;
  margin-bottom:4px;
  color:var(--ts-muted);
  font-size:.62rem;
  font-weight:750;
}

.cart-checkout-head h1{
  margin:0;
  color:var(--ts-text);
  font-size:clamp(1.55rem,2.1vw,2rem);
  line-height:1.2;
  font-weight:850;
  letter-spacing:-.035em;
}

.cart-checkout-head p{
  margin:5px 0 0;
  color:var(--ts-muted);
  font-size:.68rem;
}

.cart-continue-link{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:36px;
  padding:0 11px;
  border:1px solid var(--ts-line);
  border-radius:9px;
  color:var(--ts-text);
  background:var(--ts-surface);
  font-size:.66rem;
  font-weight:750;
  text-decoration:none;
  transition:.18s ease;
}

.cart-continue-link:hover{
  border-color:var(--ts-line-strong);
  background:var(--ts-surface-soft);
}

.cart-checkout-layout{
  display:grid;
  grid-template-columns:minmax(0,1fr) 330px;
  gap:18px;
  align-items:start;
}

.cart-checkout-main{
  min-width:0;
  display:grid;
  gap:14px;
}

.cart-products-panel,
.cart-address-panel,
.cart-profile-warning,
.cart-summary-card{
  border:1px solid var(--ts-line);
  border-radius:14px;
  background:var(--ts-surface);
  box-shadow:none;
}

.cart-panel-heading{
  min-height:48px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:0 15px;
  border-bottom:1px solid var(--ts-line);
}

.cart-panel-heading strong{
  color:var(--ts-text);
  font-size:.78rem;
  font-weight:800;
}

.cart-panel-heading span{
  color:var(--ts-muted);
  font-size:.60rem;
}

.cart-modern-list{
  display:flex;
  flex-direction:column;
}

.cart-modern-item{
  position:relative;
  display:grid;
  grid-template-columns:116px minmax(0,1fr);
  gap:15px;
  padding:15px;
  border-bottom:1px solid var(--ts-line);
  transition:opacity .2s ease,transform .2s ease,background .18s ease;
}

.cart-modern-item:last-child{
  border-bottom:0;
}

.cart-modern-item:hover{
  background:color-mix(in srgb,var(--ts-text) 1.8%,transparent);
}

.cart-modern-item.is-updating{
  opacity:.64;
}

.cart-modern-item.is-removing{
  opacity:0;
  transform:translateX(-14px);
}

.cart-modern-media{
  width:116px;
  height:106px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border:1px solid var(--ts-line);
  border-radius:10px;
  background:#fff;
  text-decoration:none;
}

.cart-modern-media img{
  width:100%;
  height:100%;
  display:block;
  object-fit:contain;
  padding:8px;
}

.cart-modern-media-empty{
  color:var(--ts-muted);
  font-size:1.1rem;
}

.cart-modern-content{
  min-width:0;
  display:flex;
  flex-direction:column;
}

.cart-modern-title-row{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.cart-modern-title-row>div{
  min-width:0;
}

.cart-modern-brand{
  display:block;
  margin-bottom:3px;
  color:var(--ts-muted);
  font-size:.56rem;
  font-weight:700;
}

.cart-modern-title-row h2{
  margin:0;
  color:var(--ts-text);
  font-size:.79rem;
  line-height:1.65;
  font-weight:760;
}

.cart-modern-title-row h2 a{
  color:inherit;
  text-decoration:none;
}

.cart-modern-title-row h2 a:hover{
  color:var(--ts-blue);
}

.cart-modern-remove{
  flex:0 0 auto;
  margin:0;
}

.cart-modern-remove button{
  width:31px;
  height:31px;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid transparent;
  border-radius:8px;
  background:transparent;
  color:var(--ts-muted);
  cursor:pointer;
  transition:.18s ease;
}

.cart-modern-remove button:hover{
  border-color:rgba(239,68,68,.16);
  background:rgba(239,68,68,.07);
  color:#ef4444;
}

.cart-modern-meta{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:7px 12px;
  margin-top:6px;
  color:var(--ts-muted);
  font-size:.58rem;
}

.cart-modern-meta span{
  display:inline-flex;
  align-items:center;
  gap:5px;
}

.cart-modern-meta i{
  color:var(--ts-muted);
  font-size:.52rem;
}

.cart-modern-stock-warning{
  margin-top:8px;
  padding:7px 9px;
  border:1px solid rgba(245,158,11,.18);
  border-radius:8px;
  background:rgba(245,158,11,.06);
  color:#d97706;
  font-size:.59rem;
}

body.dark .cart-modern-stock-warning{
  color:#fbbf24;
}

.cart-modern-bottom{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:14px;
  margin-top:auto;
  padding-top:12px;
}

.cart-modern-qty{
  display:flex;
  align-items:center;
  gap:8px;
  margin:0;
}

.cart-modern-stepper{
  display:grid;
  grid-template-columns:32px 46px 32px;
  align-items:center;
  overflow:hidden;
  border:1px solid var(--ts-line);
  border-radius:9px;
  background:var(--ts-surface-soft);
}

.cart-modern-stepper button{
  width:32px;
  height:32px;
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  background:transparent;
  color:var(--ts-text);
  font-size:.58rem;
  cursor:pointer;
  transition:.15s ease;
}

.cart-modern-stepper button:hover:not(:disabled){
  background:color-mix(in srgb,var(--ts-blue) 8%,transparent);
  color:var(--ts-blue);
}

.cart-modern-stepper button:disabled,
.cart-modern-stepper input:disabled{
  cursor:wait;
  opacity:.55;
}

.cart-modern-stepper input{
  width:46px;
  height:32px;
  padding:0;
  border:0;
  border-inline:1px solid var(--ts-line);
  outline:0;
  background:var(--ts-surface);
  color:var(--ts-text);
  font-family:inherit;
  font-size:.70rem;
  font-weight:800;
  text-align:center;
  -moz-appearance:textfield;
}

.cart-modern-stepper input::-webkit-inner-spin-button,
.cart-modern-stepper input::-webkit-outer-spin-button{
  margin:0;
  -webkit-appearance:none;
}

.cart-update-fallback{
  min-height:31px;
  padding:0 8px;
  border:1px solid var(--ts-line);
  border-radius:8px;
  background:transparent;
  color:var(--ts-muted);
  font-family:inherit;
  font-size:.56rem;
}

.js .cart-update-fallback{
  display:none;
}

.cart-update-state{
  min-width:68px;
  color:var(--ts-muted);
  font-size:.54rem;
}

.cart-modern-price{
  display:grid;
  grid-template-columns:auto auto;
  align-items:baseline;
  gap:2px 4px;
  text-align:left;
}

.cart-modern-price small{
  grid-column:1 / -1;
  color:var(--ts-muted);
  font-size:.54rem;
}

.cart-modern-price strong{
  color:var(--ts-text);
  font-size:.92rem;
  font-weight:850;
  font-variant-numeric:tabular-nums;
}

.cart-modern-price>span{
  color:var(--ts-muted);
  font-size:.56rem;
}

.cart-address-panel,
.cart-profile-warning{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:14px 15px;
}

.cart-section-icon{
  width:34px;
  height:34px;
  flex:0 0 34px;
  display:grid;
  place-items:center;
  border-radius:9px;
  background:color-mix(in srgb,var(--ts-blue) 8%,var(--ts-surface));
  color:var(--ts-blue);
  font-size:.72rem;
}

.cart-address-content{
  min-width:0;
  flex:1;
}

.cart-address-heading{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.cart-address-heading strong,
.cart-profile-warning strong{
  display:block;
  color:var(--ts-text);
  font-size:.72rem;
  font-weight:800;
}

.cart-address-heading p,
.cart-profile-warning p{
  margin:4px 0 0;
  color:var(--ts-muted);
  font-size:.60rem;
  line-height:1.8;
}

.cart-address-heading p span{
  display:block;
  margin-top:2px;
}

.cart-address-heading>a{
  flex:0 0 auto;
  color:var(--ts-blue);
  font-size:.60rem;
  font-weight:750;
  text-decoration:none;
}

.cart-address-confirm{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:11px;
  color:var(--ts-text);
  font-size:.62rem;
  cursor:pointer;
}

.cart-address-confirm input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}

.cart-address-check-ui{
  width:19px;
  height:19px;
  flex:0 0 19px;
  display:grid;
  place-items:center;
  border:1px solid var(--ts-line-strong);
  border-radius:6px;
  background:var(--ts-surface-soft);
  color:transparent;
  font-size:.52rem;
  transition:.16s ease;
}

.cart-address-confirm input:checked+.cart-address-check-ui{
  border-color:var(--ts-blue);
  background:var(--ts-blue);
  color:#fff;
}

.cart-profile-warning{
  align-items:center;
}

.cart-profile-warning .cart-section-icon{
  background:rgba(245,158,11,.08);
  color:#f59e0b;
}

.cart-profile-warning>div:nth-child(2){
  min-width:0;
  flex:1;
}

.cart-profile-complete{
  flex:0 0 auto;
  min-height:34px;
  display:inline-flex;
  align-items:center;
  padding:0 11px;
  border-radius:8px;
  background:var(--ts-text);
  color:var(--ts-surface);
  font-size:.60rem;
  font-weight:800;
  text-decoration:none;
}

.cart-order-summary{
  min-width:0;
}

.cart-summary-card{
  position:sticky;
  top:calc(var(--ts-header-h) + 18px);
  overflow:hidden;
}

.cart-summary-head{
  min-height:49px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:0 15px;
  border-bottom:1px solid var(--ts-line);
}

.cart-summary-head strong{
  color:var(--ts-text);
  font-size:.76rem;
  font-weight:800;
}

.cart-summary-head>span{
  color:var(--ts-muted);
  font-size:.58rem;
}

.cart-summary-lines{
  display:grid;
  gap:9px;
  padding:14px 15px;
  border-bottom:1px solid var(--ts-line);
}

.cart-summary-lines>div,
.cart-summary-discount{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.cart-summary-lines span,
.cart-summary-discount>span{
  color:var(--ts-muted);
  font-size:.61rem;
}

.cart-summary-lines strong{
  color:var(--ts-text);
  font-size:.64rem;
  font-weight:750;
}

.cart-summary-shipping strong{
  color:var(--ts-muted);
  font-weight:650;
}

.cart-checkout-form{
  margin:0;
  padding:0 15px 15px;
}

.cart-points-box{
  margin:13px 0 0;
  padding:10px;
  border:1px solid var(--ts-line);
  border-radius:9px;
  background:var(--ts-surface-soft);
}

.cart-points-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:7px;
}

.cart-points-head>span{
  display:inline-flex;
  align-items:center;
  gap:5px;
  color:var(--ts-text);
  font-size:.61rem;
  font-weight:750;
}

.cart-points-head>span i{
  color:var(--ts-blue);
}

.cart-points-head small{
  color:var(--ts-muted);
  font-size:.54rem;
}

.cart-points-select{
  width:100%;
  min-height:36px;
  padding:0 8px;
  border:1px solid var(--ts-line);
  border-radius:8px;
  outline:0;
  background:var(--ts-surface);
  color:var(--ts-text);
  font-family:inherit;
  font-size:.59rem;
}

.cart-points-empty{
  color:var(--ts-muted);
  font-size:.58rem;
  line-height:1.8;
}

.cart-points-empty a{
  color:var(--ts-blue);
  text-decoration:none;
}

.cart-summary-discount{
  margin-top:12px;
  padding:0 1px;
}

.cart-summary-discount strong{
  color:#10b981;
  font-size:.64rem;
}

.cart-summary-total{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  margin-top:13px;
  padding-top:13px;
  border-top:1px solid var(--ts-line);
}

.cart-summary-total>span{
  color:var(--ts-text);
  font-size:.66rem;
  font-weight:750;
}

.cart-summary-total>strong{
  color:var(--ts-text);
  font-size:1rem;
  font-weight:900;
  font-variant-numeric:tabular-nums;
}

.cart-summary-total small{
  color:var(--ts-muted);
  font-size:.55rem;
  font-weight:650;
}

.cart-checkout-btn{
  width:100%;
  min-height:43px;
  margin-top:13px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:0 13px;
  border:0;
  border-radius:10px;
  background:linear-gradient(135deg,var(--ts-blue),var(--ts-purple));
  color:#fff;
  font-family:inherit;
  font-size:.69rem;
  font-weight:850;
  text-decoration:none;
  cursor:pointer;
  box-shadow:0 9px 24px rgba(99,102,241,.16);
  transition:.18s ease;
}

.cart-checkout-btn:hover:not(:disabled){
  transform:translateY(-1px);
  box-shadow:0 11px 28px rgba(99,102,241,.22);
}

.cart-checkout-btn:disabled{
  cursor:not-allowed;
  opacity:.38;
  box-shadow:none;
}

.cart-checkout-btn.is-loading{
  opacity:.70;
  cursor:wait;
}

.cart-checkout-btn--link{
  margin:14px 15px 15px;
  width:calc(100% - 30px);
}

.cart-checkout-help{
  display:block;
  margin-top:7px;
  color:var(--ts-muted);
  font-size:.54rem;
  text-align:center;
}

.cart-checkout-help.is-ready{
  color:#10b981;
}

.cart-summary-note{
  display:flex;
  align-items:flex-start;
  gap:7px;
  padding:11px 15px;
  border-top:1px solid var(--ts-line);
  color:var(--ts-muted);
  font-size:.54rem;
  line-height:1.7;
}

.cart-summary-note i{
  flex:0 0 auto;
  margin-top:2px;
  color:var(--ts-muted);
}

.cart-empty-modern{
  min-height:360px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:30px;
  border:1px solid var(--ts-line);
  border-radius:14px;
  background:var(--ts-surface);
  text-align:center;
}

.cart-empty-modern>span{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  margin-bottom:4px;
  border-radius:14px;
  background:var(--ts-surface-soft);
  color:var(--ts-muted);
  font-size:1.05rem;
}

.cart-empty-modern h2{
  margin:0;
  color:var(--ts-text);
  font-size:1rem;
}

.cart-empty-modern p{
  max-width:430px;
  margin:0;
  color:var(--ts-muted);
  font-size:.62rem;
  line-height:1.8;
}

.cart-empty-modern a{
  min-height:35px;
  display:inline-flex;
  align-items:center;
  margin-top:6px;
  padding:0 12px;
  border-radius:8px;
  background:var(--ts-text);
  color:var(--ts-surface);
  font-size:.62rem;
  font-weight:800;
  text-decoration:none;
}

@media(max-width:980px){
  .cart-checkout-layout{
    grid-template-columns:minmax(0,1fr) 290px;
    gap:12px;
  }

  .cart-modern-item{
    grid-template-columns:96px minmax(0,1fr);
    gap:12px;
  }

  .cart-modern-media{
    width:96px;
    height:92px;
  }
}

@media(max-width:820px){
  .cart-checkout-page{
    width:min(100% - 26px,1240px);
    padding-top:24px;
  }

  .cart-checkout-layout{
    grid-template-columns:1fr;
  }

  .cart-summary-card{
    position:static;
  }

  .cart-order-summary{
    order:2;
  }
}

@media(max-width:580px){
  .cart-checkout-page{
    width:min(100% - 18px,1240px);
    padding:18px 0 72px;
  }

  .cart-checkout-head{
    align-items:flex-start;
    margin-bottom:12px;
  }

  .cart-checkout-head h1{
    font-size:1.35rem;
  }

  .cart-continue-link{
    min-height:33px;
    padding-inline:9px;
    font-size:.59rem;
  }

  .cart-modern-item{
    grid-template-columns:82px minmax(0,1fr);
    gap:10px;
    padding:11px;
  }

  .cart-modern-media{
    width:82px;
    height:82px;
  }

  .cart-modern-title-row h2{
    font-size:.68rem;
  }

  .cart-modern-meta{
    gap:5px 8px;
    font-size:.52rem;
  }

  .cart-modern-bottom{
    grid-column:1 / -1;
    align-items:center;
    margin-top:10px;
    padding-top:9px;
    border-top:1px solid var(--ts-line);
  }

  .cart-modern-stepper{
    grid-template-columns:29px 40px 29px;
  }

  .cart-modern-stepper button{
    width:29px;
    height:29px;
  }

  .cart-modern-stepper input{
    width:40px;
    height:29px;
  }

  .cart-modern-price strong{
    font-size:.80rem;
  }

  .cart-address-panel,
  .cart-profile-warning{
    padding:12px;
  }

  .cart-address-heading{
    flex-direction:column;
    gap:5px;
  }

  .cart-profile-warning{
    flex-wrap:wrap;
  }

  .cart-profile-complete{
    width:100%;
    justify-content:center;
  }
}


/* =========================================================
   Product detail — professional minimal layout
   ========================================================= */
.product-detail-breadcrumb{
  width:min(1240px,calc(100% - 40px));
  margin:22px auto 0;
  display:flex;
  align-items:center;
  gap:8px;
  color:var(--ts-muted);
  font-size:.68rem;
  white-space:nowrap;
  overflow:hidden;
}
.product-detail-breadcrumb a{
  color:var(--ts-muted)!important;
  text-decoration:none;
  transition:color .18s ease;
}
.product-detail-breadcrumb a:hover{color:var(--ts-text)!important}
.product-detail-breadcrumb i{font-size:.48rem;opacity:.65}
.product-detail-breadcrumb span{
  overflow:hidden;
  text-overflow:ellipsis;
}

.product-detail{
  width:min(1240px,calc(100% - 40px))!important;
  padding:22px 0 64px!important;
  grid-template-columns:minmax(0,1.08fr) minmax(390px,.92fr)!important;
  gap:clamp(34px,4vw,58px)!important;
  align-items:start!important;
}

.product-detail .product-gallery{
  position:sticky;
  top:calc(var(--ts-header-h) + 22px);
  border:1px solid var(--ts-line)!important;
  border-radius:24px!important;
  background:var(--ts-surface)!important;
  box-shadow:0 18px 55px rgba(15,23,42,.06)!important;
  overflow:hidden!important;
}

.product-detail .product-image-swiper{
  background:
    radial-gradient(circle at 50% 16%,color-mix(in srgb,var(--ts-blue) 7%,transparent),transparent 38%),
    var(--ts-surface-soft)!important;
}

.product-detail .product-image-swiper .swiper-slide{
  min-height:500px!important;
  height:500px!important;
  padding:28px!important;
}
.product-detail .product-image-swiper img{
  width:100%!important;
  height:100%!important;
  max-height:444px!important;
  padding:0!important;
  object-fit:contain!important;
  border-radius:18px;
}

.product-detail .product-gallery-counter{
  top:16px!important;
  left:16px!important;
  min-width:48px!important;
  height:28px!important;
  padding:0 9px!important;
  border:1px solid var(--ts-line)!important;
  background:color-mix(in srgb,var(--ts-surface) 90%,transparent)!important;
  box-shadow:none!important;
  font-size:.64rem!important;
  backdrop-filter:blur(12px);
}

.product-detail .swiper-button-prev,
.product-detail .swiper-button-next{
  width:38px!important;
  height:38px!important;
  border:1px solid var(--ts-line)!important;
  border-radius:50%!important;
  background:color-mix(in srgb,var(--ts-surface) 92%,transparent)!important;
  color:var(--ts-text)!important;
  box-shadow:0 8px 22px rgba(0,0,0,.08)!important;
  backdrop-filter:blur(12px);
}
.product-detail .swiper-button-prev::after,
.product-detail .swiper-button-next::after{font-size:.72rem!important;font-weight:900!important}

.product-detail .product-thumbs{
  display:flex!important;
  gap:8px!important;
  padding:12px!important;
  border-top:1px solid var(--ts-line)!important;
  background:var(--ts-surface)!important;
  overflow-x:auto;
  scrollbar-width:none;
}
.product-detail .product-thumbs::-webkit-scrollbar{display:none}
.product-detail .thumb-btn{
  width:66px!important;
  height:66px!important;
  flex:0 0 66px!important;
  padding:5px!important;
  border:1px solid var(--ts-line)!important;
  border-radius:12px!important;
  background:var(--ts-surface-soft)!important;
  box-shadow:none!important;
}
.product-detail .thumb-btn img{width:100%!important;height:100%!important;object-fit:contain!important}
.product-detail .thumb-btn.active{
  border-color:var(--ts-blue)!important;
  box-shadow:0 0 0 2px color-mix(in srgb,var(--ts-blue) 12%,transparent)!important;
}
.product-detail .gallery-hint{display:none!important}

.product-detail .product-info{
  padding:4px 0 0!important;
  min-width:0;
}

.product-detail .product-brand{
  margin:0 0 10px!important;
  display:flex!important;
  align-items:center;
  flex-wrap:wrap;
  gap:7px;
  color:var(--ts-muted)!important;
  font-size:.68rem!important;
  font-weight:650!important;
}
.product-detail .product-brand>span:first-child{
  color:var(--ts-blue)!important;
  font-weight:800!important;
}
.product-detail .product-brand-sep{opacity:.45}
.product-detail .product-category-links{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:4px;
}
.product-detail .product-category-links a{
  color:var(--ts-muted)!important;
  text-decoration:none;
}
.product-detail .product-category-links a:hover{color:var(--ts-text)!important}

.product-detail .product-info h1{
  margin:0 0 14px!important;
  max-width:720px;
  color:var(--ts-text)!important;
  font-size:clamp(1.8rem,2.5vw,2.8rem)!important;
  line-height:1.22!important;
  letter-spacing:-.025em!important;
  font-weight:850!important;
}

.product-detail .product-rating-summary{
  min-height:30px;
  display:flex!important;
  align-items:center;
  gap:8px!important;
  margin-bottom:18px!important;
  color:var(--ts-muted)!important;
  font-size:.68rem!important;
}
.product-detail .stars-row{gap:2px!important}
.product-detail .stars-row i{font-size:.66rem!important}
.product-detail .rating-value{color:var(--ts-text);font-weight:800}
.product-detail .rating-count{color:var(--ts-muted)!important;text-decoration:none;border-bottom:1px solid var(--ts-line)}

.product-detail .product-price-panel{
  margin:0 0 16px;
  padding:16px 18px;
  border:1px solid var(--ts-line);
  border-radius:18px;
  background:var(--ts-surface-soft);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}
.product-detail .product-price-main{min-width:0}
.product-detail .product-price{
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:none!important;
  box-shadow:none!important;
  color:var(--ts-text)!important;
  font-size:clamp(1.55rem,2vw,2rem)!important;
  line-height:1.2!important;
  font-weight:900!important;
  letter-spacing:-.02em!important;
}
.product-detail .product-price span{
  color:var(--ts-muted)!important;
  font-size:.72rem!important;
  font-weight:650!important;
}
.product-detail .product-price-offer{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:8px;
}
.product-detail .old-price{
  margin:0!important;
  color:var(--ts-muted)!important;
  font-size:.68rem!important;
  text-decoration:line-through;
}
.product-detail .discount-badge{
  padding:4px 8px!important;
  border-radius:999px!important;
  background:rgba(239,68,68,.10)!important;
  color:#ef4444!important;
  border:1px solid rgba(239,68,68,.16)!important;
  box-shadow:none!important;
  font-size:.60rem!important;
  font-weight:800!important;
}
.product-detail .product-techcoin{
  margin:0!important;
  flex:0 0 auto;
  padding:7px 9px;
  border:1px solid var(--ts-line);
  border-radius:10px;
  background:var(--ts-surface);
  color:var(--ts-muted)!important;
  font-size:.60rem!important;
}

.product-detail .stock-status-banner{
  width:100%!important;
  min-height:54px;
  margin:0 0 16px!important;
  padding:11px 13px!important;
  border-radius:14px!important;
  gap:10px!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
}
.product-detail .stock-status-banner>i{font-size:1rem!important}
.product-detail .stock-status-banner strong{font-size:.72rem!important;margin:0 0 2px!important}
.product-detail .stock-status-banner p{font-size:.60rem!important;line-height:1.5!important}
.product-detail .stock-status-banner.in{
  background:rgba(16,185,129,.055)!important;
  border-color:rgba(16,185,129,.16)!important;
}
.product-detail .stock-status-banner.low{
  background:rgba(245,158,11,.055)!important;
  border-color:rgba(245,158,11,.18)!important;
}
.product-detail .stock-status-banner.out{
  background:rgba(239,68,68,.055)!important;
  border-color:rgba(239,68,68,.18)!important;
}

.product-detail .product-short{
  margin:0 0 10px!important;
  color:var(--ts-text)!important;
  font-size:.78rem!important;
  line-height:1.9!important;
  font-weight:600;
}
.product-detail .product-description{
  margin:0 0 14px!important;
  padding:0!important;
  min-height:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  color:var(--ts-muted)!important;
  font-size:.72rem!important;
  line-height:1.95!important;
}
.product-detail .product-description p{margin:0 0 8px!important}

.product-detail .product-meta{
  display:flex!important;
  align-items:center;
  flex-wrap:wrap;
  gap:7px!important;
  margin:0 0 16px!important;
}
.product-detail .product-meta span{
  min-height:30px;
  padding:5px 9px!important;
  border:1px solid var(--ts-line)!important;
  border-radius:9px!important;
  background:transparent!important;
  color:var(--ts-muted)!important;
  font-size:.60rem!important;
}
.product-detail .product-meta .meta-sep{display:none!important}
.product-detail .product-meta i{color:var(--ts-muted)!important;font-size:.58rem!important}

.product-detail .product-colors-block{
  margin:0 0 16px!important;
  padding:14px!important;
  border:1px solid var(--ts-line)!important;
  border-radius:16px!important;
  background:var(--ts-surface)!important;
  box-shadow:none!important;
}
.product-detail .colors-label{
  margin:0 0 10px!important;
  color:var(--ts-text)!important;
  font-size:.68rem!important;
}
.product-detail .color-swatches{gap:7px!important}
.product-detail .color-swatch{
  min-height:36px;
  padding:6px 9px!important;
  border-radius:10px!important;
  box-shadow:none!important;
  font-size:.62rem!important;
}
.product-detail .swatch-dot{width:16px!important;height:16px!important}
.product-detail .color-selected-hint{margin:8px 0 0!important;font-size:.58rem!important;color:var(--ts-muted)!important}

.product-detail .buy-box{
  margin:0!important;
  padding:14px!important;
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
  border:1px solid var(--ts-line)!important;
  border-radius:18px!important;
  background:var(--ts-surface)!important;
  box-shadow:none!important;
}
.product-detail .add-to-cart-form{
  flex:1 1 auto!important;
  min-width:0!important;
  display:grid!important;
  grid-template-columns:120px minmax(210px,1fr)!important;
  gap:10px!important;
  align-items:center!important;
}
.product-detail .qty-selector{
  height:44px!important;
  padding:3px!important;
  border:1px solid var(--ts-line)!important;
  border-radius:12px!important;
  background:var(--ts-surface-soft)!important;
  box-shadow:none!important;
}
.product-detail .qty-selector .qty-btn{
  width:34px!important;
  height:36px!important;
  border-radius:9px!important;
  background:transparent!important;
  color:var(--ts-text)!important;
  box-shadow:none!important;
}
.product-detail .qty-selector .qty-btn:hover:not(:disabled){
  background:var(--ts-surface)!important;
  color:var(--ts-text)!important;
  box-shadow:none!important;
}
.product-detail .qty-selector input{
  width:42px!important;
  height:36px!important;
  color:var(--ts-text)!important;
  font-size:.72rem!important;
}
.product-detail .buy-btn{
  width:100%!important;
  min-width:210px!important;
  min-height:46px!important;
  padding:0 22px!important;
  border:1px solid color-mix(in srgb,var(--ts-blue) 82%,#fff)!important;
  border-radius:13px!important;
  background:linear-gradient(180deg,color-mix(in srgb,var(--ts-blue) 88%,#fff),var(--ts-blue))!important;
  color:#fff!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:9px!important;
  white-space:nowrap!important;
  overflow:visible!important;
  text-overflow:clip!important;
  line-height:1!important;
  font-size:.78rem!important;
  font-weight:850!important;
  letter-spacing:0!important;
  box-shadow:0 8px 20px color-mix(in srgb,var(--ts-blue) 20%,transparent)!important;
  transform:none!important;
  transition:transform .18s ease,box-shadow .18s ease,filter .18s ease!important;
}
.product-detail .buy-btn i{
  flex:0 0 auto!important;
  font-size:.82rem!important;
}
.product-detail .buy-btn::after{display:none!important}
.product-detail .buy-btn:hover{
  filter:brightness(1.04);
  transform:translateY(-1px)!important;
  box-shadow:0 10px 24px color-mix(in srgb,var(--ts-blue) 27%,transparent)!important;
}
.product-detail .buy-btn:active{
  transform:translateY(0)!important;
  box-shadow:0 5px 12px color-mix(in srgb,var(--ts-blue) 18%,transparent)!important;
}
.product-detail .favorite-btn,
.product-detail .wishlist-btn.detail{
  width:44px!important;
  height:44px!important;
  min-width:44px!important;
  flex:0 0 44px!important;
  border:1px solid var(--ts-line)!important;
  border-radius:12px!important;
  background:var(--ts-surface-soft)!important;
  color:var(--ts-muted)!important;
  box-shadow:none!important;
}
.product-detail .wishlist-btn.detail.saved{color:#ef4444!important;background:rgba(239,68,68,.07)!important}
.product-detail .subtotal-row{
  grid-column:1 / -1;
  width:100%!important;
  margin:1px 0 0!important;
  padding-top:8px;
  border-top:1px solid var(--ts-line);
  color:var(--ts-muted)!important;
  font-size:.62rem!important;
}
.product-detail .subtotal-row strong{color:var(--ts-text)!important;font-size:.72rem!important}

.product-detail .product-assurance-grid{
  margin-top:12px!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:7px!important;
}
.product-detail .product-assurance-item{
  min-height:74px;
  padding:10px!important;
  border-radius:14px!important;
  background:transparent!important;
  box-shadow:none!important;
}
.product-detail .product-assurance-icon{
  width:30px!important;
  height:30px!important;
  flex-basis:30px!important;
  border-radius:9px!important;
}
.product-detail .product-assurance-item strong{font-size:.61rem!important}
.product-detail .product-assurance-item small{font-size:.53rem!important;line-height:1.45!important}

.product-detail .staff-actions{
  margin-top:12px!important;
  padding-top:12px;
  border-top:1px solid var(--ts-line);
}

body.dark .product-detail .product-gallery{
  box-shadow:0 18px 55px rgba(0,0,0,.18)!important;
}
body.dark .product-detail .product-image-swiper{
  background:
    radial-gradient(circle at 50% 16%,rgba(0,113,227,.10),transparent 38%),
    #0c0c0f!important;
}

@media(max-width:900px){
  .product-detail-breadcrumb{width:min(100% - 28px,1240px);margin-top:16px}
  .product-detail{
    width:min(100% - 28px,1240px)!important;
    grid-template-columns:1fr!important;
    gap:24px!important;
    padding-top:16px!important;
  }
  .product-detail .product-gallery{
    position:static!important;
  }
  .product-detail .product-image-swiper .swiper-slide{
    min-height:420px!important;
    height:420px!important;
  }
  .product-detail .product-image-swiper img{max-height:370px!important}
  .product-detail .product-info{max-width:none}
}

@media(max-width:620px){
  .product-detail-breadcrumb{width:min(100% - 22px,1240px);font-size:.60rem}
  .product-detail{
    width:min(100% - 22px,1240px)!important;
    padding:12px 0 42px!important;
    gap:18px!important;
  }
  .product-detail .product-gallery{border-radius:18px!important}
  .product-detail .product-image-swiper .swiper-slide{
    min-height:320px!important;
    height:320px!important;
    padding:18px!important;
  }
  .product-detail .product-image-swiper img{max-height:284px!important}
  .product-detail .product-thumbs{padding:9px!important}
  .product-detail .thumb-btn{width:54px!important;height:54px!important;flex-basis:54px!important}
  .product-detail .product-info h1{font-size:1.7rem!important;line-height:1.3!important}
  .product-detail .product-price-panel{
    padding:13px!important;
    border-radius:14px;
    align-items:flex-start;
  }
  .product-detail .product-price{font-size:1.45rem!important}
  .product-detail .product-techcoin{display:none!important}
  .product-detail .add-to-cart-form{
    grid-template-columns:1fr!important;
  }
  .product-detail .buy-btn{
    min-width:0!important;
    min-height:48px!important;
    font-size:.76rem!important;
  }
  .product-detail .qty-selector{
    width:100%!important;
    justify-content:space-between!important;
  }
  .product-detail .buy-btn{width:100%!important}
  .product-detail .favorite-btn,
  .product-detail .wishlist-btn.detail{flex:0 0 44px!important;min-width:44px!important}
  .product-detail .product-assurance-grid{grid-template-columns:1fr!important}
  .product-detail .product-assurance-item{min-height:58px}
}


/* Product description — full-width section below product */
.product-description-section{
  width:min(1240px,calc(100% - 40px));
  margin:0 auto 34px;
}
.product-description-shell{
  border:1px solid var(--ts-line);
  border-radius:22px;
  background:var(--ts-surface);
  overflow:hidden;
  box-shadow:none;
}
.product-description-head{
  min-height:92px;
  padding:22px 24px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  border-bottom:1px solid var(--ts-line);
  background:
    linear-gradient(180deg,color-mix(in srgb,var(--ts-surface-soft) 78%,transparent),transparent),
    var(--ts-surface);
}
.product-description-kicker{
  display:block;
  margin-bottom:5px;
  color:var(--ts-blue);
  font-size:.63rem;
  font-weight:800;
}
.product-description-head h2{
  margin:0;
  color:var(--ts-text);
  font-size:clamp(1.15rem,1.7vw,1.55rem);
  line-height:1.45;
  font-weight:850;
}
.product-description-head-icon{
  width:42px;
  height:42px;
  flex:0 0 42px;
  display:grid;
  place-items:center;
  border:1px solid var(--ts-line);
  border-radius:13px;
  background:var(--ts-surface-soft);
  color:var(--ts-muted);
  font-size:.88rem;
}
.product-description-content{
  max-width:960px;
  padding:26px 24px 30px;
}
.product-description-lead{
  margin:0 0 18px;
  padding-bottom:18px;
  border-bottom:1px solid var(--ts-line);
  color:var(--ts-text);
  font-size:.88rem;
  line-height:2;
  font-weight:650;
}
.product-description-body{
  color:var(--ts-muted);
  font-size:.78rem;
  line-height:2.15;
}
.product-description-body p{
  margin:0 0 14px;
}
.product-description-body p:last-child{
  margin-bottom:0;
}

@media(max-width:900px){
  .product-description-section{
    width:min(100% - 28px,1240px);
  }
}
@media(max-width:620px){
  .product-description-section{
    width:min(100% - 22px,1240px);
    margin-bottom:26px;
  }
  .product-description-shell{
    border-radius:18px;
  }
  .product-description-head{
    min-height:78px;
    padding:18px;
  }
  .product-description-head h2{
    font-size:1.08rem;
  }
  .product-description-head-icon{
    width:38px;
    height:38px;
    flex-basis:38px;
    border-radius:11px;
  }
  .product-description-content{
    padding:20px 18px 24px;
  }
  .product-description-lead{
    font-size:.78rem;
    line-height:1.95;
  }
  .product-description-body{
    font-size:.72rem;
    line-height:2;
  }
}


/* =========================================================
   Order fulfillment — snapshots, status timeline and admin detail
   ========================================================= */
.order-status-badge.status-confirmed{
  background:rgba(99,102,241,.10)!important;
  border-color:rgba(99,102,241,.35)!important;
  color:#818cf8!important;
}
.order-status-badge.status-packed{
  background:rgba(168,85,247,.10)!important;
  border-color:rgba(168,85,247,.35)!important;
  color:#c084fc!important;
}
body:not(.dark) .order-status-badge.status-confirmed{color:#4338ca!important}
body:not(.dark) .order-status-badge.status-packed{color:#7e22ce!important}

.order-status-steps span.active{
  border-color:var(--ts-blue)!important;
  color:var(--ts-text)!important;
  box-shadow:0 0 0 2px color-mix(in srgb,var(--ts-blue) 10%,transparent)!important;
}
.order-status-steps span.cancelled{
  color:#ef4444!important;
  border-color:rgba(239,68,68,.25)!important;
  background:rgba(239,68,68,.07)!important;
}
.order-item-sku{
  display:block;
  margin-top:2px;
  color:var(--ts-muted);
  font-size:.56rem;
  font-style:normal;
}
.admin-order-snapshot-line{
  display:flex;
  flex-wrap:wrap;
  gap:7px 14px;
  margin-top:9px;
  padding-top:9px;
  border-top:1px solid var(--ts-line);
  color:var(--ts-muted);
  font-size:.62rem;
}
.admin-order-snapshot-line span{
  display:inline-flex;
  align-items:center;
  gap:5px;
}
.admin-order-snapshot-line i{color:var(--ts-blue)}

.admin-order-detail-page{
  min-width:0;
}
.admin-order-detail-kicker{
  display:block;
  margin-bottom:5px;
  color:var(--ts-blue);
  font-size:.66rem;
  font-weight:800;
}
.admin-order-detail-summary{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
  margin-bottom:14px;
}
.admin-order-detail-summary>div{
  min-width:0;
  padding:14px;
  border:1px solid var(--ts-line);
  border-radius:14px;
  background:var(--ts-surface);
}
.admin-order-detail-summary span{
  display:block;
  margin-bottom:6px;
  color:var(--ts-muted);
  font-size:.62rem;
}
.admin-order-detail-summary strong{
  color:var(--ts-text);
  font-size:.82rem;
}
.admin-order-detail-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  margin-bottom:12px;
}
.admin-order-detail-card{
  min-width:0;
  padding:16px;
  border:1px solid var(--ts-line);
  border-radius:16px;
  background:var(--ts-surface);
}
.admin-order-detail-card-head{
  display:flex;
  align-items:center;
  gap:10px;
  padding-bottom:12px;
  margin-bottom:12px;
  border-bottom:1px solid var(--ts-line);
}
.admin-order-detail-card-head>i{
  width:34px;
  height:34px;
  flex:0 0 34px;
  display:grid;
  place-items:center;
  border-radius:10px;
  background:color-mix(in srgb,var(--ts-blue) 9%,transparent);
  color:var(--ts-blue);
}
.admin-order-detail-card-head h2{
  margin:0;
  color:var(--ts-text);
  font-size:.84rem;
}
.admin-order-detail-card-head p{
  margin:3px 0 0;
  color:var(--ts-muted);
  font-size:.58rem;
  line-height:1.5;
}
.admin-order-detail-list{
  margin:0;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}
.admin-order-detail-list>div{
  min-width:0;
  padding:9px 10px;
  border-radius:10px;
  background:var(--ts-surface-soft);
}
.admin-order-detail-list>div.wide{grid-column:1/-1}
.admin-order-detail-list dt{
  margin:0 0 4px;
  color:var(--ts-muted);
  font-size:.55rem;
}
.admin-order-detail-list dd{
  margin:0;
  color:var(--ts-text);
  font-size:.68rem;
  line-height:1.65;
  overflow-wrap:anywhere;
}
.admin-order-products-card{margin-bottom:12px}
.admin-order-product-list{
  display:grid;
  gap:8px;
}
.admin-order-product{
  display:grid;
  grid-template-columns:64px minmax(0,1fr) auto auto;
  align-items:center;
  gap:12px;
  padding:9px;
  border:1px solid var(--ts-line);
  border-radius:12px;
  background:var(--ts-surface-soft);
}
.admin-order-product-media{
  width:64px;
  height:64px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:10px;
  background:var(--ts-surface);
  color:var(--ts-muted);
}
.admin-order-product-media img{
  width:100%;
  height:100%;
  object-fit:contain;
  padding:4px;
}
.admin-order-product-info{min-width:0}
.admin-order-product-info>strong{
  display:block;
  color:var(--ts-text);
  font-size:.72rem;
  line-height:1.5;
}
.admin-order-product-meta{
  display:flex;
  flex-wrap:wrap;
  gap:4px 9px;
  margin-top:5px;
  color:var(--ts-muted);
  font-size:.55rem;
}
.admin-order-product-qty,
.admin-order-product-price{
  display:grid;
  gap:3px;
  text-align:center;
  white-space:nowrap;
}
.admin-order-product-qty span,
.admin-order-product-price span{
  color:var(--ts-muted);
  font-size:.54rem;
}
.admin-order-product-qty strong,
.admin-order-product-price strong{
  color:var(--ts-text);
  font-size:.68rem;
}
.admin-order-status-editor{
  display:grid;
  gap:10px;
}
.admin-order-status-editor .form-group{margin:0!important}
.admin-order-history,
.customer-order-history{
  display:grid;
  gap:0;
}
.admin-order-history-row,
.customer-order-history-row{
  position:relative;
  display:grid;
  grid-template-columns:18px minmax(0,1fr);
  gap:8px;
  padding:8px 0;
}
.admin-order-history-row:not(:last-child)::before,
.customer-order-history-row:not(:last-child)::before{
  content:"";
  position:absolute;
  top:24px;
  bottom:-8px;
  right:8px;
  width:1px;
  background:var(--ts-line);
}
.admin-order-history-dot,
.customer-order-history-dot{
  width:10px;
  height:10px;
  margin-top:4px;
  border:2px solid var(--ts-surface);
  border-radius:50%;
  background:var(--ts-muted);
  box-shadow:0 0 0 1px var(--ts-line);
  z-index:1;
}
.admin-order-history-dot.status-pending,
.customer-order-history-dot.status-pending{background:#f59e0b}
.admin-order-history-dot.status-confirmed,
.customer-order-history-dot.status-confirmed{background:#6366f1}
.admin-order-history-dot.status-preparing,
.customer-order-history-dot.status-preparing{background:#3b82f6}
.admin-order-history-dot.status-packed,
.customer-order-history-dot.status-packed{background:#a855f7}
.admin-order-history-dot.status-shipping,
.customer-order-history-dot.status-shipping{background:#06b6d4}
.admin-order-history-dot.status-delivered,
.customer-order-history-dot.status-delivered{background:#10b981}
.admin-order-history-dot.status-cancelled,
.customer-order-history-dot.status-cancelled{background:#ef4444}
.admin-order-history-row strong,
.customer-order-history-row strong{
  color:var(--ts-text);
  font-size:.66rem;
}
.admin-order-history-row p,
.customer-order-history-row p{
  margin:2px 0;
  color:var(--ts-muted);
  font-size:.57rem;
  line-height:1.55;
}
.admin-order-history-row small,
.customer-order-history-row small{
  color:var(--ts-muted);
  font-size:.52rem;
}

@media(max-width:900px){
  .admin-order-detail-summary{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .admin-order-detail-grid{
    grid-template-columns:1fr;
  }
}
@media(max-width:620px){
  .admin-order-detail-summary{
    grid-template-columns:1fr 1fr;
    gap:7px;
  }
  .admin-order-detail-summary>div,
  .admin-order-detail-card{
    padding:11px;
    border-radius:13px;
  }
  .admin-order-detail-list{
    grid-template-columns:1fr;
  }
  .admin-order-detail-list>div.wide{grid-column:auto}
  .admin-order-product{
    grid-template-columns:52px minmax(0,1fr);
    gap:8px;
  }
  .admin-order-product-media{
    width:52px;
    height:52px;
  }
  .admin-order-product-qty,
  .admin-order-product-price{
    grid-column:auto;
    display:flex;
    justify-content:space-between;
    text-align:right;
  }
  .admin-order-product-qty{grid-column:1/-1}
  .admin-order-product-price{grid-column:1/-1}
  .order-status-steps{
    justify-content:flex-start!important;
    flex-wrap:nowrap!important;
    overflow-x:auto!important;
    padding-bottom:4px!important;
    scrollbar-width:none!important;
  }
  .order-status-steps::-webkit-scrollbar{display:none}
  .order-status-steps span{
    flex:0 0 auto!important;
    padding:5px 9px!important;
    font-size:.56rem!important;
  }
}


/* =========================================================
   TechStore Vitality v2
   Richer color tints across the whole UI without losing the minimal look.
   ========================================================= */
:root{
  --ts-violet:#8b5cf6;
  --ts-sky:#38bdf8;
  --ts-teal:#2dd4bf;
  --ts-fuchsia:#d946ef;
  --ts-coral:#fb7185;
  --ts-gold:#f59e0b;
}

/* Core surfaces: stop reading as pure monochrome. */
body:not(.dark){
  --ts-bg:#f5f7fc;
  --ts-surface:#ffffff;
  --ts-surface-soft:#f7f8ff;
  --ts-line:rgba(69,76,119,.10);
  --ts-line-strong:rgba(76,82,133,.17);
  background:
    radial-gradient(circle at 8% 10%,rgba(56,189,248,.075),transparent 25rem),
    radial-gradient(circle at 92% 24%,rgba(139,92,246,.07),transparent 27rem),
    radial-gradient(circle at 50% 92%,rgba(45,212,191,.055),transparent 28rem),
    var(--ts-bg)!important;
}

body.dark{
  --ts-bg:#070913;
  --ts-surface:#0f1320;
  --ts-surface-soft:#141927;
  --ts-text:#f5f7fb;
  --ts-muted:#aab2c3;
  --ts-line:rgba(148,163,184,.13);
  --ts-line-strong:rgba(167,139,250,.22);
  --ts-shadow:0 20px 70px rgba(0,0,0,.34);
  --ts-shadow-soft:0 8px 28px rgba(0,0,0,.24);
  background:
    radial-gradient(circle at 8% 8%,rgba(56,189,248,.10),transparent 27rem),
    radial-gradient(circle at 91% 20%,rgba(139,92,246,.11),transparent 30rem),
    radial-gradient(circle at 48% 88%,rgba(45,212,191,.065),transparent 29rem),
    #070913!important;
}

.page-body{
  background:transparent!important;
}

/* Header / navigation: subtle violet-blue glass instead of gray glass. */
.header{
  border-bottom-color:color-mix(in srgb,var(--ts-purple) 16%,var(--ts-line))!important;
  background:
    linear-gradient(90deg,
      color-mix(in srgb,var(--ts-surface) 91%,rgba(56,189,248,.10)),
      color-mix(in srgb,var(--ts-surface) 92%,rgba(139,92,246,.10))
    )!important;
}
body.dark .header{
  background:
    linear-gradient(90deg,rgba(9,15,29,.89),rgba(18,12,31,.89))!important;
  box-shadow:0 8px 32px rgba(5,8,20,.24)!important;
}
.header .actions>a:hover,
.header .actions>button:hover,
.nav-toggle:hover{
  color:#c4b5fd!important;
  background:rgba(139,92,246,.10)!important;
  border-color:rgba(139,92,246,.20)!important;
}
.logo-img,
.footer-logo-img{
  filter:none!important;
}

/* Primary content cards: slight colored surface depth. */
.product-card,
.category-card,
.category-mini-card,
.feature-card,
.trust-item,
.order-card,
.profile-section,
.dashboard-stat-card,
.quick-action-card,
.admin-dashboard-panel,
.admin-order-detail-card{
  background:
    linear-gradient(145deg,
      color-mix(in srgb,var(--ts-surface) 97%,rgba(56,189,248,.03)),
      color-mix(in srgb,var(--ts-surface) 96%,rgba(139,92,246,.035))
    )!important;
}

body.dark .product-card,
body.dark .category-card,
body.dark .category-mini-card,
body.dark .feature-card,
body.dark .trust-item,
body.dark .order-card,
body.dark .profile-section,
body.dark .dashboard-stat-card,
body.dark .quick-action-card,
body.dark .admin-dashboard-panel,
body.dark .admin-order-detail-card{
  background:
    linear-gradient(145deg,
      color-mix(in srgb,var(--ts-surface) 92%,rgba(56,189,248,.08)),
      color-mix(in srgb,var(--ts-surface) 92%,rgba(139,92,246,.08))
    )!important;
}

/* Product cards now carry their accent into the surface, not only the top line. */
.product-card{
  background:
    radial-gradient(circle at 92% 0,color-mix(in srgb,var(--card-accent,var(--ts-blue)) 9%,transparent),transparent 32%),
    linear-gradient(155deg,var(--ts-surface),color-mix(in srgb,var(--card-accent,var(--ts-blue)) 3.5%,var(--ts-surface)))!important;
}
body.dark .product-card{
  background:
    radial-gradient(circle at 92% 0,color-mix(in srgb,var(--card-accent,var(--ts-blue)) 14%,transparent),transparent 34%),
    linear-gradient(155deg,var(--ts-surface),color-mix(in srgb,var(--card-accent,var(--ts-blue)) 7%,var(--ts-surface)))!important;
}
.product-card:hover{
  transform:translateY(-3px)!important;
}

/* Category tiles are visibly distinct at rest. */
.category-mini-card{
  background:
    linear-gradient(135deg,
      color-mix(in srgb,var(--card-accent) 10%,var(--ts-surface)),
      color-mix(in srgb,var(--card-accent) 3%,var(--ts-surface-soft)) 60%
    )!important;
}
body.dark .category-mini-card{
  background:
    linear-gradient(135deg,
      color-mix(in srgb,var(--card-accent) 14%,var(--ts-surface)),
      color-mix(in srgb,var(--card-accent) 5%,var(--ts-surface-soft)) 62%
    )!important;
}

/* Section backgrounds: each area gets a restrained identity. */
body.dark .apple-tech-worlds{
  background:
    radial-gradient(circle at 9% 18%,rgba(34,211,238,.11),transparent 27%),
    linear-gradient(180deg,#08101a,#090d17)!important;
}
body.dark .apple-categories{
  background:
    radial-gradient(circle at 88% 14%,rgba(52,211,153,.10),transparent 29%),
    linear-gradient(180deg,#081210,#091018)!important;
}
body.dark .special-products{
  background:
    radial-gradient(circle at 14% 14%,rgba(251,146,60,.11),transparent 28%),
    linear-gradient(180deg,#120d0a,#0d0c13)!important;
}
body.dark .new-products-section{
  background:
    radial-gradient(circle at 86% 16%,rgba(34,211,238,.10),transparent 28%),
    linear-gradient(180deg,#07121a,#0b0f18)!important;
}
body.dark .best-sellers-section{
  background:
    radial-gradient(circle at 15% 18%,rgba(139,92,246,.12),transparent 29%),
    linear-gradient(180deg,#100a19,#0c0c16)!important;
}
body.dark .brands-section{
  background:
    radial-gradient(circle at 86% 16%,rgba(244,114,182,.10),transparent 28%),
    linear-gradient(180deg,#120a14,#0b0e17)!important;
}

body:not(.dark) .apple-tech-worlds{
  background:
    radial-gradient(circle at 10% 18%,rgba(34,211,238,.08),transparent 28%),
    #f8fbff!important;
}
body:not(.dark) .apple-categories{
  background:
    radial-gradient(circle at 88% 14%,rgba(52,211,153,.08),transparent 29%),
    #f8fcfa!important;
}
body:not(.dark) .special-products{
  background:
    radial-gradient(circle at 13% 13%,rgba(251,146,60,.08),transparent 29%),
    #fffaf6!important;
}
body:not(.dark) .new-products-section{
  background:
    radial-gradient(circle at 86% 15%,rgba(34,211,238,.08),transparent 29%),
    #f7fbff!important;
}
body:not(.dark) .best-sellers-section{
  background:
    radial-gradient(circle at 15% 18%,rgba(139,92,246,.08),transparent 29%),
    #faf8ff!important;
}
body:not(.dark) .brands-section{
  background:
    radial-gradient(circle at 86% 16%,rgba(244,114,182,.07),transparent 28%),
    #fff8fc!important;
}

/* Profiles / account / admin: colored icons and softer tinted panels. */
.dashboard-stat-card:nth-child(6n+1) .dashboard-stat-icon{color:#38bdf8!important;background:rgba(56,189,248,.12)!important}
.dashboard-stat-card:nth-child(6n+2) .dashboard-stat-icon{color:#8b5cf6!important;background:rgba(139,92,246,.12)!important}
.dashboard-stat-card:nth-child(6n+3) .dashboard-stat-icon{color:#34d399!important;background:rgba(52,211,153,.12)!important}
.dashboard-stat-card:nth-child(6n+4) .dashboard-stat-icon{color:#f59e0b!important;background:rgba(245,158,11,.12)!important}
.dashboard-stat-card:nth-child(6n+5) .dashboard-stat-icon{color:#f472b6!important;background:rgba(244,114,182,.12)!important}
.dashboard-stat-card:nth-child(6n+6) .dashboard-stat-icon{color:#818cf8!important;background:rgba(129,140,248,.12)!important}

.profile-section-head>i,
.admin-order-detail-card-head>i{
  background:linear-gradient(135deg,rgba(56,189,248,.12),rgba(139,92,246,.12))!important;
  color:#a78bfa!important;
  border:1px solid rgba(139,92,246,.14)!important;
}

.profile-nav-link.active{
  background:linear-gradient(135deg,rgba(56,189,248,.11),rgba(139,92,246,.12))!important;
  color:#8b5cf6!important;
}
body.dark .profile-nav-link.active{color:#c4b5fd!important}

/* Forms no longer feel gray. */
.form-control,
.auth-form input,
.auth-form select,
.auth-form textarea{
  background:
    linear-gradient(135deg,
      color-mix(in srgb,var(--ts-surface-soft) 96%,rgba(56,189,248,.035)),
      color-mix(in srgb,var(--ts-surface-soft) 96%,rgba(139,92,246,.035))
    )!important;
}
.form-control:hover{
  border-color:color-mix(in srgb,var(--ts-purple) 26%,var(--ts-line))!important;
}

/* Brand wall: preserve original uploaded/brand colors, never invert them. */
.brand-logo-card .brand-logo-mark,
body:not(.dark) .brand-logo-card .brand-logo-mark,
body.dark .brand-logo-card .brand-logo-mark{
  filter:none!important;
  opacity:1!important;
}
.brand-logo-card{
  background:
    radial-gradient(circle at 50% 16%,color-mix(in srgb,var(--brand-accent) 8%,transparent),transparent 46%),
    var(--ts-surface)!important;
}
body.dark .brand-logo-card{
  background:
    radial-gradient(circle at 50% 16%,color-mix(in srgb,var(--brand-accent) 12%,transparent),transparent 47%),
    var(--ts-surface)!important;
}
.brand-logo-card:hover{
  border-color:color-mix(in srgb,var(--brand-accent) 34%,var(--ts-line))!important;
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--brand-accent) 12%,transparent)!important;
}

/* Social networks use their familiar identities. */
.social-link[title="اینستاگرام"]{
  color:#e1306c!important;
  background:rgba(225,48,108,.10)!important;
}
.social-link[title="تلگرام"]{
  color:#229ed9!important;
  background:rgba(34,158,217,.10)!important;
}
.social-link[title="واتساپ"]{
  color:#25d366!important;
  background:rgba(37,211,102,.10)!important;
}
.social-link[title="یوتیوب"]{
  color:#ff0033!important;
  background:rgba(255,0,51,.10)!important;
}
.social-link[title="توییتر"]{
  color:var(--ts-text)!important;
  background:color-mix(in srgb,var(--ts-text) 7%,transparent)!important;
}

/* Mega menus and drawers receive the same ambient tint. */
.nav-dropdown,
#siteNav .nav-dropdown.nav-mega,
.cart-drawer,
.bell-panel{
  background:
    radial-gradient(circle at 90% 0,rgba(56,189,248,.08),transparent 34%),
    radial-gradient(circle at 8% 100%,rgba(139,92,246,.08),transparent 36%),
    color-mix(in srgb,var(--ts-surface) 95%,transparent)!important;
}

/* Keep status colors semantic and vivid. */
.order-status-badge.status-pending{color:#f59e0b!important;background:rgba(245,158,11,.11)!important}
.order-status-badge.status-confirmed{color:#818cf8!important;background:rgba(129,140,248,.11)!important}
.order-status-badge.status-preparing{color:#38bdf8!important;background:rgba(56,189,248,.11)!important}
.order-status-badge.status-packed{color:#c084fc!important;background:rgba(192,132,252,.11)!important}
.order-status-badge.status-shipping{color:#22d3ee!important;background:rgba(34,211,238,.11)!important}
.order-status-badge.status-delivered{color:#34d399!important;background:rgba(52,211,153,.11)!important}
.order-status-badge.status-cancelled{color:#fb7185!important;background:rgba(251,113,133,.11)!important}

/* Mobile bottom navigation also gets a touch of color. */
.mobile-bottom-bar{
  background:
    linear-gradient(90deg,
      color-mix(in srgb,var(--ts-surface) 94%,rgba(56,189,248,.07)),
      color-mix(in srgb,var(--ts-surface) 94%,rgba(139,92,246,.07))
    )!important;
}
.mb-item.active i,
.mb-item.active span{
  color:#8b5cf6!important;
}
body.dark .mb-item.active i,
body.dark .mb-item.active span{
  color:#c4b5fd!important;
}

/* Avoid over-coloring tiny screens; keep saturation but reduce ambient area. */
@media(max-width:620px){
  body.dark{
    background:
      radial-gradient(circle at 12% 6%,rgba(56,189,248,.075),transparent 18rem),
      radial-gradient(circle at 92% 25%,rgba(139,92,246,.08),transparent 20rem),
      #070913!important;
  }
  .product-card,
  .category-mini-card,
  .dashboard-stat-card{
    box-shadow:none!important;
  }
}


/* =========================================================
   Header vitality v3 — richer but still premium
   ========================================================= */
.header{
  position:sticky!important;
  isolation:isolate;
  overflow:visible;
  background:
    linear-gradient(100deg,
      color-mix(in srgb,var(--ts-surface) 90%,rgba(34,211,238,.13)) 0%,
      color-mix(in srgb,var(--ts-surface) 93%,rgba(99,102,241,.12)) 48%,
      color-mix(in srgb,var(--ts-surface) 90%,rgba(244,114,182,.10)) 100%
    )!important;
  border-bottom:0!important;
  box-shadow:0 8px 28px rgba(16,24,40,.08)!important;
}
.header::after{
  content:"";
  position:absolute;
  z-index:0;
  right:0;
  bottom:0;
  left:0;
  height:1px;
  background:linear-gradient(90deg,
    transparent 3%,
    rgba(34,211,238,.70) 24%,
    rgba(99,102,241,.78) 50%,
    rgba(217,70,239,.62) 76%,
    transparent 97%
  );
  box-shadow:0 0 16px rgba(99,102,241,.22);
  pointer-events:none;
}
body.dark .header{
  background:
    linear-gradient(100deg,
      rgba(5,15,28,.94) 0%,
      rgba(16,13,34,.95) 50%,
      rgba(26,10,31,.92) 100%
    )!important;
  box-shadow:0 10px 34px rgba(0,0,0,.30)!important;
}
.header .header-top-row{
  position:relative;
  z-index:1;
}

/* Logo cluster */
.header .logo{
  position:relative;
  padding:4px 7px!important;
  border-radius:13px;
}
.header .logo::before{
  content:"";
  position:absolute;
  inset:1px;
  z-index:-1;
  border-radius:12px;
  background:linear-gradient(135deg,rgba(34,211,238,.07),rgba(139,92,246,.08));
  opacity:0;
  transition:opacity .2s ease;
}
.header .logo:hover::before{opacity:1}
.header .logo-img{
  filter:none!important;
  drop-shadow:none;
}
.header .logo:hover .logo-img{
  filter:drop-shadow(0 0 8px rgba(139,92,246,.24))!important;
}
.header .logo-site-name{
  background:linear-gradient(105deg,#38bdf8 0%,#8b5cf6 48%,#f472b6 100%)!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  color:transparent!important;
  font-weight:800!important;
}

/* Navigation pills */
.header .header-navbar nav>ul>li>a,
.header .header-navbar .nav-dropdown-toggle,
.header .header-navbar .nav-theme-btn{
  position:relative;
  overflow:hidden;
}
.header .header-navbar nav>ul>li>a::after,
.header .header-navbar .nav-dropdown-toggle::after{
  content:"";
  position:absolute;
  right:22%;
  bottom:2px;
  left:22%;
  height:2px;
  border-radius:999px;
  background:linear-gradient(90deg,#22d3ee,#8b5cf6,#f472b6);
  opacity:0;
  transform:scaleX(.55);
  transition:opacity .18s ease,transform .18s ease;
}
.header .header-navbar nav>ul>li>a:hover,
.header .header-navbar .nav-dropdown-toggle:hover,
.header .header-navbar .nav-theme-btn:hover{
  color:#a78bfa!important;
  background:linear-gradient(135deg,rgba(34,211,238,.07),rgba(139,92,246,.10))!important;
}
.header .header-navbar nav>ul>li>a:hover::after,
.header .header-navbar .nav-dropdown-toggle:hover::after{
  opacity:1;
  transform:scaleX(1);
}
body.dark .header .header-navbar nav>ul>li>a:hover,
body.dark .header .header-navbar .nav-dropdown-toggle:hover,
body.dark .header .header-navbar .nav-theme-btn:hover{
  color:#c4b5fd!important;
}

/* Search is now visibly part of the palette. */
@media (min-width:901px){
  .header .header-search .search-form,
  .header .header-search.is-open .search-form{
    border:1px solid rgba(139,92,246,.16)!important;
    background:
      linear-gradient(120deg,
        color-mix(in srgb,var(--ts-surface-soft) 92%,rgba(34,211,238,.08)),
        color-mix(in srgb,var(--ts-surface-soft) 92%,rgba(139,92,246,.09))
      )!important;
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.035),
      0 8px 24px rgba(31,41,55,.05)!important;
  }
  body.dark .header .header-search .search-form,
  body.dark .header .header-search.is-open .search-form{
    border-color:rgba(139,92,246,.20)!important;
    background:
      linear-gradient(120deg,rgba(18,28,41,.95),rgba(28,20,44,.95))!important;
  }
  .header .header-search .search-form:focus-within{
    border-color:rgba(139,92,246,.48)!important;
    background:
      linear-gradient(120deg,
        color-mix(in srgb,var(--ts-surface) 94%,rgba(34,211,238,.08)),
        color-mix(in srgb,var(--ts-surface) 94%,rgba(139,92,246,.10))
      )!important;
    box-shadow:
      0 0 0 3px rgba(139,92,246,.09),
      0 12px 30px rgba(34,211,238,.08)!important;
  }
  body.dark .header .header-search .search-form:focus-within{
    background:linear-gradient(120deg,#162333,#241a38)!important;
  }
  .header .header-search-icon{
    color:#8b5cf6!important;
  }
  body.dark .header .header-search-icon{
    color:#a78bfa!important;
  }
}

/* Action icons each get a recognizable accent. */
.header .actions>a,
.header .actions>button,
.header .actions .bell-btn{
  transition:color .18s ease,background .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease!important;
}
.header .actions .theme-toggle{
  color:#f59e0b!important;
  background:rgba(245,158,11,.07)!important;
}
.header .actions .bell-btn{
  color:#38bdf8!important;
  background:rgba(56,189,248,.07)!important;
}
.header .actions .wishlist-action{
  color:#f472b6!important;
  background:rgba(244,114,182,.07)!important;
}
.header .actions [data-cart-drawer-open]{
  color:#8b5cf6!important;
  background:rgba(139,92,246,.08)!important;
}
.header .actions .account-btn{
  color:#2dd4bf!important;
  background:rgba(45,212,191,.07)!important;
}
.header .actions .admin-nav-btn{
  color:#a78bfa!important;
  background:rgba(139,92,246,.08)!important;
}
.header .actions .exit-nav-btn{
  color:#fb7185!important;
  background:rgba(251,113,133,.07)!important;
}
.header .actions .theme-toggle:hover{
  border-color:rgba(245,158,11,.24)!important;
  background:rgba(245,158,11,.13)!important;
  box-shadow:0 8px 22px rgba(245,158,11,.08)!important;
}
.header .actions .bell-btn:hover{
  border-color:rgba(56,189,248,.24)!important;
  background:rgba(56,189,248,.13)!important;
  box-shadow:0 8px 22px rgba(56,189,248,.09)!important;
}
.header .actions .wishlist-action:hover{
  border-color:rgba(244,114,182,.24)!important;
  background:rgba(244,114,182,.13)!important;
  box-shadow:0 8px 22px rgba(244,114,182,.09)!important;
}
.header .actions [data-cart-drawer-open]:hover{
  border-color:rgba(139,92,246,.26)!important;
  background:rgba(139,92,246,.14)!important;
  box-shadow:0 8px 22px rgba(139,92,246,.10)!important;
}
.header .actions .account-btn:hover{
  border-color:rgba(45,212,191,.24)!important;
  background:rgba(45,212,191,.13)!important;
  box-shadow:0 8px 22px rgba(45,212,191,.09)!important;
}
.header .actions>a:hover,
.header .actions>button:hover{
  transform:translateY(-1px);
}

/* Badges stay vivid and readable. */
.header .wishlist-count-badge{
  background:linear-gradient(135deg,#fb7185,#e11d48)!important;
  box-shadow:0 0 0 2px var(--ts-surface),0 4px 10px rgba(225,29,72,.22)!important;
}
.header .cart-count-badge{
  background:linear-gradient(135deg,#f59e0b,#f97316)!important;
  box-shadow:0 0 0 2px var(--ts-surface),0 4px 10px rgba(249,115,22,.22)!important;
}

/* Mobile keeps the same identity, just calmer. */
@media (max-width:900px){
  .header{
    background:
      linear-gradient(100deg,
        color-mix(in srgb,var(--ts-surface) 94%,rgba(34,211,238,.08)),
        color-mix(in srgb,var(--ts-surface) 94%,rgba(139,92,246,.08))
      )!important;
  }
  body.dark .header{
    background:linear-gradient(100deg,rgba(8,18,31,.96),rgba(22,15,38,.96))!important;
  }
  .header::after{
    opacity:.72;
  }
  .header .nav-toggle{
    color:#a78bfa!important;
    border-color:rgba(139,92,246,.14)!important;
    background:rgba(139,92,246,.06)!important;
  }
}


/* =========================================================
   Site background engine v4 — visible layer + true day/night sources
   ========================================================= */
body.has-site-bg{
  position:relative!important;
  isolation:isolate;
}

/* Pick the correct saved image directly from the body class.
   theme.js still updates --bg-img-layer during toggles, but this fallback
   keeps the correct image available even before JS runs. */
body.dark.has-site-bg{
  --site-bg-active:var(--site-bg-dark,var(--site-bg-light,var(--site-bg,none)));
}
body:not(.dark).has-site-bg{
  --site-bg-active:var(--site-bg-light,var(--site-bg-dark,var(--site-bg,none)));
}

/* The old layer used z-index:-1, which placed it behind the body's own
   background paint and made uploaded images effectively invisible. */
body.has-site-bg::before{
  content:""!important;
  position:fixed!important;
  inset:0!important;
  z-index:0!important;
  pointer-events:none!important;
  border-radius:0!important;
  animation:none!important;
  filter:none!important;
  background-image:var(--bg-img-layer,var(--site-bg-active,var(--site-bg,none)))!important;
  background-size:var(--bg-size,cover)!important;
  background-position:var(--bg-position,center)!important;
  background-repeat:no-repeat!important;
  background-attachment:fixed!important;
  opacity:var(--bg-opacity,1)!important;
  will-change:opacity!important;
}

/* Overlay sits above the image, but below all page content. */
body.has-site-bg::after{
  content:""!important;
  position:fixed!important;
  inset:0!important;
  z-index:0!important;
  pointer-events:none!important;
  border-radius:0!important;
  animation:none!important;
  filter:none!important;
  background:var(--bg-overlay-layer,linear-gradient(180deg,rgba(6,4,9,.35),rgba(11,11,15,.28)))!important;
  backdrop-filter:blur(var(--bg-blur,1px))!important;
  -webkit-backdrop-filter:blur(var(--bg-blur,1px))!important;
}

body:not(.dark).has-site-bg::after{
  background:var(--bg-overlay-layer,linear-gradient(180deg,rgba(244,241,251,.20),rgba(236,231,247,.16)))!important;
}

/* Ensure all real page chrome is above the fixed background layers. */
body.has-site-bg > .grid-overlay{
  z-index:0!important;
}
body.has-site-bg .header,
body.has-site-bg .page-body,
body.has-site-bg .footer,
body.has-site-bg .messages-wrap,
body.has-site-bg .mobile-bottom-bar,
body.has-site-bg .cart-drawer,
body.has-site-bg .modal-overlay{
  position:relative;
  z-index:1;
}
body.has-site-bg .header{z-index:1200!important}
body.has-site-bg .mobile-bottom-bar,
body.has-site-bg .cart-drawer,
body.has-site-bg .modal-overlay{z-index:1300}

/* Let the selected image actually show through the page shell. */
body.has-site-bg .page-body{
  background:transparent!important;
}


/* When an admin-selected site background is active, major page sections must
   not paint fully opaque slabs over it. Keep enough tint for readability. */
body.dark.has-site-bg .apple-hero,
body.dark.has-site-bg .apple-tech-worlds,
body.dark.has-site-bg .apple-categories,
body.dark.has-site-bg .categories-section,
body.dark.has-site-bg .product-rail-section,
body.dark.has-site-bg .special-products,
body.dark.has-site-bg .new-products-section,
body.dark.has-site-bg .best-sellers-section,
body.dark.has-site-bg .brands-section,
body.dark.has-site-bg .apple-features,
body.dark.has-site-bg .trust-strip,
body.dark.has-site-bg .newsletter-section{
  background:
    linear-gradient(180deg,rgba(7,9,19,.66),rgba(9,11,22,.74))!important;
  backdrop-filter:blur(1.5px);
  -webkit-backdrop-filter:blur(1.5px);
}

body:not(.dark).has-site-bg .apple-hero,
body:not(.dark).has-site-bg .apple-tech-worlds,
body:not(.dark).has-site-bg .apple-categories,
body:not(.dark).has-site-bg .categories-section,
body:not(.dark).has-site-bg .product-rail-section,
body:not(.dark).has-site-bg .special-products,
body:not(.dark).has-site-bg .new-products-section,
body:not(.dark).has-site-bg .best-sellers-section,
body:not(.dark).has-site-bg .brands-section,
body:not(.dark).has-site-bg .apple-features,
body:not(.dark).has-site-bg .trust-strip,
body:not(.dark).has-site-bg .newsletter-section{
  background:
    linear-gradient(180deg,rgba(248,250,255,.70),rgba(244,247,252,.78))!important;
  backdrop-filter:blur(1.5px);
  -webkit-backdrop-filter:blur(1.5px);
}

/* Non-home pages already use a transparent page shell; keep broad wrappers
   transparent so the configured global background remains visible. */
body.has-site-bg .products-page,
body.has-site-bg .profile-page,
body.has-site-bg .categories-page,
body.has-site-bg .about-page,
body.has-site-bg .cart-page,
body.has-site-bg .orders-page{
  background:transparent!important;
}
