/* ==========================================================
   Dependency Map
   - Role: canonical storefront stylesheet for the restricted `sf-*` shell, shared components, and responsive release-facing surfaces.
   - Related: storefront page templates in `storefront/pages/*.html`, shared partials in `storefront/pages/components/`, and entry modules in `storefront/static/app/*.js` rely on these classes and tokens.
   - Notes: keep selectors storefront-scoped, document structural sections here, and remove legacy/patched residue instead of layering duplicate rules.
   ========================================================== */

/* ==========================================================
   Aura Storefront v3.0.3 — Clean Bootstrap-based shell
   Goal: minimal custom CSS; rely on Bootstrap 5.3.8 utilities.
   Organization rule: keep the storefront in one stylesheet, but split it
   into deterministic sections and keep responsive overrides next to the
   component they belong to.
   ========================================================== */

/* ==========================================================
   SECTION INDEX
   01. Tokens
   02. Shell + shared utilities
   03. Header
   04. Sidebar
   05. Toolbar
   06. Cards
   07. Hero + home carousel + drawer
   08. Shared fallbacks + forms + buttons
   09. Footer
   10. Notifications
   11. Profile / premium polish
   12. Commerce polish (cart / checkout / wishlist / browse)
   13. Orders
   14. Product details
   15. QA helpers + Toasts
   ========================================================== */

/* Local bilingual type system: Manrope for Latin glyphs, Tajawal for Arabic glyphs. */
@font-face{
  font-family:"Manrope";
  src:url("../../../assets/fonts/manrope-latin-wght-normal.woff2") format("woff2");
  font-style:normal;
  font-weight:200 800;
  font-display:swap;
}
@font-face{
  font-family:"Tajawal";
  src:url("../../../assets/fonts/tajawal-arabic-400-normal.woff2") format("woff2");
  font-style:normal;
  font-weight:400;
  font-display:swap;
}
@font-face{
  font-family:"Tajawal";
  src:url("../../../assets/fonts/tajawal-arabic-500-normal.woff2") format("woff2");
  font-style:normal;
  font-weight:500 600;
  font-display:swap;
}
@font-face{
  font-family:"Tajawal";
  src:url("../../../assets/fonts/tajawal-arabic-700-normal.woff2") format("woff2");
  font-style:normal;
  font-weight:700;
  font-display:swap;
}
@font-face{
  font-family:"Tajawal";
  src:url("../../../assets/fonts/tajawal-arabic-800-normal.woff2") format("woff2");
  font-style:normal;
  font-weight:800 900;
  font-display:swap;
}

/* === SECTION 01: TOKENS === */
:root{
  /*
    Tokens are mapped to Bootstrap CSS variables to avoid duplication and drift.
    Bootstrap remains the source of truth for common typography/radii/shadows,
    while the storefront primary channel is bound here to TAIBA amber-bronze.
  */
  --sf-taiba-bronze: #7a430f;
  --sf-taiba-bronze-rgb: 122, 67, 15;
  --sf-taiba-bronze-hover: #6f3f0e;
  --sf-taiba-bronze-hover-rgb: 111, 63, 14;
  --sf-taiba-bronze-active: #5f330b;
  --sf-taiba-bronze-active-rgb: 95, 51, 11;
  --sf-taiba-amber: #d6a84f;
  --sf-taiba-amber-rgb: 214, 168, 79;
  --sf-taiba-amber-soft: #fff7e8;
  --sf-taiba-cream: #fffaf0;
  --sf-font-latin: "Manrope", "Tajawal", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --sf-font-arabic: "Tajawal", "Manrope", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --sf-font-body: var(--sf-font-latin);
  --sf-type-caption: .78rem;
  --sf-type-micro: .75rem;
  --sf-type-mobile-nav: .75rem;
  --sf-leading-body: 1.55;
  --sf-leading-arabic: 1.7;
  --sf-leading-arabic-tight: 1.4;
  --bs-body-font-family: var(--sf-font-body);
  --bs-primary: var(--sf-taiba-bronze);
  --bs-primary-rgb: var(--sf-taiba-bronze-rgb);
  --bs-link-color: var(--sf-taiba-bronze);
  --bs-link-color-rgb: var(--sf-taiba-bronze-rgb);
  --bs-link-hover-color: var(--sf-taiba-bronze-hover);
  --bs-link-hover-color-rgb: var(--sf-taiba-bronze-hover-rgb);
  --bs-focus-ring-color: rgba(var(--sf-taiba-bronze-rgb), .25);

  --sf-bg: var(--bs-body-bg);
  --sf-surface: var(--bs-body-bg);
  --sf-ink: var(--bs-body-color);
  --sf-muted: var(--bs-secondary-color);
  --sf-border: var(--bs-border-color-translucent);
  /*
    Shadows & radii:
    Keep them subtle and consistent with Bootstrap defaults.
    Cards/sidebars use a smaller shadow; hero uses the default shadow.
  */
  --sf-shadow-card: var(--bs-box-shadow-sm);
  --sf-shadow-hero: var(--bs-box-shadow);
  --sf-radius: var(--bs-border-radius);
  --sf-radius-sm: var(--bs-border-radius-sm);
  --sf-radius-lg: var(--bs-border-radius-lg);

  /* Motion */
  --sf-ease: cubic-bezier(.2,.8,.2,1);
  --sf-dur: 180ms;

  /* Semi-transparent header surface (uses Bootstrap RGB vars for theme-aware values). */
  --sf-header-bg: var(--sf-bg-75);

  /* Image fallback surface/text (theme-aware). */
  --sf-fallback-bg: rgba(var(--bs-body-color-rgb), .04);
  --sf-fallback-ink: var(--sf-body-55);

  /* Safe-area tokens for wrapper-ready mobile shells. */
  --sf-safe-top: env(safe-area-inset-top, 0px);
  --sf-safe-right: env(safe-area-inset-right, 0px);
  --sf-safe-bottom: env(safe-area-inset-bottom, 0px);
  --sf-safe-left: env(safe-area-inset-left, 0px);
  --sf-mobile-bottom-nav-height: 0px;

  /* Storefront normalization tokens (Batch 02 / Plan Step 02 runtime slice 01). */
  --sf-line-1: 1px;
  --sf-radius-pill: 999px;
  --sf-shell-offset-base: 72px;
  --sf-shell-offset-gap: 1rem;
  --sf-shell-sticky-offset: calc(var(--sf-shell-offset-base) + var(--sf-shell-offset-gap));
  --sf-header-row-max-h: 50px;
  --sf-brand-logo-h: 32px;
  --sf-toolbar-side-min: 220px;
  --sf-size-72: 72px;
  --sf-size-64: 64px;
  --sf-size-56: 56px;
  --sf-size-40: 40px;
  --sf-size-34: 34px;
  --sf-glass-blur-sm: 8px;
  --sf-glass-blur-md: 10px;
  --sf-glass-blur-lg: 12px;
  --sf-header-blur: 14px;
  --sf-shift-header-collapse: -10px;
  --sf-shift-card-hover: -2px;
  --sf-shift-button-hover: -1px;
  --sf-shift-toast-enter: -10px;
  --sf-shift-toast-leave: -8px;
  --sf-shadow-header: 0 4px 20px rgba(var(--bs-body-color-rgb), .08);
  --sf-shadow-soft: 0 10px 24px rgba(15, 23, 42, .08);
  --sf-shadow-lift: 0 18px 34px rgba(15, 23, 42, .06);
  --sf-shadow-toast: 0 18px 40px rgba(15, 23, 42, .14);
  --sf-shadow-ordercard: 0 10px 30px var(--sf-black-06);
  --sf-letter-tight: .2px;
  --sf-letter-soft: .15px;
  --sf-letter-wide: .24px;

  --sf-size-96: 96px;
  --sf-size-92: 92px;
  --sf-size-88: 88px;
  --sf-size-50: 50px;
  --sf-size-46: 46px;
  --sf-size-38: 38px;
  --sf-size-36: 36px;
  --sf-size-9: 9px;
  --sf-size-18: 18px;
  --sf-size-12: 12px;
  --sf-size-10: 10px;
  --sf-size-6: 6px;
  --sf-size-54: 54px;
  --sf-size-52: 52px;
  --sf-size-42: 42px;
  --sf-size-22: 22px;
  --sf-size-20: 20px;
  --sf-radius-8: 8px;
  --sf-radius-10: 10px;
  --sf-radius-12: 12px;
  --sf-radius-14: 14px;
  --sf-radius-16: 16px;
  --sf-radius-18: 18px;
  --sf-radius-20: 20px;
  --sf-radius-22: 22px;
  --sf-radius-24: 24px;
  --sf-radius-26: 26px;
  --sf-radius-bump-sm: 2px;
  --sf-radius-bump-md: 6px;
  --sf-radius-bump-lg: 10px;
  --sf-space-720: 720px;
  --sf-space-420: 420px;
  --sf-space-300: 300px;
  --sf-space-240: 240px;
  --sf-space-180: 180px;
  --sf-space-760: 760px;
  --sf-space-640: 640px;
  --sf-space-900: 900px;
  --sf-space-800: 800px;
  --sf-space-1200: 1200px;
  --sf-space-600: 600px;
  --sf-space-520: 520px;
  --sf-space-360: 360px;
  --sf-space-280: 280px;
  --sf-ink-08: rgba(var(--bs-body-color-rgb), .08);
  --sf-ink-06: rgba(var(--bs-body-color-rgb), .06);
  --sf-ink-04: rgba(var(--bs-body-color-rgb), .04);
  --sf-ink-03: rgba(var(--bs-body-color-rgb), .03);
  --sf-ink-02: rgba(var(--bs-body-color-rgb), .02);
  --sf-ink-015: rgba(var(--bs-body-color-rgb), .015);
  --sf-ink-012: rgba(var(--bs-body-color-rgb), .012);
  --sf-ink-01: rgba(var(--bs-body-color-rgb), .01);
  --sf-ink-035: rgba(var(--bs-body-color-rgb), .035);
  --sf-bg-65: rgba(var(--bs-body-bg-rgb), .65);
  --sf-bg-70: rgba(var(--bs-body-bg-rgb), .70);
  --sf-bg-72: rgba(var(--bs-body-bg-rgb), .72);
  --sf-bg-75: rgba(var(--bs-body-bg-rgb), .75);
  --sf-bg-78: rgba(var(--bs-body-bg-rgb), .78);
  --sf-bg-80: rgba(var(--bs-body-bg-rgb), .80);
  --sf-bg-82: rgba(var(--bs-body-bg-rgb), .82);
  --sf-bg-84: rgba(var(--bs-body-bg-rgb), .84);
  --sf-bg-86: rgba(var(--bs-body-bg-rgb), .86);
  --sf-bg-94: rgba(var(--bs-body-bg-rgb), .94);
  --sf-bg-96: rgba(var(--bs-body-bg-rgb), .96);
  --sf-bg-97: rgba(var(--bs-body-bg-rgb), .97);
  --sf-bg-98: rgba(var(--bs-body-bg-rgb), .98);
  --sf-primary-05: rgba(var(--bs-primary-rgb), .05);
  --sf-primary-06: rgba(var(--bs-primary-rgb), .06);
  --sf-primary-08: rgba(var(--bs-primary-rgb), .08);
  --sf-primary-10: rgba(var(--bs-primary-rgb), .10);
  --sf-primary-12: rgba(var(--bs-primary-rgb), .12);
  --sf-primary-14: rgba(var(--bs-primary-rgb), .14);
  --sf-primary-16: rgba(var(--bs-primary-rgb), .16);
  --sf-primary-18: rgba(var(--bs-primary-rgb), .18);
  --sf-primary-22: rgba(var(--bs-primary-rgb), .22);
  --sf-primary-25: rgba(var(--bs-primary-rgb), .25);
  --sf-primary-26: rgba(var(--bs-primary-rgb), .26);
  --sf-primary-45: rgba(var(--bs-primary-rgb), .45);
  --sf-primary-85: rgba(var(--bs-primary-rgb), .85);
  --sf-primary-95: rgba(var(--bs-primary-rgb), .95);
  --sf-primary-solid: var(--bs-primary);
  --sf-success-06: rgba(var(--bs-success-rgb), .06);
  --sf-success-12: rgba(var(--bs-success-rgb), .12);
  --sf-success-18: rgba(var(--bs-success-rgb), .18);
  --sf-success-22: rgba(var(--bs-success-rgb), .22);
  --sf-success-25: rgba(var(--bs-success-rgb), .25);
  --sf-success-80: rgba(var(--bs-success-rgb), .80);
  --sf-success-solid: var(--bs-success);
  --sf-danger-12: rgba(var(--bs-danger-rgb), .12);
  --sf-danger-18: rgba(var(--bs-danger-rgb), .18);
  --sf-danger-22: rgba(var(--bs-danger-rgb), .22);
  --sf-danger-solid: var(--bs-danger);
  --sf-warning-08: rgba(var(--bs-warning-rgb), .08);
  --sf-warning-12: rgba(var(--bs-warning-rgb), .12);
  --sf-warning-14: rgba(var(--bs-warning-rgb), .14);
  --sf-warning-18: rgba(var(--bs-warning-rgb), .18);
  --sf-warning-24: rgba(var(--bs-warning-rgb), .24);
  --sf-warning-35: rgba(var(--bs-warning-rgb), .35);
  --sf-warning-solid: var(--bs-warning);
  --sf-body-00: rgba(var(--bs-body-color-rgb), .00);
  --sf-body-05: rgba(var(--bs-body-color-rgb), .05);
  --sf-body-09: rgba(var(--bs-body-color-rgb), .09);
  --sf-body-10: rgba(var(--bs-body-color-rgb), .10);
  --sf-body-12: rgba(var(--bs-body-color-rgb), .12);
  --sf-body-25: rgba(var(--bs-body-color-rgb), .25);
  --sf-body-26: rgba(var(--bs-body-color-rgb), .26);
  --sf-body-55: rgba(var(--bs-body-color-rgb), .55);
  --sf-body-74: rgba(var(--bs-body-color-rgb), .74);
  --sf-body-80: rgba(var(--bs-body-color-rgb), .80);
  --sf-white-08: rgba(255,255,255,.08);
  --sf-black-06: rgba(0,0,0,.06);
  --sf-overlay-dark-45: rgba(0,0,0,.45);
  --sf-overlay-dark-35: rgba(0,0,0,.35);
  --sf-overlay-dark-28: rgba(0,0,0,.28);
  --sf-overlay-dark-15: rgba(0,0,0,.15);
  --sf-overlay-dark-0: rgba(0,0,0,.00);
  --sf-white: #fff;}

body.sf{
  background: var(--sf-bg);
  color: var(--sf-ink);
  padding-left: var(--sf-safe-left);
  padding-right: var(--sf-safe-right);
}
body.sf.sf-app-shell{
  min-height: 100vh;
  min-height: 100dvh;
  overflow-x: hidden;
  -webkit-tap-highlight-color: transparent;
}
.sf-app-shell .sf-main{
  min-height: calc(100dvh - var(--sf-safe-top) - var(--sf-safe-bottom));
}
@media (display-mode: standalone){
  body.sf.sf-app-shell{
    overscroll-behavior-y: contain;
  }
}
/* === END SECTION 01 === */

/* === SECTION 02: SHELL + SHARED UTILITIES === */

.sf-muted{ color: var(--sf-muted) !important; }
.sf-divider{ border-top: var(--sf-line-1) solid var(--sf-border); }
/* .sf is used as a markup namespace hook (no CSS rules needed here). */
.sf img{
	max-width:100%;
	height:auto;
}
/* === SECTION 03: HEADER (TWO ROWS) === */
.sf-header{ 
    position: sticky; 
    top: 0; 
    z-index: 1030; 
    padding-top: var(--sf-safe-top);
    backdrop-filter: blur(var(--sf-header-blur)); 
    background: var(--sf-header-bg); 
    border-bottom: var(--sf-line-1) solid var(--sf-border); 
    transition: background-color 0.3s ease, box-shadow 0.3s ease;
}
.sf-header-top,
.sf-header-main{
    position: relative;
}
.sf-header-top{
    z-index: 3;
    background: transparent; 
    max-height: var(--sf-header-row-max-h); 
    opacity: 1;
    /*
      IMPORTANT:
      Dropdown menus in the top header row (e.g. language selector) must be able
      to overflow outside this row. overflow:hidden clips them under
      .sf-header-main.
    */
    overflow: visible;
    transform: translateY(0);
    transition: max-height 0.3s cubic-bezier(0.4, 0, 0.2, 1), 
                opacity 0.25s ease, 
                transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), 
                padding 0.3s ease;
}
.sf-header-main{ 
    z-index: 2;
    background: transparent; 
}
.sf-header-top .dropdown,
.sf-header-top .dropdown-menu,
.sf-header-top .dropdown-toggle{
  position: relative;
  z-index: 5;
}
.sf-brand-logo{
  display: block;
  height: var(--sf-brand-logo-h);
  width: auto;
  max-height: var(--sf-brand-logo-h);
}
.sf-brand-link{ min-width: 0; max-width: none; overflow: visible; flex: 1 1 auto; }
.sf-brand-link > span{ white-space: nowrap; flex: 0 0 auto; }
.sf-header.is-scrolled{ 
    box-shadow: var(--sf-shadow-header);
}
.sf-header.is-scrolled .sf-header-top{
    max-height: 0;
    opacity: 0;
    transform: translateY(var(--sf-shift-header-collapse)); 
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    border-bottom-color: transparent !important;
}
/* Improve tap targets on mobile */
@media (max-width: 575.98px){
  .sf-header-main .btn{ padding: .45rem .6rem; }
  .sf-header-main .navbar-brand{
    min-width: 0;
    max-width: none;
  }
  .sf-header-main__row{
    flex-wrap: nowrap;
    min-width: 0;
  }
  .sf-header-mobile-actions{
    flex-wrap: nowrap;
    margin-inline-start: auto;
  }
}
/* === END SECTION 03 === */

