/*
  SaloCart V3.5 — Horizon UI
  Professional commerce colour system, mobile search correction, and push settings UI.
  Loaded last so it intentionally refines V3.1–V3.4 layers without changing API behaviour.
*/
:root{
  --sc-green:#0B7658;
  --sc-green-deep:#07523E;
  --sc-green-dark:#063C30;
  --sc-blue:#2E6ED8;
  --sc-blue-soft:#EAF1FF;
  --sc-lime:#B9D965;
  --sc-lime-soft:#F3F8DB;
  --sc-mint:#E6F5EE;
  --sc-mint-strong:#D1EBDD;
  --sc-orange:#E78A3F;
  --sc-coral:#D95D4B;
  --sc-ink:#142923;
  --sc-ink-soft:#526C63;
  --sc-muted:#71857D;
  --sc-line:#D7E5DF;
  --sc-line-strong:#BDD3CA;
  --sc-soft:#F5F8F6;
  --sc-surface:#FFFFFF;
  --sc-surface-alt:#F8FBF9;
  --sc-shadow-xs:0 2px 8px rgba(12,45,34,.045),0 1px 2px rgba(12,45,34,.025);
  --sc-shadow-sm:0 14px 34px rgba(12,45,34,.10),0 2px 7px rgba(12,45,34,.04);
  --sc-shadow-lg:0 28px 72px rgba(8,35,27,.18);
  --font-display:"Sora","Plus Jakarta Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-ui:"Manrope","Inter",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --tap-size:44px;
}

/* Ensures iOS/Android form controls follow the selected app appearance. */
html[data-theme="light"]{color-scheme:light!important}
html[data-theme="dark"]{
  color-scheme:dark!important;
  --sc-green:#54D7A0;
  --sc-green-deep:#B3F4D0;
  --sc-green-dark:#073A2C;
  --sc-blue:#9DBEFF;
  --sc-blue-soft:#1D2D47;
  --sc-lime:#D5EE8C;
  --sc-lime-soft:#2B3B21;
  --sc-mint:#123C2E;
  --sc-mint-strong:#1B4E3B;
  --sc-orange:#FFC377;
  --sc-coral:#FF9686;
  --sc-ink:#EDF8F3;
  --sc-ink-soft:#C1D5CC;
  --sc-muted:#91A89E;
  --sc-line:#29493E;
  --sc-line-strong:#3A6254;
  --sc-soft:#09130F;
  --sc-surface:#101C17;
  --sc-surface-alt:#15251F;
  --sc-shadow-xs:0 2px 10px rgba(0,0,0,.22);
  --sc-shadow-sm:0 16px 38px rgba(0,0,0,.32);
  --sc-shadow-lg:0 31px 76px rgba(0,0,0,.47);
}

