/*
Theme Name: MVMP
Theme URI: https://alphasupa.com
Author: MVMP
Description: Official theme for MVMP — a community-driven, receipt-verified grocery price-comparison marketplace. Wraps and styles the MVMP plugin's shortcodes. Mobile-first, desktop-equal, system fonts only, zero webfont loading.
Version: 1.5.2
Requires PHP: 7.4
Text Domain: mvmp-theme
*/

/* ============================================================
   1. DESIGN TOKENS
   Source of truth: MVMP Visual Theme Design handoff (OKLCH).
   oklch() has broad modern-browser support; a small @supports
   fallback block covers the rare browser that lacks it.
   ============================================================ */

:root {
  /* Light mode (default) */
  --mvmp-bg:            #ffffff;
  --mvmp-ink:            oklch(22% 0.01 70);
  --mvmp-card-bg:        #ffffff;
  --mvmp-border:         oklch(90% 0.01 70);
  --mvmp-muted:          oklch(45% 0.01 70);

  --mvmp-primary:        oklch(50% 0.19 340);
  --mvmp-primary-grad:   linear-gradient(135deg, oklch(45% 0.19 350), oklch(58% 0.20 310));
  --mvmp-secondary:      oklch(52% 0.09 195);
  --mvmp-gold:           oklch(70% 0.14 85);
  --mvmp-verified-green: oklch(52% 0.15 145);

  /* Stat-card tints (light) */
  --mvmp-tint-secondary-bg: oklch(93% 0.05 195);
  --mvmp-tint-gold-bg:      oklch(94% 0.08 85);
  --mvmp-tint-primary-bg:   oklch(93% 0.06 340);

  /* Shape & spacing */
  --mvmp-radius-sm: 8px;
  --mvmp-radius-md: 10px;
  --mvmp-radius-lg: 12px;
  --mvmp-radius-xl: 14px;
  --mvmp-radius-2xl: 16px;
  --mvmp-border-w: 1.5px;
  --mvmp-shadow-header: 0 2px 14px rgba(0,0,0,0.15);
  --mvmp-shadow-search: 0 8px 24px rgba(0,0,0,0.06);

  --mvmp-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --mvmp-max: 1200px;
}

[data-theme="dark"] {
  --mvmp-bg:      oklch(18% 0.008 70);
  --mvmp-ink:     oklch(94% 0.008 70);
  --mvmp-card-bg: oklch(23% 0.01 70);
  --mvmp-border:  oklch(32% 0.01 70);
  --mvmp-muted:   oklch(65% 0.01 70);

  --mvmp-tint-secondary-bg: oklch(30% 0.08 195);
  --mvmp-tint-gold-bg:      oklch(32% 0.09 85);
  --mvmp-tint-primary-bg:   oklch(30% 0.10 340);
  /* primary / secondary / gold / gradient / verified-green unchanged */
}

/* Fallback for browsers without oklch() support (very rare in 2026,
   kept for defensive robustness — Interop 2023 target, universally
   shipped since 2023). Approximated sRGB equivalents. */
@supports not (color: oklch(50% 0.1 100)) {
  :root {
    --mvmp-ink: #2b2725;
    --mvmp-border: #e3e0dc;
    --mvmp-muted: #6b6863;
    --mvmp-primary: #c31f6f;
    --mvmp-primary-grad: linear-gradient(135deg, #b81f66, #9d3fce);
    --mvmp-secondary: #2b7d82;
    --mvmp-gold: #c99a3e;
    --mvmp-verified-green: #1f8a54;
  }
  [data-theme="dark"] {
    --mvmp-bg: #17181a;
    --mvmp-ink: #ececea;
    --mvmp-card-bg: #212325;
    --mvmp-border: #383a3d;
    --mvmp-muted: #a3a09b;
  }
}

/* ============================================================
   2. RESET / BASE
   ============================================================ */

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--mvmp-font);
  background: var(--mvmp-bg);
  color: var(--mvmp-ink);
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  transition: background .15s, color .15s;
}
a { color: inherit; text-decoration: none; }
img { max-width: 100%; display: block; }
input, button, select, textarea { font-family: inherit; }
button { cursor: pointer; }
::placeholder { color: oklch(55% 0.01 70); }

/* Visible focus state everywhere — WCAG AA, not styled in the
   original prototype, added theme-wide per the design brief. */
:focus-visible {
  outline: 2.5px solid var(--mvmp-primary);
  outline-offset: 2px;
  border-radius: 4px;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.001ms !important; transition-duration: 0.001ms !important; }
}

.mvmp-container { max-width: var(--mvmp-max); margin: 0 auto; padding-left: 24px; padding-right: 24px; }
.mvmp-visually-hidden {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.mvmp-skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 999; background: var(--mvmp-primary);
  color: #fff; padding: 10px 16px; border-radius: 0 0 8px 0; font-weight: 700; font-size: 13px;
}
.mvmp-skip-link:focus { left: 0; }

/* ============================================================
   3. HEADER
   ============================================================ */