.sf-pagehead{ padding: 2.25rem 0 1.25rem; }
body[data-sf-page="store-home"] .sf-pagehead{ padding:0rem; }
.sf-page{ padding: 1.25rem 0 3rem; }

/* Page head: premium but subtle */
.sf-pagehead{
  border-bottom: var(--sf-line-1) solid var(--sf-border);
  background:
    radial-gradient(var(--sf-space-900) var(--sf-space-420) at 20% 0%, var(--sf-primary-10), transparent 60%),
    radial-gradient(var(--sf-space-800) var(--sf-space-420) at 80% 15%, var(--sf-warning-12), transparent 62%);
}
@media (max-width: 575.98px){
  .sf-pagehead{ padding: 1.5rem 0 1rem; }
  .sf-page{ padding: 1rem 0 2.25rem; }
}

/* Typography tuning (keep Bootstrap sizes, improve rhythm) */
.sf-pagehead h1,
.sf-pagehead .h1,
.sf-pagehead h2,
.sf-pagehead .h2{ letter-spacing: var(--sf-letter-tight); }
.sf-pagehead .sf-muted{ line-height: 1.4; }

/* --- Shared utilities --- */
.sf-maxw-220{ max-width: var(--sf-toolbar-side-min); }
.sf-minw-220{ min-width: var(--sf-toolbar-side-min); }
.sf-prose{ line-height: 1.6; }
.sf-prose > *:last-child{ margin-bottom: 0; }
/* Offset for sticky cards below the sticky header */
.sf-sticky-top-1{ top: var(--sf-shell-sticky-offset) !important; }
/* --- End shared utilities --- */


/* === SECTION 04: SIDEBAR === */
.sf-sidebar{ position: static; top: auto; }
.sf-sidebar .sf-sidebar-header{border-bottom: var(--sf-line-1) solid var(--sf-border); }
.sf-sidebar .sf-sidebar-content{position:relative; }
.sf-sidebar .sf-sidebar-item{position:relative; }
.sf-sidenav a{ text-decoration: none; }
.sf-sidenav .list-group-item{ border: var(--sf-line-1) solid var(--sf-border); background: var(--sf-surface); color: inherit; }
@media (min-width: 992px){
  .sf-sidebar{ position: sticky; top: var(--sf-shell-sticky-offset); }
}
/* === END SECTION 04 === */


/* === SECTION 05: TOOLBAR === */
.sf-toolbar{
  border: var(--sf-line-1) solid var(--sf-border);
  padding: .85rem;
  background: linear-gradient(180deg, var(--sf-ink-02), var(--sf-body-00));
  border-radius: calc(var(--sf-radius-sm) + var(--sf-radius-bump-sm));
  box-shadow: var(--sf-shadow-card);
}

.sf-toolbar-inner{ width: 100%; }
.sf-toolbar-left{ min-width: var(--sf-toolbar-side-min); }

.sf-toolbar-chips{
  display: flex;
  gap: .5rem;
  flex-wrap: wrap;
}

.sf-chip{
  --sf-chip-py: .25rem;
  --sf-chip-px: .55rem;
  --sf-chip-min-h: auto;
  --sf-chip-font-size: .82rem;
  --sf-chip-font-weight: 500;
  --sf-chip-border-color: var(--sf-border);
  --sf-chip-bg: var(--sf-ink-03);
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  min-height: var(--sf-chip-min-h);
  padding: var(--sf-chip-py) var(--sf-chip-px);
  border-radius: var(--sf-radius-pill);
  border: var(--sf-line-1) solid var(--sf-chip-border-color);
  background: var(--sf-chip-bg);
  font-size: var(--sf-chip-font-size);
  font-weight: var(--sf-chip-font-weight);
  line-height: 1;
  color: inherit;
}

.sf-chip .sf-chip__k{ color: var(--sf-muted); }

.sf-chip button{
  border: 0;
  background: transparent;
  padding: 0;
  line-height: 1;
  color: inherit;
  opacity: .7;
}

.sf-chip button:hover{ opacity: 1; }

.sf-toolbar-reset{
  text-decoration: none;
  padding: .2rem .35rem;
  border-radius: var(--sf-radius-8);
  color: inherit;
  opacity: .9;
}
.sf-toolbar-reset:hover{ opacity: 1; background: var(--sf-ink-04); }

/* Responsive: toolbar feels like a compact control bar on mobile */
@media (max-width: 575.98px){
  .sf-toolbar{ padding: .75rem; overflow: hidden; }
  .sf-toolbar-inner{ min-width: 0; }
  .sf-toolbar-content{
    justify-content: space-between;
    gap: .625rem;
    padding-bottom: .125rem;
  }
  .sf-toolbar-content > *{ flex: 0 0 auto; }
  .sf-toolbar-left{
    min-width: 0;
    display: flex;
    flex-direction: row !important;
    align-items: center;
    gap: .5rem !important;
  }
  .sf-toolbar-left > .d-flex{ flex: 0 0 auto; }
  .sf-toolbar-chips{
    flex-wrap: nowrap;
    overflow-x: auto;
    overflow-y: hidden;
    max-width: min(42vw, 15rem);
    padding-bottom: .125rem;
  }
  .sf-toolbar-search{ width: auto; min-width: min(16rem, 56vw); flex: 0 0 auto; }
  .sf-toolbar-search .input-group{ width: 100%; }
  .sf-toolbar-filter{ width: auto; justify-content: flex-start; flex-wrap: nowrap !important; flex: 0 0 auto; }
  .sf-toolbar-filter > .d-flex{ flex-wrap: nowrap !important; }
  .sf-toolbar-filter .form-select{ min-width: 9.5rem; }
  .sf-toolbar-reset{ white-space: nowrap; }
  .sf-toolbar-content::-webkit-scrollbar, .sf-toolbar-chips::-webkit-scrollbar{ height: var(--sf-size-6); }
}
/* === END SECTION 05 === */


/* === SECTION 06: CARDS === */
.sf-card{ border: var(--sf-line-1) solid var(--sf-border); border-radius: var(--sf-radius); box-shadow: var(--sf-shadow-card); background: var(--sf-surface); overflow: hidden; }
.sf-card{ transition: transform var(--sf-dur) var(--sf-ease), box-shadow var(--sf-dur) var(--sf-ease), border-color var(--sf-dur) var(--sf-ease); }
.sf-card.sf-product:hover,
.sf-card.sf-cat:hover,
.sf-card.sf-store:hover,
.sf-card.sf-card--hover:hover{
  transform: translateY(var(--sf-shift-card-hover));
  box-shadow: var(--bs-box-shadow);
  border-color: var(--sf-primary-22);
}
.sf-card--flat{ box-shadow: none; }
.sf-card a{
	text-decoration: none;
}
.sf-card.sf-product,
.sf-card.sf-cat{
	height: 100%; display: flex; flex-direction: column; text-decoration: none; color: inherit;
}
.sf-card .sf-card__media{
	aspect-ratio: 1/1; 
	background: var(--sf-surface); 
	display:flex; align-items:center; 
	justify-content:center;
	position:relative;
	overflow:hidden;
	padding: .85rem;
	background: radial-gradient(var(--sf-space-420) var(--sf-space-240) at 50% 30%, var(--sf-ink-06), transparent 70%);
}
.sf-card.sf-cat .sf-card__media{
	aspect-ratio: 4/3;
}
.sf-card .sf-card__media img{
	max-width:100%;
	max-height:100%;
	object-fit: contain;
	transition: transform var(--sf-dur) var(--sf-ease);
}

/* Subtle media zoom for interactive cards */
.sf-card.sf-product:hover .sf-card__media img,
.sf-card.sf-cat:hover .sf-card__media img,
.sf-card.sf-store:hover .sf-card__media img{
  transform: scale(1.03);
}
.sf-card .sf-card__body{
	padding: 1rem 1rem 0.75rem;
	margin-top:auto;
}
.sf-card .sf-card__body .sf-card__title{
	font-weight: 650; margin: 0; font-size: 1rem;
	color: inherit;
}
.sf-card .sf-card__body .sf-card__meta{
	margin-top: .25rem; color: var(--sf-muted); font-size: .9rem;
}
.sf-card .sf-card__footer{
	padding: 0 1rem 1rem; margin-top:auto; display:flex; align-items:center; justify-content:space-between; gap:.75rem;
}
/* === END SECTION 06 === */

/* === SECTION 07: HERO + HOME SURFACES === */
.sf-hero{ border-radius: calc(var(--sf-radius) + var(--sf-radius-bump-sm)); border: var(--sf-line-1) solid var(--sf-border);
  background: radial-gradient(var(--sf-space-1200) var(--sf-space-600) at 20% 10%, var(--sf-warning-35), transparent 60%),
              radial-gradient(var(--sf-space-900) var(--sf-space-520) at 85% 35%, var(--sf-primary-18), transparent 65%),
              linear-gradient(180deg, var(--sf-ink-04), var(--sf-body-00));
  box-shadow: var(--sf-shadow-hero);
}
.sf-hero__inner{ padding: 0rem;}
@media (min-width: 992px){
  .sf-hero__inner{ padding: 0rem;}
}

/* Full-width, image-based hero banners (Home) */
.sf-hero--banner{
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  overflow: hidden;
}
.sf-hero--banner .sf-heroSwiper{
  width: 100%;
  height: clamp(360px, 37.5vw, 640px);
}
.sf-heroSkeletonBlock{
  display: block;
  height: clamp(360px, 37.5vw, 640px);
}
.sf-storeSkeletonAvatar{
  width: var(--sf-size-64);
  height: var(--sf-size-64);
}
.sf-hero--banner .swiper-pagination{
  position: absolute;
  left: 0;
  right: 0;
  bottom: var(--sf-size-12);
}

.sf-heroSlide{
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  color: var(--sf-white);
  text-decoration: none;
}
.sf-heroSlide__media,
.sf-heroSlide__media picture,
.sf-heroSlide__media img{
  width: 100%;
  height: 100%;
}
.sf-responsive-banner{ display:block; }
.sf-heroSlide__media img{
  display: block;
  object-fit: cover;
  object-position: center center;
}
.sf-heroSlide__shade{
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, var(--sf-overlay-dark-45), var(--sf-overlay-dark-15) 55%, var(--sf-overlay-dark-0));
}
.sf-heroSlide__copy{
  position: absolute;
  left: 1rem;
  bottom: 1rem;
  max-width: min(var(--sf-space-720), calc(100% - 2rem));
  padding: 0.9rem 1.05rem;
  border-radius: var(--sf-radius-16);
  background: var(--sf-overlay-dark-28);
  backdrop-filter: blur(var(--sf-glass-blur-sm));
  -webkit-backdrop-filter: blur(var(--sf-glass-blur-sm));
}
.sf-heroSlide__title{
  font-weight: 800;
  letter-spacing: var(--sf-letter-tight);
  font-size: clamp(1.15rem, 2.2vw, 2rem);
  line-height: 1.15;
}
.sf-heroSlide__sub{
  margin-top: .35rem;
  font-size: clamp(.95rem, 1.3vw, 1.1rem);
  opacity: .92;
}

.sf-heroSlide__actions{ margin-top: .6rem; }
.sf-heroSlide__cta{ border-radius: var(--sf-radius-pill); padding-inline: .9rem; }

.sf-heroNav{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: var(--sf-size-40);
  height: var(--sf-size-40);
  border: 0;
  border-radius: var(--sf-radius-pill);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--sf-overlay-dark-35);
  color: var(--sf-white);
  backdrop-filter: blur(var(--sf-glass-blur-sm));
  -webkit-backdrop-filter: blur(var(--sf-glass-blur-sm));
  opacity: .0;
  transition: opacity .18s ease, transform .18s ease;
}
.sf-heroNav--prev{ left: var(--sf-size-12); }
.sf-heroNav--next{ right: var(--sf-size-12); }
.sf-hero--banner:hover .sf-heroNav{ opacity: .95; }
@media (hover: none){
  .sf-heroNav{ opacity: .9; }
}
@media (min-width: 992px){
  .sf-hero--banner .sf-heroSwiper,
  .sf-heroSkeletonBlock{
    height: calc(100vh - 97.375px);
    height: calc(100svh - 97.375px);
    height: calc(100dvh - 97.375px);
  }
  .sf-heroSlide__copy{ left: 1.5rem; bottom: 1.5rem; padding: 1.05rem 1.25rem; }
}
/* --- End hero --- */

/* --- Drawer polish --- */
#sfNavDrawer .offcanvas-header{
  border-bottom: var(--sf-line-1) solid var(--sf-border);
  padding-top: calc(var(--bs-offcanvas-padding-y) + var(--sf-safe-top));
  padding-left: calc(var(--bs-offcanvas-padding-x) + var(--sf-safe-left));
  padding-right: calc(var(--bs-offcanvas-padding-x) + var(--sf-safe-right));
}
#sfNavDrawer .offcanvas-body{
  display:flex;
  flex-direction:column;
  gap: .9rem;
  padding-left: calc(var(--bs-offcanvas-padding-x) + var(--sf-safe-left));
  padding-right: calc(var(--bs-offcanvas-padding-x) + var(--sf-safe-right));
  padding-bottom: calc(var(--bs-offcanvas-padding-y) + var(--sf-safe-bottom));
}
#sfNavDrawer .sf-sidenav .list-group-item{ border-color: var(--sf-border); border-radius: var(--sf-radius-14); margin-bottom: .5rem; }
#sfNavDrawer .sf-sidenav .list-group-item i{ width: 1.1rem; }
#sfNavDrawer .sf-drawer-sectionTitle{ font-size: .8rem; letter-spacing: .12em; text-transform: uppercase; color: var(--bs-secondary-color); margin: .25rem .25rem .5rem; }

html[dir="rtl"] .offcanvas.offcanvas-start{
  right: 0; left: auto;
  transform: translateX(100%);
}
html[dir="rtl"] .offcanvas.offcanvas-start.show{ transform: none; }
html[dir="rtl"] .offcanvas-backdrop.show{ opacity: .5; }
/* --- End drawer polish --- */


