/* ─── Custom properties ─────────────────────────────────────────────── */
:root {
  --vvs-bg:     #e6e3db;
  --vvs-paper:  #fbfaf7;
  --vvs-accent: #d96f3a;
  --vvs-ink:    #3a352e;
  --vvs-soft:   #8a8378;
  --vvs-line:   #d8d2c6;
  --vvs-panel:  #efece4;
  --vvs-ph:     #e8e4da;

  --vvs-radius:    6px;
  --vvs-radius-lg: 10px;
  --vvs-gap:       16px;
  --vvs-sidebar-w: 212px;
  --vvs-transition: 180ms ease;

  /* Écraser les variables Elementor Global Typography → DM Sans partout */
  --e-global-typography-primary-font-family:   'DM Sans';
  --e-global-typography-secondary-font-family: 'DM Sans';
  --e-global-typography-text-font-family:      'DM Sans';
  --e-global-typography-accent-font-family:    'DM Sans';
}

/* ─── Reset + base ──────────────────────────────────────────────────── */
*,
*::before,
*::after { box-sizing: border-box; margin: 0; padding: 0; }

html { scroll-behavior: smooth; }

html, body,
h1, h2, h3, h4, h5, h6,
p, span, div, a, li, td, th,
bdi, cite, em, strong, small, time,
input, textarea, select, button, label {
  font-family: 'DM Sans', sans-serif !important;
}

/* Prix WooCommerce */
.price, .amount, .woocommerce-Price-amount,
.woocommerce-Price-currencySymbol { font-family: 'DM Sans', sans-serif !important; }

body {
  background-color: var(--vvs-bg);
  color: var(--vvs-ink);
  font-family: 'DM Sans', sans-serif !important;
  font-size: 1rem;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

img { display: block; max-width: 100%; height: auto; }
a   { color: var(--vvs-accent); text-decoration: none; transition: color var(--vvs-transition); }
a:hover { color: #b85a2a; }

button, input, select, textarea {
  font-family: inherit;
  font-size: inherit;
}

/* ─── Conteneur principal ──────────────────────────────────────────── */
.vvs-container {
  width: 100%;
  max-width: 1280px;
  margin-inline: auto;
  padding-inline: 24px;
}

/* ─── Header ────────────────────────────────────────────────────────── */
.vvs-header {
  background: var(--vvs-panel);
  border-bottom: 1px solid var(--vvs-line);
  position: sticky;
  top: 0;
  z-index: 100;
  box-shadow: 0 1px 0 var(--vvs-line);
}

.vvs-header-inner {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 20px;
  height: 64px;
  padding-inline: 24px;
  max-width: 1280px;
  margin-inline: auto;
}

/* Logo */
.vvs-logo {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.vvs-logo img,
.vvs-logo .custom-logo { height: 40px; width: auto; display: block; }

.vvs-logo-text {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--vvs-ink);
  letter-spacing: -.02em;
}

/* Nav centrale */
.vvs-header-nav {
  min-width: 0;
  overflow: hidden;
}

/* Actions droite */
.vvs-header-actions {
  display: flex;
  align-items: center;
  gap: 4px;
  flex-shrink: 0;
}

/* Boutons icône génériques */
.vvs-icon-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border: none;
  background: none;
  border-radius: var(--vvs-radius);
  color: var(--vvs-ink);
  cursor: pointer;
  transition: background var(--vvs-transition), color var(--vvs-transition);
  position: relative;
  text-decoration: none;
}

.vvs-icon-btn:hover { background: var(--vvs-bg); color: var(--vvs-accent); }
.vvs-icon-btn:focus-visible {
  outline: 2px solid var(--vvs-accent);
  outline-offset: 2px;
}

/* ── Recherche ─────────────────────────────────────────────────────── */
.vvs-search-wrap { position: relative; }
.vvs-hero-search-wrap  
.vvs-search-box {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  width: 320px;
  background: var(--vvs-paper);
  border: 1px solid var(--vvs-line);
  border-radius: var(--vvs-radius-lg);
  box-shadow: 0 8px 24px rgba(58,53,46,.12);
  padding: 10px;
  z-index: 200;
  animation: vvs-dropdown-in .15s ease;
}

.vvs-search-box[hidden] { display: none; }

@keyframes vvs-dropdown-in {
  from { opacity: 0; transform: translateY(-6px); }
  to   { opacity: 1; transform: translateY(0); }
}

.vvs-search-form {
  display: flex;
  align-items: center;
  gap: 6px;
}

.vvs-search-field {
  flex: 1;
  border: 1px solid var(--vvs-line);
  border-radius: var(--vvs-radius);
  background: var(--vvs-bg);
  color: var(--vvs-ink);
  padding: 8px 12px;
  font-size: .9rem;
  outline: none;
  transition: border-color var(--vvs-transition);
  min-width: 0;
}

.vvs-search-field:focus { border-color: var(--vvs-accent); }
.vvs-search-field::placeholder { color: var(--vvs-soft); }

.vvs-search-submit {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  background: var(--vvs-accent);
  border: none;
  border-radius: var(--vvs-radius);
  color: #fff;
  cursor: pointer;
  flex-shrink: 0;
  transition: background var(--vvs-transition);
}

.vvs-search-submit:hover { background: #b85a2a; }

/* ── Panier ────────────────────────────────────────────────────────── */
.vvs-cart-count {
  position: absolute;
  top: 4px;
  right: 4px;
  min-width: 16px;
  height: 16px;
  background: var(--vvs-accent);
  color: #fff;
  border-radius: 8px;
  font-size: .65rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 3px;
  line-height: 1;
  pointer-events: none;
}

.vvs-cart-count--empty { display: none; }

/* ── Burger ────────────────────────────────────────────────────────── */
.vvs-burger {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 40px;
  height: 40px;
  background: none;
  border: none;
  cursor: pointer;
  padding: 8px;
  border-radius: var(--vvs-radius);
  transition: background var(--vvs-transition);
}

.vvs-burger:hover { background: var(--vvs-bg); }

.vvs-burger-bar {
  display: block;
  width: 100%;
  height: 2px;
  background: var(--vvs-ink);
  border-radius: 2px;
  transition: transform .25s ease, opacity .2s ease;
  transform-origin: center;
}

.vvs-burger[aria-expanded="true"] .vvs-burger-bar:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.vvs-burger[aria-expanded="true"] .vvs-burger-bar:nth-child(2) { opacity: 0; transform: scaleX(0); }
.vvs-burger[aria-expanded="true"] .vvs-burger-bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ── Mobile drawer ─────────────────────────────────────────────────── */
.vvs-mobile-nav {
  position: fixed;
  inset: 0;
  z-index: 300;
  visibility: hidden;
}

.vvs-mobile-nav.open { visibility: visible; }

.vvs-mobile-nav-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.45);
  opacity: 0;
  transition: opacity .3s ease;
}

.vvs-mobile-nav.open .vvs-mobile-nav-overlay { opacity: 1; }

.vvs-mobile-nav-panel {
  position: absolute;
  inset: 0 auto 0 0;
  width: min(320px, 90vw);
  background: var(--vvs-paper);
  display: flex;
  flex-direction: column;
  transform: translateX(-100%);
  transition: transform .3s ease;
  overflow-y: auto;
}

.vvs-mobile-nav.open .vvs-mobile-nav-panel { transform: translateX(0); }

.vvs-mobile-nav-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  border-bottom: 1px solid var(--vvs-line);
  flex-shrink: 0;
}

.vvs-mobile-nav-close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  background: none;
  border: 1px solid var(--vvs-line);
  border-radius: var(--vvs-radius);
  cursor: pointer;
  color: var(--vvs-ink);
  transition: all var(--vvs-transition);
}

.vvs-mobile-nav-close:hover { background: var(--vvs-bg); color: var(--vvs-accent); border-color: var(--vvs-accent); }

.vvs-mobile-nav-body { padding: 16px 20px; flex: 1; display: flex; flex-direction: column; gap: 20px; }

.vvs-mobile-search {
  display: flex;
  align-items: center;
  gap: 6px;
  background: var(--vvs-bg);
  border: 1px solid var(--vvs-line);
  border-radius: var(--vvs-radius);
  padding: 6px 10px;
}

.vvs-mobile-search input[type="search"] {
  flex: 1;
  border: none;
  background: none;
  color: var(--vvs-ink);
  font-size: .875rem;
  outline: none;
}

