/* =========================================================
   FoxShop Cat Boutique - Main Stylesheet
   Persian RTL Layout & Interactive Enhancements
   Deployable directly on Cloudflare Pages / Static Hosting
   ========================================================= */

@import url('https://fonts.googleapis.com/css2?family=Vazirmatn:wght@300;400;500;600;700;800;900&display=swap');

/* FoxShop Premium Cat Retail UI — inlined for faster first load (removes one CSS request) */
/* FoxShop Premium Cat Retail UI — additive visual layer only */
:root {
  --fox-ink: #191521;
  --fox-muted: #706a78;
  --fox-orange: #ff7a18;
  --fox-orange-2: #ff9f43;
  --fox-pink: #ff5fa2;
  --fox-cream: #fffaf6;
  --fox-card: rgba(255,255,255,.94);
  --fox-line: rgba(255,122,24,.14);
  --fox-shadow: 0 18px 50px rgba(87,44,17,.10);
  --fox-radius: 26px;
}

html { scroll-padding-top: 96px; }
body {
  color: var(--fox-ink);
  background:
    radial-gradient(circle at 8% 14%, rgba(255,159,67,.10) 0 2px, transparent 3px),
    radial-gradient(circle at 91% 23%, rgba(255,95,162,.09) 0 2px, transparent 3px),
    radial-gradient(circle at 82% 82%, rgba(255,122,24,.08) 0 3px, transparent 4px),
    linear-gradient(180deg,#fffaf7 0%,#fffdfa 42%,#fff8f4 100%);
}
body::before {
  content: "🐾   🐱   🐾   🐱";
  position: fixed;
  inset: 90px -10% auto auto;
  width: 120%;
  height: 100vh;
  z-index: -1;
  pointer-events: none;
  user-select: none;
  opacity: .035;
  font-size: clamp(24px, 3vw, 42px);
  letter-spacing: 2.2rem;
  line-height: 7rem;
  transform: rotate(-7deg);
  white-space: pre-wrap;
}
body::after {
  content: "🐾";
  position: fixed;
  left: 18px;
  bottom: 18px;
  z-index: 20;
  width: 54px;
  height: 54px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius: 18px;
  background: rgba(255,255,255,.76);
  border:1px solid rgba(255,122,24,.18);
  box-shadow: 0 14px 34px rgba(87,44,17,.12);
  backdrop-filter: blur(12px);
  font-size: 27px;
  animation: foxFloat 5s ease-in-out infinite;
  pointer-events:none;
}

@keyframes foxFloat { 0%,100%{transform:translateY(0) rotate(-5deg)} 50%{transform:translateY(-8px) rotate(5deg)} }
@keyframes foxShimmer { 0%{transform:translateX(-120%)} 100%{transform:translateX(120%)} }
@keyframes foxReveal { from{opacity:0;transform:translateY(14px)} to{opacity:1;transform:translateY(0)} }

/* Premium top strip */
body > div:first-child {
  position: relative;
  overflow: hidden;
  background: linear-gradient(90deg,#8e44ff 0%,#ff5fa2 28%,#ff8a25 50%,#ff5fa2 72%,#8e44ff 100%) !important;
  background-size: 220% 100% !important;
  animation: foxRibbon 12s linear infinite;
  border-bottom: 1px solid rgba(255,255,255,.22);
}
@keyframes foxRibbon { 0%{background-position:0 0} 50%{background-position:100% 0} 100%{background-position:0 0} }
body > div:first-child::after {
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.16) 50%,transparent 65%);
  animation:foxShimmer 7s linear infinite;
  pointer-events:none;
}

/* Header / navigation */
header.sticky {
  background: rgba(255,255,255,.82) !important;
  border-bottom-color: rgba(255,122,24,.14) !important;
  box-shadow: 0 9px 32px rgba(44,22,8,.07) !important;
}
header.sticky > div > div { min-height: 78px; }
.brand-logo-trigger > div {
  border-radius: 22px !important;
  background: linear-gradient(145deg,#fff4e8,#fffaf6) !important;
  box-shadow: 0 10px 28px rgba(255,122,24,.18), inset 0 0 0 1px rgba(255,255,255,.65) !important;
  position: relative;
}
.brand-logo-trigger > div::after {
  content:"🐾";
  position:absolute;
  right:-7px;
  bottom:-8px;
  width:28px;
  height:28px;
  border-radius:10px;
  display:grid;
  place-items:center;
  background:#fff;
  box-shadow:0 8px 18px rgba(87,44,17,.13);
  font-size:15px;
}
header nav a, header nav button { transition: transform .2s ease, color .2s ease, background-color .2s ease; }
header nav a:hover, header nav button:hover { transform: translateY(-1px); }
#global-search-input {
  background: rgba(248,246,249,.92) !important;
  border: 1px solid rgba(140,125,145,.12) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.9), 0 8px 22px rgba(87,44,17,.06) !important;
  min-height: 46px;
}
#global-search-input:focus { box-shadow: 0 0 0 5px rgba(255,122,24,.10), 0 12px 30px rgba(87,44,17,.09) !important; }

/* General page rhythm */
main { position: relative; }
main > section, main > div:not(.fixed) { position: relative; }
main > section::before, main > div:not(.fixed)::before {
  content:"";
  position:absolute;
  inset:10px;
  border-radius:inherit;
  pointer-events:none;
}

/* Hero */
main > div:first-child.rounded-3xl {
  box-shadow: 0 28px 70px rgba(213,83,9,.20), inset 0 1px 0 rgba(255,255,255,.18) !important;
  border: 1px solid rgba(255,255,255,.16);
  isolation:isolate;
}
main > div:first-child.rounded-3xl::after {
  content:"🐱  🐾";
  position:absolute;
  left:28px;
  bottom:10px;
  font-size:20px;
  opacity:.5;
  letter-spacing:10px;
  animation: foxFloat 6s ease-in-out infinite;
}
main > div:first-child.rounded-3xl h1 { text-shadow: 0 8px 26px rgba(90,35,4,.18); }
main > div:first-child.rounded-3xl .bg-white\/10 { box-shadow: 0 20px 50px rgba(64,28,2,.16), inset 0 1px 0 rgba(255,255,255,.20) !important; }

/* Section headings */
main h2, main h3 { letter-spacing: -0.02em; }
main h2 { font-size: clamp(1.25rem,2vw,1.65rem); }
main section > div:first-child { }

/* Category tiles */
#home-categories-container > a,
#category-pills-container > *,
#header-categories-dropdown > * {
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease !important;
}
#home-categories-container > a {
  border:1px solid rgba(255,255,255,.28);
  box-shadow: 0 14px 32px rgba(87,44,17,.10);
}
#home-categories-container > a:hover { transform:translateY(-5px) rotate(-.3deg); box-shadow:0 22px 42px rgba(87,44,17,.14); }

/* Product cards: marketplace feel */
.product-card-item,
#home-featured-grid > div,
#home-bestseller-grid > div,
#catalog-products-grid > div {
  background: var(--fox-card) !important;
  border: 1px solid var(--fox-line) !important;
  border-radius: var(--fox-radius) !important;
  box-shadow: 0 10px 30px rgba(87,44,17,.07) !important;
  overflow: hidden;
  position:relative;
  transition: transform .28s cubic-bezier(.2,.75,.25,1), box-shadow .28s ease, border-color .28s ease !important;
}
.product-card-item::before,
#home-featured-grid > div::before,
#home-bestseller-grid > div::before,
#catalog-products-grid > div::before {
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(120deg,transparent 20%,rgba(255,255,255,.66) 47%,transparent 67%);
  transform:translateX(-120%);
  pointer-events:none;
  opacity:0;
}
.product-card-item:hover,
#home-featured-grid > div:hover,
#home-bestseller-grid > div:hover,
#catalog-products-grid > div:hover {
  transform:translateY(-7px);
  border-color:rgba(255,122,24,.28) !important;
  box-shadow:0 24px 46px rgba(87,44,17,.13) !important;
}
.product-card-item:hover::before,
#home-featured-grid > div:hover::before,
#home-bestseller-grid > div:hover::before,
#catalog-products-grid > div:hover::before { opacity:1; animation:foxShimmer .95s ease; }
.product-img-box {
  background: linear-gradient(145deg,#fffaf7,#fff2ea) !important;
  border-bottom: 1px solid rgba(255,122,24,.08);
}
.product-img-box img { transition: transform .35s cubic-bezier(.2,.8,.25,1), filter .35s ease; }
.product-card-item:hover .product-img-box img,
#home-featured-grid > div:hover .product-img-box img,
#home-bestseller-grid > div:hover .product-img-box img,
#catalog-products-grid > div:hover .product-img-box img { transform:scale(1.06) translateY(-2px); filter:saturate(1.05); }
.product-info-box { background:rgba(255,255,255,.78); }
.price-text, .text-base.font-black { text-shadow:0 2px 12px rgba(255,122,24,.10); }

/* Buttons become premium pills */
button, a[class*="rounded-xl"], a[class*="rounded-2xl"] { transition: transform .2s ease, box-shadow .2s ease, filter .2s ease !important; }
button:hover, a[class*="rounded-xl"]:hover, a[class*="rounded-2xl"]:hover { filter:saturate(1.04); }
button:active, a[class*="rounded-xl"]:active, a[class*="rounded-2xl"]:active { transform:translateY(1px) scale(.985); }

/* Catalog toolbar */
#category-pills-container > * {
  background:rgba(255,255,255,.86) !important;
  border:1px solid rgba(255,122,24,.12) !important;
  box-shadow:0 7px 18px rgba(87,44,17,.05);
  backdrop-filter:blur(10px);
}
#category-pills-container > *:hover { transform:translateY(-2px); }

/* White content panels */
main .bg-white.rounded-3xl,
main .bg-white.rounded-2xl,
main .glass-card {
  border-color:rgba(255,122,24,.12) !important;
  box-shadow:var(--fox-shadow) !important;
}
main .bg-white.rounded-3xl:hover { box-shadow:0 24px 55px rgba(87,44,17,.12) !important; }

/* Forms */
input, select, textarea {
  border-color:rgba(129,113,132,.14) !important;
  box-shadow:0 6px 20px rgba(87,44,17,.035) !important;
}
input:focus, select:focus, textarea:focus {
  outline:none !important;
  border-color:rgba(255,122,24,.45) !important;
  box-shadow:0 0 0 5px rgba(255,122,24,.09), 0 12px 28px rgba(87,44,17,.08) !important;
}

/* Footer */
footer {
  background: radial-gradient(circle at 15% 20%, rgba(255,95,162,.10), transparent 26%), linear-gradient(145deg,#17121d,#211827 60%,#130f17) !important;
  position:relative;
  overflow:hidden;
}
footer::before {
  content:"🐾     🐱     🐾     🐱";
  position:absolute;
  left:2%;
  bottom:-8px;
  font-size:34px;
  opacity:.06;
  white-space:nowrap;
  transform:rotate(-5deg);
}

/* Lightweight reveal class added by JS */
.fox-reveal { opacity:0; transform:translateY(14px); }
.fox-reveal.is-visible { opacity:1; transform:none; animation:foxReveal .5s cubic-bezier(.2,.75,.25,1) both; }

/* Admin surfaces keep their function but get the same brand */
.fox-admin-theme {
  background:
    radial-gradient(circle at 16% 18%, rgba(255,122,24,.12), transparent 22%),
    radial-gradient(circle at 85% 80%, rgba(255,95,162,.10), transparent 22%),
    linear-gradient(145deg,#fff9f5,#fff 45%,#fff6fb) !important;
}
.fox-admin-theme::before { content:"🐾  🐱  ✨  🐾  🐱  ✨  🐾" !important; opacity:.06 !important; }
.fox-admin-login, .fox-admin-dashboard { border:1px solid rgba(255,122,24,.14); }

/* Mobile premium layout */
@media (max-width: 768px) {
  body::after { width:46px;height:46px;font-size:22px;left:10px;bottom:10px;border-radius:15px; }
  header.sticky > div > div { min-height:70px; }
  main { padding-top:1rem !important; }
  main > div:first-child.rounded-3xl { border-radius:24px !important; padding:1rem !important; }
  main > div:first-child.rounded-3xl h1 { font-size:1.65rem !important; line-height:1.55 !important; }
  .product-card-item,
  #home-featured-grid > div,
  #home-bestseller-grid > div,
  #catalog-products-grid > div { border-radius:20px !important; }
  #home-featured-grid,
  #home-bestseller-grid,
  #catalog-products-grid { gap:.55rem !important; }
  #home-featured-grid > div h3,
  #home-bestseller-grid > div h3,
  #catalog-products-grid > div h3,
  .product-card-item h3 {
    font-size:.78rem !important;
    line-height:1.45 !important;
    height:auto !important;
    min-height:2.2rem !important;
  }
  #home-featured-grid > div .text-base,
  #home-bestseller-grid > div .text-base,
  #catalog-products-grid > div .text-base,
  .product-card-item .price-text { font-size:.82rem !important; }
  #home-featured-grid > div .grid.grid-cols-2 button,
  #home-bestseller-grid > div .grid.grid-cols-2 button,
  #catalog-products-grid > div .grid.grid-cols-2 button,
  #home-featured-grid > div .grid.grid-cols-2 a,
  #home-bestseller-grid > div .grid.grid-cols-2 a,
  #catalog-products-grid > div .grid.grid-cols-2 a {
    height:34px !important;
    font-size:.68rem !important;
    border-radius:.7rem !important;
  }
  .product-img-box { padding:1rem !important; }
}

@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { animation-duration:.001ms !important; animation-iteration-count:1 !important; scroll-behavior:auto !important; transition-duration:.001ms !important; }
}

