/* ═══════════════════════════════════════════════════════════════════════
   lc_badges.css — Système de statut produit Leciselé
   ─────────────────────────────────────────────────────────────────────
   Principe : les photos ne sont jamais touchées.
   Sur les cartes, le statut est un label typographique pur — aucun fond,
   aucune bordure, aucun effet. Juste des lettres espacées, à peine là.
   Sur la fiche produit, le traitement peut être plus affirmé.
   ─────────────────────────────────────────────────────────────────────
   Inspirations : Hermès, Berluti, Goyard, Loro Piana.
═══════════════════════════════════════════════════════════════════════ */

/* ───────────────────────────────────────────────────────────────────────
   CODE COULEUR DES SCEAUX — source unique de vérité.
   Chaque statut = une matière de la Maison, distincte et intentionnelle.
   Tous les contextes (cartes, coin photo, fiche produit) consomment ces
   variables : on n'écrit la couleur qu'une fois.
   ─────────────────────────────────────────────────────────────────────
     unique  → Or jaune        — la pièce unique, l'apex, le métal le plus noble
     limited → Platine/argent  — la série numérotée, précieuse mais plurielle
     bespoke → Cuivre sanguine — le sur-mesure : chaud, façonné main (tire au rouge)
     archive → Sépia patiné    — la pièce confiée : mémoire, trace (italique)
     private → Étain fumé      — sur invitation : exclusivité discrète, en retrait
   ─────────────────────────────────────────────────────────────────────── */
:root {
    --lc-badge-unique:  #CBA75D;
    --lc-badge-limited: #C3C8C5;
    --lc-badge-bespoke: #C2846A;
    --lc-badge-archive: #A38B66;
    --lc-badge-private: #97948B;
}

/* ── Les cartes ont besoin de position:relative pour le monogramme ── */
.product-card,
.premium-card,
.wishlist-card {
    position: relative;
}

/* ── Conteneur par défaut — flux statique ─────────────────────────── */
.lc-badges {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
    pointer-events: none;
}

.lc-badges .lc-badge {
    pointer-events: auto;
    /* ⚠ Anti-collision de nommage : nav.css définit un `.lc-badge` GLOBAL
       (la pastille de comptage panier/wishlist) en `position:absolute;
       top:4px;right:4px`. Nos sceaux produit réutilisent la classe `.lc-badge`
       et héritaient donc de cet absolu → ils s'envolaient dans le coin
       haut-droit (derrière la navbar sur la fiche, sur le coin des cartes).
       La pastille panier est un <span> NU (hors conteneur `.lc-badges`), donc
       on neutralise l'absolu uniquement DANS un conteneur `.lc-badges` :
       le placement reste piloté par le conteneur, jamais par le badge. */
    position: static;
}

/* ── RÈGLE FONDAMENTALE : aucun badge ne s'overlay sur une photo ──── */
/* Le seul élément autorisé dans un conteneur image est le badge      */
/* "Sale" (placement inline `top:auto;bottom:14px`). Tout badge        */
/* primaire de statut est masqué s'il se retrouve sur la photo.        */
.product-image .lc-badges,
.product-img-wrap .lc-badges,
.wishlist-image .lc-badges,
.premium-image .lc-badges {
    position: absolute;
    bottom: 14px;
    left: 14px;
    top: auto;
    z-index: 4;
}

/* Garde-fou : un badge primaire (status) glissé par erreur dans la    */
/* zone image n'est jamais affiché — il doit vivre sous le nom.        */
.product-image .lc-badge--primary,
.product-img-wrap .lc-badge--primary,
.wishlist-image .lc-badge--primary,
.premium-image .lc-badge--primary {
    display: none !important;
}

/* ──────────────────────────────────────────────────────────────────────
   PLACEMENT « CORNER » — sceau primaire en pastille verre dépoli,
   coin supérieur droit de la photo. Opt-in STRICT via `lc-badges--corner`.
   ─────────────────────────────────────────────────────────────────────
   Déroge sciemment à la RÈGLE FONDAMENTALE ci-dessus : la dérogation est
   confinée au seul conteneur portant ce modificateur — partout ailleurs le
   garde-fou reste actif. Le label garde son `data-i18n` (traduction intacte).
   ────────────────────────────────────────────────────────────────────── */