/* --- Home carousel --- */
.sf-carousel-section{
	position:relative;
	overflow: hidden;
	max-width:100%;
}
.sf-carousel{
	position:relative;
	overflow: hidden;
	transition: opacity var(--sf-dur) var(--sf-ease), transform var(--sf-dur) var(--sf-ease);
}
.sf-carousel .swiper-slide {
    display: flex;
    justify-content: center;
	transition: opacity var(--sf-dur) var(--sf-ease), transform var(--sf-dur) var(--sf-ease);
    opacity: 0.8;
    transform: scale(0.9);
}
.sf-carousel .swiper-slide-active {
	opacity: 1;
    transform: scale(1.02);
    z-index: 10;
}
.sf-carousel .swiper-slide .sf-col-x {
    width: 100% !important;
    margin: 0 !important;
}
.sf-carousel:not(.swiper-initialized) .swiper-wrapper {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.25rem;
}
.sf-carousel:not(.swiper-initialized) .swiper-slide {
    width: auto !important;
    min-width: 0;
    opacity: 1;
    transform: none;
}
.sf-carousel:not(.swiper-initialized) .swiper-slide .sf-col-x {
    width: 100% !important;
    max-width: none;
    padding-left: 0;
    padding-right: 0;
}
@media (min-width: 768px){
    .sf-carousel:not(.swiper-initialized) .swiper-wrapper {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}
@media (min-width: 1024px){
    .sf-carousel:not(.swiper-initialized) .swiper-wrapper {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}
@media (min-width: 1200px){
    .sf-categories-carousel:not(.swiper-initialized) .swiper-wrapper {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
}
.sf-carousel .swiper-pagination{
	position: relative;
}
.sf-carousel .swiper-pagination-bullet {
	transition: background-color var(--sf-dur) var(--sf-ease), opacity var(--sf-dur) var(--sf-ease), transform var(--sf-dur) var(--sf-ease);
	background:var(--sf-ink);
}
.sf-carousel .swiper-pagination-bullet-active {
    background: var(--bs-primary);
}
/* --- End home carousel --- */

/* === SECTION 08: SHARED FALLBACKS + FORMS + BUTTONS === */
.sf-img-fallback{ background:var(--sf-fallback-bg); border:var(--sf-line-1) dashed var(--sf-border); border-radius: var(--sf-radius-sm); display:flex; align-items:center; justify-content:center; color: var(--sf-fallback-ink); }
/* --- End fallbacks --- */

/* Forms: consistent premium focus (subtle) */
.sf .form-control,
.sf .form-select,
.sf .input-group .btn{ border-radius: var(--sf-radius-sm); }
.sf .form-control:focus,
.sf .form-select:focus{
  border-color: var(--sf-primary-45);
  box-shadow: 0 0 0 .2rem var(--sf-primary-12);
}

/* Bootstrap Icons: bilingual geometric-centering contract for confirmed affected hosts only.
   Bootstrap Icons use their own Latin font metrics, while Arabic storefront text uses
   Tajawal with taller leading. Normalize the icon glyph box only where the host
   contract is geometric centering; keep baseline-aligned mixed-text controls intact. */

/* Icon-only <a> hosts begin as Bootstrap inline boxes, so their host and glyph box
   are both centered explicitly. */
.sf-header-mobile-actions > a.btn,
.sf-header-main .navbar-collapse > div > a.btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: calc(1.5em + var(--bs-btn-padding-y) + var(--bs-btn-padding-y) + var(--bs-btn-border-width) + var(--bs-btn-border-width));
}

/* Icon-only <button> hosts are separate from anchors because native/Bootstrap button
   layout differs. Preserve Bootstrap's original control height while replacing
   font-baseline placement with geometric centering. */
button.sf-header-icon-btn,
.sf-header-mobile-actions > button.btn,
.sf-header-main .navbar-collapse > div > .dropdown > button.btn,
.sf-search-popover__panel > button.btn,
button.sf-shell-back-btn,
.sf-product-buybox button[data-action="share-product"],
.sf-product-buybox button.sf-product-wish,
.sf-toolbar-inner button[data-ui="toolbarViewGrid"],
.sf-sidebar-header button.sf-reset,
.sf-sidebar-header button.sf-sidebar-close{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: calc(1.5em + var(--bs-btn-padding-y) + var(--bs-btn-padding-y) + var(--bs-btn-border-width) + var(--bs-btn-border-width));
}

/* Normalize only glyph boxes whose existing host is icon-only or already uses
   flex/grid centering. Intentionally excluded: product-card add-to-cart, toolbar
   reset, product notes, product assurance, and mobile bottom navigation. */
.sf-header-mobile-actions > a.btn > i.bi,
.sf-header-main .navbar-collapse > div > a.btn > i.bi,
button.sf-header-icon-btn > i.bi,
.sf-header-mobile-actions > button.btn > i.bi,
.sf-header-main .navbar-collapse > div > .dropdown > button.btn > i.bi,
.sf-search-popover__panel > button.btn > i.bi,
button.sf-shell-back-btn > i.bi,
.sf-product-buybox button[data-action="share-product"] > i.bi,
.sf-product-buybox button.sf-product-wish > i.bi,
.sf-toolbar-inner button[data-ui="toolbarViewGrid"] > i.bi,
.sf-sidebar-header button.sf-reset > i.bi,
.sf-sidebar-header button.sf-sidebar-close > i.bi,
.sf-search-popover__panel > i.bi,
.sf-mobile-filter-toggle > i.bi,
.sf-toolbar-inner [data-ui="toolbarStats"] > i.bi,
.sf-nav-link-button > i.bi,
.sf-sidenav > a.d-flex > i.bi,
.sf-sidenav > button.d-flex > i.bi,
.sf-sidenav .d-flex > i.bi,
.input-group > span > i.bi,
.sf-iconbtn > i.bi,
.sf-stepper__btn > i.bi,
.sf-gallery__navbtn > i.bi,
.sf-heroNav > i.bi,
.sf-toast__close > i.bi,
.sf-toast__icon > i.bi,
.sf-footer-social a > i.bi,
.sf-floating-action > i.bi,
.sf-empty__icon > i.bi,
.sf-cartThumb--ph > i.bi,
.sf-view-state__icon > i.bi,
.sf-similar-empty__icon > i.bi,
.sf-mega-menu__feature-icon > i.bi,
.sf-notif__icon > i.bi,
.sf-notif__time > i.bi,
.sf-app-badge > i.bi{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  flex: 0 0 auto;
}

/* The heart outline/fill glyphs are optically top-heavy inside the otherwise
   centered Bootstrap Icons em box. Correct only those two real wishlist hosts
   at the glyph layer; other icon shapes keep their geometric centering. */
html[lang="ar"] .sf-header-main .navbar-collapse > div > a[data-i18n-aria-label="nav.wishlist"] > i.bi::before,
html[lang="ar"] .sf-iconbtn[data-action="wishlist-toggle"] > i.bi::before{
  transform: translateY(.035em);
}

/* Arabic drawer rows combine a centered icon em box with Tajawal text whose
   visible ink sits above its line-box center. Align the leading navigation icon
   to the text ink while leaving trailing chevrons/badges and English untouched. */
html[lang="ar"] .sf-sidenav .d-flex > i.bi:first-child{
  transform: translateY(-.175em);
}

/* In Arabic app badges the icon line box is the tallest intrinsic child. Keep
   that existing block size while centering the glyph inside it. */
html[lang="ar"] .sf-app-badge > i.bi{
  min-height: 1.7em;
}

/* The mobile header and drawer brand rows are flex-centered geometrically, but
   Tajawal's visible ink is top-heavy inside its line box. Apply the correction
   only to the existing Arabic name spans at the mobile shell breakpoint. */
@media (max-width: 991.98px){
  html[lang="ar"] .sf-brand-link > span{
    transform: translateY(.15em);
  }
  html[lang="ar"] #sfNavDrawerLabel > span{
    transform: translateY(.2em);
  }
}

/* End bilingual Bootstrap Icons geometric-centering contract. */

/* Buttons: tiny lift on hover for a more "alive" UI */
.sf .btn{ transition: transform var(--sf-dur) var(--sf-ease), box-shadow var(--sf-dur) var(--sf-ease); }
.sf .btn:hover{ transform: translateY(var(--sf-shift-button-hover)); }
.sf .btn-primary{
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--bs-primary);
  --bs-btn-border-color: var(--bs-primary);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--sf-taiba-bronze-hover);
  --bs-btn-hover-border-color: var(--sf-taiba-bronze-hover);
  --bs-btn-focus-shadow-rgb: var(--sf-taiba-bronze-rgb);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--sf-taiba-bronze-active);
  --bs-btn-active-border-color: var(--sf-taiba-bronze-active);
  --bs-btn-disabled-color: #fff;
  --bs-btn-disabled-bg: rgba(var(--sf-taiba-bronze-rgb), .72);
  --bs-btn-disabled-border-color: rgba(var(--sf-taiba-bronze-rgb), .72);
}
.sf .btn-outline-primary{
  --bs-btn-color: var(--bs-primary);
  --bs-btn-border-color: var(--bs-primary);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--bs-primary);
  --bs-btn-hover-border-color: var(--bs-primary);
  --bs-btn-focus-shadow-rgb: var(--sf-taiba-bronze-rgb);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--sf-taiba-bronze-active);
  --bs-btn-active-border-color: var(--sf-taiba-bronze-active);
  --bs-btn-disabled-color: rgba(var(--sf-taiba-bronze-rgb), .72);
  --bs-btn-disabled-border-color: rgba(var(--sf-taiba-bronze-rgb), .45);
}
.sf .btn:active{ transform: translateY(0); }

/* Section headings spacing (home carousels, etc.) */
.sf-section-title{ margin: 0; font-weight: 800; letter-spacing: var(--sf-letter-soft); text-transform: uppercase; }

/* Auth pages: avoid sticky header covering forms */
body[data-sf-page="login"] .sf-header,
body[data-sf-page="signup"] .sf-header,
body[data-sf-page="forgot"] .sf-header,
body[data-sf-page="reset"] .sf-header{
  position: static;
  backdrop-filter: none;
  background: var(--sf-bg);
}

/* Product gallery thumbnails (Swiper thumbs) */
.sf-swiper-thumbs{
  --sf-thumb-size: 72px;
  --sf-thumb-opacity: .65;
}
.sf-swiper-thumbs .swiper-slide{
  width: var(--sf-thumb-size);
  height: var(--sf-thumb-size);
  opacity: var(--sf-thumb-opacity);
  cursor: pointer;
}
.sf-swiper-thumbs .swiper-slide-thumb-active{opacity:1;}
.sf-thumb-img{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:var(--sf-thumb-radius, .75rem);
  border: var(--sf-line-1) solid var(--sf-border);
}

/* === SECTION 09: FOOTER === */
.sf-footer{
  border-top: var(--sf-line-1) solid var(--sf-border);
  padding-bottom: var(--sf-safe-bottom);
  background:
    linear-gradient(180deg, var(--sf-ink-015), var(--sf-ink-01)),
    var(--sf-bg);
}
.sf-footer-top,
.sf-footer-bottom{ background: transparent; }

.sf-footer-shell{
  border: var(--sf-line-1) solid var(--sf-border);
  border-radius: calc(var(--sf-radius-lg) + var(--sf-radius-bump-lg));
  padding: 1.25rem;
  background:
    radial-gradient(var(--sf-space-760) var(--sf-space-240) at 0% 0%, var(--sf-primary-08), transparent 58%),
    radial-gradient(var(--sf-space-640) var(--sf-space-240) at 100% 20%, var(--sf-warning-08), transparent 60%),
    var(--sf-bg-78);
  box-shadow: var(--sf-shadow-card);
  backdrop-filter: blur(var(--sf-glass-blur-lg));
}
.sf-footer-brandcard,
.sf-footer-col{
  height: 100%;
}
.sf-footer-brandcard{
  border: var(--sf-line-1) solid var(--sf-ink-08);
  border-radius: calc(var(--sf-radius-lg) + var(--sf-radius-bump-md));
  padding: 1.1rem;
  background: var(--sf-bg-65);
}
.sf-footer-brandmark{
  width: var(--sf-size-64);
  height: var(--sf-size-64);
  border-radius: var(--sf-radius-16);
  display: grid;
  place-items: center;
  overflow: hidden;
  padding: .35rem;
  font-size: 1.15rem;
  color: var(--bs-primary);
  border: var(--sf-line-1) solid var(--sf-primary-18);
  background: var(--sf-primary-10);
  box-shadow: inset 0 var(--sf-line-1) 0 var(--sf-white-08);
}
.sf-footer-heading{
  font-size: .84rem;
  font-weight: 700;
  letter-spacing: var(--sf-letter-wide);
  text-transform: uppercase;
  margin-bottom: .9rem;
  color: var(--sf-muted);
}
.sf-footer-links{
  display: grid;
  gap: .7rem;
}
.sf-footer-links--double{
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .7rem .95rem;
}
.sf-footer-links a{
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  text-decoration: none;
  color: inherit;
  opacity: .88;
  transition: opacity var(--sf-dur) var(--sf-ease), transform var(--sf-dur) var(--sf-ease), color var(--sf-dur) var(--sf-ease);
}
.sf-footer-links a:hover{
  opacity: 1;
  color: var(--bs-primary);
  transform: translateX(var(--sf-radius-bump-sm));
}
.sf-footer-pills{
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
}
.sf-footer-pill{
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .48rem .72rem;
  border-radius: var(--sf-radius-pill);
  border: var(--sf-line-1) solid var(--sf-ink-08);
  background: var(--sf-ink-035);
  font-size: .84rem;
}
.sf-footer-bottom__inner{
  min-height: 2.25rem;
}
.sf-footer-meta i{ font-size: .95rem; }

@media (max-width: 991.98px){
  .sf-footer-shell{ padding: 1rem; }
}

@media (max-width: 575.98px){
  .sf-footer-brandcard{ padding: 1rem; }
  .sf-footer-links{ gap: .6rem; }
  .sf-footer-links--double{ grid-template-columns: 1fr; }
  .sf-footer-pill{ width: 100%; justify-content: center; }
  .sf-footer-bottom__inner{ text-align: center; align-items: center !important; }
}
/* === END SECTION 09 === */
/* === END SECTION 02 === */

@media (prefers-reduced-motion: reduce){
  :root{
    --sf-dur: 0ms;
    --sf-shift-header-collapse: 0px;
    --sf-shift-card-hover: 0px;
    --sf-shift-button-hover: 0px;
    --sf-shift-toast-enter: 0px;
    --sf-shift-toast-leave: 0px;
  }

  .sf-header,
  .sf-header-top,
  .sf-card,
  .sf-carousel,
  .sf-carousel .swiper-slide,
  .sf-carousel .swiper-pagination-bullet,
  .sf .btn,
  .sf-footer-links a,
  .sf-notif,
  .sf-iconbtn,
  .sf-gallery__navbtn,
  .sf-toast,
  .sf-wishlist-card-removing .sf-card{
    transition: none !important;
    animation: none !important;
  }

  .sf-header.is-scrolled .sf-header-top,
  .sf-card:hover,
  .sf .btn:hover,
  .sf-iconbtn:hover,
  .sf-gallery__navbtn:hover,
  .sf-notif:hover,
  .sf-toast,
  .sf-toast.is-visible,
  .sf-toast.is-leaving,
  .sf-wishlist-card-removing .sf-card,
  .sf-carousel .swiper-slide,
  .sf-carousel .swiper-slide-active{
    transform: none !important;
  }
}