.fox-cat-corner {
  position: fixed;
  top: 96px;
  left: 18px;
  z-index: 25;
  width: 60px;
  height: 60px;
  border-radius: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(145deg,rgba(255,255,255,.88),rgba(255,247,243,.80));
  border: 1px solid rgba(255,122,24,.13);
  box-shadow: 0 15px 34px rgba(87,44,17,.10);
  backdrop-filter: blur(14px);
  transform: rotate(-4deg);
  pointer-events:none;
  animation: foxFloat 5.5s ease-in-out infinite;
}
.fox-cat-corner span { font-size: 28px; line-height:1; }
.fox-cat-corner small { position:absolute; right:7px; bottom:6px; font-size:11px; }
header.sticky.is-scrolled { box-shadow:0 14px 36px rgba(44,22,8,.11) !important; }
@media (max-width: 768px) { .fox-cat-corner { top:82px; left:10px; width:48px; height:48px; border-radius:16px; } .fox-cat-corner span{font-size:23px} }

/* =========================================================
   FoxShop V5 — Cute cat background + mobile performance pass
   ========================================================= */
body {
  background-color: #fff8f3 !important;
  background-image:
    radial-gradient(850px 520px at 8% 5%, rgba(255, 174, 119, .18), transparent 62%),
    radial-gradient(760px 500px at 94% 18%, rgba(255, 154, 201, .12), transparent 60%),
    linear-gradient(180deg, #fffaf7 0%, #fff7f3 50%, #fffaf8 100%) !important;
  background-attachment: scroll !important;
}

.fox-cat-pattern {
  position: fixed !important;
  inset: 72px 0 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  user-select: none !important;
  display: grid !important;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  grid-auto-rows: minmax(90px, 1fr);
  align-items: center;
  justify-items: center;
  overflow: hidden;
  opacity: .105;
  contain: paint;
}
.fox-cat-pattern span {
  display: block;
  font-size: clamp(22px, 2.6vw, 34px);
  line-height: 1;
  filter: saturate(.9);
  transform: rotate(var(--r, 0deg));
}
.fox-cat-pattern span:nth-child(3n) { --r: -9deg; }
.fox-cat-pattern span:nth-child(3n + 1) { --r: 7deg; }
.fox-cat-pattern span:nth-child(3n + 2) { --r: -3deg; }

/* Never animate large page surfaces on touch devices. */
@media (max-width: 768px), (pointer: coarse) {
  body::before,
  body::after { animation: none !important; }
  body > div:first-child,
  body > div:first-child::after { animation: none !important; }
  .fox-cat-corner,
  .animate-float,
  .pulse-glow { animation: none !important; }

  .fox-reveal,
  .fox-reveal.is-visible {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
  }

  .product-card-item::before,
  #home-featured-grid > div::before,
  #home-bestseller-grid > div::before,
  #catalog-products-grid > div::before { display: none !important; }

  header.sticky,
  .glass-nav,
  .glass-card,
  #category-pills-container > * { 
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  .product-card-item,
  #home-featured-grid > div,
  #home-bestseller-grid > div,
  #catalog-products-grid > div,
  main .bg-white.rounded-3xl,
  main .bg-white.rounded-2xl {
    box-shadow: 0 5px 18px rgba(87,44,17,.055) !important;
    transition: none !important;
  }

  .product-img-box img,
  .cat-card-bg-img { transition: none !important; }
  .product-card-item:hover,
  #home-featured-grid > div:hover,
  #home-bestseller-grid > div:hover,
  #catalog-products-grid > div:hover { transform: none !important; }

  .fox-cat-pattern {
    inset: 72px 0 0 !important;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    grid-auto-rows: 105px;
    opacity: .075;
  }
  .fox-cat-pattern span { font-size: 22px; }
}

/* ===== FoxShop premium v3: warm feline boutique, no layout rewrites ===== */
:root {
  --fox-bg: #fbf7f2;
  --fox-surface: rgba(255,255,255,.88);
  --fox-surface-strong: #ffffff;
  --fox-ink-2: #241b26;
  --fox-soft: #f4ece6;
  --fox-gold: #d9923f;
  --fox-rose-2: #e8769a;
  --fox-shadow-premium: 0 24px 70px rgba(82,45,24,.10);
}

body {
  background:
    radial-gradient(circle at 8% 10%, rgba(255,185,112,.17), transparent 22%),
    radial-gradient(circle at 92% 17%, rgba(232,118,154,.13), transparent 20%),
    radial-gradient(circle at 78% 78%, rgba(207,174,128,.12), transparent 25%),
    linear-gradient(180deg,#fffaf7 0%,#fbf7f2 48%,#f6efe9 100%) !important;
  background-attachment: fixed;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -3;
  pointer-events: none;
  background:
    radial-gradient(circle at 16% 25%, rgba(215,160,97,.10) 0 1px, transparent 1.5px),
    radial-gradient(circle at 72% 44%, rgba(232,118,154,.09) 0 1px, transparent 1.5px),
    radial-gradient(circle at 38% 78%, rgba(175,137,103,.08) 0 1px, transparent 1.5px);
  background-size: 42px 42px, 57px 57px, 71px 71px;
  opacity: .8;
}
body::after { display:none !important; }

main {
  position: relative;
  isolation: isolate;
}
main::before {
  content:"";
  position:absolute;
  inset:20px 0 auto;
  height:180px;
  z-index:-1;
  pointer-events:none;
  background: radial-gradient(ellipse at center, rgba(217,146,63,.09), transparent 72%);
  filter: blur(18px);
}

.glass-nav {
  background: rgba(255,252,249,.82) !important;
  border-bottom-color: rgba(217,146,63,.16) !important;
  box-shadow: 0 16px 45px rgba(74,43,28,.07) !important;
}

.fox-search-icon-button {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  color: #6d5965;
  background: linear-gradient(145deg, #fff, #f7eee8);
  border: 1px solid rgba(214,148,91,.18);
  box-shadow: 0 8px 24px rgba(81,48,29,.08), inset 0 1px 0 rgba(255,255,255,.9);
  cursor: pointer;
}
.fox-search-icon-button:hover { color:#d96e2b; transform: translateY(-1px); }
.fox-search-icon-button:active { transform: translateY(0) scale(.98); }

.fox-search-modal {
  position: fixed;
  inset: 0;
  z-index: 120;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding: 12vh 18px 24px;
  background: rgba(34,22,28,.55);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  opacity:0;
  transition: opacity .16s ease;
}
.fox-search-modal.hidden { display:none; }
.fox-search-modal.is-open { opacity:1; }
.fox-search-dialog {
  width:min(720px,100%);
  border-radius:32px;
  padding:clamp(22px,4vw,34px);
  background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(255,249,245,.97));
  border:1px solid rgba(221,160,103,.22);
  box-shadow:0 35px 100px rgba(37,23,29,.20);
  position:relative;
  transform:translateY(16px) scale(.985);
  transition:transform .16s ease;
}
.fox-search-modal.is-open .fox-search-dialog { transform:none; }
.fox-search-close { position:absolute; left:18px; top:18px; width:38px; height:38px; border-radius:13px; border:1px solid #eadfd8; background:#fff; color:#8b7b85; }
.fox-search-kicker { display:flex; align-items:center; gap:10px; color:#a06b3a; font-size:11px; font-weight:900; }
.fox-search-orb { width:38px; height:38px; border-radius:14px; display:grid; place-items:center; color:#fff; background:linear-gradient(145deg,#ef8d43,#e26a93); box-shadow:0 10px 22px rgba(226,106,147,.22); }
.fox-search-dialog h2 { margin-top:14px; font-size:clamp(24px,4vw,34px); font-weight:900; color:#281e27; }
.fox-search-dialog > p { margin-top:7px; color:#8b7b85; font-size:12px; line-height:1.8; }
.fox-search-form { margin-top:20px; display:grid; grid-template-columns:1fr auto; gap:10px; }
.fox-search-field { min-height:58px; padding:0 16px; border-radius:18px; display:flex; align-items:center; gap:11px; background:#fff; border:1px solid #eadfd8; box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 10px 25px rgba(62,37,25,.05); }
.fox-search-field i { color:#d87538; }
.fox-search-field input { width:100%; border:0 !important; box-shadow:none !important; background:transparent !important; outline:none !important; font-size:13px; }
.fox-search-submit { min-height:58px; padding:0 22px; border:0; border-radius:18px; background:linear-gradient(135deg,#f18d3e,#df648e); color:#fff; font-size:12px; font-weight:900; box-shadow:0 14px 26px rgba(222,110,112,.22); }
.fox-search-hints { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.fox-search-hints button { border:1px solid #eee2dc; background:#fff; color:#705f67; border-radius:999px; padding:8px 12px; font-size:10px; font-weight:800; }
.fox-search-hints button:hover { border-color:#e9b786; color:#c66d34; }

.fox-showcase-section { position:relative; }
.fox-eyebrow { display:inline-flex; align-items:center; gap:7px; color:#b36938; font-size:10px; font-weight:900; letter-spacing:.03em; }
.fox-eyebrow::before { content:""; width:18px; height:3px; border-radius:99px; background:linear-gradient(90deg,#efb16e,#e7799d); }
.fox-eyebrow-light { color:#ffc18b; }
.fox-eyebrow-light::before { background:linear-gradient(90deg,#ffb86d,#ff8caf); }
.fox-text-link { color:#bc7041; font-size:11px; font-weight:900; white-space:nowrap; }
.fox-text-link:hover { color:#e16b36; }
.fox-quiz-banner {
  border-radius:30px;
  padding:clamp(22px,4vw,34px);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
  color:#fff;
  background:
    radial-gradient(circle at 85% 15%, rgba(255,181,103,.20), transparent 26%),
    radial-gradient(circle at 15% 90%, rgba(233,111,151,.17), transparent 28%),
    linear-gradient(145deg,#2d202b,#1a1621);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 26px 70px rgba(39,25,33,.17);
  overflow:hidden;
  position:relative;
}
.fox-quiz-banner::after { content:""; position:absolute; width:240px; height:240px; left:-80px; bottom:-130px; border-radius:50%; border:1px solid rgba(255,255,255,.08); box-shadow:0 0 0 28px rgba(255,255,255,.025),0 0 0 56px rgba(255,255,255,.018); pointer-events:none; }
.fox-light-button { display:inline-flex; align-items:center; gap:9px; white-space:nowrap; padding:13px 18px; border-radius:16px; background:#fff; color:#2b212b; font-size:11px; font-weight:900; box-shadow:0 14px 32px rgba(0,0,0,.18); }
.fox-light-button:hover { transform:translateY(-1px); }

/* Premium product cards */
.product-card-item,
#catalog-products-grid > div {
  border-radius: 28px !important;
  background: linear-gradient(180deg,rgba(255,255,255,.97),rgba(255,249,245,.94)) !important;
  border-color: rgba(214,154,105,.18) !important;
  box-shadow: 0 18px 48px rgba(83,50,31,.09) !important;
}
.product-card-item::after,
#catalog-products-grid > div::after {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  border-radius:inherit;
  background:linear-gradient(135deg,rgba(255,255,255,.60),transparent 35%);
  opacity:.65;
}
.product-card-item > a:first-of-type,
#catalog-products-grid > div > a:first-of-type {
  background:
    radial-gradient(circle at 50% 50%,rgba(239,180,116,.13),transparent 56%),
    linear-gradient(180deg,#fffaf7,#f7eee8) !important;
}
.product-card-item .p-5 { padding:18px !important; }
.product-card-item:hover,
#catalog-products-grid > div:hover { transform:translateY(-8px); box-shadow:0 30px 64px rgba(73,42,25,.15) !important; }
.product-card-item .grid.grid-cols-2 > button,
.product-card-item .grid.grid-cols-2 > a { border-radius:14px !important; }

/* Product detail page */
#product-page-root { padding-top:26px; padding-bottom:52px; }
#product-page-root > .space-y-6 > section:first-of-type {
  background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(255,247,241,.96)) !important;
  border-color:rgba(214,154,105,.20) !important;
  box-shadow:0 28px 80px rgba(83,50,31,.11) !important;
  overflow:hidden;
  position:relative;
}
#product-page-root > .space-y-6 > section:first-of-type::before {
  content:""; position:absolute; inset:-35% auto auto -9%; width:250px; height:250px; border-radius:50%; background:radial-gradient(circle,rgba(232,118,154,.14),transparent 68%); pointer-events:none;
}
#fox-main-product-image {
  filter:drop-shadow(0 18px 24px rgba(71,41,25,.09));
  transition:transform .25s ease;
}
#fox-main-product-image:hover { transform:scale(1.025); }
#product-page-root .aspect-square.rounded-3xl { background:linear-gradient(145deg,#fffdfb,#f6ece5) !important; border-color:rgba(214,154,105,.16) !important; }
#product-page-root .bg-orange-50.border-orange-100 { background:linear-gradient(145deg,#fff6ed,#fff1f5) !important; border-color:rgba(226,138,109,.18) !important; box-shadow:0 18px 34px rgba(83,50,31,.07); }
#product-page-root .bg-white.rounded-3xl { border-color:rgba(214,154,105,.16) !important; box-shadow:0 18px 45px rgba(83,50,31,.07) !important; }

/* Review section */
.fox-review-section { border-radius:30px; padding:clamp(20px,4vw,30px); background:linear-gradient(145deg,rgba(255,255,255,.97),rgba(255,247,243,.96)); border:1px solid rgba(214,154,105,.18); box-shadow:var(--fox-shadow-premium); }
.fox-review-heading { display:flex; justify-content:space-between; gap:20px; align-items:flex-start; }
.fox-review-heading h2 { margin-top:6px; font-size:20px; font-weight:900; color:#2b212b; }
.fox-review-heading p { margin-top:6px; color:#8f7f88; font-size:11px; line-height:1.9; }
.fox-rating-summary { min-width:145px; padding:14px 16px; border-radius:20px; background:#fff; border:1px solid #eee0d8; text-align:center; box-shadow:0 12px 28px rgba(72,46,31,.06); }
.fox-rating-summary strong { display:block; font-size:22px; font-weight:900; color:#c56f32; }
.fox-rating-summary span { display:block; color:#e6a34e; letter-spacing:2px; margin-top:2px; }
.fox-rating-summary small { display:block; margin-top:4px; color:#9a8992; font-size:9px; }
.fox-review-layout { display:grid; grid-template-columns:minmax(280px,.88fr) minmax(0,1.12fr); gap:18px; margin-top:20px; }
.fox-review-form { border-radius:22px; padding:18px; background:#fff; border:1px solid #eee2db; box-shadow:0 12px 28px rgba(74,44,28,.05); }
.fox-review-form label { display:block; margin-bottom:12px; }
.fox-review-form label > span,.fox-review-label { display:block; margin-bottom:6px; color:#5e4c55; font-size:10px; font-weight:900; }
.fox-review-form input,.fox-review-form textarea { width:100%; border:1px solid #eadfd9 !important; border-radius:14px; background:#fffdfb !important; padding:11px 12px; font-size:11px; }
.fox-stars { display:flex; direction:ltr; gap:4px; }
.fox-star { width:33px; height:33px; display:grid; place-items:center; border-radius:10px; border:1px solid #eee2da; background:#fff; color:#c8b8b2; }
.fox-star.is-active { color:#e7a03f; background:#fff8ec; border-color:#efd39c; }
.fox-review-submit { width:100%; margin-top:4px; padding:13px; border:0; border-radius:15px; background:linear-gradient(135deg,#ed8941,#db668d); color:#fff; font-size:11px; font-weight:900; box-shadow:0 12px 24px rgba(218,105,126,.20); }
.fox-review-submit:disabled { opacity:.6; cursor:wait; }
.fox-review-status { margin-top:9px; color:#97868f; font-size:9px; line-height:1.8; }
.fox-review-status.is-success { color:#2f8a61; }
.fox-review-status.is-error { color:#b65255; }
.fox-review-status.is-loading { color:#ad783b; }
.fox-honeypot { position:absolute !important; left:-10000px !important; opacity:0 !important; pointer-events:none !important; }
.fox-approved-reviews { display:grid; gap:10px; max-height:420px; overflow:auto; padding-left:2px; }
.fox-review-card { padding:14px; border-radius:18px; background:rgba(255,255,255,.84); border:1px solid #eee3dd; }
.fox-review-card-top { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }
.fox-review-card-top b { display:block; font-size:11px; color:#3b2f36; }
.fox-review-card-top span { display:block; margin-top:2px; font-size:9px; color:#a6969d; }
.fox-review-stars { color:#e2a04d; font-size:11px; letter-spacing:1px; direction:ltr; }
.fox-review-card p { margin-top:9px; color:#6f6168; font-size:10px; line-height:1.9; }
.fox-empty-review { min-height:180px; border-radius:20px; border:1px dashed #e7ddd7; background:#fffdfa; display:grid; place-items:center; align-content:center; text-align:center; padding:20px; }
.fox-empty-review i { font-size:28px; color:#e6b38b; }
.fox-empty-review p { margin-top:10px; font-size:11px; font-weight:900; color:#786770; }
.fox-empty-review span { margin-top:5px; font-size:9px; color:#a5969d; }

/* Visible trust block: placed immediately above the footer. */
.fox-trust-footer { padding:0 16px 20px; }
.fox-trust-shell { max-width:1120px; margin:0 auto; padding:clamp(22px,4vw,34px); border-radius:30px; background:linear-gradient(145deg,#211a22,#2f232e); color:#fff; border:1px solid rgba(255,255,255,.08); box-shadow:0 24px 70px rgba(36,24,30,.14); position:relative; overflow:hidden; }
.fox-trust-shell::before { content:""; position:absolute; width:280px; height:280px; right:-120px; top:-150px; border-radius:50%; background:radial-gradient(circle,rgba(232,118,154,.22),transparent 68%); pointer-events:none; }
.fox-trust-heading { position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.fox-trust-heading h2 { margin-top:5px; font-size:20px; font-weight:900; }
.fox-trust-heading p { margin-top:6px; max-width:660px; color:rgba(255,255,255,.62); font-size:10px; line-height:1.9; }
.fox-trust-badge { min-width:110px; padding:12px 14px; border-radius:18px; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.08); display:flex; align-items:center; justify-content:center; gap:8px; color:#ffd4af; font-size:10px; font-weight:900; }
.fox-trust-grid { position:relative; z-index:1; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-top:18px; }
.fox-trust-grid article { min-height:118px; padding:14px; border-radius:20px; background:rgba(255,255,255,.045); border:1px solid rgba(255,255,255,.08); display:flex; gap:11px; }
.fox-trust-grid article > span { flex:0 0 34px; width:34px; height:34px; border-radius:12px; display:grid; place-items:center; color:#ffd3b0; background:rgba(255,174,110,.10); }
.fox-trust-grid b { display:block; font-size:10px; color:#fff; }
.fox-trust-grid p { margin-top:6px; color:rgba(255,255,255,.56); font-size:9px; line-height:1.9; }
.fox-trust-note { position:relative; z-index:1; margin-top:14px; padding-top:14px; border-top:1px solid rgba(255,255,255,.08); display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:7px; color:rgba(255,255,255,.62); font-size:9px; }
.fox-trust-note i { color:#f0ae73; }
.fox-trust-sep { color:rgba(255,255,255,.2); }

/* Catalog/search surfaces */
#catalog-search-input { min-height:46px; padding-right:42px !important; border-radius:16px !important; background:rgba(255,255,255,.92) !important; box-shadow:0 8px 20px rgba(76,45,29,.06) !important; }
#catalog-sort-select { min-height:46px; border-radius:16px !important; background:rgba(255,255,255,.92) !important; }
#catalog-products-grid { margin-top:4px; }
#catalog-empty-view { background:linear-gradient(145deg,#fff,#fff7f1); border-color:#eadcd3 !important; box-shadow:var(--fox-shadow-premium); }

/* Make the existing home category area more boutique-like without changing data. */
#home-categories-grid > a {
  min-height:120px;
  border-radius:24px !important;
  background:linear-gradient(145deg,rgba(255,255,255,.95),rgba(250,242,236,.92)) !important;
  border-color:rgba(213,157,111,.15) !important;
  box-shadow:0 18px 38px rgba(79,49,31,.08) !important;
}
#home-categories-grid > a:hover { transform:translateY(-6px) !important; box-shadow:0 26px 48px rgba(79,49,31,.13) !important; }

footer { margin-top: 0 !important; }
footer .max-w-7xl { position:relative; z-index:1; }

@media (max-width: 900px) {
  .fox-review-layout { grid-template-columns:1fr; }
  .fox-trust-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .fox-trust-heading { align-items:flex-start; }
}
@media (max-width: 640px) {
  .fox-search-modal { padding:8vh 12px 18px; }
  .fox-search-form { grid-template-columns:1fr; }
  .fox-search-submit { min-height:52px; }
  .fox-search-dialog { border-radius:26px; }
  .fox-quiz-banner { align-items:flex-start; flex-direction:column; }
  .fox-light-button { width:100%; justify-content:center; }
  .fox-review-heading { flex-direction:column; }
  .fox-rating-summary { width:100%; }
  .fox-trust-grid { grid-template-columns:1fr; }
  .fox-trust-heading { flex-direction:column; }
  .fox-trust-badge { width:100%; }
  .fox-trust-shell { border-radius:24px; }
  .fox-trust-note { justify-content:flex-start; }
  .fox-search-icon-button { width:40px; height:40px; }
}

/* FoxShop Premium Cat Atmosphere — final visual pass */
#home-hero-premium {
  background:
    radial-gradient(circle at 82% 18%, rgba(255,211,164,.26), transparent 24%),
    radial-gradient(circle at 18% 82%, rgba(249,145,180,.18), transparent 28%),
    linear-gradient(145deg, #35242d 0%, #61403d 44%, #d16f4b 100%) !important;
  border: 1px solid rgba(255,255,255,.13);
  box-shadow: 0 34px 90px rgba(83,47,37,.20) !important;
}
#home-hero-premium .backdrop-blur-md {
  background: rgba(255,255,255,.10) !important;
  border-color: rgba(255,255,255,.16) !important;
}
#home-hero-premium .lg\:col-span-4 > div {
  background: rgba(255,255,255,.08) !important;
  border-color: rgba(255,255,255,.18) !important;
  box-shadow: 0 26px 60px rgba(25,17,21,.18) !important;
}
#home-hero-premium .lg\:col-span-4 > div::before {
  content:"";
  position:absolute;
  inset:10px;
  border-radius:24px;
  border:1px dashed rgba(255,235,218,.24);
  pointer-events:none;
}
#home-hero-premium h1 { text-shadow: 0 6px 22px rgba(38,22,28,.17); }
#home-hero-premium .fa-cat,
#home-hero-premium .fa-paw { filter: drop-shadow(0 10px 22px rgba(40,22,25,.16)); }

.fox-eyebrow::before {
  width: auto;
  height: auto;
  background: transparent;
  content:"\f1b0";
  font-family:"Font Awesome 6 Free";
  font-weight:900;
  color:#db7b46;
  font-size:10px;
}
.fox-eyebrow-light::before { color:#ffc68f; background:transparent; }

/* Make the catalog feel like a boutique rather than a plain grid. */
#catalog-products-grid { gap: 18px !important; }
#catalog-products-grid > div,
.product-card-item {
  position:relative;
  overflow:hidden;
}
#catalog-products-grid > div::before,
.product-card-item::before {
  content:"";
  position:absolute;
  width:120px;
  height:120px;
  right:-48px;
  top:-48px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(233,131,96,.16), transparent 68%);
  pointer-events:none;
}
#product-page-root .fox-review-section + section,
#product-page-root .fox-review-section ~ section { scroll-margin-top:80px; }

/* Quietly decorative cat-paw rhythm in the page background. */
body::after {
  content:"" !important;
  display:block !important;
  position:fixed;
  width:140px;
  height:140px;
  left:-45px;
  bottom:10%;
  opacity:.16;
  pointer-events:none;
  z-index:-1;
  background:
    radial-gradient(circle at 50% 62%, rgba(209,111,75,.25) 0 16px, transparent 17px),
    radial-gradient(circle at 24% 33%, rgba(232,118,154,.18) 0 10px, transparent 11px),
    radial-gradient(circle at 50% 20%, rgba(232,118,154,.18) 0 10px, transparent 11px),
    radial-gradient(circle at 76% 34%, rgba(232,118,154,.18) 0 10px, transparent 11px);
  filter: blur(.1px);
}

@media (max-width: 640px) {
  #home-hero-premium { border-radius:24px !important; }
  #home-hero-premium h1 { font-size:2rem !important; }
}


/* =========================================================
   FoxShop V6 — Cute Boutique / Mobile Performance
   Final visual override: no DOM rewrites, no heavy libraries.
   ========================================================= */
:root {
  --fox-v6-cream: #fff8f1;
  --fox-v6-peach: #ffb36e;
  --fox-v6-orange: #f47b30;
  --fox-v6-pink: #ec6fa9;
  --fox-v6-lilac: #9b79dd;
  --fox-v6-ink: #2b2130;
  --fox-v6-line: rgba(122, 76, 50, .10);
}

html { background:#fff8f1; }
body {
  color:var(--fox-v6-ink) !important;
  background:
    radial-gradient(420px 260px at 4% 7%, rgba(255,179,110,.24), transparent 70%),
    radial-gradient(480px 300px at 96% 12%, rgba(236,111,169,.16), transparent 72%),
    radial-gradient(520px 330px at 82% 78%, rgba(155,121,221,.10), transparent 74%),
    linear-gradient(180deg,#fffaf6 0%,#fff7f1 52%,#fff9f6 100%) !important;
  background-attachment:scroll !important;
}
body::before {
  content:"🐾   ♡   🐱   ✦   🐾   ♡   🐱" !important;
  position:fixed !important;
  inset:84px -6% auto !important;
  width:112% !important;
  height:220px !important;
  z-index:-2 !important;
  pointer-events:none !important;
  opacity:.038 !important;
  font-size:clamp(20px,2.2vw,34px) !important;
  line-height:105px !important;
  letter-spacing:1.5rem !important;
  transform:rotate(-4deg) !important;
  white-space:pre-wrap !important;
  background:none !important;
}
body::after { display:none !important; }

/* Static top ribbon: zero-cost on mobile, still lively on desktop. */
body > div:first-child { animation:none !important; background:linear-gradient(90deg,#6f52b6,#ec6fa9,#f47b30,#ec6fa9,#6f52b6) !important; background-size:auto !important; }
body > div:first-child::after { display:none !important; }

header.sticky {
  background:rgba(255,252,249,.94) !important;
  border-bottom:1px solid rgba(122,76,50,.09) !important;
  box-shadow:0 10px 30px rgba(75,47,30,.07) !important;
}
header.sticky > div > div { min-height:74px !important; }
.brand-logo-trigger > div {
  background:linear-gradient(145deg,#fff2e4,#fff8f2) !important;
  box-shadow:0 10px 26px rgba(244,123,48,.16), inset 0 0 0 1px rgba(255,255,255,.8) !important;
}

/* Hero / category / catalog surfaces */
#home-hero-premium {
  border-radius:32px !important;
  background:
    radial-gradient(circle at 83% 17%, rgba(255,231,195,.34), transparent 22%),
    radial-gradient(circle at 13% 85%, rgba(255,146,188,.24), transparent 28%),
    linear-gradient(145deg,#332633 0%,#644154 42%,#e47b48 100%) !important;
  box-shadow:0 30px 72px rgba(76,45,54,.18) !important;
}
#home-categories-grid > a {
  min-height:112px !important;
  border-radius:24px !important;
  background:linear-gradient(145deg,rgba(255,255,255,.97),rgba(255,246,238,.95)) !important;
  border-color:rgba(244,123,48,.13) !important;
  box-shadow:0 16px 32px rgba(88,53,34,.07) !important;
}
#catalog-products-grid > div, .product-card-item {
  border:1px solid rgba(122,76,50,.10) !important;
  border-radius:24px !important;
  background:linear-gradient(150deg,rgba(255,255,255,.98),rgba(255,249,244,.96)) !important;
  box-shadow:0 14px 30px rgba(82,48,31,.07) !important;
  content-visibility:auto;
  contain-intrinsic-size:340px;
}
#catalog-products-grid > div:hover, .product-card-item:hover { transform:translateY(-3px) !important; box-shadow:0 22px 46px rgba(82,48,31,.11) !important; }
.product-img-box { background:linear-gradient(145deg,#fffdfb,#fff3e7) !important; }
.product-img-box img { filter:drop-shadow(0 10px 18px rgba(77,46,30,.09)); }

/* Product page: rich but light. */
#product-page-root .bg-white.rounded-3xl,
#product-page-root .fox-review-section { border-color:rgba(122,76,50,.10) !important; box-shadow:0 18px 42px rgba(82,48,31,.07) !important; }
#product-page-root .aspect-square.rounded-3xl { background:linear-gradient(145deg,#fffdfb,#fff0e4) !important; }
#product-page-root .bg-orange-50.border-orange-100 { background:linear-gradient(145deg,#fff6ec,#fff1f6) !important; }

/* Catalog search = visible, tactile, store-like. */
.fox-catalog-search-wrap { position:relative; }
.fox-catalog-search-icon { position:absolute; right:16px; top:50%; transform:translateY(-50%); color:#bc9e8e; font-size:13px; pointer-events:none; }
.fox-catalog-search-button, .fox-static-search-link, .fox-search-icon-button {
  display:inline-grid !important; place-items:center !important;
  width:42px; height:42px; border-radius:14px;
  border:1px solid rgba(244,123,48,.14);
  background:linear-gradient(145deg,#fff7f0,#fff) !important;
  color:#d97031 !important;
  box-shadow:0 8px 18px rgba(122,76,50,.08);
  transition:transform .16s ease, box-shadow .16s ease, background-color .16s ease;
}
.fox-catalog-search-button { position:absolute; left:5px; top:50%; transform:translateY(-50%); }
.fox-catalog-search-button:hover, .fox-static-search-link:hover, .fox-search-icon-button:hover { transform:translateY(-1px); box-shadow:0 10px 22px rgba(122,76,50,.11); }
#catalog-search-input { padding-right:44px !important; padding-left:54px !important; }

/* Professional search modal + live suggestions. */
.fox-search-live-results { margin-top:12px; display:grid; gap:7px; }
.fox-search-result { display:flex; align-items:center; gap:10px; padding:9px 10px; border-radius:16px; border:1px solid rgba(122,76,50,.08); background:rgba(255,255,255,.90); color:inherit; text-decoration:none; }
.fox-search-result img { width:42px; height:42px; border-radius:12px; object-fit:contain; background:#fff7ef; }
.fox-search-result span { flex:1; min-width:0; }
.fox-search-result b { display:block; font-size:10px; color:#342832; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.fox-search-result small { display:block; margin-top:2px; color:#9b8790; font-size:8px; }
.fox-search-result > i { font-size:9px; color:#c3a59a; }
.fox-search-empty { padding:14px; border-radius:16px; background:#fff8f1; color:#967f76; font-size:9px; line-height:1.8; text-align:center; }
.fox-search-all { padding:11px 14px; border-radius:14px; border:0; background:linear-gradient(135deg,#f47b30,#ec6fa9); color:#fff; font-size:9px; font-weight:900; }

/* One tiny trust strip only, immediately above footer. */
.fox-trust-footer { padding:0 12px 12px !important; }
.fox-trust-shell { max-width:1120px !important; padding:8px 12px !important; border-radius:16px !important; background:rgba(45,32,48,.92) !important; border:1px solid rgba(255,255,255,.07) !important; box-shadow:0 12px 26px rgba(46,31,45,.08) !important; }
.fox-trust-mini { display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:8px 16px; color:rgba(255,255,255,.64); font-size:8px; line-height:1.6; }
.fox-trust-mini span { display:inline-flex; align-items:center; gap:5px; }
.fox-trust-mini i { color:#ffb36e; font-size:9px; }

/* Footer boutique layout with the supplied cat image. */
footer {
  min-height:340px;
  background:
    radial-gradient(circle at 74% 18%, rgba(236,111,169,.10), transparent 22%),
    linear-gradient(145deg,#17111e,#251629 62%,#120d17) !important;
}
footer::before {
  content:"" !important;
  position:absolute !important;
  left:8px !important;
  bottom:0 !important;
  width:min(240px,30vw) !important;
  height:300px !important;
  background:url('../images/foxshop-cat-footer.webp') left bottom / contain no-repeat !important;
  opacity:.98 !important;
  pointer-events:none !important;
  transform:none !important;
}
footer .max-w-7xl { position:relative; z-index:2; }

/* Remove decorative floating corner; it was visually noisy and costly. */
.fox-cat-corner { display:none !important; }

@media (max-width: 900px) {
  *, *::before, *::after { animation:none !important; }
  body { background-attachment:scroll !important; }
  header.sticky, .glass-nav, .glass-card, #category-pills-container > * { backdrop-filter:none !important; -webkit-backdrop-filter:none !important; }
  .product-card-item, #catalog-products-grid > div { box-shadow:0 7px 20px rgba(82,48,31,.06) !important; transition:none !important; }
  .product-card-item:hover, #catalog-products-grid > div:hover { transform:none !important; }
  .fox-search-modal { backdrop-filter:none !important; -webkit-backdrop-filter:none !important; }
  footer { min-height:300px; }
  footer::before { width:190px !important; height:245px !important; }
}

@media (max-width: 640px) {
  body::before { opacity:.025 !important; font-size:20px !important; letter-spacing:.9rem !important; }
  main::before { display:none !important; }
  #home-categories-grid { gap:8px !important; }
  #catalog-products-grid { gap:10px !important; }
  #catalog-products-grid > div, .product-card-item { border-radius:19px !important; }
  #catalog-search-input { min-height:48px !important; }
  .fox-catalog-search-button { width:38px; height:38px; }
  .fox-static-search-link, .fox-search-icon-button { width:38px; height:38px; }
  .fox-trust-mini { justify-content:flex-start; gap:6px 10px; font-size:7.5px; }
  footer::before { width:156px !important; height:205px !important; left:0 !important; }
}

@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { animation:none !important; transition:none !important; }
}

:root {
  --color-primary: #ea580c;
  --color-primary-dark: #c2410c;
  --color-primary-light: #fff7ed;
  --color-accent: #ec4899;
  --color-accent-rose: #f43f5e;
  --color-slate-dark: #0f172a;
  --font-vazir: 'Vazirmatn', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

* {
  font-family: var(--font-vazir);
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
  direction: rtl;
}

body {
  background-color: #fdfbf7;
  color: #1e293b;
  overflow-x: hidden;
}

/* Subtle Cat Paw SVG Background Pattern */
.paw-bg {
  background-color: #fdfbf7;
  background-image: 
    radial-gradient(#ea580c 0.5px, transparent 0.5px), 
    radial-gradient(#ea580c 0.5px, #fdfbf7 0.5px);
  background-size: 32px 32px;
  background-position: 0 0, 16px 16px;
}

.cat-paw-pattern {
  background-image: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23ea580c' fill-opacity='0.035' fill-rule='evenodd'%3E%3Cpath d='M30 30c-2 0-4-2-4-5s2-5 4-5 4 2 4 5-2 5-4 5zm-7-2c-1.5 0-3-1.5-3-3.5s1.5-3.5 3-3.5 3 1.5 3 3.5-1.5 3.5-3 3.5zm14 0c-1.5 0-3-1.5-3-3.5s1.5-3.5 3-3.5 3 1.5 3 3.5-1.5 3.5-3 3.5zm-11 7c-1.2 0-2.5-1-2.5-2.5S24.8 29 26 29s2.5 1 2.5 2.5-1.3 2.5-2.5 2.5zm8 0c-1.2 0-2.5-1-2.5-2.5S29.8 29 31 29s2.5 1 2.5 2.5-1.3 2.5-2.5 2.5z'/%3E%3C/g%3E%3C/svg%3E");
}

/* Glassmorphism Navigation & Surfaces */
.glass-nav {
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.glass-card {
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(254, 215, 170, 0.5);
}

/* Custom Scrollbars */
.custom-scroll::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}
.custom-scroll::-webkit-scrollbar-track {
  background: #f1f5f9;
  border-radius: 8px;
}
.custom-scroll::-webkit-scrollbar-thumb {
  background: #cbd5e1;
  border-radius: 8px;
}
.custom-scroll::-webkit-scrollbar-thumb:hover {
  background: #ea580c;
}

/* Number inputs spin button removal */
input[type=number]::-webkit-inner-spin-button, 
input[type=number]::-webkit-outer-spin-button { 
  -webkit-appearance: none; 
  margin: 0; 
}

/* Animations */
@keyframes floatAnim {
  0%, 100% { transform: translateY(0px); }
  50% { transform: translateY(-8px); }
}
.animate-float {
  animation: floatAnim 4s ease-in-out infinite;
}

@keyframes pulseGlow {
  0%, 100% { box-shadow: 0 0 0 0 rgba(234, 88, 12, 0.4); }
  50% { box-shadow: 0 0 0 12px rgba(234, 88, 12, 0); }
}
.pulse-glow {
  animation: pulseGlow 2.5s infinite;
}

@keyframes logoTapAnim {
  0% { transform: scale(1); }
  50% { transform: scale(0.92) rotate(-3deg); }
  100% { transform: scale(1); }
}
.logo-tap {
  animation: logoTapAnim 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

/* Toast Notifications */
#toast-container {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  gap: 10px;
  pointer-events: none;
}
.toast {
  pointer-events: auto;
  min-width: 280px;
  max-width: 380px;
  padding: 14px 18px;
  background: #0f172a;
  color: #ffffff;
  border-radius: 16px;
  font-size: 13px;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 12px;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.22);
  transform: translateY(20px);
  opacity: 0;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
}
.toast.show {
  transform: translateY(0);
  opacity: 1;
}
.toast.success {
  border-right: 4px solid #10b981;
}
.toast.info {
  border-right: 4px solid #ea580c;
}
.toast.rubika {
  border-right: 4px solid #9333ea;
}
.toast.instagram {
  border-right: 4px solid #ec4899;
}
.toast.error {
  border-right: 4px solid #ef4444;
}

/* Category Card with WebP Background Image */
.cat-card-bg-img {
  background-size: cover;
  background-position: center;
  transition: transform 0.4s ease;
}
.group:hover .cat-card-bg-img {
  transform: scale(1.08);
}

/* Line Clamp helper */
.line-clamp-1 {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* =========================================================
   Mobile Minimalist Optimizations (Screen < 640px)
   Matches desktop elegance without giant oversized widgets
   Completely preserves desktop styles (sm/md/lg unaffected)
   ========================================================= */
@media (max-width: 640px) {
  html {
    -webkit-text-size-adjust: 100%;
  }

  /* Compact container padding on mobile */
  main {
    padding-top: 0.4rem !important;
    padding-bottom: 1.25rem !important;
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
    row-gap: 1.15rem !important;
  }

  /* Compact Section Titles & Subtitles */
  section h2,
  main h2,
  .section-header h2 {
    font-size: 0.95rem !important;
    font-weight: 800 !important;
    letter-spacing: -0.02em !important;
  }
  section p,
  main .section-header p {
    font-size: 0.65rem !important;
    line-height: 1.35 !important;
  }
  .section-header a {
    font-size: 0.65rem !important;
    padding: 0.2rem 0.5rem !important;
    border-radius: 0.5rem !important;
  }

  /* Compact Header */
  header .max-w-7xl {
    padding-left: 0.6rem !important;
    padding-right: 0.6rem !important;
  }
  header {
    border-bottom-width: 1px !important;
  }

  /* Compact Hero Banner */
  .relative.rounded-3xl.bg-gradient-to-br {
    padding: 0.85rem 0.85rem !important;
    border-radius: 1rem !important;
    overflow: hidden !important;
  }
  .relative.rounded-3xl.bg-gradient-to-br .absolute.opacity-15,
  .relative.rounded-3xl.bg-gradient-to-br .absolute.opacity-10 {
    display: none !important; /* Remove giant 9xl watermarks on mobile */
  }
  .relative.rounded-3xl.bg-gradient-to-br h1 {
    font-size: 1.05rem !important;
    line-height: 1.35 !important;
    margin-bottom: 0.25rem !important;
  }
  .relative.rounded-3xl.bg-gradient-to-br p {
    font-size: 0.68rem !important;
    line-height: 1.4 !important;
    -webkit-line-clamp: 2 !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
  }
  .relative.rounded-3xl.bg-gradient-to-br .flex.flex-wrap {
    gap: 0.4rem !important;
    margin-top: 0.5rem !important;
  }
  .relative.rounded-3xl.bg-gradient-to-br .flex.flex-wrap a {
    padding: 0.35rem 0.7rem !important;
    font-size: 0.65rem !important;
    border-radius: 0.6rem !important;
    gap: 0.3rem !important;
  }
  .relative.rounded-3xl.bg-gradient-to-br .relative.w-64,
  .relative.rounded-3xl.bg-gradient-to-br .relative.w-72 {
    display: none !important;
  }

  /* Trust Props 2-column compact grid */
  .grid.grid-cols-2.md\:grid-cols-4 {
    gap: 0.35rem !important;
  }
  .grid.grid-cols-2.md\:grid-cols-4 > div {
    padding: 0.4rem 0.5rem !important;
    border-radius: 0.75rem !important;
    gap: 0.4rem !important;
  }
  .grid.grid-cols-2.md\:grid-cols-4 > div .w-12 {
    width: 1.75rem !important;
    height: 1.75rem !important;
    font-size: 0.75rem !important;
    border-radius: 0.5rem !important;
    flex-shrink: 0 !important;
  }
  .grid.grid-cols-2.md\:grid-cols-4 > div h4 {
    font-size: 0.7rem !important;
    font-weight: 800 !important;
  }
  .grid.grid-cols-2.md\:grid-cols-4 > div p {
    display: none !important;
  }

  /* Categories 3-column / 2-column compact grid on mobile */
  #home-categories-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 0.4rem !important;
  }
  #home-categories-grid > a {
    padding: 0.5rem 0.35rem !important;
    border-radius: 0.75rem !important;
    min-height: 4.8rem !important;
    aspect-ratio: auto !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
  }
  #home-categories-grid > a .w-8 {
    width: 1.85rem !important;
    height: 1.85rem !important;
    font-size: 0.75rem !important;
    border-radius: 0.5rem !important;
    margin: 0 auto !important;
  }
  #home-categories-grid > a h3 {
    font-size: 0.68rem !important;
    font-weight: 800 !important;
    margin-top: 0.25rem !important;
    line-height: 1.2 !important;
  }
  #home-categories-grid > a p {
    font-size: 0.55rem !important;
    margin-top: 0.1rem !important;
  }

  /* 2-Column Minimalist Products Grid on Mobile */
  #home-featured-grid,
  #home-bestseller-grid,
  #catalog-products-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 0.4rem !important;
  }

  /* Product Card Styling on Mobile */
  #home-featured-grid > div,
  #home-bestseller-grid > div,
  #catalog-products-grid > div,
  .product-card-item {
    border-radius: 0.85rem !important;
    border-width: 1px !important;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.03) !important;
    overflow: hidden !important;
  }

  /* Product Card Image on Mobile */
  #home-featured-grid > div > div:first-of-type,
  #home-bestseller-grid > div > div:first-of-type,
  #catalog-products-grid > div > div:first-of-type,
  .product-card-item .product-img-box {
    padding: 0.35rem !important;
    height: 98px !important;
    aspect-ratio: auto !important;
  }
  #home-featured-grid > div > div:first-of-type img,
  #home-bestseller-grid > div > div:first-of-type img,
  #catalog-products-grid > div > div:first-of-type img,
  .product-card-item .product-img-box img {
    max-height: 86px !important;
    object-fit: contain !important;
  }

  /* Discount Badge on Mobile */
  #home-featured-grid > div > span,
  #home-bestseller-grid > div > span,
  #catalog-products-grid > div > span,
  .product-card-item .discount-tag {
    top: 0.25rem !important;
    right: 0.25rem !important;
    font-size: 0.55rem !important;
    padding: 0.1rem 0.35rem !important;
    border-radius: 0.4rem !important;
  }

  /* Product Card Content Area */
  #home-featured-grid > div > div:last-of-type,
  #home-bestseller-grid > div > div:last-of-type,
  #catalog-products-grid > div > div:last-of-type,
  .product-card-item .product-info-box {
    padding: 0.4rem !important;
    gap: 0.25rem !important;
  }

  /* Product Title on Mobile */
  #home-featured-grid > div h3,
  #home-bestseller-grid > div h3,
  #catalog-products-grid > div h3,
  .product-card-item h3 {
    font-size: 0.68rem !important;
    line-height: 1.25 !important;
    height: 1.75rem !important;
    margin-bottom: 0 !important;
    -webkit-line-clamp: 2 !important;
    font-weight: 700 !important;
  }

  /* Hide verbose description on mobile cards for extreme minimalism */
  #home-featured-grid > div p,
  #home-bestseller-grid > div p,
  #catalog-products-grid > div p,
  .product-card-item .product-desc {
    display: none !important;
  }

  /* Price on Mobile */
  #home-featured-grid > div .text-base,
  #home-bestseller-grid > div .text-base,
  #catalog-products-grid > div .text-base,
  .product-card-item .price-text {
    font-size: 0.75rem !important;
    font-weight: 900 !important;
  }
  #home-featured-grid > div .line-through,
  #home-bestseller-grid > div .line-through,
  #catalog-products-grid > div .line-through {
    font-size: 0.58rem !important;
  }

  /* Buttons Row on Mobile */
  #home-featured-grid > div .grid.grid-cols-2,
  #home-bestseller-grid > div .grid.grid-cols-2,
  #catalog-products-grid > div .grid.grid-cols-2 {
    gap: 0.25rem !important;
    padding-top: 0.2rem !important;
  }
  #home-featured-grid > div .grid.grid-cols-2 button,
  #home-bestseller-grid > div .grid.grid-cols-2 button,
  #catalog-products-grid > div .grid.grid-cols-2 button,
  #home-featured-grid > div .grid.grid-cols-2 a,
  #home-bestseller-grid > div .grid.grid-cols-2 a,
  #catalog-products-grid > div .grid.grid-cols-2 a {
    height: 27px !important;
    padding: 0.2rem 0.25rem !important;
    font-size: 0.62rem !important;
    border-radius: 0.5rem !important;
    gap: 0.2rem !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  #home-featured-grid > div .grid.grid-cols-2 i,
  #home-bestseller-grid > div .grid.grid-cols-2 i,
  #catalog-products-grid > div .grid.grid-cols-2 i {
    font-size: 0.65rem !important;
  }

  /* Compact Banner (Rubika & Instagram) */
  .rounded-3xl.p-6.sm\:p-10.bg-gradient-to-r {
    padding: 0.85rem 0.75rem !important;
    border-radius: 1rem !important;
    gap: 0.65rem !important;
  }
  .rounded-3xl.p-6.sm\:p-10.bg-gradient-to-r h3 {
    font-size: 0.95rem !important;
  }
  .rounded-3xl.p-6.sm\:p-10.bg-gradient-to-r p {
    font-size: 0.65rem !important;
    line-height: 1.35 !important;
  }
  .rounded-3xl.p-6.sm\:p-10.bg-gradient-to-r a {
    padding: 0.45rem 0.85rem !important;
    font-size: 0.7rem !important;
    width: 100% !important;
    border-radius: 0.6rem !important;
  }

  /* Compact Modals on Mobile */
  #product-detail-modal > div,
  #admin-portal-modal > div,
  #rubika-order-modal > div {
    padding: 0.85rem !important;
    border-radius: 1rem !important;
    max-height: 88vh !important;
    width: 95vw !important;
  }
  #product-detail-modal .aspect-square {
    height: 120px !important;
    aspect-ratio: auto !important;
    padding: 0.35rem !important;
  }
  #product-detail-modal h3 {
    font-size: 0.85rem !important;
  }
  #product-detail-modal button {
    padding: 0.45rem !important;
    font-size: 0.7rem !important;
  }

  /* Drawer on Mobile */
  #cart-drawer .max-w-md {
    max-width: 88vw !important;
    padding: 0.85rem !important;
  }

  /* Toast Notification */
  #toast-container {
    bottom: 10px !important;
    right: 8px !important;
    left: 8px !important;
  }
  .toast {
    min-width: unset !important;
    width: 100% !important;
    padding: 8px 10px !important;
    font-size: 11px !important;
    border-radius: 10px !important;
  }
}



/* FoxShop premium cat theme for the admin panel */
.fox-admin-theme {
  isolation: isolate;
  overflow: hidden;
  background:
    radial-gradient(circle at 12% 18%, rgba(251,146,60,.10) 0 2px, transparent 3px),
    radial-gradient(circle at 18% 12%, rgba(251,146,60,.08) 0 7px, transparent 8px),
    radial-gradient(circle at 86% 80%, rgba(244,114,182,.08) 0 2px, transparent 3px),
    radial-gradient(circle at 80% 86%, rgba(244,114,182,.06) 0 7px, transparent 8px),
    linear-gradient(145deg, rgba(255,247,237,.98), rgba(255,255,255,.98) 46%, rgba(253,242,248,.98));
}

.fox-admin-theme::before {
  content: "🐾  🐱  🐾  🐱  🐾";
  position: absolute;
  inset: 0;
  z-index: -1;
  display: grid;
  align-content: space-around;
  justify-content: space-around;
  gap: 4rem;
  padding: 1.2rem;
  font-size: 1.35rem;
  line-height: 1;
  opacity: .055;
  transform: rotate(-8deg) scale(1.08);
  pointer-events: none;
  user-select: none;
}

.fox-admin-login {
  box-shadow: 0 24px 70px rgba(120,53,15,.20), 0 6px 24px rgba(244,114,182,.10);
}

.fox-admin-dashboard {
  box-shadow: 0 28px 90px rgba(120,53,15,.22), 0 8px 30px rgba(244,114,182,.09);
}

.fox-admin-theme input,
.fox-admin-theme select,
.fox-admin-theme textarea {
  position: relative;
  z-index: 1;
}

.fox-admin-theme button,
.fox-admin-theme label {
  position: relative;
  z-index: 1;
}


/* =========================================================
   FoxShop V6 — Mobile performance pass
   No visual redesign on desktop; touch devices get cheaper paint/compositing.
   ========================================================= */
@media (pointer: coarse), (max-width: 768px) {
  html { scroll-behavior: auto !important; }

  /* Turn off all decorative motion on touch devices. */
  *, *::before, *::after {
    animation: none !important;
    transition-duration: 0ms !important;
    transition-delay: 0ms !important;
  }

  /* Tailwind's runtime animation utilities. */
  .animate-bounce,
  .animate-pulse,
  .animate-spin,
  .animate-ping,
  .animate-float,
  .pulse-glow,
  .logo-tap { animation: none !important; }

  /* Backdrop filters are one of the most expensive effects on mid-range phones. */
  .glass-nav,
  .glass-card,
  .fox-cat-corner,
  [class*="backdrop-blur"],
  [style*="backdrop-filter"] {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  /* Fixed decorative layers should not force continuous compositing. */
  body::before { display: none !important; }
  body::after {
    width: 42px !important;
    height: 42px !important;
    left: 10px !important;
    bottom: 10px !important;
    border-radius: 14px !important;
    box-shadow: 0 6px 16px rgba(87,44,17,.07) !important;
    background: rgba(255,255,255,.90) !important;
  }
  .fox-cat-corner {
    width: 46px !important;
    height: 46px !important;
    top: 82px !important;
    left: 10px !important;
    border-radius: 14px !important;
    box-shadow: 0 6px 16px rgba(87,44,17,.07) !important;
    background: rgba(255,255,255,.92) !important;
  }

  /* Static emoji wallpaper: fewer nodes, lower opacity, no filter. */
  /* Keep the emoji wallpaper above the body background but behind real UI. */
  .fox-cat-pattern {
    position: absolute !important;
    z-index: 0 !important;
    top: 76px !important;
    bottom: auto !important;
    height: 760px !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    grid-auto-rows: 150px !important;
    opacity: .055 !important;
    contain: strict !important;
  }
  .fox-cat-pattern span { filter: none !important; font-size: 21px !important; }

  /* Avoid painting/hit-testing off-screen product content. */
  #home-featured-grid > div,
  #home-bestseller-grid > div,
  #catalog-products-grid > div,
  #home-categories-container > a,
  .product-card-item {
    content-visibility: auto;
    contain-intrinsic-size: 330px 360px;
    contain: layout paint;
    box-shadow: 0 4px 14px rgba(87,44,17,.045) !important;
  }

  /* Remove GPU-heavy filters/shadows on product images. */
  .product-card-item img,
  #home-featured-grid img,
  #home-bestseller-grid img,
  #catalog-products-grid img,
  .drop-shadow,
  [class*="drop-shadow"] {
    filter: none !important;
  }

  /* The animated ribbon/shimmer is purely decorative. */
  body > div:first-child,
  body > div:first-child::after {
    animation: none !important;
    background-size: 100% 100% !important;
  }

  /* Don't animate the hero or make its shadow excessively large. */
  main > div:first-child.rounded-3xl {
    box-shadow: 0 12px 30px rgba(213,83,9,.11) !important;
  }
  main > div:first-child.rounded-3xl::after { animation: none !important; }

  /* Page content sits above the decorative wallpaper. */
  header, main, footer, body > div:first-child {
    position: relative;
    z-index: 1;
  }

  /* Modal/drawer backdrops become a cheap solid translucent layer. */
  #product-detail-modal,
  #admin-portal-modal,
  #rubika-order-modal,
  #cart-drawer,
  #mobile-menu {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
    background-color: rgba(15,23,42,.62) !important;
  }
}

/* Prefer a system fallback while the remote web font is unavailable. */
@font-face {
  font-family: 'Vazirmatn Fallback';
  src: local('Vazirmatn'), local('Tahoma'), local('Arial');
  font-display: swap;
}


/* =========================================================
   FoxShop V7 — Vibrant boutique theme + stable mobile UX
   Visual-only layer plus lightweight navigation polish.
   ========================================================= */
body.paw-bg.cat-paw-pattern {
  background-color:#fff8f2 !important;
  background-image:
    radial-gradient(circle at 8% 16%, rgba(244,123,48,.12) 0 3px, transparent 4px),
    radial-gradient(circle at 78% 10%, rgba(236,111,169,.10) 0 5px, transparent 6px),
    radial-gradient(circle at 88% 62%, rgba(155,121,221,.10) 0 4px, transparent 5px),
    linear-gradient(145deg,#fffaf5 0%,#fff6ef 48%,#fff9f6 100%) !important;
  background-size:160px 160px,220px 220px,190px 190px,100% 100% !important;
  background-attachment:scroll !important;
}

/* Make the existing cat/emoji background visible enough to feel intentional. */
.fox-cat-pattern { opacity:.11 !important; }
.fox-cat-pattern span { font-size:26px !important; }

/* More lively boutique surfaces without heavy effects. */
.glass-nav {
  background:rgba(255,252,249,.97) !important;
  border-bottom-color:rgba(244,123,48,.16) !important;
}
.product-card-item,
#catalog-products-grid > div {
  background:linear-gradient(155deg,#fff,#fff8f3) !important;
  border-color:rgba(244,123,48,.16) !important;
  box-shadow:0 14px 30px rgba(82,48,31,.08) !important;
}
.product-card-item::before,
#catalog-products-grid > div::before {
  content:"";
  position:absolute;
  inset:0 18% auto;
  height:3px;
  border-radius:0 0 999px 999px;
  background:linear-gradient(90deg,#ff9b54,#ec6fa9,#9b79dd);
  opacity:.65;
  pointer-events:none;
}
.product-img-box {
  background:
    radial-gradient(circle at 18% 18%,rgba(255,179,110,.22),transparent 32%),
    radial-gradient(circle at 85% 84%,rgba(236,111,169,.14),transparent 32%),
    linear-gradient(145deg,#fffdfb,#fff0e4) !important;
}

/* Richer product-detail hero and content cards. */
#product-page-root > div > section:first-of-type {
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 14% 18%,rgba(255,179,110,.17),transparent 26%),
    radial-gradient(circle at 88% 16%,rgba(236,111,169,.15),transparent 24%),
    linear-gradient(150deg,#fffdfb 0%,#fff7f0 62%,#fff4f8 100%) !important;
  border-color:rgba(244,123,48,.18) !important;
  box-shadow:0 24px 56px rgba(82,48,31,.10) !important;
}
#product-page-root > div > section:first-of-type::before {
  content:"🐾";
  position:absolute;
  left:18px;
  top:12px;
  font-size:30px;
  opacity:.10;
  pointer-events:none;
  transform:rotate(-12deg);
}
#product-page-root > div > section:first-of-type::after {
  content:"✦  🐱  ✦";
  position:absolute;
  right:20px;
  bottom:14px;
  font-size:17px;
  letter-spacing:.35rem;
  color:#ec6fa9;
  opacity:.10;
  pointer-events:none;
}
#product-page-root > div > section:not(:first-of-type) {
  border-color:rgba(244,123,48,.13) !important;
  box-shadow:0 14px 34px rgba(82,48,31,.065) !important;
}
#product-page-root h1 {
  color:#2b2130 !important;
}
#product-page-root h2 {
  color:#342832 !important;
}
#product-page-root .bg-orange-50.border-orange-100 {
  background:linear-gradient(135deg,#fff3e6,#fff0f7) !important;
  border-color:rgba(244,123,48,.18) !important;
}
#product-page-root .fox-review-section {
  background:linear-gradient(150deg,#fffaf6,#fff5fa) !important;
}

/* Tiny cat thumbnail next to the top search icon. */
.fox-search-cat-thumb {
  width:30px;
  height:30px;
  flex:0 0 30px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border-radius:11px;
  background:linear-gradient(145deg,#fff7ef,#fff);
  border:1px solid rgba(244,123,48,.18);
  box-shadow:0 5px 12px rgba(82,48,31,.08);
  margin-inline-start:2px;
}
.fox-search-cat-thumb img {
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}

/* Fixed mobile quick navigation requested for the storefront. */
.fox-mobile-bottom-nav { display:none; }
@media (max-width: 900px) {
  body { padding-bottom:86px !important; }
  .fox-mobile-bottom-nav {
    position:fixed;
    left:10px;
    right:10px;
    bottom:max(8px, env(safe-area-inset-bottom));
    z-index:9998;
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:5px;
    padding:7px;
    border:1px solid rgba(255,255,255,.11);
    border-radius:22px;
    background:rgba(34,23,43,.97);
    box-shadow:0 18px 42px rgba(21,13,28,.28);
  }
  .fox-bottom-nav-item {
    min-width:0;
    border:0;
    background:transparent;
    color:rgba(255,255,255,.62);
    text-decoration:none;
    padding:7px 4px 6px;
    border-radius:17px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:3px;
    font:inherit;
    cursor:pointer;
  }
  .fox-bottom-nav-item b {
    font-size:8px;
    line-height:1.25;
    font-weight:800;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    max-width:100%;
  }
  .fox-bottom-nav-icon {
    position:relative;
    width:29px;
    height:29px;
    border-radius:10px;
    display:grid;
    place-items:center;
    background:rgba(255,255,255,.05);
    color:#ffc08c;
    font-size:13px;
  }
  .fox-bottom-nav-item.is-active {
    background:linear-gradient(135deg,rgba(244,123,48,.20),rgba(236,111,169,.18));
    color:#fff;
  }
  .fox-bottom-nav-item.is-active .fox-bottom-nav-icon {
    color:#fff;
    background:linear-gradient(135deg,#f47b30,#ec6fa9);
    box-shadow:0 7px 16px rgba(236,111,169,.24);
  }
  .fox-bottom-nav-cart em {
    position:absolute;
    top:-5px;
    right:-5px;
    min-width:15px;
    height:15px;
    padding:0 3px;
    border-radius:999px;
    display:grid;
    place-items:center;
    background:#ec6fa9;
    color:#fff;
    font-size:8px;
    font-style:normal;
    line-height:1;
    border:2px solid #22172b;
  }
  .fox-bottom-nav-cart em.is-empty { opacity:.72; }
  .fox-search-cat-thumb { width:27px; height:27px; flex-basis:27px; border-radius:10px; }
  .fox-search-icon-button { width:38px !important; height:38px !important; border-radius:13px !important; }
  .product-card-item::before,
  #catalog-products-grid > div::before { inset:0 12% auto; }
  .fox-cat-pattern { opacity:.12 !important; }
  .fox-cat-pattern span { font-size:22px !important; }
  footer::before { bottom:116px !important; }
}

@media (min-width:901px) {
  footer::before { bottom:96px !important; }
}

@media (max-width:640px) {
  #product-page-root > div > section:first-of-type::before { font-size:24px; left:12px; }
  #product-page-root > div > section:first-of-type::after { right:12px; font-size:14px; }
}

/* =========================================================
   FoxShop Fix Pack 2 — product loading, live search, cart UX
   ========================================================= */

/* Product page: don't show a blank/false error while D1 is still loading. */
.fox-product-loading {
  min-height: 420px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 40px 22px;
  border-radius: 32px;
  border: 1px solid rgba(124, 86, 180, .14);
  background:
    radial-gradient(circle at 15% 15%, rgba(255, 171, 103, .24), transparent 27%),
    radial-gradient(circle at 85% 18%, rgba(178, 145, 255, .25), transparent 27%),
    linear-gradient(145deg, #ffffff 0%, #fff7f2 52%, #f9f5ff 100%);
  box-shadow: 0 22px 55px rgba(48, 28, 68, .08);
}
.fox-product-loading-orb {
  width: 72px;
  height: 72px;
  display: grid;
  place-items: center;
  border-radius: 24px;
  color: #fff;
  font-size: 28px;
  background: linear-gradient(135deg, #ff9a5c, #b88cff);
  box-shadow: 0 16px 32px rgba(184, 140, 255, .22);
  animation: foxProductPulse 1.4s ease-in-out infinite;
}
.fox-product-loading h1 {
  margin: 18px 0 0;
  color: #32263c;
  font-size: 18px;
  font-weight: 900;
}
.fox-product-loading p {
  margin: 8px 0 0;
  color: #8b7b94;
  font-size: 11px;
}
@keyframes foxProductPulse {
  0%,100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-4px) scale(1.035); }
}

/* Cart drawer: its own contents remain reachable on small phones. */
#cart-drawer > div {
  max-height: 100dvh;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-bottom: calc(24px + env(safe-area-inset-bottom));
  scrollbar-width: thin;
}
#cart-drawer #cart-items-container {
  min-height: 0;
}
#cart-drawer #cart-footer-view {
  flex-shrink: 0;
}

/* The fixed mobile bar must sit directly on the screen edge and never cover the cart. */
@media (max-width: 900px) {
  body { padding-bottom: 78px !important; }

  .fox-mobile-bottom-nav {
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    padding: 7px 9px max(7px, env(safe-area-inset-bottom)) !important;
    border-radius: 24px 24px 0 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
    border-bottom: 0 !important;
    background: linear-gradient(135deg, rgba(255, 176, 112, .98), rgba(202, 172, 255, .98)) !important;
    box-shadow: 0 -10px 28px rgba(79, 51, 97, .18) !important;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
  }

  .fox-mobile-bottom-nav.is-cart-open,
  body:has(#cart-drawer:not(.hidden)) .fox-mobile-bottom-nav {
    display: none !important;
  }

  .fox-bottom-nav-item {
    color: rgba(48, 32, 57, .80) !important;
    text-shadow: none !important;
  }
  .fox-bottom-nav-icon {
    background: rgba(255,255,255,.48) !important;
    color: #5f3d71 !important;
    box-shadow: 0 5px 12px rgba(83, 52, 105, .08);
  }
  .fox-bottom-nav-item.is-active {
    color: #ffffff !important;
    background: linear-gradient(135deg, rgba(255,255,255,.38), rgba(255,255,255,.20)) !important;
  }
  .fox-bottom-nav-item.is-active .fox-bottom-nav-icon {
    background: linear-gradient(135deg, #ff8b52, #a980f0) !important;
    color: #fff !important;
    box-shadow: 0 8px 18px rgba(111, 75, 160, .20);
  }
  .fox-bottom-nav-cart em {
    border-color: #ffb070 !important;
    background: #7d56d7 !important;
  }
}

/* A brighter multi-colour boutique system while keeping the existing layout intact. */
.product-card-item { --fox-accent: #ff9b61; }
.product-card-item:nth-child(4n+2) { --fox-accent: #70bfff; }
.product-card-item:nth-child(4n+3) { --fox-accent: #b990ff; }
.product-card-item:nth-child(4n+4) { --fox-accent: #72d7ad; }
.product-card-item::before,
#catalog-products-grid > div::before {
  background: linear-gradient(90deg, var(--fox-accent), #ff8db7, #9a82ef) !important;
}
.product-card-item:hover {
  border-color: color-mix(in srgb, var(--fox-accent) 42%, white) !important;
}

/* Product/detail content gets the same lively palette in small doses. */
#product-page-root > div > section:nth-of-type(2n) {
  background:
    radial-gradient(circle at 8% 12%, rgba(112,191,255,.10), transparent 26%),
    linear-gradient(150deg, #ffffff 0%, #fbf8ff 100%) !important;
}
#product-page-root > div > section:nth-of-type(3n) {
  background:
    radial-gradient(circle at 90% 12%, rgba(114,215,173,.11), transparent 25%),
    linear-gradient(150deg, #ffffff 0%, #f8fffb 100%) !important;
}
#product-page-root .bg-orange-50.border-orange-100 {
  background: linear-gradient(135deg, #fff0df, #fff0f8, #f0e9ff) !important;
}

/* Search field stays under the user's control while typing. */
#catalog-search-input {
  caret-color: #8b5cf6 !important;
  background: linear-gradient(135deg, #fbfdff, #fff9f5) !important;
}
#catalog-search-input:focus {
  border-color: #9b7be8 !important;
  box-shadow: 0 0 0 4px rgba(155, 123, 232, .10) !important;
}

/* Prevent fixed helper bars from creating another layer above the cart drawer. */
#fox-mobile-cart-bar,
#fox-compare-bar {
  z-index: 40 !important;
}
#cart-drawer {
  z-index: 60 !important;
}

/* =========================================================
   FoxShop Fix Pack 3 — product reliability + phone-safe layout
   ========================================================= */
#home-hero-premium.fox-hero-vibrant {
  color:#233347 !important;
  background:radial-gradient(circle at 10% 18%,rgba(125,211,252,.55),transparent 30%),radial-gradient(circle at 88% 18%,rgba(255,211,167,.60),transparent 32%),linear-gradient(120deg,#bfe7ff 0%,#edf9ff 48%,#ffe9d5 100%) !important;
  border:1px solid rgba(119,187,229,.28);
  box-shadow:0 24px 60px rgba(74,144,194,.14) !important;
}
#home-hero-premium.fox-hero-vibrant p{color:#456078 !important}
#home-hero-premium.fox-hero-vibrant .underline{text-decoration-color:#f4a261 !important}
#home-hero-premium.fox-hero-vibrant .bg-white\/20{background:rgba(255,255,255,.66) !important;border:1px solid rgba(255,255,255,.62);color:#35516a !important}

.fox-product-error{min-height:420px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;text-align:center;padding:36px 20px;border-radius:30px;background:linear-gradient(145deg,#fff,#fff7f3 52%,#f5f0ff);border:1px solid rgba(147,115,202,.16);box-shadow:0 20px 50px rgba(52,33,68,.08)}
.fox-product-error-orb{width:68px;height:68px;display:grid;place-items:center;border-radius:22px;color:#fff;font-size:28px;background:linear-gradient(135deg,#7dbfff,#ffb77f,#b48cf0);box-shadow:0 15px 32px rgba(136,104,209,.20)}
.fox-product-error h1{margin:4px 0 0;color:#32263c;font-weight:900;font-size:18px}
.fox-product-error p{margin:0;color:#82758b;font-size:11px;max-width:420px;line-height:2}
.fox-product-error button,.fox-product-error a{margin-top:8px;min-height:42px;display:inline-flex;align-items:center;justify-content:center;padding:0 18px;border-radius:14px;font-size:11px;font-weight:900;text-decoration:none}
.fox-product-error button{border:0;color:#fff;background:linear-gradient(135deg,#ff9d68,#a980f0);cursor:pointer}.fox-product-error a{color:#4f3e63;background:#f3edf8}

html,body{width:100%;max-width:100%;min-width:0;overflow-x:hidden !important}body{overscroll-behavior-x:none}
img,svg,video,canvas{max-width:100%}button,input,textarea,select{max-width:100%}
main,header,footer,section,article,nav,.max-w-7xl,.grid,.flex{min-width:0}
#product-page-root,#catalog-products-grid,#home-featured-grid,#home-categories-grid{width:100%;min-width:0}
#product-page-root img{max-width:100%}#product-page-root .break-words{overflow-wrap:anywhere}
#product-page-root .overflow-x-auto{-webkit-overflow-scrolling:touch;scrollbar-width:thin}

@media (max-width:900px){
  body{padding-bottom:82px !important}
  #product-page-root{padding-inline:0}
  #product-page-root>div,#product-page-root>div>section,#product-page-root .grid{width:100%;min-width:0}
  #product-page-root h1,#product-page-root h2,#product-page-root h3,#product-page-root p,#product-page-root span,#product-page-root a,#product-page-root button{overflow-wrap:anywhere}
  header .max-w-7xl{width:100% !important;max-width:none !important;padding-inline:10px !important;gap:6px !important}
  header .max-w-7xl>a:first-child{min-width:0;flex:1 1 auto}
  header .max-w-7xl>a:first-child span:last-child small{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  header .max-w-7xl>div:last-child{flex:0 0 auto;min-width:0}
  .fox-search-cat-thumb{width:26px !important;height:26px !important;flex-basis:26px !important}
  .fox-search-icon-button{width:36px !important;height:36px !important}
  .product-card-item,#catalog-products-grid>div,#home-featured-grid>div,#home-categories-grid>div{min-width:0 !important;max-width:100% !important}
}

@media (max-width:640px){
  body{padding-bottom:78px !important}
  #home-hero-premium.fox-hero-vibrant{border-radius:24px !important;padding:18px !important;background:radial-gradient(circle at 12% 10%,rgba(125,211,252,.48),transparent 34%),radial-gradient(circle at 90% 12%,rgba(255,211,167,.52),transparent 36%),linear-gradient(145deg,#c6eaff 0%,#f5fbff 48%,#ffeedd 100%) !important}
  #home-hero-premium.fox-hero-vibrant h1{font-size:clamp(1.45rem,7vw,2rem) !important}
  #home-hero-premium.fox-hero-vibrant .flex.flex-wrap{align-items:stretch}
  #home-hero-premium.fox-hero-vibrant .flex.flex-wrap>a{width:100%;justify-content:center}
  #home-hero-premium.fox-hero-vibrant .lg\:col-span-4{display:none !important}
  #product-page-root>div>section{border-radius:22px !important;padding:14px !important}
  #product-page-root .aspect-square{border-radius:22px !important;padding:14px !important}
  #product-page-root .grid.grid-cols-2{grid-template-columns:minmax(0,1fr) !important}
  #product-page-root .grid.grid-cols-1.sm\:grid-cols-2{grid-template-columns:minmax(0,1fr) !important}
  #product-page-root h1{font-size:1.25rem !important}#product-page-root .text-2xl{font-size:1.45rem !important}
  #product-page-root .grid-cols-\[minmax\(92px\,0\.7fr\)_minmax\(0\,1\.3fr\)\]{grid-template-columns:88px minmax(0,1fr) !important}
  #cart-drawer>div{width:100% !important;max-width:none !important;padding:14px !important;padding-bottom:calc(16px + env(safe-area-inset-bottom)) !important}
  #cart-items-container{min-height:0 !important;overflow-y:auto !important}#cart-footer-view{padding-bottom:2px !important}
  body:has(#cart-drawer:not(.hidden)) .fox-mobile-bottom-nav{display:none !important}
  .fox-search-dialog{width:calc(100vw - 20px) !important;max-width:none !important}
  .fox-search-result span{min-width:0 !important}.fox-search-result b,.fox-search-result small{overflow-wrap:anywhere}
}
@media (max-width:380px){
  header .max-w-7xl{padding-inline:7px !important}header .max-w-7xl>a:first-child{gap:7px !important}header .max-w-7xl>a:first-child>span:first-child{width:34px !important;height:34px !important;border-radius:11px !important}header .max-w-7xl>a:first-child b{font-size:15px !important}header .max-w-7xl>a:first-child small{display:none !important}
  .fox-search-cat-thumb{width:23px !important;height:23px !important;flex-basis:23px !important}.fox-search-icon-button{width:34px !important;height:34px !important}
  .fox-mobile-bottom-nav{padding-inline:4px !important;gap:2px !important}.fox-bottom-nav-item{padding-inline:2px !important}.fox-bottom-nav-item b{font-size:7px !important}
  #product-page-root>div>section{padding:12px !important;border-radius:20px !important}
  #product-page-root .fox-review-layout{grid-template-columns:minmax(0,1fr) !important}
}

/* =========================================================
   FoxShop Visual Patch — bright orange hero + visible mobile logo
   + premium sticker pack
   ========================================================= */
#home-hero-premium.fox-hero-vibrant{
  background:
    radial-gradient(circle at 12% 12%, rgba(255,255,255,.55), transparent 28%),
    radial-gradient(circle at 88% 18%, rgba(255,232,202,.70), transparent 32%),
    linear-gradient(135deg,#ffd7a1 0%,#ffbd73 46%,#ff9e57 100%) !important;
  border-color:rgba(255,255,255,.46) !important;
  box-shadow:0 26px 64px rgba(235,126,45,.20) !important;
  color:#3a2519 !important;
}
#home-hero-premium.fox-hero-vibrant p{color:#613f2b !important}
#home-hero-premium.fox-hero-vibrant .underline{text-decoration-color:#fff2d8 !important}
#home-hero-premium.fox-hero-vibrant .bg-white\/20{background:rgba(255,255,255,.60) !important;border-color:rgba(255,255,255,.58) !important;color:#4a3020 !important}
#home-hero-premium .fox-hero-brand-card{min-width:0}

/* Sticker pack */
.fox-sticker-pack{
  position:relative;
  overflow:hidden;
  border-radius:28px;
  padding:20px;
  background:
    radial-gradient(circle at 10% 15%,rgba(255,185,120,.22),transparent 25%),
    radial-gradient(circle at 90% 20%,rgba(166,137,255,.18),transparent 25%),
    linear-gradient(135deg,#fffaf5,#fff7fb 55%,#f5f1ff);
  border:1px solid rgba(244,123,48,.16);
  box-shadow:0 18px 42px rgba(64,39,84,.08);
}
.fox-sticker-pack-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px}
.fox-sticker-kicker{display:inline-flex;align-items:center;gap:7px;padding:6px 10px;border-radius:999px;background:linear-gradient(135deg,#fff0df,#f1e8ff);color:#7a4b2c;font-size:10px;font-weight:900;border:1px solid rgba(151,112,220,.14)}
.fox-sticker-pack h2{margin:8px 0 2px;font-size:18px;font-weight:950;color:#35283b}
.fox-sticker-pack p{margin:0;color:#887b91;font-size:11px;line-height:1.9}
.fox-sticker-pack-badge{flex:0 0 auto;display:flex;align-items:center;gap:7px;padding:10px 13px;border-radius:16px;background:linear-gradient(135deg,#ffb36f,#a982ef);color:#fff;font-size:10px;font-weight:900;box-shadow:0 12px 26px rgba(160,118,216,.18)}
.fox-sticker-strip{display:grid;grid-template-columns:repeat(10,minmax(90px,1fr));gap:10px;overflow-x:auto;padding:2px 2px 5px;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
.fox-sticker-item{min-width:90px;display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px 6px 7px;border-radius:18px;background:rgba(255,255,255,.72);border:1px solid rgba(255,255,255,.90);box-shadow:0 8px 18px rgba(80,52,98,.07);transition:transform .18s ease,box-shadow .18s ease}
.fox-sticker-item:hover{transform:translateY(-3px);box-shadow:0 12px 24px rgba(80,52,98,.12)}
.fox-sticker-item img{width:78px;height:78px;display:block;object-fit:contain;filter:drop-shadow(0 7px 9px rgba(44,31,52,.11))}
.fox-sticker-item span{font-size:9px;font-weight:900;color:#65566e;white-space:nowrap}

@media (max-width:900px){
  #home-hero-premium .fox-hero-brand-card{display:flex !important;justify-content:center !important;grid-column:span 1 / span 1 !important}
  #home-hero-premium .fox-hero-brand-card > div{width:190px !important;max-width:78vw !important;padding:10px !important;border-radius:24px !important}
  #home-hero-premium .fox-hero-brand-card > div > div:first-child{width:118px !important;height:118px !important;padding:7px !important;border-radius:20px !important}
  #home-hero-premium .fox-hero-brand-card > div > div:last-child{margin-top:8px !important}
  #home-hero-premium .fox-hero-brand-card p{font-size:10px !important}
  .fox-sticker-pack{padding:15px;border-radius:22px}
  .fox-sticker-pack-head{align-items:flex-start;flex-direction:column}
  .fox-sticker-pack-badge{padding:8px 11px}
  .fox-sticker-strip{grid-template-columns:repeat(10,86px);gap:8px}
  .fox-sticker-item{min-width:86px;border-radius:16px;padding:6px 5px}
  .fox-sticker-item img{width:70px;height:70px}
}

@media (max-width:520px){
  #home-hero-premium.fox-hero-vibrant{padding:16px !important;border-radius:22px !important}
  #home-hero-premium .fox-hero-brand-card > div{width:170px !important}
  #home-hero-premium .fox-hero-brand-card > div > div:first-child{width:104px !important;height:104px !important}
  .fox-sticker-pack h2{font-size:16px}
  .fox-sticker-pack p{font-size:10px}
}

/* =========================================================
   FoxShop Global Navigation Loader
   Clean full-page transition: no decorative logo/corner/pattern flash.
   ========================================================= */
#fox-global-page-loader {
  position: fixed;
  inset: 0;
  z-index: 1000000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background:
    radial-gradient(circle at 18% 16%, rgba(255,207,151,.26), transparent 28%),
    radial-gradient(circle at 86% 84%, rgba(178,145,255,.20), transparent 30%),
    rgba(255,250,245,.985);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity .18s ease, visibility .18s ease;
}
#fox-global-page-loader.is-visible {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}
#fox-global-page-loader.is-hiding {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.fox-global-loader-card {
  width: min(340px, 88vw);
  padding: 26px 24px 24px;
  border-radius: 28px;
  background: rgba(255,255,255,.97);
  border: 1px solid rgba(244,123,48,.16);
  box-shadow: 0 24px 60px rgba(82,48,31,.14), 0 4px 20px rgba(151,112,220,.08);
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.fox-global-loader-logo {
  width: 86px;
  height: 86px;
  padding: 7px;
  border-radius: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg,#fff3e3,#fffaf6 55%,#f1e8ff);
  border: 1px solid rgba(244,123,48,.18);
  box-shadow: 0 12px 28px rgba(244,123,48,.14);
}
.fox-global-loader-logo img { width: 100%; height: 100%; object-fit: contain; display: block; }
.fox-global-loader-spinner {
  width: 30px;
  height: 30px;
  margin-top: 18px;
  border-radius: 50%;
  border: 3px solid #ffe2cc;
  border-top-color: #f97316;
  animation: foxGlobalLoaderSpin .8s linear infinite;
}
@keyframes foxGlobalLoaderSpin { to { transform: rotate(360deg); } }
.fox-global-loader-title { margin-top: 14px; font-size: 18px; font-weight: 950; color: #35283b; }
.fox-global-loader-subtitle { margin-top: 5px; font-size: 11px; font-weight: 600; line-height: 1.9; color: #8b7b91; }
html.fox-page-loading body { overflow: hidden !important; }
/* Legacy decorative transition elements are intentionally disabled. */
.fox-cat-pattern, .fox-cat-corner { display: none !important; }
@media (prefers-reduced-motion: reduce) {
  #fox-global-page-loader, .fox-global-loader-spinner { transition: none !important; animation: none !important; }
}


/* =========================================================
   FoxShop V13 — mobile hero logo + guaranteed sticker-pack visibility
   ========================================================= */
@media (max-width:640px){
  #home-hero-premium.fox-hero-vibrant .fox-hero-brand-card,
  #home-hero-premium.fox-hero-vibrant .lg\:col-span-4{
    display:flex !important;
    visibility:visible !important;
    opacity:1 !important;
  }
  #home-hero-premium.fox-hero-vibrant .fox-hero-brand-card > div{
    display:flex !important;
    visibility:visible !important;
    opacity:1 !important;
  }
}
.fox-sticker-pack{display:block !important;visibility:visible !important;opacity:1 !important}
.fox-sticker-strip{display:grid !important;overflow-x:auto !important}
.fox-sticker-item{display:flex !important;visibility:visible !important;opacity:1 !important}
.fox-sticker-item img{display:block !important;visibility:visible !important;opacity:1 !important}

/* =========================================================
   FoxShop V14 — direct product navigation + reliable stickers
   ========================================================= */

#home-hero-premium .fox-hero-brand-card,
#home-hero-premium .fox-hero-brand-card > div {
  display:flex !important;
  visibility:visible !important;
  opacity:1 !important;
}
#home-hero-premium .fox-hero-brand-card img {
  display:block !important;
  width:100% !important;
  height:100% !important;
  object-fit:contain !important;
  min-width:0 !important;
}

/* Remove transition/decorative flashes from the actual document paint. */
.fox-cat-pattern,
.fox-cat-corner,
body::before,
body::after,
.product-card-item::before,
#catalog-products-grid > div::before,
.product-card-item::after,
#catalog-products-grid > div::after,
#product-page-root > div > section:first-of-type::before,
#product-page-root > div > section:first-of-type::after {
  display:none !important;
  content:none !important;
}

.fox-product-sticker-pack { margin-top:0; }
.fox-product-sticker-grid {
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:12px;
  align-items:stretch;
}
.fox-product-sticker-item {
  min-width:0;
  overflow:hidden;
  justify-content:flex-start;
  background:rgba(255,255,255,.90) !important;
  border:1px solid rgba(244,123,48,.14) !important;
}
.fox-product-sticker-art {
  width:100%;
  aspect-ratio:1/1;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:14px;
  background:linear-gradient(145deg,#fffaf5,#f5f1ff);
  overflow:hidden;
}
.fox-product-sticker-art img {
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}
@media (max-width:900px){
  .fox-product-sticker-grid {
    grid-template-columns:repeat(5,minmax(82px,1fr));
    overflow-x:auto;
    padding-bottom:4px;
  }
  .fox-product-sticker-item { min-width:82px; }
}
@media (max-width:560px){
  .fox-product-sticker-grid {
    grid-template-columns:repeat(2,minmax(0,1fr));
    overflow:visible;
  }
  .fox-product-sticker-item { min-width:0; }
}


/* =========================================================
   FoxShop V17 — static black hero title + larger product sticker
   ========================================================= */
.fox-hero-rainbow-text{
  display:inline-block !important;
  position:relative !important;
  color:#111111 !important;
  background:none !important;
  background-image:none !important;
  background-size:auto !important;
  background-position:initial !important;
  background-repeat:initial !important;
  -webkit-background-clip:border-box !important;
  background-clip:border-box !important;
  -webkit-text-fill-color:#111111 !important;
  text-shadow:none !important;
  animation:none !important;
  transform:none !important;
  filter:none !important;
  will-change:auto !important;
}
.fox-hero-rainbow-text .underline{
  -webkit-text-fill-color:#111111 !important;
  color:#111111 !important;
}
#home-hero-premium,
#home-hero-premium *{
  animation:none !important;
}

.fox-product-title-row{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:18px !important;
  min-width:0 !important;
}
.fox-product-title-row h1{
  flex:1 1 auto !important;
  min-width:0 !important;
}
.fox-random-product-sticker{
  flex:0 0 auto !important;
  width:158px !important;
  min-width:158px !important;
  padding:9px !important;
  border-radius:24px !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:3px !important;
  background:linear-gradient(145deg,#fffaf5 0%,#fff0f7 52%,#f2edff 100%) !important;
  border:1px solid rgba(244,123,48,.18) !important;
  box-shadow:0 14px 30px rgba(82,48,31,.11) !important;
  overflow:hidden !important;
}
.fox-random-product-sticker img{
  width:138px !important;
  height:138px !important;
  display:block !important;
  object-fit:contain !important;
  filter:drop-shadow(0 8px 12px rgba(44,31,52,.13)) !important;
}
.fox-random-product-sticker small{
  max-width:100% !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  white-space:nowrap !important;
  font-size:9px !important;
  line-height:1.4 !important;
  font-weight:900 !important;
  color:#725d78 !important;
}

@media (max-width:700px){
  .fox-random-product-sticker{
    width:132px !important;
    min-width:132px !important;
    padding:8px !important;
    border-radius:21px !important;
  }
  .fox-random-product-sticker img{
    width:114px !important;
    height:114px !important;
  }
}
@media (max-width:430px){
  .fox-product-title-row{gap:12px !important;align-items:flex-start !important;}
  .fox-random-product-sticker{
    width:118px !important;
    min-width:118px !important;
    padding:7px !important;
    border-radius:19px !important;
  }
  .fox-random-product-sticker img{
    width:102px !important;
    height:102px !important;
  }
  .fox-random-product-sticker small{display:block !important;font-size:8px !important;}
}

/* Rendering-performance hints: browsers skip layout/paint work for distant sections. */
@supports (content-visibility:auto){
  main > section:not(:first-child),
  footer{
    content-visibility:auto;
    contain-intrinsic-size:520px;
  }
}
}