/* ============================================================
   945 CLUB — THEME & NAVBAR SEARCH BAR ENGINE
   Modern Pill Search Bar + Dark / Light Mode Luxury Styling
   ============================================================ */

/* --- 1. NAVBAR SEARCH BAR (MATCHING REFERENCE EXACTLY) --- */
.nav-search-bar {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  background: #F3E6CC !important;
  border-radius: 9999px !important;
  height: 38px !important;
  padding: 0 16px !important;
  color: #5E5870 !important;
  font-size: 14px !important;
  font-weight: 400 !important;
  cursor: pointer !important;
  border: 1px solid transparent !important;
  transition: background 0.18s ease, border-color 0.18s ease, width 0.25s ease, box-shadow 0.18s ease !important;
  user-select: none !important;
  margin-right: 2px !important;
  box-sizing: border-box !important;
}

@media (min-width: 769px) {
  .nav-search-bar {
    width: 195px !important;
  }
}

@media (max-width: 768px) {
  .nav-search-bar {
    width: 38px !important;
    min-width: 38px !important;
    max-width: 38px !important;
    height: 38px !important;
    padding: 0 !important;
    justify-content: center !important;
    border-radius: 50% !important;
    margin-right: 0 !important;
    gap: 0 !important;
    flex-shrink: 0 !important;
  }
  .nav-search-bar .search-placeholder {
    display: none !important;
  }
}

.nav-search-bar:hover {
  background: #EFDFC0 !important;
  color: #14152D !important;
  border-color: rgba(0, 0, 0, 0.06) !important;
}

.nav-search-bar .nav-search-icon,
.nav-search-bar svg {
  color: #1C1D3D !important;
  stroke: #1C1D3D !important;
  flex-shrink: 0 !important;
  width: 18px !important;
  height: 18px !important;
  stroke-width: 2 !important;
  transition: transform 0.15s ease !important;
}

.nav-search-bar:hover .nav-search-icon {
  transform: scale(1.06);
}

.nav-search-bar .search-placeholder {
  font-size: 14px !important;
  color: #5E5870 !important;
  letter-spacing: -0.01em !important;
  font-weight: 400 !important;
  white-space: nowrap !important;
}

/* --- 2. THEME TOGGLE BUTTON (DARK / LIGHT MODE) --- */
.theme-toggle-btn {
  width: 38px !important;
  height: 38px !important;
  border-radius: 50% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative !important;
  background: transparent !important;
  border: none !important;
  cursor: pointer !important;
  color: var(--ink, #14152D) !important;
  transition: background 0.18s cubic-bezier(0.16, 1, 0.3, 1), transform 0.15s ease, color 0.18s ease !important;
  flex-shrink: 0 !important;
  padding: 0 !important;
}

.theme-toggle-btn:hover {
  background: #F3E6CC !important;
  transform: scale(1.06) !important;
}

.theme-toggle-btn:active {
  transform: scale(0.94) !important;
}

.theme-toggle-btn .theme-icon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  transition: opacity 0.26s cubic-bezier(0.16, 1, 0.3, 1), transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), color 0.2s ease;
  stroke-width: 2.1;
  pointer-events: none;
}

/* Light Mode Defaults: Moon icon is visible, Sun is hidden */
.theme-toggle-btn .theme-icon-moon {
  opacity: 1;
  transform: translate(-50%, -50%) rotate(0deg) scale(1);
}

.theme-toggle-btn .theme-icon-sun {
  opacity: 0;
  transform: translate(-50%, -50%) rotate(90deg) scale(0.4);
}

/* Dark Mode States: Sun icon is visible, Moon is hidden */
[data-theme="dark"] .theme-toggle-btn .theme-icon-moon,
html.dark .theme-toggle-btn .theme-icon-moon,
body.dark .theme-toggle-btn .theme-icon-moon {
  opacity: 0;
  transform: translate(-50%, -50%) rotate(-90deg) scale(0.4);
}

[data-theme="dark"] .theme-toggle-btn .theme-icon-sun,
html.dark .theme-toggle-btn .theme-icon-sun,
body.dark .theme-toggle-btn .theme-icon-sun {
  opacity: 1;
  transform: translate(-50%, -50%) rotate(0deg) scale(1);
  color: #F2E0BE !important; /* the cream chip, lit */
}

[data-theme="dark"] .theme-toggle-btn:hover,
html.dark .theme-toggle-btn:hover,
body.dark .theme-toggle-btn:hover {
  background: rgba(255, 255, 255, 0.1) !important;
}

/* --- 3. MOBILE DRAWER THEME TOGGLE ROW --- */
.msheet-theme-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 18px;
  background: #F3E6CC;
  border-radius: 14px;
  margin: 12px 0 16px 0;
  cursor: pointer;
  user-select: none;
  border: 1px solid rgba(0, 0, 0, 0.05);
  transition: background 0.18s ease, transform 0.12s ease;
}

.msheet-theme-row:active {
  transform: scale(0.99);
}

.msheet-theme-left {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  font-weight: 600;
  color: var(--ink);
}

.msheet-theme-left svg {
  color: var(--ink);
}

.theme-status-pill {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 9999px;
  background: #F8EEDB;
  color: #14152D;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.08);
}

/* ============================================================
   4. COMPREHENSIVE DARK MODE DESIGN SYSTEM (LUXURY OBSIDIAN)
   ============================================================ */
[data-theme="dark"],
html.dark,
body.dark {
  /* --- Dark Palette Variables --- */
  --bg-page: #111229;
  --white: #13142C;
  --surface-primary: #15162F;
  --surface-secondary: #1B1D39;
  --surface-tertiary: #26284A;
  --surface-plate: #1D1F3C;
  --surface-dark: #0B0C1E;
  --grey: #1D1F3C;
  --black: #ffffff;

  /* Typography */
  --ink: #F6EEDF;
  --ink-primary: #F6EEDF;
  --ink2: #BCB2A3;
  --ink-secondary: #BCB2A3;
  --ink-tertiary: #86868b;
  --ink-quaternary: #636366;
  --ink-inverse: #13142C;

  --st-ok: #7EE2A0;
  --st-warn: #FFC66B;
  --st-danger: #FF9B90;

  /* Borders */
  --hair: rgba(255, 255, 255, 0.09);
  --border-subtle: rgba(255, 255, 255, 0.08);
  --border-regular: rgba(255, 255, 255, 0.14);
  --border-strong: rgba(255, 255, 255, 0.24);

  color-scheme: dark;
}

/* Body & Document */
html.dark,
[data-theme="dark"] body,
html.dark body,
body.dark {
  background-color: #111229 !important;
  color: #F6EEDF !important;
}

/* Navbar */
[data-theme="dark"] .navbar,
html.dark .navbar,
body.dark .navbar {
  background: rgba(14, 14, 17, 0.94) !important;
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .navbar.stuck,
html.dark .navbar.stuck,
body.dark .navbar.stuck {
  background: rgba(14, 14, 17, 0.98) !important;
  border-bottom-color: rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.6) !important;
}

[data-theme="dark"] .logo-main,
html.dark .logo-main,
body.dark .logo-main {
  color: #ffffff !important;
}

