/* ==========================================================================
   OfferDost UI v2 — design system + components
   --------------------------------------------------------------------------
   Loaded only when the v2 UI is on (<body class="od-v2">). Every selector is
   scoped under .od-v2 so it outranks both the legacy stylesheet and the
   page-level <style> blocks by specificity alone. !important appears only
   where the legacy code uses inline style="" attributes or !important itself.

   Palette: one brand colour (emerald — "you saved money"), warm neutrals for
   everything else, store colours only on store buttons. No gradients, no
   glows, no pastel icon tiles.
   ========================================================================== */

/* ---------- 1. Tokens --------------------------------------------------- */
.od-v2 {
  --b-50:  #FFF1EC;
  --b-100: #FFDDD1;
  --b-200: #FDB8A2;
  --b-500: #F0582F;
  --b-600: #E5431F;
  --b-700: #C73614;
  --b-800: #A12B10;

  /* Savings / verified / lowest-price stay green: they mean "good for you". */
  --g-50:  #EAF7EF;
  --g-100: #CDEBD8;
  --g-600: #13803F;
  --g-700: #0F6B34;

  --i-900: #1B1D21;
  --i-800: #2A2D32;
  --i-700: #43474E;
  --i-600: #5B6068;
  --i-500: #70757E;
  --i-400: #9A9EA6;
  --i-300: #C8CBD0;

  /* Cool neutral canvas with white panels: the layout language of real
     Indian commerce (Flipkart / Amazon), not a marketing landing page. */
  --s-canvas: #F5F6FA;
  --s-card:   #FFFFFF;
  --s-well:   #F6F7F8;
  --s-hover:  #F2F3F5;
  --l-1: #E5E6EA;
  --l-2: #D0D3D8;

  --f-red:      #C23A2E;
  --f-red-bg:   #FCECE9;
  --f-amber:    #8A5300;
  --f-amber-bg: #FFF1D4;
  --f-amz:       #FFD814;
  --f-amz-hover: #F7CA00;
  --f-amz-line:  #E9BE00;
  --f-amz-ink:   #0F1111;
  --f-fk:        #2874F0;
  --f-fk-hover:  #1C5ED4;

  --ff: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;

  --r-xs: 4px;
  --r-sm: 8px;
  --r-md: 8px;
  --r-lg: 10px;
  --r-xl: 12px;
  --sh-1: 0 1px 2px rgba(16, 24, 40, .05);
  --sh-2: 0 4px 14px -4px rgba(16, 24, 40, .16);
  --sh-3: 0 16px 40px -12px rgba(16, 24, 40, .26);

  --hdr-h: 60px;
  --wrap: 1180px;
  --gut: 20px;

  /* Legacy tokens re-pointed, so every older widget that reads them (filter
     bar, forms, modals, admin bits) follows the new palette automatically. */
  --primary: var(--b-600);
  --primary-dark: var(--b-700);
  --primary-light: var(--b-50);
  --secondary: var(--i-900);
  --accent: var(--b-600);
  --accent-light: var(--b-50);
  --text: var(--i-900);
  --text-muted: var(--i-500);
  --bg: var(--s-canvas);
  --white: var(--s-card);
  --border: var(--l-1);
  --cta: var(--b-600);
  --cta-dark: var(--b-700);
  --cta-light: var(--b-50);
  --ai-grad: linear-gradient(var(--b-600), var(--b-600));
  --success: var(--b-600);
  --radius: var(--r-lg);
  --radius-lg: var(--r-xl);
  --shadow-sm: var(--sh-1);
  --shadow-md: var(--sh-2);
  --shadow-lg: var(--sh-3);
  --font-body: var(--ff);
  --font-heading: var(--ff);

  color-scheme: light;
  background: var(--s-canvas) !important;
  color: var(--i-900);
  font-family: var(--ff);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
@media (max-width: 768px) {
  .od-v2 { --hdr-h: 52px; --gut: 12px; }
}

/* ---------- 2. Base ------------------------------------------------------ */
/* style.css puts overflow-x:hidden on BOTH html and body, which turns <body>
   into its own scroll container and silently breaks position:sticky (the old
   header never actually stuck). `clip` still stops sideways scrolling but
   doesn't create a scroll container. This file only loads on v2 pages, so the
   unscoped html rule is safe. */
html { overflow-x: clip !important; }
body.od-v2 { overflow-x: clip !important; overflow-y: visible !important; }
.od-v2 ::selection { background: var(--b-100); color: var(--i-900); }
.od-v2 a { color: inherit; }
.od-v2 :focus-visible { outline: 2px solid var(--b-600); outline-offset: 2px; border-radius: 6px; }
.od-v2 .container { max-width: var(--wrap); padding-left: var(--gut); padding-right: var(--gut); }
.od-v2 h1, .od-v2 h2, .od-v2 h3, .od-v2 h4 { letter-spacing: -0.015em; color: var(--i-900); }
.od-v2 .od-num { font-variant-numeric: tabular-nums; }

/* The homepage used a pink/purple/cream wash behind everything. */
.od-v2.od-soft-bg, body.od-v2.od-soft-bg { background: var(--s-canvas) !important; }
.od-v2.od-soft-bg::before, .od-v2.od-soft-bg::after { display: none !important; }

/* Top loading strip — keep the behaviour, drop the rainbow. */
.od-v2::before { background: var(--b-600) !important; height: 2px !important; }

/* ---------- 3. Header ---------------------------------------------------- */
/* Row 1: logo, wide search, tools, account.  Row 2: category sub-nav.
   On phones row 2 becomes a full-width search field that stays pinned while
   the logo row scrolls away (sticky with a negative top). */
.od-v2 .odh { position: sticky; top: 0; z-index: 7000; background: #fff; border-bottom: 1px solid var(--l-1); }
.od-v2 .odh-in { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gut); display: flex; align-items: center; gap: 18px; }
.od-v2 .odh-top .odh-in { height: var(--hdr-h); }
.od-v2 .odh-logo {
  display: inline-flex; align-items: center; gap: 8px; flex-shrink: 0; text-decoration: none;
  font-size: 23px; font-weight: 800; letter-spacing: -0.045em; color: var(--i-900); line-height: 1;
}
.od-v2 .odh-logo span span { color: var(--b-600); }
.od-v2 .odh-logo img { height: 30px; width: auto; display: block; }

.od-v2 .odh-search {
  flex: 1 1 auto; max-width: 660px; height: 42px; padding: 0 0 0 14px; overflow: hidden;
  display: flex; align-items: center; gap: 10px; text-align: left; cursor: text;
  background: var(--s-well); border: 1px solid var(--l-2); border-radius: var(--r-sm);
  color: var(--i-500); font: 400 14.5px/1 var(--ff);
  transition: border-color .15s, background-color .15s;
}
.od-v2 .odh-search:hover { background: #fff; border-color: var(--i-400); }
.od-v2 .odh-search > svg { width: 18px; height: 18px; color: var(--i-500); flex-shrink: 0; }
.od-v2 .odh-search > span:first-of-type { flex: 1; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.od-v2 .odh-search-go {
  align-self: stretch; margin: -1px -1px -1px 0; padding: 0 16px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--b-600); color: #fff; border-radius: 0 var(--r-sm) var(--r-sm) 0;
}
.od-v2 .odh-search-go svg { width: 19px; height: 19px; }
.od-v2 .odh-search:hover .odh-search-go { background: var(--b-700); }

.od-v2 .odh-tools { display: flex; align-items: center; gap: 2px; margin-left: auto; }
.od-v2 .odh-tool {
  display: inline-flex; align-items: center; gap: 7px; height: 40px; padding: 0 10px;
  border-radius: var(--r-sm); text-decoration: none; white-space: nowrap;
  font: 600 14px/1 var(--ff); color: var(--i-700);
}
.od-v2 .odh-tool:hover { background: var(--s-hover); color: var(--i-900); }
.od-v2 .odh-tool.is-on { color: var(--b-700); }
.od-v2 .odh-tool svg { width: 19px; height: 19px; flex-shrink: 0; }

.od-v2 .odh-actions { display: flex; align-items: center; gap: 4px; flex-shrink: 0; }
.od-v2 .odh-icon {
  position: relative; width: 40px; height: 40px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--r-sm); color: var(--i-700); background: transparent; border: 0; cursor: pointer; text-decoration: none;
}
.od-v2 .odh-icon:hover { background: var(--s-hover); color: var(--i-900); }
.od-v2 .odh-icon svg { width: 21px; height: 21px; }
.od-v2 .odh-icon .wishlist-count {
  position: absolute; top: 4px; right: 3px; min-width: 17px; height: 17px; padding: 0 4px; box-sizing: border-box;
  border-radius: 9px; background: var(--b-600); color: #fff; border: 2px solid #fff; font: 700 10px/13px var(--ff); text-align: center;
}
.od-v2 .odh-signin {
  margin-left: 4px; height: 38px; padding: 0 14px;
  display: inline-flex; align-items: center; gap: 7px;
  border-radius: var(--r-sm); background: #fff; border: 1px solid var(--l-2);
  color: var(--i-900) !important; font: 600 14px/1 var(--ff); text-decoration: none; white-space: nowrap;
}
.od-v2 .odh-signin:hover { border-color: var(--i-400); background: var(--s-hover); }
.od-v2 .odh-signin svg { width: 17px; height: 17px; }

.od-v2 .odh-sub { border-top: 1px solid var(--l-1); }
.od-v2 .odh-sub .odh-in { height: 42px; gap: 0; overflow-x: auto; scrollbar-width: none; }
.od-v2 .odh-sub .odh-in::-webkit-scrollbar { display: none; }
.od-v2 .odh-sub a {
  flex: 0 0 auto; height: 42px; padding: 0 12px; display: inline-flex; align-items: center;
  font: 500 13.5px/1 var(--ff); color: var(--i-700); text-decoration: none; white-space: nowrap;
  border-bottom: 2px solid transparent; margin-bottom: -1px;
}
.od-v2 .odh-sub a:first-child { padding-left: 0; }
.od-v2 .odh-sub a:hover { color: var(--i-900); }
.od-v2 .odh-sub a.is-on { color: var(--b-700); font-weight: 600; border-bottom-color: var(--b-600); }
.od-v2 .odh-sub .odh-sub-sep { width: 1px; height: 16px; background: var(--l-2); margin: 0 6px; flex-shrink: 0; }

.od-v2 .odh-msearch { display: none; }

/* Account menu (same ids and JS as before) */
.od-v2 .od-user-pop { position: relative; margin-left: 4px; }
.od-v2 .od-user-btn {
  width: 38px; height: 38px; border-radius: 50%; padding: 0; overflow: hidden;
  border: 1px solid var(--l-2); background: var(--b-50); cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
}
.od-v2 .od-user-btn img { width: 100%; height: 100%; object-fit: cover; display: block; }
.od-v2 .od-user-initial { font: 700 15px/1 var(--ff); color: var(--b-700); }
.od-v2 .od-user-menu {
  position: absolute; right: 0; top: calc(100% + 8px);
  width: 270px; padding: 6px !important; min-width: 0 !important;
  background: #fff; border: 1px solid var(--l-1); border-radius: var(--r-lg); box-shadow: var(--sh-3);
  opacity: 0; visibility: hidden; transform: translateY(-4px);
  transition: opacity .15s, transform .15s, visibility .15s;
}
.od-v2 .od-user-menu.open { opacity: 1; visibility: visible; transform: none; }
.od-v2 .odm-item {
  display: flex; align-items: center; gap: 12px; width: 100%;
  padding: 9px 10px; border-radius: var(--r-sm); border: 0; background: none;
  font: 500 14px/1.3 var(--ff); color: var(--i-800); text-align: left; text-decoration: none; cursor: pointer;
}
.od-v2 .odm-item:hover { background: var(--s-hover); color: var(--i-900); }
.od-v2 .odm-item svg { width: 18px; height: 18px; color: var(--i-500); flex-shrink: 0; }
.od-v2 .odm-sep { height: 1px; background: var(--l-1); margin: 6px 4px; }

@media (max-width: 1180px) {
  .od-v2 .odh-tool span { display: none; }
  .od-v2 .odh-tool { width: 40px; padding: 0; justify-content: center; }
}
@media (max-width: 768px) {
  .od-v2 .odh { top: calc(var(--hdr-h) * -1); }
  .od-v2 .odh-in { gap: 6px; }
  .od-v2 .odh-logo { font-size: 21px; }
  .od-v2 .odh-search, .od-v2 .odh-tools, .od-v2 .odh-sub { display: none; }
  .od-v2 .odh-actions { margin-left: auto; gap: 0; }
  .od-v2 .odh-signin { height: 34px; padding: 0 11px; font-size: 13px; }
  .od-v2 .odh-signin svg { display: none; }
  .od-v2 .od-user-btn { width: 34px; height: 34px; }
  .od-v2 .odh-msearch { display: block; padding: 0 var(--gut) 10px; }
  .od-v2 .odh-msearch button {
    width: 100%; height: 42px; padding: 0 14px; display: flex; align-items: center; gap: 10px;
    background: var(--s-well); border: 1px solid var(--l-2); border-radius: var(--r-sm);
    color: var(--i-500); font: 400 14.5px/1 var(--ff); text-align: left; cursor: text;
  }
  .od-v2 .odh-msearch svg { width: 18px; height: 18px; color: var(--i-600); flex-shrink: 0; }
}

/* ---------- 3b. Header polish: real buttons ------------------------------ */
.od-v2 .odh { transition: box-shadow .2s; }
.od-v2 .odh.is-scrolled { box-shadow: 0 6px 18px -12px rgba(16, 24, 40, .35); }
.od-v2 .odh-top .odh-in { height: 66px; gap: 16px; }
.od-v2 .odh-logo { font-size: 24px; letter-spacing: -0.05em; }

/* Search: bigger, white, orange focus ring */
.od-v2 .odh-search {
  height: 44px; max-width: 620px; padding-left: 16px; background: #fff;
  border: 1.5px solid var(--l-2); border-radius: 12px; box-shadow: 0 1px 2px rgba(16, 24, 40, .04);
}
.od-v2 .odh-search:hover { border-color: var(--b-500); box-shadow: 0 0 0 4px var(--b-50); }
.od-v2 .odh-search > svg { color: var(--i-400); }
.od-v2 .odh-search-go { margin: -1.5px -1.5px -1.5px 0; padding: 0 20px; border-radius: 0 12px 12px 0; }

/* Tools: bordered buttons with an icon tile */
.od-v2 .odh-tools { gap: 8px; }
.od-v2 .odh-tool {
  height: 44px; padding: 0 14px 0 6px; gap: 9px; border-radius: 12px;
  background: #fff; border: 1px solid var(--l-1); color: var(--i-800);
  font: 600 14px/1 var(--ff); transition: border-color .15s, background-color .15s, color .15s, transform .15s;
}
.od-v2 .odh-tool-ico {
  width: 32px; height: 32px; border-radius: 9px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--b-50); color: var(--b-600); transition: background-color .15s, color .15s;
}
.od-v2 .odh-tool-ico svg { width: 17px; height: 17px; }
.od-v2 .odh-tool:hover { border-color: var(--b-200); background: var(--b-50); color: var(--b-700); }
.od-v2 .odh-tool:hover .odh-tool-ico, .od-v2 .odh-tool.is-on .odh-tool-ico { background: var(--b-600); color: #fff; }
.od-v2 .odh-tool.is-on { border-color: var(--b-200); color: var(--b-700); }

/* Saved: square outlined icon button */
.od-v2 .odh-actions { gap: 8px; }
.od-v2 .odh-icon.wishlist-header-btn {
  width: 44px; height: 44px; border-radius: 12px; border: 1px solid var(--l-1); background: #fff; color: var(--i-700);
  transition: border-color .15s, background-color .15s, color .15s;
}
.od-v2 .odh-icon.wishlist-header-btn:hover { border-color: #F6C3B4; background: var(--b-50); color: var(--b-600); }
.od-v2 .odh-icon .wishlist-count { top: -6px; right: -6px; min-width: 19px; height: 19px; line-height: 15px; font-size: 10.5px; }

/* Sign in: the one solid call to action */
.od-v2 .odh-signin {
  height: 44px; padding: 0 20px; margin-left: 0; gap: 8px; border-radius: 12px;
  background: var(--b-600); border: 1px solid var(--b-600); color: #fff !important;
  font: 700 14.5px/1 var(--ff); box-shadow: 0 2px 6px -1px rgba(229, 67, 31, .35);
  transition: background-color .15s, box-shadow .15s, transform .15s;
}
.od-v2 .odh-signin:hover { background: var(--b-700); border-color: var(--b-700); box-shadow: 0 4px 12px -2px rgba(229, 67, 31, .45); transform: translateY(-1px); }
.od-v2 .odh-signin:active { transform: none; }
.od-v2 .od-user-btn { width: 44px; height: 44px; border: 2px solid var(--b-100); }

/* Sub-nav: medium weight, orange hover/active, highlighted "Biggest drops" */
.od-v2 .odh-sub .odh-in { height: 46px; }
.od-v2 .odh-sub a { height: 46px; padding: 0 10px; font: 500 14px/1 var(--ff); color: var(--i-700); transition: color .15s, border-color .15s; }
.od-v2 .odh-sub a:hover { color: var(--b-600); }
.od-v2 .odh-sub a.is-on { color: var(--b-600); font-weight: 700; border-bottom-color: var(--b-600); }
/* "All deals" (blue) and "Biggest drops" (orange) as liquid-glass pills:
   tinted translucent body, specular top edge, rim light at the bottom,
   a coloured glow underneath and a light sweep on hover. */
.od-v2 .odh-sub a.odh-sub-ico {
  --gl: 37, 99, 235; --gl-ink: #1D4ED8;
  position: relative; isolation: isolate; overflow: hidden;
  height: 34px; margin: 0 6px 0 0; padding: 0 15px 0 12px; gap: 7px;
  border: 1px solid rgba(var(--gl), .22); border-radius: 999px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.92) 0%, rgba(255,255,255,.35) 55%, rgba(255,255,255,.6) 100%),
    radial-gradient(130% 120% at 50% 130%, rgba(var(--gl), .28), rgba(var(--gl), .06) 70%),
    rgba(var(--gl), .07);
  -webkit-backdrop-filter: blur(14px) saturate(180%); backdrop-filter: blur(14px) saturate(180%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,1),
    inset 0 -1px 1px rgba(255,255,255,.7),
    inset 0 -6px 10px -6px rgba(var(--gl), .30),
    0 1px 2px rgba(var(--gl), .12),
    0 6px 14px -8px rgba(var(--gl), .55);
  font: 600 13.5px/1 var(--ff); color: var(--gl-ink);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.od-v2 .odh-sub a.odh-sub-hot { --gl: 240, 88, 47; --gl-ink: #C73614; }
.od-v2 .odh-sub a.odh-sub-ico::before {
  content: ""; position: absolute; z-index: -1; top: 0; bottom: 0; left: -60%; width: 45%;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,.75), transparent);
  transform: skewX(-18deg); transition: left .55s ease; pointer-events: none;
}
.od-v2 .odh-sub a.odh-sub-ico svg { width: 15px; height: 15px; flex-shrink: 0; filter: drop-shadow(0 1px 0 rgba(255,255,255,.8)); }
.od-v2 .odh-sub a.odh-sub-ico:hover {
  color: var(--gl-ink); transform: translateY(-1px); border-color: rgba(var(--gl), .38);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,1),
    inset 0 -1px 1px rgba(255,255,255,.7),
    inset 0 -8px 12px -6px rgba(var(--gl), .38),
    0 2px 4px rgba(var(--gl), .14),
    0 10px 20px -10px rgba(var(--gl), .7);
}
.od-v2 .odh-sub a.odh-sub-ico:hover::before { left: 120%; }
.od-v2 .odh-sub a.odh-sub-ico:active { transform: scale(.97); }
.od-v2 .odh-sub a.odh-sub-ico.is-on {
  color: #fff; border-color: rgba(var(--gl), .9);
  background:
    linear-gradient(180deg, rgba(255,255,255,.42) 0%, rgba(255,255,255,.06) 55%, rgba(255,255,255,.18) 100%),
    rgba(var(--gl), .92);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.65),
    inset 0 -2px 6px rgba(0,0,0,.12),
    0 1px 2px rgba(var(--gl), .25),
    0 8px 18px -8px rgba(var(--gl), .8);
}
.od-v2 .odh-sub a.odh-sub-ico.is-on svg { filter: none; }
.od-v2 .odh-sub .odh-sub-end { margin-left: auto; }
.od-v2 .odh-sub a:last-child { padding-right: 0; }