.vvs-mobile-search input::placeholder { color: var(--vvs-soft); }

.vvs-mobile-search button {
  background: none;
  border: none;
  color: var(--vvs-soft);
  cursor: pointer;
  display: flex;
}

.vvs-mobile-menu,
.vvs-mobile-primary { width: 100%; }

.vvs-mobile-menu-list { list-style: none; padding: 0; display: flex; flex-direction: column; gap: 2px; }

.vvs-mobile-menu-list li a,
.vvs-mobile-menu-list li span {
  display: block;
  padding: 9px 12px;
  border-radius: var(--vvs-radius);
  font-size: .9375rem;
  color: var(--vvs-ink);
  transition: all var(--vvs-transition);
}

.vvs-mobile-menu-list li a:hover { background: var(--vvs-bg); color: var(--vvs-accent); }
.vvs-mobile-menu-list li.current-menu-item > a { color: var(--vvs-accent); font-weight: 600; }

.vvs-mobile-menu-list .sub-menu {
  list-style: none;
  padding: 0 0 0 16px;
  margin-top: 2px;
}

.vvs-mobile-cart-link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  background: var(--vvs-panel);
  border: 1px solid var(--vvs-line);
  border-radius: var(--vvs-radius);
  font-size: .875rem;
  font-weight: 500;
  color: var(--vvs-ink);
  margin-top: auto;
}

.vvs-mobile-cart-link:hover { border-color: var(--vvs-accent); color: var(--vvs-accent); }

/* ─── Breadcrumb ────────────────────────────────────────────────────── */
.vvs-breadcrumb {
  padding: 10px 0 8px;
  font-size: .8125rem;
  color: var(--vvs-soft);
}

.vvs-breadcrumb a { color: var(--vvs-soft); }
.vvs-breadcrumb a:hover { color: var(--vvs-accent); }
.vvs-breadcrumb .sep { margin-inline: 6px; }

/* ─── Page boutique : layout global ────────────────────────────────── */
.vvs-shop-wrap {
  max-width: 1280px;
  margin-inline: auto;
  padding: 24px;
}


.vvs-boutique-header-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 20px;
}

.vvs-boutique-title {
  font-size: 1.75rem;
  font-weight: 700;
  margin: 0;
  color: var(--vvs-ink);
}

.vvs-archive-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 20px;
  gap: 12px;
  flex-wrap: wrap;
}

.vvs-archive-title {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--vvs-ink);
  display: flex;
  align-items: baseline;
  gap: 10px;
}

.vvs-archive-count {
  font-size: .875rem;
  font-weight: 400;
  color: var(--vvs-soft);
}

.vvs-sort-select {
  border: 1px solid var(--vvs-line);
  border-radius: var(--vvs-radius);
  background: var(--vvs-paper);
  color: var(--vvs-ink);
  padding: 6px 10px;
  font-size: .875rem;
  cursor: pointer;
  outline: none;
}

.vvs-sort-select:focus { border-color: var(--vvs-accent); }

/* ─── Layout : sidebar + grille ─────────────────────────────────────── */
.vvs-layout {
  display: flex;
  gap: 25px;
  align-items: flex-start;
}

/* ─── Sidebar filtres ───────────────────────────────────────────────── */
.vvs-sidebar {
  flex: 0 0 25%;
  width: 25%;
  background: var(--vvs-paper);
  border: 1px solid var(--vvs-line);
  border-radius: var(--vvs-radius-lg);
  padding: 16px;
  position: sticky;
  top: 80px;
}

.vvs-sidebar-label {
  font-size: .75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--vvs-soft);
  margin-bottom: 8px;
}

.vvs-sidebar-section {
  padding-block: 14px;
  border-bottom: 1px solid var(--vvs-line);
}

.vvs-sidebar-section:first-child { padding-top: 0; }
.vvs-sidebar-section:last-child  { border-bottom: none; padding-bottom: 0; }

/* Checkboxes */
.vvs-checkbox-list { display: flex; flex-direction: column; gap: 6px; }

.vvs-checkbox-label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: .875rem;
  cursor: pointer;
  color: var(--vvs-ink);
  user-select: none;
}

.vvs-checkbox-label input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: var(--vvs-accent);
  cursor: pointer;
  flex-shrink: 0;
}

/* Pills toggle état */
.vvs-pills {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.vvs-pill {
  padding: 4px 12px;
  border: 1px solid var(--vvs-line);
  border-radius: 20px;
  font-size: .8125rem;
  font-weight: 500;
  cursor: pointer;
  background: var(--vvs-paper);
  color: var(--vvs-soft);
  transition: all var(--vvs-transition);
  user-select: none;
}

.vvs-pill:hover,
.vvs-pill.active {
  background: var(--vvs-accent);
  border-color: var(--vvs-accent);
  color: #fff;
}

/* Prix range */
.vvs-price-range {
  display: flex;
  align-items: center;
  gap: 6px;
}

.vvs-price-range input[type="number"] {
  width: 70px;
  padding: 5px 8px;
  border: 1px solid var(--vvs-line);
  border-radius: var(--vvs-radius);
  background: var(--vvs-bg);
  color: var(--vvs-ink);
  font-size: .8125rem;
  outline: none;
  -moz-appearance: textfield;
}

.vvs-price-range input[type="number"]::-webkit-inner-spin-button { display: none; }
.vvs-price-range input[type="number"]:focus { border-color: var(--vvs-accent); }
.vvs-price-sep { color: var(--vvs-soft); font-size: .875rem; }

/* Bouton reset */
.vvs-reset-btn {
  display: inline-block;
  font-size: .8125rem;
  color: var(--vvs-ink);
  border-bottom: none;
  cursor: pointer;
  transition: color var(--vvs-transition);
}
.vvs-reset-btn:hover { color: var(--vvs-accent); }

/* ─── Encart recherche vinyle — trigger ──────────────────────────────── */
.vvs-vinyl-request {
  margin-top: 24px;
}

.vvs-vinyl-request-trigger {
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 14px 16px;
  background: var(--vvs-bg);
  border: 1px solid var(--vvs-line);
  border-radius: var(--vvs-radius);
  color: var(--vvs-ink);
  font-size: .875rem;
  font-weight: 500;
  font-family: inherit;
  cursor: pointer;
  text-align: left;
  transition: border-color var(--vvs-transition), color var(--vvs-transition);
}

.vvs-vinyl-request-trigger:hover {
  border-color: var(--vvs-accent);
  color: var(--vvs-accent);
}

.vvs-vinyl-request-trigger { flex-wrap: wrap; align-items: center; }
.vvs-vinyl-request-trigger span { flex: 1; min-width: 0; white-space: normal; word-break: break-word; }

.vvs-vr-arrow { opacity: .5; flex-shrink: 0; }
.vvs-vinyl-request-trigger:hover .vvs-vr-arrow { opacity: 1; }

/* ─── Drawer "Rechercher un vinyle" ─────────────────────────── */
.vvs-vr-drawer {
  position: fixed;
  inset: 0;
  z-index: 99999;
  visibility: hidden;
  pointer-events: none;
}

.vvs-vr-drawer.is-open {
  visibility: visible;
  pointer-events: auto;
}

.vvs-vr-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,.45);
  opacity: 0;
  transition: opacity .35s ease;
}

.vvs-vr-drawer.is-open .vvs-vr-overlay { opacity: 1; }

.vvs-vr-panel {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 50vw;
  max-width: 720px;
  background: var(--vvs-paper);
  overflow-y: auto;
  transform: translateX(100%);
  transition: transform .35s cubic-bezier(.4,0,.2,1);
  display: flex;
  flex-direction: column;
}

.vvs-vr-drawer.is-open .vvs-vr-panel { transform: translateX(0); }

.vvs-vr-panel-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 24px 28px 0;
  flex-shrink: 0;
}

.vvs-vr-panel-title {
  font-size: 1.1875rem;
  font-weight: 600;
  color: var(--vvs-ink);
  margin: 0;
}

.vvs-vr-close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: 1px solid var(--vvs-line);
  border-radius: 50%;
  background: transparent;
  color: var(--vvs-ink);
  cursor: pointer;
  transition: border-color var(--vvs-transition), color var(--vvs-transition);
  flex-shrink: 0;
}

.vvs-vr-close:hover { border-color: var(--vvs-accent); color: var(--vvs-accent); }