.product-image .lc-badges--corner,
.product-img-wrap .lc-badges--corner,
.wishlist-image .lc-badges--corner,
.premium-image .lc-badges--corner,
.sm-card-media .lc-badges--corner {
    position: absolute;
    top: 14px;
    right: 14px;
    bottom: auto;
    left: auto;
    flex-direction: column;
    align-items: flex-end;
    gap: 6px;
    z-index: 5;            /* sous la pastille panier globale, au-dessus de la photo */
    pointer-events: none;  /* le clic traverse vers la carte ; tooltip via le badge */
}

/* Lève le garde-fou — ici, et seulement ici, le sceau primaire DOIT paraître. */
.product-image .lc-badges--corner .lc-badge--primary,
.product-img-wrap .lc-badges--corner .lc-badge--primary,
.wishlist-image .lc-badges--corner .lc-badge--primary,
.premium-image .lc-badges--corner .lc-badge--primary,
.sm-card-media .lc-badges--corner .lc-badge--primary {
    display: inline-flex !important;
}

/* Label typographique nu — strictement le style des cartes (aucune boîte,
   aucun fond, aucune bordure). Seul ajout : une ombre portée discrète, qui
   garantit la lisibilité sur les photos claires sans introduire de cadre. */
.lc-badges--corner .lc-badge {
    pointer-events: auto;
    display: inline-flex;
    align-items: center;
    gap: 0.65em;
    background: none;
    border: none;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    padding: 0;
    border-radius: 0;
    font-family: 'Cormorant Garamond', 'Cormorant', Georgia, serif;
    font-size: 0.62rem;
    font-weight: 500;
    letter-spacing: 0.32em;
    text-transform: uppercase;
    line-height: 1.5;
    white-space: nowrap;
    text-shadow: 0 1px 7px rgba(0, 0, 0, 0.60), 0 0 2px rgba(0, 0, 0, 0.55);
}

/* Teintes par statut — code couleur unique (cf. :root). */
.lc-badges--corner .lc-badge--unique  { color: var(--lc-badge-unique); }
.lc-badges--corner .lc-badge--limited { color: var(--lc-badge-limited); }
.lc-badges--corner .lc-badge--bespoke { color: var(--lc-badge-bespoke); }
.lc-badges--corner .lc-badge--archive {
    color: var(--lc-badge-archive);
    font-style: italic;
    letter-spacing: 0.26em;
}
.lc-badges--corner .lc-badge--private { color: var(--lc-badge-private); }

/* ──────────────────────────────────────────────────────────────────────
   CARTES PRODUIT — label typographique pur, filet horizontal Maison
   Sélecteurs ciblés : .product-card > .product-info (home/category),
   .card-body (search), .wishlist-info (wishlist).
   N'affecte PAS .product-header (fiche produit).
   ────────────────────────────────────────────────────────────────────── */
.product-card .product-info .lc-badges,
.card-body .lc-badges,
.card-info .lc-badges,
.wishlist-info .lc-badges {
    position: static;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin: 0.15rem 0 0.7rem;
    pointer-events: auto;
}

/* Badge dans une carte : texte nu précédé d'un filet horizontal fin */
.product-card .product-info .lc-badge,
.card-body .lc-badge,
.card-info .lc-badge,
.wishlist-info .lc-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.65em;
    background: none;
    border: none;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    padding: 0;
    border-radius: 0;
    font-family: 'Cormorant Garamond', 'Cormorant', Georgia, serif;
    font-size: 0.62rem;
    font-weight: 500;
    letter-spacing: 0.32em;
    text-transform: uppercase;
    line-height: 1.5;
    white-space: nowrap;
}

/* Couleurs statut dans les cartes — code couleur unique (cf. :root) */
.product-card .product-info .lc-badge--unique,
.card-body .lc-badge--unique,
.wishlist-info .lc-badge--unique    { color: var(--lc-badge-unique); }