html,body{background:var(--sc-soft)}
body{
  font-family:var(--font-ui)!important;
  font-size:14px!important;
  font-weight:520!important;
  letter-spacing:-.013em!important;
  text-rendering:optimizeLegibility;
  background:
    radial-gradient(circle at 100% -7%,rgba(46,110,216,.085),transparent 31rem),
    radial-gradient(circle at -4% 36%,rgba(185,217,101,.10),transparent 28rem),
    linear-gradient(180deg,#FCFDFC 0%,#F5F8F6 58%,#F3F7F5 100%)!important;
}
html[data-theme="dark"] body{
  background:
    radial-gradient(circle at 100% 0,rgba(88,137,255,.095),transparent 28rem),
    radial-gradient(circle at 0 32%,rgba(84,215,160,.07),transparent 26rem),
    linear-gradient(180deg,#0B1611 0%,#09130F 61%,#0B1712 100%)!important;
}

/* Softer but more exact hierarchy: Sora for decisions, Manrope for reading. */
.brand-copy strong,.page-header h1,.page-header h2,.sheet-head h2,.empty-state h3,.cart-empty h3,
.hero h1,.hero-cart-card strong,.dashboard-banner h1,.stat-card strong,.order-number,.deal-card h3,
.deal-price-grid strong,.cart-total strong,.checkout-total strong,.account-menu strong,.info-card h3,
.order-card h3,.tier-card h3{
  font-family:var(--font-display)!important;
  font-variation-settings:"opsz" 32;
}
.page-header h1,.hero h1{letter-spacing:-.065em!important}
.page-header h1{font-weight:780!important}.page-header h2{font-weight:760!important;letter-spacing:-.048em!important}
.page-header p,.hero-copy{font-size:.87rem!important;line-height:1.68!important}
.section-kicker{font-family:var(--font-ui)!important;letter-spacing:.13em!important;font-size:.63rem!important;font-weight:800!important}
.deal-price-grid strong,.cart-total strong,.checkout-total strong,.stat-card strong,.order-total,.money-value{font-variant-numeric:tabular-nums lining-nums}

/* Header: intentionally quiet, better visual anchor for commerce actions. */
.topbar{
  height:72px!important;
  background:color-mix(in srgb,var(--sc-surface) 90%,transparent)!important;
  border-bottom-color:color-mix(in srgb,var(--sc-line) 90%,transparent)!important;
  box-shadow:0 7px 25px rgba(10,42,31,.045)!important;
  backdrop-filter:blur(18px) saturate(135%)!important;
}
.topbar-inner{min-height:72px!important;gap:15px!important}
.brand-button{min-height:var(--tap-size)!important;padding:0 2px!important}
.brand-mark{width:42px!important;height:42px!important;border-radius:14px!important;background:linear-gradient(145deg,#0C805E 0%,#07533E 100%)!important;box-shadow:0 9px 21px rgba(6,91,64,.20),inset 0 1px 0 rgba(255,255,255,.24)!important}
.brand-mark i{font-size:1.23rem!important}.brand-mark b{bottom:5px!important}
.brand-copy strong{font-size:1.15rem!important;letter-spacing:-.075em!important}.brand-copy small{font-family:var(--font-ui)!important;font-size:.57rem!important;font-weight:740!important;letter-spacing:.005em!important}
.desktop-nav{gap:3px!important;margin-left:16px!important}.desktop-nav button{min-height:var(--tap-size)!important;border-radius:13px!important;font-family:var(--font-ui)!important;font-size:.77rem!important;font-weight:740!important}
.desktop-nav button.active{background:var(--sc-blue-soft)!important;color:var(--sc-blue)!important;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--sc-blue) 14%,transparent)!important}
.desktop-nav button:hover{background:var(--sc-mint)!important;color:var(--sc-green)!important}
.icon-button,.account-button,.install-button{min-height:var(--tap-size)!important}.icon-button{width:var(--tap-size)!important;height:var(--tap-size)!important;border-radius:14px!important;background:var(--sc-surface-alt)!important;border-color:var(--sc-line)!important;color:var(--sc-ink-soft)!important}.icon-button:hover{background:var(--sc-surface)!important;color:var(--sc-green)!important}
.cart-button{background:var(--sc-mint)!important;border-color:#C9E8D7!important;color:var(--sc-green)!important}.cart-badge{background:var(--sc-coral)!important;border-color:var(--sc-surface)!important}.notification-dot{background:var(--sc-coral)!important;border-color:var(--sc-surface-alt)!important}

/* Correct light/dark form rendering on all mobile browsers, including autofill. */
input,select,textarea,.form-control,.form-select,.input-group-text{font-family:var(--font-ui)!important}
html[data-theme="light"] input,html[data-theme="light"] select,html[data-theme="light"] textarea,
html[data-theme="light"] .form-control,html[data-theme="light"] .form-select,html[data-theme="light"] .input-group-text{color-scheme:light!important;background-color:var(--sc-surface)!important;color:var(--sc-ink)!important;-webkit-text-fill-color:var(--sc-ink)!important}
html[data-theme="dark"] input,html[data-theme="dark"] select,html[data-theme="dark"] textarea,
html[data-theme="dark"] .form-control,html[data-theme="dark"] .form-select,html[data-theme="dark"] .input-group-text{color-scheme:dark!important;background-color:var(--sc-surface)!important;color:var(--sc-ink)!important;-webkit-text-fill-color:var(--sc-ink)!important}
.form-control,.form-select,.input-group-text{min-height:48px!important;border-radius:14px!important;border-color:var(--sc-line)!important;background:var(--sc-surface)!important;color:var(--sc-ink)!important;font-size:.84rem!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.12)!important}
.form-control::placeholder,textarea::placeholder{color:var(--sc-muted)!important;opacity:.88!important;-webkit-text-fill-color:var(--sc-muted)!important}
.form-control:focus,.form-select:focus{border-color:color-mix(in srgb,var(--sc-blue) 70%,var(--sc-surface))!important;box-shadow:0 0 0 .24rem color-mix(in srgb,var(--sc-blue) 14%,transparent)!important}
.input-group>.input-group-text{background:var(--sc-surface-alt)!important;color:var(--sc-blue)!important}.input-group>.form-control{background:var(--sc-surface)!important}
html[data-theme="light"] .form-control:-webkit-autofill,html[data-theme="light"] .form-control:-webkit-autofill:hover,html[data-theme="light"] .form-control:-webkit-autofill:focus{box-shadow:0 0 0 1000px #fff inset!important;-webkit-text-fill-color:#142923!important;color-scheme:light!important}
html[data-theme="dark"] .form-control:-webkit-autofill,html[data-theme="dark"] .form-control:-webkit-autofill:hover,html[data-theme="dark"] .form-control:-webkit-autofill:focus{box-shadow:0 0 0 1000px #101C17 inset!important;-webkit-text-fill-color:#EDF8F3!important;color-scheme:dark!important}
/* The home "Find deals" input sits on a dark hero in both modes; keep it deliberately high-contrast. */
.hero-search{background:rgba(255,255,255,.98)!important}.hero-search input{background:transparent!important;color:#18332A!important;-webkit-text-fill-color:#18332A!important;color-scheme:light!important}.hero-search input::placeholder{color:#61746D!important;-webkit-text-fill-color:#61746D!important}

.btn-sc,.btn-sc-alt,.btn-sc-light,.btn-sc-danger{min-height:var(--tap-size)!important;border-radius:14px!important;font-family:var(--font-ui)!important;font-size:.78rem!important;font-weight:820!important;letter-spacing:-.012em!important}
.btn-sc{background:linear-gradient(135deg,#0B7658 0%,#07513D 100%)!important;box-shadow:0 10px 21px rgba(6,95,67,.18)!important}.btn-sc:hover{background:linear-gradient(135deg,#096449 0%,#063E30 100%)!important;box-shadow:0 14px 27px rgba(6,84,61,.23)!important}.btn-sc-alt{background:var(--sc-blue-soft)!important;color:var(--sc-blue)!important;border:1px solid color-mix(in srgb,var(--sc-blue) 16%,transparent)!important}.btn-sc-light{background:var(--sc-surface)!important;border-color:var(--sc-line)!important;color:var(--sc-ink)!important}

/* Product discovery: prices have a strong reading order at a glance. */
.hero{border-radius:0 0 31px 31px!important;background:radial-gradient(circle at 88% 14%,rgba(185,217,101,.44) 0,rgba(185,217,101,0) 18rem),radial-gradient(circle at 7% 120%,rgba(63,122,228,.25) 0,rgba(63,122,228,0) 29rem),linear-gradient(121deg,#063C30 0%,#075C45 56%,#0B7658 100%)!important}.hero .container-xxl{padding-top:47px!important;padding-bottom:43px!important}.hero h1 em{color:#E1F6AE!important}.hero-search{min-height:58px!important;border-radius:17px!important;border:1px solid rgba(255,255,255,.32)!important;box-shadow:0 16px 32px rgba(0,26,18,.24)!important}
.catalog-toolbar,.notice-card,.info-card,.list-card,.timeline-card,.tier-card,.table-card,.stat-card,.how-step,.order-card,.checkout-summary-card,.payment-box{border-color:var(--sc-line)!important;box-shadow:var(--sc-shadow-xs)!important}.catalog-toolbar{background:color-mix(in srgb,var(--sc-surface) 97%,transparent)!important;border-radius:19px!important}.catalog-search-row{align-items:stretch!important}.catalog-search-row .input-group{border-radius:14px!important;overflow:hidden!important}.catalog-search-row .input-group-text{border-right:0!important}.catalog-search-row .form-control{border-left:0!important}
.filter-chip{font-family:var(--font-ui)!important;font-size:.72rem!important;font-weight:780!important;border-radius:999px!important;min-height:36px!important}.filter-chip.active{background:var(--sc-blue-soft)!important;color:var(--sc-blue)!important;border-color:color-mix(in srgb,var(--sc-blue) 21%,transparent)!important}
.deal-grid{gap:16px!important}.deal-card{border:1px solid var(--sc-line)!important;border-radius:21px!important;background:var(--sc-surface)!important;box-shadow:var(--sc-shadow-xs)!important}.deal-card:hover{box-shadow:var(--sc-shadow-sm)!important}.deal-media{background:linear-gradient(150deg,#E8F4EE,#F8FAF8)!important}.deal-card h3{font-size:.96rem!important;line-height:1.34!important;letter-spacing:-.032em!important}.deal-price-grid{background:var(--sc-surface-alt)!important;border-radius:16px!important}.deal-price-grid>div+div{border-left-color:var(--sc-line)!important}.deal-price-grid strong{color:var(--sc-ink)!important;font-size:1.12rem!important}.deal-price-grid .price-best{color:var(--sc-green)!important}.deal-next-tier{background:var(--sc-lime-soft)!important;color:color-mix(in srgb,var(--sc-green-deep) 76%,#385B1C)!important;border:1px solid color-mix(in srgb,var(--sc-lime) 36%,var(--sc-line))!important}.progress-line{height:8px!important;background:color-mix(in srgb,var(--sc-mint) 62%,var(--sc-line))!important}.progress-line>span{background:linear-gradient(90deg,#0B7658,#57BB8B)!important}

/* Checkout keeps costs and irreversible actions explicit. */
.cart-sheet,.modal-sheet{background:var(--sc-surface)!important}.cart-layout{gap:16px!important}.cart-line{border-color:var(--sc-line)!important;border-radius:17px!important;background:var(--sc-surface)!important}.cart-summary,.checkout-summary-card{background:linear-gradient(145deg,var(--sc-surface) 0%,var(--sc-mint) 175%)!important;border-color:#CBE7D8!important;border-radius:19px!important}.cart-total strong,.checkout-total strong{color:var(--sc-green)!important;font-size:1.25rem!important}.cart-actions-bottom{background:color-mix(in srgb,var(--sc-surface) 94%,transparent)!important;border-top-color:var(--sc-line)!important;backdrop-filter:blur(17px)!important}

/* Push settings: calm information card, no marketing-dark-patterns. */
.push-status-card{display:flex;align-items:flex-start;gap:12px;padding:13px;border:1px solid var(--sc-line);border-radius:17px;background:linear-gradient(135deg,var(--sc-surface-alt),var(--sc-mint));margin-top:14px}.push-status-card>i{display:grid;place-items:center;width:38px;height:38px;flex:0 0 38px;border-radius:13px;background:var(--sc-blue-soft);color:var(--sc-blue);font-size:1.05rem}.push-status-card h3{font-family:var(--font-display);font-size:.85rem;letter-spacing:-.025em;margin:0 0 2px;color:var(--sc-ink)}.push-status-card p{font-size:.71rem;line-height:1.48;color:var(--sc-ink-soft);margin:0}.push-status-card .push-status-pill{display:inline-flex;align-items:center;gap:5px;margin-top:7px;padding:4px 7px;border-radius:99px;background:var(--sc-surface);border:1px solid var(--sc-line);font-size:.62rem;font-weight:800;color:var(--sc-ink-soft)}.push-status-card .push-status-pill.is-on{background:var(--sc-mint);color:var(--sc-green-deep);border-color:#C8E9D6}.push-actions{display:flex;gap:8px;margin-top:12px}.push-actions .btn-sc,.push-actions .btn-sc-light{flex:1;min-width:0}

/* Best mobile UI: less crowding, deliberate safe areas, compact but accessible controls. */
@media(max-width:991.98px){
  body{font-size:14px!important;padding-bottom:calc(86px + env(safe-area-inset-bottom))!important}.topbar{height:64px!important}.topbar-inner{min-height:64px!important;padding-left:14px!important;padding-right:14px!important}.brand-mark{width:39px!important;height:39px!important;border-radius:13px!important}.brand-copy strong{font-size:1.07rem!important}.top-actions{gap:5px!important}.top-actions .notification-button,.top-actions .account-button{display:none!important}.top-actions .icon-button{width:42px!important;height:42px!important;min-height:42px!important}.page-root{min-height:calc(100vh - 64px)!important}.page-section{padding:22px 0 30px!important}.container-xxl{padding-left:14px!important;padding-right:14px!important}
  .hero{border-radius:0 0 26px 26px!important}.hero .container-xxl{padding-top:30px!important;padding-bottom:29px!important}.hero h1{font-size:clamp(1.95rem,9vw,2.56rem)!important;line-height:1.045!important}.hero-copy{font-size:.85rem!important;line-height:1.64!important}.hero-search{min-height:54px!important;padding:5px 5px 5px 13px!important;border-radius:15px!important}.hero-search input{font-size:.76rem!important}.hero-search .btn-sc{min-height:42px!important;padding-inline:12px!important;font-size:.71rem!important}.hero-figures{gap:7px!important;margin-top:16px!important}.hero-figure{min-height:69px!important;padding:9px!important}
  .catalog-toolbar{padding:11px!important;border-radius:17px!important}.catalog-search-row{gap:7px!important}.catalog-search-row .input-group{min-width:0!important}.toolbar-search-button{padding-inline:12px!important;font-size:.72rem!important}.catalog-filter-row{gap:7px!important}.filter-select .form-select{min-height:42px!important}.deal-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}.deal-card{border-radius:18px!important}.deal-media{height:142px!important}.deal-content,.deal-body{padding:11px!important}.deal-card h3{font-size:.84rem!important}.deal-meta{font-size:.63rem!important}.deal-price-grid{padding:9px!important;gap:6px!important}.deal-price-grid strong{font-size:.93rem!important}.deal-price-grid small{font-size:.55rem!important}.deal-next-tier{font-size:.58rem!important;padding:7px!important}.card-actions{padding-top:9px!important;gap:7px!important}.card-actions .btn-sc,.card-actions .btn-sc-light{min-height:40px!important;padding:8px!important;font-size:.67rem!important}
  .mobile-nav{min-height:72px!important;padding:7px 5px calc(7px + env(safe-area-inset-bottom))!important;background:color-mix(in srgb,var(--sc-surface) 95%,transparent)!important;border-top-color:var(--sc-line)!important;backdrop-filter:blur(18px) saturate(135%)!important}.mobile-nav .nav-item{min-height:52px!important;border-radius:14px!important;font-family:var(--font-ui)!important;font-size:.59rem!important;font-weight:760!important}.mobile-nav .nav-item.active{background:var(--sc-mint)!important;color:var(--sc-green)!important}.mobile-nav .nav-primary{background:linear-gradient(145deg,#0B7658,#07513D)!important;box-shadow:0 8px 17px rgba(6,87,62,.20)!important}
  .modal-sheet,.cart-sheet{max-height:calc(94dvh - env(safe-area-inset-top))!important;border-radius:25px 25px 0 0!important}.sheet-head{padding:16px 16px 12px!important}.sheet-body{padding:0 14px 17px!important}.cart-layout{grid-template-columns:1fr!important}.cart-actions-bottom{padding:11px 0 calc(11px + env(safe-area-inset-bottom))!important}.cart-summary{padding:14px!important}.push-status-card{padding:12px!important}
}
@media(max-width:390px){.brand-copy small{display:none!important}.top-actions .preference-button{display:none!important}.hero-search .btn-sc{padding-inline:9px!important;font-size:.66rem!important}.hero-search input{font-size:.69rem!important}.toolbar-search-button{padding-inline:9px!important}.deal-grid{gap:8px!important}.deal-media{height:130px!important}.deal-content,.deal-body{padding:9px!important}.deal-card h3{font-size:.78rem!important}.deal-price-grid{padding:8px!important}.card-actions .btn-sc-light{display:none!important}.push-actions{flex-direction:column!important}}
@media(min-width:992px){.page-section{padding-top:37px!important}.deal-grid{gap:18px!important}.deal-card{border-radius:22px!important}.deal-media{height:182px!important}.cart-layout{grid-template-columns:minmax(0,1fr) 266px!important}.cart-sheet{border-radius:25px!important}}
@media(prefers-reduced-motion:reduce){.deal-card,.btn-sc,.btn-sc-alt,.btn-sc-light,.icon-button,.hero::before{transition:none!important;animation:none!important}}