.vvs-vr-panel-desc {
  font-size: .875rem;
  color: var(--vvs-soft);
  padding: 10px 28px 0;
  margin: 0;
  line-height: 1.5;
}

.vvs-vr-panel-body {
  padding: 20px 28px 32px;
  flex: 1;
}

/* ═══════════════════════════════════════════════════════════════
   PAGE D'ACCUEIL
═══════════════════════════════════════════════════════════════ */

/* ── Hero ───────────────────────────────────────────────────── */
.vvs-hero {
  background: var(--vvs-ink);
  color: #fff;
  padding: 100px 20px 80px;
  text-align: center;
  position: relative;
}
.vvs-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at 60% 40%, rgba(217,111,58,.18) 0%, transparent 70%);
  pointer-events: none;
}
.vvs-hero-inner {
  position: relative;
  max-width: 760px;
  margin: 0 auto;
}
.vvs-hero-eyebrow {
  font-size: .875rem;
  font-weight: 600;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--vvs-accent);
  margin-bottom: 16px;
}
.vvs-hero h1 {
  font-size: clamp(2rem, 5vw, 3.25rem) !important;
  font-weight: 700 !important;
  color: #fff !important;
  line-height: 1.15 !important;
  margin-bottom: 16px !important;
}
.vvs-hero-sub {
  font-size: 1.0625rem;
  color: rgba(255,255,255,.70);
  margin-bottom: 40px;
  line-height: 1.6;
}

/* Search bar */
.vvs-hero-search { max-width: 100%; margin: 0 auto; width: 100%; display:flex;flex-flow: column;align-items: center;justify-content: center;gap: 12px; }
.vvs-hero-search-wrap { position: relative; width: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; }
.vvs-hero-tabs {
  display: inline-flex;
  background: rgba(255,255,255,1);
  border-radius: 100px;
  padding: 3px;
  gap: 2px;
  margin-bottom: 12px;
}
.vvs-hero-tab {
  background: transparent !important;
  border: none !important;
  color: rgba(0,0,0,.65) !important;
  font-size: .875rem !important;
  font-weight: 500 !important;
  padding: 6px 18px !important;
  border-radius: 100px !important;
  cursor: pointer !important;
  transition: all .2s !important;
  height: auto !important;
  box-shadow: none !important;
  text-transform: none !important;
}
.vvs-hero-tab.active,
.vvs-hero-tab:hover {
  background: var(--vvs-accent) !important;
  color: white !important;
}
.vvs-hero-search-bar {
  display: flex;
  width: 100%;
  background: #fff;
  border-radius: 100px;
  padding: 6px 6px 6px 20px;
  gap: 8px;
  box-shadow: 0 8px 32px rgba(0,0,0,.25);
  box-sizing: border-box;
}
.vvs-hero-search-bar input[type="search"] {
  flex: 1;
  width: 100% !important;
  min-width: 0 !important;
  border: none !important;
  outline: none !important;
  background: transparent !important;
  font-size: 1rem !important;
  color: var(--vvs-ink) !important;
  padding: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  height: 40px !important;
  min-height: auto !important;
}
.vvs-hero-submit {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  background: var(--vvs-accent) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 100px !important;
  padding: 0 18px !important;
  height: 38px !important;
  font-size: .875rem !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: background var(--vvs-transition) !important;
  box-shadow: none !important;
  text-transform: none !important;
  flex-shrink: 0 !important;
}
.vvs-hero-submit:hover { background: #b85a2a !important; }
.vvs-hero-submit svg { flex-shrink: 0; width: 17px !important; height: 17px !important; }

/* ── Recherche prédictive ───────────────────────────────────── */
.vvs-hero-search-bar.vvs-search-open {
  border-radius: 20px 20px 0 0 !important;
  box-shadow: 0 -2px 20px rgba(0,0,0,.18) !important;
}
.vvs-hs-dropdown {
  position: absolute;
  top: 100%;
  left: 0; right: 0;
  background: #fff;
  border-radius: 0 0 20px 20px;
  overflow: hidden;
  box-shadow: 0 16px 40px rgba(0,0,0,.22);
  z-index: 200;
  list-style: none;
  padding: 4px 0 8px;
  margin: 0;
  border-top: 1px solid rgba(0,0,0,.07);
}
.vvs-hs-result-link {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 9px 16px !important;
  text-decoration: none !important;
  color: var(--vvs-ink) !important;
  transition: background .12s !important;
}
.vvs-hs-result-link:hover { background: var(--vvs-panel) !important; }
.vvs-hs-result-img {
  width: 48px !important; height: 48px !important;
  object-fit: cover !important;
  border-radius: 8px !important;
  flex-shrink: 0 !important;
  background: var(--vvs-panel) !important;
}
.vvs-hs-result-info { flex: 1 !important; min-width: 0 !important; }
.vvs-hs-result-title {
  display: block !important;
  font-size: .9375rem !important;
  font-weight: 600 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: var(--vvs-ink) !important;
}
.vvs-hs-result-cat {
  display: block !important;
  font-size: .78rem !important;
  color: var(--vvs-soft) !important;
  margin-top: 1px !important;
}
.vvs-hs-result-price {
  font-size: .9375rem !important;
  font-weight: 700 !important;
  color: var(--vvs-accent) !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
}

/* ── Section commune accueil ────────────────────────────────── */
.vvs-home-section {
  padding: 72px 20px;
}
.vvs-home-section--alt {
  background: var(--vvs-panel);
}
.vvs-home-inner {
  max-width: 1200px;
  margin: 0 auto;
}
.vvs-home-header {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  margin-bottom: 32px;
  gap: 16px;
}
.vvs-home-title {
  font-size: 1.5rem !important;
  font-weight: 700 !important;
  color: var(--vvs-ink) !important;
  margin: 0 !important;
}
.vvs-home-link {
  font-size: .875rem;
  font-weight: 600;
  color: var(--vvs-accent);
  white-space: nowrap;
}
.vvs-home-link:hover { color: #b85a2a; }

/* ── Grille catégories ──────────────────────────────────────── */
.vvs-cat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 12px;
}
.vvs-cat-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 10px;
  padding: 20px 12px;
  background: var(--vvs-paper);
  border: 1px solid var(--vvs-line);
  border-radius: var(--vvs-radius-lg);
  transition: box-shadow var(--vvs-transition), transform var(--vvs-transition);
  color: var(--vvs-ink);
  text-decoration: none;
}
.vvs-cat-card:hover {
  box-shadow: 0 4px 20px rgba(58,53,46,.10);
  transform: translateY(-2px);
  color: var(--vvs-ink);
}
.vvs-cat-img {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  overflow: hidden;
  background: var(--vvs-panel);
  flex-shrink: 0;
}
.vvs-cat-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.vvs-cat-icon {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--vvs-accent);
}
.vvs-cat-icon svg {
  width: 40px;
  height: 40px;
}
.vvs-cat-label {
  font-size: .9375rem;
  font-weight: 700;
  color: var(--vvs-ink);
  line-height: 1.3;
}
.vvs-cat-count {
  font-size: .8rem;
  color: var(--vvs-soft);
}

/* ── Notre sélection (grille 4 cols) ────────────────────────── */
.vvs-selection-grid {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  gap: var(--vvs-gap) !important;
  padding: 0 !important;
  margin: 0 !important;
}
.vvs-selection-item {
  display: flex !important;
  flex-direction: column !important;
}

/* ── Notre Sélection — onglets ── */
.vvs-selection-wrap { width: 100%; }

.vvs-sel-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 24px;
}

.vvs-sel-tab {
  padding: 8px 18px;
  border-radius: 999px;
  border: 1.5px solid var(--vvs-line);
  background: var(--vvs-paper);
  color: var(--vvs-ink);
  font-size: .9375rem;
  font-weight: 500;
  cursor: pointer;
  transition: all var(--vvs-transition);
  white-space: nowrap;
}
.vvs-sel-tab:hover { border-color: var(--vvs-accent); color: var(--vvs-accent); }
.vvs-sel-tab--active { background: var(--vvs-accent); border-color: var(--vvs-accent); color: #fff; }

.vvs-sel-panel { display: none; }
.vvs-sel-panel--active { display: block; }
.vvs-sel-empty { color: var(--vvs-muted); text-align: center; padding: 32px 0; }

.vvs-sel-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--vvs-gap);
}
@media (max-width: 1024px) { .vvs-sel-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px)  { .vvs-sel-grid { grid-template-columns: repeat(2, 1fr); gap: 8px; } }

