/* JM Prime Shop Theme Tokens */
:root{
  --radius: 18px;
  --shadow: 0 20px 60px rgba(0,0,0,.30);
  --brand: #2563eb;
  --brand2:#1d4ed8;
  --ok:#10b981;
  --bad:#ef4444;

  --bg:#0b1220;
  --bg2:#0f172a;
  --card: rgba(255,255,255,.06);
  --card2: rgba(255,255,255,.08);
  --border: rgba(255,255,255,.12);
  --text:#e5e7eb;
  --muted: rgba(229,231,235,.72);
  --chip: rgba(255,255,255,.10);
  --input: rgba(255,255,255,.08);
}

:root[data-theme="light"]{
  /* Shopify-premium light (JM Prime Shop) */
  --bg:#eaf2ff;
  --bg2:#f6f9ff;
  --card:#ffffff;
  --card2: rgba(255,255,255,.70);
  --border: rgba(37,99,235,.18);
  --text:#0b1220;
  --muted: rgba(11,18,32,.68);
  --chip: rgba(37,99,235,.08);
  --input:#f0f6ff;
  --shadow: 0 18px 50px rgba(37,99,235,.10);

  /* bands */
  --bandA:#eef5ff;
  --bandB:#e4efff;
  --bandSep: linear-gradient(90deg, rgba(37,99,235,.00), rgba(37,99,235,.18), rgba(37,99,235,.00));

  /* header/footer */
  --headerBg: rgba(255,255,255,.72);
  --headerBorder: rgba(37,99,235,.18);
  --footerBg:#0b1220;
  --footerText:#ffffff;
  --footerMuted: rgba(255,255,255,.72);

  /* nav */
  --navPillBg: rgba(37,99,235,.08);
  --navPillBorder: rgba(37,99,235,.18);
  --navPillHover: rgba(37,99,235,.12);
  --navPillActive: rgba(37,99,235,.18);
}
/* Global */
html,body{background:var(--bg); color:var(--text);}
a{color:inherit}
::selection{background:rgba(37,99,235,.25)}

/* Containers */
.container, .header-main, .header-top-content, .hero-content, .newsletter-content, .footer-grid{
  max-width: 1200px;
  margin: 0 auto;
  padding-left: 16px;
  padding-right: 16px;
}

/* Cards */
.category-card,.product-card,.feature-card,.newsletter-content,.footer-about,.footer-links{
  background:var(--card);
  border:1px solid var(--border);
  border-radius: var(--radius);
  box-shadow: none;
}
.product-card:hover,.category-card:hover,.feature-card:hover{transform: translateY(-2px);}
.product-card,.category-card,.feature-card{transition: transform .2s ease, border-color .2s ease, background .2s ease;}


/* Theme toggle button */
.theme-toggle{
  width:42px;height:42px;
  border-radius:999px;
  border:1px solid var(--border);
  background:var(--card2);
  color:var(--text);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition: transform .15s ease, background .15s ease;
}
.theme-toggle:hover{transform: translateY(-1px); background:var(--chip);}
.theme-toggle:active{transform: translateY(0);}


/* --- Shopify Premium Light Enhancements v7 --- */
:root[data-theme="light"] body{
  background: var(--bg);
  color: var(--text);
}

/* Alternating section bands + thin separators */
:root[data-theme="light"] .categories-section,
:root[data-theme="light"] .features-section,
:root[data-theme="light"] .newsletter-section{
  background: var(--bandA);
}
:root[data-theme="light"] .products-section{
  background: var(--bandB);
}
:root[data-theme="light"] .categories-section,
:root[data-theme="light"] .products-section,
:root[data-theme="light"] .features-section,
:root[data-theme="light"] .newsletter-section{
  position: relative;
  padding: 56px 0;
}
:root[data-theme="light"] .categories-section::before,
:root[data-theme="light"] .products-section::before,
:root[data-theme="light"] .features-section::before,
:root[data-theme="light"] .newsletter-section::before{
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:1px;
  background: var(--bandSep);
}

/* Tinted section surface (prevents white-on-white flatness) */
:root[data-theme="light"] .categories-grid,
:root[data-theme="light"] .product-grid,
:root[data-theme="light"] .features-grid{
  max-width: 1160px;
  margin-left:auto;
  margin-right:auto;
}

/* Category cards: tinted glass */
:root[data-theme="light"] .category-card{
  background: linear-gradient(180deg, rgba(255,255,255,.85), rgba(240,246,255,.78));
  border: 1px solid var(--border);
  box-shadow: 0 16px 40px rgba(37,99,235,.10);
  backdrop-filter: blur(10px);
}
:root[data-theme="light"] .category-card:hover{
  box-shadow: 0 22px 55px rgba(37,99,235,.16);
  transform: translateY(-2px);
}