/* === SECTION 10: NOTIFICATIONS === */
.sf-notif{
  border: var(--sf-line-1) solid var(--sf-border);
  border-radius: var(--sf-radius-20);
  background: linear-gradient(180deg, var(--sf-bg-96), var(--sf-ink-02));
  transition: border-color var(--sf-dur) var(--sf-ease), transform var(--sf-dur) var(--sf-ease), box-shadow var(--sf-dur) var(--sf-ease), opacity var(--sf-dur) var(--sf-ease), background var(--sf-dur) var(--sf-ease);
}
.sf-notif:hover{
  transform: translateY(var(--sf-shift-button-hover));
  border-color: var(--sf-primary-18);
  box-shadow: var(--sf-shadow-lift);
}
.sf-notif__inner{
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 1rem;
  padding: 1rem;
  align-items: start;
}
.sf-notif__iconwrap{
  position: relative;
  width: 2.75rem;
  min-width: 2.75rem;
}
.sf-notif .sf-notif-dot{
  position: absolute;
  top: .15rem;
  inset-inline-end: .1rem;
  width: .6rem;
  height: .6rem;
  border-radius: var(--sf-radius-pill);
  background: var(--bs-primary);
  display: inline-block;
  box-shadow: 0 0 0 .2rem var(--sf-primary-12);
}
.sf-notif__icon{
  width: 2.5rem;
  height: 2.5rem;
  border-radius: var(--sf-radius-16);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--sf-primary-10);
  color: var(--bs-primary);
  border: var(--sf-line-1) solid var(--sf-primary-14);
}
.sf-notif__head{
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: .8rem;
}
.sf-notif__content,
.sf-notif__titlewrap{ min-width: 0; }
.sf-notif__title{ font-weight: 700; line-height: 1.35; }
.sf-notif__meta{ display: flex; flex-wrap: wrap; gap: .45rem; margin-top: .45rem; }
.sf-notif-type{
  font-weight: 600;
  background: var(--sf-ink-04);
}
.sf-notif__state{
  display: inline-flex;
  align-items: center;
  padding: .28rem .58rem;
  border-radius: var(--sf-radius-pill);
  font-size: var(--sf-type-caption);
  font-weight: 700;
  border: var(--sf-line-1) solid var(--sf-ink-08);
}
.sf-notif__state.is-unread{
  color: var(--bs-primary);
  background: var(--sf-primary-10);
  border-color: var(--sf-primary-16);
}
.sf-notif__state.is-read{
  color: var(--sf-muted);
  background: var(--sf-ink-04);
}
.sf-notif__body{
  margin-top: .7rem;
  color: var(--sf-muted);
  overflow-wrap: anywhere;
}
.sf-notif__time{
  margin-top: .8rem;
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  color: var(--sf-muted);
  font-size: .88rem;
}
.sf-notif.is-unread{
  border-color: var(--sf-primary-22);
  background: linear-gradient(180deg, var(--sf-primary-05), var(--sf-bg-98));
}
.sf-notif.is-unread .sf-notif-dot{ opacity: .95; }
.sf-notif.is-read{
  opacity: .92;
}
.sf-notif.is-read .sf-notif-dot{ opacity: .25; }
@media (max-width: 767.98px){
  .sf-notif__inner{ grid-template-columns: 1fr; }
  .sf-notif__iconwrap{ width: auto; min-width: 0; }
  .sf-notif__head{ flex-direction: column; }
  .sf-notif__actions{ width: 100%; }
  .sf-notif__actions .btn{ width: 100%; }
}
/* === END SECTION 10 === */




