/* ============================================================
   90 Degree by Reflex × Malachyte — brand override
   Retunes the variables defined in brand.css so all "wiha-*"
   styles render in the 90 Degree palette (black / cream / muted).
   ============================================================ */

:root {
  --ndr-ink: #0A0A0A;        /* 90 Degree logo black */
  --ndr-ink-2: #1C1C1C;
  --ndr-muted: #6E6E6E;
  --ndr-line: #E5E2DC;
  --ndr-soft: #F7F4EE;
  --ndr-cream: #FBF8F2;
  --ndr-accent: #2D5843;     /* deep malachyte for sale/new badge accent */
  --ndr-sale: #B23B2E;       /* warm rust for sale */
  --ndr-new: #2D5843;        /* malachyte for "new" */

  /* Re-bind the variables brand.css uses */
  --wiha-red: var(--ndr-ink);
  --wiha-red-hover: #000;
  --wiha-blue: #2D5843;
  --wiha-slate: #2A2A2A;
  --wiha-text: var(--ndr-ink);
  --wiha-muted: var(--ndr-muted);
  --wiha-line: var(--ndr-line);
  --wiha-bg-soft: var(--ndr-soft);
  --wiha-now-badge: var(--ndr-new);
  --wiha-sale-badge: var(--ndr-sale);
}

/* Logo + tagline tweaks */
.wiha-logo img { height: 32px; }
.wiha-logo__tagline {
  font-size: 9px;
  color: var(--ndr-muted);
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

/* Page title — sentence case, slightly tighter */
.wiha-plp-title {
  font-weight: 500;
  letter-spacing: -0.01em;
  color: var(--ndr-ink);
}

/* Cards — flatter, cleaner */
.wiha-card { border-radius: 0; box-shadow: none; }
.wiha-card:hover { box-shadow: 0 6px 18px rgba(0,0,0,0.06); transform: none; }
.wiha-card__img { background: var(--ndr-cream); }
.wiha-card__name {
  font-weight: 500;
  font-size: 13px;
  letter-spacing: 0;
  text-transform: none;
  color: var(--ndr-ink);
}
.wiha-card__price { font-weight: 600; color: var(--ndr-ink); }
.wiha-card__sku { font-family: var(--font-mono); font-size: 10.5px; }

/* Before/After column accent — red on BEFORE (static), Malachyte on AFTER */
.sbs-col--alpha { border-color: rgba(213,32,39,0.35); }
.sbs-col--alpha .sbs-col__head { background: #FBEDED; }
.sbs-col--alpha .sbs-col__tag { background: #D52027; color: #fff; }
.sbs-col--alpha .sbs-col__caption { color: #D52027; letter-spacing: 0.18em; }
.sbs-col__logo--ndr { filter: none; }

/* Static-rail callout on the BEFORE column — red border + red railbar */
.wiha-grid-wrap--alpha {
  border-color: rgba(213,32,39,0.35) !important;
  background: rgba(213,32,39,0.03) !important;
}
.wiha-grid-wrap--alpha .wiha-grid-railbar { background: #D52027 !important; color: #fff; }

/* Persona bar refresh */
.wiha-persona-userid {
  font-family: var(--font-mono);
  font-weight: 500;
  letter-spacing: 0.02em;
}

/* Search bar — pill, cream */
.search-bar-trigger {
  background: var(--ndr-cream);
  border-color: var(--ndr-line);
  color: var(--ndr-ink);
}
.search-bar-menu-item:hover { background: var(--ndr-cream); }

/* PDP price/name */
.pdp-anchor__price { color: var(--ndr-ink); }

/* Crumbs */
.wiha-crumbs { color: var(--ndr-muted); }
.wiha-crumbs a { color: var(--ndr-muted); }
.wiha-crumbs .current { color: var(--ndr-ink); }

/* Search empty state — replaces the 6 "no match" placeholder cards */
.search-empty {
  margin: 28px 20px 40px;
  padding: 48px 24px;
  border: 1px dashed var(--ndr-line);
  background: var(--ndr-cream);
  border-radius: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  text-align: center;
}
.search-empty__glyph {
  font-size: 36px;
  color: var(--ndr-muted);
  line-height: 1;
  font-weight: 300;
}
.search-empty__title {
  font-size: 16px;
  font-weight: 500;
  letter-spacing: 0.02em;
  color: var(--ndr-ink);
}
.search-empty__sub {
  font-size: 12px;
  color: var(--ndr-muted);
  letter-spacing: 0.01em;
}