/* Product/feature/newsletter: auto glass in light mode */
:root[data-theme="light"] .product-card,
:root[data-theme="light"] .feature-card,
:root[data-theme="light"] .newsletter-content{
  background: linear-gradient(180deg, rgba(255,255,255,.76), rgba(234,242,255,.62));
  border: 1px solid rgba(37,99,235,.20);
  box-shadow: 0 18px 50px rgba(37,99,235,.12);
  backdrop-filter: blur(12px);
}

/* Sticky glass header that tightens on scroll (+ subtle compact shadow) */
:root[data-theme="light"] .shop-header{
  position: sticky;
  top:0;
  z-index: 50;
  background: var(--headerBg);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--headerBorder);
  transition: box-shadow .22s ease;
}
:root[data-theme="light"] .shop-header.is-compact{
  box-shadow: 0 14px 38px rgba(11,18,32,.10), 0 8px 18px rgba(37,99,235,.10);
}
:root[data-theme="light"] .header-main{
  padding: 16px 0;
  transition: padding .22s ease;
}
:root[data-theme="light"] .shop-header.is-compact .header-main{
  padding: 10px 0;
}

/* Nav pills + active */
:root[data-theme="light"] .shop-nav{
  position: relative;
}
:root[data-theme="light"] .shop-nav a{
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 14px;
  border-radius: 999px;
  background: var(--navPillBg);
  border: 1px solid var(--navPillBorder);
  color: var(--text);
  transition: background .18s ease, transform .18s ease, box-shadow .18s ease;
}
:root[data-theme="light"] .shop-nav a:hover{
  background: var(--navPillHover);
  box-shadow: 0 10px 26px rgba(37,99,235,.12);
}
:root[data-theme="light"] .shop-nav a.active{
  background: var(--navPillActive);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.65), 0 14px 35px rgba(37,99,235,.14);
}

/* Sliding underline — "elastic" easing */
:root[data-theme="light"] .shop-nav .nav-underline{
  position:absolute;
  left: var(--ux, 0px);
  bottom: -10px;
  width: var(--uw, 0px);
  height: 3px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--brand), var(--brand2));
  box-shadow: 0 10px 24px rgba(37,99,235,.25);
  transition: left .34s cubic-bezier(.34, 1.56, .64, 1), width .34s cubic-bezier(.34, 1.56, .64, 1), opacity .18s ease;
  opacity: var(--uo, 0);
  pointer-events:none;
}

/* Footer: force readable text in light mode */
:root[data-theme="light"] .shop-footer{
  background: var(--footerBg);
  color: var(--footerText);
}
:root[data-theme="light"] .shop-footer,
:root[data-theme="light"] .shop-footer p,
:root[data-theme="light"] .shop-footer h3,
:root[data-theme="light"] .shop-footer h4{
  color: #ffffff !important;
}
:root[data-theme="light"] .shop-footer a{
  color: rgba(255,255,255,.88) !important;
}
:root[data-theme="light"] .shop-footer a:hover{
  color: #ffffff !important;
}
:root[data-theme="light"] .shop-footer .footer-bottom{
  border-top: 1px solid rgba(255,255,255,.14);
}
:root[data-theme="light"] .shop-footer .footer-bottom p{
  color: rgba(255,255,255,.82) !important;
}

/* Breadcrumbs */
.breadcrumbs{
  max-width: 1160px;
  margin: 18px auto 0 auto;
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid rgba(37,99,235,.18);
  background: linear-gradient(180deg, rgba(255,255,255,.78), rgba(234,242,255,.62));
  backdrop-filter: blur(10px);
  display: inline-flex;
  align-items: center;
  gap: 10px;
  color: rgba(11,18,32,.78);
}
.breadcrumbs a{
  color: rgba(11,18,32,.86);
  text-decoration: none;
}
.breadcrumbs a:hover{ text-decoration: underline; }
.breadcrumbs .sep{ opacity:.55; }


/* --- Footer container readability fix v8 --- */
/* Footer cards/columns: make them dark-tinted so white text is readable */
.shop-footer .footer-content{
  padding: 44px 0;
}
.shop-footer .footer-grid{
  gap: 18px;
}
.shop-footer .footer-column{
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04));
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 18px 40px rgba(0,0,0,.20);
  border-radius: 18px;
  padding: 18px 18px 16px 18px;
}
.shop-footer .footer-column h3,
.shop-footer .footer-column h4{
  color: #ffffff !important;
}
.shop-footer .footer-column p,
.shop-footer .footer-column li,
.shop-footer .footer-column a{
  color: rgba(255,255,255,.82) !important;
}
.shop-footer .footer-column a:hover{
  color: #ffffff !important;
}

/* If any light card styles leak into footer, force footer tint */
.shop-footer .category-card,
.shop-footer .product-card,
.shop-footer .feature-card,
.shop-footer .newsletter-content{
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.04)) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  color: #ffffff !important;
}

/* Footer bottom spacing */
.shop-footer .footer-bottom{
  padding: 18px 0;
}