/* --- Batch 02 / Plan Step 04: high-priority customer journey polish --- */
.sf-pagehead .btn,
.sf-loadmore .btn,
.sf-store__actions .btn{
  border-radius: var(--sf-radius-pill);
}
.sf-pagehead .btn-outline-dark,
.sf-pagehead .btn-outline-secondary,
.sf-loadmore .btn-outline-dark,
.sf-store__actions .btn-outline-dark{
  background: var(--sf-bg-75);
  border-color: var(--sf-body-10);
  backdrop-filter: blur(var(--sf-glass-blur-sm));
  -webkit-backdrop-filter: blur(var(--sf-glass-blur-sm));
}
.sf-pagehead .btn:hover,
.sf-loadmore .btn:hover,
.sf-store__actions .btn:hover{
  box-shadow: var(--sf-shadow-card);
}
.sf-sidebar .sf-card,
.sf-content > .sf-card,
.sf-summary-card,
.sf-product-buybox,
body[data-sf-page="login"] .sf-card,
body[data-sf-page="signup"] .sf-card,
body[data-sf-page="forgot"] .sf-card,
body[data-sf-page="reset"] .sf-card{
  border-radius: var(--sf-radius-20);
  background:
    linear-gradient(180deg, var(--sf-bg-98), var(--sf-ink-01)),
    radial-gradient(var(--sf-space-640) var(--sf-space-280) at 100% 0%, var(--sf-primary-06), transparent 62%);
}
.sf-sidebar .form-control,
.sf-sidebar .form-select,
body[data-sf-page="login"] .form-control,
body[data-sf-page="signup"] .form-control,
body[data-sf-page="forgot"] .form-control,
body[data-sf-page="reset"] .form-control{
  min-height: var(--sf-size-46);
  border-radius: var(--sf-radius-14);
}
.sf-loadmore{
  padding-top: .25rem;
}
.sf-loadmore .btn{
  min-width: min(100%, var(--sf-space-240));
}
.sf-store__meta{
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
}
.sf-store__meta .small{
  min-height: 0;
}
.sf-product .sf-card__body{
  display: flex;
  flex-direction: column;
  padding-bottom: 0;
}
.sf-product .sf-price{
  margin-top: .55rem;
  margin-bottom: .85rem;
  color: inherit;
}
.sf-product .sf-price > div{
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: .35rem;
}
.sf-product .sf-card__meta{
  margin: auto -1rem 0;
  display: flex;
  flex-direction: row-reverse;
  align-items: stretch;
  gap: 0;
  overflow: hidden;
  border-top: var(--sf-line-1) solid var(--sf-primary-12);
  background: linear-gradient(90deg, var(--sf-primary-06), var(--sf-warning-12));
  color: inherit;
}
.sf-product .sf-card__meta .sf-iconbtn{
  flex: 0 0 var(--sf-size-46);
  width: var(--sf-size-46);
  height: var(--sf-size-46);
  border: 0;
  border-radius: 0;
  background: transparent;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.sf-product .sf-card__meta .btn[data-action="add-to-cart"]{
  flex: 1 1 auto;
  min-width: 0;
  min-height: var(--sf-size-46);
  border: 0;
  border-radius: 0;
  box-shadow: none;
}
.sf-product .sf-card__media::after{
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 35%;
  background: linear-gradient(180deg, transparent, var(--sf-body-05));
  pointer-events: none;
}
.sf-store__actions .btn{
  flex: 1 1 var(--sf-space-180);
}
.sf-inline-status{
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  margin-top: .75rem;
  padding: .8rem .95rem;
  border: var(--sf-line-1) solid var(--sf-border);
  border-radius: var(--sf-radius-16);
  background: var(--sf-ink-015);
  color: inherit;
  font-size: .92rem;
  line-height: 1.45;
  letter-spacing: var(--sf-letter-soft);
}
.sf-inline-status::before{
  content: "";
  flex: 0 0 auto;
  width: .7rem;
  height: .7rem;
  margin-top: .32rem;
  border-radius: var(--sf-radius-pill);
  background: var(--sf-body-25);
  box-shadow: 0 0 0 .3rem var(--sf-ink-04);
}
.sf-inline-status--success{
  border-color: var(--sf-success-22);
  background: var(--sf-success-06);
}
.sf-inline-status--success::before{
  background: var(--sf-success-80);
  box-shadow: 0 0 0 .3rem var(--sf-success-12);
}
.sf-inline-status--danger{
  border-color: var(--sf-danger-22);
  background: var(--sf-danger-12);
}
.sf-inline-status--danger::before{
  background: var(--bs-danger);
  box-shadow: 0 0 0 .3rem var(--sf-danger-12);
}
.sf-inline-status--warning{
  border-color: var(--sf-warning-24);
  background: var(--sf-warning-12);
}
.sf-inline-status--warning::before{
  background: var(--sf-warning-solid);
  box-shadow: 0 0 0 .3rem var(--sf-warning-12);
}
.sf-view-state{
  padding: 1.4rem;
  border-radius: var(--sf-radius-22);
  background:
    linear-gradient(180deg, var(--sf-bg-98), var(--sf-ink-01)),
    radial-gradient(var(--sf-space-640) var(--sf-space-300) at 50% 0%, var(--sf-primary-05), transparent 68%);
}
.sf-view-state__icon{
  width: var(--sf-size-56);
  height: var(--sf-size-56);
  margin: 0 auto .9rem;
  border-radius: var(--sf-radius-18);
  display: grid;
  place-items: center;
  border: var(--sf-line-1) solid var(--sf-border);
  background: var(--sf-ink-03);
  color: var(--bs-primary);
}
.sf-view-state__icon i{
  font-size: 1.15rem;
}
.sf-view-state--error .sf-view-state__icon{
  color: var(--bs-danger);
  background: var(--sf-danger-12);
  border-color: var(--sf-danger-22);
}
.sf-view-state__title{
  font-weight: 700;
  letter-spacing: var(--sf-letter-tight);
}
.sf-view-state__text{
  margin-top: .35rem;
  color: var(--sf-muted);
  font-size: .94rem;
  line-height: 1.5;
}
.sf-view-state__actions{
  margin-top: .95rem;
  display: flex;
  justify-content: center;
  gap: .65rem;
  flex-wrap: wrap;
}
@media (max-width: 575.98px){
  .sf-pagehead .btn,
  .sf-store__actions .btn{
    width: 100%;
  }
  .sf-inline-status{
    padding: .75rem .85rem;
  }
  .sf-view-state{
    padding: 1.15rem;
  }
}
/* --- End Batch 02 / Plan Step 04 block --- */

/* === SECTION 11: PROFILE + PREMIUM POLISH === */
.sf-profile-card{ border-radius: var(--sf-radius-24); }
.sf-profile-card--aside{ position: relative; overflow: hidden; }
.sf-profile-stack{ display: grid; gap: 1rem; }
.sf-profile-summary{
  display: grid;
  grid-template-columns: var(--sf-size-72) 1fr;
  gap: 1rem;
  align-items: center;
  padding: 1rem;
  border: var(--sf-line-1) solid var(--sf-ink-08);
  border-radius: var(--sf-radius-20);
  background: linear-gradient(135deg, var(--sf-primary-08), var(--sf-ink-02));
}
.sf-profile-summary__avatarwrap{
  width: var(--sf-size-72);
  height: var(--sf-size-72);
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--sf-bg-94);
  border: var(--sf-line-1) solid var(--sf-ink-08);
  overflow: hidden;
}
.sf-profile-summary__avatar{
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  border-radius: inherit;
  box-shadow: var(--sf-shadow-soft);
}
.sf-profile-summary__name{ font-weight: 700; font-size: 1.02rem; }
.sf-profile-summary__meta{ color: var(--sf-muted); font-size: .92rem; margin-top: .2rem; }
.sf-profile-pills{ display: flex; flex-wrap: wrap; gap: .5rem; }
.sf-profile-pill{
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  padding: .4rem .7rem;
  border-radius: var(--sf-radius-pill);
  background: var(--sf-bg-80);
  border: var(--sf-line-1) solid var(--sf-ink-08);
  font-size: .82rem;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sf-profile-uploadbox{
  padding: .9rem;
  border-radius: var(--sf-radius-18);
  border: var(--sf-line-1) dashed var(--sf-body-12);
  background: var(--sf-ink-02);
}
.sf-profile-divider{ opacity: .65; }
.sf-profile-sectiontitle{ letter-spacing: .01em; }
.sf-profile-form .form-control,
.sf-profile-form .form-select{ min-height: var(--sf-size-46); }
.sf-profile-formsection{ padding-top: .15rem; }
@media (max-width: 767.98px){
  .sf-profile-summary{ grid-template-columns: 1fr; text-align: center; justify-items: center; }
  .sf-profile-pill{ max-width: 100%; }
}
/* === END SECTION 11 === */

/* === SECTION 12: COMMERCE POLISH === */

/* View-all links should look like intentional CTAs */
.sf-viewall{ text-decoration: none !important; }

/* Product / category title truncation (single line) */
.sf-card__title{
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Category card: center the title */
.sf-card.sf-cat .sf-card__body{ text-align: center; }

/* --- Product card premium UI --- */
.sf-card__actions{
  position: absolute;
  top: .6rem;
  right: .6rem;
  display: flex;
  gap: .4rem;
  z-index: 3;
}

.sf-iconbtn{
  width: var(--sf-size-34);
  height: var(--sf-size-34);
  border-radius: var(--sf-radius-pill);
  border: var(--sf-line-1) solid var(--sf-body-12);
  background: var(--sf-bg-72);
  backdrop-filter: blur(var(--sf-glass-blur-md));
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: inherit;
  transition: transform var(--sf-dur) var(--sf-ease), background var(--sf-dur) var(--sf-ease), border-color var(--sf-dur) var(--sf-ease);
}
.sf-iconbtn:hover{ transform: translateY(var(--sf-shift-button-hover)); background: var(--sf-bg-86); border-color: var(--sf-primary-22); }
.sf-iconbtn:active{ transform: translateY(0); }

.sf-card__badges{
  position: absolute;
  top: .65rem;
  left: .65rem;
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  z-index: 3;
  max-width: calc(100% - var(--sf-size-96));
}

.sf-badge{
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .22rem .5rem;
  border-radius: var(--sf-radius-pill);
  font-size: var(--sf-type-caption);
  font-weight: 600;
  letter-spacing: var(--sf-letter-tight);
  border: var(--sf-line-1) solid var(--sf-body-12);
  background: var(--sf-bg-72);
  backdrop-filter: blur(var(--sf-glass-blur-md));
}
.sf-badge--oos{ background: var(--sf-danger-12); border-color: var(--sf-danger-22); }
.sf-badge--sale{ background: var(--sf-warning-14); border-color: var(--sf-warning-24); }
.sf-badge--feat{ background: var(--sf-primary-12); border-color: var(--sf-primary-22); }
.sf-badge--new{ background: var(--sf-success-12); border-color: var(--sf-success-22); }

.sf-price__sale{ font-weight: 800; letter-spacing: var(--sf-letter-tight); }
.sf-price__reg{ color: var(--sf-muted); text-decoration: line-through; font-size: .9em; margin-inline-start: 0; }

/* Make disabled CTA feel intentional */
.sf-product .btn[disabled]{ opacity: .75; }

/* Store select cards: compact, premium layout */
.sf-store__head{
  display: grid;
  grid-template-columns: var(--sf-size-56) 1fr;
  gap: .85rem;
  align-items: center;
}
.sf-store__logo{
  width: var(--sf-size-56);
  height: var(--sf-size-56);
  border-radius: var(--sf-radius-14);
  border: var(--sf-line-1) solid var(--sf-border);
  background: var(--sf-ink-03);
  object-fit: contain;
}

/* Cart (premium) */
.sf-cartList{ display: grid; gap: .75rem; }
.sf-cartItem{
  border: var(--sf-line-1) solid var(--sf-border);
  border-radius: var(--sf-radius-18);
  padding: .9rem;
  background: var(--sf-ink-02);
}
.sf-cartItem.is-busy{ opacity: .7; pointer-events: none; }
.sf-cartItem__main{
  display: grid;
  grid-template-columns: var(--sf-size-72) 1fr auto;
  gap: .9rem;
  align-items: center;
}
.sf-cartItem__media{ width: var(--sf-size-72); }
.sf-cartThumb{
  width: var(--sf-size-72);
  height: var(--sf-size-72);
  border-radius: var(--sf-radius-16);
  border: var(--sf-line-1) solid var(--sf-border);
  background: var(--sf-ink-03);
  object-fit: cover;
}
.sf-cartThumb--ph{
  display: grid;
  place-items: center;
  color: var(--sf-muted);
}
.sf-cartItem__title{ font-weight: 650; }
.sf-cartItem__meta{ font-size: .9rem; display: flex; gap: .45rem; align-items: center; }
.sf-cartItem__total{ font-weight: 700; }
.sf-cartItem__sub{ font-size: .85rem; }
.sf-cartItem__controls{
  margin-top: .75rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
}

.sf-stepper{
  display: inline-flex;
  align-items: center;
  border: var(--sf-line-1) solid var(--sf-border);
  border-radius: var(--sf-radius-14);
  overflow: hidden;
  background: var(--sf-ink-02);
}
.sf-stepper__btn{
  width: var(--sf-size-40);
  height: var(--sf-size-40);
  border: 0;
  background: transparent;
  display: grid;
  place-items: center;
}
.sf-stepper__btn:hover{ background: var(--sf-body-05); }
.sf-stepper__input{
  width: var(--sf-size-54);
  height: var(--sf-size-40);
  border: 0;
  background: transparent;
  text-align: center;
  font-weight: 650;
  outline: none;
}
.sf-stepper__input::-webkit-outer-spin-button,
.sf-stepper__input::-webkit-inner-spin-button{ -webkit-appearance: none; margin: 0; }
.sf-stepper__input{ -moz-appearance: textfield; }

.sf-empty{
  border: var(--sf-line-1) dashed var(--sf-border);
  border-radius: var(--sf-radius-20);
  padding: 2rem;
  text-align: center;
  background: var(--sf-ink-015);
}
.sf-empty__icon{
  width: var(--sf-size-56);
  height: var(--sf-size-56);
  border-radius: var(--sf-radius-16);
  border: var(--sf-line-1) solid var(--sf-border);
  margin: 0 auto .85rem;
  display: grid;
  place-items: center;
  color: var(--sf-muted);
  background: var(--sf-ink-03);
}

@media (max-width: 575.98px){
  .sf-cartItem__main{ grid-template-columns: var(--sf-size-64) 1fr; grid-auto-rows: auto; }
  .sf-cartItem__media{ width: var(--sf-size-64); }
  .sf-cartThumb{ width: var(--sf-size-64); height: var(--sf-size-64); border-radius: var(--sf-radius-14); }
  .sf-cartItem__main > .text-end{ grid-column: 2 / 3; justify-self: start; text-align: start !important; }
}

/* Toolbar component shadow is defined in SECTION 05. */

/* Mobile nav drawer list aesthetics */
.offcanvas .sf-sidenav .list-group-item{ border-radius: var(--sf-radius-12); }
.offcanvas .sf-sidenav .list-group-item + .list-group-item{ margin-top: .5rem; }

/* Checkout polish (v130) */
.sf-steps{
  display:flex;
  align-items:center;
  gap:1rem;
  flex-wrap:wrap;
}
.sf-step{
  display:flex;
  align-items:center;
  gap:.65rem;
  padding:.45rem .75rem;
  border:var(--sf-line-1) solid var(--sf-border);
  border-radius:var(--sf-radius-pill);
  background: var(--sf-ink-015);
}
.sf-step__dot{
  width:var(--sf-size-10);
  height:var(--sf-size-10);
  border-radius:var(--sf-radius-pill);
  background: var(--sf-body-25);
}
.sf-step.is-active{
  background: var(--sf-primary-10);
  border-color: var(--sf-primary-25);
}
.sf-step.is-active .sf-step__dot{ background: var(--bs-primary); }
.sf-step__label{ font-size:.9rem; font-weight:650; }

.sf-checkout-head .sf-steps{ margin-bottom:.25rem; }
.sf-form__footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;
  flex-wrap:wrap;
}
.sf-summary-items > *{
  padding:.65rem .75rem;
  border:var(--sf-line-1) solid var(--sf-border);
  border-radius:var(--sf-radius-16);
  background: var(--sf-ink-012);
  min-width:0;
  overflow:hidden;
}
.sf-summary-item,
.sf-summary-item__main,
.sf-summary-item__head{
  min-width:0;
}
.sf-summary-item__title{
  min-width:0;
  flex:1 1 auto;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.sf-summary-item__total{
  max-width:42%;
  overflow-wrap:anywhere;
}

@media (min-width: 992px){
  .sf-summary-card{ position: sticky; top: var(--sf-size-96); }
}

@media (max-width: 575.98px){
  .sf-form__footer{ align-items:stretch; }
  .sf-form__footer > *{ width:100%; }
  .sf-summary-item{
    flex-direction:column;
    align-items:stretch !important;
  }
  .sf-summary-item__head{
    flex-wrap:wrap;
  }
  .sf-summary-item__title{
    white-space:normal;
    overflow-wrap:anywhere;
  }
  .sf-summary-item__total{
    max-width:none;
    text-align:start !important;
  }
}

/* === END SECTION 12 === */

/* === SECTION 13: ORDERS + ORDER DETAILS === */
.sf-orders-list{
  display:grid;
  gap: .85rem;
}

.sf-ordercard{
  border:var(--sf-line-1) solid var(--sf-border);
  border-radius: var(--sf-radius-22);
  background: var(--sf-bg-75);
  box-shadow: var(--sf-shadow-ordercard);
  padding: 1rem 1rem;
  backdrop-filter: blur(var(--sf-glass-blur-md));
}

.sf-ordercard__top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:.75rem;
}

.sf-ordercard__num{
  font-weight: 700;
  color: inherit;
  text-decoration: none;
}
.sf-ordercard__num:hover{ text-decoration: underline; }

.sf-ordercard__mid{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap: 1rem;
  margin-top: .65rem;
}

.sf-ordercard__total{ text-align:end; }

.sf-ordercard__bot{
  display:flex;
  justify-content:flex-end;
  margin-top: .85rem;
}

/* Light skeleton */
.sf-skel{
  position: relative;
  overflow:hidden;
}
.sf-skel__line{
  height: var(--sf-size-12);
  border-radius: var(--sf-radius-pill);
  background: var(--sf-ink-08);
}
.sf-skel__pill{
  height: var(--sf-size-22);
  width: var(--sf-size-92);
  border-radius: var(--sf-radius-pill);
  background: var(--sf-ink-08);
}
.sf-skel__btn{
  height: var(--sf-size-34);
  width: var(--sf-size-92);
  border-radius: var(--sf-radius-12);
  background: var(--sf-ink-08);
}
.sf-skel .sf-skel__line--30{ width:30%; }
.sf-skel .sf-skel__line--40{ width:40%; }
.sf-skel .sf-skel__line--60{ width:60%; }

/* Timeline */
.sf-timeline{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap:.65rem;
}
.sf-timeline__item{
  position:relative;
  padding:.75rem .75rem;
  border:var(--sf-line-1) solid var(--sf-border);
  border-radius: var(--sf-radius-18);
  background: var(--sf-ink-012);
  display:flex;
  gap:.55rem;
  align-items:center;
}
.sf-timeline__dot{
  width:var(--sf-size-10);
  height:var(--sf-size-10);
  border-radius:var(--sf-radius-pill);
  background: var(--sf-body-25);
  flex: 0 0 auto;
}
.sf-timeline__label{
  font-size: .92rem;
  color: var(--sf-body-80);
}
.sf-timeline__item.is-done{
  background: var(--sf-success-06);
  border-color: var(--sf-success-25);
}
.sf-timeline__item.is-done .sf-timeline__dot{ background: var(--sf-success-80); }

.sf-timeline__item.is-active{
  background: var(--sf-primary-06);
  border-color: var(--sf-primary-25);
}
.sf-timeline__item.is-active .sf-timeline__dot{ background: var(--sf-primary-85); }

@media (max-width: 575.98px){
  .sf-timeline{
    grid-template-columns: 1fr;
  }
}

/* Order line items */
.sf-lineitem{
  display:flex;
  gap: .9rem;
  align-items:center;
  padding: .85rem .75rem;
  border:var(--sf-line-1) solid var(--sf-border);
  border-radius: var(--sf-radius-18);
  background: var(--sf-ink-012);
  margin-bottom: .65rem;
}

.sf-lineitem__media{ flex: 0 0 auto; }
.sf-lineitem__img{
  width: var(--sf-size-64);
  height: var(--sf-size-64);
  border-radius: var(--sf-radius-16);
  object-fit: cover;
  background: var(--sf-ink-04);
}

.sf-lineitem__body{ flex: 1 1 auto; min-width: 0; }
.sf-lineitem__title{
  font-weight: 650;
  display:-webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow:hidden;
}
.sf-lineitem__meta{ display:flex; gap:.6rem; flex-wrap:wrap; margin-top:.35rem; align-items:center; }

.sf-lineitem__total{ text-align:end; flex: 0 0 auto; }

.sf-pill{
  display:inline-flex;
  align-items:center;
  padding:.15rem .55rem;
  border-radius: var(--sf-radius-pill);
  border:var(--sf-line-1) solid var(--sf-border);
  background: var(--sf-ink-012);
  font-size: .78rem;
}

@media (max-width: 575.98px){
  .sf-lineitem{ align-items:flex-start; }
  .sf-lineitem__img{ width: var(--sf-size-56); height:var(--sf-size-56); border-radius:var(--sf-radius-14); }
  .sf-lineitem__total{ text-align:start; }
}

/* === SECTION 14: PRODUCT DETAILS === */
.sf-breadcrumb{
  display:flex;
  align-items:center;
  gap:.45rem;
  flex-wrap:wrap;
}
.sf-breadcrumb a{ color:inherit; text-decoration:none; }
.sf-breadcrumb a:hover{ text-decoration:underline; }

.sf-product-page .sf-card{
  border-radius: var(--sf-radius-26);
}

.sf-product-stage{
  background:
    radial-gradient(circle at top left, var(--sf-primary-08), transparent 38%),
    linear-gradient(180deg, var(--sf-ink-02), var(--sf-body-00));
}

.sf-gallery__stage{
  position:relative;
  padding: clamp(.35rem, 1vw, .5rem);
  border-radius: var(--sf-radius-24);
  background: var(--sf-bg-78);
  border: var(--sf-line-1) solid var(--sf-ink-06);
}

.sf-gallery__link{
  display:block;
  border-radius: var(--sf-radius-22);
  overflow:hidden;
  background: linear-gradient(180deg, var(--sf-ink-03), var(--sf-ink-01));
}

.sf-gallery__img{
  width:100%;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  padding: clamp(1.25rem, 3vw, 2.4rem);
}

.sf-gallery__nav{
  position:absolute;
  inset-inline: .9rem;
  top: 50%;
  transform: translateY(-50%);
  display:flex;
  justify-content:space-between;
  pointer-events:none;
  z-index:4;
}
.sf-gallery__navbtn{
  pointer-events:auto;
  width:var(--sf-size-42);
  height:var(--sf-size-42);
  border-radius:var(--sf-radius-pill);
  border:var(--sf-line-1) solid var(--sf-body-12);
  background: var(--sf-bg-82);
  backdrop-filter: blur(var(--sf-glass-blur-md));
  display:grid;
  place-items:center;
  box-shadow: var(--sf-shadow-soft);
}
.sf-gallery__navbtn:hover{ transform: translateY(var(--sf-shift-button-hover)); }
.sf-gallery__count{
  position:absolute;
  inset-inline-end: 1rem;
  bottom: 1rem;
  padding: .35rem .65rem;
  border-radius: var(--sf-radius-pill);
  font-size: .8rem;
  font-weight: 600;
  background: var(--sf-bg-84);
  border: var(--sf-line-1) solid var(--sf-ink-08);
}

.sf-gallery__thumbrow{
  display:grid;
  grid-template-columns: repeat(auto-fit, minmax(var(--sf-size-72), 1fr));
  gap:.75rem;
}
.sf-gallery__thumbbtn{
  border:var(--sf-line-1) solid transparent;
  background: transparent;
  border-radius: var(--sf-radius-18);
  padding:.2rem;
  width:100%;
}
.sf-gallery__thumbbtn.is-active,
.sf-gallery__thumbbtn:hover{
  border-color: var(--sf-primary-26);
  background: var(--sf-primary-05);
}

.sf-swiper-thumbs{
  padding-bottom: .1rem;
  --sf-thumb-size: var(--sf-size-88);
  --sf-thumb-opacity: .72;
  --sf-thumb-radius: 16px;
}

.sf-product-buybox{
  background:
    radial-gradient(circle at top right, var(--sf-primary-08), transparent 34%),
    linear-gradient(180deg, var(--sf-ink-03), var(--sf-ink-015));
}
.sf-product-title{
  letter-spacing: -.02em;
  line-height: 1.15;
}
.sf-product-meta{
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
}
.sf-product-page .sf-chip{
  --sf-chip-min-h: 34px;
  --sf-chip-py: .35rem;
  --sf-chip-px: .75rem;
  --sf-chip-font-size: .84rem;
  --sf-chip-font-weight: 600;
  --sf-chip-border-color: var(--sf-body-10);
}
.sf-chip--subtle{ background: var(--sf-ink-035); }
.sf-chip--success{ background: var(--sf-success-12); border-color: var(--sf-success-22); }
.sf-chip--danger{ background: var(--sf-danger-12); border-color: var(--sf-danger-22); }

.sf-pricebox{
  padding: 1rem 1.1rem;
  border-radius: var(--sf-radius-22);
  border:var(--sf-line-1) solid var(--sf-ink-08);
  background: var(--sf-bg-72);
}
.sf-pricebox__value{
  font-size: clamp(1.75rem, 3vw, 2.35rem);
  line-height:1.05;
  font-weight: 750;
  letter-spacing: -.03em;
}


.sf-product-qtyblock{
  padding: 1rem 1.1rem;
  border-radius: var(--sf-radius-22);
  border:var(--sf-line-1) solid var(--sf-ink-08);
  background: var(--sf-bg-72);
}
.sf-product-qtyrow{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
}
.sf-stepper--product{
  width: min(var(--sf-space-280), 100%);
  flex: 1 1 var(--sf-space-280);
  margin-inline-start: auto;
  border-radius: var(--sf-radius-18);
  border:var(--sf-line-1) solid var(--sf-body-09);
  background: var(--sf-bg-70);
}
.sf-stepper--product .sf-stepper__btn{
  width: var(--sf-size-56);
  flex: 0 0 var(--sf-size-56);
}
.sf-stepper--product .sf-stepper__input{
  flex: 1 1 auto;
}
.sf-stepper--product .sf-stepper__btn,
.sf-stepper--product .sf-stepper__input{ min-height: var(--sf-size-50); }

.sf-product-assurance{
  display:grid;
  gap:.85rem;
}
.sf-product-assurance__item{
  display:grid;
  grid-template-columns: var(--sf-size-42) 1fr;
  gap:.8rem;
  align-items:start;
  padding:.9rem 1rem;
  border-radius: var(--sf-radius-18);
  background: var(--sf-ink-03);
  border:var(--sf-line-1) solid var(--sf-ink-06);
}
.sf-product-assurance__item i{
  width:var(--sf-size-42);
  height:var(--sf-size-42);
  border-radius: var(--sf-radius-14);
  display:grid;
  place-items:center;
  background: var(--sf-primary-10);
}

.sf-product-detailcard{
  background: var(--sf-bg-78);
}
.sf-product-prose{
  line-height: 1.85;
}
.sf-product-prose > :last-child{ margin-bottom:0; }
.sf-product-notes{ display:grid; gap:.85rem; }
.sf-product-notes li{
  display:grid;
  grid-template-columns: var(--sf-size-20) 1fr;
  gap:.75rem;
  align-items:start;
}
.sf-product-notes i{ color: var(--bs-primary); margin-top: .1rem; }

.sf-similar-empty{
  border-style: dashed;
  background: linear-gradient(180deg, var(--sf-ink-02), var(--sf-ink-01));
}
.sf-similar-empty__icon{
  width: var(--sf-size-64);
  height: var(--sf-size-64);
  margin: 0 auto 1rem;
  border-radius: var(--sf-radius-20);
  display:grid;
  place-items:center;
  font-size: 1.5rem;
  color: var(--bs-primary);
  background: var(--sf-primary-10);
}

body[data-sf-page="product"] .swiper-pagination-bullet{
  width: var(--sf-size-9);
  height: var(--sf-size-9);
  background: var(--sf-body-26);
  opacity: 1;
}
body[data-sf-page="product"] .swiper-pagination-bullet-active{
  width: var(--sf-size-22);
  border-radius: var(--sf-radius-pill);
  background: var(--sf-primary-95);
}

@media (max-width: 991.98px){
  .sf-product-buybox{ position: static !important; top: auto !important; }
}

@media (max-width: 767.98px){
  .sf-pagehead--product .btn{ width: 100%; }
  .sf-gallery__img{ aspect-ratio: 4 / 3; padding: 1rem; }
  .sf-gallery__nav{ inset-inline: .55rem; }
  .sf-gallery__navbtn{ width: var(--sf-size-38); height: var(--sf-size-38); }
  .sf-swiper-thumbs{ --sf-thumb-size: var(--sf-size-72); }
  .sf-product-assurance__item{ grid-template-columns: var(--sf-size-36) 1fr; padding: .8rem .85rem; }
  .sf-product-qtyrow{ align-items: stretch; flex-direction: column; }
  .sf-stepper--product{ width:100%; flex-basis:auto; margin-inline-start:0; }
}


/* === SECTION 15: QA HELPERS === */
.sf-is-hidden{ display:none !important; }
.sf-avatar-72{ width:var(--sf-size-72); height:var(--sf-size-72); object-fit:cover; }

/* --- Toast system --- */
.sf-toast-stack{
  position: fixed;
  top: calc(1rem + var(--sf-safe-top));
  right: calc(1rem + var(--sf-safe-right));
  display: flex;
  flex-direction: column;
  gap: .75rem;
  width: min(92vw, var(--sf-space-360));
  z-index: 1085;
  pointer-events: none;
}
.sf-toast{
  display: grid;
  grid-template-columns: auto 1fr auto;
  gap: .75rem;
  align-items: start;
  padding: .95rem 1rem;
  border-radius: 1rem;
  border: var(--sf-line-1) solid var(--sf-ink-08);
  background: var(--sf-bg-97);
  box-shadow: var(--sf-shadow-toast);
  backdrop-filter: blur(var(--sf-glass-blur-md));
  transform: translateY(var(--sf-shift-toast-enter)) scale(.98);
  opacity: 0;
  transition: opacity .18s ease, transform .18s ease;
  pointer-events: auto;
}
.sf-toast.is-visible{
  opacity: 1;
  transform: translateY(0) scale(1);
}
.sf-toast.is-leaving{
  opacity: 0;
  transform: translateY(var(--sf-shift-toast-leave)) scale(.98);
}
.sf-toast__icon{
  width: 2.1rem;
  height: 2.1rem;
  border-radius: var(--sf-radius-pill);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  background: var(--sf-ink-06);
}
.sf-toast__body{ min-width: 0; }
.sf-toast__title{
  font-size: .9rem;
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: .18rem;
}
.sf-toast__message{
  color: var(--sf-body-74);
  font-size: .875rem;
  line-height: 1.45;
}
.sf-toast__close{
  border: 0;
  background: transparent;
  color: var(--sf-body-55);
  width: 1.9rem;
  height: 1.9rem;
  border-radius: var(--sf-radius-pill);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.sf-toast__close:hover{ background: var(--sf-ink-06); }
.sf-toast--success{ border-color: var(--sf-success-18); }
.sf-toast--success .sf-toast__icon{ color: var(--sf-success-solid); background: var(--sf-success-12); }
.sf-toast--warning{ border-color: var(--sf-warning-24); }
.sf-toast--warning .sf-toast__icon{ color: var(--sf-warning-solid); background: var(--sf-warning-18); }
.sf-toast--danger{ border-color: var(--sf-danger-18); }
.sf-toast--danger .sf-toast__icon{ color: var(--sf-danger-solid); background: var(--sf-danger-12); }
.sf-toast--info{ border-color: var(--sf-primary-18); }
.sf-toast--info .sf-toast__icon{ color: var(--sf-primary-solid); background: var(--sf-primary-12); }

@media (max-width: 575.98px){
  .sf-toast-stack{
    left: .75rem;
    right: .75rem;
    width: auto;
  }
}


.sf-wishlist-card-removing{
  pointer-events: none;
}
.sf-wishlist-card-removing .sf-card{
  opacity: 0;
  transform: translateY(var(--sf-shift-toast-leave)) scale(.985);
  transition: opacity .18s ease, transform .18s ease;
}


/* --- Batch 02 / Plan Step 07: storefront density / hierarchy polish extension --- */
html[lang="ar"]{
  --sf-font-body: var(--sf-font-arabic);
  --sf-letter-tight: 0;
  --sf-letter-soft: 0;
  --sf-letter-wide: 0;
  --sf-leading-body: var(--sf-leading-arabic);
}
body.sf{
  font-family: var(--sf-font-body);
  font-synthesis: none;
  line-height: var(--sf-leading-body);
  min-height: 100svh;
  display: flex;
  flex-direction: column;
}
.sf button,
.sf input,
.sf select,
.sf textarea{
  font-family: inherit;
}
.sf-main{ flex: 1 0 auto; }
.sf-footer{ margin-top: auto; }

/* Arabic joining-script protection: Latin tracking and extra-tight leading must not split or clip glyphs. */
html[lang="ar"] #sfNavDrawer .sf-drawer-sectionTitle,
html[lang="ar"] .sf-profile-sectiontitle,
html[lang="ar"] .sf-product-title,
html[lang="ar"] .sf-pricebox__value,
html[lang="ar"] .sf-eyebrow,
html[lang="ar"] .sf-brand-card__mark,
html[lang="ar"] .sf-brand-directory-card__token,
html[lang="ar"] .sf-bottom-nav__item,
html[lang="ar"] [data-sf-mobile-footer-payment="compact"] .sf-footer-heading{
  letter-spacing: normal;
}
html[lang="ar"] .sf-heroSlide__title,
html[lang="ar"] .sf-product-title,
html[lang="ar"] .sf-pageband__title,
html[lang="ar"] .sf-merch-strip__fallback strong,
html[lang="ar"] .sf-merch-strip__card strong,
html[lang="ar"] .sf-brand-directory-card__token{
  line-height: var(--sf-leading-arabic-tight);
}

.sf-pageband{
  border: var(--sf-line-1) solid var(--sf-border);
  border-radius: calc(var(--sf-radius-lg) + var(--sf-radius-bump-md));
  padding: 1.1rem 1.15rem;
  background:
    linear-gradient(180deg, var(--sf-bg-98), var(--sf-ink-01)),
    radial-gradient(var(--sf-space-640) var(--sf-space-260) at 100% 0%, var(--sf-primary-08), transparent 62%);
  box-shadow: var(--sf-shadow-card);
}
body[data-sf-page="store-home"] .sf-pageband.sf-pageband--home{
  border-color: var(--sf-border);
  background-color: var(--sf-bg-98);
  background-image: none;
  box-shadow: var(--sf-shadow-card);
}
.sf-pageband__layout{
  display: grid;
  gap: 1rem;
  align-items: start;
}
.sf-pageband__eyebrow{
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: var(--sf-letter-wide);
  text-transform: uppercase;
  color: var(--sf-muted);
  margin-bottom: .4rem;
}
.sf-pageband__title{
  font-size: clamp(1.05rem, 1rem + .35vw, 1.35rem);
  font-weight: 700;
  line-height: 1.22;
  letter-spacing: var(--sf-letter-tight);
}
.sf-pageband__copy{
  margin-top: .35rem;
  max-width: 64ch;
}
.sf-pageband__actions{
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
}
.sf-pageband__actions .btn{ min-width: min(100%, var(--sf-space-160)); }
.sf-auth-row,
.sf-journey-row{ align-items: start; }
.sf-compact-note{
  border-radius: var(--sf-radius-20);
  background:
    linear-gradient(180deg, var(--sf-bg-98), var(--sf-ink-01)),
    radial-gradient(var(--sf-space-540) var(--sf-space-220) at 100% 0%, var(--sf-warning-08), transparent 62%);
}
.sf-compact-note .sf-muted:last-child{ margin-bottom: 0; }

body[data-sf-page="login"] .sf-page,
body[data-sf-page="signup"] .sf-page,
body[data-sf-page="store-select"] .sf-page,
body[data-sf-page="cart"] .sf-page,
body[data-sf-page="checkout"] .sf-page,
body[data-sf-page="orders"] .sf-page{
  padding-top: .95rem;
  padding-bottom: 2.2rem;
}
body[data-sf-page="login"] .sf-pagehead,
body[data-sf-page="signup"] .sf-pagehead,
body[data-sf-page="store-select"] .sf-pagehead,
body[data-sf-page="cart"] .sf-pagehead,
body[data-sf-page="checkout"] .sf-pagehead,
body[data-sf-page="orders"] .sf-pagehead{
  padding-bottom: 1rem;
}
body[data-sf-page="store-home"] .sf-home-overlap{
  margin-top: clamp(-1.4rem, -2.2vw, -.55rem);
  position: relative;
  z-index: 3;
}
body[data-sf-page="store-home"] .sf-carousel-section:first-of-type{ margin-top: 1.5rem !important; }
body[data-sf-page="store-home"] .sf-carousel-section{ padding-bottom: 2.35rem; }
body[data-sf-page="login"] .sf-footer-top .container,
body[data-sf-page="signup"] .sf-footer-top .container{
  padding-top: 1.35rem;
  padding-bottom: 2rem;
}
body[data-sf-page="store-select"] .sf-footer-top .container,
body[data-sf-page="cart"] .sf-footer-top .container,
body[data-sf-page="checkout"] .sf-footer-top .container,
body[data-sf-page="orders"] .sf-footer-top .container{
  padding-top: 1.75rem;
  padding-bottom: 2.15rem;
}
body[data-sf-page="cart"] .sf-summary-card,
body[data-sf-page="checkout"] .sf-summary-card,
body[data-sf-page="store-select"] .sf-sidebar .sf-card,
body[data-sf-page="orders"] .sf-sidebar .sf-card{
  box-shadow: var(--sf-shadow-card);
}

@media (min-width: 992px){
  .sf-pageband__layout{
    grid-template-columns: minmax(0, 1.35fr) auto;
    align-items: center;
  }
  body[data-sf-page="login"] .sf-auth-column,
  body[data-sf-page="signup"] .sf-auth-column{
    max-width: 36rem;
  }
}

@media (max-width: 575.98px){
  .sf-pageband{ padding: .95rem; }
  .sf-pageband__actions .btn{ width: 100%; }}
/* --- End Batch 02 / Plan Step 07 --- */

/* --- Begin Perfume Fork Gate 4: luxury perfume storefront primitives --- */
.sf-perfume-signature,
.sf-perfume-specs,
.sf-perfume-notes{
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
}
.sf-perfume-signature .sf-chip{
  border-color: var(--sf-border-strong);
  background: linear-gradient(180deg, var(--sf-bg-98), var(--sf-ink-02));
  color: var(--sf-ink-80);
}
.sf-perfume-filter-grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: .85rem;
}
.sf-perfume-filter-grid > div{
  min-width: 0;
}
.sf-perfume-profile-card{
  overflow: hidden;
}
.sf-perfume-profile-card::before{
  content: "";
  display: block;
  height: .22rem;
  background: linear-gradient(90deg, var(--sf-accent), var(--sf-warning), transparent);
  opacity: .85;
}
.sf-perfume-specs{
  margin-top: .85rem;
}
.sf-perfume-spec{
  flex: 1 1 9.5rem;
  border: 1px solid var(--sf-border);
  border-radius: var(--sf-radius-16);
  padding: .75rem .85rem;
  background: var(--sf-bg-98);
}
.sf-perfume-spec__label{
  font-size: var(--sf-type-caption);
  color: var(--sf-muted);
  margin-bottom: .15rem;
}
.sf-perfume-spec__value{
  font-weight: 700;
  color: var(--sf-ink);
}
.sf-perfume-notes{
  margin-top: .9rem;
  flex-direction: column;
}
.sf-perfume-note-row{
  border-inline-start: 3px solid var(--sf-border-strong);
  padding-inline-start: .75rem;
}
.sf-perfume-note-row strong{
  display: block;
  font-size: .82rem;
  margin-bottom: .12rem;
}
@media (max-width: 991.98px){
  .sf-perfume-filter-grid{ grid-template-columns: 1fr; }
}
@media (max-width: 575.98px){
  .sf-perfume-filter-grid{ grid-template-columns: 1fr; }
}
/* --- End Perfume Fork Gate 4 --- */


/* --- Begin Perfume Fork Gate 5: Stripe Payment Element checkout foundation --- */
.sf-payment-options{
  display: grid;
  gap: .75rem;
}
.sf-payment-option{
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  border: 1px solid var(--sf-border);
  border-radius: var(--sf-radius-18);
  padding: .9rem 1rem;
  background: var(--sf-bg-98);
  cursor: pointer;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.sf-payment-option:hover{
  border-color: var(--sf-border-strong);
  box-shadow: var(--sf-shadow-soft);
  transform: translateY(-1px);
}
.sf-payment-option input{
  margin-top: .25rem;
}
.sf-payment-option__body{
  display: grid;
  gap: .15rem;
  min-width: 0;
}
.sf-payment-option__title{
  font-weight: 700;
  color: var(--sf-ink);
}
.sf-payment-option__sub{
  color: var(--sf-muted);
  font-size: .875rem;
}
.sf-stripe-box{
  border: 1px solid var(--sf-border-strong);
  border-radius: var(--sf-radius-18);
  padding: 1rem;
  background: linear-gradient(180deg, var(--sf-bg-98), var(--sf-ink-02));
}
.sf-stripe-element{
  min-height: 4.5rem;
}
/* --- End Perfume Fork Gate 5 --- */

/* === SECTION 16: Gate 7C luxury storefront commercial polish === */
.sf-header-top-actions{position:relative}
.sf-header-icon-btn{min-width:2.25rem;display:inline-flex;align-items:center;justify-content:center}
.sf-search-popover{position:fixed;left:0;right:0;top:0;z-index:1045;background:var(--sf-bg-97);backdrop-filter:blur(var(--sf-header-blur));box-shadow:var(--sf-shadow-header);border-bottom:var(--sf-line-1) solid var(--sf-border)}
.sf-search-popover[hidden]{display:none!important}
.sf-search-popover__panel{display:flex;align-items:center;gap:.75rem;padding:1rem 0}
.sf-search-popover__icon{font-size:1.2rem;color:var(--sf-muted)}
.sf-search-popover__input{border:0;background:transparent;outline:0;box-shadow:none;width:100%;font-size:clamp(1.35rem,3vw,2.5rem);font-weight:600;color:var(--sf-ink)}
.sf-search-popover__input::placeholder{color:var(--sf-body-55)}
.sf-header-main .navbar-collapse{position:static}
.sf-commercial-nav{align-items:center;gap:.25rem}
.sf-nav-link-button{appearance:none;border:0;background:transparent;display:flex;align-items:center;gap:.35rem;color:var(--bs-nav-link-color);padding:var(--bs-nav-link-padding-y) var(--bs-nav-link-padding-x)}
.sf-nav-link-button:hover,.sf-nav-link-button:focus{color:var(--bs-nav-link-hover-color)}
.sf-mega-menu{position:absolute;left:0;right:0;top:calc(100% + .5rem);z-index:1040;background:var(--sf-bg-98);border:var(--sf-line-1) solid var(--sf-border);box-shadow:var(--sf-shadow-soft);border-radius:var(--sf-radius-24);padding:1rem;backdrop-filter:blur(var(--sf-glass-blur-lg))}
.sf-mega-menu::before{content:"";position:absolute;left:0;right:0;top:-.75rem;height:.75rem}
.sf-mega-menu[hidden]{display:none!important}
.sf-mega-menu__inner{display:grid;grid-template-columns:minmax(180px,.8fr) minmax(360px,1.6fr) minmax(180px,.8fr);gap:1rem;align-items:stretch}
.sf-mega-menu__intro,.sf-mega-menu__feature{background:linear-gradient(145deg,var(--sf-primary-08),var(--sf-ink-02));border:var(--sf-line-1) solid var(--sf-border);border-radius:var(--sf-radius-20);padding:1rem;position:relative;overflow:hidden}
.sf-mega-menu__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;align-content:start;max-height:min(52vh,30rem);overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;padding-inline-end:.35rem;scrollbar-width:thin;scrollbar-color:var(--sf-primary-35) transparent}
.sf-mega-menu__grid::-webkit-scrollbar{width:.5rem}
.sf-mega-menu__grid::-webkit-scrollbar-track{background:transparent}
.sf-mega-menu__grid::-webkit-scrollbar-thumb{background:var(--sf-primary-25);border-radius:999px;border:2px solid transparent;background-clip:padding-box}
.sf-mega-menu__grid::-webkit-scrollbar-thumb:hover{background:var(--sf-primary-40);background-clip:padding-box}
.sf-mega-link{display:flex;flex-wrap:wrap;align-content:center;align-items:center;column-gap:.75rem;row-gap:.2rem;text-decoration:none;color:var(--sf-ink);border:var(--sf-line-1) solid var(--sf-border);background:var(--sf-bg-94);border-radius:var(--sf-radius-18);padding:.85rem;min-height:72px;transition:transform var(--sf-dur) var(--sf-ease),box-shadow var(--sf-dur) var(--sf-ease),border-color var(--sf-dur) var(--sf-ease)}
.sf-mega-link:hover,.sf-mega-link:focus{transform:translateY(var(--sf-shift-card-hover));box-shadow:var(--sf-shadow-card);border-color:var(--sf-primary-25)}
.sf-mega-link i{width:2rem;height:2rem;flex:0 0 2rem;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:var(--sf-primary-10);color:var(--bs-primary)}
.sf-mega-link span{flex:1 1 calc(100% - 2.75rem);min-width:0;font-weight:700;line-height:1.1;overflow-wrap:anywhere}
.sf-mega-menu__feature-icon{width:2.4rem;height:2.4rem;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--sf-bg);margin-bottom:.75rem;color:var(--bs-primary)}
.sf-eyebrow{text-transform:uppercase;letter-spacing:.12em;font-size:var(--sf-type-caption);font-weight:800;color:var(--bs-primary)}
.sf-luxury-section-head{max-width:var(--sf-space-1200)}
.sf-home-brands{padding-top:0;padding-bottom:2rem}
.sf-brand-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1rem}
.sf-brand-card{min-height:180px;border:var(--sf-line-1) solid var(--sf-border);border-radius:var(--sf-radius-24);padding:1rem;background:linear-gradient(150deg,var(--sf-bg-98),var(--sf-primary-05));text-decoration:none;color:var(--sf-ink);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.55rem;text-align:center;box-shadow:var(--sf-shadow-card);transition:transform var(--sf-dur) var(--sf-ease),box-shadow var(--sf-dur) var(--sf-ease),border-color var(--sf-dur) var(--sf-ease)}
.sf-brand-card:hover,.sf-brand-card:focus{transform:translateY(var(--sf-shift-card-hover));box-shadow:var(--sf-shadow-lift);border-color:var(--sf-primary-25)}
.sf-brand-card__mark{width:3.2rem;height:3.2rem;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--sf-ink);color:var(--sf-bg);font-weight:800;letter-spacing:.08em}
.sf-brand-card__name{font-size:1.1rem;font-weight:800}
.sf-brand-card__copy{color:var(--sf-muted);font-size:.9rem}
.sf-merch-strip{padding-top:0;padding-bottom:2.25rem}
.sf-merch-strip__mount{min-height:270px}
.sf-merch-strip__fallback,.sf-merch-strip__card{position:relative;min-height:270px;border-radius:var(--sf-radius-26);overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;padding:1.25rem 1.5rem;text-decoration:none;color:#fff;background:linear-gradient(135deg,#151515,#4f3426);box-shadow:var(--sf-shadow-soft)}
.sf-merch-strip--quiet .sf-merch-strip__fallback{background:linear-gradient(135deg,#1d2230,#5a4632)}
.sf-merch-strip__fallback strong,.sf-merch-strip__card strong{display:block;font-size:clamp(1.25rem,2.5vw,2rem);max-width:680px;line-height:1.1}
.sf-merch-strip__fallback span:last-child,.sf-merch-strip__card .sf-merch-strip__copy span:last-child{margin-top:.5rem;font-weight:700}
.sf-merch-strip__card > .sf-responsive-banner{position:absolute;inset:0;width:100%;height:100%;z-index:0}
.sf-merch-strip__card > .sf-responsive-banner img{display:block;width:100%;height:100%;object-fit:cover;object-position:center center}
.sf-merch-strip__shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.68),rgba(0,0,0,.16));z-index:1}
.sf-merch-strip__copy{position:relative;z-index:2;display:flex;flex-direction:column;gap:.25rem;color:#fff}
body[data-sf-page="store-home"] .sf-merch-strip > .container{max-width:none;width:100%;padding-left:0;padding-right:0}
body[data-sf-page="store-home"] .sf-merch-strip__fallback,body[data-sf-page="store-home"] .sf-merch-strip__card{border-radius:0;min-height:270px}
body[data-sf-page="store-home"] .sf-merch-strip__mount{min-height:270px}

/* Gate 8 G8-C58G: Home hero/banner overlay and brand mood mobile polish */
@media (max-width: 767.98px){
  body[data-sf-page="store-home"] .sf-hero--banner .sf-heroSwiper{
    height: clamp(520px, 125vw, 720px);
  }
  body[data-sf-page="store-home"] .sf-heroSlide__shade{
    background: linear-gradient(180deg, var(--sf-overlay-dark-0), var(--sf-overlay-dark-28));
  }
  body[data-sf-page="store-home"] .sf-heroSlide__copy{
    left: calc(.85rem + var(--sf-safe-left));
    right: calc(.85rem + var(--sf-safe-right));
    bottom: .85rem;
    max-width: none;
    padding: .65rem .75rem;
    border-radius: var(--sf-radius-14);
    background: var(--sf-overlay-dark-28);
  }
  body[data-sf-page="store-home"] .sf-heroSlide__title{
    font-size: clamp(.98rem, 4vw, 1.15rem);
    line-height: 1.12;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  body[data-sf-page="store-home"] .sf-heroSlide__sub,
  body[data-sf-page="store-home"] .sf-heroSlide__actions{
    display: none;
  }
  body[data-sf-page="store-home"] .sf-heroNav{
    display: none;
  }
  body[data-sf-page="store-home"] .sf-merch-strip__fallback,
  body[data-sf-page="store-home"] .sf-merch-strip__card{
    min-height: 260px;
    justify-content: center;
    align-items: center;
    padding: .95rem;
    text-align: center;
  }
  body[data-sf-page="store-home"] .sf-merch-strip__shade{
    background: linear-gradient(180deg, var(--sf-overlay-dark-15), var(--sf-overlay-dark-45));
  }
  body[data-sf-page="store-home"] .sf-merch-strip__copy{
    align-items: center;
    justify-content: center;
    max-width: 100%;
    margin-inline: auto;
    text-align: center;
  }
  body[data-sf-page="store-home"] .sf-merch-strip__fallback strong,
  body[data-sf-page="store-home"] .sf-merch-strip__card strong{
    font-size: clamp(1rem, 4.8vw, 1.25rem);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  body[data-sf-page="store-home"] .sf-merch-strip__fallback span:last-child,
  body[data-sf-page="store-home"] .sf-merch-strip__card .sf-merch-strip__copy span:last-child{
    font-size: .82rem;
  }
}
@media (max-width: 575.98px){
  body[data-sf-page="store-home"] .sf-brand-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: .75rem;
  }
  body[data-sf-page="store-home"] .sf-brand-directory-card{
    min-height: 156px;
    align-items: center;
    justify-content: center;
    gap: .55rem;
    padding: .85rem .6rem;
    text-align: center;
  }
  body[data-sf-page="store-home"] .sf-brand-directory-card__logo{
    width: 100%;
    height: auto;
    min-height: 5.5rem;
    font-size: 1rem;
  }
  body[data-sf-page="store-home"] .sf-brand-directory-card .sf-card__title{
    font-size: .92rem;
    line-height: 1.1;
  }
}
.sf-footer-social{display:flex;align-items:center;gap:.55rem;flex-wrap:wrap}
.sf-footer-social a{width:2.25rem;height:2.25rem;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;border:var(--sf-line-1) solid var(--sf-border);background:var(--sf-bg);color:var(--sf-ink);text-decoration:none;transition:transform var(--sf-dur) var(--sf-ease),border-color var(--sf-dur) var(--sf-ease)}
.sf-footer-social a:hover,.sf-footer-social a:focus{transform:translateY(var(--sf-shift-button-hover));border-color:var(--sf-primary-25)}
.sf-app-badges{display:grid;gap:.65rem}
.sf-app-badge{display:flex;align-items:center;gap:.65rem;border:var(--sf-line-1) solid var(--sf-border);border-radius:var(--sf-radius-16);padding:.7rem .8rem;background:var(--sf-bg-94);text-decoration:none;color:var(--sf-ink)}
.sf-app-badge i{font-size:1.35rem}.sf-app-badge small{display:block;color:var(--sf-muted);font-size:var(--sf-type-micro);line-height:1.2}.sf-app-badge strong{display:block;line-height:1.2}
.sf-footer-trustbar{display:flex;align-items:center;justify-content:center;gap:1rem;flex-wrap:wrap;text-align:center}
.sf-footer-trustbar>div{display:grid;justify-items:center;gap:.35rem}
.sf-payment-marks{display:flex;align-items:center;justify-content:center;gap:.5rem;flex-wrap:wrap}
.sf-payment-marks span{display:inline-flex;align-items:center;justify-content:center;width:3.5rem;height:2.15rem;border:var(--sf-line-1) solid var(--sf-border);border-radius:var(--sf-radius-10);padding:.2rem .32rem;background:var(--sf-white);overflow:hidden}
.sf-payment-marks span img{display:block;width:100%;height:100%;max-width:2.75rem;max-height:1.45rem;object-fit:contain;object-position:center}
.sf-brands-toolbar .sf-toolbar-inner{min-width:0}

body[data-sf-page="store-home"] .sf-brand-grid > .sf-brand-directory-card{
  min-width: 0;
}
body[data-sf-page="store-home"] .sf-brand-grid .sf-brand-directory-card__media{
  min-height: 10rem;
}
body[data-sf-page="store-home"] .sf-brand-grid .sf-brand-directory-card__logo{
  width: 100%;
  height: auto;
  min-height: 8rem;
}
body[data-sf-page="store-home"] .sf-brand-grid .sf-brand-directory-card__desc{
  display: none;
}
.sf-brand-directory-card{min-height:100%}
.sf-brand-directory-card__media{min-height:9.25rem;aspect-ratio:auto;background:transparent;padding:1rem}
.sf-brand-directory-card__logo{width:100%;height:auto;min-height:7.25rem;border-radius:0;display:grid;place-items:center;overflow:visible;background:transparent;border:0;box-shadow:none;padding:.75rem}
.sf-brand-directory-card__logo img{width:100%;height:auto;max-height:5.75rem;object-fit:contain;padding:0;background:transparent}
.sf-brand-directory-card__token{max-width:100%;font-weight:800;font-size:clamp(1rem,1.4vw,1.35rem);color:var(--sf-ink);letter-spacing:.06em;line-height:1.16;text-align:center;overflow-wrap:anywhere}
.sf-brand-directory-card__desc{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sf-floating-actions{position:fixed;right:calc(1rem + var(--sf-safe-right));bottom:calc(1rem + var(--sf-safe-bottom));z-index:1045;display:flex;flex-direction:column;gap:.65rem}
.sf-floating-action{width:3rem;height:3rem;border-radius:50%;border:var(--sf-line-1) solid var(--sf-border);box-shadow:var(--sf-shadow-soft);display:flex;align-items:center;justify-content:center;background:var(--sf-bg-98);color:var(--sf-ink);text-decoration:none;transition:transform var(--sf-dur) var(--sf-ease),opacity var(--sf-dur) var(--sf-ease)}
.sf-floating-action:hover,.sf-floating-action:focus{transform:translateY(var(--sf-shift-button-hover));color:var(--sf-ink)}
.sf-floating-action--whatsapp{background:#25d366;color:#fff;border-color:#25d366}.sf-floating-action--whatsapp:hover,.sf-floating-action--whatsapp:focus{color:#fff}
.sf-floating-action--top{opacity:0;pointer-events:none}.sf-floating-action--top.is-visible{opacity:1;pointer-events:auto}
.sf-price-range__value{font-weight:800;font-size:.82rem;color:var(--sf-ink)}
.sf-price-range__sliders{--sf-price-min-pos:0%;--sf-price-max-pos:100%;position:relative;min-height:2.4rem;padding-top:.2rem}
.sf-price-range__sliders::before,.sf-price-range__sliders::after{content:"";position:absolute;inset-block-start:.9rem;height:.5rem;border-radius:var(--sf-radius-pill);pointer-events:none}
.sf-price-range__sliders::before{inset-inline:0;background:var(--sf-border);z-index:0}
.sf-price-range__sliders::after{inset-inline-start:var(--sf-price-min-pos);inset-inline-end:calc(100% - var(--sf-price-max-pos));background:var(--sf-taiba-bronze);z-index:1}
.sf-price-range__sliders .form-range{position:absolute;left:0;right:0;top:.4rem;width:100%;pointer-events:none;background:transparent;z-index:2}
.sf-price-range__sliders .form-range::-webkit-slider-runnable-track{background:transparent}
.sf-price-range__sliders .form-range::-moz-range-track{background:transparent}
.sf-price-range__sliders #minPrice{z-index:4}
.sf-price-range__sliders #maxPrice{z-index:3}
.sf-price-range__sliders .form-range:focus{z-index:5}
.sf-price-range__sliders .form-range::-webkit-slider-thumb{pointer-events:auto;background:var(--sf-taiba-bronze);border:var(--sf-line-1) solid var(--sf-bg);box-shadow:var(--sf-shadow-card)}
.sf-price-range__sliders .form-range::-moz-range-thumb{pointer-events:auto;background:var(--sf-taiba-bronze);border:var(--sf-line-1) solid var(--sf-bg);box-shadow:var(--sf-shadow-card)}
.sf-policy-shell{display:grid;gap:1.25rem}
.sf-policy-hero{border:var(--sf-line-1) solid var(--sf-border);border-radius:var(--sf-radius-26);padding:clamp(1.25rem,3vw,2rem);background:linear-gradient(145deg,var(--sf-bg-98),var(--sf-primary-08));box-shadow:var(--sf-shadow-card)}
.sf-policy-hero h1{font-size:clamp(2rem,4vw,3.25rem);margin:.25rem 0}.sf-policy-hero p{max-width:760px;color:var(--sf-muted);margin:0}
.sf-policy-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.sf-policy-card{border:var(--sf-line-1) solid var(--sf-border);border-radius:var(--sf-radius-22);padding:1rem;background:var(--sf-bg-98)}
.sf-policy-card h2{font-size:1rem;margin:0 0 .5rem}.sf-policy-card p{margin:0;color:var(--sf-muted)}
.sf-policy-note{display:flex;align-items:flex-start;gap:.65rem;border:var(--sf-line-1) solid var(--sf-primary-22);background:var(--sf-primary-05);border-radius:var(--sf-radius-18);padding:.9rem;color:var(--sf-ink)}
.sf-policy-dynamic{border-top:var(--sf-line-1) solid var(--sf-border);padding-top:1rem}
@media (max-width: 991.98px){.sf-mega-menu{display:none!important}.sf-brand-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.sf-footer-trustbar{display:grid}.sf-policy-grid{grid-template-columns:1fr}.sf-search-popover{position:fixed;left:0;right:0;top:0}.sf-search-popover__panel{padding:.85rem 0}.sf-search-popover__input{font-size:1.35rem}}
@media (max-width: 575.98px){.sf-floating-actions{right:calc(.75rem + var(--sf-safe-right));bottom:calc(.75rem + var(--sf-safe-bottom))}.sf-floating-action{width:2.75rem;height:2.75rem}.sf-merch-strip__fallback,.sf-merch-strip__card{min-height:220px}}


/* G8-C40R hosted Capacitor runtime regression cleanup */
:root { --sf-native-keyboard-bottom: 0px; }
html[data-taiba-native-shell="capacitor-hosted-storefront"] body.sf-app-shell {
  padding-bottom: calc(var(--sf-safe-bottom, env(safe-area-inset-bottom, 0px)) + var(--sf-native-keyboard-bottom));
  overscroll-behavior-y: none;
}
.sf-native-exit-notice {
  position: fixed;
  inset-inline: 1rem;
  bottom: calc(env(safe-area-inset-bottom, 0px) + var(--sf-native-keyboard-bottom) + 1rem);
  z-index: 1090;
  width: min(88vw, 24rem);
  margin-inline: auto;
  padding: 0.85rem 1rem;
  border: var(--sf-line-1) solid var(--sf-border);
  border-radius: 999px;
  background: var(--sf-bg-98);
  color: var(--sf-ink);
  box-shadow: var(--sf-shadow-toast);
  text-align: center;
  font-size: 0.92rem;
  pointer-events: none;
}
.sf-native-exit-notice[hidden] { display: none !important; }

/* === Gate 8 G8-C58D1: Mobile app shell header controls === */
@media (max-width: 767.98px){
  .sf-header-top{
    display: none;
  }
  .sf-header-main{
    min-height: calc(58px + var(--sf-safe-top));
  }
  .sf-header-main .container{
    padding-left: calc(.9rem + var(--sf-safe-left));
    padding-right: calc(.9rem + var(--sf-safe-right));
  }
  .sf-header-main__row{
    gap: .5rem !important;
  }
  .sf-header-mobile-actions{
    gap: .35rem !important;
  }
  .sf-header-mobile-actions .btn{
    width: 2.35rem;
    height: 2.35rem;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--sf-radius-pill);
    background: var(--sf-bg-96);
    box-shadow: 0 .35rem 1rem var(--sf-ink-06);
  }
  .sf-header-mobile-actions .sf-header-mobile-cart{
    display: inline-flex;
  }
  .sf-brand-link .sf-brand-logo{
    max-width: min(46vw, 168px);
    object-fit: contain;
  }
  .sf-brand-link > span{
    font-size: clamp(.75rem, 3.5vw, .95rem);
    line-height: 1;
    letter-spacing: -.02em;
  }
  .sf-search-popover{
    top: calc(58px + var(--sf-safe-top));
  }
}
@media (max-width: 400px){
  .sf-header-main .container{
    padding-left: calc(.65rem + var(--sf-safe-left));
    padding-right: calc(.65rem + var(--sf-safe-right));
  }
  .sf-header-main__row{
    gap: .4rem !important;
  }
  .sf-header-mobile-actions{
    gap: .3rem !important;
  }
  .sf-header-mobile-actions .btn{
    width: 2.25rem;
    height: 2.25rem;
  }
  [data-sf-mobile-notifications]{
    display: none !important;
  }
  .sf-header-main__row:has(.sf-shell-back-btn:not([hidden])) .sf-brand-link .sf-brand-logo{
    display: none;
  }
}
/* === End Gate 8 G8-C58D1 === */

/* === Gate 8 G8-C58D2: Drawer language and theme relocation === */
#sfNavDrawer .sf-drawer-preferences .list-group-item{
  min-height: 2.85rem;
}
#sfNavDrawer .sf-drawer-theme-toggle{
  width: 100%;
  text-align: start;
}
html[dir="rtl"] #sfNavDrawer .sf-drawer-theme-chevron{
  transform: rotate(180deg);
}
/* === End Gate 8 G8-C58D2 === */