/* ── Responsive homepage ────────────────────────────────────── */
@media (max-width: 900px) {
  .vvs-cat-grid { grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); }
  .vvs-selection-grid { grid-template-columns: repeat(2, 1fr) !important; }
  .vvs-hero { padding: 70px 20px 60px; }
}
@media (max-width: 580px) {
  .vvs-cat-grid { grid-template-columns: repeat(auto-fill, minmax(100px, 1fr)); }
  .vvs-hero-search-bar { padding: 6px; }
  .vvs-hero-submit span { display: none; }
}

@media (max-width: 1024px) {
  .vvs-vr-panel { width: 100vw; max-width: 100vw; }
}

/* Bouton filtres mobile */
.vvs-filter-open {
  display: none;
  align-items: center;
  gap: 8px;
  padding: 8px 14px;
  background: var(--vvs-paper);
  border: 1px solid var(--vvs-line);
  border-radius: var(--vvs-radius);
  font-size: .875rem;
  font-weight: 500;
  cursor: pointer;
  color: var(--vvs-ink);
  margin-bottom: 12px;
}

.vvs-filter-open svg { width: 16px; height: 16px; }

.vvs-sidebar-sticky-close { display: none; }

.vvs-sidebar-overlay {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.4);
  z-index: 200;
}

/* Toggle "En stock" */
.vvs-sidebar-toggle .vvs-toggle-label {
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  user-select: none;
  font-size: .875rem;
}

.vvs-toggle-input { position: absolute; opacity: 0; width: 0; height: 0; }

.vvs-toggle-track {
  width: 36px;
  height: 20px;
  background: var(--vvs-line);
  border-radius: 10px;
  position: relative;
  transition: background var(--vvs-transition);
  flex-shrink: 0;
}

.vvs-toggle-input:checked + .vvs-toggle-track { background: var(--vvs-accent); }

.vvs-toggle-thumb {
  position: absolute;
  top: 3px;
  left: 3px;
  width: 14px;
  height: 14px;
  background: #fff;
  border-radius: 50%;
  transition: transform var(--vvs-transition);
}

.vvs-toggle-input:checked + .vvs-toggle-track .vvs-toggle-thumb { transform: translateX(16px); }

/* ─── Barre résultats ────────────────────────────────────────────────── */
.vvs-results-bar {
  display: none;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 16px;
  gap: 12px;
  flex-wrap: wrap;
}

.vvs-results-count { display: none !important; }
.woocommerce-result-count { display: none !important; }
.woocommerce-ordering { display: none !important; }

/* ─── Toggle grille / liste ─────────────────────────────────────────── */
.vvs-view-toggle {
  display: flex;
  gap: 4px;
  margin-left: auto;
}

.vvs-view-btn {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  height: 34px !important;
  border: 1px solid var(--vvs-line) !important;
  border-radius: var(--vvs-radius) !important;
  background: var(--vvs-paper) !important;
  color: var(--vvs-soft) !important;
  cursor: pointer !important;
  transition: all var(--vvs-transition) !important;
  padding: 0 !important;
  box-shadow: none !important;
  text-decoration: none !important;
}

.vvs-view-btn:hover { border-color: var(--vvs-accent) !important; color: var(--vvs-accent) !important; background: var(--vvs-paper) !important; }
.vvs-view-btn.active { background: var(--vvs-accent) !important; border-color: var(--vvs-accent) !important; color: #fff !important; }

/* ─── Mode liste ─────────────────────────────────────────────────────── */
.vvs-grid--list {
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

.vvs-grid--list .vvs-card {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
}

.vvs-grid--list .vvs-card-thumb {
  flex: 0 0 90px !important;
  width: 90px !important;
  height: 90px !important;
  aspect-ratio: 1 !important;
  border-radius: var(--vvs-radius) 0 0 var(--vvs-radius) !important;
}

.vvs-grid--list .vvs-card-body {
  flex: 1 !important;
  padding: 10px 150px 10px 14px !important;
  flex-direction: row !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 6px 12px !important;
}

.vvs-grid--list .vvs-card-title {
  flex: 1 1 100% !important;
  -webkit-line-clamp: 1 !important;
  font-size: .9rem !important;
  margin: 0 !important;
}

.vvs-grid--list .vvs-card-meta {
  flex: 1 1 auto !important;
  margin: 0 !important;
  font-size: .8rem !important;
}

.vvs-grid--list .vvs-card-footer {
  flex: 0 0 auto !important;
  margin: 0 !important;
}

.vvs-grid--list .vvs-card-body > .woocommerce-LoopProduct-link,
.vvs-grid--list .vvs-card-body a.button {
  flex: 0 0 auto !important;
  width: auto !important;
  padding: 6px 16px !important;
  border-radius: 100px !important;
}

/* Bouton en mode liste : absolu right + centré verticalement */
.vvs-grid--list .vvs-card .add_to_cart_button,
.vvs-grid--list .vvs-card .button,
.vvs-grid--list .vvs-card .vvs-btn-cart {
  position: absolute !important;
  right: 10px !important;
  left: auto !important;
  bottom: auto !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: auto !important;
  padding: 9px 22px !important;
}

/* Spinner */
.vvs-spinner {
  display: none;
  width: 18px;
  height: 18px;
  border: 2px solid var(--vvs-line);
  border-top-color: var(--vvs-accent);
  border-radius: 50%;
  animation: vvs-spin .7s linear infinite;
}

@keyframes vvs-spin { to { transform: rotate(360deg); } }

/* ─── Contenu principal (à droite du sidebar) ───────────────────────── */
.vvs-main { flex: 0 0 75%; width: 75%; min-width: 0; padding: 0 25px 25px 25px; }

/* ─── Grille produits ────────────────────────────────────────────────── */
.vvs-grid,
ul.products {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--vvs-gap);
  list-style: none;
  padding: 0;
}

@media (max-width: 1400px) {
  .vvs-grid,
  ul.products { grid-template-columns: repeat(3, 1fr); }
}

/* ─── Card produit ────────────────────────────────────────────────────── */
.vvs-card,
ul.products li.product {
  background: var(--vvs-paper);
  border: 1px solid var(--vvs-line);
  border-radius: var(--vvs-radius-lg);
  overflow: hidden;
  padding: 10px;
  transition: box-shadow var(--vvs-transition), transform var(--vvs-transition);
  position: relative;
  display: flex !important;
  flex-direction: column !important;
}

.vvs-card:hover,
ul.products li.product:hover {
  box-shadow: 0 4px 20px rgba(58,53,46,.10);
  transform: translateY(-2px);
}

.vvs-card-thumb,
ul.products li.product a:first-child {
  display: block;
  aspect-ratio: 1;
  overflow: hidden;
  background: var(--vvs-ph);
  border-radius: calc(var(--vvs-radius-lg) - 4px);
}

.vvs-card-thumb img,
ul.products li.product img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: transform .4s ease;
}

.vvs-card:hover .vvs-card-thumb img,
ul.products li.product:hover img { transform: scale(1.04); }

/* Badge état — inline dans .vvs-card-footer */
.vvs-badge {
  display: inline-block !important;
  position: static !important;
  background: var(--vvs-paper) !important;
  border: 1px solid var(--vvs-line) !important;
  border-radius: 100px !important;
  font-size: .75rem !important;
  font-weight: 500 !important;
  padding: 3px 10px !important;
  color: var(--vvs-ink) !important;
  font-family: 'DM Sans', sans-serif !important;
  line-height: 1.4 !important;
  white-space: nowrap !important;
}

.vvs-badge--occasion {
  border-color: var(--vvs-accent) !important;
  color: var(--vvs-accent) !important;
}

.vvs-card-body {
  padding: 10px 0 0 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 10px !important;
  flex: 1 !important;
}