@media (max-width: 1180px) {
  .od-v2 .odh-tool { width: 44px; padding: 0; justify-content: center; }
  .od-v2 .odh-tool-ico { background: transparent; }
}
@media (max-width: 768px) {
  .od-v2 .odh-top .odh-in { height: var(--hdr-h); gap: 8px; }
  .od-v2 .odh-logo { font-size: 22px; }
  .od-v2 .odh-actions { gap: 6px; }
  .od-v2 .odh-icon.wishlist-header-btn { width: 38px; height: 38px; border-radius: 10px; }
  .od-v2 .odh-signin { height: 38px; padding: 0 14px; font-size: 13.5px; border-radius: 10px; }
  .od-v2 .od-user-btn { width: 38px; height: 38px; }
  .od-v2 .odh-msearch button { height: 44px; border: 1.5px solid var(--l-2); border-radius: 12px; background: #fff; }
}

/* ---------- 4. Search overlay (markup shared with v1) -------------------- */
.od-v2 .search-overlay .search-modal {
  border-radius: var(--r-xl) !important; border: 1px solid var(--l-1) !important;
  box-shadow: var(--sh-3) !important; font-family: var(--ff);
}
.od-v2 .search-modal-input { border-bottom: 1px solid var(--l-1) !important; }
.od-v2 .search-modal-input input { font: 500 16px/1.4 var(--ff) !important; color: var(--i-900) !important; }
.od-v2 .search-modal-input > svg { color: var(--i-500) !important; }
.od-v2 .search-filter-chip, .od-v2 .search-ai-prompt {
  background: #fff !important; border: 1px solid var(--l-2) !important; color: var(--i-700) !important;
  border-radius: 999px !important; box-shadow: none !important; font-weight: 600 !important;
}
.od-v2 .search-filter-chip:hover, .od-v2 .search-ai-prompt:hover { border-color: var(--i-400) !important; color: var(--i-900) !important; }
.od-v2 .search-ai-prompt-icon { background: var(--s-well) !important; color: var(--i-600) !important; }
.od-v2 .se-title { color: var(--i-900) !important; font-weight: 700 !important; letter-spacing: -0.02em; }
.od-v2 .se-grad { background: none !important; -webkit-text-fill-color: currentColor !important; color: var(--b-600) !important; }
.od-v2 .se-sub { color: var(--i-500) !important; }
.od-v2 .se-trust, .od-v2 .search-modal-footer { display: none !important; }
.od-v2 .se-prompts-label { color: var(--i-500) !important; }
.od-v2 .search-img-btn, .od-v2 .search-voice-btn {
  background: var(--s-well) !important; border: 1px solid var(--l-1) !important; color: var(--i-700) !important;
  box-shadow: none !important;
}
.od-v2 .search-img-btn:hover, .od-v2 .search-voice-btn:hover { background: var(--s-hover) !important; color: var(--i-900) !important; transform: none !important; }
.od-v2 .search-voice-btn.listening, .od-v2 .search-voice-btn[aria-pressed="true"] { background: var(--f-red-bg) !important; color: var(--f-red) !important; border-color: #F3C9C2 !important; }
.od-v2 .search-close-btn { background: var(--s-well) !important; color: var(--i-700) !important; border: 1px solid var(--l-1) !important; box-shadow: none !important; }
.od-v2 .sap-tag {
  background: var(--f-red-bg) !important; color: var(--f-red) !important; border: 0 !important;
  font: 700 11px/1 var(--ff) !important; padding: 4px 7px !important; border-radius: 5px !important;
  box-shadow: none !important; text-transform: none !important; letter-spacing: 0 !important;
}
.od-v2 .search-result-item { border-radius: var(--r-md) !important; }
.od-v2 .search-result-item:hover { background: var(--s-hover) !important; }

/* ---------- 5. Mobile bottom tab bar ------------------------------------ */
@media (max-width: 768px) {
  .od-v2 .mobile-bottom-nav {
    left: 0 !important; right: 0 !important; bottom: 0 !important;
    max-width: none !important; height: calc(58px + env(safe-area-inset-bottom, 0px)) !important;
    padding: 0 4px env(safe-area-inset-bottom, 0px) !important;
    border-radius: 0 !important; border: 0 !important; border-top: 1px solid var(--l-1) !important;
    background: #fff !important;
    -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
    box-shadow: 0 -4px 16px -8px rgba(22, 24, 27, .10) !important;
  }
  .od-v2 .mobile-bottom-nav::before, .od-v2 .mobile-bottom-nav::after { display: none !important; }
  .od-v2 .bottom-nav-item {
    color: var(--i-500) !important; gap: 3px !important; height: 58px !important;
    -webkit-tap-highlight-color: transparent;
  }
  .od-v2 .bottom-nav-item .bn-icon-wrap { width: auto !important; height: auto !important; background: none !important; box-shadow: none !important; }
  .od-v2 .bottom-nav-item svg { width: 22px !important; height: 22px !important; stroke-width: 1.8 !important; }
  .od-v2 .bottom-nav-item .bn-label { font: 600 11px/1 var(--ff) !important; color: inherit !important; letter-spacing: 0 !important; }
  .od-v2 .bottom-nav-item.active { color: var(--b-600) !important; }
  .od-v2 .bottom-nav-item.active::after, .od-v2 .bottom-nav-item.active:not(.bottom-nav-home)::after { display: none !important; }
  .od-v2 .bottom-nav-item.active svg { stroke: currentColor !important; }
  /* Home: an ordinary tab, not a raised 3D button */
  .od-v2 .bottom-nav-home { transform: none !important; margin: 0 !important; }
  .od-v2 .bottom-nav-home-icon {
    width: auto !important; height: auto !important; margin: 0 !important; transform: none !important;
    background: none !important; box-shadow: none !important; border: 0 !important; border-radius: 0 !important;
    color: inherit !important;
  }
  .od-v2 .bottom-nav-home-icon::before, .od-v2 .bottom-nav-home-icon::after { display: none !important; }
  .od-v2 .bottom-nav-home-icon svg { color: inherit !important; stroke: currentColor !important; }
  .od-v2 .bottom-nav-home .bn-label { color: inherit !important; margin-top: 0 !important; }
  .od-v2 { padding-bottom: calc(66px + env(safe-area-inset-bottom, 0px)) !important; }
}

/* Scroll-to-top: small neutral chip instead of a glowing orange ball.
   (Its colours are set inline + by JS on hover, hence !important.) */
.od-v2 #scrollTopBtn {
  width: 40px !important; height: 40px !important;
  background: #fff !important; border: 1px solid var(--l-2) !important;
  box-shadow: var(--sh-2) !important; right: 16px !important;
}
.od-v2 #scrollTopBtn svg { stroke: var(--i-800) !important; width: 18px; height: 18px; }
@media (max-width: 768px) { .od-v2 #scrollTopBtn { bottom: calc(76px + env(safe-area-inset-bottom, 0px)) !important; } }

/* ---------- 6. Footer ----------------------------------------------------- */
.od-v2 .footer {
  background: #fff !important; border-top: 1px solid var(--l-1) !important;
  color: var(--i-600) !important; margin-top: 56px; padding: 48px 0 28px !important;
}
.od-v2 .footer .logo-text { font-size: 20px; font-weight: 800; letter-spacing: -0.035em; color: var(--i-900) !important; }
.od-v2 .footer .logo-text span { color: var(--b-600) !important; background: none !important; -webkit-text-fill-color: currentColor !important; }
.od-v2 .footer p { color: var(--i-500) !important; font-size: 14px; line-height: 1.6; }
.od-v2 .footer h4 { color: var(--i-900) !important; font-size: 13px !important; font-weight: 700 !important; letter-spacing: 0; text-transform: none; margin-bottom: 12px; }
.od-v2 .footer-col a { color: var(--i-600) !important; font-size: 14px; }
.od-v2 .footer-col a:hover { color: var(--b-700) !important; }
.od-v2 .footer-bottom { border-top: 1px solid var(--l-1) !important; color: var(--i-500) !important; }
.od-v2 .footer-bottom p { font-size: 12.5px !important; }

/* ---------- 7. Sections, rails, grids ------------------------------------ */
.od-v2 .section { padding: 8px 0 !important; }
.od-v2 .section-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px !important; }
.od-v2 .section-title {
  font: 700 19px/1.25 var(--ff) !important; letter-spacing: -0.02em !important; color: var(--i-900) !important;
  display: flex; align-items: center; gap: 10px; margin: 0 !important;
}
.od-v2 .section-title span:not(.od-sec-count) { background: none !important; -webkit-text-fill-color: currentColor !important; }
.od-v2 .od-sec-sub { margin: 3px 0 0; font: 400 13px/1.35 var(--ff); color: var(--i-500); }
.od-v2 .od-sec-count { font-weight: 500; color: var(--i-500); font-size: 14px; letter-spacing: 0; }
.od-v2 .rail-link, .od-v2 .od-sec-link {
  flex-shrink: 0; height: 32px; padding: 0 12px; display: inline-flex; align-items: center; gap: 4px;
  border: 1px solid var(--l-2); border-radius: var(--r-sm); background: #fff;
  color: var(--b-700) !important; font: 600 13px/1 var(--ff) !important; text-decoration: none; white-space: nowrap;
}
.od-v2 .rail-link:hover, .od-v2 .od-sec-link:hover { border-color: var(--b-600); background: var(--b-50); color: var(--b-800) !important; }
.od-v2 .rail-icon, .od-v2 .live-indicator { display: none !important; }

/* Homepage: every rail and the grid sit in a white panel on the gray canvas */
.od-v2.od-page-index .section > .container {
  background: #fff; border: 1px solid var(--l-1); border-radius: var(--r-lg);
  padding-top: 16px; padding-bottom: 16px;
}

.od-v2 .deal-rail-wrap { position: relative; }
.od-v2 .deal-rail {
  display: flex !important; gap: 12px !important; overflow-x: auto; scroll-snap-type: x mandatory;
  scrollbar-width: none; padding: 1px 1px 2px !important; margin: 0 -1px;
}
.od-v2 .deal-rail::-webkit-scrollbar { display: none; }
.od-v2 .rail-item { flex: 0 0 214px !important; width: 214px !important; max-width: none !important; scroll-snap-align: start; }
.od-v2 .rail-nav {
  position: absolute; top: 38%; transform: translateY(-50%); z-index: 5;
  display: inline-flex; align-items: center; justify-content: center; padding: 0; cursor: pointer;
  width: 36px !important; height: 36px !important; border-radius: 50% !important;
  background: #fff !important; color: var(--i-800) !important; border: 1px solid var(--l-2) !important;
  box-shadow: var(--sh-2) !important; transition: opacity .15s, background-color .15s;
}
.od-v2 .rail-nav:hover { background: var(--s-hover) !important; }
.od-v2 .rail-nav-prev { left: -14px; }
.od-v2 .rail-nav-next { right: -14px; }
.od-v2 .rail-nav[disabled] { opacity: 0; pointer-events: none; }
.od-v2 .rail-nav svg { width: 16px; height: 16px; }

.od-v2 .deals-grid {
  display: grid !important; gap: 12px !important;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)) !important;
}
.od-v2 .deals-grid > .deal-animate { min-width: 0; animation: none !important; opacity: 1 !important; transform: none !important; }

@media (max-width: 768px) {
  .od-v2 .section { padding: 5px 0 !important; }
  .od-v2 .section-title { font-size: 17px !important; }
  .od-v2 .od-sec-sub { font-size: 12.5px; }
  .od-v2.od-page-index .section > .container { border-radius: 0; border-left: 0; border-right: 0; padding-top: 14px; padding-bottom: 14px; }
  .od-v2 .rail-item { flex-basis: 152px !important; width: 152px !important; }
  .od-v2 .rail-nav { display: none !important; }
  .od-v2 .deal-rail { gap: 8px !important; margin-right: calc(var(--gut) * -1); padding-right: var(--gut) !important; }
  .od-v2 .deals-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 8px !important; }
}

/* Load-more button (inline-styled in the pages) */
.od-v2 #loadMoreBtn {
  background: #fff !important; color: var(--i-900) !important; border: 1px solid var(--l-2) !important;
  border-radius: var(--r-sm) !important; font: 600 14px/1 var(--ff) !important; padding: 12px 26px !important;
}
.od-v2 #loadMoreBtn:hover { border-color: var(--i-400) !important; }
.od-v2 .loader-spinner { border-color: var(--l-1) !important; border-top-color: var(--b-600) !important; }

