/*
 * Styles des cards produit Essentia (.product-card*).
 *
 * Extrait de essentia_render_product_cards_css(), qui réinjectait ces 24 Ko en
 * <style> inline dans CHAQUE page appelante (boutique, wishlist, PDP odor killer,
 * boutique pro, section diffuseurs de l'accueil). Servi comme fichier, il n'est
 * téléchargé qu'une fois puis mis en cache par le navigateur.
 *
 * Ne pas éditer en double : ce fichier est la seule source de ces règles.
 */

/* PRODUCT CARD */
.product-card { background: #fff; border: 1px solid var(--es-line); display: flex; flex-direction: column; transition: all 0.3s ease; position: relative; }
.product-card:hover { border-color: var(--es-cacao); box-shadow: 0 16px 36px rgba(124,102,80,0.12); transform: translateY(-3px); }
.product-card.is-filtered-out, .product-card.is-cat-filtered-out { display: none; }

/* MODE ÉCHANTILLONS · emphase visuelle 1 ml sur les CTAs */
body.is-cat-echantillons .product-card__price-from { display: none; }
body.is-cat-echantillons .product-card[data-category="parfum"] .size-option:not([data-size-slug="1ml"]) { display: none !important; }
body.is-cat-echantillons .product-card[data-category="parfum"] .product-card__sizes { grid-template-columns: 1fr !important; }
/* Mode échantillon PAR-CARD (wishlist) : applique le mode 1ml uniquement aux cards marquées is-echantillon, indépendamment du body class. */
.product-card.is-echantillon[data-category="parfum"] .size-option:not([data-size-slug="1ml"]) { display: none !important; }
.product-card.is-echantillon[data-category="parfum"] .product-card__sizes { grid-template-columns: 1fr !important; }
.product-card.is-echantillon .product-card__price-from { display: none; }
.product-card__img-wrap { position: relative; display: block; overflow: hidden; }
.product-card__img { display: block; width: 100%; aspect-ratio: 1/1; object-fit: cover; background: var(--es-bg-alt); transition: transform 0.6s ease; }
.product-card:hover .product-card__img { transform: scale(1.04); }
.product-card__badge { position: absolute; top: 12px; left: 12px; background: var(--es-bg-chip); color: var(--es-cacao); font-family: 'JetBrains Mono', monospace; font-size: 9px; letter-spacing: 0.14em; text-transform: uppercase; padding: 5px 10px; line-height: 1; z-index: 1; font-weight: 500; }
.product-card__wish { position: absolute; top: 10px; right: 10px; width: 36px; height: 36px; border-radius: 50%; background: rgba(255,255,255,0.95); display: flex; align-items: center; justify-content: center; color: var(--es-gray); border: 1px solid var(--es-line); z-index: 2; transition: all 0.2s; cursor: pointer; }
.product-card__wish:hover { color: var(--es-promo); border-color: var(--es-promo); }
.product-card__wish svg { width: 16px; height: 16px; fill: none !important; transition: none !important; }
.product-card__wish.is-active { color: var(--es-promo); }
.product-card__wish.is-active svg { fill: currentColor !important; }
.product-card__body { padding: 16px 16px 18px; display: flex; flex-direction: column; flex: 1; }
.product-card__collection { font-family: 'JetBrains Mono', monospace; font-size: 9px; letter-spacing: 0.08em; text-transform: uppercase; color: var(--es-gray); margin: 0 0 6px; font-weight: 400; }
.product-card .product-card__name { font-family: 'Fraunces', 'Times New Roman', serif; font-size: 19px; font-weight: 400; color: var(--es-ink); margin: 0 0 12px; line-height: 1.15; letter-spacing: -0.015em; font-variation-settings: "opsz" 144, "SOFT" 30; }
.product-card__name em { font-style: italic; }
.product-card__name a { text-decoration: none; color: inherit; transition: color 0.2s; }
@media (hover: hover) { .product-card__name a:hover { color: var(--es-cacao); } }
.product-card__mood { font-family: 'Fraunces', 'Times New Roman', serif; font-style: italic; font-size: 13px; color: var(--es-gray); line-height: 1.5; margin: 0 0 14px; }
.product-card__rating { display: flex; align-items: center; gap: 6px; margin: 0 0 16px; font-size: 12px; color: var(--es-gray); font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif; }
.product-card__stars { color: var(--es-star); letter-spacing: 1px; line-height: 1; font-size: 13px; }
.product-card__rating-num { color: var(--es-ink); font-weight: 500; }
.product-card__rating-count::before { content: '· '; }
.product-card__rating-count { color: var(--es-gray-2); }
.product-card__bottom { margin-top: auto; display: flex; flex-direction: column; gap: 10px; padding-top: 14px; }
.product-card__price { font-size: 14px; color: var(--es-gray); margin: 0; }
.product-card__price-from { font-family: 'JetBrains Mono', monospace; font-size: 9px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--es-gray); margin-right: 6px; }
.product-card__price-amount { font-family: 'Fraunces', 'Times New Roman', serif; font-size: 13px; font-weight: 500; color: var(--es-ink); }
.product-card__cta { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 14px 24px; background: var(--es-ink); color: #fff; font-family: 'Inter', sans-serif; font-size: 13px; font-weight: 500; letter-spacing: 0.01em; border: 1px solid var(--es-ink); transition: all 0.2s ease; white-space: nowrap; cursor: pointer; width: 100%; box-sizing: border-box; }
.product-card__cta:hover { background: #000; transform: translateY(-1px); box-shadow: 0 8px 24px rgba(0,0,0,0.18); }
.product-card__cta svg { width: 14px; height: 14px; }
.product-card__cta.is-added { background: var(--es-cacao,#7C6650); border-color: var(--es-cacao,#7C6650); }
@media (max-width: 520px) {
    .product-card__body { padding: 14px 14px 16px; }
    .product-card__name { font-size: 18px; }
    .product-card__mood { font-size: 12px; }
    .product-card__price-amount { font-size: 13px; }
    .product-card__cta { padding: 12px 16px; font-size: 12px; }
}

.product-card__wish,
.product-card__wish:focus,
.product-card__wish:active,
.product-card__wish:focus-visible { background: rgba(255,255,255,0.95) !important; outline: none !important; box-shadow: none !important; -webkit-tap-highlight-color: transparent !important; }

.product-card__sizes { display: grid; grid-template-columns: repeat(2, 1fr); gap: 6px; margin-bottom: 10px; }
/* Parfums + Spray Anti-Odeurs (packs) : cases en COLONNE VERTICALE pleine largeur (alignées comme les formules diffuseur) — label à gauche, prix à droite, badge « Économiser » en haut à droite (illisible en grille 2×2 où il se chevauchait). */
.product-card[data-category="parfum"] .product-card__sizes,
.product-card[data-category="odor-killer"] .product-card__sizes { grid-template-columns: 1fr; gap: 8px; }
.product-card__dd { position: relative; margin-bottom: 10px; }
.product-card .product-card__dd-trigger,
.product-card .product-card__dd-trigger:link,
.product-card .product-card__dd-trigger:visited,
.product-card .product-card__dd-trigger:hover,
.product-card .product-card__dd-trigger:focus,
.product-card .product-card__dd-trigger:focus-visible,
.product-card .product-card__dd-trigger:active {
    display: flex !important; width: 100% !important; align-items: center !important; justify-content: space-between !important; gap: 8px !important;
    padding: 11px 14px !important; height: auto !important; min-height: 0 !important;
    background: #fff !important; border: 1px solid var(--es-line) !important; border-radius: 0 !important;
    font-family: 'Inter', sans-serif !important; font-size: 12px !important; font-weight: 500 !important; font-style: normal !important;
    color: var(--es-ink) !important; text-transform: none !important; letter-spacing: 0 !important; text-decoration: none !important;
    cursor: pointer !important; outline: none !important; box-shadow: none !important; transform: none !important;
    -webkit-appearance: none !important; appearance: none !important; -webkit-tap-highlight-color: transparent !important;
}
.product-card .product-card__dd-trigger:hover,
.product-card .product-card__dd[data-open] .product-card__dd-trigger { border-color: var(--es-ink) !important; }
.product-card .product-card__dd-label { flex: 1 !important; text-align: left !important; white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; font-family: 'Inter', sans-serif !important; font-size: 12px !important; font-weight: 500 !important; font-style: normal !important; color: var(--es-ink) !important; letter-spacing: 0 !important; }
.product-card .product-card__dd-arrow { width: 14px !important; height: 14px !important; flex-shrink: 0 !important; transition: transform 0.2s ease; color: var(--es-ink) !important; }
.product-card .product-card__dd[data-open] .product-card__dd-arrow { transform: rotate(180deg); }
.product-card .product-card__dd-list {
    position: absolute !important; top: calc(100% + 0px) !important; left: 0 !important; right: 0 !important; z-index: 100 !important;
    background: #fff !important; border: 1px solid var(--es-line) !important; border-top: 0 !important;
    max-height: 280px; overflow-y: auto;
    list-style: none !important; padding: 2px 0 !important; margin: -1px 0 0 0 !important;
    box-shadow: 0 8px 24px rgba(0,0,0,0.08);
}
.product-card .product-card__dd-list[hidden] { display: none !important; }
.product-card .product-card__dd-option {
    display: grid !important; grid-template-columns: 14px 1fr auto !important; gap: 10px !important; align-items: center !important;
    padding: 9px 14px !important; min-height: 0 !important; height: auto !important;
    background: #fff !important; cursor: pointer !important; transition: background 0.15s !important;
    font-family: 'Inter', sans-serif !important; font-size: 13px !important; font-weight: 400 !important; font-style: normal !important;
    color: var(--es-ink) !important; text-transform: none !important; letter-spacing: 0 !important; line-height: 1.3 !important;
    outline: none !important; -webkit-tap-highlight-color: transparent !important;
}
.product-card .product-card__dd-num { margin-right: 4px !important; }
.product-card .product-card__dd-option .radio {
    width: 12px !important; height: 12px !important; border-radius: 50% !important;
    border: 1.5px solid var(--es-line) !important; background: #fff !important;
    flex-shrink: 0; position: relative; transition: all 0.2s;
}
.product-card .product-card__dd-option.is-selected .radio { border-color: var(--es-ink) !important; }
.product-card .product-card__dd-option.is-selected .radio::after { content: ''; position: absolute; inset: 2px; background: var(--es-ink); border-radius: 50%; }
.product-card .product-card__dd-option:hover,
.product-card .product-card__dd-option:focus { background: var(--es-bg-alt) !important; outline: none !important; }
.product-card .product-card__dd-option.is-selected { background: var(--es-bg-alt) !important; color: var(--es-cacao) !important; }
.product-card .product-card__dd-option.is-out { opacity: 0.55 !important; cursor: not-allowed !important; }
.product-card .product-card__dd-num { font-family: 'JetBrains Mono', monospace !important; font-size: 10px !important; font-weight: 400 !important; font-style: normal !important; color: var(--es-gray) !important; letter-spacing: 0.06em !important; text-align: left !important; }
.product-card .product-card__dd-name { font-family: 'Inter', sans-serif !important; font-size: 13px !important; font-weight: 500 !important; font-style: normal !important; color: var(--es-ink) !important; letter-spacing: 0 !important; }
.product-card .product-card__dd-price { font-family: 'Fraunces', 'Times New Roman', serif !important; font-size: 12px !important; font-weight: 500 !important; font-style: normal !important; color: var(--es-ink) !important; text-align: right !important; white-space: nowrap !important; letter-spacing: 0 !important; }
.product-card .product-card__dd-option:hover .product-card__dd-name,
.product-card .product-card__dd-option:hover .product-card__dd-price,
.product-card .product-card__dd-option.is-selected .product-card__dd-name,
.product-card .product-card__dd-option.is-selected .product-card__dd-price { color: var(--es-cacao) !important; }
.product-card .product-card__dd-option[data-size-slug="6-collections"] { grid-template-columns: 14px 1fr auto !important; border-top: 1px solid var(--es-line); margin-top: 4px; padding-top: 11px !important; }
/* Option de formule diffuseur (dropdown bundle) : radio | nom (gauche) | [badge éco + prix] (droite groupés) */
.product-card .product-card__dd-option--bundle { grid-template-columns: 14px 1fr auto !important; gap: 10px !important; }
.product-card .product-card__dd-pricecol { display: inline-flex !important; align-items: center !important; justify-content: flex-end !important; gap: 7px !important; }
.product-card .product-card__dd-badge { font-family: 'JetBrains Mono', monospace !important; font-size: 8px !important; font-weight: 500 !important; letter-spacing: 0.08em !important; text-transform: uppercase !important; color: var(--es-promo) !important; background: var(--es-bg-chip) !important; padding: 3px 7px !important; line-height: 1 !important; white-space: nowrap !important; }
.product-card .product-card__dd--bundle.product-card__dd--disabled { opacity: 0.5; pointer-events: none; }
/* LISTE VERTICALE de formules diffuseur, COMPACTE (flex 1 ligne, centrée) : radio · nom · prix ; badge éco À CHEVAL sur le coin */
.product-card .product-card__bundle { grid-template-columns: 1fr !important; gap: 10px !important; }
.product-card .product-card__bundle .size-option { display: flex !important; align-items: center !important; gap: 10px !important; padding: 12px 14px !important; min-height: 0 !important; overflow: visible !important; position: relative !important; }
.product-card .product-card__bundle .size-option .radio { flex: 0 0 14px !important; }
.product-card .product-card__bundle .size-option__label { flex: 1 1 auto !important; min-width: 0 !important; font-family: 'Inter', sans-serif !important; font-size: 11px !important; font-weight: 400 !important; color: var(--es-gray) !important; white-space: nowrap !important; letter-spacing: 0 !important; }
.product-card .product-card__bundle .size-option__pricecol { flex: 0 0 auto !important; margin-left: auto !important; display: inline-flex !important; align-items: center !important; }
.product-card .product-card__bundle .size-option__saving-badge { position: absolute !important; top: -7px !important; right: -5px !important; font-family: 'JetBrains Mono', monospace !important; font-size: 8px !important; font-weight: 500 !important; letter-spacing: 0.08em !important; text-transform: uppercase !important; color: var(--es-promo) !important; background: var(--es-bg-chip) !important; padding: 3px 7px !important; line-height: 1 !important; white-space: nowrap !important; z-index: 1 !important; }
.product-card .product-card__bundle .size-option__price { font-family: 'Fraunces', 'Times New Roman', serif !important; font-size: 13px !important; font-weight: 500 !important; color: var(--es-ink) !important; white-space: nowrap !important; }
/* Diffuseurs : resserrer l'espace AU-DESSUS des 4 cases (specs → cases) */
.product-card[data-category="diffuseur"] .product-card__mood { margin-bottom: 8px !important; }
.product-card[data-category="diffuseur"] .product-card__bottom { padding-top: 4px !important; }
.product-card .product-card__dd-option[data-size-slug="6-collections"] .product-card__dd-num { display: none !important; }
.product-card .size-option { position: relative; display: flex; align-items: center; gap: 8px; padding: 12px 14px; background: #fff; border: 1px solid var(--es-line); cursor: pointer; transition: border-color 0.2s, background 0.2s; overflow: visible; }
.product-card .size-option:hover:not(.size-option--out) { border-color: var(--es-ink); }
.product-card .size-option.is-selected { border-color: var(--es-ink); background: #fff; }
.product-card .size-option--out { opacity: 0.85; }
.product-card .size-option .radio { width: 14px !important; height: 14px !important; border-radius: 50%; border: 1.5px solid var(--es-line); background: #fff; flex-shrink: 0; position: relative; transition: all 0.2s; }
.product-card .size-option.is-selected .radio { border-color: var(--es-ink); }
.product-card .size-option.is-selected .radio::after { content: ''; position: absolute; inset: 2px; background: var(--es-ink); border-radius: 50%; }
.product-card .size-option__label { flex: 1 !important; min-width: 0 !important; font-family: inherit; font-size: 11px !important; font-weight: 400; color: var(--es-gray); letter-spacing: 0; white-space: nowrap; }
.product-card .size-option__price { font-family: 'Fraunces', 'Times New Roman', serif !important; font-size: 13px !important; font-weight: 500 !important; color: var(--es-ink) !important; flex-shrink: 0 !important; white-space: nowrap !important; letter-spacing: 0 !important; }
/* Prix + indicateur €/ml groupés serrés (5px) à droite ; €/ml discret gris — tailles en ml (huiles parfumées) */
.product-card .size-option__priceml { display: inline-flex; align-items: baseline; gap: 5px; flex-shrink: 0; }
.product-card .size-option__perml { font-family: 'JetBrains Mono', monospace; font-size: 9px; font-weight: 400; color: var(--es-gray-2); letter-spacing: 0; white-space: nowrap; }
.product-card .size-option__badge { position: absolute; top: -7px; right: -5px; font-family: 'JetBrains Mono', monospace; font-size: 8px; font-weight: 500; padding: 3px 7px; letter-spacing: 0.08em; text-transform: uppercase; line-height: 1; background: var(--es-bg-chip); color: var(--es-promo); white-space: nowrap; z-index: 1; }
.product-card .size-option__saving-badge { position: absolute; top: -7px; right: -5px; font-family: 'JetBrains Mono', monospace; font-size: 8px; font-weight: 500; padding: 3px 7px; letter-spacing: 0.08em; text-transform: uppercase; line-height: 1; background: var(--es-bg-chip); color: var(--es-promo); white-space: nowrap; z-index: 1; }
.product-card__bundle .size-option__saving-badge { padding: 3px 7px; letter-spacing: 0.08em; }
/* Indicateur de stock (apparaît au clic d'une taille) — même pattern que la PDP (.pdp-stock) */
.product-card__stock { display: flex; align-items: center; gap: 7px; margin: -2px 0 2px; font-family: 'JetBrains Mono', monospace; font-size: 9px; letter-spacing: 0.08em; text-transform: uppercase; line-height: 1; }
.product-card__stock[hidden] { display: none; }
.product-card__stock-dot { width: 6px; height: 6px; border-radius: 50%; flex-shrink: 0; background: var(--es-gray); }
.product-card__stock[data-status="ok"] .product-card__stock-dot { background: var(--es-success); }
.product-card__stock[data-status="ok"] .product-card__stock-label { color: var(--es-success); }
.product-card__stock[data-status="low"] .product-card__stock-dot { background: var(--es-promo); }
.product-card__stock[data-status="low"] .product-card__stock-label { color: var(--es-promo); }
.product-card__stock[data-status="out"] .product-card__stock-dot { background: var(--es-gray-2); }
.product-card__stock[data-status="out"] .product-card__stock-label { color: var(--es-gray-2); }

.product-card__qty-cart { display: flex; gap: 8px; margin-top: auto; flex-wrap: nowrap; align-items: stretch; }
.product-card .qty-picker { height: 44px !important; flex: 0 0 auto !important; }
.product-card .qty-picker button { width: 30px !important; font-size: 14px !important; flex-shrink: 0 !important; }
.product-card .qty-picker input { width: 26px !important; min-width: 26px !important; font-size: 12px !important; text-align: center !important; padding: 0 !important; flex-shrink: 0 !important; }
.product-card__cta-add { flex: 1 1 0 !important; min-width: 0 !important; height: 44px !important; padding: 0 14px !important; font-family: 'Inter', sans-serif !important; font-size: 13px !important; font-weight: 500 !important; background: var(--es-ink) !important; color: #fff !important; border: 1px solid var(--es-ink) !important; cursor: pointer !important; white-space: nowrap !important; transition: background 0.2s !important; letter-spacing: 0 !important; outline: none !important; text-decoration: none !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 0 !important; }
.product-card__cta-add:hover:not([disabled]) { background: #000 !important; }
.product-card__cta-add[disabled],
.product-card__cta-add[data-disabled="true"] { background: var(--es-gray-2) !important; border-color: var(--es-gray-2) !important; color: #fff !important; cursor: not-allowed !important; opacity: 1 !important; transform: none !important; box-shadow: none !important; }
.product-card__cta-add[disabled]:hover { background: var(--es-gray-2) !important; transform: none !important; }
.product-card__cta-add.is-added { background: var(--es-cacao,#7C6650) !important; border-color: var(--es-cacao,#7C6650) !important; opacity: 1 !important; cursor: default !important; color: #fff !important; }

.product-card__cta-simple { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 12px 18px; background: var(--es-ink); color: #fff; font-family: 'Inter', sans-serif; font-size: 13px; font-weight: 500; border: 1px solid var(--es-ink); cursor: pointer; width: 100%; outline: none; }
.product-card__cta-simple:hover { background: #000; }

/* Bouton « Prévenez-moi » (rupture) : compact 44px, cloche 16px (sinon SVG_BELL2 balonne). Copie du CSS boutique. */
.product-card__cta-notify { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 8px !important; width: 100% !important; padding: 12px 18px !important; height: 44px !important; min-height: 0 !important; font-family: 'Inter', sans-serif !important; font-size: 13px !important; font-weight: 500 !important; font-style: normal !important; line-height: 1 !important; margin-top: auto !important; cursor: pointer; }
.product-card__cta-notify svg { width: 16px !important; height: 16px !important; }
.product-card .btn.is-notify { background: var(--es-cacao) !important; border-color: var(--es-cacao) !important; color: #fff !important; }
.product-card .btn.is-notify:hover { background: var(--es-cacao-dark) !important; border-color: var(--es-cacao-dark) !important; box-shadow: 0 8px 24px rgba(124,102,80,0.3) !important; }

@media (max-width: 520px) {
    .product-card__sizes { gap: 5px !important; margin-bottom: 8px; }
    .product-card .size-option { padding: 8px 8px !important; gap: 6px !important; }
    .product-card .size-option__label { font-size: 11px !important; }
    .product-card .size-option__price { font-size: 11px !important; }
    .product-card .size-option .radio { width: 11px !important; height: 11px !important; }
    /* Cases bundle diffuseur : plein largeur en mobile → texte plus GRAND (lisible) */
    .product-card .product-card__bundle .size-option { padding: 9px 12px !important; }
    .product-card .product-card__bundle .size-option__label { font-size: 13px !important; }
    .product-card .product-card__bundle .size-option__price { font-size: 13px !important; }
    .product-card .qty-picker { height: 40px; }
    .product-card .qty-picker button { width: 28px; font-size: 14px; }
    .product-card .qty-picker input { width: 26px; font-size: 12px; }
    .product-card__cta-add { height: 40px; font-size: 12px; padding: 0 10px; }
}

/* Reveal animation : opacity seulement */
.product-card { opacity: 0; transition: opacity 0.5s ease, border-color 0.3s ease, box-shadow 0.3s ease; }
.product-card.is-visible { opacity: 1; }
.product-card.is-dd-open { z-index: 10; }