/* === Gate 8 G8-C58D3: Bottom navigation and floating action offset === */
.sf-bottom-nav{
  display: none;
}
@media (max-width: 767.98px){
  :root{
    --sf-mobile-bottom-nav-height: 4.65rem;
  }
  body.sf-app-shell{
    padding-bottom: calc(var(--sf-mobile-bottom-nav-height) + var(--sf-safe-bottom));
  }
  .sf-main,
  .sf-footer-bottom{
    padding-bottom: calc(var(--sf-mobile-bottom-nav-height) + var(--sf-safe-bottom) + 1rem);
  }
  .sf-bottom-nav{
    position: fixed;
    left: calc(.65rem + var(--sf-safe-left));
    right: calc(.65rem + var(--sf-safe-right));
    bottom: calc(.55rem + var(--sf-safe-bottom));
    z-index: 1038;
    height: var(--sf-mobile-bottom-nav-height);
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-items: center;
    gap: .2rem;
    padding: .42rem;
    border: var(--sf-line-1) solid var(--sf-border);
    border-radius: 1.35rem;
    background: color-mix(in srgb, var(--sf-bg-98) 94%, transparent);
    box-shadow: 0 .9rem 2rem var(--sf-ink-14);
    backdrop-filter: blur(var(--sf-glass-blur-lg));
  }
  .sf-bottom-nav__item{
    min-width: 0;
    min-height: 3.35rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .16rem;
    border-radius: 1rem;
    color: var(--sf-muted);
    text-decoration: none;
    font-size: var(--sf-type-mobile-nav);
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: .01em;
    transition: background-color var(--sf-dur) var(--sf-ease), color var(--sf-dur) var(--sf-ease), transform var(--sf-dur) var(--sf-ease);
  }
  .sf-bottom-nav__item i{
    font-size: 1.18rem;
    line-height: 1;
  }
  .sf-bottom-nav__item:hover,
  .sf-bottom-nav__item:focus,
  .sf-bottom-nav__item.is-active{
    color: var(--sf-ink);
    background: linear-gradient(145deg, var(--sf-primary-12), var(--sf-ink-04));
  }
  .sf-bottom-nav__item:active{
    transform: translateY(1px);
  }
  .sf-bottom-nav__badge{
    margin-top: .15rem;
    font-size: .7rem;
  }
  .sf-floating-actions{
    right: calc(.85rem + var(--sf-safe-right));
    bottom: calc(var(--sf-mobile-bottom-nav-height) + 1.15rem + var(--sf-safe-bottom));
  }
  .sf-floating-action--top{
    display: none !important;
  }
}
/* === End Gate 8 G8-C58D3 === */

