/* Vineta — boutique polyvalente, d'après le gabarit « Vineta ».
   Poppins, corail, boutons pilule nuit, barre du haut sombre (réseaux,
   messages défilants, téléphone), bannière pêche, prix en corail. */
:root {
    --t-dark: #313030;
    --t-head-weight: 500;
    --t-head-spacing: -0.01em;
    --t-surface: #f5f5f5;
    --t-border: #ebebeb;
    --t-muted: #545454;
    --t-header-h: 80px;
    --vn-nuit: var(--t-secondary);
    --vn-peche: color-mix(in srgb, var(--t-primary) 32%, #fff);
}
body.theme-vineta { font-size: 15px; }

/* ------------------------------------------------------------- en-tête */
/* Le défilé reprend la piste animée des annonces (feuille commune). */
.vn-topbar { background: #313030; color: #fff; font-size: 13px; font-weight: 500; }
.vn-topbar .t-topbar__inner { display: grid; grid-template-columns: 1fr minmax(0, 2.2fr) 1fr; min-height: 42px; }
.vn-social { gap: 8px; }
.vn-social a { width: 28px; height: 28px; border: 1px solid rgba(255, 255, 255, .35); font-size: 12px; }
.vn-social a:hover { background: #fff; color: #000; }
.vn-topbar .t-topbar__contact { justify-content: flex-end; }
.vn-defile { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent); }
.vn-defile .vm-annonces__groupe { display: flex; }
.vn-defile__item { padding-inline: 18px; white-space: nowrap; }
.vn-defile__item::after { content: "•"; margin-inline-start: 36px; opacity: .7; }
.vn-defile:hover .vm-annonces__piste { animation-play-state: paused; }
@media (max-width: 767.98px) {
    .vn-topbar .t-topbar__inner { grid-template-columns: 1fr; justify-items: center; }
    .vn-social, .vn-topbar .t-topbar__contact { display: none; }
    .vn-defile { width: 100%; }
}

.theme-vineta .t-logo__texte { font-size: 30px; font-weight: 500; letter-spacing: -0.02em; }
.theme-vineta.t-header--classic .t-nav__liste { justify-content: center; }
.theme-vineta .t-nav__liste { gap: 4px 30px; }
.theme-vineta .t-nav__liste a { font-size: 14px; font-weight: 500; }
.theme-vineta .t-nav__liste a::after { background: var(--t-primary); }
.theme-vineta .t-action { font-size: 18px; }
.theme-vineta .t-panier__nombre { background: var(--t-primary); top: 0; min-width: 17px; height: 17px; font-size: 10px; }

/* Barre de recherche visible (header.blade.php) : masquée par défaut, elle
   s'affiche sur ordinateur pour les variantes dont la démo la montre, avec
   le logo à gauche, la barre au centre et le menu sur une seconde ligne. */
.theme-vineta .vn-recherche-barre { display: none; }
@media (min-width: 992px) {
    .theme-vineta:is(.theme-vineta--fleuriste, .theme-vineta--meubles, .theme-vineta--sport, .theme-vineta--epicerie, .theme-vineta--librairie) .t-bar { overflow-x: clip; }
    .theme-vineta:is(.theme-vineta--fleuriste, .theme-vineta--meubles, .theme-vineta--sport, .theme-vineta--epicerie, .theme-vineta--librairie) .t-bar__inner {
        grid-template-columns: auto minmax(0, 1fr) auto;
        grid-template-areas: "logo recherche actions" "nav nav nav";
        row-gap: 0;
    }
    .theme-vineta:is(.theme-vineta--fleuriste, .theme-vineta--meubles, .theme-vineta--sport, .theme-vineta--epicerie, .theme-vineta--librairie) .vn-recherche-barre {
        grid-area: recherche;
        justify-self: center;
        display: flex;
        align-items: center;
        width: min(100%, 420px);
        padding: 4px;
        border: 1px solid var(--t-border);
        border-radius: 999px;
    }
    .theme-vineta .vn-recherche-barre input { flex: 1 1 auto; min-width: 0; height: 36px; padding: 0 16px; border: 0; background: transparent; color: inherit; font-size: 13px; }
    .theme-vineta .vn-recherche-barre input:focus-visible { outline: 2px solid var(--t-primary); outline-offset: 2px; border-radius: 999px; }
    .theme-vineta .vn-recherche-barre button { display: grid; place-items: center; width: 56px; height: 36px; border: 0; border-radius: 999px; background: #111; color: #fff; cursor: pointer; }
    .theme-vineta:is(.theme-vineta--fleuriste, .theme-vineta--meubles, .theme-vineta--sport, .theme-vineta--epicerie, .theme-vineta--librairie) .t-recherche { display: none; }
    .theme-vineta:is(.theme-vineta--fleuriste, .theme-vineta--meubles, .theme-vineta--sport, .theme-vineta--epicerie, .theme-vineta--librairie) .t-nav { position: relative; padding-block: 4px; }
    .theme-vineta:is(.theme-vineta--fleuriste, .theme-vineta--meubles, .theme-vineta--sport, .theme-vineta--epicerie, .theme-vineta--librairie) .t-nav::before {
        content: "";
        position: absolute;
        top: 0;
        inset-inline: -100vw;
        height: 1px;
        background: var(--t-border);
    }
    .theme-vineta:is(.theme-vineta--fleuriste, .theme-vineta--meubles, .theme-vineta--sport, .theme-vineta--epicerie, .theme-vineta--librairie) .t-nav__liste { justify-content: center; }
}

/* ------------------------------------------------------------- boutons */
.theme-vineta .t-btn, .theme-vineta .rr-btn, .theme-vineta .pq-summary-cta, .theme-vineta .btn-primary {
    background: var(--vn-nuit); border-color: var(--vn-nuit); color: #fff;
    font-weight: 600; font-size: 15px; padding: 14px 30px;
}
.theme-vineta .t-btn::after, .theme-vineta .rr-btn::after { content: "›"; font-size: 1.3em; line-height: 0; margin-inline-start: 4px; }
.theme-vineta .t-recherche__form .t-btn::after { content: none; }
.theme-vineta .t-btn:hover, .theme-vineta .rr-btn:hover, .theme-vineta .pq-summary-cta:hover, .theme-vineta .btn-primary:hover {
    background: var(--t-primary); border-color: var(--t-primary); color: #fff;
}

/* ------------------------------------------------------------ bannière */
.theme-vineta .bb-hero:not(.bb-hero--cover) { background: var(--vn-peche); }
.theme-vineta .bb-hero__titre { font-weight: 500; font-size: clamp(36px, 5.2vw, 64px); line-height: 1.12; color: #1c1c1c; }
.theme-vineta .bb-hero__accroche { color: #1c1c1c; }
.theme-vineta .bb__eyebrow { color: var(--t-primary); font-weight: 600; letter-spacing: .06em; text-transform: uppercase; font-size: 13px; }
.theme-vineta .bb-hero:not(.bb-hero--cover) .bb__eyebrow { color: #1c1c1c; opacity: .75; }
.theme-vineta .bb-hero--sans-image .bb-hero__visuel {
    background: linear-gradient(150deg, color-mix(in srgb, var(--t-primary) 20%, #fff), color-mix(in srgb, var(--t-primary) 55%, #fff));
    border-radius: 999px 999px var(--t-radius) var(--t-radius);
}
.theme-vineta .bb-hero--cover { background: linear-gradient(120deg, var(--vn-nuit), color-mix(in srgb, var(--vn-nuit) 70%, var(--t-primary))); }
.theme-vineta .bb-hero--cover .rr-btn { background: #fff; border-color: #fff; color: #1c1c1c; }

/* ----------------------------------------------------------------- blocs */
.theme-vineta .bb__title { font-weight: 500; }
.theme-vineta .bb-rayons--circle .bb-rayon__visuel { background: var(--t-surface); transition: box-shadow .3s ease; }
.theme-vineta .bb-rayons--circle .bb-rayon:hover .bb-rayon__visuel { box-shadow: 0 0 0 3px var(--t-primary); }
.theme-vineta .bb-rayon__nom { font-weight: 500; font-size: 16px; }
.theme-vineta .bb-cta { background: color-mix(in srgb, var(--t-primary) 10%, #fff); border-radius: var(--t-radius); }
.theme-vineta .bb-cta .bb__title { color: #1c1c1c; }
.theme-vineta .bb-feature h6 { font-weight: 600; font-size: 16px; }

/* ------------------------------------------------------------ produits */
.theme-vineta .pq-shop-product-img { background: var(--t-surface); }
.theme-vineta .pq-shop-product-img::after { background: none; }
.theme-vineta .pq-shop-box .pq-product-detail .pq-product-name { font-size: 16px; font-weight: 500; color: #000; }
.theme-vineta .pq-shop-box .pq-product-detail .pq-product-price { color: var(--vn-accent-texte, var(--t-primary)); font-weight: 500; font-size: 16px; }
/* Le prix est l'information clé de la carte : il prend la couleur principale
   assombrie (--vn-accent-texte, ≥ 4,5:1 sur fond clair, teinté ou gris dans
   chaque variante) plutôt que la couleur brute, trop pâle pour le corail, l'or
   ou le jaune. Le prix barré reste discret. */
.theme-vineta .pq-shop-box .pq-product-detail .pq-product-price del { color: var(--t-muted); }
.theme-vineta .pq-badge-sale { background: var(--t-primary); border-radius: 999px; padding-inline: 10px; }
/* Le bouton des cartes prend le fond « nuit » (couleur secondaire, sombre dans
   toutes les variantes) : son texte doit être clair, et non la couleur prévue
   pour la couleur principale, sombre quand celle-ci est claire (voyage, animaux). */
.theme-vineta .pq-shop-box .pq-button-contain .pq-cart-button { background: var(--vn-nuit); border-radius: 999px; font-weight: 600; color: #fff; }
.theme-vineta .pq-shop-box .pq-button-contain .pq-cart-button:hover { background: var(--t-primary); color: var(--t-on-primary); }

/* -------------------------------------------------------------- pied */
.theme-vineta .t-footer-light .t-footer { background: #fff; color: var(--t-muted); }
.theme-vineta .t-footer__titre { font-size: 18px; font-weight: 600; }
.theme-vineta .t-footer__lettre { background: color-mix(in srgb, var(--t-primary) 8%, #fff); }
.theme-vineta .t-lettre input { border-radius: 999px; }

/* Rayons en ronds : de taille raisonnable, comme dans le gabarit. */
.theme-vineta .bb-rayons--circle .bb-rayon__visuel { max-width: 200px; margin-inline: auto; }
.theme-vineta .pq-badge-new { border-radius: 999px; }

/* ======================================================= accents des blocs
   Les blocs du thème (blocs.css) lisent ces variables pour leurs boutons
   « accent » et leurs petits textes en couleur. Pourquoi ne pas employer la
   couleur principale telle quelle : le corail du gabarit, l'or des bijoux ou
   le jaune du voyage n'offrent pas un contraste suffisant avec un texte blanc
   (4,5:1). Le bouton d'accent reste donc nuit dans la version de base, et
   chaque variante choisit la teinte qui reste lisible ; les petits textes
   prennent la couleur principale assombrie (≥ 4,5:1 sur fond clair). */
.theme-vineta {
    --vn-accent: var(--vn-nuit);
    --vn-sur-accent: #fff;
    --vn-accent-texte: color-mix(in srgb, var(--t-primary) 60%, var(--t-text));
    --vn-etoile: #e09a00;
}
/* Chaque variante choisit la teinte de ses boutons « accent » : la couleur de
   la démo quand elle porte un texte blanc lisible, sinon une version assombrie. */
.theme-vineta--bebe, .theme-vineta--fleuriste, .theme-vineta--soin, .theme-vineta--plantes { --vn-accent: var(--t-primary-fonce); }
.theme-vineta--librairie, .theme-vineta--epicerie { --vn-accent: var(--t-primary); }
.theme-vineta--bijoux { --vn-accent: color-mix(in srgb, var(--t-primary) 72%, #000); }
.theme-vineta--meubles, .theme-vineta--sport, .theme-vineta--electronique, .theme-vineta--animaux, .theme-vineta--montres, .theme-vineta--voyage { --vn-accent: var(--vn-nuit); }

/* ============================================================ variantes
   Affinages d'en-tête propres à chaque variante (classe body
   theme-vineta--<id>) : couleur de la barre du haut et graisse des titres,
   relevées sur la démo d'origine. Les affinages des blocs sont à la fin de
   blocs.css ; couleurs et polices viennent des fichiers de variantes
   (resources/themes/vineta/variantes/<id>.php). */
.theme-vineta--bebe { --t-head-weight: 700; }
.theme-vineta--bebe .vn-topbar { background: #FF6969; }
.theme-vineta--fleuriste { --t-head-weight: 400; }
.theme-vineta--fleuriste .vn-topbar { background: #A52C69; }
.theme-vineta--meubles .vn-topbar, .theme-vineta--sport .vn-topbar { background: #8F4A58; }
.theme-vineta--bijoux { --t-head-weight: 500; --t-head-spacing: 0; }
.theme-vineta--bijoux .vn-topbar, .theme-vineta--epicerie .vn-topbar { background: #000; }
.theme-vineta--soin { --t-head-weight: 400; }
.theme-vineta--soin .vn-topbar { background: #A95354; }
.theme-vineta--plantes { --t-head-weight: 700; --t-head-spacing: -0.02em; }
.theme-vineta--plantes .vn-topbar, .theme-vineta--animaux .vn-topbar { background: #5192F4; }
.theme-vineta--animaux { --t-head-weight: 700; }
.theme-vineta--librairie .vn-topbar { background: #2CA554; }
.theme-vineta--montres { --t-head-weight: 400; --t-head-spacing: -0.01em; }
.theme-vineta--montres .vn-topbar { background: #502424; }
.theme-vineta--voyage { --t-head-weight: 400; --t-head-spacing: -0.01em; }
/* Voyage : barre du haut blanche à texte sombre, puis barre de menu noire. */
.theme-vineta--voyage .vn-topbar { background: #fff; color: #1c1c1c; border-bottom: 1px solid var(--t-border); }
.theme-vineta--voyage .vn-social a { border-color: color-mix(in srgb, #1c1c1c 30%, transparent); }
.theme-vineta--voyage .vn-social a:hover { background: #1c1c1c; color: #fff; }