.vvs-card-title {
  font-size: .9375rem !important;
  font-weight: 600 !important;
  margin-bottom: 2px !important;
  line-height: 1.3 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

.vvs-card-title a { color: var(--vvs-ink) !important; }
.vvs-card-title a:hover { color: var(--vvs-accent) !important; }

.vvs-card-meta {
  font-size: .8125rem !important;
  color: var(--vvs-soft) !important;
  margin-bottom: 8px !important;
}

/* Rangée prix + badge */
.vvs-card-footer {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  margin-bottom: 12px !important;
  gap: 8px !important;
  margin-top: auto !important;
}

.vvs-card-price,
ul.products li.product .price {
  font-size: 1.0625rem !important;
  font-weight: 700 !important;
  color: var(--vvs-accent) !important;
  display: block !important;
  margin: 0 !important;
}

/* Bouton "Commander" — position absolute en bas */
.vvs-card .vvs-btn-cart,
.vvs-card .button,
ul.products li.product .add_to_cart_button {
  position: absolute !important;
  bottom: 10px !important;
  left: 10px !important;
  right: 10px !important;
  width: auto !important;
  display: block !important;
  padding: 11px 16px !important;
  background: var(--vvs-accent) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 100px !important;
  font-size: .9375rem !important;
  font-weight: 600 !important;
  text-align: center !important;
  cursor: pointer !important;
  opacity: 1 !important;
  transform: none !important;
  transition: background var(--vvs-transition) !important;
  text-decoration: none !important;
}

.vvs-card .vvs-btn-cart:hover,
.vvs-card .button:hover,
ul.products li.product .add_to_cart_button:hover {
  background: #b85a2a !important;
}

/* Espace réservé en bas de la card pour le bouton absolu */
.vvs-card-body,
ul.products li.product .woocommerce-loop-product__link {
  padding-bottom: 58px !important;
}

/* ─── Pagination ─────────────────────────────────────────────────────── */
.vvs-pager {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  margin-top: 32px;
  flex-wrap: wrap;
}

.vvs-page-btn {
  min-width: 36px !important;
  height: 36px !important;
  padding: 0 10px !important;
  border: 1px solid var(--vvs-line) !important;
  border-radius: var(--vvs-radius) !important;
  background: var(--vvs-paper) !important;
  color: var(--vvs-ink) !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  cursor: pointer !important;
  transition: all var(--vvs-transition) !important;
  box-shadow: none !important;
  text-decoration: none !important;
}

.vvs-page-btn:hover:not(:disabled):not([aria-disabled="true"]) { border-color: var(--vvs-accent) !important; color: var(--vvs-accent) !important; }
.vvs-page-btn.active { background: var(--vvs-accent) !important; border-color: var(--vvs-accent) !important; color: #fff !important; font-weight: 400 !important; }
.vvs-page-btn:disabled,
.vvs-page-btn[aria-disabled="true"] { opacity: .4 !important; cursor: not-allowed !important; pointer-events: none !important; }
/* <a> reset */
a.vvs-page-btn { display: inline-flex; align-items: center; justify-content: center; }

/* ─── Recherche sidebar ──────────────────────────────────────────────── */
.vvs-searchbar {
  position: relative;
  display: flex;
  align-items: center;
}

.vvs-search-icon {
  position: absolute;
  right: 10px;
  width: 16px;
  height: 16px;
  color: var(--vvs-soft);
  pointer-events: none;
}

.vvs-search-input {
  width: 100%;
  padding: 7px 34px 7px 12px;
  border: 1px solid var(--vvs-line);
  border-radius: var(--vvs-radius);
  background: var(--vvs-bg);
  color: var(--vvs-ink);
  font-size: .875rem;
  outline: none;
  transition: border-color var(--vvs-transition);
}

.vvs-search-input:focus { border-color: var(--vvs-accent); }
.vvs-search-input::placeholder { color: var(--vvs-soft); }

.vvs-search-clear {
  position: absolute;
  right: 10px;
  font-size: 1rem;
  color: var(--vvs-soft);
  cursor: pointer;
  display: none;
  line-height: 1;
  background: var(--vvs-bg);
  padding-left: 2px;
}

.vvs-search-clear:hover { color: var(--vvs-accent); }

/* Nav genre / filter */
.vvs-genre-nav,
.vvs-bcat-nav { display: flex; flex-direction: column; gap: 2px; }

.vvs-filter-btn {
  display: block;
  padding: 5px 8px;
  border-radius: var(--vvs-radius);
  font-size: .875rem;
  color: var(--vvs-ink);
  transition: all var(--vvs-transition);
  cursor: pointer;
}

.vvs-filter-btn:hover { background: var(--vvs-bg); color: var(--vvs-accent); }
.vvs-filter-btn.active { background: var(--vvs-accent); color: #fff; }
.vvs-filter-count { color: var(--vvs-soft); font-size: .8rem; }
.vvs-filter-btn.active .vvs-filter-count { color: rgba(255,255,255,.7); }

/* ─── Fiche produit (single-product.php) ───────────────────────────── */
.vvs-single-wrap {
  max-width: 1280px;
  margin-inline: auto;
  padding: 24px;
}

.vvs-product-layout {
  display: flex;
  gap: 48px;
  align-items: flex-start;
  margin-bottom: 60px;
}

/* Galerie images */
.vvs-product-gallery {
  flex: 0 0 360px;
  width: 360px;
}

.vvs-gallery-main {
  height: 380px;
  background: #fff;
  border-radius: var(--vvs-radius-lg);
  border: 1px solid var(--vvs-line);
  overflow: hidden;
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.vvs-gallery-main img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* Galerie WooCommerce native — ne pas casser FlexSlider */
.woocommerce-product-gallery {
  position: relative !important;
}

/* Le viewport FlexSlider : on fixe la hauteur ici, pas sur le wrapper ul */
.woocommerce-product-gallery .flex-viewport {
  max-height: 460px !important;
  background: #fff !important;
  border-radius: var(--vvs-radius-lg) !important;
  border: 1px solid var(--vvs-line) !important;
  overflow: hidden !important;
}

.woocommerce-product-gallery .woocommerce-product-gallery__image img,
.woocommerce-product-gallery .wp-post-image {
  width: 100% !important;
  max-height: 460px !important;
  object-fit: contain !important;
  display: block !important;
}

/* Miniatures WC */
.woocommerce-product-gallery .flex-control-thumbs {
  margin-top: 8px !important;
}

.woocommerce-product-gallery .flex-control-thumbs li img {
  border-radius: var(--vvs-radius) !important;
  border: 2px solid transparent !important;
  transition: border-color var(--vvs-transition) !important;
}

.woocommerce-product-gallery .flex-control-thumbs li img:hover,
.woocommerce-product-gallery .flex-control-thumbs li img.flex-active {
  border-color: var(--vvs-accent) !important;
}

.vvs-gallery-thumbs {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}

.vvs-gallery-thumb {
  aspect-ratio: 1;
  background: var(--vvs-ph);
  border-radius: var(--vvs-radius);
  overflow: hidden;
  border: 2px solid transparent;
  cursor: pointer;
  transition: border-color var(--vvs-transition);
}

.vvs-gallery-thumb:hover,
.vvs-gallery-thumb.active { border-color: var(--vvs-accent); }

.vvs-gallery-thumb img { width: 100%; height: 100%; object-fit: cover; }

/* Shortcode [vvs_product_gallery] */
.vvs-gallery-thumb-item {
  display: block;
  aspect-ratio: 1;
  background: var(--vvs-ph);
  border-radius: var(--vvs-radius);
  overflow: hidden;
  border: 2px solid transparent;
  transition: border-color var(--vvs-transition);
}
.vvs-gallery-thumb-item:hover { border-color: var(--vvs-accent); }
.vvs-gallery-thumb-item img { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Infos produit */
.vvs-product-info { flex: 1; min-width: 0; }

.vvs-product-badge {
  display: inline-block;
  padding: 3px 10px;
  background: var(--vvs-paper);
  border: 1px solid var(--vvs-line);
  border-radius: 4px;
  font-family: 'Caveat', cursive;
  font-size: .9rem;
  font-weight: 600;
  color: var(--vvs-accent);
  margin-bottom: 12px;
}

.vvs-product-title {
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.2;
  margin-bottom: 8px;
  font-family: 'DM Sans', sans-serif !important;
  text-transform: none !important;
}

.vvs-product-meta {
  font-size: .9rem;
  color: var(--vvs-soft);
  margin-bottom: 16px;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 12px;
}

.vvs-product-meta span { display: flex; align-items: center; gap: 4px; }

.vvs-product-price {
  font-size: 2rem;
  font-weight: 700;
  color: var(--vvs-accent);
  margin-bottom: 24px;
  font-family: 'DM Sans', sans-serif !important;
}

/* WooCommerce Elementor widgets — forcer DM Sans */
h1.product_title,
.elementor-widget-woocommerce-product-title h1,
.elementor-widget-woocommerce-product-title .product_title {
  font-family: 'DM Sans', sans-serif !important;
  text-transform: none !important;
}

.elementor-widget-woocommerce-product-price .price,
.elementor-widget-woocommerce-product-price .woocommerce-Price-amount,
.elementor-widget-woocommerce-product-price bdi {
  font-family: 'DM Sans', sans-serif !important;
}

/* Description produit — troncature 6 lignes + "En savoir plus" */
.vvs-product-desc-wrap {
  position: relative;
}

.vvs-product-desc-inner {
  overflow: hidden;
}

.vvs-product-desc-inner.is-clamped {
  display: -webkit-box !important;
  -webkit-line-clamp: 6 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

.vvs-product-desc-inner h2,
.vvs-product-desc-inner h3,
.vvs-product-desc-inner h4,
.woocommerce-product-details__short-description h2,
.woocommerce-product-details__short-description h3,
.elementor-widget-woocommerce-product-content h2,
.elementor-widget-woocommerce-product-content h3 {
  margin-top: 20px !important;
  padding-top: 16px !important;
  font-size: 1rem !important;
  font-weight: 700 !important;
  font-family: 'DM Sans', sans-serif !important;
}

.vvs-desc-toggle {
  display: inline-block !important;
  margin-top: 8px !important;
  color: var(--vvs-accent) !important;
  font-size: .875rem !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  text-decoration: underline !important;
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  padding: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  height: auto !important;
  line-height: 1.4 !important;
}

/* Sélecteur quantité */
.vvs-qty-row {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 20px;
}

.vvs-qty-wrap {
  display: flex;
  align-items: center;
  border: 1px solid var(--vvs-line);
  border-radius: var(--vvs-radius);
  overflow: hidden;
}

.vvs-qty-btn {
  width: 32px !important;
  height: 44px !important;
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  cursor: pointer !important;
  font-size: 1.25rem !important;
  font-weight: 400 !important;
  color: var(--vvs-ink) !important;
  transition: color var(--vvs-transition) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0 !important;
  border-radius: 0 !important;
  line-height: 1 !important;
  padding: 0 !important;
  box-shadow: none !important;
}

.vvs-qty-btn:hover { color: var(--vvs-accent) !important; background: transparent !important; }

.vvs-qty-input {
  width: 48px;
  height: 40px;
  border: none;
  border-inline: 1px solid var(--vvs-line);
  text-align: center;
  font-size: .9375rem;
  font-weight: 600;
  color: var(--vvs-ink);
  background: var(--vvs-paper);
  -moz-appearance: textfield;
  outline: none;
}

.vvs-qty-input::-webkit-inner-spin-button { display: none; }

.vvs-btn-add-cart {
  flex: 1;
  height: 40px;
  background: var(--vvs-accent);
  color: #fff;
  border: none;
  border-radius: var(--vvs-radius);
  font-size: .9375rem;
  font-weight: 600;
  cursor: pointer;
  transition: background var(--vvs-transition);
}

.vvs-btn-add-cart:hover { background: #b85a2a; }

/* Stock — messages et cas particuliers */
/* ─── Panier : quantité ──────────────────────────────────────────────── */
/* Quantité fixée (stock = 1) */
.vvs-qty-fixed {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 44px !important;
  height: 44px !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  color: var(--vvs-ink) !important;
}

/* Conteneur vertical +/input/− */
.vvs-qty-col {
  display: inline-flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 2px !important;
}

/* Boutons petits pour la colonne panier */
.vvs-qty-btn--sm {
  width: 28px !important;
  height: 28px !important;
  font-size: 1.1rem !important;
}

/* Masquer les flèches natives du champ number dans le panier */
.woocommerce-cart-form .qty::-webkit-inner-spin-button,
.woocommerce-cart-form .qty::-webkit-outer-spin-button { -webkit-appearance: none !important; }
.woocommerce-cart-form .qty { -moz-appearance: textfield !important; }

.vvs-restock-msg {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 10px 16px !important;
  background: var(--vvs-panel) !important;
  border: 1px solid var(--vvs-line) !important;
  border-radius: var(--vvs-radius-lg) !important;
  font-size: .9rem !important;
  font-weight: 500 !important;
  color: var(--vvs-soft) !important;
  margin-bottom: 20px !important;
}

/* Stock = 1 : bouton pleine largeur sans qty */
.woocommerce div.product form.cart.vvs-cart-single {
  display: block !important;
}

.woocommerce div.product form.cart.vvs-cart-single .single_add_to_cart_button {
  width: 100% !important;
  flex: none !important;
}

/* Page produit — form.cart WooCommerce natif ──────────────────────── */
.woocommerce div.product form.cart {
  display: flex !important;
  align-items: stretch !important;
  gap: 12px !important;
  margin-bottom: 20px !important;
  flex-wrap: nowrap !important;
}

.woocommerce div.product form.cart .quantity {
  display: flex !important;
  align-items: stretch !important;
  border: 1px solid var(--vvs-line) !important;
  border-radius: var(--vvs-radius) !important;
  overflow: hidden !important;
  background: var(--vvs-paper) !important;
  flex-shrink: 0 !important;
  height: 44px !important;
}

/* Boutons −/+ hors du champ quantity — transparents */
.woocommerce div.product form.cart .vvs-qty-btn {
  background: transparent !important;
  background-color: transparent !important;
  color: var(--vvs-ink) !important;
  border: none !important;
  box-shadow: none !important;
}

.woocommerce div.product form.cart .vvs-qty-btn:hover {
  background: transparent !important;
  color: var(--vvs-accent) !important;
}

.woocommerce div.product form.cart .quantity .qty {
  width: 72px !important;
  height: 100% !important;
  border: none !important;
  border-inline: 1px solid var(--vvs-line) !important;
  text-align: center !important;
  font-size: .9375rem !important;
  font-weight: 600 !important;
  color: var(--vvs-ink) !important;
  background: transparent !important;
  -moz-appearance: textfield !important;
  outline: none !important;
}

.woocommerce div.product form.cart .quantity .qty::-webkit-inner-spin-button,
.woocommerce div.product form.cart .quantity .qty::-webkit-outer-spin-button {
  -webkit-appearance: none !important;
}

/* Bouton Commander — même style que les cards */
.woocommerce div.product form.cart .single_add_to_cart_button,
.woocommerce div.product form.cart button.button {
  flex: 1 !important;
  height: 38px !important;
  background: var(--vvs-accent) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 100px !important;
  font-size: .875rem !important;
  font-weight: 600 !important;
  padding: 0 18px !important;
  cursor: pointer !important;
  transition: background var(--vvs-transition) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  line-height: 1 !important;
  opacity: 1 !important;
  transform: none !important;
  text-decoration: none !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  font-family: 'DM Sans', sans-serif !important;
}

.woocommerce div.product form.cart .single_add_to_cart_button:hover,
.woocommerce div.product form.cart button.button:hover {
  background: #b85a2a !important;
  color: #fff !important;
}

/* Infos stock + retrait */
.vvs-product-notice {
  font-size: .8125rem;
  color: var(--vvs-soft);
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-bottom: 24px;
}

.vvs-product-notice .in-stock { color: #4a8c5c; font-weight: 500; }

/* Description hors accordéon */
.vvs-product-desc-wrap {
  margin-bottom: 24px;
}

.vvs-product-desc-inner {
  font-size: .9rem;
  color: var(--vvs-ink) !important;
  line-height: 1.7;
}

.vvs-product-desc-inner * {
  color: var(--vvs-ink) !important;
}

/* Accordéons */
.vvs-accordion { border-top: 1px solid var(--vvs-line); }
.vvs-accordion-item { border-bottom: 1px solid var(--vvs-line); }

.vvs-accordion-btn {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  padding: 14px 0 !important;
  background: none !important;
  background-color: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  text-align: left !important;
  font-size: .9375rem !important;
  font-weight: 600 !important;
  color: var(--vvs-ink) !important;
  cursor: pointer !important;
  gap: 8px !important;
  box-shadow: none !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  height: auto !important;
  line-height: 1.4 !important;
  opacity: 1 !important;
}

.vvs-accordion-btn::after {
  content: '+';
  font-size: 1.2rem;
  color: var(--vvs-soft);
  transition: transform var(--vvs-transition);
  flex-shrink: 0;
}

.vvs-accordion-btn[aria-expanded="true"]::after {
  content: '−';
}

.vvs-accordion-body {
  display: none;
  padding: 0 0 14px;
  font-size: .9rem;
  color: var(--vvs-ink) !important;
  line-height: 1.7;
}
.vvs-accordion-body * { color: var(--vvs-ink) !important; }

.vvs-accordion-body.open { display: block; }

/* Produits similaires */
.vvs-related-section { margin-top: 48px; }

.vvs-related-title {
  font-size: 1.25rem;
  font-weight: 700;
  margin-bottom: 20px;
  color: var(--vvs-ink);
}

.vvs-related-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--vvs-gap);
}

/* ─── Carousel "A découvrir" (related.php override) ─────────────────── */
.elementor-widget-woocommerce-product-related { width: 100% !important; }

/* Wrapper du carousel — padding latéral pour les flèches */
.vvs-related-wrap {
  width: 100%;
  padding: 0 22px;
  box-sizing: border-box;
  overflow: visible !important;
}
.vvs-carousel-wrap {
  overflow: visible !important;
}

/* Track : flex horizontal, scroll-snap (points d'ancrage) */
.vvs-carousel-track {
  display: flex !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  gap: var(--vvs-gap) !important;
  scroll-snap-type: x mandatory !important;
  -webkit-overflow-scrolling: touch !important;
  scrollbar-width: none !important;
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
  align-items: stretch !important;
}
.vvs-carousel-track::-webkit-scrollbar { display: none !important; }

/* Chaque item : 4 visibles à la fois, point d'ancrage au départ */
.vvs-carousel-item {
  flex: 0 0 calc(25% - 12px) !important;
  min-width: calc(25% - 12px) !important;
  max-width: calc(25% - 12px) !important;
  scroll-snap-align: start !important;
  scroll-snap-stop: always !important;
  display: flex !important;
  flex-direction: column !important;
}

/* La carte remplit toute la hauteur de l'item */
.vvs-carousel-item .vvs-card {
  flex: 1 !important;
}

/* Wrapper positionné pour les flèches */
.vvs-carousel-wrap {
  position: relative !important;
}

/* Flèches précédent / suivant */
.vvs-carousel-btn {
  position: absolute !important;
  top: 50% !important;
  transform: translateY(-50%) !important;
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  background: #fff !important;
  border: 1px solid var(--vvs-line) !important;
  border-radius: 50% !important;
  cursor: pointer !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.10) !important;
  z-index: 10 !important;
  color: var(--vvs-ink) !important;
  font-size: 1.25rem !important;
  padding: 0 !important;
  line-height: 1 !important;
  text-transform: none !important;
  font-weight: 400 !important;
  opacity: 1 !important;
  box-sizing: border-box !important;
}
.vvs-carousel-btn:hover {
  background: var(--vvs-accent) !important;
  color: #fff !important;
  border-color: var(--vvs-accent) !important;
}
.vvs-carousel-btn--prev { left: -18px !important; }
.vvs-carousel-btn--next { right: -18px !important; }

/* ─── Carousel CTA slide (13e carte "Voir tout") ──────────────────────── */
.vvs-carousel-item--cta { align-self: stretch !important; }
.vvs-cta-slide {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  height: 100% !important;
  min-height: 320px !important;
  background: var(--vvs-panel) !important;
  border: 2px dashed var(--vvs-line) !important;
  border-radius: var(--vvs-radius-lg) !important;
  text-decoration: none !important;
  gap: 14px !important;
  padding: 24px 16px !important;
  color: var(--vvs-ink) !important;
  transition: background var(--vvs-transition), border-color var(--vvs-transition), color var(--vvs-transition) !important;
}
.vvs-cta-slide:hover {
  background: var(--vvs-accent) !important;
  border-color: var(--vvs-accent) !important;
  color: #fff !important;
}
.vvs-cta-slide__arrow {
  font-size: 2.5rem !important;
  line-height: 1 !important;
  width: 56px !important;
  height: 56px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: 50% !important;
  background: rgba(0,0,0,.06) !important;
  transition: background var(--vvs-transition) !important;
}
.vvs-cta-slide:hover .vvs-cta-slide__arrow { background: rgba(255,255,255,.20) !important; }
.vvs-cta-slide__label {
  font-size: 1rem !important;
  font-weight: 700 !important;
  text-align: center !important;
  line-height: 1.4 !important;
}

/* ─── Carousel responsive ────────────────────────────────────────────── */
@media (max-width: 1024px) {
  .vvs-carousel-item {
    flex: 0 0 calc(50% - 8px) !important;
    min-width: calc(50% - 8px) !important;
    max-width: calc(50% - 8px) !important;
  }
  .vvs-carousel-btn--prev { left: -12px !important; }
  .vvs-carousel-btn--next { right: -12px !important; }
}
@media (max-width: 480px) {
  .vvs-carousel-item {
    flex: 0 0 calc(100% - 0px) !important;
    min-width: calc(100%) !important;
    max-width: calc(100%) !important;
  }
  .vvs-carousel-btn { display: none !important; }
}

/* ─── Rupture de stock ────────────────────────────────────────────────── */
.vvs-rupture-wrap {
  background: var(--vvs-panel);
  border: 1px solid var(--vvs-line);
  border-radius: var(--vvs-radius-lg);
  padding: 20px;
  margin-top: 16px;
}

.vvs-rupture-label {
  font-weight: 600;
  color: #b04020;
  margin-bottom: 6px;
}

.vvs-rupture-intro {
  font-size: .875rem;
  color: var(--vvs-soft);
  margin-bottom: 16px;
}

.vvs-rupture-fields {
  display: grid;
  gap: 8px;
  margin-bottom: 12px;
}

.vvs-rupture-fields input,
.vvs-rupture-fields textarea {
  width: 100%;
  padding: 8px 12px;
  border: 1px solid var(--vvs-line);
  border-radius: var(--vvs-radius);
  background: var(--vvs-paper);
  color: var(--vvs-ink);
  font-size: .875rem;
  outline: none;
  transition: border-color var(--vvs-transition);
}

.vvs-rupture-fields input:focus,
.vvs-rupture-fields textarea:focus { border-color: var(--vvs-accent); }

.vvs-rupture-submit {
  padding: 8px 20px;
  background: var(--vvs-accent);
  color: #fff;
  border: none;
  border-radius: var(--vvs-radius);
  font-size: .875rem;
  font-weight: 600;
  cursor: pointer;
}

.vvs-rupture-submit:hover { background: #b85a2a; }
.vvs-rupture-feedback { margin-top: 8px; font-size: .8125rem; }
.vvs-rupture-feedback.success { color: #4a8c5c; }
.vvs-rupture-feedback.error   { color: #b04020; }

/* ─── Supprimer icône check vert WooCommerce (bouton après ajout panier) */
.woocommerce .single_add_to_cart_button.added::before,
.woocommerce a.button.added::before,
.woocommerce ul.products li.product a.added::before,
.woocommerce .product a.added_to_cart,
.added_to_cart {
  display: none !important;
}

.woocommerce div.product form.cart .single_add_to_cart_button.added {
  background: var(--vvs-accent) !important;
  opacity: 1 !important;
}

/* ─── Menu Header Shop ────────────────────────────────────────────────── */
.vvs-mshop {
  position: relative;
  display: flex;
  align-items: center;
  gap: 4px;
}

.vvs-mshop-nav {
  display: flex;
  align-items: center;
  gap: 4px;
  overflow-x: auto;
  scroll-behavior: smooth;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.vvs-mshop-nav::-webkit-scrollbar { display: none; }

.vvs-mshop-item { position: relative; }

.vvs-cat-btn {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 6px 14px;
  border-radius: 20px;
  font-size: .875rem;
  font-weight: 500;
  color: var(--vvs-ink);
  white-space: nowrap;
  transition: all var(--vvs-transition);
  border: 1px solid transparent;
}

.vvs-cat-btn:hover { background: var(--vvs-panel); color: var(--vvs-accent); }
.vvs-cat-btn--active { background: var(--vvs-accent); color: #fff; border-color: var(--vvs-accent); }
.vvs-cat-btn--active:hover { background: #b85a2a; color: #fff; }
.vvs-mshop-caret { font-size: .6rem; }

.vvs-mshop-sub {
  display: none;
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  min-width: 180px;
  background: var(--vvs-paper);
  border: 1px solid var(--vvs-line);
  border-radius: var(--vvs-radius-lg);
  box-shadow: 0 8px 24px rgba(0,0,0,.1);
  padding: 8px;
  z-index: 50;
}

.vvs-mshop-sub.open { display: block; }

.vvs-mshop-sub-link {
  display: block;
  padding: 6px 10px;
  border-radius: var(--vvs-radius);
  font-size: .875rem;
  color: var(--vvs-ink);
  transition: all var(--vvs-transition);
}

.vvs-mshop-sub-link:hover,
.vvs-mshop-sub-link.active { background: var(--vvs-accent); color: #fff; }

.vvs-mshop-arrow {
  display: none;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  background: var(--vvs-paper);
  border: 1px solid var(--vvs-line);
  border-radius: 50%;
  cursor: pointer;
  font-size: 1.1rem;
  color: var(--vvs-ink);
  flex-shrink: 0;
}

.vvs-mshop-arrow:hover { border-color: var(--vvs-accent); color: var(--vvs-accent); }

/* ─── Notices WooCommerce (add-to-cart, info, erreur) ───────────────── */
.woocommerce-notices-wrapper .woocommerce-message,
.woocommerce-notices-wrapper .woocommerce-info,
.woocommerce-notices-wrapper .woocommerce-error,
.woocommerce .woocommerce-message,
.woocommerce .woocommerce-info,
.woocommerce .woocommerce-error {
  background: #fff !important;
  border: none !important;
  border-radius: var(--vvs-radius-lg) !important;
  padding: 14px 18px !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  font-size: .9rem !important;
  color: var(--vvs-ink) !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.06) !important;
  margin-bottom: 20px !important;
  list-style: none !important;
}

.woocommerce-notices-wrapper .woocommerce-info,
.woocommerce .woocommerce-info {
  border-left-color: #4a8c5c !important;
}

.woocommerce-notices-wrapper .woocommerce-error,
.woocommerce .woocommerce-error {
  border-left-color: #b04020 !important;
}

/* Supprimer l'icône check/info/erreur native */
.woocommerce-notices-wrapper .woocommerce-message::before,
.woocommerce-notices-wrapper .woocommerce-info::before,
.woocommerce-notices-wrapper .woocommerce-error::before,
.woocommerce .woocommerce-message::before,
.woocommerce .woocommerce-info::before,
.woocommerce .woocommerce-error::before {
  display: none !important;
}

/* Bouton "Voir le panier" dans la notice */
.woocommerce-notices-wrapper .woocommerce-message .button,
.woocommerce .woocommerce-message .button,
.woocommerce-notices-wrapper .woocommerce-message a.button {
  margin-left: auto !important;
  flex-shrink: 0 !important;
  background: var(--vvs-accent) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 100px !important;
  padding: 7px 18px !important;
  font-size: .875rem !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  transition: background var(--vvs-transition) !important;
  height: auto !important;
  line-height: 1.4 !important;
  display: inline-block !important;
}

.woocommerce-notices-wrapper .woocommerce-message .button:hover,
.woocommerce .woocommerce-message .button:hover {
  background: #b85a2a !important;
  color: #fff !important;
}

/* ─── Messages vides ─────────────────────────────────────────────────── */
.vvs-no-result,
.vvs-no-results {
  grid-column: 1 / -1;
  text-align: center;
  padding: 48px 24px;
  color: var(--vvs-soft);
  font-size: .9375rem;
}

/* ─── Responsive — tablette ≤ 1024px ────────────────────────────────── */
@media (max-width: 1024px) {
  .vvs-grid,
  ul.products { grid-template-columns: repeat(2, 1fr); }

  .vvs-related-grid { grid-template-columns: repeat(2, 1fr); }

  .vvs-related-grid { grid-template-columns: repeat(2, 1fr); }

  .vvs-product-layout { gap: 32px; }
  .vvs-product-gallery { flex: 0 0 280px; width: 280px; }

  .vvs-search-box { width: 280px; }
}

/* ─── Responsive — mobile ≤ 768px ──────────────────────────────────── */
@media (max-width: 768px) {
  /* Header mobile */
  .vvs-header-inner {
    grid-template-columns: auto 1fr auto;
    padding-inline: 16px;
    gap: 12px;
  }

  .vvs-header-nav { display: none; }

  .vvs-burger { display: flex; }

  .vvs-search-box {
    position: fixed;
    top: 64px;
    left: 0;
    right: 0;
    width: 100%;
    border-radius: 0;
    border-left: none;
    border-right: none;
    border-top: none;
    box-shadow: 0 4px 16px rgba(58,53,46,.12);
  }

  /* Shop layout */
  .vvs-layout { flex-direction: column; }
  .vvs-main { flex: none; width: 100%; padding: 0 0 25px; }

  .vvs-sidebar {
    position: fixed;
    inset: 0;
    width: 100%;
    max-height: 100dvh;
    overflow-y: auto;
    z-index: 250;
    transform: translateX(-100%);
    transition: transform .3s ease;
    border-radius: 0;
    padding-top: 0;
    margin-top: 0;
  }

  .vvs-sidebar.open { transform: translateX(0); }

  .vvs-sidebar-overlay.open { display: block; }

  .vvs-sidebar-sticky-close {
    display: block;
    position: sticky;
    top: 0;
    background: var(--vvs-paper);
    padding: 12px 16px;
    border-bottom: 1px solid var(--vvs-line);
    margin: -16px -16px 16px;
    z-index: 1;
  }

  .vvs-sidebar-close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 12px;
    background: var(--vvs-accent);
    border: none;
    border-radius: var(--vvs-radius);
    font-size: .9375rem;
    font-weight: 600;
    cursor: pointer;
    color: #fff;
  }

  .vvs-filter-open { display: flex; width: 100%; justify-content: center; }

  .vvs-grid,
  ul.products { grid-template-columns: repeat(2, 1fr); gap: 10px; }

  .vvs-product-layout { flex-direction: column; }
  .vvs-product-gallery { flex: none; width: 100%; }

  .vvs-shop-wrap, .vvs-single-wrap { padding: 16px; }
}

@media (max-width: 480px) {
  .vvs-grid,
  ul.products { grid-template-columns: repeat(2, 1fr); gap: 8px; }

  .vvs-related-grid { grid-template-columns: repeat(2, 1fr); }
}

/* ─── Homepage : cat-grid section — padding réduit sur mobile ───── */
@media (max-width: 768px) {
  .elementor-element-e5eac7d {
    padding-top: 32px !important;
    padding-bottom: 32px !important;
  }
  .elementor-element-658bca4 {
    align-items: stretch !important;
    width: 100% !important;
  }
  .elementor-element-658bca4 > .elementor-widget-wrap,
  .elementor-element-658bca4 > .e-con-inner {
    width: 100% !important;
  }
}

/* ── Nos prochains showcases ────────────────────────────────── */
.vvs-showcases-wrap {
  padding: 80px 50px;
}
.vvs-showcases-title {
  font-size: 2rem;
  font-weight: 700;
  color: var(--vvs-ink);
  margin-bottom: 40px;
}
.vvs-showcases-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.vvs-showcase-card {
  display: block;
  border-radius: var(--vvs-radius-lg);
  overflow: hidden;
  border: 1px solid var(--vvs-line);
  background: var(--vvs-paper);
  text-decoration: none;
  transition: box-shadow var(--vvs-transition), transform var(--vvs-transition);
}
.vvs-showcase-card:hover {
  box-shadow: 0 8px 24px rgba(0,0,0,.1);
  transform: translateY(-2px);
}
.vvs-showcase-img {
  aspect-ratio: 16/9;
  overflow: hidden;
  background: var(--vvs-sand);
}
.vvs-showcase-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform .4s ease;
}
.vvs-showcase-card:hover .vvs-showcase-img img { transform: scale(1.04); }
.vvs-showcase-img--placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--vvs-muted);
}
.vvs-showcase-body { padding: 16px 20px; }
.vvs-showcase-name {
  font-size: 1rem;
  font-weight: 600;
  color: var(--vvs-ink);
  margin: 0;
  line-height: 1.4;
}
@media (max-width: 1024px) { .vvs-showcases-grid { grid-template-columns: repeat(2, 1fr); } .vvs-showcases-wrap { padding: 60px 24px; } }
@media (max-width: 480px)  { .vvs-showcases-grid { grid-template-columns: 1fr; } .vvs-showcases-wrap { padding: 40px 16px; } }