[data-theme="dark"] .logo-sub,
html.dark .logo-sub,
body.dark .logo-sub {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .nlink,
html.dark .nlink,
body.dark .nlink {
  color: #d1d1d6 !important;
}

[data-theme="dark"] .nlink:hover,
[data-theme="dark"] .nlink.active,
html.dark .nlink:hover,
html.dark .nlink.active,
body.dark .nlink:hover,
body.dark .nlink.active {
  color: #ffffff !important;
}

[data-theme="dark"] .nlink-select,
html.dark .nlink-select,
body.dark .nlink-select,
[data-theme="dark"] .msheet-select-text,
html.dark .msheet-select-text,
body.dark .msheet-select-text {
  color: #E3A6B1 !important;
}

[data-theme="dark"] .nlink-select:hover,
[data-theme="dark"] .nlink-select.active,
html.dark .nlink-select:hover,
html.dark .nlink-select.active,
body.dark .nlink-select:hover,
body.dark .nlink-select.active {
  color: #c5926b !important;
}

[data-theme="dark"] .nicon,
html.dark .nicon,
body.dark .nicon {
  color: #F6EEDF !important;
}

[data-theme="dark"] .nicon:hover,
html.dark .nicon:hover,
body.dark .nicon:hover {
  background: rgba(255, 255, 255, 0.1) !important;
}

[data-theme="dark"] .burger,
html.dark .burger,
body.dark .burger {
  color: #F6EEDF !important;
}

[data-theme="dark"] .burger:hover,
html.dark .burger:hover,
body.dark .burger:hover {
  background: rgba(255, 255, 255, 0.1) !important;
}

/* Dark Mode Search Bar */
[data-theme="dark"] .nav-search-bar,
html.dark .nav-search-bar,
body.dark .nav-search-bar {
  background: #1f1f24 !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
  color: #BCB2A3 !important;
}

[data-theme="dark"] .nav-search-bar:hover,
html.dark .nav-search-bar:hover,
body.dark .nav-search-bar:hover {
  background: #28282e !important;
  border-color: rgba(255, 255, 255, 0.16) !important;
  color: #ffffff !important;
}

[data-theme="dark"] .nav-search-bar .nav-search-icon,
[data-theme="dark"] .nav-search-bar svg,
html.dark .nav-search-bar .nav-search-icon,
html.dark .nav-search-bar svg,
body.dark .nav-search-bar .nav-search-icon,
body.dark .nav-search-bar svg {
  color: #f4f4f6 !important;
  stroke: #f4f4f6 !important;
}

[data-theme="dark"] .nav-search-bar .search-placeholder,
html.dark .nav-search-bar .search-placeholder,
body.dark .nav-search-bar .search-placeholder {
  color: #BCB2A3 !important;
}

/* User Account Pill in Dark Mode */
[data-theme="dark"] .user-avatar-tag,
html.dark .user-avatar-tag,
body.dark .user-avatar-tag {
  background: #1f1f24 !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
  color: #F6EEDF !important;
}

[data-theme="dark"] .user-avatar-tag:hover,
html.dark .user-avatar-tag:hover,
body.dark .user-avatar-tag:hover {
  background: #28282e !important;
  border-color: rgba(255, 255, 255, 0.18) !important;
}

[data-theme="dark"] .header-user-name,
html.dark .header-user-name,
body.dark .header-user-name {
  color: #F6EEDF !important;
}

/* Badges */
[data-theme="dark"] .badge,
html.dark .badge,
body.dark .badge {
  background: #ffffff !important;
  color: #14152D !important;
  border: 1.5px solid #141417 !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.5) !important;
}

/* Announcement Promo Bar */
[data-theme="dark"] .promo,
html.dark .promo,
body.dark .promo {
  background: #141417 !important;
  color: #BCB2A3 !important;
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .promo b,
html.dark .promo b,
body.dark .promo b {
  color: #ffffff !important;
}

[data-theme="dark"] .promo .x,
html.dark .promo .x,
body.dark .promo .x {
  color: #BCB2A3 !important;
}

/* Product Cards */
[data-theme="dark"] .pcard-plate,
[data-theme="dark"] .nike-plp-grid .pcard-plate,
html.dark .pcard-plate,
html.dark .nike-plp-grid .pcard-plate,
body.dark .pcard-plate,
body.dark .nike-plp-grid .pcard-plate {
  background: #f6f6f8 !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

[data-theme="dark"] .pcard:hover .pcard-plate,
[data-theme="dark"] .nike-plp-grid .pcard:hover .pcard-plate,
html.dark .pcard:hover .pcard-plate,
html.dark .nike-plp-grid .pcard:hover .pcard-plate,
body.dark .pcard:hover .pcard-plate,
body.dark .nike-plp-grid .pcard:hover .pcard-plate {
  background: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.25) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4) !important;
}

[data-theme="dark"] .pcard-art,
[data-theme="dark"] .nike-plp-grid .pcard-art,
html.dark .pcard-art,
html.dark .nike-plp-grid .pcard-art,
body.dark .pcard-art,
body.dark .nike-plp-grid .pcard-art {
  mix-blend-mode: multiply !important;
  filter: none !important;
}

[data-theme="dark"] .pname,
html.dark .pname,
body.dark .pname {
  color: #F6EEDF !important;
}

[data-theme="dark"] .pdesc,
html.dark .pdesc,
body.dark .pdesc {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .pprice,
html.dark .pprice,
body.dark .pprice {
  color: #ffffff !important;
}

[data-theme="dark"] .pprice s,
html.dark .pprice s,
body.dark .pprice s {
  color: #8e8e93 !important;
}

[data-theme="dark"] .pcard-discount-tag,
html.dark .pcard-discount-tag,
body.dark .pcard-discount-tag {
  border-color: #4ade80 !important;
  color: #4ade80 !important;
}

[data-theme="dark"] .pcard-add-cart-btn,
html.dark .pcard-add-cart-btn,
body.dark .pcard-add-cart-btn {
  background: #ffffff !important;
  color: #14152D !important;
  border: 1px solid #ffffff !important;
  font-weight: 700 !important;
}

[data-theme="dark"] .pcard-add-cart-btn:hover,
html.dark .pcard-add-cart-btn:hover,
body.dark .pcard-add-cart-btn:hover {
  background: #EDE3D1 !important;
  color: #000000 !important;
  border-color: #EDE3D1 !important;
}

[data-theme="dark"] .pcard-wish-btn,
[data-theme="dark"] .nike-plp-grid .pcard-wish-btn,
html.dark .pcard-wish-btn,
html.dark .nike-plp-grid .pcard-wish-btn,
body.dark .pcard-wish-btn,
body.dark .nike-plp-grid .pcard-wish-btn {
  background: rgba(255, 255, 255, 0.95) !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  color: #14152D !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.14) !important;
}

[data-theme="dark"] .pcard-wish-btn:hover,
[data-theme="dark"] .nike-plp-grid .pcard-wish-btn:hover,
html.dark .pcard-wish-btn:hover,
html.dark .nike-plp-grid .pcard-wish-btn:hover,
body.dark .pcard-wish-btn:hover,
body.dark .nike-plp-grid .pcard-wish-btn:hover {
  background: #ffffff !important;
  transform: scale(1.08) !important;
  color: #000000 !important;
}

[data-theme="dark"] .pcard-wish-btn.active,
[data-theme="dark"] .nike-plp-grid .pcard-wish-btn.active,
html.dark .pcard-wish-btn.active,
html.dark .nike-plp-grid .pcard-wish-btn.active,
body.dark .pcard-wish-btn.active,
body.dark .nike-plp-grid .pcard-wish-btn.active {
  color: #ff2d55 !important;
  fill: #ff2d55 !important;
}

/* Category Discovery Chips & Filter Elements */
[data-theme="dark"] .plp-title,
html.dark .plp-title,
body.dark .plp-title {
  color: #ffffff !important;
}

[data-theme="dark"] .plp-subtitle,
html.dark .plp-subtitle,
body.dark .plp-subtitle {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .plp-chip,
[data-theme="dark"] .chip,
[data-theme="dark"] .plp-filter-btn,
html.dark .plp-chip,
html.dark .chip,
html.dark .plp-filter-btn,
body.dark .plp-chip,
body.dark .chip,
body.dark .plp-filter-btn {
  background: #1B1D39 !important;
  color: #F6EEDF !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
}

[data-theme="dark"] .plp-chip:hover,
[data-theme="dark"] .chip:hover,
[data-theme="dark"] .plp-filter-btn:hover,
html.dark .plp-chip:hover,
html.dark .chip:hover,
html.dark .plp-filter-btn:hover,
body.dark .plp-chip:hover,
body.dark .chip:hover,
body.dark .plp-filter-btn:hover {
  background: #28294C !important;
  border-color: rgba(255, 255, 255, 0.18) !important;
}

[data-theme="dark"] .plp-chip.active,
[data-theme="dark"] .chip.active,
[data-theme="dark"] .plp-filter-btn.active,
html.dark .plp-chip.active,
html.dark .chip.active,
html.dark .plp-filter-btn.active,
body.dark .plp-chip.active,
body.dark .chip.active,
body.dark .plp-filter-btn.active {
  background: #ffffff !important;
  color: #14152D !important;
  border-color: #ffffff !important;
}

[data-theme="dark"] .plp-sort-select,
html.dark .plp-sort-select,
body.dark .plp-sort-select {
  background-color: #1B1D39 !important;
  color: #F6EEDF !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
}

/* Mega Menu Dropdowns */
[data-theme="dark"] .mega,
html.dark .mega,
body.dark .mega {
  background: #14152D !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.6) !important;
}

[data-theme="dark"] .mega-col-title,
html.dark .mega-col-title,
body.dark .mega-col-title {
  color: #ffffff !important;
}

[data-theme="dark"] .mega-item,
html.dark .mega-item,
body.dark .mega-item {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .mega-item:hover,
html.dark .mega-item:hover,
body.dark .mega-item:hover {
  color: #ffffff !important;
}

/* Mobile Sheet Drawer */
[data-theme="dark"] .msheet,
html.dark .msheet,
body.dark .msheet {
  background: #15162F !important;
  color: #F6EEDF !important;
}

[data-theme="dark"] .msheet-inner,
html.dark .msheet-inner,
body.dark .msheet-inner {
  background: #15162F !important;
}

[data-theme="dark"] .msheet-auth-card,
html.dark .msheet-auth-card,
body.dark .msheet-auth-card {
  background: #1D1F3C !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .msheet-auth-greeting,
html.dark .msheet-auth-greeting,
body.dark .msheet-auth-greeting {
  color: #ffffff !important;
}

[data-theme="dark"] .msheet-auth-sub,
html.dark .msheet-auth-sub,
body.dark .msheet-auth-sub {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .msheet-auth-cta,
html.dark .msheet-auth-cta,
body.dark .msheet-auth-cta {
  background: #ffffff !important;
  color: #14152D !important;
}

[data-theme="dark"] .msheet-acc-header,
html.dark .msheet-acc-header,
body.dark .msheet-acc-header,
[data-theme="dark"] .msheet-direct-header,
html.dark .msheet-direct-header,
body.dark .msheet-direct-header,
[data-theme="dark"] .msheet-item-text,
html.dark .msheet-item-text,
body.dark .msheet-item-text {
  color: #F6EEDF !important;
  border-bottom-color: rgba(255, 255, 255, 0.06) !important;
}

[data-theme="dark"] .msheet-select-text,
html.dark .msheet-select-text,
body.dark .msheet-select-text,
[data-theme="dark"] .msheet-item-text.msheet-select-text,
html.dark .msheet-item-text.msheet-select-text,
body.dark .msheet-item-text.msheet-select-text,
[data-theme="dark"] .msheet-select-chevron,
html.dark .msheet-select-chevron,
body.dark .msheet-select-chevron {
  color: #E3A6B1 !important;
}

[data-theme="dark"] .msheet-sub-link,
html.dark .msheet-sub-link,
body.dark .msheet-sub-link {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .msheet-sub-link:hover,
html.dark .msheet-sub-link:hover,
body.dark .msheet-sub-link:hover {
  color: #ffffff !important;
}

[data-theme="dark"] .discovery-strip-btn,
html.dark .discovery-strip-btn,
body.dark .discovery-strip-btn {
  background: #1D1F3C !important;
  color: #F6EEDF !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .msheet-theme-row,
html.dark .msheet-theme-row,
body.dark .msheet-theme-row {
  background: #1D1F3C !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .msheet-theme-row .theme-status-pill,
html.dark .msheet-theme-row .theme-status-pill,
body.dark .msheet-theme-row .theme-status-pill {
  background: #fbbf24 !important;
  color: #14152D !important;
}

/* Search Overlay */
[data-theme="dark"] .searchov,
html.dark .searchov,
body.dark .searchov {
  background: rgba(8, 8, 10, 0.88) !important;
}

[data-theme="dark"] .searchbox,
html.dark .searchbox,
body.dark .searchbox {
  background: #191B36 !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
  color: #F6EEDF !important;
}

[data-theme="dark"] .search-input-wrapper,
html.dark .search-input-wrapper,
body.dark .search-input-wrapper {
  background: #242647 !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
}

[data-theme="dark"] #searchInput,
html.dark #searchInput,
body.dark #searchInput {
  color: #ffffff !important;
  /* the generic dark input fill painted a black block inside the panel's own navy field */
  background-color: transparent !important;
}

[data-theme="dark"] .search-cancel-btn,
html.dark .search-cancel-btn,
body.dark .search-cancel-btn {
  color: #EDE3D1 !important;
}

[data-theme="dark"] .search-sec-title,
html.dark .search-sec-title,
body.dark .search-sec-title {
  color: #BCB2A3 !important;
  font-weight: 600 !important;
}

[data-theme="dark"] .btn-clear-recent,
html.dark .btn-clear-recent,
body.dark .btn-clear-recent {
  color: #A9ADF0 !important;
}

[data-theme="dark"] .btn-clear-recent:hover,
html.dark .btn-clear-recent:hover,
body.dark .btn-clear-recent:hover {
  color: #60a5fa !important;
}

[data-theme="dark"] .search-quick-link,
html.dark .search-quick-link,
body.dark .search-quick-link {
  color: #EDE3D1 !important;
}

[data-theme="dark"] .search-quick-link:hover,
html.dark .search-quick-link:hover,
body.dark .search-quick-link:hover {
  color: #ffffff !important;
}

[data-theme="dark"] .search-quick-link .search-arrow-icon,
html.dark .search-quick-link .search-arrow-icon,
body.dark .search-quick-link .search-arrow-icon {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .search-quick-link:hover .search-arrow-icon,
html.dark .search-quick-link:hover .search-arrow-icon,
body.dark .search-quick-link:hover .search-arrow-icon {
  color: #A9ADF0 !important;
  transform: translateX(2px) !important;
}

[data-theme="dark"] .search-recent-remove,
html.dark .search-recent-remove,
body.dark .search-recent-remove {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .search-recent-remove:hover,
html.dark .search-recent-remove:hover,
body.dark .search-recent-remove:hover {
  color: #f87171 !important;
  background: rgba(248, 113, 113, 0.15) !important;
}

[data-theme="dark"] .search-product-hit,
html.dark .search-product-hit,
body.dark .search-product-hit {
  background: #1e1e24 !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
  color: #F6EEDF !important;
}

[data-theme="dark"] .search-product-hit:hover,
html.dark .search-product-hit:hover,
body.dark .search-product-hit:hover {
  border-color: rgba(255, 255, 255, 0.3) !important;
  background: #25252e !important;
}

[data-theme="dark"] .search-quick-link-chip,
html.dark .search-quick-link-chip,
body.dark .search-quick-link-chip {
  background: #242647 !important;
  color: #EDE3D1 !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

/* ============================================================
   5. COMPREHENSIVE SECTION-BY-SECTION LUXURY OBSIDIAN DARK MODE
   ============================================================ */

/* --- A. GLOBAL HEADINGS & TYPOGRAPHY ENFORCEMENT --- */
[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3,
[data-theme="dark"] h4,
[data-theme="dark"] .h1,
[data-theme="dark"] .h2,
[data-theme="dark"] .h3,
[data-theme="dark"] .h4,
html.dark h1,
html.dark h2,
html.dark h3,
html.dark h4,
html.dark .h1,
html.dark .h2,
html.dark .h3,
html.dark .h4,
body.dark h1,
body.dark h2,
body.dark h3,
body.dark h4,
body.dark .h1,
body.dark .h2,
body.dark .h3,
body.dark .h4 {
  color: #ffffff !important;
}

[data-theme="dark"] .eyebrow,
html.dark .eyebrow,
body.dark .eyebrow {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .lnk,
html.dark .lnk,
body.dark .lnk {
  color: #F6EEDF !important;
}

[data-theme="dark"] .lnk:hover,
html.dark .lnk:hover,
body.dark .lnk:hover {
  color: #ffffff !important;
}

/* --- B. 1ST SECTION: CATEGORY DISCOVERY (MEN | WOMEN | KIDS) --- */
[data-theme="dark"] .discovery-feature-sec,
[data-theme="dark"] #genderDiscoverySection,
html.dark .discovery-feature-sec,
html.dark #genderDiscoverySection,
body.dark .discovery-feature-sec,
body.dark #genderDiscoverySection {
  background: #111229 !important;
  border-bottom: none !important;
}

[data-theme="dark"] .discovery-feature-sec .h2,
html.dark .discovery-feature-sec .h2,
body.dark .discovery-feature-sec .h2 {
  color: #ffffff !important;
}

[data-theme="dark"] .editorial-eyebrow,
html.dark .editorial-eyebrow,
body.dark .editorial-eyebrow {
  color: #a1a1a6 !important;
}

[data-theme="dark"] .editorial-eyebrow-line,
html.dark .editorial-eyebrow-line,
body.dark .editorial-eyebrow-line {
  background: rgba(255, 255, 255, 0.2) !important;
}

[data-theme="dark"] .editorial-section-title,
html.dark .editorial-section-title,
body.dark .editorial-section-title {
  color: #f5f4ef !important;
}

[data-theme="dark"] .editorial-view-all,
html.dark .editorial-view-all,
body.dark .editorial-view-all {
  color: #f5f4ef !important;
}

[data-theme="dark"] .discovery-feature-btn,
html.dark .discovery-feature-btn,
body.dark .discovery-feature-btn {
  background: #242428 !important;
  color: #f5f4ef !important;
}

[data-theme="dark"] .discovery-feature-btn:hover,
html.dark .discovery-feature-btn:hover,
body.dark .discovery-feature-btn:hover {
  background: #333338 !important;
}

[data-theme="dark"] .discovery-feature-card,
html.dark .discovery-feature-card,
body.dark .discovery-feature-card {
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45) !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .brand-stage-box,
html.dark .brand-stage-box,
body.dark .brand-stage-box {
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.65) !important;
}

[data-theme="dark"] .stage-brand-tag,
html.dark .stage-brand-tag,
body.dark .stage-brand-tag {
  background: rgba(18, 18, 22, 0.9) !important;
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.16) !important;
}

[data-theme="dark"] .stage-cta-btn,
html.dark .stage-cta-btn,
body.dark .stage-cta-btn {
  background: #1B1D39 !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.16) !important;
}

[data-theme="dark"] .stage-cta-btn:hover,
html.dark .stage-cta-btn:hover,
body.dark .stage-cta-btn:hover {
  background: #24242c !important;
  border-color: rgba(255, 255, 255, 0.3) !important;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.5) !important;
}

/* --- D. APPAREL & STREETWEAR SHOWCASE --- */
[data-theme="dark"] #apparel,
html.dark #apparel,
body.dark #apparel {
  background: #111229 !important;
}

[data-theme="dark"] .apparel-eyebrow,
html.dark .apparel-eyebrow,
body.dark .apparel-eyebrow {
  color: #c49e62 !important;
}

[data-theme="dark"] .apparel-title,
html.dark .apparel-title,
body.dark .apparel-title {
  color: #f5f4ef !important;
}

[data-theme="dark"] .apparel-amp,
html.dark .apparel-amp,
body.dark .apparel-amp {
  color: #E3A6B1 !important;
}

[data-theme="dark"] .apparel-view-all,
html.dark .apparel-view-all,
body.dark .apparel-view-all {
  color: #f5f4ef !important;
  border-color: #c49e62 !important;
}

[data-theme="dark"] .apparel-header-rule,
html.dark .apparel-header-rule,
body.dark .apparel-header-rule {
  background: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .apparel-card,
[data-theme="dark"] .apparel-card.app-tshirts,
[data-theme="dark"] .apparel-card.app-hoodies,
[data-theme="dark"] .apparel-card.app-jackets,
[data-theme="dark"] .apparel-card.app-hoodies-jackets,
[data-theme="dark"] .apparel-card.app-shorts,
[data-theme="dark"] .apparel-card.app-pants,
[data-theme="dark"] .apparel-card.app-bras,
[data-theme="dark"] .apparel-card.app-accessories,
html.dark .apparel-card,
html.dark .apparel-card.app-tshirts,
html.dark .apparel-card.app-hoodies,
html.dark .apparel-card.app-jackets,
html.dark .apparel-card.app-hoodies-jackets,
html.dark .apparel-card.app-shorts,
html.dark .apparel-card.app-pants,
html.dark .apparel-card.app-bras,
html.dark .apparel-card.app-accessories,
body.dark .apparel-card,
body.dark .apparel-card.app-tshirts,
body.dark .apparel-card.app-hoodies,
body.dark .apparel-card.app-jackets,
body.dark .apparel-card.app-hoodies-jackets,
body.dark .apparel-card.app-shorts,
body.dark .apparel-card.app-pants,
body.dark .apparel-card.app-bras,
body.dark .apparel-card.app-accessories {
  background: #17171c !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* --- E. 3RD SECTION: SHOP BY SPORT & LIFESTYLE (BENTO PURPOSE GRID) --- */
[data-theme="dark"] .sec.grey,
[data-theme="dark"] #cats,
html.dark .sec.grey,
html.dark #cats,
body.dark .sec.grey,
body.dark #cats {
  background: #111229 !important;
}

[data-theme="dark"] .purpose-card,
[data-theme="dark"] .purpose-card.pur-running,
[data-theme="dark"] .purpose-card.pur-basketball,
[data-theme="dark"] .purpose-card.pur-training,
[data-theme="dark"] .purpose-card.pur-football,
[data-theme="dark"] .purpose-card.pur-gym,
[data-theme="dark"] .purpose-card.pur-lifestyle,
[data-theme="dark"] .purpose-card.pur-outdoor,
[data-theme="dark"] .purpose-card.pur-slides,
[data-theme="dark"] .purpose-card.a,
[data-theme="dark"] .purpose-card.b,
[data-theme="dark"] .purpose-card.c,
[data-theme="dark"] .purpose-card.d,
[data-theme="dark"] .purpose-card.e,
html.dark .purpose-card,
html.dark .purpose-card.pur-running,
html.dark .purpose-card.pur-basketball,
html.dark .purpose-card.pur-training,
html.dark .purpose-card.pur-football,
html.dark .purpose-card.pur-gym,
html.dark .purpose-card.pur-lifestyle,
html.dark .purpose-card.pur-outdoor,
html.dark .purpose-card.pur-slides,
html.dark .purpose-card.a,
html.dark .purpose-card.b,
html.dark .purpose-card.c,
html.dark .purpose-card.d,
html.dark .purpose-card.e,
body.dark .purpose-card,
body.dark .purpose-card.pur-running,
body.dark .purpose-card.pur-basketball,
body.dark .purpose-card.pur-training,
body.dark .purpose-card.pur-football,
body.dark .purpose-card.pur-gym,
body.dark .purpose-card.pur-lifestyle,
body.dark .purpose-card.pur-outdoor,
body.dark .purpose-card.pur-slides,
body.dark .purpose-card.a,
body.dark .purpose-card.b,
body.dark .purpose-card.c,
body.dark .purpose-card.d,
body.dark .purpose-card.e {
  background: #17171c !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.35) !important;
}

[data-theme="dark"] .purpose-card:hover,
html.dark .purpose-card:hover,
body.dark .purpose-card:hover {
  background: #1f1f26 !important;
  border-color: rgba(255, 255, 255, 0.18) !important;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.55) !important;
}

[data-theme="dark"] .purpose-tag,
html.dark .purpose-tag,
body.dark .purpose-tag {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .purpose-title,
html.dark .purpose-title,
body.dark .purpose-title {
  color: #ffffff !important;
}

[data-theme="dark"] .purpose-desc,
html.dark .purpose-desc,
body.dark .purpose-desc {
  color: #8e8e93 !important;
}

/* --- F. 4TH SECTION: PRODUCTS CATALOG & NIKE PLP EXPERIENCE --- */
[data-theme="dark"] #catalogView,
[data-theme="dark"] #catalog,
[data-theme="dark"] .plp-nike-section,
html.dark #catalogView,
html.dark #catalog,
html.dark .plp-nike-section,
body.dark #catalogView,
body.dark #catalog,
body.dark .plp-nike-section {
  background: #111229 !important;
  color: #F6EEDF !important;
}

[data-theme="dark"] .nike-plp-breadcrumb,
html.dark .nike-plp-breadcrumb,
body.dark .nike-plp-breadcrumb {
  color: #8e8e93 !important;
}

[data-theme="dark"] .nike-crumb-home,
html.dark .nike-crumb-home,
body.dark .nike-crumb-home {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .nike-crumb-home:hover,
html.dark .nike-crumb-home:hover,
body.dark .nike-crumb-home:hover {
  color: #ffffff !important;
}

[data-theme="dark"] .nike-crumb-sep,
html.dark .nike-crumb-sep,
body.dark .nike-crumb-sep {
  color: #52525b !important;
}

[data-theme="dark"] .nike-crumb-current,
html.dark .nike-crumb-current,
body.dark .nike-crumb-current {
  color: #ffffff !important;
}

[data-theme="dark"] .nike-plp-header,
html.dark .nike-plp-header,
body.dark .nike-plp-header {
  background: rgba(14, 14, 17, 0.96) !important;
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .nike-plp-title,
html.dark .nike-plp-title,
body.dark .nike-plp-title {
  color: #ffffff !important;
}

[data-theme="dark"] .nike-plp-count,
html.dark .nike-plp-count,
body.dark .nike-plp-count {
  background: #202242 !important;
  color: #BCB2A3 !important;
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
}

/* Filter and Sort Controls */
[data-theme="dark"] .nike-toggle-filters-btn,
html.dark .nike-toggle-filters-btn,
body.dark .nike-toggle-filters-btn {
  background: #1B1D39 !important;
  color: #F6EEDF !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

[data-theme="dark"] .nike-toggle-filters-btn:hover,
html.dark .nike-toggle-filters-btn:hover,
body.dark .nike-toggle-filters-btn:hover {
  background: #24242b !important;
  border-color: rgba(255, 255, 255, 0.22) !important;
}

[data-theme="dark"] .nike-toggle-filters-btn .nike-toggle-icon,
html.dark .nike-toggle-filters-btn .nike-toggle-icon,
body.dark .nike-toggle-filters-btn .nike-toggle-icon {
  color: #F6EEDF !important;
}

[data-theme="dark"] .nike-sort-btn,
html.dark .nike-sort-btn,
body.dark .nike-sort-btn {
  background: #1B1D39 !important;
  color: #F6EEDF !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

[data-theme="dark"] .nike-sort-btn:hover,
html.dark .nike-sort-btn:hover,
body.dark .nike-sort-btn:hover {
  background: #24242b !important;
  border-color: rgba(255, 255, 255, 0.22) !important;
}

[data-theme="dark"] .nike-sort-chevron,
html.dark .nike-sort-chevron,
body.dark .nike-sort-chevron {
  color: #F6EEDF !important;
}

[data-theme="dark"] .nike-sort-dropdown,
html.dark .nike-sort-dropdown,
body.dark .nike-sort-dropdown {
  background: rgba(22, 22, 27, 0.98) !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.65) !important;
}

[data-theme="dark"] .nike-sort-option,
html.dark .nike-sort-option,
body.dark .nike-sort-option {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .nike-sort-option:hover,
html.dark .nike-sort-option:hover,
body.dark .nike-sort-option:hover {
  background: #262630 !important;
  color: #ffffff !important;
}

[data-theme="dark"] .nike-sort-option.active,
html.dark .nike-sort-option.active,
body.dark .nike-sort-option.active {
  background: #22222a !important;
  color: #ffffff !important;
}

[data-theme="dark"] .nike-sort-check,
html.dark .nike-sort-check,
body.dark .nike-sort-check {
  color: #ffffff !important;
}

/* Sidebar & Accordions */
[data-theme="dark"] .nike-sidebar,
html.dark .nike-sidebar,
body.dark .nike-sidebar {
  background: transparent !important;
}

@media (max-width: 768px) {
  [data-theme="dark"] .nike-sidebar,
  html.dark .nike-sidebar,
  body.dark .nike-sidebar {
    background: #14152D !important;
  }

  [data-theme="dark"] .nike-sidebar-head,
  html.dark .nike-sidebar-head,
  body.dark .nike-sidebar-head {
    background: #14152D !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  }

  [data-theme="dark"] .nike-sidebar-close-btn,
  html.dark .nike-sidebar-close-btn,
  body.dark .nike-sidebar-close-btn {
    background: #1e1e24 !important;
    border: 1px solid rgba(255, 255, 255, 0.12) !important;
    color: #F6EEDF !important;
  }

  [data-theme="dark"] .nike-sidebar-close-btn:active,
  html.dark .nike-sidebar-close-btn:active,
  body.dark .nike-sidebar-close-btn:active {
    background: #2a2a34 !important;
  }
}

[data-theme="dark"] .nike-sidebar-head,
html.dark .nike-sidebar-head,
body.dark .nike-sidebar-head {
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .nike-sidebar-heading,
html.dark .nike-sidebar-heading,
body.dark .nike-sidebar-heading {
  color: #ffffff !important;
}

[data-theme="dark"] .nike-active-filter-count,
html.dark .nike-active-filter-count,
body.dark .nike-active-filter-count {
  background: #ffffff !important;
  color: #14152D !important;
}

[data-theme="dark"] .nike-sidebar-body,
html.dark .nike-sidebar-body,
body.dark .nike-sidebar-body {
  scrollbar-color: rgba(255, 255, 255, 0.22) transparent !important;
}
[data-theme="dark"] .nike-sidebar-body::-webkit-scrollbar-thumb,
html.dark .nike-sidebar-body::-webkit-scrollbar-thumb,
body.dark .nike-sidebar-body::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.2) !important;
}
[data-theme="dark"] .nike-sidebar-body::-webkit-scrollbar-thumb:hover,
html.dark .nike-sidebar-body::-webkit-scrollbar-thumb:hover,
body.dark .nike-sidebar-body::-webkit-scrollbar-thumb:hover {
  background: rgba(255, 255, 255, 0.4) !important;
}

[data-theme="dark"] .nike-reset-btn,
html.dark .nike-reset-btn,
body.dark .nike-reset-btn {
  background: #232546 !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  color: #F6EEDF !important;
}

[data-theme="dark"] .nike-reset-btn:hover,
html.dark .nike-reset-btn:hover,
body.dark .nike-reset-btn:hover {
  background: #ffffff !important;
  color: #14152D !important;
  border-color: #ffffff !important;
}

[data-theme="dark"] .nike-reset-btn.has-filters,
html.dark .nike-reset-btn.has-filters,
body.dark .nike-reset-btn.has-filters {
  background: #ffffff !important;
  color: #14152D !important;
  border-color: #ffffff !important;
}

[data-theme="dark"] .nike-accordion-item,
html.dark .nike-accordion-item,
body.dark .nike-accordion-item {
  border-top-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .nike-accordion-header,
html.dark .nike-accordion-header,
body.dark .nike-accordion-header {
  color: #ffffff !important;
}

[data-theme="dark"] .nike-accordion-header:hover,
html.dark .nike-accordion-header:hover,
body.dark .nike-accordion-header:hover {
  color: #ffffff !important;
}

[data-theme="dark"] .nike-acc-icon,
html.dark .nike-acc-icon,
body.dark .nike-acc-icon {
  color: #8e8e93 !important;
}

[data-theme="dark"] .nike-accordion-item.open .nike-acc-icon,
html.dark .nike-accordion-item.open .nike-acc-icon,
body.dark .nike-accordion-item.open .nike-acc-icon {
  color: #ffffff !important;
}

[data-theme="dark"] .nike-checkbox-label:hover,
html.dark .nike-checkbox-label:hover,
body.dark .nike-checkbox-label:hover {
  background: rgba(255, 255, 255, 0.05) !important;
}

[data-theme="dark"] .nike-custom-check,
html.dark .nike-custom-check,
body.dark .nike-custom-check {
  background: #1b1b20 !important;
  border-color: rgba(255, 255, 255, 0.22) !important;
}

[data-theme="dark"] .nike-checkbox-label input[type="checkbox"]:checked ~ .nike-custom-check,
html.dark .nike-checkbox-label input[type="checkbox"]:checked ~ .nike-custom-check,
body.dark .nike-checkbox-label input[type="checkbox"]:checked ~ .nike-custom-check {
  background: #ffffff !important;
  border-color: #ffffff !important;
}

[data-theme="dark"] .nike-custom-check svg,
html.dark .nike-custom-check svg,
body.dark .nike-custom-check svg {
  stroke: #14152D !important;
}

[data-theme="dark"] .nike-checkbox-text,
html.dark .nike-checkbox-text,
body.dark .nike-checkbox-text {
  color: #d1d1d6 !important;
}

[data-theme="dark"] .nike-checkbox-label input[type="checkbox"]:checked ~ .nike-checkbox-text,
html.dark .nike-checkbox-label input[type="checkbox"]:checked ~ .nike-checkbox-text,
body.dark .nike-checkbox-label input[type="checkbox"]:checked ~ .nike-checkbox-text {
  color: #ffffff !important;
}

[data-theme="dark"] .nike-size-box,
html.dark .nike-size-box,
body.dark .nike-size-box {
  background: #1b1b20 !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
  color: #d1d1d6 !important;
}

[data-theme="dark"] .nike-size-box:hover:not(.active),
html.dark .nike-size-box:hover:not(.active),
body.dark .nike-size-box:hover:not(.active) {
  background: #262630 !important;
  border-color: rgba(255, 255, 255, 0.25) !important;
  color: #ffffff !important;
}

[data-theme="dark"] .nike-size-box.active,
[data-theme="dark"] .nike-size-box.active:hover,
[data-theme="dark"] .nike-size-box.active:focus,
html.dark .nike-size-box.active,
html.dark .nike-size-box.active:hover,
html.dark .nike-size-box.active:focus,
body.dark .nike-size-box.active,
body.dark .nike-size-box.active:hover,
body.dark .nike-size-box.active:focus {
  background: #ffffff !important;
  border-color: #ffffff !important;
  color: #14152D !important;
}

/* Active Chips Bar */
[data-theme="dark"] .nike-active-chips-bar,
html.dark .nike-active-chips-bar,
body.dark .nike-active-chips-bar {
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .nike-active-chip,
html.dark .nike-active-chip,
body.dark .nike-active-chip {
  background: #202242 !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  color: #F6EEDF !important;
}

[data-theme="dark"] .nike-active-chip-remove,
html.dark .nike-active-chip-remove,
body.dark .nike-active-chip-remove {
  color: #8e8e93 !important;
}

[data-theme="dark"] .nike-active-chip-remove:hover,
html.dark .nike-active-chip-remove:hover,
body.dark .nike-active-chip-remove:hover {
  color: #ffffff !important;
}

[data-theme="dark"] .nike-clear-all-chips-btn,
html.dark .nike-clear-all-chips-btn,
body.dark .nike-clear-all-chips-btn {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .nike-clear-all-chips-btn:hover,
html.dark .nike-clear-all-chips-btn:hover,
body.dark .nike-clear-all-chips-btn:hover {
  color: #ffffff !important;
}

/* Product Cards in Dark Mode Grid */
[data-theme="dark"] .pcard,
html.dark .pcard,
body.dark .pcard {
  color: #F6EEDF !important;
}

/* #d9381e measured 3.9:1 on the dark product sheet. */
[data-theme="dark"] .pv-pdp-tag,
html.dark .pv-pdp-tag,
body.dark .pv-pdp-tag {
  color: #f87171 !important;
}

/* The cards render .pcard-tag-red and .pcolor-count-label; these rules named
   .pcard-tag and .pcolours, which nothing renders, so the dark card kept the
   light theme's #9e3500 tag at 2.7:1. */
[data-theme="dark"] .pcard-tag-red,
html.dark .pcard-tag-red,
body.dark .pcard-tag-red {
  color: #fb923c !important; /* Premium warm orange */
}

[data-theme="dark"] .pcolor-count-label,
html.dark .pcolor-count-label,
body.dark .pcolor-count-label {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .pcard-plate,
html.dark .pcard-plate,
body.dark .pcard-plate {
  background: #f6f6f8 !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

[data-theme="dark"] .pcard:hover .pcard-plate,
html.dark .pcard:hover .pcard-plate,
body.dark .pcard:hover .pcard-plate {
  background: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.25) !important;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.4) !important;
}

/* Mobile Filter Drawer Footer */
[data-theme="dark"] .nike-sidebar-mobile-footer,
html.dark .nike-sidebar-mobile-footer,
body.dark .nike-sidebar-mobile-footer {
  background: #15162F !important;
  border-top-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .nike-mobile-clear-btn,
html.dark .nike-mobile-clear-btn,
body.dark .nike-mobile-clear-btn {
  background: #1e1e24 !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  color: #F6EEDF !important;
}

[data-theme="dark"] .nike-mobile-apply-btn,
html.dark .nike-mobile-apply-btn,
body.dark .nike-mobile-apply-btn {
  background: #ffffff !important;
  color: #14152D !important;
}

/* --- G. 5TH SECTION: PRODUCT DETAIL / NIKE PDP QUICK VIEW MODAL --- */
[data-theme="dark"] .modal-overlay,
html.dark .modal-overlay,
body.dark .modal-overlay {
  background: rgba(0, 0, 0, 0.78) !important;
}

[data-theme="dark"] .modal-card,
[data-theme="dark"] .pv-modal-card,
[data-theme="dark"] .nike-pdp-card,
[data-theme="dark"] .qa-modal-card,
[data-theme="dark"] .quick-add-modal,
html.dark .modal-card,
html.dark .pv-modal-card,
html.dark .nike-pdp-card,
html.dark .qa-modal-card,
html.dark .quick-add-modal,
body.dark .modal-card,
body.dark .pv-modal-card,
body.dark .nike-pdp-card,
body.dark .qa-modal-card,
body.dark .quick-add-modal {
  background: #181A34 !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  box-shadow: 0 32px 80px rgba(0, 0, 0, 0.8) !important;
  color: #F6EEDF !important;
}

[data-theme="dark"] .pv-circle-close,
[data-theme="dark"] .qa-circle-close,
html.dark .pv-circle-close,
html.dark .qa-circle-close,
body.dark .pv-circle-close,
body.dark .qa-circle-close {
  background: #28294C !important;
  color: #F6EEDF !important;
}

[data-theme="dark"] .pv-circle-close:hover,
[data-theme="dark"] .qa-circle-close:hover,
html.dark .pv-circle-close:hover,
html.dark .qa-circle-close:hover,
body.dark .pv-circle-close:hover,
body.dark .qa-circle-close:hover {
  background: #32323a !important;
  color: #ffffff !important;
}

[data-theme="dark"] .pv-main-stage-wrap,
html.dark .pv-main-stage-wrap,
body.dark .pv-main-stage-wrap {
  background: #202242 !important;
  border: 1px solid rgba(255, 255, 255, 0.06) !important;
}

[data-theme="dark"] .pv-vert-thumb-btn,
html.dark .pv-vert-thumb-btn,
body.dark .pv-vert-thumb-btn {
  background: #202242 !important;
  border-color: transparent !important;
}

[data-theme="dark"] .pv-vert-thumb-btn:hover,
html.dark .pv-vert-thumb-btn:hover,
body.dark .pv-vert-thumb-btn:hover {
  border-color: rgba(255, 255, 255, 0.25) !important;
}

[data-theme="dark"] .pv-vert-thumb-btn.active,
html.dark .pv-vert-thumb-btn.active,
body.dark .pv-vert-thumb-btn.active {
  border-color: #ffffff !important;
}

[data-theme="dark"] .pv-nav-arrow-btn,
[data-theme="dark"] .pv-stage-share-btn,
html.dark .pv-nav-arrow-btn,
html.dark .pv-stage-share-btn,
body.dark .pv-nav-arrow-btn,
body.dark .pv-stage-share-btn {
  background: #28294C !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  color: #ffffff !important;
}

[data-theme="dark"] .pv-nav-arrow-btn:hover,
[data-theme="dark"] .pv-stage-share-btn:hover,
html.dark .pv-nav-arrow-btn:hover,
html.dark .pv-stage-share-btn:hover,
body.dark .pv-nav-arrow-btn:hover,
body.dark .pv-stage-share-btn:hover {
  background: #32323c !important;
  color: #ffffff !important;
}

[data-theme="dark"] .pv-nav-arrow-btn:active,
[data-theme="dark"] .pv-stage-share-btn:active,
html.dark .pv-nav-arrow-btn:active,
html.dark .pv-stage-share-btn:active,
body.dark .pv-nav-arrow-btn:active,
body.dark .pv-stage-share-btn:active {
  background: #3c3c46 !important;
  transform: scale(0.92) !important;
}

[data-theme="dark"] .pv-stage-share-btn.copied,
html.dark .pv-stage-share-btn.copied,
body.dark .pv-stage-share-btn.copied {
  background: #22c55e !important;
  border-color: #22c55e !important;
  color: #ffffff !important;
}

[data-theme="dark"] .pv-pdp-title,
html.dark .pv-pdp-title,
body.dark .pv-pdp-title {
  color: #ffffff !important;
}

[data-theme="dark"] .pv-pdp-subtitle,
html.dark .pv-pdp-subtitle,
body.dark .pv-pdp-subtitle {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .pv-pdp-price,
html.dark .pv-pdp-price,
body.dark .pv-pdp-price {
  color: #ffffff !important;
}

[data-theme="dark"] .pv-pdp-tax-note,
[data-theme="dark"] .pv-pdp-duties-note,
html.dark .pv-pdp-tax-note,
html.dark .pv-pdp-duties-note,
body.dark .pv-pdp-tax-note,
body.dark .pv-pdp-duties-note {
  color: #8e8e93 !important;
}

[data-theme="dark"] .pv-short-desc,
html.dark .pv-short-desc,
body.dark .pv-short-desc {
  color: #b0b0b8 !important;
}

[data-theme="dark"] .pv-colour-label,
html.dark .pv-colour-label,
body.dark .pv-colour-label {
  color: #8e8e93 !important;
}

[data-theme="dark"] .pv-colour-value,
html.dark .pv-colour-value,
body.dark .pv-colour-value {
  color: #F6EEDF !important;
}

[data-theme="dark"] .pv-shoe-swatch-card,
html.dark .pv-shoe-swatch-card,
body.dark .pv-shoe-swatch-card {
  background: #202242 !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
}

[data-theme="dark"] .pv-shoe-swatch-card:hover,
html.dark .pv-shoe-swatch-card:hover,
body.dark .pv-shoe-swatch-card:hover {
  border-color: rgba(255, 255, 255, 0.3) !important;
}

[data-theme="dark"] .pv-shoe-swatch-card.active,
html.dark .pv-shoe-swatch-card.active,
body.dark .pv-shoe-swatch-card.active {
  border-color: #ffffff !important;
  box-shadow: 0 0 0 1px #ffffff !important;
}

[data-theme="dark"] .pv-details-block,
html.dark .pv-details-block,
body.dark .pv-details-block {
  border-top-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .pv-details-copy,
html.dark .pv-details-copy,
body.dark .pv-details-copy {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .pv-spec-list dt,
html.dark .pv-spec-list dt,
body.dark .pv-spec-list dt {
  color: #8e8e93 !important;
}

[data-theme="dark"] .pv-spec-list dd,
html.dark .pv-spec-list dd,
body.dark .pv-spec-list dd {
  color: #F6EEDF !important;
}

[data-theme="dark"] .pv-size-select-label,
html.dark .pv-size-select-label,
body.dark .pv-size-select-label {
  color: #ffffff !important;
}

[data-theme="dark"] .pv-size-guide-link,
html.dark .pv-size-guide-link,
body.dark .pv-size-guide-link {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .pv-size-guide-link:hover,
html.dark .pv-size-guide-link:hover,
body.dark .pv-size-guide-link:hover {
  color: #ffffff !important;
}

/* The bar needs a visible edge on dark; the rule above only sets a text
   colour, and a transparent box with a near-black border is invisible against
   the dark product panel. */
[data-theme="dark"] .pv-size-chart-bar,
html.dark .pv-size-chart-bar,
body.dark .pv-size-chart-bar {
  color: #e7e7ea !important;
  border-color: rgba(255, 255, 255, 0.22) !important;
}

[data-theme="dark"] .pv-size-chart-bar:hover,
html.dark .pv-size-chart-bar:hover,
body.dark .pv-size-chart-bar:hover {
  background: rgba(255, 255, 255, 0.07) !important;
  border-color: rgba(255, 255, 255, 0.42) !important;
}

[data-theme="dark"] .pv-size-chip,
html.dark .pv-size-chip,
body.dark .pv-size-chip {
  background: #202242 !important;
  color: #F6EEDF !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

[data-theme="dark"] .pv-size-chip:hover:not(.selected):not(.sold-out),
html.dark .pv-size-chip:hover:not(.selected):not(.sold-out),
body.dark .pv-size-chip:hover:not(.selected):not(.sold-out) {
  border-color: #ffffff !important;
  background: #25252e !important;
  color: #ffffff !important;
}

[data-theme="dark"] .pv-size-chip.selected,
[data-theme="dark"] .pv-size-chip.selected:hover,
[data-theme="dark"] .pv-size-chip.selected:focus,
[data-theme="dark"] .pv-size-chip.selected:active,
html.dark .pv-size-chip.selected,
html.dark .pv-size-chip.selected:hover,
html.dark .pv-size-chip.selected:focus,
html.dark .pv-size-chip.selected:active,
body.dark .pv-size-chip.selected,
body.dark .pv-size-chip.selected:hover,
body.dark .pv-size-chip.selected:focus,
body.dark .pv-size-chip.selected:active {
  background: #ffffff !important;
  color: #14152D !important;
  border-color: #ffffff !important;
}

[data-theme="dark"] .pv-size-chip.sold-out,
html.dark .pv-size-chip.sold-out,
body.dark .pv-size-chip.sold-out {
  background: #191B36 !important;
  color: #52525b !important;
  border-color: rgba(255, 255, 255, 0.05) !important;
}

[data-theme="dark"] .pv-size-stock-hint,
html.dark .pv-size-stock-hint,
body.dark .pv-size-stock-hint {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .pv-btn-add-bag,
html.dark .pv-btn-add-bag,
body.dark .pv-btn-add-bag {
  background: #ffffff !important;
  color: #14152D !important;
}

[data-theme="dark"] .pv-btn-add-bag:hover,
html.dark .pv-btn-add-bag:hover,
body.dark .pv-btn-add-bag:hover {
  background: #EDE3D1 !important;
}

[data-theme="dark"] .pv-btn-favourite,
html.dark .pv-btn-favourite,
body.dark .pv-btn-favourite {
  background: transparent !important;
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.25) !important;
}

[data-theme="dark"] .pv-btn-favourite:hover,
html.dark .pv-btn-favourite:hover,
body.dark .pv-btn-favourite:hover {
  border-color: #ffffff !important;
  background: rgba(255, 255, 255, 0.06) !important;
}

[data-theme="dark"] .pv-pdp-services,
html.dark .pv-pdp-services,
body.dark .pv-pdp-services {
  border-top-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .pv-service-item,
html.dark .pv-service-item,
body.dark .pv-service-item {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .pv-service-item svg,
html.dark .pv-service-item svg,
body.dark .pv-service-item svg {
  color: #F6EEDF !important;
}

[data-theme="dark"] .pv-similar-section,
html.dark .pv-similar-section,
body.dark .pv-similar-section {
  border-top-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .pv-similar-title,
html.dark .pv-similar-title,
body.dark .pv-similar-title {
  color: #ffffff !important;
}

[data-theme="dark"] .pv-similar-sub,
html.dark .pv-similar-sub,
body.dark .pv-similar-sub {
  color: #BCB2A3 !important;
}

/* 3D Viewer in PDP */
[data-theme="dark"] .pv-media-stage-wrap,
html.dark .pv-media-stage-wrap,
body.dark .pv-media-stage-wrap {
  background: #202242 !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .pv-3d-toggle-btn,
html.dark .pv-3d-toggle-btn,
body.dark .pv-3d-toggle-btn {
  background: rgba(24, 24, 28, 0.9) !important;
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
}

[data-theme="dark"] .pv-3d-reset-btn,
html.dark .pv-3d-reset-btn,
body.dark .pv-3d-reset-btn {
  background: rgba(28, 28, 34, 0.9) !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
  color: #F6EEDF !important;
}

[data-theme="dark"] .pv-specs-table,
html.dark .pv-specs-table,
body.dark .pv-specs-table {
  border-top-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .pv-spec-cell,
html.dark .pv-spec-cell,
body.dark .pv-spec-cell {
  background: #202242 !important;
  border-color: rgba(255, 255, 255, 0.06) !important;
}

[data-theme="dark"] .pv-spec-cell span,
html.dark .pv-spec-cell span,
body.dark .pv-spec-cell span {
  color: #8e8e93 !important;
}

[data-theme="dark"] .pv-spec-cell strong,
html.dark .pv-spec-cell strong,
body.dark .pv-spec-cell strong {
  color: #F6EEDF !important;
}

/* --- H. QUICK ADD (QA) MODAL --- */
[data-theme="dark"] .quick-add-modal,
html.dark .quick-add-modal,
body.dark .quick-add-modal {
  background: #181A34 !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  box-shadow: 0 32px 80px rgba(0, 0, 0, 0.85) !important;
  color: #F6EEDF !important;
}

[data-theme="dark"] .qa-prod-summary,
html.dark .qa-prod-summary,
body.dark .qa-prod-summary {
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .qa-prod-tag,
html.dark .qa-prod-tag,
body.dark .qa-prod-tag {
  color: #fb923c !important;
}

[data-theme="dark"] .qa-prod-img-box,
html.dark .qa-prod-img-box,
body.dark .qa-prod-img-box {
  background: #202242 !important;
}

[data-theme="dark"] .qa-prod-title,
html.dark .qa-prod-title,
body.dark .qa-prod-title {
  color: #ffffff !important;
}

[data-theme="dark"] .qa-prod-sub,
html.dark .qa-prod-sub,
body.dark .qa-prod-sub {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .qa-prod-price,
html.dark .qa-prod-price,
body.dark .qa-prod-price {
  color: #ffffff !important;
}

[data-theme="dark"] .qa-section-title,
html.dark .qa-section-title,
body.dark .qa-section-title {
  color: #ffffff !important;
}

[data-theme="dark"] .qa-selected-color-name,
html.dark .qa-selected-color-name,
body.dark .qa-selected-color-name {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .qa-swatch-thumb-btn,
html.dark .qa-swatch-thumb-btn,
body.dark .qa-swatch-thumb-btn {
  background: #202242 !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
}

[data-theme="dark"] .qa-swatch-thumb-btn.active,
html.dark .qa-swatch-thumb-btn.active,
body.dark .qa-swatch-thumb-btn.active {
  border-color: #ffffff !important;
  box-shadow: 0 0 0 2px #181A34, 0 0 0 4px #ffffff !important;
}

[data-theme="dark"] .qa-size-chip,
html.dark .qa-size-chip,
body.dark .qa-size-chip {
  background: #202242 !important;
  color: #F6EEDF !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

[data-theme="dark"] .qa-size-chip:hover:not(.active):not(.selected):not(.disabled):not([disabled]),
html.dark .qa-size-chip:hover:not(.active):not(.selected):not(.disabled):not([disabled]),
body.dark .qa-size-chip:hover:not(.active):not(.selected):not(.disabled):not([disabled]) {
  border-color: #ffffff !important;
  background: #25252e !important;
  color: #ffffff !important;
}

[data-theme="dark"] .qa-size-chip.active,
[data-theme="dark"] .qa-size-chip.selected,
[data-theme="dark"] .qa-size-chip.active:hover,
[data-theme="dark"] .qa-size-chip.selected:hover,
[data-theme="dark"] .qa-size-chip.active:focus,
[data-theme="dark"] .qa-size-chip.selected:focus,
html.dark .qa-size-chip.active,
html.dark .qa-size-chip.selected,
html.dark .qa-size-chip.active:hover,
html.dark .qa-size-chip.selected:hover,
html.dark .qa-size-chip.active:focus,
html.dark .qa-size-chip.selected:focus,
body.dark .qa-size-chip.active,
body.dark .qa-size-chip.selected,
body.dark .qa-size-chip.active:hover,
body.dark .qa-size-chip.selected:hover,
body.dark .qa-size-chip.active:focus,
body.dark .qa-size-chip.selected:focus {
  background: #ffffff !important;
  color: #14152D !important;
  border-color: #ffffff !important;
  font-weight: 700 !important;
}

[data-theme="dark"] .qa-size-chip.disabled,
[data-theme="dark"] .qa-size-chip[disabled],
html.dark .qa-size-chip.disabled,
html.dark .qa-size-chip[disabled],
body.dark .qa-size-chip.disabled,
body.dark .qa-size-chip[disabled] {
  background: #191B36 !important;
  color: #52525b !important;
  border-color: rgba(255, 255, 255, 0.05) !important;
}

[data-theme="dark"] .qa-submit-btn,
html.dark .qa-submit-btn,
body.dark .qa-submit-btn {
  background: #ffffff !important;
  color: #14152D !important;
  border-color: #ffffff !important;
}

[data-theme="dark"] .qa-submit-btn:hover,
html.dark .qa-submit-btn:hover,
body.dark .qa-submit-btn:hover {
  background: #EDE3D1 !important;
  border-color: #EDE3D1 !important;
}

/* --- I. ACCOUNT PORTAL & MODALS & CART SHEET --- */
[data-theme="dark"] .modal-content,
[data-theme="dark"] .cart-sheet,
[data-theme="dark"] .auth-modal,
[data-theme="dark"] .account-portal-box,
html.dark .modal-content,
html.dark .cart-sheet,
html.dark .auth-modal,
html.dark .account-portal-box,
body.dark .modal-content,
body.dark .cart-sheet,
body.dark .auth-modal,
body.dark .account-portal-box {
  background: #181A34 !important;
  color: #F6EEDF !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

/* The sign-in modal's "Create Account" link and submit button are #14152D in
   components.css and had no dark rule: on the #181A34 card above they measured
   1.03:1 -- the link was invisible and the button had no edge. */
[data-theme="dark"] .auth-text-link,
html.dark .auth-text-link,
body.dark .auth-text-link {
  color: #F6EEDF !important;
}
[data-theme="dark"] .auth-submit-btn,
html.dark .auth-submit-btn,
body.dark .auth-submit-btn {
  background: #F6EEDF !important;
  border-color: #F6EEDF !important;
  color: #14152D !important;
}

[data-theme="dark"] .cart-item,
html.dark .cart-item,
body.dark .cart-item {
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .cart-footer,
html.dark .cart-footer,
body.dark .cart-footer {
  background: #1B1D39 !important;
  border-top-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] input,
[data-theme="dark"] select,
[data-theme="dark"] textarea,
html.dark input,
html.dark select,
html.dark textarea,
body.dark input,
body.dark select,
body.dark textarea {
  background-color: #1f1f24 !important;
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.14) !important;
}

/* Consent Bar */
[data-theme="dark"] .consent-bar,
html.dark .consent-bar,
body.dark .consent-bar {
  background: #191B36 !important;
  border-top-color: rgba(255, 255, 255, 0.1) !important;
  color: #d1d1d6 !important;
}

/* --- J. FOOTER --- */
[data-theme="dark"] footer,
[data-theme="dark"] .footer,
[data-theme="dark"] .club-footer,
html.dark footer,
html.dark .footer,
html.dark .club-footer,
body.dark footer,
body.dark .footer,
body.dark .club-footer {
  background: #09090b !important;
  border-top-color: rgba(255, 255, 255, 0.08) !important;
  color: #BCB2A3 !important;
}

[data-theme="dark"] .club-footer a,
[data-theme="dark"] .footer a,
html.dark .club-footer a,
html.dark .footer a,
body.dark .club-footer a,
body.dark .footer a {
  color: #d1d1d6 !important;
}

[data-theme="dark"] .club-footer a:hover,
[data-theme="dark"] .footer a:hover,
html.dark .club-footer a:hover,
html.dark .footer a:hover,
body.dark .club-footer a:hover,
body.dark .footer a:hover {
  color: #ffffff !important;
}

[data-theme="dark"] .club-footer-heading,
html.dark .club-footer-heading,
body.dark .club-footer-heading {
  color: #ffffff !important;
}

[data-theme="dark"] .club-footer-bar,
html.dark .club-footer-bar,
body.dark .club-footer-bar {
  border-top-color: rgba(255, 255, 255, 0.08) !important;
  color: #8e8e93 !important;
}

[data-theme="dark"] .club-footer-mark,
html.dark .club-footer-mark,
body.dark .club-footer-mark {
  color: #ffffff !important;
  opacity: 0.06 !important;
}

/* ============================================================
   K. LUXURY OBSIDIAN DARK MODE REFINEMENTS:
   Pills, Account Portal Tabs, Wishlist Drawer & Bag Popover
   ============================================================ */

/* 1. Pill Action Buttons */
[data-theme="dark"] .pill.dark,
html.dark .pill.dark,
body.dark .pill.dark {
  background: #ffffff !important;
  color: #14152D !important;
  border: 1px solid #ffffff !important;
  font-weight: 700 !important;
}

[data-theme="dark"] .pill.dark:hover,
html.dark .pill.dark:hover,
body.dark .pill.dark:hover {
  background: #EDE3D1 !important;
  color: #000000 !important;
  border-color: #EDE3D1 !important;
  transform: translateY(-1px) !important;
}

[data-theme="dark"] .pill.ghost,
html.dark .pill.ghost,
body.dark .pill.ghost {
  background: transparent !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  color: #F6EEDF !important;
}

[data-theme="dark"] .pill.ghost:hover,
html.dark .pill.ghost:hover,
body.dark .pill.ghost:hover {
  background: rgba(255, 255, 255, 0.08) !important;
  color: #ffffff !important;
}

/* 2. Customer Account Portal Tabs & Cards */
[data-theme="dark"] .account-tabs,
html.dark .account-tabs,
body.dark .account-tabs {
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .account-tab-btn,
html.dark .account-tab-btn,
body.dark .account-tab-btn {
  background: #232546 !important;
  color: #BCB2A3 !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .account-tab-btn:hover,
html.dark .account-tab-btn:hover,
body.dark .account-tab-btn:hover {
  background: #2b2b35 !important;
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.16) !important;
}

[data-theme="dark"] .account-tab-btn.active,
html.dark .account-tab-btn.active,
body.dark .account-tab-btn.active {
  background: #ffffff !important;
  color: #14152D !important;
  border-color: #ffffff !important;
  font-weight: 700 !important;
}

[data-theme="dark"] .account-empty-card,
html.dark .account-empty-card,
body.dark .account-empty-card {
  background: #202242 !important;
  color: #BCB2A3 !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .account-empty-card h4,
html.dark .account-empty-card h4,
body.dark .account-empty-card h4 {
  color: #ffffff !important;
}

[data-theme="dark"] .account-empty-card p,
html.dark .account-empty-card p,
body.dark .account-empty-card p {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .account-empty-card svg,
html.dark .account-empty-card svg,
body.dark .account-empty-card svg {
  color: #71717a !important;
}

[data-theme="dark"] .order-history-card,
html.dark .order-history-card,
body.dark .order-history-card {
  background: #202242 !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
  color: #F6EEDF !important;
}

[data-theme="dark"] .order-card-header,
html.dark .order-card-header,
body.dark .order-card-header {
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .order-card-footer,
html.dark .order-card-footer,
body.dark .order-card-footer {
  border-top-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .order-id-label,
html.dark .order-id-label,
body.dark .order-id-label {
  color: #ffffff !important;
}

[data-theme="dark"] .order-item-info h5,
html.dark .order-item-info h5,
body.dark .order-item-info h5 {
  color: #ffffff !important;
}

[data-theme="dark"] .order-item-price,
html.dark .order-item-price,
body.dark .order-item-price {
  color: #ffffff !important;
}

[data-theme="dark"] .saved-address-card,
html.dark .saved-address-card,
body.dark .saved-address-card {
  background: #202242 !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
  color: #F6EEDF !important;
}

[data-theme="dark"] .saved-address-card.default,
html.dark .saved-address-card.default,
body.dark .saved-address-card.default {
  background: rgba(56, 189, 248, 0.08) !important;
  border-color: rgba(56, 189, 248, 0.4) !important;
}

[data-theme="dark"] #accountSignOutBtn,
[data-theme="dark"] #btnRevokeAllSessions,
[data-theme="dark"] .account-portal-box .btn-secondary,
html.dark #accountSignOutBtn,
html.dark #btnRevokeAllSessions,
html.dark .account-portal-box .btn-secondary,
body.dark #accountSignOutBtn,
body.dark #btnRevokeAllSessions,
body.dark .account-portal-box .btn-secondary {
  background: #25252c !important;
  color: #F6EEDF !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

[data-theme="dark"] #accountSignOutBtn:hover,
[data-theme="dark"] #btnRevokeAllSessions:hover,
[data-theme="dark"] .account-portal-box .btn-secondary:hover,
html.dark #accountSignOutBtn:hover,
html.dark #btnRevokeAllSessions:hover,
html.dark .account-portal-box .btn-secondary:hover,
body.dark #accountSignOutBtn:hover,
body.dark #btnRevokeAllSessions:hover,
body.dark .account-portal-box .btn-secondary:hover {
  background: #32323c !important;
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.22) !important;
}

/* 3. Wishlist Drawer & Cart Drawer */
[data-theme="dark"] .cart-drawer,
[data-theme="dark"] #wishlistDrawer,
[data-theme="dark"] #cartDrawer,
html.dark .cart-drawer,
html.dark #wishlistDrawer,
html.dark #cartDrawer,
body.dark .cart-drawer,
body.dark #wishlistDrawer,
body.dark #cartDrawer {
  background: #181A34 !important;
  color: #F6EEDF !important;
  border-left: 1px solid rgba(255, 255, 255, 0.1) !important;
  box-shadow: -10px 0 40px rgba(0, 0, 0, 0.65) !important;
}

[data-theme="dark"] .cart-drawer .drawer-head,
html.dark .cart-drawer .drawer-head,
body.dark .cart-drawer .drawer-head {
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .cart-drawer .drawer-head h3,
html.dark .cart-drawer .drawer-head h3,
body.dark .cart-drawer .drawer-head h3 {
  color: #ffffff !important;
}

[data-theme="dark"] .cart-drawer .btn-close,
html.dark .cart-drawer .btn-close,
body.dark .cart-drawer .btn-close {
  background: #28294C !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

[data-theme="dark"] .cart-drawer .btn-close:hover,
html.dark .cart-drawer .btn-close:hover,
body.dark .cart-drawer .btn-close:hover {
  background: #32323a !important;
  color: #ffffff !important;
}

[data-theme="dark"] .wish-size-select,
html.dark .wish-size-select,
body.dark .wish-size-select {
  background: #232546 !important;
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.14) !important;
}

[data-theme="dark"] .wish-move-btn,
html.dark .wish-move-btn,
body.dark .wish-move-btn {
  background: #ffffff !important;
  color: #14152D !important;
  border: 1px solid #ffffff !important;
  font-weight: 700 !important;
}

[data-theme="dark"] .wish-move-btn:hover,
html.dark .wish-move-btn:hover,
body.dark .wish-move-btn:hover {
  background: #EDE3D1 !important;
  color: #000000 !important;
}

[data-theme="dark"] .wish-del-btn,
html.dark .wish-del-btn,
body.dark .wish-del-btn {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .wish-del-btn:hover,
html.dark .wish-del-btn:hover,
body.dark .wish-del-btn:hover {
  color: #ef4444 !important;
}

[data-theme="dark"] .cart-drawer .drawer-foot,
html.dark .cart-drawer .drawer-foot,
/* The bag promo row's own rule sits below it, not above, so dark mode has to
   recolour the bottom edge -- .checkout-promo-row's dark rule only knows about
   border-top. */
[data-theme="dark"] .drawer-promo-row,
html.dark .drawer-promo-row,
body.dark .drawer-promo-row {
  border-top: none !important;
  border-bottom-color: rgba(255, 255, 255, 0.12) !important;
}

/* The dark HOVER state for the Apply button.

   The shared .checkout-promo-row rule in modals.css already flips the button to
   white-on-black for dark mode, and it reaches this one too. What it does not
   have is a dark hover: .checkout-promo-row button:hover goes to #333336, which
   on the now-white button means it darkens to near-black under the cursor and
   the label disappears. The background is restated alongside it so the pair
   cannot drift apart. */
[data-theme="dark"] .drawer-promo-row button,
html.dark .drawer-promo-row button,
body.dark .drawer-promo-row button {
  background: #ffffff !important;
  background-color: #ffffff !important;
  color: #14152D !important;
  border-color: #ffffff !important;
}
[data-theme="dark"] .drawer-promo-row button:hover,
html.dark .drawer-promo-row button:hover,
body.dark .drawer-promo-row button:hover {
  background: #e5e5e7 !important;
  background-color: #e5e5e7 !important;
}

body.dark .cart-drawer .drawer-foot {
  background: #1B1D39 !important;
  border-top-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .cart-drawer .cart-item,
html.dark .cart-drawer .cart-item,
body.dark .cart-drawer .cart-item {
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .cart-drawer .cart-item-img,
html.dark .cart-drawer .cart-item-img,
body.dark .cart-drawer .cart-item-img {
  background: #F3E6CC !important;
}

[data-theme="dark"] .cart-drawer .cart-item-info h4,
html.dark .cart-drawer .cart-item-info h4,
body.dark .cart-drawer .cart-item-info h4 {
  color: #ffffff !important;
}

[data-theme="dark"] .cart-drawer .cart-item-meta,
html.dark .cart-drawer .cart-item-meta,
body.dark .cart-drawer .cart-item-meta {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .cart-drawer .item-price,
html.dark .cart-drawer .item-price,
body.dark .cart-drawer .item-price {
  color: #ffffff !important;
}

[data-theme="dark"] .cart-drawer .qty-ctrl,
[data-theme="dark"] .bag-dropdown-menu .qty-ctrl,
html.dark .cart-drawer .qty-ctrl,
html.dark .bag-dropdown-menu .qty-ctrl,
body.dark .cart-drawer .qty-ctrl,
body.dark .bag-dropdown-menu .qty-ctrl {
  border-color: rgba(242, 224, 190, 0.2) !important;
  color: #ffffff !important;
}

[data-theme="dark"] .cart-drawer .cart-summary-row.total,
html.dark .cart-drawer .cart-summary-row.total,
body.dark .cart-drawer .cart-summary-row.total {
  color: #ffffff !important;
  border-top-color: rgba(255, 255, 255, 0.1) !important;
}

[data-theme="dark"] .cart-drawer .free-shipping-bar,
html.dark .cart-drawer .free-shipping-bar,
body.dark .cart-drawer .free-shipping-bar {
  background: rgba(16, 185, 129, 0.12) !important;
  color: #34d399 !important;
  border: 1px solid rgba(16, 185, 129, 0.2) !important;
}

/* 4. Bag Dropdown Menu Popover */
[data-theme="dark"] .bag-dropdown-menu,
html.dark .bag-dropdown-menu,
body.dark .bag-dropdown-menu {
  background: #181A34 !important;
  border: 1px solid rgba(242, 224, 190, 0.14) !important;
  box-shadow: 0 30px 60px rgba(0, 0, 0, 0.75) !important;
  color: #F6EEDF !important;
}

[data-theme="dark"] .bag-empty-heading,
html.dark .bag-empty-heading,
body.dark .bag-empty-heading {
  color: #ffffff !important;
}

[data-theme="dark"] .bag-signin-note,
html.dark .bag-signin-note,
body.dark .bag-signin-note {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .bag-profile-sec,
html.dark .bag-profile-sec,
body.dark .bag-profile-sec {
  border-top-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .bag-profile-title,
html.dark .bag-profile-title,
body.dark .bag-profile-title {
  color: #8e8e93 !important;
}

[data-theme="dark"] .bag-profile-links li a,
html.dark .bag-profile-links li a,
body.dark .bag-profile-links li a {
  color: #F6EEDF !important;
}

[data-theme="dark"] .bag-profile-links li a:hover,
html.dark .bag-profile-links li a:hover,
body.dark .bag-profile-links li a:hover {
  color: #A9ADF0 !important;
}

[data-theme="dark"] .bag-dropdown-menu .cart-item,
html.dark .bag-dropdown-menu .cart-item,
body.dark .bag-dropdown-menu .cart-item {
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .bag-dropdown-menu .cart-item-img,
html.dark .bag-dropdown-menu .cart-item-img,
body.dark .bag-dropdown-menu .cart-item-img {
  background: #F3E6CC !important;
}

[data-theme="dark"] .bag-dropdown-menu .cart-item-info h4,
html.dark .bag-dropdown-menu .cart-item-info h4,
body.dark .bag-dropdown-menu .cart-item-info h4 {
  color: #ffffff !important;
}

[data-theme="dark"] .bag-dropdown-menu .cart-item-meta,
html.dark .bag-dropdown-menu .cart-item-meta,
body.dark .bag-dropdown-menu .cart-item-meta {
  color: #BCB2A3 !important;
}

/* The focus ring on a row's product link (modals.css) is the page's indigo, which a dark panel swallows. */
[data-theme="dark"] .cart-item-link:focus-visible,
html.dark .cart-item-link:focus-visible,
body.dark .cart-item-link:focus-visible {
  outline-color: #A9ADF0;
}

/* ============================================================
   L. MEGA MENU DARK MODE (EXPLORE MEN / WOMEN / KIDS / BRANDS)
   ============================================================ */
[data-theme="dark"] .mega,
html.dark .mega,
body.dark .mega {
  background: #14152D !important; /* the night indigo of the bar, not a neutral black */
  border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.75) !important;
}

[data-theme="dark"] .mega-eyebrow,
html.dark .mega-eyebrow,
body.dark .mega-eyebrow {
  color: #8e8e93 !important;
}

[data-theme="dark"] .mega-list-primary li a,
html.dark .mega-list-primary li a,
body.dark .mega-list-primary li a {
  color: #F6EEDF !important;
}

[data-theme="dark"] .mega-list-primary li a:hover,
html.dark .mega-list-primary li a:hover,
body.dark .mega-list-primary li a:hover {
  color: #A9ADF0 !important;
}

[data-theme="dark"] .mega-list-secondary li a,
html.dark .mega-list-secondary li a,
body.dark .mega-list-secondary li a {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .mega-list-secondary li a:hover,
html.dark .mega-list-secondary li a:hover,
body.dark .mega-list-secondary li a:hover {
  color: #ffffff !important;
}

/* ============================================================
   M. GLOBAL MODAL & DIALOG CLOSE BUTTONS
   ============================================================ */
[data-theme="dark"] .btn-close,
html.dark .btn-close,
body.dark .btn-close {
  background: #28294C !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.12) !important;
}

[data-theme="dark"] .btn-close:hover,
html.dark .btn-close:hover,
body.dark .btn-close:hover {
  background: #32323a !important;
  color: #ffffff !important;
  border-color: rgba(255, 255, 255, 0.22) !important;
}

/* ============================================================
   N. MOBILE NAVIGATION DRAWER (ACCORDION ITEMS & TOOL CARDS)
   ============================================================ */
[data-theme="dark"] .msheet-item-text,
html.dark .msheet-item-text,
body.dark .msheet-item-text {
  color: #F6EEDF !important;
}

[data-theme="dark"] .msheet-chevron,
html.dark .msheet-chevron,
body.dark .msheet-chevron {
  color: #8e8e93 !important;
}

[data-theme="dark"] .msheet-acc-item.open .msheet-chevron,
html.dark .msheet-acc-item.open .msheet-chevron,
body.dark .msheet-acc-item.open .msheet-chevron {
  color: #ffffff !important;
}

[data-theme="dark"] .msheet-select-text,
html.dark .msheet-select-text,
body.dark .msheet-select-text,
[data-theme="dark"] .msheet-item-text.msheet-select-text,
html.dark .msheet-item-text.msheet-select-text,
body.dark .msheet-item-text.msheet-select-text {
  color: #E3A6B1 !important;
}

[data-theme="dark"] .msheet-select-chevron,
html.dark .msheet-select-chevron,
body.dark .msheet-select-chevron {
  color: #E3A6B1 !important;
}

[data-theme="dark"] .msheet-sub-link,
html.dark .msheet-sub-link,
body.dark .msheet-sub-link {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .msheet-sub-link:hover,
html.dark .msheet-sub-link:hover,
body.dark .msheet-sub-link:hover {
  color: #ffffff !important;
}

[data-theme="dark"] .msheet-sub-link.is-primary,
html.dark .msheet-sub-link.is-primary,
body.dark .msheet-sub-link.is-primary {
  color: #ffffff !important;
}

[data-theme="dark"] .msheet-sub-arrow,
html.dark .msheet-sub-arrow,
body.dark .msheet-sub-arrow {
  color: #71717a !important;
}

[data-theme="dark"] .msheet-sub-heading,
html.dark .msheet-sub-heading,
body.dark .msheet-sub-heading {
  color: #8e8e93 !important;
}

[data-theme="dark"] .msheet-tool-card,
html.dark .msheet-tool-card,
body.dark .msheet-tool-card {
  background: #202242 !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
  color: #F6EEDF !important;
}

[data-theme="dark"] .msheet-tool-card:hover,
html.dark .msheet-tool-card:hover,
body.dark .msheet-tool-card:hover {
  background: #24242c !important;
  border-color: rgba(255, 255, 255, 0.16) !important;
}

[data-theme="dark"] .msheet-tool-card svg,
html.dark .msheet-tool-card svg,
body.dark .msheet-tool-card svg {
  color: #F6EEDF !important;
  stroke: #F6EEDF !important;
}

[data-theme="dark"] .msheet-tool-title,
html.dark .msheet-tool-title,
body.dark .msheet-tool-title {
  color: #ffffff !important;
}

[data-theme="dark"] .msheet-tool-sub,
html.dark .msheet-tool-sub,
body.dark .msheet-tool-sub {
  color: #8e8e93 !important;
}

[data-theme="dark"] #customerAccountCloseBtn,
html.dark #customerAccountCloseBtn,
body.dark #customerAccountCloseBtn {
  background: rgba(255, 255, 255, 0.1) !important;
  color: #ffffff !important;
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
}

[data-theme="dark"] #customerAccountCloseBtn:hover,
html.dark #customerAccountCloseBtn:hover,
body.dark #customerAccountCloseBtn:hover {
  background: rgba(255, 255, 255, 0.2) !important;
  color: #ffffff !important;
}

/* ============================================================
   O. LEGAL & POLICY PAGES (PRIVACY, TERMS, STORE CLAIM, REFUND)
   ============================================================ */
[data-theme="dark"] .legal-page,
html.dark .legal-page,
body.dark .legal-page {
  background: #0d0d0f !important;
  color: #F6EEDF !important;
}

[data-theme="dark"] .legal-head,
html.dark .legal-head,
body.dark .legal-head {
  border-bottom-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .legal-back,
html.dark .legal-back,
body.dark .legal-back {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .legal-back:hover,
html.dark .legal-back:hover,
body.dark .legal-back:hover {
  color: #ffffff !important;
}

[data-theme="dark"] .legal-eyebrow,
html.dark .legal-eyebrow,
body.dark .legal-eyebrow {
  color: #8e8e93 !important;
}

[data-theme="dark"] .legal-title,
html.dark .legal-title,
body.dark .legal-title {
  color: #ffffff !important;
}

[data-theme="dark"] .legal-sub,
html.dark .legal-sub,
body.dark .legal-sub {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .legal-meta,
html.dark .legal-meta,
body.dark .legal-meta {
  color: #8e8e93 !important;
}

[data-theme="dark"] .legal-callout,
html.dark .legal-callout,
body.dark .legal-callout {
  background: #1B1D39 !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
  border-left: 3px solid #A9ADF0 !important;
  color: #d1d1d6 !important;
}

[data-theme="dark"] .legal-callout strong,
html.dark .legal-callout strong,
body.dark .legal-callout strong {
  color: #ffffff !important;
}

[data-theme="dark"] .legal-toc,
html.dark .legal-toc,
body.dark .legal-toc {
  background: #191B36 !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .legal-toc-title,
html.dark .legal-toc-title,
body.dark .legal-toc-title {
  color: #8e8e93 !important;
}

[data-theme="dark"] .legal-toc li,
html.dark .legal-toc li,
body.dark .legal-toc li {
  color: #8e8e93 !important;
}

[data-theme="dark"] .legal-toc a,
html.dark .legal-toc a,
body.dark .legal-toc a {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .legal-toc a:hover,
html.dark .legal-toc a:hover,
body.dark .legal-toc a:hover {
  color: #A9ADF0 !important;
}

[data-theme="dark"] .legal-section h2,
html.dark .legal-section h2,
body.dark .legal-section h2 {
  color: #ffffff !important;
}

[data-theme="dark"] .legal-section p,
[data-theme="dark"] .legal-section li,
html.dark .legal-section p,
html.dark .legal-section li,
body.dark .legal-section p,
body.dark .legal-section li {
  color: #d1d1d6 !important;
}

[data-theme="dark"] .legal-section strong,
html.dark .legal-section strong,
body.dark .legal-section strong {
  color: #ffffff !important;
}

[data-theme="dark"] .legal-note,
html.dark .legal-note,
body.dark .legal-note {
  color: #BCB2A3 !important;
  border-left-color: rgba(255, 255, 255, 0.15) !important;
}

[data-theme="dark"] .legal-highlight,
html.dark .legal-highlight,
body.dark .legal-highlight {
  background: #1D1F3C !important;
  color: #ffffff !important;
}

[data-theme="dark"] .legal-contact a,
html.dark .legal-contact a,
body.dark .legal-contact a {
  color: #A9ADF0 !important;
}

[data-theme="dark"] .legal-defs li,
html.dark .legal-defs li,
body.dark .legal-defs li {
  border-left-color: rgba(255, 255, 255, 0.14) !important;
}

[data-theme="dark"] .legal-pending,
html.dark .legal-pending,
body.dark .legal-pending {
  background: rgba(245, 185, 60, 0.18) !important;
  color: #f5c26b !important;
}

[data-theme="dark"] .legal-table th,
html.dark .legal-table th,
body.dark .legal-table th {
  background: #202242 !important;
  color: #ffffff !important;
  border-bottom-color: rgba(255, 255, 255, 0.1) !important;
}

[data-theme="dark"] .legal-table td,
html.dark .legal-table td,
body.dark .legal-table td {
  border-bottom-color: rgba(255, 255, 255, 0.06) !important;
  color: #d1d1d6 !important;
}

[data-theme="dark"] .legal-crosslink,
html.dark .legal-crosslink,
body.dark .legal-crosslink {
  border-top-color: rgba(255, 255, 255, 0.08) !important;
  color: #8e8e93 !important;
}

[data-theme="dark"] .legal-crosslink a,
html.dark .legal-crosslink a,
body.dark .legal-crosslink a {
  color: #A9ADF0 !important;
}



[data-theme="dark"] .pdp-img,
html.dark .pdp-img,
body.dark .pdp-img { background: #1D1F3C !important; }

[data-theme="dark"] .pdp-sizes li,
html.dark .pdp-sizes li,
body.dark .pdp-sizes li { border-color: rgba(255, 255, 255, 0.16) !important; }

[data-theme="dark"] .pdp-cta,
html.dark .pdp-cta,
body.dark .pdp-cta { background: #ffffff !important; color: #14152D !important; }


/* Logo lockups. The light file is dark ink and would vanish on a dark ground,
   so the dark variant is a separate file: the same artwork in its own
   off-white -- see scripts/build_brand_assets.py.

   Follows the same show/hide pattern as the moon/sun theme icons. */
.logo-pic-dark { display: none; }
[data-theme="dark"] .logo-pic-light,
html.dark .logo-pic-light,
body.dark .logo-pic-light { display: none !important; }
[data-theme="dark"] .logo-pic-dark,
html.dark .logo-pic-dark,
body.dark .logo-pic-dark { display: block !important; }

/* The fit finder's and the product quiz's card at night (their contents use tokens). */
[data-theme="dark"] .wizard-box,
html.dark .wizard-box,
body.dark .wizard-box {
  background: #1B1D39 !important;
  color: #F6EEDF !important;
  border: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* Dark Mode for Dedicated Size Matrix & Tabs */
[data-theme="dark"] .nike-size-dept-tabs,
html.dark .nike-size-dept-tabs,
body.dark .nike-size-dept-tabs {
  background: #242647 !important;
}
[data-theme="dark"] .nike-size-dept-tab,
html.dark .nike-size-dept-tab,
body.dark .nike-size-dept-tab {
  color: #a0a0a8 !important;
}
[data-theme="dark"] .nike-size-dept-tab:hover,
html.dark .nike-size-dept-tab:hover,
body.dark .nike-size-dept-tab:hover {
  color: #ffffff !important;
}
[data-theme="dark"] .nike-size-dept-tab.active,
html.dark .nike-size-dept-tab.active,
body.dark .nike-size-dept-tab.active {
  background: #ffffff !important;
  color: #14152D !important;
}
[data-theme="dark"] .nike-size-subhead,
html.dark .nike-size-subhead,
body.dark .nike-size-subhead {
  color: #a0a0a8 !important;
}
[data-theme="dark"] .nike-acc-badge,
html.dark .nike-acc-badge,
body.dark .nike-acc-badge {
  background: #ffffff !important;
  color: #14152D !important;
}

/* ============================================================
   DARK MODE OVERRIDES: CATEGORY & BRAND DISCOVERY MODAL
   ============================================================ */
[data-theme="dark"] .discovery-modal,
html.dark .discovery-modal,
body.dark .discovery-modal {
  background: #191B36 !important;
  box-shadow: 0 32px 80px rgba(0, 0, 0, 0.7) !important;
}

[data-theme="dark"] .discovery-title,
html.dark .discovery-title,
body.dark .discovery-title {
  color: #F6EEDF !important;
}

[data-theme="dark"] .discovery-subtitle,
html.dark .discovery-subtitle,
body.dark .discovery-subtitle {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .discovery-close-btn,
html.dark .discovery-close-btn,
body.dark .discovery-close-btn,
[data-theme="dark"] .discovery-back-btn,
html.dark .discovery-back-btn,
body.dark .discovery-back-btn {
  background: #22222a !important;
  color: #F6EEDF !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
}

[data-theme="dark"] .discovery-close-btn:hover,
html.dark .discovery-close-btn:hover,
body.dark .discovery-close-btn:hover,
[data-theme="dark"] .discovery-back-btn:hover,
html.dark .discovery-back-btn:hover,
body.dark .discovery-back-btn:hover {
  background: #2c2c36 !important;
}

[data-theme="dark"] .discovery-card.category-card,
html.dark .discovery-card.category-card,
body.dark .discovery-card.category-card,
[data-theme="dark"] .discovery-brand-tile,
html.dark .discovery-brand-tile,
body.dark .discovery-brand-tile {
  background: #202242 !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

[data-theme="dark"] .discovery-card.category-card:hover,
html.dark .discovery-card.category-card:hover,
body.dark .discovery-card.category-card:hover,
[data-theme="dark"] .discovery-brand-tile:hover,
html.dark .discovery-brand-tile:hover,
body.dark .discovery-brand-tile:hover {
  background: #24242c !important;
  border-color: rgba(255, 255, 255, 0.28) !important;
}

[data-theme="dark"] .category-tile-icon,
html.dark .category-tile-icon,
body.dark .category-tile-icon {
  background: #25252e !important;
  color: #F6EEDF !important;
  border-color: rgba(255, 255, 255, 0.06) !important;
}

[data-theme="dark"] .discovery-card.category-card:hover .category-tile-icon,
html.dark .discovery-card.category-card:hover .category-tile-icon,
body.dark .discovery-card.category-card:hover .category-tile-icon {
  background: #ffffff !important;
  color: #14152D !important;
  border-color: #ffffff !important;
}

[data-theme="dark"] .category-tile-name,
html.dark .category-tile-name,
body.dark .category-tile-name,
[data-theme="dark"] .brand-tile-name,
html.dark .brand-tile-name,
body.dark .brand-tile-name {
  color: #F6EEDF !important;
}

[data-theme="dark"] .category-tile-badge,
html.dark .category-tile-badge,
body.dark .category-tile-badge {
  background: #272730 !important;
  color: #BCB2A3 !important;
}

[data-theme="dark"] .category-tile-desc,
html.dark .category-tile-desc,
body.dark .category-tile-desc {
  color: #888892 !important;
}

[data-theme="dark"] .discovery-shop-all-btn,
html.dark .discovery-shop-all-btn,
body.dark .discovery-shop-all-btn,
[data-theme="dark"] .discovery-explore-all-btn,
html.dark .discovery-explore-all-btn,
body.dark .discovery-explore-all-btn {
  background: #ffffff !important;
  color: #14152D !important;
  border-color: #ffffff !important;
}

[data-theme="dark"] .discovery-shop-all-btn:hover,
html.dark .discovery-shop-all-btn:hover,
body.dark .discovery-shop-all-btn:hover,
[data-theme="dark"] .discovery-explore-all-btn:hover,
html.dark .discovery-explore-all-btn:hover,
body.dark .discovery-explore-all-btn:hover {
  background: #f0f0f2 !important;
}

[data-theme="dark"] .discovery-shop-all-btn .shop-all-badge,
html.dark .discovery-shop-all-btn .shop-all-badge,
body.dark .discovery-shop-all-btn .shop-all-badge,
[data-theme="dark"] .discovery-explore-all-btn .explore-all-badge,
html.dark .discovery-explore-all-btn .explore-all-badge,
body.dark .discovery-explore-all-btn .explore-all-badge {
  background: rgba(0, 0, 0, 0.08) !important;
  color: #14152D !important;
}

[data-theme="dark"] .discovery-shop-all-btn .shop-all-badge.in-stock,
html.dark .discovery-shop-all-btn .shop-all-badge.in-stock,
body.dark .discovery-shop-all-btn .shop-all-badge.in-stock,
[data-theme="dark"] .discovery-explore-all-btn .explore-all-badge.in-stock,
html.dark .discovery-explore-all-btn .explore-all-badge.in-stock,
body.dark .discovery-explore-all-btn .explore-all-badge.in-stock {
  background: #E3A6B1 !important;
  color: #ffffff !important;
}

[data-theme="dark"] .brand-tile-badge.in-stock,
html.dark .brand-tile-badge.in-stock,
body.dark .brand-tile-badge.in-stock {
  background: rgba(168, 117, 80, 0.22) !important;
  color: #c5926b !important;
}

[data-theme="dark"] .select945-num,
html.dark .select945-num,
body.dark .select945-num {
  color: #f4f4f5 !important;
}

[data-theme="dark"] .select945-word,
html.dark .select945-word,
body.dark .select945-word {
  color: #E3A6B1 !important;
}

[data-theme="dark"] .select945-sub,
html.dark .select945-sub,
body.dark .select945-sub {
  color: #BCB2A3 !important;
}

[data-theme="dark"] .select945-cta,
html.dark .select945-cta,
body.dark .select945-cta {
  color: #f4f4f5 !important;
  border-bottom-color: #E3A6B1 !important;
}

[data-theme="dark"] .select945-rule,
html.dark .select945-rule,
body.dark .select945-rule {
  background: rgba(255, 255, 255, 0.12) !important;
}

[data-theme="dark"] #select945Rail .pname,
html.dark #select945Rail .pname,
body.dark #select945Rail .pname {
  color: #f4f4f5 !important;
}

[data-theme="dark"] .select945-edit-card,
html.dark .select945-edit-card,
body.dark .select945-edit-card {
  background: #18181b !important;
  border-color: #E3A6B1 !important;
}

[data-theme="dark"] .select945-edit-num,
html.dark .select945-edit-num,
body.dark .select945-edit-num {
  color: #E3A6B1 !important;
}

[data-theme="dark"] .select945-edit-label,
html.dark .select945-edit-label,
body.dark .select945-edit-label {
  color: #f4f4f5 !important;
}

[data-theme="dark"] .rail-page-dot,
html.dark .rail-page-dot,
body.dark .rail-page-dot {
  background: rgba(255, 255, 255, 0.3) !important;
}

[data-theme="dark"] .rail-page-dot:hover,
html.dark .rail-page-dot:hover,
body.dark .rail-page-dot:hover {
  background: rgba(255, 255, 255, 0.6) !important;
}

[data-theme="dark"] .rail-page-dot.active,
html.dark .rail-page-dot.active,
body.dark .rail-page-dot.active {
  background: #ffffff !important;
  box-shadow: 0 0 10px rgba(255, 255, 255, 0.5) !important;
}

[data-theme="dark"] .discovery-shop-all-btn .shop-all-arrow,
html.dark .discovery-shop-all-btn .shop-all-arrow,
body.dark .discovery-shop-all-btn .shop-all-arrow,
[data-theme="dark"] .discovery-explore-all-btn .explore-all-arrow,
html.dark .discovery-explore-all-btn .explore-all-arrow,
body.dark .discovery-explore-all-btn .explore-all-arrow {
  color: #14152D !important;
}

/* ============================================================
   DARK MODE: PRODUCT SHARE MODAL & LIVE PREVIEW SHEET
   ============================================================ */
[data-theme="dark"] .pv-share-overlay,
html.dark .pv-share-overlay,
body.dark .pv-share-overlay {
  background: rgba(0, 0, 0, 0.78);
}

[data-theme="dark"] .pv-share-sheet,
html.dark .pv-share-sheet,
body.dark .pv-share-sheet {
  background: #1B1D39;
  border-color: rgba(255, 255, 255, 0.1);
  box-shadow: 0 28px 70px rgba(0, 0, 0, 0.6);
}

[data-theme="dark"] .pv-share-title-wrap,
html.dark .pv-share-title-wrap,
body.dark .pv-share-title-wrap {
  color: #f4f4f6;
}

[data-theme="dark"] .pv-share-close-btn,
html.dark .pv-share-close-btn,
body.dark .pv-share-close-btn {
  background: #28294C;
  border-color: rgba(255, 255, 255, 0.1);
  color: #BCB2A3;
}

[data-theme="dark"] .pv-share-close-btn:hover,
html.dark .pv-share-close-btn:hover,
body.dark .pv-share-close-btn:hover {
  background: #2e2e36;
  color: #ffffff;
}

[data-theme="dark"] .pv-share-product-preview,
html.dark .pv-share-product-preview,
body.dark .pv-share-product-preview {
  background: #222228;
  border-color: rgba(255, 255, 255, 0.08);
}

[data-theme="dark"] .pv-share-img-wrap,
html.dark .pv-share-img-wrap,
body.dark .pv-share-img-wrap {
  background: #1B1D39;
  border-color: rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .pv-share-prod-name,
html.dark .pv-share-prod-name,
body.dark .pv-share-prod-name {
  color: #ffffff;
}

[data-theme="dark"] .pv-share-prod-sub,
html.dark .pv-share-prod-sub,
body.dark .pv-share-prod-sub {
  color: #BCB2A3;
}

[data-theme="dark"] .pv-share-prod-price,
html.dark .pv-share-prod-price,
body.dark .pv-share-prod-price {
  color: #ffffff;
}

[data-theme="dark"] .pv-share-link-box,
html.dark .pv-share-link-box,
body.dark .pv-share-link-box {
  background: #111114;
  border-color: rgba(255, 255, 255, 0.12);
}

[data-theme="dark"] .pv-share-link-input,
html.dark .pv-share-link-input,
body.dark .pv-share-link-input {
  color: #EDE3D1;
}

[data-theme="dark"] .pv-share-copy-btn,
html.dark .pv-share-copy-btn,
body.dark .pv-share-copy-btn {
  background: #ffffff !important;
  color: #14152D !important;
}

[data-theme="dark"] .pv-share-copy-btn *,
html.dark .pv-share-copy-btn *,
body.dark .pv-share-copy-btn * {
  color: #14152D !important;
  stroke: #14152D !important;
}

[data-theme="dark"] .pv-share-copy-btn:hover,
html.dark .pv-share-copy-btn:hover,
body.dark .pv-share-copy-btn:hover {
  background: #EDE3D1 !important;
}

[data-theme="dark"] .pv-share-copy-btn.copied,
html.dark .pv-share-copy-btn.copied,
body.dark .pv-share-copy-btn.copied {
  background: #22c55e !important;
  color: #ffffff !important;
}

[data-theme="dark"] .pv-share-copy-btn.copied *,
html.dark .pv-share-copy-btn.copied *,
body.dark .pv-share-copy-btn.copied * {
  color: #ffffff !important;
  stroke: #ffffff !important;
}

[data-theme="dark"] .pv-channel-native,
html.dark .pv-channel-native,
body.dark .pv-channel-native {
  background: #ffffff !important;
  color: #14152D !important;
}

[data-theme="dark"] .pv-channel-native *,
html.dark .pv-channel-native *,
body.dark .pv-channel-native * {
  color: #14152D !important;
  stroke: #14152D !important;
}

[data-theme="dark"] .pv-channel-native:hover,
html.dark .pv-channel-native:hover,
body.dark .pv-channel-native:hover {
  background: #EDE3D1 !important;
}

[data-theme="dark"] .pv-channel-message,
[data-theme="dark"] .pv-channel-download,
html.dark .pv-channel-message,
html.dark .pv-channel-download,
body.dark .pv-channel-message,
body.dark .pv-channel-download {
  background: #28294C;
  color: #f4f4f6;
  border-color: rgba(255, 255, 255, 0.1);
}

[data-theme="dark"] .pv-channel-message:hover,
[data-theme="dark"] .pv-channel-download:hover,
html.dark .pv-channel-message:hover,
html.dark .pv-channel-download:hover,
body.dark .pv-channel-message:hover,
body.dark .pv-channel-download:hover {
  background: #2f2f37;
  color: #ffffff;
}

/* ================= LUXURY CHECKOUT MODAL (DARK MODE) ================= */
[data-theme="dark"] .checkout-box,
html.dark .checkout-box,
body.dark .checkout-box {
  background: #181A34 !important;
  border: 1px solid rgba(255, 255, 255, 0.1) !important;
  box-shadow: 0 32px 80px rgba(0, 0, 0, 0.8) !important;
  color: #F6EEDF !important;
}

[data-theme="dark"] .checkout-title,
html.dark .checkout-title,
body.dark .checkout-title {
  color: #ffffff !important;
}

[data-theme="dark"] .checkout-subtitle,
html.dark .checkout-subtitle,
body.dark .checkout-subtitle {
  color: #9ca3af !important;
}

[data-theme="dark"] .checkout-summary-container,
html.dark .checkout-summary-container,
body.dark .checkout-summary-container {
  background: #202242 !important;
  border-color: rgba(255, 255, 255, 0.1) !important;
}

[data-theme="dark"] .checkout-summary-tag,
html.dark .checkout-summary-tag,
body.dark .checkout-summary-tag,
[data-theme="dark"] .checkout-summary-subtotal,
html.dark .checkout-summary-subtotal,
body.dark .checkout-summary-subtotal {
  color: #ffffff !important;
}

[data-theme="dark"] .checkout-addr-card,
html.dark .checkout-addr-card,
body.dark .checkout-addr-card {
  background: #202242 !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

[data-theme="dark"] .checkout-addr-name,
html.dark .checkout-addr-name,
body.dark .checkout-addr-name {
  color: #ffffff !important;
}

[data-theme="dark"] .checkout-addr-phone,
html.dark .checkout-addr-phone,
body.dark .checkout-addr-phone,
[data-theme="dark"] .checkout-addr-text,
html.dark .checkout-addr-text,
body.dark .checkout-addr-text {
  color: #9ca3af !important;
}

[data-theme="dark"] .form-control,
html.dark .form-control,
body.dark .form-control {
  background: #202242 !important;
  border-color: rgba(255, 255, 255, 0.14) !important;
  color: #ffffff !important;
}

[data-theme="dark"] .pay-card,
html.dark .pay-card,
body.dark .pay-card {
  background: #202242 !important;
  border: 1px solid rgba(255, 255, 255, 0.14) !important;
  color: #e5e5e7 !important;
}

[data-theme="dark"] .pay-card:hover,
html.dark .pay-card:hover,
body.dark .pay-card:hover {
  background: #25252c !important;
  border-color: rgba(255, 255, 255, 0.3) !important;
}

[data-theme="dark"] .pay-card .pay-card-title,
html.dark .pay-card .pay-card-title,
body.dark .pay-card .pay-card-title {
  color: #F6EEDF !important;
}

[data-theme="dark"] .pay-card .pay-card-sub,
html.dark .pay-card .pay-card-sub,
body.dark .pay-card .pay-card-sub {
  color: #9ca3af !important;
}

[data-theme="dark"] .pay-card.active,
html.dark .pay-card.active,
body.dark .pay-card.active {
  background: #000000 !important;
  border-color: #ffffff !important;
  box-shadow: 0 0 0 1px #ffffff, 0 4px 14px rgba(0, 0, 0, 0.4) !important;
  color: #ffffff !important;
}

[data-theme="dark"] .pay-card.active .pay-card-title,
html.dark .pay-card.active .pay-card-title,
body.dark .pay-card.active .pay-card-title {
  color: #ffffff !important;
}

[data-theme="dark"] .pay-card.active .pay-card-sub,
html.dark .pay-card.active .pay-card-sub,
body.dark .pay-card.active .pay-card-sub {
  color: #d1d5db !important;
}

[data-theme="dark"] .floating-cart-badge,
html.dark .floating-cart-badge,
body.dark .floating-cart-badge {
  background: #B82E44 !important;
  color: #ffffff !important;
  border-color: #14152D !important;
}

/* ============================================================
   DARK MODE — BRAND LOGO IMAGES
   Brand logos are black/dark artwork on transparent backgrounds.
   On a dark surface they become invisible — invert them so they
   render as white/light without touching the golden accent hues.
   ============================================================ */
[data-theme="dark"] .brand-logo-img,
html.dark .brand-logo-img,
body.dark .brand-logo-img {
  filter: invert(1) brightness(1.6) !important;
  mix-blend-mode: screen !important;
}

[data-theme="dark"] .brand-card-img,
html.dark .brand-card-img,
body.dark .brand-card-img {
  filter: invert(1) brightness(1.6) !important;
}


/* ============================================================
   ONE PRODUCT CARD, EVERYWHERE
   The grid, 945 Select, "You may also like", the wishlist and the account
   pages all render the same card (colorwayEngine.renderNikeProductCardHTML),
   but each context re-sized it: 945 Select stood 20-50px taller than the
   same product in the grid, rails used their own widths, and the name was one
   line on desktop and two on phones. Every row now has one fixed height, so a
   card is the same size wherever it appears and every button in a row lines
   up. Loaded last on every page, hence here.
   ============================================================ */
:root {
  /* Under every product photo. The photos carry a baked-in #F6F6F6 backdrop;
     multiplied over this it comes out ~#F6EEDB -- the page's own #F8EEDB --
     so a product sits ON the page instead of in a cool grey box. (Derived:
     page / 0.965 -- change the page colour, change this with it.) */
  --plate: #FFF6E3;
  /* A rail card is as wide as a grid card at the same screen size. */
  --pcard-w: clamp(220px, 18vw, 262px);
}
@media (max-width: 640px) {
  :root { --pcard-w: calc((100vw - 36px) / 2); }
}

.pcard {
  display: flex !important;
  flex-direction: column !important;
  height: 100%;
}
.trend-rail .pcard,
.trend-rail .select945-edit-card {
  flex: 0 0 var(--pcard-w) !important;
  width: var(--pcard-w) !important;
  max-width: var(--pcard-w) !important;
}
.pcard-plate {
  order: 0 !important;
  aspect-ratio: 1 / 1 !important;
  padding: 0 !important;
  border-radius: 14px !important;
}
.pcard-tag-red {
  order: 1 !important;
  display: block !important;
  height: 16px !important;
  line-height: 16px !important;
  margin: 10px 0 0 !important;
}
.pname {
  order: 2 !important;
  height: 36px !important;
  line-height: 18px !important;
  margin: 2px 0 0 !important;
  white-space: normal !important;
  overflow: hidden !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
}
.pdesc {
  order: 3 !important;
  height: 16px !important;
  line-height: 16px !important;
  margin: 2px 0 0 !important;
  text-transform: none !important;
  letter-spacing: normal !important;
}
/* Proximity: three groups per card, spaced so the eye reads them as three --
   WHAT it is (tag, name, type: 2px apart), WHAT PEOPLE THINK (colours,
   reviews: 10px above, 4px apart), WHAT IT COSTS (price, button: pushed to
   the foot, 12px above). */
.pcolor-swatches {
  order: 4 !important;
  height: 18px !important;
  margin: 10px 0 0 !important;
}
.pcard-reviews {
  order: 5;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  height: 20px;
  margin-top: 4px;
  min-width: 0;
}
.pcard-footer {
  order: 6 !important;
  margin-top: auto !important;
  padding-top: 12px !important;
  gap: 6px !important;
}
.pprice {
  height: 20px !important;
  line-height: 20px !important;
}
.pcard-add-cart-btn {
  height: 36px !important;
}

/* Reviews row: read them (opens the product at its reviews), or write one. */
.pcard-review-summary,
.pcard-review-write {
  background: none;
  border: 0;
  padding: 0;
  font: inherit;
  font-size: 11.5px;
  line-height: 20px;
  cursor: pointer;
  white-space: nowrap;
}
.pcard-review-summary {
  color: var(--ink);
  font-weight: 600;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pcard-review-star { color: var(--burgundy, #761B2C); }
.pcard-review-count,
.pcard-review-none { color: var(--ink2); font-weight: 400; }
.pcard-review-write {
  color: var(--ink2);
  text-decoration: underline;
  text-underline-offset: 2px;
  flex-shrink: 0;
  transition: color .2s ease;
}
.pcard-review-write:hover { color: var(--ink); }
@media (max-width: 380px) {
  .pcard-review-summary, .pcard-review-write { font-size: 10.5px; }
}

/* Product page: reviews always shown, with the way in to writing one. */
.pv-reviews-header { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.pv-review-write-btn {
  margin-left: auto;
  border: 1px solid var(--ink);
  background: transparent;
  color: var(--ink);
  border-radius: 999px;
  padding: 7px 16px;
  font-size: 12.5px;
  font-weight: 600;
  cursor: pointer;
  transition: background .2s ease, color .2s ease;
}
.pv-review-write-btn:hover { background: var(--ink); color: var(--bg-page, #F8EEDB); }
.pv-reviews-empty { font-size: 13.5px; color: var(--ink2); margin: 10px 0 0; line-height: 1.5; }

/* ---------- One warm plate under every product photo (light theme) ---------- */
:root:not([data-theme="dark"]) :is(.pcard-plate, .account-wishlist-grid .pcard-plate, .pv-main-stage-wrap,
  .pv-media-stage-wrap, .pv-vert-thumb-btn, .pv-thumb-btn, .pv-shoe-swatch-card, .qa-prod-img-box,
  .qa-swatch-thumb-btn, .cart-item-img) {
  background: var(--plate) !important;
}
:root:not([data-theme="dark"]) :is(.pcard-plate, .pv-main-stage-wrap, .pv-media-stage-wrap, .pv-vert-thumb-btn,
  .pv-thumb-btn, .pv-shoe-swatch-card, .qa-prod-img-box, .qa-swatch-thumb-btn, .cart-item-img) img {
  mix-blend-mode: multiply !important;
}
/* Thumbnails that are the <img> itself: drop their grey box and let the
   photo's own backdrop take the surface's warmth. */
:root:not([data-theme="dark"]) :is(.search-hit-img, .order-item-img, .checkout-mini-thumb,
  .all-review-product-thumb, .pdp-img) {
  background: transparent !important;
  mix-blend-mode: multiply;
}

/* ---------- Motion ---------- */
/* Cards arrive with a short rise, staggered across a row. `backwards` only:
   a fill that outlived the animation would pin transform and kill the hover
   lift. Cards re-rendered by a live catalogue refresh carry no pcard-in, so
   a stock change never makes the grid flicker. */
@keyframes pcardIn {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: none; }
}
.pcard.pcard-in { animation: pcardIn .5s cubic-bezier(0.16, 1, 0.3, 1) backwards; }
.pcard.pcard-in:nth-child(4n+2) { animation-delay: .05s; }
.pcard.pcard-in:nth-child(4n+3) { animation-delay: .1s; }
.pcard.pcard-in:nth-child(4n+4) { animation-delay: .15s; }

/* Load More: the button fades in, reads "Loading more…" with a slim bar sliding along its foot
   while the next row is added, and the next button fades in under the new cards. The bar and the
   fade stop for prefers-reduced-motion with everything else (main.css). */
@keyframes plpIn {
  from { opacity: 0; transform: translateY(8px); }
  to { opacity: 1; transform: none; }
}
@keyframes plpBar {
  from { transform: translateX(-100%); }
  to { transform: translateX(260%); }
}
.plp-pagination > * { animation: plpIn .4s cubic-bezier(0.16, 1, 0.3, 1) backwards; }
.plp-pagination .btn-secondary.is-loading { overflow: hidden; pointer-events: none; cursor: progress; }
.plp-pagination .btn-secondary.is-loading::after {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 38%;
  height: 3px;
  border-radius: 3px;
  background: currentColor;
  opacity: .55;
  animation: plpBar 1s ease-in-out infinite;
}

.pcard-art-primary,
.pcard-art-secondary { transition: opacity .4s ease, transform .5s cubic-bezier(0.16, 1, 0.3, 1) !important; }
.pcard-plate { transition: box-shadow .35s ease, background .2s ease !important; }

@media (hover: hover) {
  .pcard { transition: transform .35s cubic-bezier(0.16, 1, 0.3, 1), opacity .2s ease !important; }
  .pcard:hover { transform: translateY(-4px); opacity: 1 !important; }
  .pcard:hover .pcard-plate { box-shadow: 0 18px 30px -22px rgba(17, 17, 19, .45); }
  .pcard-add-cart-btn { transition: background .2s ease, transform .2s ease, box-shadow .2s ease !important; }
}

/* Opening and closing: product page, dialogs and the quick-add sheet rise
   into place and sink away, rather than a 4% scale nobody could see. */
.modal-overlay .modal-card,
.quick-add-overlay .quick-add-modal {
  opacity: 0;
  transform: translateY(26px) scale(.975);
  transition: transform .45s cubic-bezier(0.16, 1, 0.3, 1), opacity .3s ease !important;
}
.modal-overlay.open .modal-card,
.quick-add-overlay.open .quick-add-modal {
  opacity: 1;
  transform: none;
}
@media (max-width: 640px) {
  .quick-add-overlay .quick-add-modal { opacity: 1; transform: translateY(100%); }
  .quick-add-overlay.open .quick-add-modal { transform: none; }
}

/* ============================================================
   HOUSE PALETTE IN USE -- one colour per job (law of similarity)
     indigo   P 102-8 C : press me    -- buttons, links, selected states
     burgundy P 50-16 C : notice me   -- tags, discounts, stars, saved
     cream    P 17-1 C  : the paper   -- bands, fills, quiet surfaces
   Light theme first; the dark theme carries the same roles in lighter tints
   at the end.
   ============================================================ */
:root:not([data-theme="dark"]) ::selection { background: var(--indigo); color: var(--cream); }
:root:not([data-theme="dark"]) :focus-visible { outline-color: var(--indigo); }

/* Headings speak indigo; the small line above them speaks burgundy. */
:root:not([data-theme="dark"]) :is(.editorial-section-title, .select945-num, .plp-title, #plpTitle,
  .pv-pdp-title, .legal-title, .pv-similar-title, .pv-reviews-header h3) {
  color: var(--indigo) !important;
}
:root:not([data-theme="dark"]) :is(.select945-word, .editorial-eyebrow, .legal-eyebrow) { color: var(--burgundy) !important; }
:root:not([data-theme="dark"]) .editorial-eyebrow-line { background: var(--burgundy) !important; opacity: .45; }
:root:not([data-theme="dark"]) .select945-cta { color: var(--indigo) !important; border-color: var(--burgundy) !important; }

/* ACTION -- every primary button is the same indigo pill. */
:root:not([data-theme="dark"]) :is(.pcard-add-cart-btn, .btn-primary, .pill.dark, .pv-btn-add-bag, .qa-submit-btn,
  #btnBagCheckoutModal, .auth-submit-btn, .msheet-auth-cta, .msheet-discovery-cta, .discovery-explore-all-btn,
  .checkout-promo-row button, .pv-share-copy-btn) {
  background: var(--indigo) !important;
  border-color: var(--indigo) !important;
  color: #fff !important;
}
:root:not([data-theme="dark"]) :is(.pcard-add-cart-btn, .btn-primary, .pill.dark, .pv-btn-add-bag, .qa-submit-btn,
  #btnBagCheckoutModal, .auth-submit-btn, .msheet-auth-cta, .msheet-discovery-cta, .discovery-explore-all-btn,
  .checkout-promo-row button, .pv-share-copy-btn):hover {
  background: var(--indigo-deep) !important;
  border-color: var(--indigo-deep) !important;
  box-shadow: 0 8px 18px -10px rgba(56, 60, 140, .7) !important;
}

/* SELECTED -- a chosen size, filter, tab or step is the same indigo. */
:root:not([data-theme="dark"]) :is(.active-chip, .filter-pill.active, .filter-chip-label input:checked + span,
  .nike-size-box.active, .nike-size-dept-tab.active, .qa-size-chip.active,
  .account-tab-btn.active, .spotlight-pill.active, .nike-reset-btn.has-filters, .nike-active-filter-count,
  .pv-size-chip.active, .pv-size-chip.selected) {
  background: var(--indigo) !important;
  border-color: var(--indigo) !important;
  color: #fff !important;
}
:root:not([data-theme="dark"]) :is(.rail-page-dot.active) { background: var(--indigo) !important; }
:root:not([data-theme="dark"]) :is(.pay-card.active, .checkout-addr-card.active, .pv-variant-card.active) {
  border-color: var(--indigo) !important;
}
:root:not([data-theme="dark"]) :is(input[type="checkbox"], input[type="radio"]) { accent-color: var(--indigo); }

/* VALUE -- the things worth noticing are burgundy. */
:root:not([data-theme="dark"]) .pcard-tag-red { color: var(--burgundy) !important; }
:root:not([data-theme="dark"]) .pcard-discount-tag {
  color: var(--burgundy) !important;
  border-color: rgba(118, 27, 44, .55) !important;
  background: rgba(118, 27, 44, .06) !important;
}
:root:not([data-theme="dark"]) .pcard-wish-btn.active svg { fill: var(--burgundy) !important; stroke: var(--burgundy) !important; }
:root:not([data-theme="dark"]) :is(.badge, .floating-cart-badge, .msheet-badge-red) { background: var(--burgundy) !important; color: #fff !important; }
:root:not([data-theme="dark"]) .site-scroll-slidebar { background: var(--burgundy) !important; }

/* THE PAPER -- the full cream chip for bands, so the page has rhythm. */
:root:not([data-theme="dark"]) .promo { background: var(--cream) !important; color: var(--indigo) !important; }
:root:not([data-theme="dark"]) .promo a { color: var(--burgundy) !important; }
:root:not([data-theme="dark"]) .club-footer {
  background: var(--cream) !important;
  border-top: 1px solid rgba(118, 27, 44, .25);
}
:root:not([data-theme="dark"]) .club-footer :is(h4, h5, h6) { color: var(--indigo) !important; }
:root:not([data-theme="dark"]) .pcard-wish-btn { background: var(--bg-page) !important; }

/* Dark theme: the same three roles, lightened to read on indigo-night. */
[data-theme="dark"] { --indigo: #A9ADF0; --indigo-deep: #C4C7F6; --burgundy: #E3A6B1; --cream: #F2E0BE; }
[data-theme="dark"] :is(.pcard-tag-red, .select945-word, .editorial-eyebrow) { color: var(--burgundy) !important; }
[data-theme="dark"] .pcard-discount-tag { color: var(--burgundy) !important; border-color: rgba(227, 166, 177, .5) !important; }
[data-theme="dark"] :is(.pcard-add-cart-btn, .btn-primary, .pv-btn-add-bag, .qa-submit-btn) {
  background: var(--cream) !important; border-color: var(--cream) !important; color: #1C1D3D !important;
}

/* ============================================================
   NO STRAY WHITE
   Pure white is not in the palette, so nothing wears it as a fill, a ring or
   a glow: controls over video are cream with indigo marks, dots on the
   indigo band are cream, logo photos are multiplied into the cream paper
   (their white boxes become the card), and a same-job family of cards shares
   one tone instead of five unrelated pastels.
   ============================================================ */

/* Hero over video: the one primary action is a cream pill with an indigo
   label; the carousel controls are quieter cream discs. */
.hero-fullscreen-video .hero-pill-primary {
  background: var(--cream-soft, #F8EEDB) !important;
  color: var(--indigo, #383C8C) !important;
  box-shadow: 0 10px 28px rgba(14, 15, 40, .45) !important;
}
.hero-fullscreen-video .hero-pill-primary:hover { background: var(--cream, #F2E0BE) !important; }
.hero-circle-btn {
  background: rgba(248, 238, 219, .86) !important;
  color: var(--indigo, #383C8C) !important;
  box-shadow: 0 4px 14px rgba(14, 15, 40, .35) !important;
}
.hero-circle-btn:hover { background: var(--cream-soft, #F8EEDB) !important; }
.hero-dot { background: rgba(242, 224, 190, .45) !important; }
.hero-dot:hover { background: rgba(242, 224, 190, .8) !important; }
.hero-dot.active { background: var(--cream, #F2E0BE) !important; }

/* Editorial tiles: the arrow disc is ringed in cream, not white. */
.trend-editorial-circle-btn { border-color: rgba(242, 224, 190, .55) !important; }
.trend-editorial-card:hover .trend-editorial-circle-btn {
  background: rgba(242, 224, 190, .2) !important;
  border-color: var(--cream, #F2E0BE) !important;
}

/* Shop by purpose: same job, same tone -- the photo tells them apart. */
:root:not([data-theme="dark"]) .purpose-card { background: var(--surface-secondary, #F3E6CC) !important; border-color: var(--hair) !important; }
:root:not([data-theme="dark"]) .purpose-card:hover { border-color: rgba(56, 60, 140, .3) !important; box-shadow: 0 16px 30px -18px rgba(56, 60, 140, .45) !important; }
:root:not([data-theme="dark"]) .purpose-img { mix-blend-mode: multiply; }

/* The heart on a card: a bare mark on the product, not a disc. On a plate
   that now melts into the page, a floating circle read as a stray blob. */
:root:not([data-theme="dark"]) .pcard-wish-btn {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
:root:not([data-theme="dark"]) .pcard-wish-btn svg { stroke: var(--indigo, #383C8C) !important; }
:root:not([data-theme="dark"]) .pcard-wish-btn:hover { transform: scale(1.15); }

/* The selected quick-add colour: the gap in its double ring is the page, not white. */
.qa-swatch-thumb-btn.active { box-shadow: 0 0 0 2px var(--bg-page), 0 0 0 4px var(--indigo, #383C8C) !important; }

/* Every section header, one system: burgundy eyebrow, indigo title, a
   burgundy accent word. "Apparel & Streetwear" and the 945select link had
   their own tan-and-copper scheme. */
:root:not([data-theme="dark"]) .apparel-eyebrow { color: var(--burgundy) !important; }
:root:not([data-theme="dark"]) .apparel-title { color: var(--indigo) !important; }
:root:not([data-theme="dark"]) .apparel-amp { color: var(--burgundy) !important; }
:root:not([data-theme="dark"]) :is(.nlink-select, .msheet-select-text) { color: var(--burgundy) !important; }

/* Dark theme, same roles. `html[..] body` because the older dark rules are
   written html.dark .x (0,2,1) and would otherwise keep their white buttons
   and orange tags. Products sit on cream paper here too -- the brand cards'
   look -- so a photo's grey backdrop never floats on the night. */
html[data-theme="dark"] body :is(.pcard-add-cart-btn, .btn-primary, .pv-btn-add-bag, .qa-submit-btn) {
  background: #F2E0BE !important; border-color: #F2E0BE !important; color: #1C1D3D !important;
}
html[data-theme="dark"] body :is(.pcard-add-cart-btn, .btn-primary, .pv-btn-add-bag, .qa-submit-btn):hover { background: #F8EEDB !important; }
html[data-theme="dark"] body :is(.pcard-tag-red, .select945-word, .editorial-eyebrow, .apparel-amp, .nlink-select) { color: #E3A6B1 !important; }
html[data-theme="dark"] body .pcard-discount-tag {
  color: #E3A6B1 !important; border-color: rgba(227, 166, 177, .5) !important; background: transparent !important;
}
html[data-theme="dark"] body :is(.pcard-plate, .pv-main-stage-wrap, .pv-media-stage-wrap, .pv-vert-thumb-btn,
  .pv-shoe-swatch-card, .qa-prod-img-box, .qa-swatch-thumb-btn, .cart-item-img) {
  background: #F3E6CC !important;
}
html[data-theme="dark"] body :is(.pcard-plate, .pv-main-stage-wrap, .pv-media-stage-wrap, .pv-vert-thumb-btn,
  .pv-shoe-swatch-card, .qa-prod-img-box, .qa-swatch-thumb-btn, .cart-item-img) img {
  mix-blend-mode: multiply !important; filter: none !important;
}
html[data-theme="dark"] body .pcard-wish-btn { background: transparent !important; border: 0 !important; box-shadow: none !important; }
html[data-theme="dark"] body .pcard-wish-btn svg { stroke: #383C8C !important; }
html[data-theme="dark"] body .pcard-wish-btn.active svg { fill: #761B2C !important; stroke: #761B2C !important; }
html[data-theme="dark"] body .pcard-review-star { color: #E3A6B1; }

/* No tag to show (13/10/2026: "Just In" now means added in the last 30 days, and the cards no
   longer fall back to it): the pill keeps its place in the row but draws nothing. */
.pcard-tag-red:empty, .pv-pdp-tag:empty, .qa-prod-tag:empty { visibility: hidden; }