/* === Gate 8 G8-C58D4: Visual back button and shell padding verification === */
.sf-shell-back-btn[hidden]{
  display: none !important;
}
@media (max-width: 767.98px){
  .sf-shell-back-btn{
    width: 2.45rem;
    height: 2.45rem;
    padding: 0;
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--sf-radius-pill);
    background: var(--sf-bg-96);
    box-shadow: 0 .35rem 1rem var(--sf-ink-06);
  }
  html[dir="rtl"] .sf-shell-back-btn .bi-chevron-left{
    transform: rotate(180deg);
  }
  .sf-header-main__row:has(.sf-shell-back-btn:not([hidden])) .sf-brand-link .sf-brand-logo{
    max-width: min(38vw, 148px);
  }
  body.sf-app-shell:has(.sf-bottom-nav){
    scroll-padding-bottom: calc(var(--sf-mobile-bottom-nav-height, 0px) + var(--sf-safe-bottom) + 1.25rem);
  }
  .sf-footer-bottom{
    min-height: calc(3.25rem + var(--sf-mobile-bottom-nav-height, 0px) + var(--sf-safe-bottom));
  }
}
/* === End Gate 8 G8-C58D4 === */

/* === Gate 8 G8-C58E: Mobile footer compact brand/social variant === */
.sf-footer-brandmark__img{
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
  display: block;
}
@media (max-width: 767.98px){
  .sf-footer-top .container{
    padding-top: 1.15rem !important;
    padding-bottom: .95rem !important;
  }
  .sf-footer-shell{
    padding: 1rem;
    border-radius: 1.35rem;
    background:
      radial-gradient(18rem 10rem at 50% 0%, var(--sf-primary-10), transparent 64%),
      var(--sf-bg-88);
  }
  .sf-footer-shell .row{
    --bs-gutter-y: 0;
  }
  .sf-footer-brandcard{
    min-height: auto;
    padding: 1rem .9rem;
    display: grid;
    justify-items: center;
    text-align: center;
    background: var(--sf-bg-96);
  }
  .sf-footer-brandcard > .d-flex{
    width: 100%;
    flex-direction: column;
    justify-content: center;
    gap: .65rem !important;
    margin-bottom: .75rem !important;
  }
  .sf-footer-brandmark{
    width: 4rem;
    height: 4rem;
    padding: .35rem;
    border-radius: 1.05rem;
    background: var(--sf-bg);
  }
  .sf-footer-brandcopy,
  .sf-footer-pills,
  .sf-footer-desktop-col{
    display: none !important;
  }
  .sf-footer-social{
    width: 100%;
    justify-content: center;
    gap: .65rem;
  }
  .sf-footer-social a{
    width: 2.45rem;
    height: 2.45rem;
  }
  .sf-footer-bottom .container{
    padding-top: .85rem !important;
  }
  .sf-footer-bottom__inner{
    justify-content: center !important;
    text-align: center;
    align-items: center !important;
  }
}
/* === End Gate 8 G8-C58E === */