.product-card .product-info .lc-badge--limited,
.card-body .lc-badge--limited,
.wishlist-info .lc-badge--limited   { color: var(--lc-badge-limited); }

.product-card .product-info .lc-badge--archive,
.card-body .lc-badge--archive,
.wishlist-info .lc-badge--archive   {
    color: var(--lc-badge-archive);
    font-style: italic;
    letter-spacing: 0.26em;
}

.product-card .product-info .lc-badge--bespoke,
.card-body .lc-badge--bespoke,
.wishlist-info .lc-badge--bespoke   { color: var(--lc-badge-bespoke); }

.product-card .product-info .lc-badge--private,
.card-body .lc-badge--private,
.wishlist-info .lc-badge--private   { color: var(--lc-badge-private); }

/* ──────────────────────────────────────────────────────────────────────
   FICHE PRODUIT — badge dans .product-header / .product-info (detail)
   Traitement plus affirmé, mais toujours sans pill agressif.
   ────────────────────────────────────────────────────────────────────── */
.product-header .lc-badges {
    position: static;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 0.75rem;
    pointer-events: auto;
}

.product-header .lc-badge {
    display: inline-flex;
    align-items: center;
    padding: 5px 13px;
    border-radius: 2px;
    font-family: 'Cormorant Garamond', 'Cormorant', Georgia, serif;
    font-size: 0.68rem;
    font-weight: 500;
    letter-spacing: 0.20em;
    text-transform: uppercase;
    line-height: 1;
    white-space: nowrap;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

/* Variantes fiche produit — même code couleur (cf. :root), traitement pill.
   Bordure dérivée de la teinte du statut ; repli rgba avant color-mix. */
.product-header .lc-badge--unique {
    background: rgba(244, 239, 230, 0.10);
    color: var(--lc-badge-unique);
    border: 1px solid rgba(203, 167, 93, 0.55);
    border-color: color-mix(in srgb, var(--lc-badge-unique) 55%, transparent);
}
.product-header .lc-badge--limited {
    background: transparent;
    color: var(--lc-badge-limited);
    border: 1px solid rgba(195, 200, 197, 0.45);
    border-color: color-mix(in srgb, var(--lc-badge-limited) 45%, transparent);
}
.product-header .lc-badge--archive {
    background: transparent;
    color: var(--lc-badge-archive);
    border: 1px solid rgba(163, 139, 102, 0.35);
    border-color: color-mix(in srgb, var(--lc-badge-archive) 35%, transparent);
    font-style: italic;
}
.product-header .lc-badge--bespoke {
    background: transparent;
    color: var(--lc-badge-bespoke);
    border: 1px solid rgba(194, 132, 106, 0.45);
    border-color: color-mix(in srgb, var(--lc-badge-bespoke) 45%, transparent);
}
.product-header .lc-badge--private {
    background: transparent;
    color: var(--lc-badge-private);
    border: 1px solid rgba(151, 148, 139, 0.40);
    border-color: color-mix(in srgb, var(--lc-badge-private) 40%, transparent);
}

/* ──────────────────────────────────────────────────────────────────────
   Signature (is_signature) — traitement visuel uniquement
   Fine ligne dorée côté gauche + monogramme ℒ watermark sur la photo.
   ────────────────────────────────────────────────────────────────────── */
.product-card.is-signature,
.premium-card.is-signature {
    border-left: 2px solid rgba(184, 152, 90, 0.45);
}

.product-card.is-signature .product-image::after,
.premium-card.is-signature .product-image::after {
    content: '\2112';
    position: absolute;
    top: 12px;
    left: 12px;
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-style: italic;
    font-size: 1.25rem;
    color: rgba(184, 152, 90, 0.55);
    z-index: 2;
    pointer-events: none;
    line-height: 1;
}

/* ──────────────────────────────────────────────────────────────────────
   Archive — désaturation de l'image, curseur adapté
   ────────────────────────────────────────────────────────────────────── */
.product-card.is-archive img,
.premium-card.is-archive img,
.wishlist-card.is-archive img {
    filter: saturate(0.70) brightness(0.94);
    transition: filter .55s ease;
}

.product-card.is-archive:hover img,
.premium-card.is-archive:hover img,
.wishlist-card.is-archive:hover img {
    filter: saturate(0.92) brightness(1);
}

/* ──────────────────────────────────────────────────────────────────────
   Bandeau narratif "Confiée" — fiche produit uniquement
   ────────────────────────────────────────────────────────────────────── */
.lc-archive-band {
    margin: 1.5rem 0;
    padding: 1.5rem 1.75rem;
    background: linear-gradient(135deg,
        rgba(92, 72, 55, 0.06) 0%,
        rgba(92, 72, 55, 0.02) 100%);
    border-left: 2px solid rgba(184, 152, 90, 0.55);
    border-radius: 4px;
}

.lc-archive-band__eyebrow {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-size: 0.68rem;
    font-style: italic;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: #B8985A;
    margin: 0 0 0.6rem;
    opacity: 0.9;
}

.lc-archive-band__title {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-size: 1.25rem;
    font-style: italic;
    color: #6B563E;
    margin: 0 0 0.5rem 0;
    letter-spacing: 0.02em;
}

.lc-archive-band__text {
    font-family: 'Montserrat', sans-serif;
    font-size: 0.88rem;
    line-height: 1.65;
    color: #4A4A4A;
    margin: 0 0 1.2rem 0;
}

.lc-archive-band__cta {
    display: inline-flex;
    align-items: center;
    gap: 0.6rem;
    background: #1A1A1A;
    color: #F4EFE6;
    padding: 0.85rem 1.8rem;
    border: 1px solid #B8985A;
    border-radius: 2px;
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-size: 0.78rem;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    text-decoration: none;
    transition: background .3s ease, color .3s ease;
}

.lc-archive-band__cta:hover {
    background: #B8985A;
    color: #0E0E0E;
}

/* ── Stock résiduel — Édition numérotée (fiche produit) ─────────────── */
.lc-edition-stock {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    font-family: 'Montserrat', sans-serif;
    font-size: 0.72rem;
    color: rgba(212, 178, 106, 0.85);
    letter-spacing: 0.06em;
    margin-top: 0.35rem;
}

.lc-edition-stock__dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #D4B26A;
    flex-shrink: 0;
}