/* ---------- 8. Deal card -------------------------------------------------- */
.od-v2 .odc {
  position: relative; height: 100%; display: flex; flex-direction: column;
  background: var(--s-card); border: 1px solid var(--l-1); border-radius: var(--r-lg);
  overflow: hidden; transition: border-color .15s, box-shadow .15s;
}
@media (hover: hover) {
  .od-v2 .odc:hover { border-color: var(--l-2); box-shadow: var(--sh-2); }
  .od-v2 .odc:hover .odc-title { color: var(--b-700); }
}
.od-v2 .odc-link { display: flex; flex-direction: column; flex: 1; text-decoration: none; color: inherit; min-width: 0; }
.od-v2 .odc-media {
  position: relative; aspect-ratio: 1 / 1; background: #fff;
  display: flex; align-items: center; justify-content: center; overflow: hidden;
  border-bottom: 1px solid var(--l-1);
}
.od-v2 .odc-media img { width: 100%; height: 100%; object-fit: contain; padding: 12px; box-sizing: border-box; }
.od-v2 .odc-ph { color: var(--i-300); width: 40px; height: 40px; }
.od-v2 .odc-time {
  position: absolute; left: 6px; bottom: 6px;
  display: inline-flex; align-items: center; gap: 4px; padding: 3px 6px; border-radius: var(--r-xs);
  background: rgba(27, 29, 33, .72); color: #fff;
  font: 600 10.5px/1.2 var(--ff); font-variant-numeric: tabular-nums;
}
.od-v2 .odc-time svg { width: 10px; height: 10px; }
.od-v2 .odc-save {
  position: absolute; top: 6px; right: 6px; z-index: 2;
  width: 30px; height: 30px; border-radius: 50%; padding: 0;
  display: inline-flex; align-items: center; justify-content: center;
  background: #fff; border: 1px solid var(--l-1); color: var(--i-500);
  cursor: pointer; transition: color .15s, border-color .15s;
}
.od-v2 .odc-save:hover { color: var(--f-red); border-color: var(--l-2); }
.od-v2 .odc-save svg { width: 15px; height: 15px; }
.od-v2 .odc-save.wishlisted { color: #E0443A; }

.od-v2 .odc-body { padding: 10px 11px 2px; display: flex; flex-direction: column; gap: 5px; flex: 1; min-width: 0; }
.od-v2 .odc-title {
  margin: 0; font: 600 13.5px/1.38 var(--ff) !important; color: var(--i-900);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  min-height: 2.76em; word-break: break-word; transition: color .15s;
}
.od-v2 .odc-price { display: flex; align-items: baseline; flex-wrap: wrap; column-gap: 6px; row-gap: 1px; }
.od-v2 .odc-now { font: 700 16.5px/1.15 var(--ff); color: var(--b-600); font-variant-numeric: tabular-nums; }
.od-v2 .odc-was { font: 400 12.5px/1.15 var(--ff); color: var(--i-500); font-variant-numeric: tabular-nums; }
.od-v2 .odc-off { font: 700 12.5px/1.15 var(--ff); color: var(--g-600); font-variant-numeric: tabular-nums; }
.od-v2 .odc-meta {
  margin-top: auto; padding-top: 1px; display: flex; align-items: center; gap: 5px; min-width: 0;
  font: 400 11.5px/1.3 var(--ff); color: var(--i-500);
}
.od-v2 .odc-meta svg { width: 12px; height: 12px; flex-shrink: 0; }
.od-v2 .odc-meta span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.od-v2 .odc-meta.t-green { color: var(--g-700); }
.od-v2 .odc-meta.t-red { color: var(--f-red); }
.od-v2 .odc-meta.t-amber { color: var(--f-amber); }
.od-v2 .odc-rate { display: inline-flex; align-items: center; gap: 3px; font: 600 11.5px/1 var(--ff); color: var(--i-700); }
.od-v2 .odc-rate svg { width: 11px; height: 11px; color: #D99A00; }

.od-v2 .odc-foot { display: flex; gap: 6px; padding: 8px 11px 11px; }
.od-v2 .odc-buy {
  flex: 1; min-width: 0; height: 34px;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--r-sm); text-decoration: none;
  font: 600 13px/1 var(--ff); white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  background: var(--b-600); color: #fff; border: 1px solid var(--b-600);
  transition: background-color .15s, border-color .15s;
}
.od-v2 .odc-buy:hover { background: var(--b-700); border-color: var(--b-700); color: #fff; }
.od-v2 .odc--fk .odc-buy { background: var(--f-fk); border-color: var(--f-fk); color: #fff; }
.od-v2 .odc--fk .odc-buy:hover { background: var(--f-fk-hover); border-color: var(--f-fk-hover); }
.od-v2 .odc-share {
  width: 34px; height: 34px; flex-shrink: 0; padding: 0;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--r-sm); background: #fff; border: 1px solid var(--l-2); color: var(--i-600);
  cursor: pointer; transition: border-color .15s, color .15s;
}
.od-v2 .odc-share:hover { border-color: var(--i-400); color: var(--i-900); }
.od-v2 .odc-share svg { width: 15px; height: 15px; }

@media (max-width: 768px) {
  .od-v2 .odc-media img { padding: 8px; }
  .od-v2 .odc-body { padding: 8px 9px 1px; gap: 4px; }
  .od-v2 .odc-title { font-size: 13px !important; }
  .od-v2 .odc-now { font-size: 15px; }
  .od-v2 .odc-was, .od-v2 .odc-off { font-size: 11.5px; }
  .od-v2 .odc-meta { font-size: 11px; }
  .od-v2 .odc-foot { padding: 7px 9px 9px; gap: 5px; }
  .od-v2 .odc-buy { height: 32px; font-size: 12px; }
  .od-v2 .odc-share { width: 32px; height: 32px; }
  .od-v2 .odc-save { width: 28px; height: 28px; }
}
@media (max-width: 360px) { .od-v2 .odc-share { display: none; } }

/* ---------- 9. Shop by budget -------------------------------------------- */
.od-v2 .od-sr { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.od-v2 .odbud-row { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 10px; }
.od-v2 .odbud-tile {
  display: flex; flex-direction: column; gap: 7px; min-width: 0; padding: 10px 10px 11px;
  background: #fff; border: 1px solid var(--l-1); border-radius: var(--r-lg);
  text-decoration: none; color: inherit; transition: border-color .15s, box-shadow .15s;
}
.od-v2 .odbud-tile:hover { border-color: var(--l-2); box-shadow: var(--sh-2); }
.od-v2 .odbud-imgs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 4px; }
.od-v2 .odbud-imgs span { aspect-ratio: 1 / 1; border-radius: var(--r-xs); background: var(--s-well); overflow: hidden; display: flex; }
.od-v2 .odbud-imgs img { width: 100%; height: 100%; object-fit: contain; padding: 4px; box-sizing: border-box; mix-blend-mode: multiply; }
.od-v2 .odbud-label { padding: 0 2px; font: 800 16px/1.2 var(--ff); letter-spacing: -0.02em; color: #1A1A1A; }
.od-v2 .odbud-count { padding: 0 2px; margin-top: -3px; font: 600 12.5px/1.2 var(--ff); color: var(--b-600); }
.od-v2 .odbud-tile:hover .odbud-label { color: var(--b-700); }
@media (max-width: 1024px) {
  .od-v2 .odbud-row {
    grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 38%;
    overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-bottom: 2px;
  }
  .od-v2 .odbud-row::-webkit-scrollbar { display: none; }
  .od-v2 .odbud-tile { scroll-snap-align: start; }
}
@media (max-width: 768px) {
  .od-v2 .odbud-row { grid-auto-columns: 42%; gap: 8px; margin-right: calc(var(--gut) * -1); padding-right: var(--gut); }
  .od-v2 .odbud-tile { padding: 8px 8px 9px; gap: 6px; }
  .od-v2 .odbud-label { font-size: 14.5px; }
  .od-v2 .odbud-count { font-size: 12px; }
}

/* ---------- 10. Homepage: category strip --------------------------------- */
.od-v2 .odcats { background: #fff; border-bottom: 1px solid var(--l-1); padding: 12px 0 10px; }
.od-v2 .odcats-row {
  display: flex; gap: 4px; overflow-x: auto; scroll-snap-type: x proximity;
  scrollbar-width: none; justify-content: space-between;
}
.od-v2 .odcats-row::-webkit-scrollbar { display: none; }
.od-v2 .odcat {
  flex: 0 0 auto; width: 92px; scroll-snap-align: start;
  display: flex; flex-direction: column; align-items: center; gap: 6px; text-decoration: none;
}
.od-v2 .odcat-img {
  width: 64px; height: 64px; border-radius: 12px; overflow: hidden; background: var(--s-well);
  display: flex; align-items: center; justify-content: center;
}
.od-v2 .odcat-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .2s; }
.od-v2 .odcat:hover .odcat-img img { transform: scale(1.05); }
.od-v2 .odcat-name {
  font: 500 12.5px/1.25 var(--ff); color: var(--i-800); text-align: center;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.od-v2 .odcat:hover .odcat-name { color: var(--b-700); }
@media (max-width: 768px) {
  .od-v2 .odcats { padding: 10px 0 8px; }
  .od-v2 .odcats-row { justify-content: flex-start; margin-right: calc(var(--gut) * -1); padding-right: var(--gut); }
  .od-v2 .odcat { width: 72px; gap: 5px; }
  .od-v2 .odcat-img { width: 54px; height: 54px; border-radius: 10px; }
  .od-v2 .odcat-name { font-size: 11.5px; }
}

/* ---------- 11. /latest, /store, /category (deals.php) ------------------- */
.od-v2 .store-tabs {
  display: flex !important; gap: 8px !important; overflow-x: auto; flex-wrap: nowrap !important;
  scrollbar-width: none; padding-bottom: 2px; margin-bottom: 14px !important;
}
.od-v2 .store-tabs::-webkit-scrollbar { display: none; }
.od-v2 .store-tab {
  flex: 0 0 auto; height: 36px !important; padding: 0 15px !important;
  display: inline-flex !important; align-items: center;
  border-radius: 999px !important; background: #fff !important; border: 1px solid var(--l-2) !important;
  color: var(--i-700) !important; font: 600 13.5px/1 var(--ff) !important; box-shadow: none !important;
  text-decoration: none; transition: border-color .15s, color .15s;
}
.od-v2 .store-tab:hover { border-color: var(--i-400) !important; color: var(--i-900) !important; }
.od-v2 .store-tab.active { background: var(--i-900) !important; border-color: var(--i-900) !important; color: #fff !important; }

.od-v2 .od-filter-bar { border-radius: var(--r-lg) !important; border-color: var(--l-1) !important; box-shadow: none !important; margin-bottom: 18px !important; }
.od-v2 .od-filter-head { padding: 12px 16px !important; }
.od-v2 .od-filter-bar.open .od-filter-head { background: #fff !important; }
.od-v2 .od-filter-head-title { font: 600 14px/1 var(--ff) !important; }
.od-v2 .od-filter-head-title svg { color: var(--i-700) !important; }
.od-v2 .od-filter-select, .od-v2 .od-filter-input { border: 1px solid var(--l-2) !important; border-radius: var(--r-md) !important; font-family: var(--ff) !important; }
.od-v2 .od-filter-select:focus, .od-v2 .od-filter-input:focus { border-color: var(--b-600) !important; box-shadow: 0 0 0 3px var(--b-50) !important; }
.od-v2 .od-filter-label, .od-v2 .od-filter-discount-label { letter-spacing: .04em !important; color: var(--i-500) !important; }
.od-v2 .od-filter-chip { border: 1px solid var(--l-2) !important; font-family: var(--ff) !important; }
.od-v2 .od-filter-chip:hover { border-color: var(--i-400) !important; color: var(--i-900) !important; }
.od-v2 .od-filter-chip.active { background: var(--i-900) !important; border-color: var(--i-900) !important; color: #fff !important; box-shadow: none !important; }
.od-v2 .od-filter-btn { background: var(--b-600) !important; border-radius: var(--r-md) !important; font-family: var(--ff) !important; }
.od-v2 .od-filter-btn:hover { background: var(--b-700) !important; }
.od-v2 .od-filter-clear { border: 1px solid var(--l-2) !important; font-family: var(--ff) !important; }
.od-v2 .od-filter-active-tag { background: var(--b-50) !important; color: var(--b-800) !important; }
.od-v2 .od-filter-active-tag:hover { background: var(--b-600) !important; color: #fff !important; }
.od-v2 .od-filter-head-title span[style] { background: var(--b-600) !important; }

.od-v2 .od-page-head { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; margin: 6px 0 16px; }
.od-v2 .od-page-head h1 { margin: 0; font: 800 28px/1.15 var(--ff) !important; letter-spacing: -0.03em !important; }
.od-v2 .od-page-head p { margin: 0; font: 500 14px/1.4 var(--ff); color: var(--i-500); }
@media (max-width: 768px) { .od-v2 .od-page-head h1 { font-size: 22px !important; } }

.od-v2 .no-results { background: #fff; border: 1px dashed var(--l-2); border-radius: var(--r-lg); padding: 40px 20px; text-align: center; }
.od-v2 .no-results h3 { font: 700 18px/1.3 var(--ff); }
.od-v2 .no-results p { color: var(--i-500); }

/* ---------- 12. Deal page -------------------------------------------------- */
.od-v2 .deal-detail-section { padding: 18px 0 8px !important; background: transparent !important; }
.od-v2 .deal-back-bar { display: none !important; }
.od-v2 .deal-breadcrumb {
  display: flex !important; align-items: center; gap: 6px; flex-wrap: nowrap; min-width: 0;
  margin: 0 0 16px !important; padding: 0 !important; background: none !important;
  font: 500 13px/1.4 var(--ff) !important; color: var(--i-500) !important;
}
.od-v2 .deal-breadcrumb a { color: var(--i-600) !important; text-decoration: none; white-space: nowrap; }
.od-v2 .deal-breadcrumb a:hover { color: var(--b-700) !important; text-decoration: underline; text-underline-offset: 3px; }
.od-v2 .deal-breadcrumb svg { color: var(--i-400); flex-shrink: 0; }
.od-v2 .deal-breadcrumb span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; min-width: 0; color: var(--i-500) !important; }

.od-v2 .deal-detail-grid { gap: 32px !important; align-items: start; }
.od-v2 .deal-detail-image, .od-v2 .deal-detail-image-v2 {
  background: #fff !important; border: 1px solid var(--l-1) !important; border-radius: var(--r-xl) !important;
  box-shadow: none !important; padding: 0 !important; overflow: hidden;
}
.od-v2 .deal-detail-image-v2 { display: block !important; min-height: 0 !important; }
.od-v2 .ddi-img-wrap {
  background: var(--s-well) !important; aspect-ratio: 1 / 1; height: auto !important; width: 100% !important;
  max-width: none !important; margin: 0 !important; border-radius: 0 !important;
  display: flex !important; align-items: center; justify-content: center;
}
.od-v2 .ddi-img-wrap img { width: 100% !important; height: 100% !important; max-width: none !important; object-fit: contain !important; padding: 32px; box-sizing: border-box; mix-blend-mode: multiply; max-height: none !important; margin: 0 !important; }
/* The "% off" lives in the price row on v2, next to the numbers it describes. */
.od-v2 .ddi-badge, .od-v2 .deal-detail-image .deal-badge { display: none !important; }
.od-v2 .ph-chart-legend-inline .swatch { background: var(--b-600) !important; }
.od-v2 .deal-detail-share-float, .od-v2 .deal-detail-image .deal-wishlist-btn {
  width: 38px !important; height: 38px !important; border-radius: 50% !important;
  background: #fff !important; border: 1px solid var(--l-1) !important; color: var(--i-700) !important;
  box-shadow: var(--sh-1) !important;
}
.od-v2 .deal-detail-image .deal-wishlist-btn.wishlisted { color: #E0443A !important; }

.od-v2 .deal-detail-info { padding: 4px 0 0 !important; background: transparent !important; border: 0 !important; box-shadow: none !important; gap: 0 !important; }
.od-v2 .deal-detail-store {
  display: inline-flex !important; align-items: center; gap: 7px; height: 30px; padding: 0 11px !important;
  border-radius: 999px !important; background: #fff !important; border: 1px solid var(--l-2) !important;
  color: var(--i-700) !important; font: 600 13px/1 var(--ff) !important; text-decoration: none; box-shadow: none !important;
}
.od-v2 .deal-detail-store:hover { border-color: var(--i-400) !important; color: var(--i-900) !important; }
.od-v2 .deal-detail-title {
  margin: 14px 0 8px !important; font: 700 26px/1.25 var(--ff) !important; letter-spacing: -0.02em !important;
  color: var(--i-900) !important; text-wrap: pretty;
}
.od-v2 .deal-detail-rating > span:first-child { background: var(--s-well) !important; color: var(--i-800) !important; border-radius: 7px !important; font-weight: 700 !important; }
.od-v2 .deal-detail-rating > span:first-child svg { color: #D99A00; }
.od-v2 .deal-detail-rating span[title] {
  background: var(--s-well) !important; color: var(--i-600) !important; border: 1px solid var(--l-1) !important;
  text-transform: none !important; letter-spacing: 0 !important; font-weight: 600 !important;
}
.od-v2 .deal-detail-pricing {
  display: flex !important; align-items: baseline; flex-wrap: wrap; gap: 6px 12px;
  margin: 14px 0 6px !important; padding: 0 !important; background: none !important; border: 0 !important;
}
.od-v2 .deal-detail-price { font: 800 34px/1 var(--ff) !important; letter-spacing: -0.03em !important; color: var(--i-900) !important; font-variant-numeric: tabular-nums; }
.od-v2 .deal-detail-mrp { font: 500 15px/1 var(--ff) !important; color: var(--i-500) !important; font-variant-numeric: tabular-nums; }
.od-v2 .deal-detail-save {
  background: var(--g-50) !important; color: var(--g-700) !important; border: 0 !important;
  border-radius: 7px !important; padding: 6px 9px !important; font: 700 13px/1 var(--ff) !important;
}
.od-v2 .od-dd-off { font: 700 15px/1 var(--ff); color: var(--g-600); font-variant-numeric: tabular-nums; }
.od-v2 .deal-detail-meta {
  display: flex !important; flex-wrap: wrap; align-items: center; gap: 8px 16px;
  margin: 12px 0 0 !important; padding: 14px 0 0 !important; border-top: 1px solid var(--l-1) !important;
  font: 500 13px/1.4 var(--ff) !important; color: var(--i-600) !important;
}
.od-v2 .deal-detail-meta > span { display: inline-flex; align-items: center; gap: 5px; }
.od-v2 .deal-detail-meta svg { width: 14px; height: 14px; }

.od-v2 .deal-oos-banner { border-radius: var(--r-lg) !important; background: var(--f-red-bg) !important; border: 1px solid #F3C9C2 !important; }

/* Buy block: desktop = card in the info column, mobile = sticky bottom bar */
.od-v2 .deal-detail-buybar {
  margin-top: 18px !important; padding: 14px !important;
  display: flex !important; align-items: center; gap: 14px;
  background: #fff !important; border: 1px solid var(--l-1) !important; border-radius: var(--r-lg) !important;
  box-shadow: var(--sh-1) !important;
}
.od-v2 .deal-detail-buybar-price { display: flex !important; flex-direction: column; gap: 3px; min-width: 0; }
.od-v2 .deal-detail-buybar-label { font: 600 11px/1 var(--ff) !important; letter-spacing: .05em !important; color: var(--i-500) !important; }
.od-v2 .deal-detail-buybar-amount { font: 800 20px/1 var(--ff) !important; color: var(--i-900) !important; font-variant-numeric: tabular-nums; }
.od-v2 .deal-detail-buybtn {
  flex: 1; height: 50px !important; border-radius: 12px !important;
  display: inline-flex !important; align-items: center; justify-content: center; gap: 8px;
  background: var(--b-600) !important; color: #fff !important; border: 1px solid var(--b-600) !important;
  font: 700 15.5px/1 var(--ff) !important; box-shadow: none !important; text-shadow: none !important;
  transition: background-color .15s;
}
.od-v2 .deal-detail-buybtn:hover { background: var(--b-700) !important; color: #fff !important; transform: none !important; }
.od-v2 .deal-detail-buybtn svg { stroke: currentColor !important; }
.od-v2 .deal-detail-buybtn .buybtn-shine { display: none !important; }
.od-v2 .deal-detail-buybtn.deal-detail-buybtn-fk { background: var(--f-fk) !important; border-color: var(--f-fk) !important; color: #fff !important; }
.od-v2 .deal-detail-buybtn.deal-detail-buybtn-fk:hover { background: var(--f-fk-hover) !important; color: #fff !important; }
.od-v2 .deal-detail-buybtn.od-buy-brand { background: var(--b-600) !important; border-color: var(--b-600) !important; color: #fff !important; }
.od-v2 .deal-detail-buybtn.od-buy-brand:hover { background: var(--b-700) !important; color: #fff !important; }
.od-v2 .deal-detail-buybtn.deal-detail-buybtn-oos { background: var(--i-700) !important; border-color: var(--i-700) !important; color: #fff !important; }

@media (max-width: 768px) {
  .od-v2 .deal-detail-section { padding-top: 12px !important; }
  .od-v2 .deal-breadcrumb { margin-bottom: 12px !important; font-size: 12.5px !important; }
  .od-v2 .deal-detail-grid { gap: 16px !important; }
  .od-v2 .ddi-img-wrap img { padding: 18px; }
  .od-v2 .deal-detail-title { font-size: 20px !important; margin-top: 12px !important; }
  .od-v2 .deal-detail-price { font-size: 30px !important; }
  /* Product pages trade the tab bar for a sticky buy bar */
  .od-v2.od-page-deal .mobile-bottom-nav { display: none !important; }
  .od-v2.od-page-deal { padding-bottom: calc(84px + env(safe-area-inset-bottom, 0px)) !important; }
  .od-v2.od-page-deal #scrollTopBtn { display: none !important; }
  .od-v2 .deal-detail-buybar {
    position: fixed !important; left: 0 !important; right: 0 !important; bottom: 0 !important; z-index: 7500 !important;
    margin: 0 !important; border-radius: 0 !important; border: 0 !important; border-top: 1px solid var(--l-1) !important;
    padding: 10px 14px calc(10px + env(safe-area-inset-bottom, 0px)) !important;
    box-shadow: 0 -6px 20px -10px rgba(22, 24, 27, .18) !important;
  }
  .od-v2 .deal-detail-buybtn { height: 48px !important; font-size: 15px !important; flex: 1 1 auto !important; width: auto !important; }
  /* legacy mobile CSS stacks the bar; keep price and button on one line */
  .od-v2 .deal-detail-buybar { flex-direction: row !important; align-items: center !important; gap: 14px !important; }
  .od-v2 .deal-detail-buybar-price { flex-direction: column !important; align-items: flex-start !important; width: auto !important; flex: 0 0 auto !important; gap: 3px !important; }
}

/* Long-form sections under the product */
.od-v2 .deal-inline-desc, .od-v2 .deal-desc-leftcol {
  background: #fff !important; border: 1px solid var(--l-1) !important; border-radius: var(--r-xl) !important;
  box-shadow: none !important;
}
.od-v2 .deal-inline-desc h3 { font: 700 18px/1.3 var(--ff) !important; letter-spacing: -0.015em; }
.od-v2 .deal-inline-desc-content, .od-v2 .deal-inline-desc-content p, .od-v2 .deal-inline-desc-content li { color: var(--i-700) !important; font-size: 15px; line-height: 1.7; }

/* ---------- 13. Price history block (deal page) ------------------------ */
.od-v2 .ph-card { background: #fff !important; border: 1px solid var(--l-1) !important; border-radius: var(--r-xl) !important; box-shadow: none !important; }
.od-v2 .ph-icon-box { background: var(--b-50) !important; color: var(--b-700) !important; border-radius: 10px !important; }
.od-v2 .ph-title { font: 700 19px/1.2 var(--ff) !important; letter-spacing: -0.02em !important; }
.od-v2 .ph-subtitle { color: var(--i-500) !important; }
.od-v2 .ph-tabs { background: var(--s-well) !important; border: 1px solid var(--l-1) !important; border-radius: 10px !important; padding: 3px !important; }
.od-v2 .ph-tab { color: var(--i-600) !important; border-radius: 8px !important; font: 600 13px/1 var(--ff) !important; background: transparent !important; box-shadow: none !important; }
.od-v2 .ph-tab.active { background: #fff !important; color: var(--i-900) !important; box-shadow: 0 1px 2px rgba(22, 24, 27, .10) !important; }
.od-v2 .ph-export { border: 1px solid var(--l-2) !important; color: var(--i-700) !important; background: #fff !important; border-radius: 9px !important; }

.od-v2 .ph-stats { gap: 0 !important; border: 1px solid var(--l-1); border-radius: var(--r-lg); overflow: hidden; background: #fff; }
.od-v2 .ph-stat {
  background: #fff !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important;
  padding: 16px !important;
}
.od-v2 .ph-stat + .ph-stat { border-left: 1px solid var(--l-1) !important; }
.od-v2 .ph-stat-icon { display: none !important; }
.od-v2 .ph-stat-label, .od-v2 .ph-stat .label { color: var(--i-500) !important; font: 600 12px/1.2 var(--ff) !important; letter-spacing: .02em; }
.od-v2 .ph-stat-val, .od-v2 .ph-stat-value { font: 800 22px/1.1 var(--ff) !important; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; color: var(--i-900) !important; }
.od-v2 .ph-stat-val.lowest { color: var(--g-600) !important; }
.od-v2 .ph-stat-val.highest { color: var(--f-red) !important; }
.od-v2 .ph-stat-val.current { color: var(--i-900) !important; }
.od-v2 .ph-stat-sub.down { color: var(--g-700) !important; }
.od-v2 .ph-stat-sub.up { color: var(--f-red) !important; }
.od-v2 .ph-chart-head h3::before { display: none !important; }
.od-v2 .ph-chart-head h3 { font: 700 15px/1.3 var(--ff) !important; }
.od-v2 .ph-stat-sub, .od-v2 .ph-stat .sub { color: var(--i-500) !important; font: 500 12px/1.4 var(--ff) !important; }
.od-v2 .ph-badge { background: var(--s-well) !important; color: var(--i-700) !important; border: 1px solid var(--l-1) !important; border-radius: 6px !important; }
.od-v2 .ph-badge-lowest { background: var(--g-50) !important; color: var(--g-700) !important; border-color: var(--g-100) !important; }
.od-v2 .ph-badge.high { background: var(--f-red-bg) !important; color: var(--f-red) !important; border-color: #F3C9C2 !important; }
@media (max-width: 768px) {
  .od-v2 .ph-stats { grid-template-columns: 1fr 1fr !important; }
  .od-v2 .ph-stat:nth-child(3) { border-left: 0 !important; }
  .od-v2 .ph-stat:nth-child(n+3) { border-top: 1px solid var(--l-1) !important; }
}

.od-v2 .ph-chart-section { background: #fff !important; border: 1px solid var(--l-1) !important; border-radius: var(--r-lg) !important; box-shadow: none !important; }
.od-v2 .ph-date-range { background: var(--s-well) !important; color: var(--i-700) !important; border-radius: 10px !important; }
.od-v2 .ph-date-range * { color: var(--i-700) !important; }
.od-v2 .ph-callout { background: #fff !important; border: 1px solid var(--l-1) !important; border-radius: var(--r-lg) !important; box-shadow: none !important; }
.od-v2 .ph-callout-icon { background: var(--s-well) !important; color: var(--i-700) !important; }
.od-v2 .ph-callout-title { color: var(--i-900) !important; font: 700 15px/1.3 var(--ff) !important; }
.od-v2 .ph-callout-body { color: var(--i-600) !important; }
.od-v2 .ph-callout-btn {
  background: var(--i-900) !important; color: #fff !important; border: 0 !important;
  border-radius: 9px !important; font: 600 13.5px/1 var(--ff) !important; box-shadow: none !important;
}
.od-v2 .ph-callout-btn:hover { background: var(--i-700) !important; }
.od-v2 .ph-trust { display: flex !important; color: var(--i-500) !important; font-size: 12.5px !important; margin-top: 12px !important; }
.od-v2 .ph-trust svg { color: var(--i-500) !important; }

/* Similar deals heading on the product page */
.od-v2 .similar-deals-title span, .od-v2 .related-title span { background: none !important; -webkit-text-fill-color: currentColor !important; color: var(--i-900) !important; }

/* ---------- 13b. Secondary pages: categories, stores, price tracker ------ */
/* Shared: page headings used a purple→pink gradient on the second word. */
.od-v2 .od-cats-head h1, .od-v2 .od-stores-head h1 { font: 800 28px/1.15 var(--ff) !important; letter-spacing: -0.03em !important; color: var(--i-900) !important; }
.od-v2 .od-cats-head h1 span, .od-v2 .od-stores-head h1 span, .od-v2 .pt-hero h1 .grad {
  background: none !important; -webkit-text-fill-color: currentColor !important; color: var(--b-600) !important;
}
.od-v2 .od-cats-head p, .od-v2 .od-stores-head p { color: var(--i-500) !important; }
@media (max-width: 768px) { .od-v2 .od-cats-head h1, .od-v2 .od-stores-head h1 { font-size: 22px !important; } }

/* Categories: one neutral icon well instead of a different pastel per card */
.od-v2 .od-cat-card {
  background: #fff !important; border: 1px solid var(--l-1) !important; border-radius: var(--r-lg) !important;
  box-shadow: none !important; transition: border-color .15s, box-shadow .15s !important;
}
.od-v2 .od-cat-card:hover { border-color: var(--l-2) !important; box-shadow: var(--sh-2) !important; transform: none !important; }
.od-v2 .od-cat-icon { background: var(--s-well) !important; color: var(--i-700) !important; border-radius: 12px !important; box-shadow: none !important; }
.od-v2 .od-cat-name { color: var(--i-900) !important; font-weight: 700 !important; }
.od-v2 .od-cat-badge {
  background: var(--s-well) !important; color: var(--i-600) !important; border: 1px solid var(--l-1);
  font: 600 11.5px/1 var(--ff) !important; box-shadow: none !important;
}
.od-v2 .od-cat-explore { color: var(--b-700) !important; font-weight: 600 !important; }

/* Stores: store identity comes from the logo, not a tinted card */
.od-v2 .od-store-card {
  background: #fff !important; border: 1px solid var(--l-1) !important; border-radius: var(--r-lg) !important;
  box-shadow: none !important; overflow: hidden;
}
.od-v2 .od-store-card:hover { border-color: var(--l-2) !important; box-shadow: var(--sh-2) !important; transform: none !important; }
.od-v2 .od-store-top { background: var(--s-well) !important; border-bottom: 1px solid var(--l-1); }
.od-v2 .od-store-logo { background: #fff !important; border: 1px solid var(--l-1) !important; box-shadow: none !important; }
.od-v2 .od-store-badge { background: var(--b-600) !important; color: #fff !important; box-shadow: none !important; font-family: var(--ff) !important; }
.od-v2 .od-store-name { color: var(--i-900) !important; }
.od-v2 .od-store-meta { color: var(--i-500) !important; }
.od-v2 .od-store-divider { background: var(--l-1) !important; }
.od-v2 .od-store-shop { color: var(--b-700) !important; font-weight: 600 !important; }

/* Price tracker */
.od-v2 .pt-hero {
  background: #fff !important; border: 1px solid var(--l-1) !important; box-shadow: none !important;
}
.od-v2 .pt-hero::after, .od-v2 .pt-hero::before, .od-v2 .pt-dots-canvas { display: none !important; }
.od-v2 .pt-hero h1 { color: var(--i-900) !important; letter-spacing: -0.03em !important; }
.od-v2 .pt-hero p { color: var(--i-600) !important; }
.od-v2 .pt-input-wrap, .od-v2 .pt-input { border-color: var(--l-2) !important; box-shadow: none !important; }
.od-v2 .pt-input:focus { border-color: var(--b-600) !important; box-shadow: 0 0 0 3px var(--b-50) !important; }
.od-v2 .pt-input-wrap svg.pt-input-ico { color: var(--i-500) !important; stroke: currentColor !important; }
.od-v2 .pt-btn, .od-v2 .pt-track-another, .od-v2 .pt-empty-alert-btn, .od-v2 .pt-desc-btn {
  background: var(--b-600) !important; color: #fff !important; border: 0 !important; box-shadow: none !important;
  font-family: var(--ff) !important;
}
.od-v2 .pt-btn:hover, .od-v2 .pt-track-another:hover, .od-v2 .pt-empty-alert-btn:hover, .od-v2 .pt-desc-btn:hover { background: var(--b-700) !important; transform: none !important; }
.od-v2 .pt-how-card { background: #fff !important; border: 1px solid var(--l-1) !important; box-shadow: none !important; }
.od-v2 .pt-how-icon { background: var(--s-well) !important; color: var(--i-700) !important; box-shadow: none !important; }
.od-v2 .pt-how-icon svg { stroke: currentColor !important; color: inherit !important; }
.od-v2 .pt-loading { background: var(--s-canvas) !important; }
.od-v2 .pt-loader-card { background: #fff !important; border: 1px solid var(--l-1) !important; box-shadow: var(--sh-2) !important; }
.od-v2 .pt-loader-card::before { display: none !important; }
.od-v2 .pt-ring-pct b { background: none !important; -webkit-text-fill-color: currentColor !important; color: var(--i-900) !important; }
.od-v2 .pt-ring-sep { background: var(--b-600) !important; }
.od-v2 .pt-loader-dot.active { background: var(--b-50) !important; color: var(--b-700) !important; border-color: var(--b-200) !important; box-shadow: none !important; }
.od-v2 .pt-custom-pill { background: var(--b-50) !important; color: var(--b-800) !important; border-color: var(--b-100) !important; }
.od-v2 .pt-oos-banner { background: var(--f-amber-bg) !important; border-color: #F1D59A !important; }
.od-v2 .pt-oos-banner-btn { background: var(--i-900) !important; }

/* More page + slide-up More sheet: the promo card had a pink wash and glow */
.od-v2 .more-page-cta, .od-v2 .more-cta { background: #fff !important; border: 1px solid var(--l-1) !important; box-shadow: none !important; }
.od-v2 .more-page-cta::before, .od-v2 .more-page-cta::after, .od-v2 .more-cta::before, .od-v2 .more-cta::after { display: none !important; }
.od-v2 .more-cta-btn { box-shadow: none !important; }

/* ---------- 15. Deal feed: rows, tabs, sidebar, announcement ------------- */
.od-v2 .odann { max-width: var(--wrap); margin: 14px auto 0; padding: 0 var(--gut); color: #fff; }
.od-v2 .odann[hidden] { display: none; }
.od-v2 .odann-in {
  padding: 11px 16px; border-radius: var(--r-lg); background: #33363C;
  display: flex; align-items: center; gap: 10px; font: 500 14px/1.35 var(--ff);
}
.od-v2 .odann-in > svg { width: 18px; height: 18px; flex-shrink: 0; color: #36A9E1; }
.od-v2 .odann-in > span { flex: 1; min-width: 0; }
.od-v2 .odann a { color: #fff; font-weight: 700; text-decoration: underline; text-underline-offset: 3px; white-space: nowrap; }
.od-v2 .odann button { background: none; border: 0; padding: 0 2px; color: rgba(255, 255, 255, .65); font-size: 22px; line-height: 1; cursor: pointer; }
.od-v2 .odann button:hover { color: #fff; }

.od-v2 .odwrap { padding-top: 12px; padding-bottom: 24px; }
.od-v2 .odlayout { display: grid; grid-template-columns: minmax(0, 1fr) 316px; gap: 16px; align-items: start; margin-top: 14px; }
.od-v2 .section .odlayout { margin-top: 0; }
.od-v2 .odfeed { min-width: 0; }

.od-v2 .odtabs {
  display: flex; align-items: center; gap: 2px; padding: 0 8px; margin-bottom: 10px;
  background: #fff; border: 1px solid var(--l-1); border-radius: var(--r-lg);
}
.od-v2 .odtab {
  height: 46px; padding: 0 12px; display: inline-flex; align-items: center; margin-bottom: -1px;
  font: 700 15px/1 var(--ff); color: var(--i-600); text-decoration: none; border-bottom: 2px solid transparent;
}
.od-v2 .odtab:hover { color: var(--i-900); }
.od-v2 .odtab.is-on { color: var(--b-600); border-bottom-color: var(--b-600); }
.od-v2 .odtabs-note { margin-left: auto; padding-right: 6px; font: 400 13px/1 var(--ff); color: var(--i-500); white-space: nowrap; }

.od-v2 .odfeed-list, .od-v2 .deals-grid.odfeed-list { display: flex !important; flex-direction: column; gap: 10px !important; }
.od-v2 .odfeed-list > .deal-animate { animation: none !important; opacity: 1 !important; transform: none !important; }

/* A deal row: photo | details, actions along the bottom */
.od-v2 .odr {
  display: grid; grid-template-columns: 128px minmax(0, 1fr); grid-template-rows: auto 1fr;
  grid-template-areas: "media body" "media foot"; column-gap: 18px;
  padding: 16px; background: #fff; border: 1px solid var(--l-1); border-radius: var(--r-lg);
  transition: border-color .15s, box-shadow .15s;
}
.od-v2 .odr:hover { border-color: var(--l-2); box-shadow: var(--sh-2); }
.od-v2 .odr-media {
  grid-area: media; position: relative; width: 128px; height: 128px; align-self: start;
  display: flex; align-items: center; justify-content: center; overflow: hidden;
  border: 1px solid var(--l-1); border-radius: var(--r-sm); background: #fff;
}
.od-v2 .odr-media img { width: 100%; height: 100%; object-fit: contain; padding: 10px; box-sizing: border-box; }
.od-v2 .odr-media .odc-ph { width: 40px; height: 40px; color: var(--i-300); }
.od-v2 .odr-tag {
  position: absolute; left: 6px; bottom: 6px; padding: 3px 7px; border-radius: var(--r-xs);
  background: var(--b-600); color: #fff; font: 600 10.5px/1.2 var(--ff); letter-spacing: .01em;
}
.od-v2 .odr-body { grid-area: body; min-width: 0; }
.od-v2 .odr-top { display: flex; align-items: center; gap: 8px; min-width: 0; font: 400 12.5px/1.3 var(--ff); color: var(--i-500); }
.od-v2 .odr-when { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.od-v2 .odr-when svg { width: 13px; height: 13px; }
.od-v2 .odr-sep { width: 3px; height: 3px; border-radius: 50%; background: var(--i-400); flex-shrink: 0; }
.od-v2 .odr-store { font-weight: 600; color: var(--i-700); text-decoration: none; white-space: nowrap; }
.od-v2 a.odr-store:hover { color: var(--b-700); text-decoration: underline; text-underline-offset: 3px; }
.od-v2 .odr-views {
  margin-left: auto; height: 24px; padding: 0 9px; flex-shrink: 0;
  display: inline-flex; align-items: center; gap: 5px;
  border: 1px solid var(--l-1); border-radius: 999px; font: 600 12px/1 var(--ff); color: var(--i-700); font-variant-numeric: tabular-nums;
}
.od-v2 .odr-views svg { width: 13px; height: 13px; color: var(--i-500); }
.od-v2 .odr-title {
  margin: 6px 0 0; font: 700 17.5px/1.4 var(--ff) !important; letter-spacing: -0.015em; color: #1A1A1A;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.od-v2 .odr-title a { color: inherit; text-decoration: none; }
.od-v2 .odr-title a:hover { color: var(--b-700); }
.od-v2 .odr-price { display: flex; align-items: baseline; flex-wrap: wrap; gap: 3px 9px; margin-top: 7px; font-variant-numeric: tabular-nums; }
.od-v2 .odr-now { font: 800 21px/1.1 var(--ff); letter-spacing: -0.02em; color: var(--b-600); }
.od-v2 .odr-was { font: 400 14px/1.1 var(--ff); color: var(--i-500); }
.od-v2 .odr-off { font: 700 13.5px/1.1 var(--ff); color: var(--g-600); }
.od-v2 .odr-rate {
  display: inline-flex; align-items: center; gap: 3px; padding-left: 9px; border-left: 1px solid var(--l-2);
  font: 600 13px/1 var(--ff); color: var(--i-700);
}
.od-v2 .odr-rate svg { width: 12px; height: 12px; color: #D99A00; }
.od-v2 .odr-desc {
  margin: 7px 0 0; font: 400 13.5px/1.5 var(--ff); color: var(--i-600);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.od-v2 .odr-foot { grid-area: foot; align-self: end; display: flex; align-items: center; gap: 8px; padding-top: 12px; min-width: 0; }
.od-v2 .odr-act {
  width: 36px; height: 36px; padding: 0; flex-shrink: 0; display: inline-flex; align-items: center; justify-content: center;
  background: #fff; border: 1px solid var(--l-1); border-radius: var(--r-sm);
  font: 500 13px/1 var(--ff); color: var(--i-600); cursor: pointer;
}
.od-v2 .odr-act:hover { border-color: var(--i-400); color: var(--i-900); }
.od-v2 .odr-act svg { width: 16px; height: 16px; }
.od-v2 .odr-act span { display: none; }
.od-v2 .odr-act.wishlisted { color: #E0443A; border-color: #F3C9C2; }
.od-v2 .odr-note { display: inline-flex; align-items: center; gap: 5px; min-width: 0; font: 400 12.5px/1.3 var(--ff); color: var(--i-500); }
.od-v2 .odr-note svg { width: 13px; height: 13px; flex-shrink: 0; }
.od-v2 .odr-note span { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.od-v2 .odr-note.t-green { color: var(--g-700); }
.od-v2 .odr-note.t-red { color: var(--f-red); }
.od-v2 .odr-note.t-amber { color: var(--f-amber); }
.od-v2 .odr-buy {
  margin-left: auto; height: 40px; min-width: 150px; padding: 0 22px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--r-sm); text-decoration: none; white-space: nowrap;
  font: 700 14.5px/1 var(--ff); background: var(--b-600); color: #fff; border: 1px solid var(--b-600);
  transition: background-color .15s, border-color .15s;
}
.od-v2 .odr-buy:hover { background: var(--b-700); border-color: var(--b-700); color: #fff; }
.od-v2 .odr--fk .odr-buy { background: var(--f-fk); border-color: var(--f-fk); color: #fff; }
.od-v2 .odr--fk .odr-buy:hover { background: var(--f-fk-hover); border-color: var(--f-fk-hover); }

/* Sidebar */
.od-v2 .odside {
  position: sticky; top: 128px; display: flex; flex-direction: column; gap: 12px; min-width: 0;
  /* Taller than the screen, so it scrolls on its own inside the sticky column */
  max-height: calc(100vh - 144px); overflow-y: auto; overscroll-behavior-y: contain;
  margin-right: -14px; padding: 0 8px 12px 0;
  scrollbar-width: thin; scrollbar-color: transparent transparent;
  --fade-t: 18px; --fade-b: 36px;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 var(--fade-t), #000 calc(100% - var(--fade-b)), transparent 100%);
          mask-image: linear-gradient(to bottom, transparent 0, #000 var(--fade-t), #000 calc(100% - var(--fade-b)), transparent 100%);
}
.od-v2 .odside.is-top { --fade-t: 0px; }
.od-v2 .odside.is-end { --fade-b: 0px; }
.od-v2 .odside:hover { scrollbar-color: rgba(100, 116, 139, .45) transparent; }
.od-v2 .odside::-webkit-scrollbar { width: 6px; }
.od-v2 .odside::-webkit-scrollbar-track { background: transparent; }
.od-v2 .odside::-webkit-scrollbar-thumb { background: transparent; border-radius: 99px; }
.od-v2 .odside:hover::-webkit-scrollbar-thumb { background: rgba(100, 116, 139, .4); }
.od-v2 .odside::-webkit-scrollbar-thumb:hover { background: rgba(100, 116, 139, .65); }
.od-v2 .odbox { padding: 14px; background: #fff; border: 1px solid var(--l-1); border-radius: var(--r-lg); }
.od-v2 .odbox-h {
  display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin: 0 0 6px;
  font: 800 15.5px/1.3 var(--ff) !important; letter-spacing: -0.015em; color: #1A1A1A;
}
.od-v2 .odbox-h a { font: 600 12.5px/1 var(--ff); color: var(--b-700); text-decoration: none; white-space: nowrap; }
.od-v2 .odbox-h a:hover { text-decoration: underline; text-underline-offset: 3px; }
.od-v2 .odmini-list { list-style: none; margin: 0; padding: 0; }
.od-v2 .odmini-list li + li { border-top: 1px solid var(--l-1); }
.od-v2 .odmini { display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 10px; align-items: center; padding: 9px 0; text-decoration: none; color: inherit; }
.od-v2 .odmini-img { width: 52px; height: 52px; border: 1px solid var(--l-1); border-radius: var(--r-sm); background: #fff; display: flex; overflow: hidden; }
.od-v2 .odmini-img img { width: 100%; height: 100%; object-fit: contain; padding: 4px; box-sizing: border-box; }
.od-v2 .odmini-title {
  font: 600 13px/1.35 var(--ff); color: var(--i-900);
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.od-v2 .odmini:hover .odmini-title { color: var(--b-700); }
.od-v2 .odmini-meta { margin-top: 3px; display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 7px; font: 400 12px/1.2 var(--ff); color: var(--i-500); font-variant-numeric: tabular-nums; }
.od-v2 .odmini-meta b { font-weight: 700; font-size: 13.5px; color: var(--b-600); }
.od-v2 .odstores { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-top: 4px; }
.od-v2 .odstore {
  display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 10px 4px;
  border: 1px solid var(--l-1); border-radius: var(--r-sm); text-decoration: none; transition: border-color .15s, background-color .15s;
}
.od-v2 .odstore:hover { border-color: var(--l-2); background: var(--s-hover); }
.od-v2 .odstore-logo { height: 24px; display: flex; align-items: center; justify-content: center; font: 800 14.5px/1 var(--ff); letter-spacing: -0.02em; }
.od-v2 .odstore-logo img { max-height: 24px; max-width: 76px; object-fit: contain; }
.od-v2 .odstore-n { font: 400 11.5px/1 var(--ff); color: var(--i-500); }
.od-v2 .odbox-cta p { margin: 0 0 12px; font: 400 13.5px/1.5 var(--ff); color: var(--i-600); }
.od-v2 .odbtn {
  display: flex; align-items: center; justify-content: center; height: 38px; border-radius: var(--r-sm);
  background: var(--i-900); color: #fff; font: 600 13.5px/1 var(--ff); text-decoration: none;
}
.od-v2 .odbtn:hover { background: var(--i-700); color: #fff; }

@media (max-width: 1080px) {
  .od-v2 .odlayout { grid-template-columns: minmax(0, 1fr); }
  .od-v2 .odside { display: none; }
}
@media (max-width: 768px) {
  .od-v2 .odann-in { padding: 8px var(--gut); font-size: 12.5px; gap: 8px; }
  .od-v2 .odwrap { padding-top: 10px; }
  .od-v2 .odlayout { margin-top: 10px; }
  .od-v2 .odtabs { padding: 0 4px; border-radius: 0; border-left: 0; border-right: 0; margin: 0 calc(var(--gut) * -1) 8px; }
  .od-v2 .odtab { height: 44px; padding: 0 10px; font-size: 14px; }
  .od-v2 .odtabs-note { display: none; }
  .od-v2 .odfeed-list, .od-v2 .deals-grid.odfeed-list { gap: 8px !important; }
  .od-v2 .odr {
    grid-template-columns: 96px minmax(0, 1fr); grid-template-rows: auto auto;
    grid-template-areas: "media body" "foot foot"; column-gap: 12px; padding: 12px;
  }
  .od-v2 .odr-media { width: 96px; height: 96px; }
  .od-v2 .odr-media img { padding: 6px; }
  .od-v2 .odr-top { font-size: 12px; gap: 6px; }
  .od-v2 .odr-views { height: 22px; padding: 0 7px; font-size: 11.5px; }
  .od-v2 .odr-title { margin-top: 5px; font-size: 14.5px !important; line-height: 1.35 !important; }
  .od-v2 .odr-price { margin-top: 5px; gap: 2px 7px; }
  .od-v2 .odr-now { font-size: 17px; }
  .od-v2 .odr-was { font-size: 12.5px; }
  .od-v2 .odr-off { font-size: 12.5px; }
  .od-v2 .odr-rate { font-size: 12px; padding-left: 7px; }
  .od-v2 .odr-desc { display: none; }
  .od-v2 .odr-foot { flex-wrap: wrap; gap: 6px; padding-top: 10px; }
  .od-v2 .odr-act { width: 34px; padding: 0; justify-content: center; }
  .od-v2 .odr-act span { display: none; }
  .od-v2 .odr-note { flex: 1; font-size: 12px; }
  .od-v2 .odr-buy { order: 10; flex: 1 0 100%; margin: 4px 0 0; height: 42px; font-size: 14.5px; }
}

/* ---------- 16. Per-typeface tuning (preview font switch) -------------- */
/* Each face has its own width and colour; weights/sizes tuned so titles read
   crisp rather than heavy. The default face is Plus Jakarta Sans. */
.od-v2.od-font-jakarta .odr-title { font-weight: 700 !important; font-size: 17px !important; letter-spacing: -0.012em !important; }
.od-v2.od-font-jakarta .odc-title { font-weight: 600 !important; }
.od-v2.od-font-poppins .odr-title { font-weight: 600 !important; font-size: 16.5px !important; letter-spacing: 0 !important; line-height: 1.45 !important; }
.od-v2.od-font-poppins .odc-title, .od-v2.od-font-poppins .odmini-title { font-weight: 500 !important; }
.od-v2.od-font-poppins .odr-now, .od-v2.od-font-poppins .odc-now { font-weight: 700 !important; }
.od-v2.od-font-poppins .odh-sub a, .od-v2.od-font-poppins .odtab { letter-spacing: 0; }
.od-v2.od-font-manrope .odr-title { font-weight: 700 !important; font-size: 17px !important; letter-spacing: -0.01em !important; }
.od-v2.od-font-dmsans .odr-title { font-weight: 700 !important; font-size: 17.5px !important; letter-spacing: -0.02em !important; }
@media (max-width: 768px) {
  .od-v2.od-font-jakarta .odr-title, .od-v2.od-font-manrope .odr-title { font-size: 14.5px !important; }
  .od-v2.od-font-poppins .odr-title { font-size: 14px !important; }
  .od-v2.od-font-dmsans .odr-title { font-size: 15px !important; }
}

/* ---------- 14. Generic legacy bits that leak through ------------------- */
.od-v2 .deal-badge-red { background: var(--b-600) !important; }
.od-v2 .btn-primary, .od-v2 .btn.btn-primary { background: var(--b-600) !important; border-color: var(--b-600) !important; box-shadow: none !important; }
.od-v2 .btn-primary:hover { background: var(--b-700) !important; }

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

/* ---------- 17. Liquid glass buttons -----------------------------------
   One material, two weights. Every button sets --gl (an "r, g, b" tint)
   and --gl-ink (its text colour):
   - clear glass: tinted translucent body, specular top edge, rim light,
     soft coloured glow (secondary actions);
   - solid glass: the same shape filled with the tint and a glossy top
     half (primary actions: Sign in, Buy, search).
   Both get a light sweep on hover. */

/* Clear glass */
.od-v2 :is(.odh-tool, .odh-icon.wishlist-header-btn, .odr-act) {
  --gl: 100, 116, 139; --gl-ink: #334155;
  position: relative; isolation: isolate; overflow: hidden;
  border: 1px solid rgba(var(--gl), .24);
  background:
    linear-gradient(180deg, rgba(255,255,255,.92) 0%, rgba(255,255,255,.35) 55%, rgba(255,255,255,.6) 100%),
    radial-gradient(130% 120% at 50% 130%, rgba(var(--gl), .26), rgba(var(--gl), .05) 70%),
    rgba(var(--gl), .06);
  -webkit-backdrop-filter: blur(14px) saturate(180%); backdrop-filter: blur(14px) saturate(180%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,1),
    inset 0 -1px 1px rgba(255,255,255,.7),
    inset 0 -6px 10px -6px rgba(var(--gl), .30),
    0 1px 2px rgba(var(--gl), .12),
    0 6px 14px -8px rgba(var(--gl), .5);
  color: var(--gl-ink);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, color .18s ease;
}
.od-v2 :is(.odh-tool, .odh-icon.wishlist-header-btn, .odr-act):hover {
  color: var(--gl-ink); border-color: rgba(var(--gl), .42); transform: translateY(-1px);
  background:
    linear-gradient(180deg, rgba(255,255,255,.92) 0%, rgba(255,255,255,.3) 55%, rgba(255,255,255,.55) 100%),
    radial-gradient(130% 120% at 50% 130%, rgba(var(--gl), .34), rgba(var(--gl), .08) 70%),
    rgba(var(--gl), .09);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,1),
    inset 0 -1px 1px rgba(255,255,255,.7),
    inset 0 -8px 12px -6px rgba(var(--gl), .38),
    0 2px 4px rgba(var(--gl), .14),
    0 10px 20px -10px rgba(var(--gl), .65);
}

/* Solid glass */
.od-v2 :is(.odh .odh-signin, .odh .odh-search-go, .odr .odr-buy, .odc .odc-buy) {
  --gl: 229, 67, 31;
  position: relative; isolation: isolate; overflow: hidden;
  border: 1px solid rgba(var(--gl), .95); color: #fff;
  background:
    linear-gradient(180deg, rgba(255,255,255,.40) 0%, rgba(255,255,255,.07) 52%, rgba(255,255,255,0) 53%, rgba(255,255,255,.14) 100%),
    rgb(var(--gl));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.6),
    inset 0 -2px 6px rgba(0,0,0,.14),
    0 1px 2px rgba(var(--gl), .25),
    0 8px 18px -8px rgba(var(--gl), .75);
  text-shadow: 0 1px 1px rgba(0,0,0,.14);
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
}
.od-v2 :is(.odh .odh-signin, .odr .odr-buy, .odc .odc-buy):hover {
  color: #fff; border-color: rgba(var(--gl), 1); transform: translateY(-1px); filter: saturate(1.08) brightness(1.03);
  background:
    linear-gradient(180deg, rgba(255,255,255,.40) 0%, rgba(255,255,255,.07) 52%, rgba(255,255,255,0) 53%, rgba(255,255,255,.14) 100%),
    rgb(var(--gl));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.65),
    inset 0 -2px 6px rgba(0,0,0,.14),
    0 2px 4px rgba(var(--gl), .3),
    0 12px 24px -10px rgba(var(--gl), .85);
}
.od-v2 .odh .odh-search-go { box-shadow: inset 0 1px 0 rgba(255,255,255,.6), inset 0 -2px 6px rgba(0,0,0,.14); }
.od-v2 .odh .odh-search:hover .odh-search-go {
  background:
    linear-gradient(180deg, rgba(255,255,255,.46) 0%, rgba(255,255,255,.1) 52%, rgba(255,255,255,0) 53%, rgba(255,255,255,.16) 100%),
    rgb(var(--gl));
}
.od-v2 .odr.odr--fk .odr-buy, .od-v2 .odc.odc--fk .odc-buy { --gl: 40, 116, 240; }

/* Light sweep (shared) */
.od-v2 :is(.odh-tool, .odh-icon.wishlist-header-btn, .odr-act, .odann a, .odh-signin, .odr-buy, .odc-buy)::before {
  content: ""; position: absolute; z-index: -1; top: 0; bottom: 0; left: -70%; width: 45%;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,.7), transparent);
  transform: skewX(-18deg); transition: left .6s ease; pointer-events: none;
}
.od-v2 :is(.odh-tool, .odh-icon.wishlist-header-btn, .odr-act, .odann a, .odh-signin, .odr-buy, .odc-buy):hover::before { left: 125%; }
.od-v2 :is(.odh-tool, .odh-icon.wishlist-header-btn, .odr-act, .odh-signin, .odr-buy, .odc-buy):active { transform: scale(.97); }

/* Tints */
.od-v2 .odh-tool[href*="price-tracker"] { --gl: 19, 128, 63;  --gl-ink: #0F6B34; }
.od-v2 .odh-tool[href*="deal-finder"]   { --gl: 124, 58, 237; --gl-ink: #6D28D9; }
.od-v2 .odh-icon.wishlist-header-btn    { --gl: 225, 29, 72;  --gl-ink: #BE123C; }
.od-v2 .odr-act.deal-wishlist-btn:hover, .od-v2 .odr-act.wishlisted { --gl: 225, 29, 72; --gl-ink: #BE123C; }
.od-v2 .odr-act:not(.deal-wishlist-btn):hover { --gl: 37, 99, 235; --gl-ink: #1D4ED8; }

/* Tool buttons: the icon sits in a small solid-glass tile of the same tint */
.od-v2 .odh-tool-ico,
.od-v2 .odh-tool:hover .odh-tool-ico,
.od-v2 .odh-tool.is-on .odh-tool-ico {
  background:
    linear-gradient(180deg, rgba(255,255,255,.42) 0%, rgba(255,255,255,.06) 52%, rgba(255,255,255,0) 53%, rgba(255,255,255,.14) 100%),
    rgb(var(--gl));
  color: #fff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.55), inset 0 -1px 3px rgba(0,0,0,.14), 0 3px 8px -3px rgba(var(--gl), .6);
}
.od-v2 .odh-tool.is-on { border-color: rgba(var(--gl), .45); color: var(--gl-ink); }

/* Announcement bar: white glass on the dark strip */
.od-v2 .odann a {
  position: relative; isolation: isolate; overflow: hidden;
  color: #fff; text-decoration: none; padding: 8px 14px; border-radius: 999px;
  border: 1px solid rgba(255,255,255,.28);
  -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
  transition: box-shadow .18s ease, border-color .18s ease;
  background: linear-gradient(180deg, rgba(255,255,255,.26) 0%, rgba(255,255,255,.08) 55%, rgba(255,255,255,.14) 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.45), inset 0 -1px 1px rgba(255,255,255,.12), 0 4px 12px -6px rgba(0,0,0,.5);
}
.od-v2 .odann a:hover {
  color: #fff; border-color: rgba(255,255,255,.45);
  background: linear-gradient(180deg, rgba(255,255,255,.34) 0%, rgba(255,255,255,.12) 55%, rgba(255,255,255,.2) 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.55), inset 0 -1px 1px rgba(255,255,255,.15), 0 6px 16px -6px rgba(0,0,0,.55);
}

/* Header turns to frosted glass once the page scrolls under it */
.od-v2 .odh.is-scrolled {
  background: rgba(255,255,255,.78);
  -webkit-backdrop-filter: blur(18px) saturate(180%); backdrop-filter: blur(18px) saturate(180%);
}

/* Product page: glossy buy button, glass controls floating on the photo */
.od-v2 .deal-detail-buybtn,
.od-v2 .deal-detail-buybtn.deal-detail-buybtn-fk,
.od-v2 .deal-detail-buybtn.od-buy-brand,
.od-v2 .deal-detail-buybtn.deal-detail-buybtn-oos {
  --gl: 229, 67, 31;
  position: relative !important; isolation: isolate; overflow: hidden !important;
  border: 1px solid rgba(var(--gl), .95) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.40) 0%, rgba(255,255,255,.07) 52%, rgba(255,255,255,0) 53%, rgba(255,255,255,.14) 100%),
    rgb(var(--gl)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.6), inset 0 -2px 6px rgba(0,0,0,.14), 0 1px 2px rgba(var(--gl), .25), 0 10px 22px -10px rgba(var(--gl), .8) !important;
  text-shadow: 0 1px 1px rgba(0,0,0,.14) !important;
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease !important;
}
.od-v2 .deal-detail-buybtn.deal-detail-buybtn-fk { --gl: 40, 116, 240; }
.od-v2 .deal-detail-buybtn.deal-detail-buybtn-oos { --gl: 55, 65, 81; }
.od-v2 .deal-detail-buybtn:hover,
.od-v2 .deal-detail-buybtn.deal-detail-buybtn-fk:hover,
.od-v2 .deal-detail-buybtn.od-buy-brand:hover {
  background:
    linear-gradient(180deg, rgba(255,255,255,.40) 0%, rgba(255,255,255,.07) 52%, rgba(255,255,255,0) 53%, rgba(255,255,255,.14) 100%),
    rgb(var(--gl)) !important;
  transform: translateY(-1px) !important; filter: saturate(1.08) brightness(1.03);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.65), inset 0 -2px 6px rgba(0,0,0,.14), 0 2px 4px rgba(var(--gl), .3), 0 14px 26px -10px rgba(var(--gl), .85) !important;
}
.od-v2 .deal-detail-buybtn::after {
  content: ""; position: absolute; z-index: -1; top: 0; bottom: 0; left: -70%; width: 40%;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,.65), transparent);
  transform: skewX(-18deg); transition: left .7s ease; pointer-events: none;
}
.od-v2 .deal-detail-buybtn:hover::after { left: 130%; }
.od-v2 .deal-detail-share-float, .od-v2 .deal-detail-image .deal-wishlist-btn {
  background: linear-gradient(180deg, rgba(255,255,255,.85) 0%, rgba(255,255,255,.45) 55%, rgba(255,255,255,.65) 100%) !important;
  -webkit-backdrop-filter: blur(16px) saturate(180%) !important; backdrop-filter: blur(16px) saturate(180%) !important;
  border: 1px solid rgba(255,255,255,.8) !important;
  box-shadow: inset 0 1px 0 #fff, inset 0 -1px 2px rgba(100,116,139,.18), 0 6px 16px -8px rgba(15,23,42,.35) !important;
}

/* Tablet widths: tool buttons are icon-only, so drop the inner tile */
@media (max-width: 1180px) {
  .od-v2 .odh-tool-ico,
  .od-v2 .odh-tool:hover .odh-tool-ico,
  .od-v2 .odh-tool.is-on .odh-tool-ico { background: transparent; box-shadow: none; color: var(--gl-ink); }
}

/* Mobile tab bar: frosted glass, the current tab sits in a glass lens */
@media (max-width: 768px) {
  .od-v2 .mobile-bottom-nav {
    background: rgba(255,255,255,.76) !important;
    -webkit-backdrop-filter: blur(20px) saturate(180%) !important; backdrop-filter: blur(20px) saturate(180%) !important;
    border-top: 1px solid rgba(255,255,255,.7) !important;
    box-shadow: 0 -1px 0 rgba(15,23,42,.06), 0 -8px 24px -12px rgba(15,23,42,.18) !important;
  }
  .od-v2 .bottom-nav-item.active .bn-icon-wrap,
  .od-v2 .bottom-nav-item.active .bottom-nav-home-icon {
    --gl: 229, 67, 31;
    padding: 4px 16px !important; border-radius: 999px !important;
    background:
      linear-gradient(180deg, rgba(255,255,255,.9) 0%, rgba(255,255,255,.35) 55%, rgba(255,255,255,.6) 100%),
      radial-gradient(130% 120% at 50% 130%, rgba(var(--gl), .30), rgba(var(--gl), .07) 70%),
      rgba(var(--gl), .08) !important;
    border: 1px solid rgba(var(--gl), .22) !important;
    box-shadow: inset 0 1px 0 #fff, inset 0 -5px 8px -5px rgba(var(--gl), .32), 0 4px 10px -6px rgba(var(--gl), .5) !important;
  }
  .od-v2 :is(.odh .odh-icon.wishlist-header-btn, .odh .odh-signin, .odr .odr-act, .odr .odr-buy):hover { transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  .od-v2 :is(.odh-tool, .odh-icon, .odr-act, .odann a, .odh-signin, .odr-buy, .odc-buy, .odh-sub a)::before,
  .od-v2 .deal-detail-buybtn::after { display: none; }
  .od-v2 :is(.odh-tool, .odh-icon, .odr-act, .odh-signin, .odr-buy, .odc-buy, .odh-sub a):hover { transform: none; }
}

/* 17b. Glass for the legacy-styled controls (store chips, filters, price
   history range + export). These carry !important in their base rules. */
.od-v2 .store-tab,
.od-v2 .od-filter-chip,
.od-v2 .od-filter-clear,
.od-v2 .ph-export {
  --gl: 100, 116, 139;
  border: 1px solid rgba(var(--gl), .24) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.95) 0%, rgba(255,255,255,.4) 55%, rgba(255,255,255,.65) 100%),
    radial-gradient(130% 120% at 50% 130%, rgba(var(--gl), .22), rgba(var(--gl), .04) 70%),
    rgba(var(--gl), .05) !important;
  -webkit-backdrop-filter: blur(12px) saturate(180%); backdrop-filter: blur(12px) saturate(180%);
  box-shadow: inset 0 1px 0 #fff, inset 0 -5px 8px -5px rgba(var(--gl), .26), 0 1px 2px rgba(var(--gl), .1), 0 5px 12px -8px rgba(var(--gl), .45) !important;
  color: #334155 !important;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease !important;
}
.od-v2 .store-tab:hover,
.od-v2 .od-filter-chip:hover,
.od-v2 .od-filter-clear:hover,
.od-v2 .ph-export:hover {
  --gl: 229, 67, 31;
  border-color: rgba(var(--gl), .38) !important; color: #C73614 !important; transform: translateY(-1px);
}
/* Selected chip: solid dark glass */
.od-v2 .store-tab.active,
.od-v2 .od-filter-chip.active {
  --gl: 27, 29, 33;
  border-color: rgba(var(--gl), .95) !important; color: #fff !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.28) 0%, rgba(255,255,255,.05) 52%, rgba(255,255,255,0) 53%, rgba(255,255,255,.1) 100%),
    rgb(var(--gl)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.35), inset 0 -2px 5px rgba(0,0,0,.25), 0 6px 14px -8px rgba(var(--gl), .7) !important;
  transform: none;
}
/* Apply filters: solid brand glass */
.od-v2 .od-filter-btn {
  --gl: 229, 67, 31;
  border: 1px solid rgba(var(--gl), .95) !important; color: #fff !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.40) 0%, rgba(255,255,255,.07) 52%, rgba(255,255,255,0) 53%, rgba(255,255,255,.14) 100%),
    rgb(var(--gl)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.6), inset 0 -2px 6px rgba(0,0,0,.14), 0 8px 18px -8px rgba(var(--gl), .75) !important;
  text-shadow: 0 1px 1px rgba(0,0,0,.14);
}
.od-v2 .od-filter-btn:hover {
  background:
    linear-gradient(180deg, rgba(255,255,255,.40) 0%, rgba(255,255,255,.07) 52%, rgba(255,255,255,0) 53%, rgba(255,255,255,.14) 100%),
    rgb(var(--gl)) !important;
  filter: saturate(1.08) brightness(1.03);
}
/* Price history range: frosted track, the active range is a raised glass lens */
.od-v2 .ph-tabs {
  background: linear-gradient(180deg, rgba(241,243,247,.9), rgba(233,236,242,.7)) !important;
  border: 1px solid rgba(100,116,139,.18) !important;
  box-shadow: inset 0 1px 3px rgba(15,23,42,.08), 0 1px 0 #fff !important;
}
.od-v2 .ph-tab.active {
  background: linear-gradient(180deg, #fff 0%, rgba(255,255,255,.75) 55%, rgba(255,255,255,.95) 100%) !important;
  color: #C73614 !important;
  box-shadow: inset 0 1px 0 #fff, inset 0 -3px 6px -3px rgba(229,67,31,.22), 0 1px 2px rgba(15,23,42,.1), 0 4px 10px -5px rgba(229,67,31,.45) !important;
}
@media (prefers-reduced-motion: reduce) {
  .od-v2 .store-tab:hover, .od-v2 .od-filter-chip:hover, .od-v2 .od-filter-clear:hover, .od-v2 .ph-export:hover { transform: none; }
}

/* 17c. Category sub-nav: light glass pills, each with its own icon + tint
   (--gl is set inline per category). Hover = tinted glass, current page =
   solid glass. Pills that don't fit are listed under "More". */
.od-v2 .odh-sub .odh-in { overflow: visible; }
.od-v2 .odh-cats {
  flex: 1 1 auto; min-width: 0; height: 46px; display: flex; align-items: center; gap: 5px;
  overflow: hidden; overflow: clip; overflow-clip-margin: 14px;
}
.od-v2 .odh-cat[hidden], .od-v2 .odh-more-item[hidden] { display: none !important; }
.od-v2 .odh-sub a.odh-cat,
.od-v2 .odh-sub .odh-more-btn {
  position: relative; isolation: isolate; overflow: hidden;
  flex: 0 0 auto; height: 34px; margin: 0; padding: 0 13px 0 10px; gap: 6px;
  display: inline-flex; align-items: center;
  border: 1px solid rgba(15, 23, 42, .08); border-radius: 999px;
  background: linear-gradient(180deg, rgba(255,255,255,1) 0%, rgba(246,248,251,.8) 100%);
  box-shadow: inset 0 1px 0 #fff, inset 0 -1px 2px rgba(15,23,42,.03), 0 1px 2px rgba(15,23,42,.05);
  font: 500 13.5px/1 var(--ff); color: var(--i-700); white-space: nowrap; cursor: pointer;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, color .18s ease;
}
.od-v2 .odh-sub .odh-cat svg { width: 16px; height: 16px; flex-shrink: 0; color: rgb(var(--gl)); transition: color .18s ease; }
.od-v2 .odh-sub a.odh-cat:hover,
.od-v2 .odh-sub .odh-more-btn:hover,
.od-v2 .odh-sub .odh-more.open .odh-more-btn {
  color: rgb(var(--gl)); border-color: rgba(var(--gl), .3);
  background:
    linear-gradient(180deg, rgba(255,255,255,.92) 0%, rgba(255,255,255,.35) 55%, rgba(255,255,255,.6) 100%),
    radial-gradient(130% 120% at 50% 130%, rgba(var(--gl), .26), rgba(var(--gl), .05) 70%),
    rgba(var(--gl), .07);
  box-shadow:
    inset 0 1px 0 #fff,
    inset 0 -6px 10px -6px rgba(var(--gl), .30),
    0 1px 2px rgba(var(--gl), .12),
    0 8px 16px -10px rgba(var(--gl), .6);
}
.od-v2 .odh-sub a.odh-cat:hover, .od-v2 .odh-sub .odh-more-btn:hover { transform: translateY(-1px); }
.od-v2 .odh-sub a.odh-cat:active, .od-v2 .odh-sub .odh-more-btn:active { transform: scale(.97); }
.od-v2 .odh-sub a.odh-cat.is-on,
.od-v2 .odh-sub .odh-more-btn.is-on {
  color: #fff; font-weight: 600; border-color: rgba(var(--gl), .95);
  background:
    linear-gradient(180deg, rgba(255,255,255,.40) 0%, rgba(255,255,255,.07) 52%, rgba(255,255,255,0) 53%, rgba(255,255,255,.14) 100%),
    rgb(var(--gl));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.6), inset 0 -2px 6px rgba(0,0,0,.14), 0 1px 2px rgba(var(--gl), .25), 0 8px 18px -8px rgba(var(--gl), .75);
  text-shadow: 0 1px 1px rgba(0,0,0,.14);
}
.od-v2 .odh-sub a.odh-cat.is-on svg, .od-v2 .odh-sub .odh-more-btn.is-on svg { color: #fff; }
.od-v2 .odh-sub a.odh-cat::before, .od-v2 .odh-sub .odh-more-btn::before {
  content: ""; position: absolute; z-index: -1; top: 0; bottom: 0; left: -70%; width: 45%;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,.75), transparent);
  transform: skewX(-18deg); transition: left .6s ease; pointer-events: none;
}
.od-v2 .odh-sub a.odh-cat:hover::before, .od-v2 .odh-sub .odh-more-btn:hover::before { left: 125%; }

/* "More" button + frosted dropdown */
.od-v2 .odh-more { position: relative; flex-shrink: 0; margin-left: 5px; }
.od-v2 .odh-sub .odh-more-btn { --gl: 71, 85, 105; padding: 0 10px 0 14px; gap: 4px; }
.od-v2 .odh-sub .odh-more-btn .odh-more-chev { width: 14px; height: 14px; color: currentColor; transition: transform .2s ease; }
.od-v2 .odh-more.open .odh-more-chev { transform: rotate(180deg); }
.od-v2 .odh-more-menu {
  position: absolute; right: 0; top: calc(100% + 8px); z-index: 60; min-width: 250px; padding: 8px;
  display: grid; gap: 2px; border-radius: 16px;
  background: rgba(255,255,255,.9);
  -webkit-backdrop-filter: blur(22px) saturate(180%); backdrop-filter: blur(22px) saturate(180%);
  border: 1px solid rgba(255,255,255,.8);
  box-shadow: inset 0 1px 0 #fff, 0 0 0 1px rgba(15,23,42,.06), 0 24px 48px -16px rgba(15,23,42,.28), 0 8px 16px -8px rgba(15,23,42,.12);
  opacity: 0; visibility: hidden; transform: translateY(-4px) scale(.98); transform-origin: top right;
  transition: opacity .16s ease, transform .16s ease, visibility 0s linear .16s;
}
.od-v2 .odh-more.open .odh-more-menu { opacity: 1; visibility: visible; transform: none; transition: opacity .16s ease, transform .16s ease; }
.od-v2 .odh-sub a.odh-more-item {
  position: relative; height: 42px; margin: 0; padding: 0 12px 0 6px; gap: 11px;
  display: flex; align-items: center; border: 0; border-radius: 10px;
  font: 500 14px/1 var(--ff); color: var(--i-800); text-decoration: none;
  transition: background-color .15s ease, color .15s ease;
}
.od-v2 .odh-more-ico {
  width: 30px; height: 30px; border-radius: 9px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  background: rgba(var(--gl), .1); color: rgb(var(--gl));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8), inset 0 0 0 1px rgba(var(--gl), .08);
  transition: background .15s ease, color .15s ease;
}
.od-v2 .odh-more-ico svg { width: 16px; height: 16px; }
.od-v2 .odh-sub a.odh-more-item:hover { background: rgba(var(--gl), .08); color: rgb(var(--gl)); }
.od-v2 .odh-sub a.odh-more-item:hover .odh-more-ico {
  background:
    linear-gradient(180deg, rgba(255,255,255,.40) 0%, rgba(255,255,255,.06) 52%, rgba(255,255,255,0) 53%, rgba(255,255,255,.14) 100%),
    rgb(var(--gl));
  color: #fff;
}
.od-v2 .odh-more-arrow { width: 15px; height: 15px; margin-left: auto; opacity: .55; }
.od-v2 .odh-sub .odh-more-item:not([hidden]) ~ a.odh-more-all { margin-top: 7px; }
.od-v2 .odh-more-item:not([hidden]) ~ .odh-more-all::before {
  content: ""; position: absolute; left: 8px; right: 8px; top: -5px; height: 1px; background: rgba(15,23,42,.08);
}
@media (prefers-reduced-motion: reduce) {
  .od-v2 .odh-sub a.odh-cat::before, .od-v2 .odh-sub .odh-more-btn::before { display: none; }
  .od-v2 .odh-sub a.odh-cat:hover, .od-v2 .odh-sub .odh-more-btn:hover { transform: none; }
}

/* 17d. Filter & Sort stays collapsed; filters in use sit in its head as
   removable orange-glass tags. */
.od-v2 .od-filter-head { gap: 12px; }
.od-v2 .od-filter-head-title { min-width: 0; flex-wrap: wrap; row-gap: 6px; }
.od-v2 .od-filter-head-tags { display: inline-flex; flex-wrap: wrap; gap: 6px; margin-left: 6px; }
.od-v2 .od-filter-head-tags .od-filter-active-tag {
  --gl: 229, 67, 31;
  height: 26px; padding: 0 5px 0 11px !important; gap: 6px;
  border: 1px solid rgba(var(--gl), .25);
  background:
    linear-gradient(180deg, rgba(255,255,255,.92) 0%, rgba(255,255,255,.35) 55%, rgba(255,255,255,.6) 100%),
    radial-gradient(130% 120% at 50% 130%, rgba(var(--gl), .24), rgba(var(--gl), .05) 70%),
    rgba(var(--gl), .07) !important;
  box-shadow: inset 0 1px 0 #fff, inset 0 -4px 7px -4px rgba(var(--gl), .28), 0 3px 8px -5px rgba(var(--gl), .5);
  font: 600 12.5px/1 var(--ff) !important; color: #C73614 !important;
  transition: box-shadow .15s ease, border-color .15s ease;
}
.od-v2 .od-filter-head-tags .od-filter-active-tag .x {
  width: 17px; height: 17px; background: rgba(var(--gl), .12); color: #C73614; font-size: 12px;
}
.od-v2 .od-filter-head-tags .od-filter-active-tag:hover {
  border-color: rgba(var(--gl), .95);
  background:
    linear-gradient(180deg, rgba(255,255,255,.40) 0%, rgba(255,255,255,.07) 52%, rgba(255,255,255,0) 53%, rgba(255,255,255,.14) 100%),
    rgb(var(--gl)) !important;
  color: #fff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.55), 0 6px 14px -8px rgba(var(--gl), .8);
}
.od-v2 .od-filter-head-tags .od-filter-active-tag:hover .x { background: rgba(255,255,255,.25); color: #fff; }

/* ---------- 18. Product page ------------------------------------------------
   Photo + details share one card; the details column stays in view while the
   description scrolls. Under the buy button: alert / save / share (glass),
   four honest facts, and the small print. */
.od-v2 .deal-detail-grid {
  grid-template-columns: minmax(0, 480px) minmax(0, 1fr) !important; gap: 40px !important;
  padding: 24px !important; margin-bottom: 20px !important;
  background: #fff; border: 1px solid var(--l-1); border-radius: 18px;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 18px 40px -28px rgba(16, 24, 40, .25);
}
.od-v2 .deal-detail-image, .od-v2 .deal-detail-image-v2 { border: 0 !important; border-radius: 14px !important; }
.od-v2 .ddi-img-wrap { border-radius: 14px !important; background: #F6F7F9 !important; }
.od-v2 .ddi-img-wrap img { padding: 36px; }
/* Save / Share live in the action row now */
.od-v2 .deal-detail-share-float, .od-v2 .deal-detail-image .deal-wishlist-btn { display: none !important; }

/* Top row: store · category · views · posted */
.od-v2 .od-pd-top { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; }
.od-v2 .od-pd-top .deal-detail-store,
.od-v2 .od-pd-chip {
  display: inline-flex !important; align-items: center; gap: 7px; height: 32px; padding: 0 12px !important;
  border-radius: 999px !important; border: 1px solid rgba(15, 23, 42, .09) !important;
  background: linear-gradient(180deg, #fff 0%, #F6F8FB 100%) !important;
  box-shadow: inset 0 1px 0 #fff, 0 1px 2px rgba(15, 23, 42, .05) !important;
  font: 600 13px/1 var(--ff) !important; color: var(--i-800) !important; text-decoration: none;
  transition: border-color .15s ease, color .15s ease;
}
.od-v2 .od-pd-top .deal-detail-store:hover, .od-v2 .od-pd-chip:hover { border-color: var(--b-200) !important; color: var(--b-700) !important; }
.od-v2 .od-pd-chip svg { width: 14px; height: 14px; color: var(--i-500); }
.od-v2 .od-pd-stat { display: inline-flex; align-items: center; gap: 6px; font: 500 13px/1 var(--ff); color: var(--i-500); white-space: nowrap; }
.od-v2 .od-pd-stat svg { width: 15px; height: 15px; }

.od-v2 .deal-detail-title { margin: 16px 0 12px !important; font-size: 28px !important; line-height: 1.22 !important; }
.od-v2 .deal-detail-pricing { margin: 6px 0 4px !important; gap: 6px 12px; }
.od-v2 .deal-detail-price { font-size: 38px !important; color: var(--b-600) !important; }
.od-v2 .deal-detail-mrp { font-size: 16px !important; }
.od-v2 .od-dd-off { font-size: 16px; }
.od-v2 .deal-detail-meta { margin: 10px 0 0 !important; padding: 0 !important; border-top: 0 !important; }
.od-v2 .deal-detail-meta:empty { display: none !important; }

/* Action row */
.od-v2 .od-pd-acts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 12px; }
.od-v2 .od-pd-act {
  --gl: 100, 116, 139; --gl-ink: #334155;
  position: relative; isolation: isolate; overflow: hidden;
  height: 46px; padding: 0 12px; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  border: 1px solid rgba(var(--gl), .24); border-radius: 12px; cursor: pointer;
  background:
    linear-gradient(180deg, rgba(255,255,255,.95) 0%, rgba(255,255,255,.4) 55%, rgba(255,255,255,.65) 100%),
    radial-gradient(130% 120% at 50% 130%, rgba(var(--gl), .24), rgba(var(--gl), .05) 70%),
    rgba(var(--gl), .06);
  box-shadow: inset 0 1px 0 #fff, inset 0 -6px 10px -6px rgba(var(--gl), .28), 0 1px 2px rgba(var(--gl), .12), 0 6px 14px -8px rgba(var(--gl), .5);
  font: 600 14px/1 var(--ff); color: var(--gl-ink);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.od-v2 .od-pd-act svg { width: 18px; height: 18px; flex-shrink: 0; }
.od-v2 .od-pd-act-alert { --gl: 19, 128, 63; --gl-ink: #0F6B34; }
.od-v2 .od-pd-act.deal-wishlist-btn { --gl: 225, 29, 72; --gl-ink: #BE123C; }
.od-v2 .od-pd-act:not(.od-pd-act-alert):not(.deal-wishlist-btn) { --gl: 37, 99, 235; --gl-ink: #1D4ED8; }
.od-v2 .od-pd-act:hover {
  transform: translateY(-1px); border-color: rgba(var(--gl), .42);
  box-shadow: inset 0 1px 0 #fff, inset 0 -8px 12px -6px rgba(var(--gl), .36), 0 2px 4px rgba(var(--gl), .14), 0 10px 20px -10px rgba(var(--gl), .65);
}
.od-v2 .od-pd-act:active { transform: scale(.97); }
.od-v2 .od-pd-act::before {
  content: ""; position: absolute; z-index: -1; top: 0; bottom: 0; left: -70%; width: 45%;
  background: linear-gradient(100deg, transparent, rgba(255,255,255,.75), transparent);
  transform: skewX(-18deg); transition: left .6s ease; pointer-events: none;
}
.od-v2 .od-pd-act:hover::before { left: 125%; }
.od-v2 .od-pd-act.wishlisted { border-color: rgba(var(--gl), .5); }

/* Facts */
.od-v2 .od-pd-facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 18px 0 0; }
.od-v2 .od-pd-fact {
  padding: 12px 14px; border-radius: 12px; min-width: 0;
  background: linear-gradient(180deg, #FAFBFC 0%, #F4F6F9 100%); border: 1px solid rgba(15, 23, 42, .06);
  box-shadow: inset 0 1px 0 #fff;
}
.od-v2 .od-pd-fact dt { font: 500 12px/1.2 var(--ff); color: var(--i-500); letter-spacing: .01em; }
.od-v2 .od-pd-fact dd { margin: 5px 0 0; font: 700 15px/1.25 var(--ff); color: var(--i-900); font-variant-numeric: tabular-nums; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.od-v2 .od-pd-fact dd a { color: var(--b-700); text-decoration: none; }
.od-v2 .od-pd-fact dd a:hover { text-decoration: underline; text-underline-offset: 3px; }
.od-v2 .od-pd-fact dd em { font-style: normal; font-weight: 600; font-size: 13px; }
.od-v2 .od-pd-fact dd .t-green { color: var(--g-700); }

.od-v2 .od-pd-note { display: flex; gap: 9px; margin: 16px 0 0; font: 400 12.5px/1.5 var(--ff); color: var(--i-500); }
.od-v2 .od-pd-note svg { width: 16px; height: 16px; flex-shrink: 0; margin-top: 1px; color: var(--g-600); }

/* Price history: compact empty state with its own alert button */
.od-v2 .ph-card { border-radius: 18px !important; }
.od-v2 .ph-empty {
  display: grid !important; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "ico title btn" "ico sub btn";
  align-items: center; column-gap: 16px; row-gap: 4px; padding: 18px 2px 4px !important; text-align: left !important;
}
.od-v2 .ph-empty > svg { grid-area: ico; width: 44px !important; height: 44px !important; margin: 0 !important; padding: 10px; box-sizing: border-box; border-radius: 12px; background: var(--b-50); opacity: 1 !important; color: var(--b-600) !important; }
.od-v2 .ph-empty-title { grid-area: title; margin: 0 !important; font-size: 15px !important; }
.od-v2 .ph-empty-sub { grid-area: sub; max-width: 560px !important; }
.od-v2 .od-pd-empty-alert {
  grid-area: btn; --gl: 19, 128, 63;
  height: 42px; padding: 0 16px; display: inline-flex; align-items: center; gap: 8px; cursor: pointer;
  border: 1px solid rgba(var(--gl), .28); border-radius: 12px; font: 600 14px/1 var(--ff); color: #0F6B34;
  background:
    linear-gradient(180deg, rgba(255,255,255,.95) 0%, rgba(255,255,255,.4) 55%, rgba(255,255,255,.65) 100%),
    radial-gradient(130% 120% at 50% 130%, rgba(var(--gl), .24), rgba(var(--gl), .05) 70%),
    rgba(var(--gl), .06);
  box-shadow: inset 0 1px 0 #fff, inset 0 -6px 10px -6px rgba(var(--gl), .28), 0 6px 14px -8px rgba(var(--gl), .5);
  transition: transform .18s ease, box-shadow .18s ease;
}
.od-v2 .od-pd-empty-alert svg { width: 17px; height: 17px; }
.od-v2 .od-pd-empty-alert:hover { transform: translateY(-1px); box-shadow: inset 0 1px 0 #fff, inset 0 -8px 12px -6px rgba(var(--gl), .36), 0 10px 20px -10px rgba(var(--gl), .65); }

.od-v2 .deal-detail-title.is-long { font-size: 22px !important; line-height: 1.3 !important; letter-spacing: -0.012em !important; }
/* Chart callout "Set Alert": same green glass as the other alert buttons */
.od-v2 .ph-callout-btn {
  --gl: 19, 128, 63;
  border: 1px solid rgba(var(--gl), .28) !important; border-radius: 12px !important; color: #0F6B34 !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.95) 0%, rgba(255,255,255,.4) 55%, rgba(255,255,255,.65) 100%),
    radial-gradient(130% 120% at 50% 130%, rgba(var(--gl), .24), rgba(var(--gl), .05) 70%),
    rgba(var(--gl), .06) !important;
  box-shadow: inset 0 1px 0 #fff, inset 0 -6px 10px -6px rgba(var(--gl), .28), 0 6px 14px -8px rgba(var(--gl), .5) !important;
}
.od-v2 .ph-callout-btn:hover {
  background:
    linear-gradient(180deg, rgba(255,255,255,.40) 0%, rgba(255,255,255,.07) 52%, rgba(255,255,255,0) 53%, rgba(255,255,255,.14) 100%),
    rgb(var(--gl)) !important;
  color: #fff !important; border-color: rgba(var(--gl), .95) !important;
}

/* Similar deals: two rows of four */
.od-v2.od-page-deal .deal-related .deals-grid { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 14px !important; }

@media (min-width: 769px) {
  /* Details stay in view beside a long description */
  .od-v2 .deal-detail-info { position: sticky !important; top: 130px; align-self: start; }
  /* Desktop: the price is already above — the buy block is just the button */
  .od-v2 .deal-detail-buybar { margin-top: 20px !important; padding: 0 !important; border: 0 !important; background: none !important; box-shadow: none !important; }
  .od-v2 .deal-detail-buybar-price { display: none !important; }
  .od-v2 .deal-detail-buybtn { height: 54px !important; font-size: 16.5px !important; border-radius: 14px !important; }
}
@media (max-width: 1024px) and (min-width: 769px) {
  .od-v2 .deal-detail-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; gap: 28px !important; }
  .od-v2.od-page-deal .deal-related .deals-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}
@media (max-width: 768px) {
  .od-v2 .deal-detail-grid { grid-template-columns: minmax(0, 1fr) !important; padding: 12px !important; gap: 16px !important; border-radius: 16px; }
  .od-v2 .ddi-img-wrap { aspect-ratio: auto !important; height: 300px !important; }
  .od-v2 .ddi-img-wrap img { padding: 20px; }
  .od-v2 .deal-detail-info { padding: 0 4px !important; }
  .od-v2 .deal-detail-title { font-size: 21px !important; margin-top: 12px !important; }
  .od-v2 .deal-detail-title.is-long { font-size: 18px !important; }
  .od-v2 .deal-detail-price { font-size: 32px !important; }
  .od-v2 .od-pd-top { gap: 6px 12px; }
  .od-v2 .od-pd-acts { gap: 8px; margin-top: 14px; }
  .od-v2 .od-pd-act { height: 44px; padding: 0 8px; font-size: 13px; gap: 5px; white-space: nowrap; }
  .od-v2 .od-pd-act svg { width: 17px; height: 17px; }
  .od-v2 .od-pd-facts { gap: 8px; }
  .od-v2 .od-pd-fact { padding: 10px 12px; }
  .od-v2 .od-pd-fact dd { font-size: 14px; }
  .od-v2 .ph-empty { grid-template-columns: auto minmax(0, 1fr); grid-template-areas: "ico title" "ico sub" "btn btn"; row-gap: 6px; }
  .od-v2 .od-pd-empty-alert { justify-content: center; margin-top: 10px; }
  .od-v2.od-page-deal .deal-related .deals-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; }
}
@media (prefers-reduced-motion: reduce) {
  .od-v2 .od-pd-act::before { display: none; }
  .od-v2 .od-pd-act:hover, .od-v2 .od-pd-empty-alert:hover { transform: none; }
}

/* ---------- 19. Search overlay ----------------------------------------------
   A plain search bar, then three quiet sections: trending searches, category
   tiles (same icons + tints as the header) and stores. No marketing copy. */
.od-v2 .search-overlay-backdrop { background: rgba(15, 17, 23, .42) !important; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.od-v2 .search-overlay .search-modal {
  max-width: 680px !important; border-radius: 20px !important; overflow: hidden;
  border: 1px solid rgba(255, 255, 255, .7) !important;
  box-shadow: 0 0 0 1px rgba(15, 23, 42, .06), 0 32px 64px -24px rgba(15, 23, 42, .45) !important;
}
.od-v2 .search-modal-input { min-height: 64px; padding: 10px 12px 10px 20px !important; gap: 8px !important; align-items: center; }
.od-v2 .search-modal-input > svg { width: 20px; height: 20px; flex-shrink: 0; color: var(--b-600) !important; }
.od-v2 .search-modal-input input {
  flex: 1 1 auto; min-width: 0; height: 44px; padding: 0 !important; margin: 0 !important;
  border: 0 !important; outline: 0 !important; box-shadow: none !important; background: transparent !important;
  font: 500 17px/1.4 var(--ff) !important; color: var(--i-900) !important; caret-color: var(--b-600);
}
.od-v2 .search-modal-input input::placeholder { color: var(--i-400) !important; opacity: 1; }
.od-v2 .search-modal-input .search-voice-btn,
.od-v2 .search-modal-input .search-img-btn,
.od-v2 .search-modal-input .search-close-btn {
  --gl: 100, 116, 139;
  width: 40px !important; height: 40px !important; min-width: 40px; padding: 0 !important; border-radius: 12px !important;
  display: inline-flex !important; align-items: center; justify-content: center; flex-shrink: 0;
  border: 1px solid rgba(var(--gl), .2) !important; color: #334155 !important;
  background: linear-gradient(180deg, rgba(255,255,255,.95) 0%, rgba(246,248,251,.8) 100%) !important;
  box-shadow: inset 0 1px 0 #fff, 0 1px 2px rgba(15,23,42,.05) !important;
  transition: border-color .15s ease, color .15s ease, background .15s ease;
}
.od-v2 .search-modal-input .search-voice-btn[hidden] { display: none !important; }
.od-v2 .search-modal-input .search-voice-btn:hover,
.od-v2 .search-modal-input .search-img-btn:hover { --gl: 229, 67, 31; color: var(--b-700) !important; border-color: rgba(var(--gl), .3) !important; background: rgba(var(--gl), .06) !important; }
.od-v2 .search-modal-input .search-close-btn { margin-left: 4px; }
.od-v2 .search-modal-input .search-close-btn:hover { color: var(--i-900) !important; border-color: rgba(15,23,42,.18) !important; }
.od-v2 .search-modal-input .search-voice-btn.listening { --gl: 220, 38, 38; color: #B91C1C !important; background: rgba(var(--gl), .08) !important; border-color: rgba(var(--gl), .35) !important; }

.od-v2 .search-overlay .search-modal { max-height: min(86vh, 760px) !important; }
.od-v2 .search-results { max-height: none !important; padding: 0 !important; }
.od-v2 .search-modal-input .search-img-btn svg,
.od-v2 .search-modal-input .search-voice-btn svg,
.od-v2 .search-modal-input .search-close-btn svg { color: currentColor !important; stroke: currentColor !important; width: 18px; height: 18px; }
/* The old "Quick:" row ran store/category names as searches — sections below replace it */
.od-v2 #searchFilters { display: none !important; }

.od-v2 #searchEmpty {
  flex-direction: column !important; align-items: stretch !important; justify-content: flex-start !important;
  gap: 22px !important; padding: 20px 20px 22px !important; text-align: left !important; min-height: 0 !important;
}
.od-v2 .ods-sec { display: flex; flex-direction: column; gap: 10px; }
.od-v2 .ods-h { display: flex; align-items: center; gap: 7px; margin: 0; font: 700 13.5px/1 var(--ff); color: var(--i-800); letter-spacing: -.005em; }
.od-v2 .ods-h svg { width: 15px; height: 15px; color: var(--b-600); }
.od-v2 .ods-h a { margin-left: auto; font: 600 12.5px/1 var(--ff); color: var(--b-700); text-decoration: none; }
.od-v2 .ods-h a:hover { text-decoration: underline; text-underline-offset: 3px; }

/* Trending: chips */
.od-v2 .ods-sec .search-ai-prompts { display: flex !important; flex-wrap: wrap; gap: 8px !important; grid-template-columns: none !important; margin: 0 !important; }
.od-v2 .ods-sec .search-ai-prompt {
  width: auto !important; height: 36px !important; min-height: 0 !important; padding: 0 14px 0 11px !important; gap: 7px !important;
  display: inline-flex !important; align-items: center; border-radius: 999px !important;
  border: 1px solid rgba(15, 23, 42, .09) !important;
  background: linear-gradient(180deg, #fff 0%, #F6F8FB 100%) !important;
  box-shadow: inset 0 1px 0 #fff, 0 1px 2px rgba(15,23,42,.05) !important;
  font: 600 13.5px/1 var(--ff) !important; color: var(--i-800) !important; cursor: pointer;
  transition: border-color .15s ease, color .15s ease, transform .15s ease !important;
}
.od-v2 .ods-sec .search-ai-prompt:hover { border-color: var(--b-200) !important; color: var(--b-700) !important; transform: translateY(-1px); }
.od-v2 .ods-sec .search-ai-prompt-icon { width: auto !important; height: auto !important; padding: 0 !important; margin: 0 !important; background: none !important; color: var(--i-400) !important; box-shadow: none !important; }
.od-v2 .ods-sec .search-ai-prompt-icon svg { width: 15px !important; height: 15px !important; }
.od-v2 .ods-sec .search-ai-prompt:hover .search-ai-prompt-icon { color: var(--b-600) !important; }
.od-v2 .ods-sec .sap-tag { margin-left: 2px !important; padding: 3px 6px !important; font-size: 10.5px !important; }

/* Categories: tiles with the header's icons + tints */
.od-v2 .ods-cats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.od-v2 .ods-cat {
  display: flex; align-items: center; gap: 10px; min-width: 0; height: 50px; padding: 0 12px 0 8px;
  border-radius: 13px; border: 1px solid rgba(15, 23, 42, .08);
  background: linear-gradient(180deg, #fff 0%, #F7F9FB 100%); box-shadow: inset 0 1px 0 #fff;
  font: 600 13.5px/1.2 var(--ff); color: var(--i-800); text-decoration: none; white-space: nowrap;
  transition: border-color .15s ease, color .15s ease, background .15s ease, transform .15s ease;
}
.od-v2 .ods-cat-ico {
  width: 34px; height: 34px; flex-shrink: 0; border-radius: 10px;
  display: inline-flex; align-items: center; justify-content: center;
  background: rgba(var(--gl), .1); color: rgb(var(--gl)); box-shadow: inset 0 1px 0 rgba(255,255,255,.8);
  transition: background .15s ease, color .15s ease;
}
.od-v2 .ods-cat-ico svg { width: 17px; height: 17px; }
.od-v2 .ods-cat:hover { border-color: rgba(var(--gl), .3); color: rgb(var(--gl)); background: rgba(var(--gl), .05); transform: translateY(-1px); }
.od-v2 .ods-cat:hover .ods-cat-ico {
  background:
    linear-gradient(180deg, rgba(255,255,255,.40) 0%, rgba(255,255,255,.06) 52%, rgba(255,255,255,0) 53%, rgba(255,255,255,.14) 100%),
    rgb(var(--gl));
  color: #fff;
}

/* Stores: wordmarks in each store's colour */
.od-v2 .ods-stores { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; }
.od-v2 .ods-store {
  height: 46px; display: flex; align-items: center; justify-content: center;
  border-radius: 13px; border: 1px solid rgba(15, 23, 42, .08);
  background: linear-gradient(180deg, #fff 0%, #F7F9FB 100%); box-shadow: inset 0 1px 0 #fff;
  font: 800 14.5px/1 var(--ff); letter-spacing: -.02em; text-decoration: none;
  transition: border-color .15s ease, transform .15s ease, box-shadow .15s ease;
}
.od-v2 .ods-store:hover { border-color: currentColor; transform: translateY(-1px); box-shadow: inset 0 1px 0 #fff, 0 6px 14px -8px rgba(15,23,42,.35); }

/* Keyboard hints (desktop) */
.od-v2 .ods-foot {
  display: flex; justify-content: center; gap: 18px; padding: 11px 16px;
  border-top: 1px solid var(--l-1); background: #FAFBFC;
  font: 500 12px/1 var(--ff); color: var(--i-500);
}
.od-v2 .ods-foot span { display: inline-flex; align-items: center; gap: 4px; }
.od-v2 .ods-foot kbd {
  min-width: 20px; height: 20px; padding: 0 5px; display: inline-flex; align-items: center; justify-content: center;
  border-radius: 6px; border: 1px solid rgba(15, 23, 42, .12); border-bottom-width: 2px; background: #fff;
  font: 600 11px/1 var(--ff); color: var(--i-700);
}

@media (max-width: 768px) {
  /* Phones: full-screen search */
  .od-v2 .search-overlay .search-modal { height: 100vh; height: 100dvh; max-height: none !important; border-radius: 0 !important; border: 0 !important; }
  .od-v2 .search-results { flex: 1 1 auto; min-height: 0; }
  .od-v2 .search-modal-input { padding: 8px 10px 8px 16px !important; min-height: 58px; }
  .od-v2 .search-modal-input input { font-size: 16px !important; }
  .od-v2 .search-modal-input .search-voice-btn,
  .od-v2 .search-modal-input .search-img-btn,
  .od-v2 .search-modal-input .search-close-btn { width: 38px !important; height: 38px !important; min-width: 38px; }
  .od-v2 #searchEmpty { padding: 16px 14px 18px !important; gap: 20px !important; }
  .od-v2 .ods-cats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .od-v2 .ods-stores { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .od-v2 .ods-foot { display: none; }
}

/* ---------- 20. Saved deals (wishlist) --------------------------------------- */
.od-v2 .odw-head { margin: 0 0 18px; }
.od-v2 .odw-h1 { margin: 0; font: 800 26px/1.2 var(--ff) !important; letter-spacing: -0.025em; color: var(--i-900); }
.od-v2 .odw-sub { margin: 6px 0 0; font: 400 14px/1.5 var(--ff); color: var(--i-500); }
.od-v2 .odw-gate { padding: 32px 0 20px; }
.od-v2 .odw-card {
  max-width: 440px; margin: 0 auto; padding: 32px 28px 26px; text-align: center;
  background: #fff; border: 1px solid var(--l-1); border-radius: 20px;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 24px 48px -30px rgba(16, 24, 40, .3);
}
.od-v2 .odw-ico {
  width: 56px; height: 56px; margin: 0 auto 18px; border-radius: 16px;
  display: flex; align-items: center; justify-content: center;
  background: #FFF1F3; color: #E11D48; box-shadow: inset 0 0 0 1px rgba(225, 29, 72, .1);
}
.od-v2 .odw-ico svg { width: 26px; height: 26px; }
.od-v2 .odw-title { margin: 0 0 8px; font: 800 21px/1.3 var(--ff) !important; letter-spacing: -0.02em; color: var(--i-900); }
.od-v2 .odw-text { margin: 0 auto 22px; max-width: 340px; font: 400 14px/1.55 var(--ff); color: var(--i-500); }
.od-v2 .odw-google {
  width: 100%; height: 50px; display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  border-radius: 14px; border: 1px solid #DADCE0; background: #fff; color: #1F1F1F;
  font: 600 15px/1 var(--ff); text-decoration: none;
  box-shadow: 0 1px 2px rgba(60, 64, 67, .12);
  transition: background-color .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.od-v2 .odw-google:hover { background: #F8FAFF; border-color: #D2E3FC; box-shadow: 0 1px 3px rgba(60, 64, 67, .2), 0 6px 14px -8px rgba(66, 133, 244, .5); }
.od-v2 .odw-google:focus-visible { outline: 3px solid rgba(66, 133, 244, .35); outline-offset: 2px; }
.od-v2 .odw-points { list-style: none; margin: 22px 0 0; padding: 18px 0 0; border-top: 1px solid var(--l-1); display: grid; gap: 10px; text-align: left; }
.od-v2 .odw-points li { display: flex; align-items: center; gap: 10px; font: 500 13.5px/1.4 var(--ff); color: var(--i-700); }
.od-v2 .odw-points svg { width: 16px; height: 16px; flex-shrink: 0; padding: 3px; box-sizing: content-box; border-radius: 50%; background: var(--g-50); color: var(--g-600); }
.od-v2 .odw-btn {
  --gl: 229, 67, 31;
  position: relative; overflow: hidden; width: 100%; height: 50px; border-radius: 14px;
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  font: 700 15px/1 var(--ff); color: #fff; text-decoration: none; text-shadow: 0 1px 1px rgba(0,0,0,.14);
  border: 1px solid rgba(var(--gl), .95);
  background:
    linear-gradient(180deg, rgba(255,255,255,.40) 0%, rgba(255,255,255,.07) 52%, rgba(255,255,255,0) 53%, rgba(255,255,255,.14) 100%),
    rgb(var(--gl));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.6), inset 0 -2px 6px rgba(0,0,0,.14), 0 10px 22px -10px rgba(var(--gl), .8);
  transition: transform .18s ease, filter .18s ease;
}
.od-v2 .odw-btn svg { width: 18px; height: 18px; }
.od-v2 .odw-btn:hover { color: #fff; transform: translateY(-1px); filter: saturate(1.08) brightness(1.03); }
@media (max-width: 768px) {
  .od-v2 .odw-h1 { font-size: 22px !important; }
  .od-v2 .odw-gate { padding: 12px 0; }
  .od-v2 .odw-card { padding: 26px 20px 22px; border-radius: 18px; }
}

/* ---------- 21. Logo mark (speech bubble + %) ------------------------------ */
.od-v2 .odh-logo { display: inline-flex !important; align-items: center; gap: 8px; }
.od-v2 .odh-logo .od-mark { width: 30px; height: 30px; flex-shrink: 0; transition: transform .2s ease; }
.od-v2 .odh-logo:hover .od-mark { transform: rotate(-6deg); }
.od-v2 .footer-brand .od-mark-foot { width: 30px; height: 30px; flex-shrink: 0; }
@media (max-width: 768px) {
  .od-v2 .odh-logo { gap: 7px; }
  .od-v2 .odh-logo .od-mark { width: 27px; height: 27px; }
}
@media (prefers-reduced-motion: reduce) { .od-v2 .odh-logo:hover .od-mark { transform: none; } }

/* ---------- 22. Header search bar + logo size ----------------------------- */
.od-v2 .odh-logo { gap: 6px; }
.od-v2 .odh-logo .od-mark { width: 32px; height: 32px; }

.od-v2 .odh .odh-search {
  height: 48px; max-width: 640px; padding: 0 4px 0 16px; gap: 10px;
  background: #fff; border: 1px solid rgba(15, 23, 42, .13); border-radius: 14px;
  box-shadow: inset 0 1px 2px rgba(15, 23, 42, .04), 0 1px 2px rgba(15, 23, 42, .04);
  color: var(--i-500); font: 500 14.5px/1 var(--ff);
  transition: border-color .15s ease, box-shadow .15s ease;
}
.od-v2 .odh .odh-search:hover { border-color: rgba(229, 67, 31, .45); box-shadow: 0 0 0 4px rgba(229, 67, 31, .08), 0 1px 2px rgba(15, 23, 42, .04); }
.od-v2 .odh .odh-search:focus-visible { outline: 0; border-color: var(--b-600); box-shadow: 0 0 0 4px rgba(229, 67, 31, .16); }
.od-v2 .odh .odh-search > svg { width: 19px; height: 19px; color: var(--i-400); flex-shrink: 0; }
.od-v2 .odh-search-text { flex: 1 1 auto; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: var(--i-400); }
.od-v2 .odh-rot { color: var(--i-600); transition: opacity .22s ease; }   /* inline, so a long hint ellipsizes */
.od-v2 .odh-rot.is-out { opacity: 0; }
.od-v2 .odh-kbd {
  flex-shrink: 0; min-width: 24px; height: 24px; padding: 0 7px; display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid rgba(15, 23, 42, .14); border-bottom-width: 2px; border-radius: 7px; background: #F8F9FB;
  font: 600 12px/1 var(--ff); color: var(--i-500);
}
.od-v2 .odh .odh-search-go {
  align-self: center; height: 40px; margin: 0; padding: 0 18px 0 15px; gap: 7px; border-radius: 11px;
  display: inline-flex; align-items: center; font: 700 14px/1 var(--ff); letter-spacing: -.005em;
}
.od-v2 .odh .odh-search-go svg { width: 17px; height: 17px; }

@media (max-width: 1180px) {
  .od-v2 .odh .odh-search-go { padding: 0 13px; }
  .od-v2 .odh .odh-search-go > span { display: none; }
  .od-v2 .odh-kbd { display: none; }
}

@media (max-width: 768px) {
  .od-v2 .odh-logo .od-mark { width: 28px; height: 28px; }
  .od-v2 .odh-msearch button {
    height: 48px !important; padding: 0 4px 0 15px !important; gap: 10px;
    background: #fff !important; border: 1px solid rgba(15, 23, 42, .13) !important; border-radius: 14px !important;
    box-shadow: inset 0 1px 2px rgba(15, 23, 42, .04), 0 1px 2px rgba(15, 23, 42, .04);
    font: 500 15px/1 var(--ff) !important;
  }
  .od-v2 .odh-msearch button > svg { width: 19px; height: 19px; color: var(--i-400); }
  .od-v2 .odh-msearch-go {
    --gl: 229, 67, 31;
    flex-shrink: 0; width: 40px; height: 40px; border-radius: 11px; margin-left: auto;
    display: inline-flex; align-items: center; justify-content: center; color: #fff;
    border: 1px solid rgba(var(--gl), .95);
    background:
      linear-gradient(180deg, rgba(255,255,255,.40) 0%, rgba(255,255,255,.07) 52%, rgba(255,255,255,0) 53%, rgba(255,255,255,.14) 100%),
      rgb(var(--gl));
    box-shadow: inset 0 1px 0 rgba(255,255,255,.6), inset 0 -2px 6px rgba(0,0,0,.14);
  }
  .od-v2 .odh-msearch-go svg { width: 18px; height: 18px; color: #fff !important; }
}

/* 23. Header heart: the glass rule clips its box (overflow: hidden, for the
   hover sweep), which cut the saved-deals count badge in half. Let the badge
   sit over the corner and drop the sweep on this one button. */
.od-v2 .odh .odh-icon.wishlist-header-btn { overflow: visible; }
.od-v2 .odh .odh-icon.wishlist-header-btn::before { display: none; }
.od-v2 .odh .odh-icon.wishlist-header-btn .wishlist-count {
  z-index: 2; top: -7px; right: -7px;
  box-shadow: 0 2px 6px -1px rgba(229, 67, 31, .45);
}