/* === Gate 8 G8-C58F: Featured grid relocation === */
.sf-featured-section{
  padding-top: .35rem;
  padding-bottom: 2.35rem;
}
.sf-featured-grid{
  align-items: stretch;
}
.sf-featured-grid > [class*="col-"]{
  display: flex;
}
.sf-featured-grid .sf-card.sf-product{
  width: 100%;
}
@media (max-width: 767.98px){
  .sf-featured-section{
    padding-top: .15rem;
    padding-bottom: 1.75rem;
  }
  .sf-featured-grid{
    --bs-gutter-x: .85rem;
    --bs-gutter-y: .85rem;
  }
  .sf-featured-grid .sf-card .sf-card__body{
    padding: .85rem .75rem .7rem;
  }
  .sf-featured-grid .sf-product .sf-card__body{
    padding-bottom: 0;
  }
  .sf-featured-grid .sf-product .sf-card__meta{
    margin-right: -.75rem;
    margin-left: -.75rem;
  }
  .sf-featured-grid .sf-card .sf-card__body .sf-card__title{
    font-size: .92rem;
    line-height: 1.25;
  }
  .sf-featured-grid .sf-product .btn[data-action="add-to-cart"]{
    min-width: 2.35rem;
    padding-inline: .6rem;
  }
}
/* === End Gate 8 G8-C58F === */


/* === Gate 8 G8-C58R: Mobile app-like regression corrections === */
@media (max-width: 767.98px){
  html[data-sf-keyboard="visible"] .sf-bottom-nav,
  body.sf-search-open .sf-bottom-nav{
    opacity: 0;
    pointer-events: none;
    transform: translateY(calc(100% + 1rem));
  }
  .sf-bottom-nav{
    transition: opacity var(--sf-dur) var(--sf-ease), transform var(--sf-dur) var(--sf-ease);
  }
  [data-sf-mobile-footer-payment="compact"].sf-footer-trustbar{
    display: grid !important;
    justify-items: center;
    gap: .5rem;
    margin-top: .85rem !important;
    padding-top: .85rem !important;
    width: 100%;
    text-align: center;
  }
  [data-sf-mobile-footer-payment="compact"] .sf-footer-heading{
    font-size: var(--sf-type-caption);
    letter-spacing: .08em;
    margin-bottom: .25rem !important;
  }
  [data-sf-mobile-footer-payment="compact"] .sf-payment-marks{
    gap: .35rem;
    justify-content: center;
  }
  [data-sf-mobile-footer-payment="compact"] .sf-payment-marks span{
    width: 3.2rem;
    height: 2rem;
    padding: .16rem .28rem;
    border-radius: var(--sf-radius-8);
    justify-content: center;
  }
  [data-sf-mobile-footer-payment="compact"] > .sf-muted{
    display: none !important;
  }
  body[data-sf-page="store-home"] .sf-featured-section + .sf-merch-strip{
    padding-top: 0;
    padding-bottom: 1.5rem;
  }
}
/* === End Gate 8 G8-C58R === */

/* === Gate 8 G8-C58H: Shop mobile filter collapse === */
.sf-mobile-filterbar{
  margin-bottom: .85rem;
}
.sf-mobile-filter-toggle{
  width: 100%;
  min-height: 2.85rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .55rem;
  border-radius: var(--sf-radius-pill);
  background: var(--sf-bg-98);
  box-shadow: 0 .45rem 1.2rem var(--sf-ink-06);
}
.sf-mobile-filter-toggle__badge{
  min-width: 1.35rem;
  height: 1.35rem;
  padding: 0 .35rem;
  display: inline-grid;
  place-items: center;
  border-radius: var(--sf-radius-pill);
  background: var(--sf-ink);
  color: var(--sf-bg);
  font-size: var(--sf-type-micro);
  line-height: 1;
  font-weight: 800;
}
.sf-mobile-filter-toggle.has-active-filters{
  border-color: var(--sf-border-strong);
  background: linear-gradient(145deg, var(--sf-primary-12), var(--sf-bg-98));
}
.sf-mobile-filter-backdrop[hidden]{
  display: none !important;
}
@media (max-width: 767.98px){
  body[data-sf-page="products"].sf-mobile-filters-open{
    overflow: hidden;
  }
  body[data-sf-page="products"] .sf-sidebar{
    position: fixed;
    left: calc(.7rem + var(--sf-safe-left));
    right: calc(.7rem + var(--sf-safe-right));
    top: auto;
    bottom: calc(.7rem + var(--sf-safe-bottom));
    z-index: 1044;
    width: auto;
    max-width: none;
    max-height: min(82vh, 42rem);
    transform: translateY(calc(100% + 1.5rem));
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: transform var(--sf-dur) var(--sf-ease), opacity var(--sf-dur) var(--sf-ease), visibility var(--sf-dur) var(--sf-ease);
  }
  body[data-sf-page="products"] .sf-sidebar.is-mobile-open{
    transform: translateY(0);
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }
  body[data-sf-page="products"] .sf-sidebar .sf-card{
    height: 100%;
    max-height: inherit;
    overflow: hidden;
    border-radius: 1.45rem;
    background: var(--sf-surface);
    box-shadow: 0 1.2rem 3rem var(--sf-ink-24);
  }
  body[data-sf-page="products"] .sf-sidebar .sf-card > .p-3{
    height: 100%;
    max-height: inherit;
    display: flex;
    flex-direction: column;
    min-height: 0;
  }
  body[data-sf-page="products"] .sf-sidebar .sf-sidebar-content{
    min-height: 0;
    overflow-y: auto;
    padding-bottom: .35rem;
    -webkit-overflow-scrolling: touch;
  }
  body[data-sf-page="products"] .sf-sidebar .sf-sidebar-header{
    flex: 0 0 auto;
  }
  body[data-sf-page="products"] .sf-mobile-filter-backdrop{
    position: fixed;
    inset: 0;
    z-index: 1043;
    background: var(--sf-ink-28);
    backdrop-filter: blur(var(--sf-glass-blur-sm));
  }
  body[data-sf-page="products"].sf-mobile-filters-open .sf-bottom-nav{
    opacity: 0;
    pointer-events: none;
    transform: translateY(calc(100% + 1rem));
  }
}
/* === End Gate 8 G8-C58H === */


/* === Gate 8 G8-C58S4R2: Touch interaction behavior polish === */
@media (hover: none), (pointer: coarse){
  .sf-card.sf-product,
  .sf-card.sf-cat,
  .sf-card.sf-store,
  .sf-card.sf-card--hover,
  .sf .btn,
  .sf-iconbtn,
  .sf-bottom-nav__item,
  .sf-floating-action,
  .sf-footer-social a,
  .sf-mega-link,
  .sf-brand-card,
  .sf-notif,
  .sf-payment-option,
  .sf-gallery__navbtn{
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
  }

  .sf-card.sf-product:hover,
  .sf-card.sf-cat:hover,
  .sf-card.sf-store:hover,
  .sf-card.sf-card--hover:hover,
  .sf .btn:hover,
  .sf-iconbtn:hover,
  .sf-notif:hover,
  .sf-gallery__navbtn:hover,
  .sf-pagehead .btn:hover,
  .sf-loadmore .btn:hover,
  .sf-store__actions .btn:hover,
  .sf-payment-option:hover,
  .sf-mega-link:hover,
  .sf-brand-card:hover,
  .sf-footer-social a:hover,
  .sf-floating-action:hover{
    transform: none;
  }

  .sf-card.sf-product:hover .sf-card__media img,
  .sf-card.sf-cat:hover .sf-card__media img,
  .sf-card.sf-store:hover .sf-card__media img{
    transform: none;
  }

  .sf-card.sf-product:active,
  .sf-card.sf-cat:active,
  .sf .btn:active,
  .sf-iconbtn:active,
  .sf-bottom-nav__item:active,
  .sf-floating-action:active{
    transform: translateY(1px);
  }

  .sf-carousel .swiper-slide,
  .sf-carousel .swiper-slide-active{
    opacity: 1;
    transform: none;
    transition-duration: .18s;
  }
}
/* === End Gate 8 G8-C58S4R2 === */

/* === Gate 8 G8-C58I: Edge-swipe drawer open behavior === */
@media (max-width: 767.98px){
  #sfNavDrawer[data-sf-contract="g8-c58i-edge-swipe-drawer"]{
    overscroll-behavior: contain;
  }
  html[data-sf-edge-swipe-drawer="ready"] body.sf-app-shell{
    touch-action: pan-y;
  }
}
/* === End Gate 8 G8-C58I === */
/* === Gate 8 G8-C59AR7S10R16: Final storefront mobile clarity correction === */
body[data-sf-page="contact"] div:has(> iframe[data-i18n-title="contact.location_map_title"]){ --bs-aspect-ratio: 42.8571428571%; }
@media (max-width: 767.98px){
  body[data-sf-page="product"] .sf-breadcrumb{ display:none; }
  body[data-sf-page="contact"] div:has(> iframe[data-i18n-title="contact.location_map_title"]){ --bs-aspect-ratio: 75%; }
}
/* === End Gate 8 G8-C59AR7S10R16 === */