.lc-edition-stock--last .lc-edition-stock__dot {
    background: #C6623A;
}

.lc-edition-stock--last {
    color: rgba(198, 98, 58, 0.9);
}

/* ──────────────────────────────────────────────────────────────────────
   Mobile
   ────────────────────────────────────────────────────────────────────── */
@media (max-width: 768px) {
    .product-card .product-info .lc-badge,
    .card-body .lc-badge,
    .wishlist-info .lc-badge {
        font-size: 0.56rem;
        letter-spacing: 0.24em;
    }
    /* Pastille « corner » sur photo — légèrement resserrée en mobile */
    .product-image .lc-badges--corner,
    .product-img-wrap .lc-badges--corner,
    .wishlist-image .lc-badges--corner,
    .premium-image .lc-badges--corner,
    .sm-card-media .lc-badges--corner {
        top: 10px;
        right: 10px;
    }
    .lc-badges--corner .lc-badge {
        font-size: 0.56rem;
        letter-spacing: 0.24em;
    }
    /* Fiche produit mobile : badge bien lisible */
    .product-header .lc-badges {
        margin-bottom: 0.65rem;
    }
    .product-header .lc-badge {
        font-size: 0.64rem;
        letter-spacing: 0.18em;
        padding: 5px 12px;
    }
}

/* Tactile : aucun hover → les tooltips des sceaux n'existent pas, mais leur
   pointer-events:auto créait une zone morte au-dessus du lien de carte
   (.product-card-link, stretched link). On restaure l'intention d'origine
   (« le clic traverse vers la carte ») pour que TOUTE la vignette navigue au
   tap. Desktop (hover fin) inchangé : les tooltips restent actifs. */
@media (hover: none) {
    .lc-badges .lc-badge,
    .lc-badges--corner .lc-badge {
        pointer-events: none;
    }
}