.mvmp-header {
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; padding: 14px 24px; position: sticky; top: 0;
  background: var(--mvmp-primary-grad);
  box-shadow: var(--mvmp-shadow-header);
  z-index: 100;
}
.mvmp-header__left { display: flex; align-items: center; gap: 32px; min-width: 0; }
.mvmp-header__logo { font-size: 22px; font-weight: 800; letter-spacing: -0.02em; color: #fff; flex-shrink: 0; }
.mvmp-header__nav { display: flex; gap: 20px; font-size: 14px; font-weight: 600; }
.mvmp-header__nav a { color: rgba(255,255,255,0.75); white-space: nowrap; }
.mvmp-header__nav a:hover,
.mvmp-header__nav a[aria-current="page"] { color: #fff; }
/* wp_nav_menu() output (Appearance → Menus) — flattened to match the
   same flex-row look as the previous hardcoded links. Every nav list
   (desktop header AND drawer) is always a real <ul> with list-style
   reset here — never raw unwrapped <li> elements, which is what
   caused the reported bullet points (a standalone <li> with no
   <ul>/<ol> parent still gets default browser bullet styling). */
.mvmp-header__nav-list { display: flex; gap: 20px; list-style: none; margin: 0; padding: 0; }
.mvmp-header__nav .current-menu-item > a,
.mvmp-header__nav .current_page_item > a { color: #fff; }
.mvmp-header__right { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }

.mvmp-header__select {
  padding: 8px 10px; border-radius: 8px; border: 1px solid rgba(255,255,255,0.35);
  background: rgba(255,255,255,0.15); color: #fff; font-size: 13px; font-weight: 600;
}
.mvmp-header__select option { color: #000; }

.mvmp-icon-btn {
  width: 36px; height: 36px; border-radius: 8px; border: 1px solid rgba(255,255,255,0.35);
  background: rgba(255,255,255,0.15); color: #fff; font-size: 15px; display: flex;
  align-items: center; justify-content: center; flex-shrink: 0;
}
.mvmp-header__signin {
  font-size: 14px; font-weight: 600; padding: 8px 14px; border: 1px solid rgba(255,255,255,0.4);
  border-radius: 8px; color: #fff; white-space: nowrap; background: transparent; cursor: pointer;
}
.mvmp-account-menu { position: relative; }
.mvmp-account-menu__dropdown {
  position: absolute; top: calc(100% + 8px); right: 0; min-width: 190px;
  background: var(--mvmp-card-bg); border: var(--mvmp-border-w) solid var(--mvmp-border);
  border-radius: var(--mvmp-radius-md); box-shadow: 0 10px 30px rgba(0,0,0,0.15);
  padding: 6px; z-index: 200;
}
.mvmp-account-menu__dropdown a {
  display: block; padding: 9px 12px; border-radius: 7px; font-size: 13.5px; font-weight: 600;
  color: var(--mvmp-ink);
}
.mvmp-account-menu__dropdown a:hover { background: var(--mvmp-tint-primary-bg); }
.mvmp-account-menu__divider { height: 1px; background: var(--mvmp-border); margin: 6px 4px; }

.mvmp-header__burger { display: none; }
.mvmp-header__account-desktop-only { display: contents; } /* no extra box on desktop */

/* ── Off-canvas drawer ─────────────────────────────────────────────
   Slides in from the right over the page content (not a push-down
   dropdown). Holds primary nav + the account section — both moved
   out of the mobile top bar, which is restricted to logo, currency,
   dark-mode toggle, and the burger button only. */
.mvmp-drawer-overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,0.5); z-index: 199;
  opacity: 0; visibility: hidden; transition: opacity .25s ease;
}
.mvmp-drawer-overlay.is-open { opacity: 1; visibility: visible; }

.mvmp-drawer {
  position: fixed; top: 0; right: 0; bottom: 0; width: 300px; max-width: 85vw;
  background: var(--mvmp-bg); z-index: 200; box-shadow: -8px 0 30px rgba(0,0,0,0.2);
  transform: translateX(100%); transition: transform .28s ease;
  display: flex; flex-direction: column; overflow-y: auto;
}
.mvmp-drawer.is-open { transform: translateX(0); }

.mvmp-drawer__header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px 20px; background: var(--mvmp-primary-grad); flex-shrink: 0;
}
.mvmp-drawer__title { color: #fff; font-weight: 800; font-size: 17px; }
.mvmp-drawer__close {
  width: 32px; height: 32px; border-radius: 8px; border: 1px solid rgba(255,255,255,0.4);
  background: rgba(255,255,255,0.15); color: #fff; font-size: 20px; line-height: 1;
  display: flex; align-items: center; justify-content: center;
}

.mvmp-drawer__nav { padding: 12px 12px 4px; }
.mvmp-drawer__nav-list { list-style: none; margin: 0; padding: 0; }
.mvmp-drawer__nav-list li + li { margin-top: 2px; }
.mvmp-drawer__nav-list a {
  display: block; padding: 13px 12px; border-radius: 9px; font-size: 15px; font-weight: 600;
  color: var(--mvmp-ink);
}
.mvmp-drawer__nav-list a:hover,
.mvmp-drawer__nav .current-menu-item > a,
.mvmp-drawer__nav .current_page_item > a { background: var(--mvmp-tint-primary-bg); color: var(--mvmp-primary); }

.mvmp-drawer__divider { height: 1px; background: var(--mvmp-border); margin: 8px 20px; }

.mvmp-drawer__account { padding: 4px 12px 20px; }
.mvmp-drawer__account-name { padding: 8px 12px; font-size: 12.5px; font-weight: 700; color: var(--mvmp-muted); text-transform: uppercase; letter-spacing: 0.03em; }
.mvmp-drawer__account .mvmp-header__signin { display: block; text-align: center; color: var(--mvmp-primary); border-color: var(--mvmp-primary); }

@media (max-width: 860px) {
  .mvmp-header__nav { display: none; }
  .mvmp-header__account-desktop-only { display: none; }
  .mvmp-header__burger {
    display: flex; width: 36px; height: 36px; align-items: center; justify-content: center;
    border-radius: 8px; border: 1px solid rgba(255,255,255,0.35); background: rgba(255,255,255,0.15);
    color: #fff; font-size: 18px;
  }
}

/* ============================================================
   4. BUTTONS / CHIPS / NOTICES  (also used to reskin the MVMP
      plugin's own .mvmp-btn / .mvmp-notice output — see §9)
   ============================================================ */

.mvmp-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 12px 20px; border: none; border-radius: var(--mvmp-radius-md);
  font-size: 14px; font-weight: 700; cursor: pointer; white-space: nowrap;
  font-family: var(--mvmp-font);
}
.mvmp-btn--primary, a.mvmp-btn.mvmp-btn--primary { background: var(--mvmp-primary-grad); color: #fff; }
.mvmp-btn--secondary, a.mvmp-btn.mvmp-btn--secondary {
  background: transparent; color: var(--mvmp-ink); border: var(--mvmp-border-w) solid var(--mvmp-border);
}
.mvmp-btn--block { width: 100%; padding: 15px; font-size: 15px; }
.mvmp-btn--sm { padding: 8px 14px; font-size: 12.5px; border-radius: 20px; }

.mvmp-pill-group { display: flex; gap: 6px; flex-wrap: wrap; }
.mvmp-pill {
  padding: 8px 14px; border-radius: 20px; font-size: 12.5px; font-weight: 700; cursor: pointer;
  background: transparent; color: var(--mvmp-ink); border: var(--mvmp-border-w) solid var(--mvmp-border);
}
.mvmp-pill.is-active { background: var(--mvmp-primary); color: #fff; border-color: var(--mvmp-primary); }

.mvmp-badge {
  font-size: 11px; font-weight: 800; color: #fff; background: var(--mvmp-primary-grad);
  padding: 3px 9px; border-radius: 5px; letter-spacing: 0.03em; display: inline-block;
}
.mvmp-badge--promoted {
  background: #fff; color: var(--mvmp-primary); font-size: 10.5px; font-weight: 800;
  padding: 3px 8px; border-radius: 5px;
}
.mvmp-badge--verified {
  font-size: 11px; border: 1px solid var(--mvmp-verified-green); color: var(--mvmp-verified-green);
  border-radius: 4px; padding: 1px 6px; font-weight: 700; display: inline-flex; align-items: center; gap: 3px;
}
.mvmp-badge--verified-muted {
  font-size: 11px; border: 1px solid var(--mvmp-border); color: var(--mvmp-muted);
  border-radius: 5px; padding: 3px 7px; font-weight: 600;
}

.mvmp-notice, .mvmp-sf-notices .mvmp-notice {
  padding: 14px 18px; border-radius: var(--mvmp-radius-sm); font-size: .95rem; line-height: 1.45;
  border-left: 4px solid transparent; margin-bottom: 16px;
}
.mvmp-notice p { margin: 0; }
.mvmp-notice--error   { background: #fef2f2; color: #991b1b; border-left-color: #dc2626; }
.mvmp-notice--success { background: #f0fdf4; color: #166534; border-left-color: #16a34a; }
.mvmp-notice--info, .mvmp-notice--warn { background: #eff6ff; color: #1e40af; border-left-color: #3b82f6; }
[data-theme="dark"] .mvmp-notice--error   { background: oklch(28% 0.08 25);  color: oklch(88% 0.05 25); }
[data-theme="dark"] .mvmp-notice--success { background: oklch(28% 0.08 145); color: oklch(88% 0.05 145); }
[data-theme="dark"] .mvmp-notice--info,
[data-theme="dark"] .mvmp-notice--warn    { background: oklch(28% 0.08 250); color: oklch(88% 0.05 250); }

/* ============================================================
   5. CARDS / MEDIA PLACEHOLDER
   ============================================================ */

.mvmp-card {
  border: var(--mvmp-border-w) solid var(--mvmp-border); border-radius: var(--mvmp-radius-lg);
  background: var(--mvmp-card-bg); padding: 18px;
}

.mvmp-photo-placeholder {
  background: repeating-linear-gradient(45deg, var(--mvmp-border), var(--mvmp-border) 4px, transparent 4px, transparent 8px);
  display: flex; align-items: center; justify-content: center; font-size: 11px; color: var(--mvmp-muted);
}

/* ============================================================
   6. HOME
   ============================================================ */

.mvmp-hero { padding: 40px 24px 24px; }
.mvmp-hero__title { font-size: 38px; font-weight: 800; letter-spacing: -0.02em; margin: 0 0 6px; max-width: 640px; }
.mvmp-hero__sub { font-size: 15px; color: var(--mvmp-muted); margin: 0 0 20px; max-width: 520px; }

.mvmp-search-bar {
  display: flex; gap: 12px; max-width: 936px; padding: 8px; border-radius: 16px;
  background: var(--mvmp-card-bg); border: 2px solid var(--mvmp-border); box-shadow: var(--mvmp-shadow-search);
}
.mvmp-search-bar input {
  width: 100%; box-sizing: border-box; padding: 18px 20px; font-size: 18px; border: none;
  border-radius: 12px; background: transparent; color: var(--mvmp-ink); outline: none;
}
.mvmp-search-bar button {
  padding: 18px 28px; border: none; border-radius: 12px; background: var(--mvmp-primary-grad);
  color: #fff; font-size: 16px; font-weight: 700; white-space: nowrap;
}
.mvmp-hero__meta { display: flex; gap: 18px; margin-top: 16px; font-size: 13px; color: var(--mvmp-muted); flex-wrap: wrap; }

.mvmp-section { padding: 8px 24px 24px; }
.mvmp-section__head { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 12px; gap: 10px; flex-wrap: wrap; }
.mvmp-section__title { font-size: 16px; font-weight: 800; margin: 0; }
.mvmp-section__meta { font-size: 12.5px; color: var(--mvmp-muted); }
.mvmp-section__link { font-size: 13px; font-weight: 700; color: var(--mvmp-secondary); }
.mvmp-eyebrow-row { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }

.mvmp-deal-card {
  display: flex; gap: 20px; border: var(--mvmp-border-w) solid var(--mvmp-border); border-radius: var(--mvmp-radius-xl);
  background: var(--mvmp-card-bg); overflow: hidden; align-items: center;
}
.mvmp-deal-card__media { width: 220px; height: 180px; flex-shrink: 0; }
.mvmp-deal-card__body { padding: 16px 20px 16px 0; }
.mvmp-deal-card__name { font-size: 18px; font-weight: 800; margin-bottom: 4px; }
.mvmp-deal-card__meta { font-size: 13px; color: var(--mvmp-muted); margin-bottom: 10px; }
.mvmp-deal-card__price { font-size: 28px; font-weight: 800; color: var(--mvmp-primary); }
.mvmp-deal-card__was { font-size: 14px; color: var(--mvmp-muted); text-decoration: line-through; margin-left: 10px; }

.mvmp-deals-grid, .mvmp-results-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.mvmp-deal-tile {
  display: flex; flex-direction: column; border-radius: var(--mvmp-radius-lg); overflow: hidden;
  background: var(--mvmp-card-bg); border: var(--mvmp-border-w) solid var(--mvmp-border); position: relative;
}
.mvmp-deal-tile__badge { position: absolute; top: 10px; left: 10px; z-index: 1; }
.mvmp-deal-tile__media { width: 100%; height: 150px; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 11px; }
.mvmp-deal-tile__body { padding: 14px; }
.mvmp-deal-tile__title { font-size: 14px; font-weight: 700; }
.mvmp-deal-tile__store { font-size: 12px; color: var(--mvmp-muted); margin: 2px 0 8px; }
.mvmp-deal-tile__price { font-size: 17px; font-weight: 800; color: var(--mvmp-primary); }

.mvmp-product-tile {
  display: flex; flex-direction: column; border: var(--mvmp-border-w) solid var(--mvmp-border);
  border-radius: var(--mvmp-radius-lg); background: var(--mvmp-card-bg); overflow: hidden;
}
.mvmp-product-tile__media { width: 100%; height: 192px; aspect-ratio: 1 / 1; }
.mvmp-product-tile__body { padding: 14px; }
.mvmp-product-tile__name { font-size: 14.5px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mvmp-product-tile__meta { font-size: 12px; color: var(--mvmp-muted); margin: 2px 0 8px; }
.mvmp-price-row { display: flex; align-items: baseline; gap: 6px; }
.mvmp-price-row__main { font-size: 19px; font-weight: 800; color: var(--mvmp-primary); }
.mvmp-price-row__unit { font-size: 12px; color: var(--mvmp-muted); }

.mvmp-cat-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 10px; }
.mvmp-cat-chip {
  display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 14px 8px;
  border: var(--mvmp-border-w) solid var(--mvmp-border); border-radius: var(--mvmp-radius-md); background: var(--mvmp-card-bg);
  text-align: center;
}
.mvmp-cat-icon {
  width: 36px; height: 36px; border-radius: 50%; color: #fff; display: flex; align-items: center;
  justify-content: center; font-weight: 800; font-size: 14px; flex-shrink: 0;
}
.mvmp-cat-chip__name { font-size: 12.5px; font-weight: 700; }
.mvmp-cat-chip__count { font-size: 11px; color: var(--mvmp-muted); }

.mvmp-compare-layout { padding: 8px 24px 60px; display: grid; grid-template-columns: 220px 1fr; gap: 24px; }
.mvmp-filters { border: var(--mvmp-border-w) solid var(--mvmp-border); border-radius: var(--mvmp-radius-lg); padding: 16px; height: fit-content; background: var(--mvmp-card-bg); }
.mvmp-filters__title { font-size: 13px; font-weight: 800; margin-bottom: 12px; }
.mvmp-filters__group-label { font-size: 13px; font-weight: 700; margin-bottom: 8px; color: var(--mvmp-muted); }
.mvmp-filters label { display: flex; align-items: center; gap: 8px; font-size: 13px; margin-bottom: 8px; cursor: pointer; }
.mvmp-filters__divider { height: 1px; background: var(--mvmp-border); margin: 12px 0; }

.mvmp-result-row {
  display: flex; gap: 12px; padding: 12px; border: var(--mvmp-border-w) solid var(--mvmp-border);
  border-radius: var(--mvmp-radius-md); background: var(--mvmp-card-bg);
}
.mvmp-result-row__media { width: 64px; height: 64px; border-radius: 8px; flex-shrink: 0; }
.mvmp-result-row__body { flex: 1; min-width: 0; }
.mvmp-result-row__name { font-size: 13.5px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mvmp-result-row__meta { font-size: 11.5px; color: var(--mvmp-muted); margin: 2px 0 6px; }

@media (max-width: 860px) {
  .mvmp-hero__title { font-size: 32px; }
  .mvmp-cat-grid { grid-template-columns: repeat(3, 1fr); }
  .mvmp-deals-grid, .mvmp-results-grid { grid-template-columns: 1fr; }
  .mvmp-compare-layout { grid-template-columns: 1fr; }
  .mvmp-filters { display: none; }
  .mvmp-deal-card { flex-direction: column; align-items: stretch; }
  .mvmp-deal-card__media { width: 100%; height: 160px; }
}

/* ============================================================
   7. PRODUCT DETAIL
   ============================================================ */

.mvmp-breadcrumb { max-width: 1100px; margin: 0 auto; padding: 20px 24px 8px; font-size: 13px; color: var(--mvmp-muted); }
.mvmp-breadcrumb a:hover { text-decoration: underline; }

.mvmp-detail-hero { max-width: 1100px; margin: 0 auto; padding: 8px 24px 24px; display: grid; grid-template-columns: 280px 1fr; gap: 28px; }
.mvmp-detail-hero__media { width: 100%; aspect-ratio: 1; border-radius: var(--mvmp-radius-lg); }
.mvmp-detail-title { font-size: 28px; font-weight: 800; letter-spacing: -0.02em; margin: 0 0 6px; }
.mvmp-detail-sub { font-size: 14px; color: var(--mvmp-muted); margin-bottom: 16px; }

.mvmp-price-summary {
  display: flex; gap: 24px; flex-wrap: wrap; padding: 16px; border: var(--mvmp-border-w) solid var(--mvmp-border);
  border-radius: var(--mvmp-radius-lg); background: var(--mvmp-card-bg); margin-bottom: 20px;
}
.mvmp-price-summary__label { font-size: 11.5px; color: var(--mvmp-muted); font-weight: 700; text-transform: uppercase; letter-spacing: 0.03em; }
.mvmp-price-summary__price { font-size: 30px; font-weight: 800; color: var(--mvmp-primary); }
.mvmp-price-summary__note { font-size: 12.5px; color: var(--mvmp-muted); }
.mvmp-price-summary__range { font-size: 20px; font-weight: 700; }

.mvmp-detail-actions { display: flex; gap: 10px; flex-wrap: wrap; }

.mvmp-detail-body { max-width: 1100px; margin: 0 auto; padding: 8px 24px 24px; display: grid; grid-template-columns: 1fr 300px; gap: 24px; }
.mvmp-detail-body__main { min-width: 0; }

.mvmp-price-table { border: var(--mvmp-border-w) solid var(--mvmp-border); border-radius: var(--mvmp-radius-lg); overflow: hidden; background: var(--mvmp-card-bg); }
.mvmp-price-table__head, .mvmp-price-table__row {
  display: grid; grid-template-columns: 1.8fr 0.9fr 0.9fr 0.9fr 1fr; gap: 12px; padding: 10px 18px; align-items: center;
}
.mvmp-price-table__head { font-size: 11px; font-weight: 800; color: var(--mvmp-muted); text-transform: uppercase; letter-spacing: 0.03em; }
.mvmp-price-table__row { padding: 14px 18px; border-top: var(--mvmp-border-w) solid var(--mvmp-border); }
.mvmp-price-table .align-right { text-align: right; }
.mvmp-price-table__store { font-size: 14px; font-weight: 700; }
.mvmp-price-table__meta { font-size: 12px; color: var(--mvmp-muted); }
.mvmp-price-table__country { font-size: 12.5px; color: var(--mvmp-muted); }
.mvmp-price-table__price { font-size: 17px; font-weight: 800; }
.mvmp-price-table__price.is-lowest { color: var(--mvmp-primary); }
.mvmp-price-table__unit { font-size: 11.5px; color: var(--mvmp-muted); }
.mvmp-price-table__tax { font-size: 12px; color: var(--mvmp-muted); }

.mvmp-detail-sidebar { position: sticky; top: 80px; height: fit-content; }

@media (max-width: 860px) {
  .mvmp-detail-hero, .mvmp-detail-body { grid-template-columns: 1fr; }
  .mvmp-detail-sidebar { display: none; }
  .mvmp-price-table__head, .mvmp-price-table__row { grid-template-columns: 1fr; row-gap: 4px; }
  .mvmp-price-table .align-right { text-align: left; }
  .mvmp-detail-title { font-size: 24px; }
}

/* ============================================================
   8. AD SLOTS  (fixed-height fallback IS the empty state —
      zero layout shift when a real ad fills the same box)
   ============================================================ */

.mvmp-ad-slot {
  border: 1px dashed var(--mvmp-border); border-radius: var(--mvmp-radius-md); background: var(--mvmp-card-bg);
  display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden;
}
.mvmp-ad-slot__label {
  position: absolute; top: 8px; left: 12px; font-size: 10px; font-weight: 800; color: var(--mvmp-muted);
  text-transform: uppercase; letter-spacing: 0.03em;
}
.mvmp-ad-slot__hint { font-size: 12.5px; color: var(--mvmp-muted); }
.mvmp-ad-slot--728x90  { width: 100%; max-width: 728px; height: 90px; }
.mvmp-ad-slot--300x250 { width: 300px; height: 250px; max-width: 100%; }
.mvmp-ad-slot--300x600 { width: 300px; height: 600px; max-width: 100%; }
.mvmp-ad-slot--filled { border-style: solid; background: transparent; }
.mvmp-ad-slot--filled .mvmp-ad-slot__label { background: rgba(0,0,0,.55); color: #fff; padding: 2px 6px; border-radius: 4px; }
.mvmp-ad-slot--filled img, .mvmp-ad-slot--filled video { width: 100%; height: 100%; object-fit: cover; }

/* ============================================================
   9. SUBMIT — bridges the plugin's real submission-form markup
      (class names verified against the live plugin CSS; this
      file re-skins those selectors rather than duplicating them)
   ============================================================ */

.mvmp-submission-form { max-width: 760px; margin: 0 auto; padding: 32px 24px 80px; }
.mvmp-sf-header h2 { font-size: 26px; font-weight: 800; letter-spacing: -0.02em; margin: 0 0 6px; }
.mvmp-sf-header p { font-size: 14px; color: var(--mvmp-muted); margin: 0 0 24px; }

.mvmp-item-block, .mvmp-sf-step {
  border: var(--mvmp-border-w) solid var(--mvmp-border); border-radius: var(--mvmp-radius-lg);
  padding: 18px; background: var(--mvmp-card-bg); margin-bottom: 16px;
}
.mvmp-item-block__header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }
.mvmp-item-block__title, .mvmp-sf-step__title {
  font-size: 13px; font-weight: 800; color: var(--mvmp-muted); text-transform: uppercase; letter-spacing: 0.03em; margin: 0 0 10px;
}
/* Condensed side-by-side field pairing (Barcode+Brand, Product Name+
   Category, the two photo uploads) — reduces vertical scroll on the
   submit page without removing any input. Falls back to stacked on
   narrow screens where two columns would be too cramped to use. */
.mvmp-sf-row-2col { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 16px; align-items: start; }
@media (max-width: 560px) { .mvmp-sf-row-2col { grid-template-columns: 1fr; } }

.mvmp-items-counter {
  display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px;
}
.mvmp-items-counter__label { font-size: 13px; font-weight: 800; color: var(--mvmp-muted); text-transform: uppercase; letter-spacing: 0.03em; }
.mvmp-item-remove { border: none; background: none; color: var(--mvmp-muted); font-size: 12.5px; font-weight: 700; }

.mvmp-sf-field { margin-bottom: 10px; }
.mvmp-sf-field label { display: block; font-size: 11.5px; font-weight: 700; color: var(--mvmp-muted); margin-bottom: 4px; }
.mvmp-sf-field .required { color: var(--mvmp-primary); }

.mvmp-sf-field input[type="text"], .mvmp-sf-field input[type="number"], .mvmp-sf-field input[type="date"],
.mvmp-sf-field input[type="file"], .mvmp-sf-field select, .mvmp-sf-field textarea,
.mvmp-item-field, .mvmp-item-barcode {
  width: 100%; box-sizing: border-box; padding: 10px 12px; font-size: 13.5px;
  border: var(--mvmp-border-w) solid var(--mvmp-border); border-radius: var(--mvmp-radius-sm);
  background: var(--mvmp-bg); color: var(--mvmp-ink); outline: none;
}
.mvmp-sf-field textarea { resize: vertical; }
.mvmp-sf-field input:focus, .mvmp-sf-field select:focus, .mvmp-sf-field textarea:focus {
  border-color: var(--mvmp-primary);
}
.mvmp-locked { opacity: .75; }

.mvmp-sf-measure-grid, .measure-grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px; }
.mvmp-sf-input-row { display: flex; align-items: center; gap: 6px; }
.mvmp-sf-input-row input { min-width: 0; flex: 1; }
.mvmp-sf-input-row select { flex: 0 0 auto; width: auto; min-width: 64px; }

.mvmp-sf-barcode-wrap { display: flex; gap: 8px; align-items: center; }
.mvmp-sf-barcode-wrap input { flex: 1; min-width: 0; }
.mvmp-scan-btn {
  padding: 10px 12px; border: var(--mvmp-border-w) solid var(--mvmp-border); border-radius: var(--mvmp-radius-sm);
  background: var(--mvmp-bg); color: var(--mvmp-ink); font-size: 1.1rem; line-height: 1;
}
.mvmp-sf-barcode-status { font-weight: 700; font-size: .78rem; white-space: nowrap; padding: 4px 8px; border-radius: 6px; }
.mvmp-sf-barcode-status.found { background: var(--mvmp-tint-secondary-bg); color: var(--mvmp-secondary); }
.mvmp-sf-barcode-status.new   { background: var(--mvmp-tint-gold-bg); color: var(--mvmp-gold); }

.mvmp-sf-price-wrap { display: flex; align-items: center; gap: 6px; }
.mvmp-sf-currency { font-size: 1rem; font-weight: 700; }
.mvmp-sf-price-wrap input { flex: 1; min-width: 0; }

.mvmp-sf-fieldset { border: none; padding: 0; margin: 0 0 10px; }
.mvmp-sf-fieldset legend { font-size: 11.5px; font-weight: 700; color: var(--mvmp-muted); margin-bottom: 6px; padding: 0; }
.mvmp-sf-radio-group { display: flex; flex-direction: column; gap: 6px; }
.mvmp-sf-radio { display: flex; align-items: center; gap: 8px; font-size: 13px; cursor: pointer; }

.mvmp-sf-add-item-wrap {
  padding: 10px 16px; border: 1px dashed var(--mvmp-border); border-radius: 9px; background: transparent;
  color: var(--mvmp-secondary); font-size: 13.5px; font-weight: 700; margin-bottom: 16px; text-align: center;
}
#mvmp-add-item-btn {
  border: none; background: none; color: var(--mvmp-secondary); font-size: 13.5px; font-weight: 700; cursor: pointer;
}
.mvmp-sf-hint { font-size: 11.5px; color: var(--mvmp-muted); margin: 4px 0 0; }
.mvmp-sf-error { color: #dc2626; font-size: .8rem; margin-top: 4px; padding: 6px 10px; background: #fef2f2; border-radius: 6px; border-left: 3px solid #dc2626; }
[data-theme="dark"] .mvmp-sf-error { background: oklch(28% 0.08 25); color: oklch(88% 0.05 25); }

.mvmp-sf-submit button, #mvmp-submit-btn {
  width: 100%; padding: 15px; border: none; border-radius: var(--mvmp-radius-md);
  background: var(--mvmp-primary-grad); color: #fff; font-size: 15px; font-weight: 700;
}

/* ============================================================
   10. LOGIN / DASHBOARD — bridges .mvmp-login-* / .mvmp-sd-*
   ============================================================ */

.mvmp-login-box {
  max-width: 400px; margin: 40px auto; padding: 28px; border: var(--mvmp-border-w) solid var(--mvmp-border);
  border-radius: var(--mvmp-radius-xl); background: var(--mvmp-card-bg);
}
.mvmp-login-box__title { font-size: 22px; font-weight: 800; margin: 0 0 18px; }
.mvmp-login-input {
  width: 100%; box-sizing: border-box; padding: 12px 14px; font-size: 14px;
  border: var(--mvmp-border-w) solid var(--mvmp-border); border-radius: var(--mvmp-radius-sm);
  background: var(--mvmp-bg); color: var(--mvmp-ink); outline: none; margin-bottom: 12px;
}
.mvmp-login-input:focus { border-color: var(--mvmp-primary); }
.mvmp-login-submit { width: 100%; }
.mvmp-login-meta { display: flex; justify-content: space-between; font-size: 13px; margin-top: 12px; }
.mvmp-login-forgot { color: var(--mvmp-secondary); font-weight: 600; }
.mvmp-login-pass-wrap { position: relative; }
.mvmp-login-toggle-pass { position: absolute; right: 10px; top: 12px; background: none; border: none; color: var(--mvmp-muted); font-size: 13px; }

.mvmp-shopper-dashboard { max-width: 900px; margin: 0 auto; padding: 24px; }
.mvmp-sd-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; margin-bottom: 20px; }
.mvmp-sd-stat { border-radius: var(--mvmp-radius-xl); padding: 16px; background: var(--mvmp-tint-primary-bg); }
.mvmp-sd-stat__icon { font-size: 20px; margin-bottom: 6px; }
.mvmp-sd-stat__value { font-size: 26px; font-weight: 800; color: var(--mvmp-primary); }
.mvmp-sd-stat__label { font-size: 12.5px; color: var(--mvmp-muted); font-weight: 700; }
.mvmp-sd-section { margin-bottom: 20px; }

/* ============================================================
   11. SHOPPING LIST
   ============================================================ */

.mvmp-sl-controls { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 16px; }
.mvmp-sl-field { flex: 1; min-width: 220px; }
.mvmp-sl-field--add { flex: 2; min-width: 280px; }
.mvmp-sl-field__label { font-size: 12px; font-weight: 700; color: var(--mvmp-muted); text-transform: uppercase; letter-spacing: 0.03em; margin-bottom: 6px; }
.mvmp-sl-field select, .mvmp-sl-field input {
  width: 100%; box-sizing: border-box; padding: 12px 14px; font-size: 14px;
  border: var(--mvmp-border-w) solid var(--mvmp-border); border-radius: 9px; background: var(--mvmp-card-bg);
  color: var(--mvmp-ink); outline: none;
}
.mvmp-sl-add-row { display: flex; gap: 8px; }
.mvmp-sl-add-row button {
  padding: 12px 18px; border: none; border-radius: 9px; background: var(--mvmp-primary-grad);
  color: #fff; font-size: 14px; font-weight: 700; white-space: nowrap;
}

.mvmp-chip-list { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; }
.mvmp-chip {
  display: flex; align-items: center; gap: 6px; padding: 7px 10px 7px 12px; border: var(--mvmp-border-w) solid var(--mvmp-border);
  border-radius: 20px; background: var(--mvmp-card-bg); font-size: 13px; font-weight: 600;
}
.mvmp-chip button { border: none; background: none; color: var(--mvmp-muted); font-size: 13px; padding: 0 2px; }
.mvmp-sl-empty { font-size: 13px; color: var(--mvmp-muted); padding: 8px 0; }

.mvmp-store-card { border: var(--mvmp-border-w) solid var(--mvmp-border); border-radius: var(--mvmp-radius-lg); background: var(--mvmp-card-bg); overflow: hidden; margin-bottom: 10px; }
.mvmp-store-row { display: grid; grid-template-columns: auto 1.6fr 1fr 1fr 1fr; align-items: center; gap: 16px; padding: 16px 18px; }
.mvmp-store-rank { width: 30px; height: 30px; border-radius: 50%; color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 13px; flex-shrink: 0; }
.mvmp-store-name { font-size: 15px; font-weight: 700; }
.mvmp-store-meta { font-size: 12px; color: var(--mvmp-muted); }
.mvmp-store-stat-label { font-size: 11px; color: var(--mvmp-muted); font-weight: 700; text-transform: uppercase; }
.mvmp-store-stat-value { font-size: 14px; font-weight: 700; }
.mvmp-store-stat-value--price { font-size: 17px; font-weight: 800; color: var(--mvmp-primary); }
.mvmp-store-toggle {
  width: 100%; text-align: left; padding: 10px 18px; border: none; border-top: var(--mvmp-border-w) solid var(--mvmp-border);
  background: transparent; color: var(--mvmp-secondary); font-size: 12.5px; font-weight: 700;
}
.mvmp-store-breakdown { padding: 4px 18px 16px; display: none; }
.mvmp-store-breakdown.is-open { display: block; }
.mvmp-store-breakdown__line { display: flex; justify-content: space-between; font-size: 13px; padding: 6px 0; border-top: var(--mvmp-border-w) solid var(--mvmp-border); }
.mvmp-store-breakdown__line span:last-child { font-weight: 700; }

@media (max-width: 860px) { .mvmp-store-row { grid-template-columns: 1fr; row-gap: 8px; } }

/* ============================================================
   12. ACCOUNT
   ============================================================ */

.mvmp-account-grid { max-width: 1280px; margin: 0 auto; padding: 24px; display: grid; grid-template-columns: 200px 1fr 260px; gap: 20px; align-items: start; }
.mvmp-account-sidebar { border: var(--mvmp-border-w) solid var(--mvmp-border); border-radius: var(--mvmp-radius-xl); padding: 14px; background: var(--mvmp-card-bg); position: sticky; top: 80px; }
.mvmp-account-nav-btn {
  display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; padding: 10px 12px;
  border: none; border-radius: 9px; font-size: 13.5px; font-weight: 700; background: transparent; color: var(--mvmp-ink);
}
.mvmp-account-nav-btn.is-active { background: var(--mvmp-primary); color: #fff; }
.mvmp-account-sidebar__divider { height: 1px; background: var(--mvmp-border); margin: 12px 0; }

.mvmp-greeting-banner {
  border-radius: var(--mvmp-radius-2xl); padding: 24px; background: var(--mvmp-primary-grad); color: #fff;
  display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; margin-bottom: 16px;
}
.mvmp-greeting-banner__left { display: flex; align-items: center; gap: 16px; }
.mvmp-greeting-avatar { width: 56px; height: 56px; border-radius: 50%; background: rgba(255,255,255,0.22); display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 20px; flex-shrink: 0; }
.mvmp-greeting-banner__name { font-size: 20px; font-weight: 800; }
.mvmp-greeting-banner__meta { font-size: 13px; opacity: .85; }
.mvmp-greeting-banner__cta { padding: 10px 16px; border-radius: 9px; background: rgba(255,255,255,0.18); font-size: 13.5px; font-weight: 700; }

.mvmp-stat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 20px; }
.mvmp-stat-card { border-radius: var(--mvmp-radius-xl); padding: 16px; }
.mvmp-stat-card__label { font-size: 13px; font-weight: 800; margin-bottom: 6px; }
.mvmp-stat-card__value-row { display: flex; align-items: baseline; gap: 8px; margin-bottom: 10px; }
.mvmp-stat-card__value { font-size: 26px; font-weight: 800; }
.mvmp-stat-card__sub { font-size: 12px; opacity: .7; }
.mvmp-stat-card__track { height: 6px; border-radius: 4px; background: rgba(0,0,0,0.08); overflow: hidden; }
.mvmp-stat-card__bar { height: 100%; border-radius: 4px; }

.mvmp-submissions-table { border: var(--mvmp-border-w) solid var(--mvmp-border); border-radius: var(--mvmp-radius-lg); overflow: hidden; background: var(--mvmp-card-bg); margin-bottom: 20px; }
.mvmp-submission-row { display: grid; grid-template-columns: 2fr 1fr 1fr 100px; align-items: center; gap: 12px; padding: 14px 18px; border-bottom: var(--mvmp-border-w) solid var(--mvmp-border); }
.mvmp-submission-row:last-child { border-bottom: none; }
.mvmp-submission-row__item { font-size: 14px; font-weight: 700; }
.mvmp-submission-row__meta { font-size: 12px; color: var(--mvmp-muted); }
.mvmp-submission-row__price { font-size: 14px; font-weight: 700; text-align: right; }
.mvmp-submission-row__helped { font-size: 12px; color: var(--mvmp-muted); text-align: right; }

.mvmp-settings-list { border: var(--mvmp-border-w) solid var(--mvmp-border); border-radius: var(--mvmp-radius-lg); padding: 6px; background: var(--mvmp-card-bg); }
.mvmp-settings-row { display: flex; align-items: center; justify-content: space-between; padding: 12px; border-bottom: var(--mvmp-border-w) solid var(--mvmp-border); }
.mvmp-settings-row:last-child { border-bottom: none; }
.mvmp-settings-row__label { font-size: 14px; }
.mvmp-settings-row__value { font-size: 13px; color: var(--mvmp-muted); }

.mvmp-activity-feed { border: var(--mvmp-border-w) solid var(--mvmp-border); border-radius: var(--mvmp-radius-xl); padding: 16px; background: var(--mvmp-card-bg); position: sticky; top: 80px; }
.mvmp-activity-feed__title { font-size: 13px; font-weight: 800; margin-bottom: 12px; }
.mvmp-activity-item { display: flex; gap: 10px; margin-bottom: 12px; }
.mvmp-activity-item:last-child { margin-bottom: 0; }
.mvmp-activity-avatar { width: 28px; height: 28px; border-radius: 50%; flex-shrink: 0; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 11px; font-weight: 800; }
.mvmp-activity-text { font-size: 12.5px; line-height: 1.4; }
.mvmp-activity-text strong { font-weight: 700; }
.mvmp-activity-time { color: var(--mvmp-muted); font-size: 11px; margin-top: 2px; }

@media (max-width: 960px) {
  .mvmp-account-grid { grid-template-columns: 1fr; }
  .mvmp-account-sidebar, .mvmp-activity-feed { display: none; }
  .mvmp-stat-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ============================================================
   13. CATEGORY BROWSE
   ============================================================ */

.mvmp-cat-page { max-width: 1100px; margin: 0 auto; padding: 32px 24px 60px; }
.mvmp-cat-page h1 { font-size: 26px; font-weight: 800; letter-spacing: -0.02em; margin: 0 0 6px; }
.mvmp-cat-page > p { font-size: 14px; color: var(--mvmp-muted); margin: 0 0 24px; }
.mvmp-cat-grid-full { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.mvmp-cat-card { display: flex; align-items: center; gap: 14px; padding: 16px; border: var(--mvmp-border-w) solid var(--mvmp-border); border-radius: var(--mvmp-radius-lg); background: var(--mvmp-card-bg); }
.mvmp-cat-card__icon { width: 44px; height: 44px; border-radius: 50%; color: #fff; display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 17px; flex-shrink: 0; }
.mvmp-cat-card__name { font-size: 15px; font-weight: 700; }
.mvmp-cat-card__count { font-size: 12.5px; color: var(--mvmp-muted); }
@media (max-width: 860px) { .mvmp-cat-grid-full { grid-template-columns: repeat(2, 1fr); } }

/* ============================================================
   14. VENDOR PAGE
   ============================================================ */

.mvmp-vendor-banner { width: 100%; height: 160px; background: var(--mvmp-primary-grad); }
.mvmp-vendor-header { display: flex; align-items: flex-end; gap: 16px; padding: 0 24px; margin-top: -40px; max-width: var(--mvmp-max); margin-left: auto; margin-right: auto; }
.mvmp-vendor-logo { width: 88px; height: 88px; border-radius: var(--mvmp-radius-xl); background: var(--mvmp-card-bg); border: 3px solid var(--mvmp-bg); display: flex; align-items: center; justify-content: center; font-weight: 800; font-size: 28px; color: var(--mvmp-primary); flex-shrink: 0; }
.mvmp-vendor-name { font-size: 22px; font-weight: 800; }
.mvmp-vendor-meta { font-size: 13px; color: var(--mvmp-muted); }

.mvmp-vendor-body { max-width: var(--mvmp-max); margin: 0 auto; padding: 20px 24px 60px; display: grid; grid-template-columns: 1fr 300px; gap: 20px; }
.mvmp-vendor-promo { border-radius: var(--mvmp-radius-xl); padding: 18px; background: var(--mvmp-primary-grad); color: #fff; margin-bottom: 20px; position: relative; }
.mvmp-vendor-promo__badge { position: absolute; top: 12px; right: 14px; font-size: 10.5px; font-weight: 800; background: rgba(255,255,255,0.22); padding: 3px 8px; border-radius: 5px; }
.mvmp-vendor-promo__title { font-size: 18px; font-weight: 800; margin-bottom: 4px; }
.mvmp-vendor-promo__sub { font-size: 13px; opacity: .85; }

.mvmp-vendor-list { border: var(--mvmp-border-w) solid var(--mvmp-border); border-radius: var(--mvmp-radius-lg); overflow: hidden; background: var(--mvmp-card-bg); }
.mvmp-vendor-list-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 14px 18px; border-bottom: var(--mvmp-border-w) solid var(--mvmp-border); }
.mvmp-vendor-list-row:last-child { border-bottom: none; }

.mvmp-vendor-info-card { border: var(--mvmp-border-w) solid var(--mvmp-border); border-radius: var(--mvmp-radius-lg); padding: 16px; background: var(--mvmp-card-bg); margin-bottom: 16px; }
.mvmp-vendor-info-card__title { font-size: 13px; font-weight: 800; margin-bottom: 10px; }
.mvmp-vendor-info-card p { font-size: 13px; color: var(--mvmp-muted); margin: 0 0 6px; }
.mvmp-vendor-claim-card { border-radius: var(--mvmp-radius-lg); padding: 16px; background: var(--mvmp-card-bg); border: 1px dashed var(--mvmp-border); text-align: center; }

@media (max-width: 860px) { .mvmp-vendor-body { grid-template-columns: 1fr; } }

/* ============================================================
   15. FOOTER
   ============================================================ */

.mvmp-footer { border-top: var(--mvmp-border-w) solid var(--mvmp-border); padding: 24px; text-align: center; font-size: 12.5px; color: var(--mvmp-muted); }

/* ============================================================
   16. PLUGIN CATALOGUE / SEARCH BRIDGE
   Reskins .mvmp-products / .mvmp-product-card / .mvmp-product-detail
   (real selectors from the live plugin) to match the token system.
   ============================================================ */

.mvmp-products__search input[type="text"], .mvmp-products__search input[type="search"] {
  padding: 12px 16px; font-size: 14px; border: var(--mvmp-border-w) solid var(--mvmp-border);
  border-radius: var(--mvmp-radius-md); background: var(--mvmp-card-bg); color: var(--mvmp-ink);
}
.mvmp-products__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 16px; }
.mvmp-product-card {
  display: flex; flex-direction: column; border: var(--mvmp-border-w) solid var(--mvmp-border);
  border-radius: var(--mvmp-radius-lg); background: var(--mvmp-card-bg); overflow: hidden;
}
.mvmp-product-card__media { width: 100%; aspect-ratio: 1; }
.mvmp-product-card__media img { width: 100%; height: 100%; object-fit: cover; }
.mvmp-product-card__placeholder {
  width: 100%; aspect-ratio: 1; background: repeating-linear-gradient(45deg, var(--mvmp-border), var(--mvmp-border) 4px, transparent 4px, transparent 8px);
  display: flex; align-items: center; justify-content: center; color: var(--mvmp-muted); font-size: 11px;
}
.mvmp-product-card__body { padding: 14px; }
.mvmp-product-card__name { font-size: 14.5px; font-weight: 700; }
.mvmp-product-card__brand { font-size: 12px; color: var(--mvmp-muted); margin: 2px 0 8px; }
.mvmp-product-card__price { font-size: 19px; font-weight: 800; color: var(--mvmp-primary); }
.mvmp-products__empty, .mvmp-product-detail__no-stock { font-size: 14px; color: var(--mvmp-muted); padding: 40px 0; text-align: center; }

.mvmp-product-detail { max-width: 1100px; margin: 0 auto; padding: 8px 24px 60px; }
.mvmp-product-detail__hero { display: grid; grid-template-columns: 280px 1fr; gap: 28px; margin-bottom: 24px; }
.mvmp-product-detail__img { width: 100%; aspect-ratio: 1; border-radius: var(--mvmp-radius-lg); object-fit: cover; }
.mvmp-product-detail__name { font-size: 28px; font-weight: 800; letter-spacing: -0.02em; margin: 0 0 6px; }
.mvmp-product-detail__brand, .mvmp-product-detail__category { font-size: 14px; color: var(--mvmp-muted); }
.mvmp-product-detail__desc { font-size: 14px; margin-top: 12px; line-height: 1.5; }
.mvmp-product-detail__where { font-size: 16px; font-weight: 800; margin: 0 0 12px; }
.mvmp-product-prices { width: 100%; border-collapse: collapse; border: var(--mvmp-border-w) solid var(--mvmp-border); border-radius: var(--mvmp-radius-lg); overflow: hidden; }
.mvmp-product-prices th { text-align: left; font-size: 11px; font-weight: 800; color: var(--mvmp-muted); text-transform: uppercase; letter-spacing: 0.03em; padding: 10px 18px; background: var(--mvmp-card-bg); }
.mvmp-product-prices td { padding: 14px 18px; border-top: var(--mvmp-border-w) solid var(--mvmp-border); font-size: 13.5px; }
.mvmp-product-prices__price { font-size: 17px; font-weight: 800; color: var(--mvmp-primary); }
@media (max-width: 860px) { .mvmp-product-detail__hero { grid-template-columns: 1fr; } }
