/* ════════════════════════════════════════════════════════════════════
   Espace vendeur · interface 2026 (complète hm.css)
   Préfixe hm-vd-* ; aucune règle ici ne modifie les composants partagés.
   ════════════════════════════════════════════════════════════════════ */

/* ── En-tête d'espace et onglets ─────────────────────────────────── */
.hm-bandeau--vendeur { padding-bottom: 69px; }
.hm-bandeau--vendeur h1 { font-size: clamp(1.955rem, 1.38rem + 1.84vw, 2.702rem); }
.hm-bandeau--vendeur p strong { color: #fff; font-weight: 600; }
.hm-onglets--vendeur { margin-top: 6.9px; margin-bottom: 0; }
.hm-onglets--vendeur a { min-height: 55px; }
.hm-onglets--vendeur i { font-size: 15px; opacity: .75; }
.hm-onglets--vendeur [aria-current="page"] i { color: var(--cuivre-texte); opacity: 1; }

/* ── Mise en page commune ────────────────────────────────────────── */
.hm-vd { display: flex; flex-direction: column; gap: 32px; padding-top: 27.5px; }
.hm-vd-section { display: flex; flex-direction: column; gap: 16px; }
.hm-vd-section__tete { align-items: center; }
.hm-vd-titre { font-weight: 800; font-size: 1.552rem; letter-spacing: -.015em; }
.hm-vd-periode { margin: 0; padding: 2px; }
.hm-vd-periode .hm-puce { height: 43.5px; font-size: 16px; }
.hm-vd-alerte { align-items: center; flex-wrap: wrap; }
.hm-vd-alerte .hm-btn { margin-left: auto; }
.hm-vd-alerte .hm-alerte__texte { min-width: 230px; }

/* Tuile « solde disponible » : mise en avant malachite */
.hm-vd-solde-tuile { border-color: var(--succes-bord); background: linear-gradient(0deg, var(--succes-fond), var(--succes-fond)), var(--surface); }
.hm-vd-solde-tuile .hm-stat__valeur { color: var(--succes-texte); }
.hm-vd-solde-tuile .hm-stat__label i { color: var(--malachite); }
.hm-vd-solde-tuile .hm-lien { font-size: 15.5px; }

/* ── Activité ────────────────────────────────────────────────────── */
.hm-vd-activite { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 18.5px; }
.hm-vd-activite .hm-panneau__tete { margin-bottom: 14px; }
.hm-vd-activite .hm-panneau__tete h2 { font-size: 19.5px; }
.hm-vd-compteurs { display: flex; gap: 37px; flex-wrap: wrap; }
.hm-vd-compteurs > div { display: flex; flex-direction: column; gap: 2px; font-size: 16px; }
.hm-vd-compteur { font: 800 34.5px/1.1 var(--f-titre); letter-spacing: -.02em; }
.hm-vd-compteur--attente { color: var(--ambre); }
.hm-vd-compteur--succes { color: var(--malachite); }
.hm-vd-top { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 9.2px; }
.hm-vd-top li { display: flex; align-items: center; gap: 11.5px; font-size: 16.5px; min-width: 0; }
.hm-vd-top__rang {
    flex-shrink: 0; width: 27.5px; height: 27.5px; border-radius: 50%; display: grid; place-items: center;
    background: var(--surface-3); color: var(--encre-2); font: 700 14px var(--f-texte);
}
.hm-vd-top__rang--premier { background: var(--cuivre); color: var(--nuit); }
.hm-vd-top__nom { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.hm-vd-top__qte { flex-shrink: 0; color: var(--muet); }
.hm-vd-top__ca { flex-shrink: 0; font: 700 17px var(--f-titre); color: var(--malachite); }

/* ── Cartes « mes boutiques » ────────────────────────────────────── */
.hm-vd-boutiques { display: grid; grid-template-columns: repeat(auto-fill, minmax(345px, 1fr)); gap: 18.5px; }
.hm-vd-boutique {
    --lc: var(--ligne-forte);
    display: flex; flex-direction: column; gap: 16px; padding: 20.5px;
    background: var(--surface); border: 1px solid var(--ligne); border-top: 4.6px solid var(--lc); border-radius: 23px;
}
.hm-vd-boutique--standard { --lc: #2563eb; }
.hm-vd-boutique--verifiee { --lc: #7c3aed; }
.hm-vd-boutique--pro { --lc: #d97706; }
.hm-vd-boutique__tete { display: flex; align-items: center; gap: 16px; min-width: 0; }
.hm-vd-boutique__logo { width: 66.5px; height: 66.5px; border-radius: 18.5px; object-fit: cover; flex-shrink: 0; background: #fff; border: 1px solid var(--ligne); }
.hm-vd-boutique__titre { min-width: 0; display: flex; flex-direction: column; gap: 6.9px; }
.hm-vd-boutique__titre h3 { font-size: 20.5px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hm-vd-boutique__titre .hm-rangee { gap: 6.9px; }
.hm-vd-certifiee { display: inline-flex; align-items: center; gap: 5.8px; font-size: 14px; font-weight: 600; color: var(--malachite); }
.hm-vd-badge-live {
    display: inline-flex; align-items: center; gap: 6.9px; padding: 4.6px 10.5px; border-radius: 999px;
    background: #c8243b; color: #fff; font-size: 13px; font-weight: 700; line-height: 1;
}
.hm-vd-point-live { width: 9.2px; height: 9.2px; border-radius: 50%; background: #ff4d4f; box-shadow: 0 0 0 3.4px rgba(255, 77, 79, .25); flex-shrink: 0; }
.hm-vd-badge-live .hm-vd-point-live { background: #fff; box-shadow: none; }
@media (prefers-reduced-motion: no-preference) {
    .hm-vd-point-live { animation: hm-vd-pulse 1.4s ease-in-out infinite; }
    @keyframes hm-vd-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
}
.hm-vd-boutique__etat { margin: 0; }
.hm-vd-mini { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 9.2px; margin: 0; }
.hm-vd-mini div { background: var(--surface-2); border: 1px solid var(--ligne); border-radius: 14px; padding: 11.5px; text-align: center; }
.hm-vd-mini dt { font-size: 14.5px; color: var(--muet); }
.hm-vd-mini dd { margin: 2px 0 0; font: 800 23px/1.2 var(--f-titre); }
.hm-vd-mini__niveau { font-size: 17px !important; line-height: 1.6 !important; color: var(--lc); }
.hm-vd-boutique--simple .hm-vd-mini__niveau { color: var(--muet); }
.theme--dark .hm-vd-mini__niveau { color: var(--encre); }
.hm-vd-boutique__alerte { margin: 0; display: flex; gap: 9.2px; align-items: flex-start; padding: 11.5px 14px; border-radius: 14px; background: var(--erreur-fond); color: var(--erreur-texte); font-size: 16px; }
.hm-vd-boutique__alerte i { margin-top: 3.4px; }
.hm-vd-boutique__actions { display: flex; flex-wrap: wrap; gap: 9.2px; margin-top: auto; }
.hm-vd-boutique__actions .hm-btn { flex: 1 1 auto; min-width: 110.5px; }
.hm-vd-btn-verifiee { background: #7c3aed; border-color: #7c3aed; color: #fff; }
.hm-vd-btn-verifiee:hover { background: #6d28d9; border-color: #6d28d9; }
.hm-vd-btn-pro { background: #b45309; border-color: #b45309; color: #fff; }
.hm-vd-btn-pro:hover { background: #92400e; border-color: #92400e; }

/* ── Tableaux qui deviennent des cartes sur téléphone ─────────────── */
.hm-vd-table-outils { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
.hm-vd-recherche { position: relative; flex: 1; max-width: 552px; }
.hm-vd-recherche > i { position: absolute; left: 17px; top: 50%; transform: translateY(-50%); color: var(--muet); pointer-events: none; }
.hm-vd-recherche input {
    width: 100%; height: 55px; padding: 0 53px 0 48.5px; border-radius: 999px;
    border: 1.5px solid var(--ligne-forte); background: var(--surface); color: var(--encre); font-size: 17px;
}
.hm-vd-recherche input:focus { outline: none; border-color: var(--nuit); box-shadow: 0 0 0 3.4px rgba(31, 91, 216, .18); }
.theme--dark .hm-vd-recherche input:focus { border-color: var(--cuivre); box-shadow: 0 0 0 3.4px rgba(254, 153, 0, .2); }
.hm-vd-recherche__effacer {
    position: absolute; right: 6.9px; top: 50%; transform: translateY(-50%);
    width: 41.5px; height: 41.5px; border-radius: 50%; display: grid; place-items: center; cursor: pointer; color: var(--muet);
}
.hm-vd-recherche__effacer:hover { background: var(--surface-2); color: var(--encre); }
.hm-vd-recherche__info { font-size: 15.5px; color: var(--muet); min-height: 23px; margin-top: 6.9px; }
.hm-vd-produit { display: flex; align-items: center; gap: 14px; min-width: 0; }
.hm-vd-produit img, .hm-vd-produit__sans { width: 60px; height: 60px; border-radius: 11.5px; object-fit: cover; flex-shrink: 0; background: var(--surface-2); }
.hm-vd-produit__sans { display: grid; place-items: center; color: var(--ligne-forte); font-size: 20.5px; }
.hm-vd-produit strong { display: block; font-weight: 600; line-height: 1.3; }
.hm-vd-produit small { display: block; color: var(--muet); font-size: 14.5px; }
.hm-vd-actions-ligne { display: flex; gap: 9.2px; align-items: center; }
.hm-vd-actions-ligne form { margin: 0; }
.hm-vd-montant { font: 700 18px var(--f-titre); white-space: nowrap; }
.hm-vd-ref { font: 600 14.5px ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; color: var(--encre-2); white-space: nowrap; }
.hm-vd-date { color: var(--muet); white-space: nowrap; font-size: 15.5px; }
.hm-vd-note-ligne { display: block; font-size: 14.5px; color: var(--muet); margin-top: 4.6px; max-width: 32ch; }
.hm-vd-note-ligne--erreur { color: var(--erreur-texte); }

@media (max-width: 767px) {
    .hm-table--cartes { border: 0; background: none; border-radius: 0; overflow: visible; }
    .hm-table--cartes table, .hm-table--cartes tbody { display: block; }
    .hm-table--cartes thead { display: none; }
    .hm-table--cartes tr {
        display: grid; grid-template-columns: 1fr auto; gap: 6.9px 14px; align-items: center;
        padding: 16px; margin-bottom: 11.5px; border: 1px solid var(--ligne); border-radius: 18.5px; background: var(--surface);
    }
    .hm-table--cartes tbody tr:hover { background: var(--surface); }
    .hm-table--cartes td { display: flex; align-items: center; justify-content: space-between; gap: 11.5px; padding: 0; border: 0; grid-column: 1 / -1; font-size: 16px; min-width: 0; }
    .hm-table--cartes td[data-label]::before { content: attr(data-label); color: var(--muet); font-size: 15px; font-weight: 500; flex-shrink: 0; }
    .hm-table--cartes td.hm-vd-cellule-titre { padding-bottom: 6.9px; margin-bottom: 2px; border-bottom: 1px solid var(--ligne); }
    .hm-table--cartes td.hm-vd-cellule-titre::before { display: none; }
    .hm-table--cartes td.hm-vd-cellule-actions { justify-content: flex-end; padding-top: 4.6px; }
    .hm-table--cartes td.hm-vd-cellule-actions::before { display: none; }
    .hm-vd-activite { grid-template-columns: 1fr; }
    .hm-vd-boutiques { grid-template-columns: 1fr; }
    .hm-vd-alerte .hm-btn { margin-left: 0; width: 100%; }
    .hm-bandeau--vendeur { padding-bottom: 53px; }
    .hm-bandeau--vendeur .hm-bandeau__actions { width: 100%; }
    .hm-bandeau--vendeur .hm-bandeau__actions .hm-btn { flex: 1 1 auto; }
    .hm-vd { gap: 25.5px; padding-top: 20.5px; }
    .hm-vd-titre { font-size: 1.38rem; }
}

/* ── Formulaires en blocs (produit, boutique, vérification) ────────── */
.hm-vd-formulaire { gap: 18.5px; }
fieldset.hm-vd-bloc { margin: 0; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.hm-vd-bloc__titre {
    float: left; width: 100%; padding: 0; margin: 0 0 4.6px;
    display: flex; align-items: center; gap: 11.5px;
    font: 700 20.5px/1.3 var(--f-titre); letter-spacing: -.01em; color: var(--encre);
}
.hm-vd-bloc__titre i { color: var(--cuivre); font-size: .9em; }
.hm-vd-bloc__titre + * { clear: both; }
.hm-vd-bloc .hm-aide { margin: 0; }
.hm-vd-cases { flex-direction: row !important; flex-wrap: wrap; gap: 14px 32px !important; }
.hm-vd-cases .hm-case { align-items: center; min-height: 46px; }
.hm-vd-cases .hm-case i { color: var(--muet); margin-right: 4.6px; }
.hm-vd-formulaire__actions { justify-content: flex-end; padding-top: 4.6px; }
.hm .form__file-label small { display: block; margin-top: 2px; font-size: 14.5px; }
.hm .form__file-label span { display: block; }
.hm-vd-photo-principale { display: flex; align-items: stretch; gap: 16px; }
.hm-vd-photo-principale .form__file-upload { flex: 1; min-width: 0; }
.hm-vd-photo-principale__actuelle { width: 110.5px; height: 110.5px; border-radius: 16px; object-fit: cover; border: 1px solid var(--ligne); flex-shrink: 0; }

/* Variantes */
.hm-vd-variantes { display: flex; flex-direction: column; gap: 9.2px; }
.hm-vd-variantes__entete, .hm-vd-variante {
    display: grid; gap: 9.2px; align-items: center;
    grid-template-columns: 1.3fr .9fr .75fr .85fr 1.05fr 1.5fr 46px;
}
.hm-vd-variantes__entete { font-size: 14.5px; font-weight: 600; color: var(--muet); padding: 0 2px; }
.hm-vd-variantes:not(:has(.hm-vd-variante)) .hm-vd-variantes__entete { display: none; }
#variants-container { display: flex; flex-direction: column; gap: 9.2px; }
.hm-vd-variante input[type="text"], .hm-vd-variante input[type="number"] {
    width: 100%; min-width: 0; min-height: 48.5px; padding: 9.2px 11.5px; border-radius: 11.5px;
    border: 1.5px solid var(--ligne-forte); background: var(--surface); color: var(--encre); font-size: 17px;
}
.hm-vd-variante input:focus { outline: none; border-color: var(--nuit); box-shadow: 0 0 0 3.4px rgba(31, 91, 216, .18); }
.theme--dark .hm-vd-variante input:focus { border-color: var(--cuivre); box-shadow: 0 0 0 3.4px rgba(254, 153, 0, .2); }
.hm-vd-variante__image { display: flex; align-items: center; gap: 9.2px; min-width: 0; }
.hm-vd-variante__image img { width: 46px; height: 46px; border-radius: 9.2px; object-fit: cover; border: 1px solid var(--ligne); flex-shrink: 0; }
.hm-vd-variante__suppr {
    width: 46px; height: 46px; border-radius: 11.5px; border: 0; background: none;
    color: var(--rouge); font-size: 20.5px; display: grid; place-items: center;
}
.hm-vd-variante__suppr:hover { background: var(--erreur-fond); }

/* Champs fichier natifs (variantes, vérification) */
.hm-vd input[type="file"]:not(.form__file-input) {
    width: 100%; min-width: 0; font-size: 15.5px; color: var(--muet);
}
.hm-vd input[type="file"]:not(.form__file-input)::file-selector-button {
    margin-right: 11.5px; padding: 9.2px 14px; border-radius: 11.5px; cursor: pointer;
    border: 1px solid var(--ligne-forte); background: var(--surface-2); color: var(--encre); font: 600 15.5px var(--f-texte);
}
.hm-vd input[type="file"]:not(.form__file-input)::file-selector-button:hover { border-color: var(--encre-2); }
.hm-vd-fichier { padding: 11.5px 14px; border: 1.5px dashed var(--ligne-forte); border-radius: 14px; background: var(--surface-2); }

/* Gestionnaire du carrousel de photos (JS : .img-manager__*) */
.img-manager { display: flex; flex-direction: column; gap: 14px; padding-top: 16px; border-top: 1px solid var(--ligne); }
.img-manager__title { display: flex; flex-direction: column; gap: 2px; }
.img-manager__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(110.5px, 1fr)); gap: 11.5px; }
.img-manager__grid > p { grid-column: 1 / -1; margin: 0; }
.img-manager__item {
    position: relative; aspect-ratio: 1; border-radius: 14px; overflow: hidden; cursor: grab;
    border: 1px solid var(--ligne); background: var(--surface-2);
}
.img-manager__item:active { cursor: grabbing; }
.img-manager__item img { width: 100%; height: 100%; object-fit: cover; display: block; pointer-events: none; }
.img-manager__order-badge {
    position: absolute; left: 6.9px; top: 6.9px; min-width: 25.5px; height: 25.5px; padding: 0 6.9px; border-radius: 12.5px;
    background: var(--nuit); color: #fff; font: 700 14px/25.5px var(--f-texte); text-align: center;
}
.img-manager__delete {
    position: absolute; right: 6.9px; top: 6.9px; width: 37px; height: 37px; border-radius: 50%; border: 0;
    display: grid; place-items: center; background: rgba(3, 12, 36, .7); color: #fff; font-size: 15px;
}
.img-manager__delete:hover { background: #c8243b; }
.img-manager__upload-zone { position: relative; }
.img-manager__quota { font-size: 15.5px; color: var(--muet); }
.img-manager__piste { height: 6.9px; border-radius: 3.4px; background: var(--surface-3); overflow: hidden; margin-bottom: 4.6px; }
.img-manager__barre { height: 100%; background: var(--cuivre); transition: width .3s; }

@media (max-width: 767px) {
    .hm-vd-variantes__entete { display: none; }
    .hm-vd-variante {
        grid-template-columns: 1fr 1fr; padding: 14px; border: 1px solid var(--ligne); border-radius: 16px; background: var(--surface-2);
    }
    .hm-vd-variante input[name="variant_prix_abs[]"] { grid-column: 1 / -1; }
    .hm-vd-variante__image { grid-column: 1; }
    .hm-vd-variante__suppr { grid-column: 2; justify-self: end; }
    .hm-vd-formulaire__actions { flex-direction: column-reverse; align-items: stretch; }
    .hm-vd-formulaire__actions .hm-btn { width: 100%; }
    .hm-vd-photo-principale { flex-direction: column; }
}

/* ── Revenus ─────────────────────────────────────────────────────── */
.hm-vd-revenus { display: flex; flex-direction: column; gap: 16px; }
.hm-vd-revenus > .hm-panneau__tete { margin-bottom: 0; }
.hm-vd-solde {
    display: flex; align-items: center; justify-content: space-between; gap: 18.5px; flex-wrap: wrap;
    padding: 23px 25.5px; border-radius: 20.5px; color: #fff; background: var(--nuit);
}
.hm-vd-solde__label { font-size: 15.5px; color: rgba(255, 255, 255, .72); margin-bottom: 4.6px; }
.hm-vd-solde__montant { font: 800 39px/1.05 var(--f-titre); letter-spacing: -.02em; }
.hm-vd-solde__montant small { font: 600 16px var(--f-texte); color: rgba(255, 255, 255, .6); margin-left: 6.9px; letter-spacing: 0; }
.hm-vd-solde__note { font-size: 16px; color: rgba(255, 255, 255, .72); display: flex; align-items: center; gap: 9.2px; }
.theme--dark .hm-vd-solde { background: var(--surface-3); border: 1px solid var(--ligne-forte); }
.hm-vd-encart { padding: 18.5px; border-radius: 18.5px; background: var(--surface-2); border: 1px solid var(--ligne); }
.hm-vd-encart h3 { font-size: 18.5px; font-weight: 700; margin-bottom: 14px; }
.hm-vd-encart form { display: flex; flex-direction: column; gap: 14px; }
.hm-vd-encart textarea { min-height: 96.5px; }
.hm-vd-encart__actions { gap: 9.2px; }
.hm-vd-encart--remboursement { margin-top: 11.5px; text-align: left; width: 100%; min-width: 299px; background: var(--attention-fond); border-color: var(--attention-bord); }
.hm-vd-soustitre { display: flex; align-items: center; gap: 10.5px; margin-top: 9.2px; font-size: 18.5px; font-weight: 700; }
.hm-vd-soustitre i { color: var(--cuivre); font-size: .9em; }
.hm-vd-vide-ligne { color: var(--muet); font-size: 16px; }
.hm-vd-tronque { display: inline-block; max-width: 22ch; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: bottom; }
.hm-vd-motif { display: inline-block; max-width: 30ch; font-size: 15.5px; color: var(--encre-2); }
.hm-vd-revenus .hm-vd-cellule-actions { text-align: right; }
@media (max-width: 767px) {
    .hm-vd-solde { padding: 20.5px; }
    .hm-vd-solde .hm-btn { width: 100%; }
    .hm-vd-solde__montant { font-size: 34.5px; }
    .hm-vd-encart--remboursement { min-width: 0; }
    .hm-table--cartes td.hm-vd-cellule-actions { flex-direction: column; align-items: stretch; }
    .hm-vd-tronque, .hm-vd-motif { max-width: 69vw; text-align: right; }
}

/* ── Niveaux (cartes de formules) ────────────────────────────────── */
.hm-vd-plans { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18.5px; align-items: stretch; }
.hm-vd-plan {
    position: relative; display: flex; flex-direction: column; gap: 18.5px; padding: 25.5px 23px 23px;
    background: var(--surface); border: 1px solid var(--ligne); border-top: 4.6px solid var(--lc); border-radius: 23px;
}
.hm-vd-plan--mis-en-avant { box-shadow: 0 0 0 2px color-mix(in srgb, var(--lc) 45%, transparent); }
.hm-vd-plan--pro { background: var(--nuit); border-color: var(--nuit); border-top-color: var(--lc); color: #fff; }
.theme--dark .hm-vd-plan--pro { background: var(--surface-3); border-color: var(--ligne-forte); }
.hm-vd-plan__ruban {
    position: absolute; top: -13px; right: 18.5px; padding: 4.6px 12.5px; border-radius: 999px;
    background: #7c3aed; color: #fff; font-size: 14px; font-weight: 700;
}
.hm-vd-plan__tete { display: flex; flex-direction: column; gap: 4.6px; }
.hm-vd-plan__icone {
    width: 50.5px; height: 50.5px; border-radius: 15px; display: grid; place-items: center; margin-bottom: 6.9px;
    background: color-mix(in srgb, var(--lc) 16%, var(--surface)); color: var(--lc); font-size: 20.5px;
}
.theme--dark .hm-vd-plan__icone { background: color-mix(in srgb, var(--lc) 24%, var(--surface)); color: color-mix(in srgb, var(--lc) 55%, #fff); }
.hm-vd-plan--pro .hm-vd-plan__icone { background: rgba(255, 184, 77, .16); color: #ffb84d; }
.hm-vd-plan h2 { font-size: 24px; font-weight: 800; }
.hm-vd-plan h2 small { display: block; font: 500 15px var(--f-texte); color: var(--muet); margin-top: 2px; }
.hm-vd-plan__prix { font: 800 23px/1.2 var(--f-titre); color: var(--lc); }
.hm-vd-plan__prix small { font: 500 15.5px var(--f-texte); color: var(--muet); }
.hm-vd-plan:not(.hm-vd-plan--pro) .hm-vd-plan__prix { color: color-mix(in srgb, var(--lc) 80%, var(--encre)); }
.hm-vd-plan--pro .hm-vd-plan__prix small, .hm-vd-plan--pro h2 small { color: rgba(255, 255, 255, .65); }
.hm-vd-plan__liste { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10.5px; font-size: 16.5px; color: var(--encre-2); flex: 1; }
.hm-vd-plan__liste li { display: flex; gap: 11.5px; align-items: flex-start; line-height: 1.4; }
.hm-vd-plan__liste i { color: var(--malachite); margin-top: 3.4px; width: 16px; flex-shrink: 0; text-align: center; }
.hm-vd-plan__liste .non { color: var(--muet); }
.hm-vd-plan__liste .non i { color: var(--rouge); }
.hm-vd-plan__liste .fa-id-card { color: var(--muet); }
.hm-vd-plan--pro .hm-vd-plan__liste { color: rgba(255, 255, 255, .85); }
.hm-vd-plan--pro .hm-vd-plan__liste i { color: #ffb84d; }
.hm-vd-plan__action { margin-top: auto; }
.hm-vd-plan__etat { display: flex; align-items: center; justify-content: center; gap: 9.2px; min-height: 55px; padding: 0 14px; border-radius: 16px; background: var(--surface-2); color: var(--muet); font-size: 16px; text-align: center; }
.hm-vd-plan__etat--acquis { background: var(--succes-fond); color: var(--succes-texte); font-weight: 600; }
.hm-vd-plan--pro .hm-vd-plan__etat { background: rgba(255, 255, 255, .08); color: rgba(255, 255, 255, .75); }
.hm-vd-paiement__champs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18.5px; }
.hm-vd-paiement #upg-niveau-label { color: #7c3aed; }
.theme--dark .hm-vd-paiement #upg-niveau-label { color: #cdb8ff; }
.hm-vd-liste-boutiques { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 9.2px; }
.hm-vd-liste-boutiques li {
    display: flex; align-items: center; gap: 11.5px 16px; flex-wrap: wrap; padding: 14px 16px;
    border-radius: 16px; background: var(--surface-2); border: 1px solid var(--ligne);
}
.hm-vd-liste-boutiques strong { flex: 1; min-width: 172.5px; }
@media (max-width: 1100px) { .hm-vd-plans { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) {
    .hm-vd-plans { grid-template-columns: 1fr; gap: 23px; }
    .hm-vd-paiement__champs { grid-template-columns: 1fr; }
}

/* ── Live (gestion et page publique) ─────────────────────────────── */
.hm-vd-live .hm-panneau__tete { margin-bottom: 16px; }
.hm-vd-live .hm-alerte { align-items: center; flex-wrap: wrap; }
.hm-vd-live .hm-alerte .hm-btn { margin-left: auto; }
.hm-vd-live__en-cours {
    display: flex; align-items: center; gap: 11.5px; flex-wrap: wrap; margin-bottom: 18.5px;
    padding: 11.5px 14px 11.5px 16px; border-radius: 16px; background: var(--succes-fond); border: 1px solid var(--succes-bord); color: var(--succes-texte);
}
.hm-vd-live__en-cours .hm-btn { margin-left: auto; }
.hm-vd-live__form { display: flex; flex-direction: column; gap: 18.5px; }
.hm-vd-live__case { min-height: 46px; align-items: center; font-weight: 600; color: var(--encre); }
.hm-bandeau--live { padding-bottom: 73.5px; }
.hm-bandeau--live h1 { margin-top: 14px; }
.hm-vd-badge-live--grand { padding: 6.9px 14px; font-size: 15px; }
.hm-vd-live-public__boutique { display: flex; align-items: center; gap: 11.5px; flex-wrap: wrap; }
.hm-vd-live-public__boutique a { color: #fff; font-weight: 600; text-decoration: underline; text-underline-offset: 3.4px; }
.hm-vd-live-public__boutique > i { color: var(--cuivre); }
.hm-vd-video {
    position: relative; aspect-ratio: 16 / 9; border-radius: 23px; overflow: hidden; width: 100%; max-width: 980px; margin: 0 auto;
    background: #000; box-shadow: 0 27.5px 57.5px -20px rgba(3, 12, 36, .55);
}
.hm-vd-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.hm-vd-live-public__info { align-items: center; flex-wrap: wrap; width: 100%; max-width: 980px; margin: 0 auto; }
.hm-vd-live-public__info .hm-btn { margin-left: auto; }
.hm-vd-live-public .hm-tete { margin-bottom: 18.5px; }
@media (max-width: 767px) {
    .hm-vd-live .hm-alerte .hm-btn, .hm-vd-live-public__info .hm-btn { margin-left: 0; width: 100%; }
    .hm-vd-video { width: auto; max-width: none; margin: 0 calc(var(--gouttiere) * -1); border-radius: 0; }
}
/* Les boutons placés dans une alerte ne sont pas soulignés comme des liens */
.hm-vd .hm-alerte .hm-btn, .hm-vd-alerte .hm-btn { text-decoration: none; }

/* ── Vérification et plans d'abonnement ──────────────────────────── */
.hm-vd-pieces { display: flex; gap: 14px; align-items: flex-start; padding: 16px 18.5px; border-radius: 16px; background: var(--surface-2); border: 1px solid var(--ligne); color: var(--encre-2); font-size: 17px; line-height: 1.55; }
.hm-vd-pieces > i { color: var(--cuivre); margin-top: 4.6px; }
.hm-vd-deja-fourni { font-size: 15px; color: var(--malachite); display: flex; gap: 6.9px; align-items: center; }
.hm-vd-plans--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.hm-vd-plan__ruban--cuivre { background: var(--cuivre); color: var(--nuit); }
.hm-vd-plan__accroche { color: rgba(255, 255, 255, .72); font-size: 16.5px; }
.hm-vd-plan__tete .hm-muet { font-size: 16.5px; }
@media (max-width: 767px) { .hm-vd-plans--2 { grid-template-columns: 1fr; } }

/* ── Versements : numéro qui reçoit l'argent, montants, reçu ─────── */
.hm-vd-compte { padding: 18.5px 20.5px; border-radius: 18.5px; border: 1px solid var(--ligne); background: var(--surface-2); display: flex; flex-direction: column; gap: 16px; }
.hm-vd-compte--manquant { border-color: var(--attention-bord); background: var(--attention-fond); }
.hm-vd-compte__tete { display: flex; align-items: flex-start; gap: 14px; }
.hm-vd-compte__tete > i { font-size: 25px; color: var(--cuivre); margin-top: 3px; }
.hm-vd-compte__tete > div { flex: 1; min-width: 0; }
.hm-vd-compte__tete h3 { font-size: 18.5px; font-weight: 700; margin-bottom: 3px; }
.hm-vd-compte__tete p { color: var(--encre-2); font-size: 16px; overflow-wrap: anywhere; }
.hm-vd-compte__form { display: flex; flex-direction: column; gap: 14px; }
.hm-vd-solde--trois { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; }
.hm-vd-solde--trois .hm-vd-solde__montant { font-size: 32px; }
.hm-vd-solde--trois .hm-vd-solde__note { font-size: 14.5px; margin-top: 3px; }
.hm-vd-archives summary { cursor: pointer; color: var(--muet); font-weight: 600; font-size: 16px; display: flex; align-items: center; gap: 9.2px; }
.hm-vd-archives[open] summary { margin-bottom: 11.5px; }
.hm-vd-recu { display: flex; flex-direction: column; gap: 25.5px; }
.hm-vd-recu__tete { display: flex; flex-direction: column; align-items: center; gap: 9.2px; text-align: center; padding: 9.2px 0 23px; border-bottom: 1px solid var(--ligne); }
.hm-vd-recu__montant { font: 800 clamp(2.4rem, 1.9rem + 2vw, 3.4rem)/1.05 var(--f-titre); letter-spacing: -.02em; color: var(--encre); }
.hm-vd-recu__montant small { font: 600 18px var(--f-texte); color: var(--muet); margin-left: 8px; letter-spacing: 0; }
.hm-vd-recu__phrase { max-width: 52ch; color: var(--encre-2); font-size: 17px; }
.hm-vd-recu__corps { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 23px 37px; }
.hm-vd-recu__corps section { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.hm-vd-calcul, .hm-vd-refs { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 9.2px 18.5px; margin: 0; font-size: 16.5px; }
.hm-vd-calcul dt, .hm-vd-refs dt { color: var(--encre-2); }
.hm-vd-calcul dd, .hm-vd-refs dd { margin: 0; text-align: right; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.hm-vd-calcul__moins { color: var(--muet); }
.hm-vd-calcul .hm-vd-calcul__total { padding-top: 9.2px; border-top: 1px dashed var(--ligne-forte); font-weight: 700; color: var(--encre); }
.hm-vd-calcul dd.hm-vd-calcul__total { font: 800 20px var(--f-titre); color: var(--succes-texte); }
.hm-vd-refs dd { font: 15px ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.hm-vd-articles { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 11.5px; }
.hm-vd-articles li { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; gap: 12.5px; align-items: center; }
.hm-vd-articles img { width: 48px; height: 48px; border-radius: 11.5px; object-fit: cover; background: var(--surface-3); }
.hm-vd-articles span small { display: block; color: var(--muet); font-size: 14.5px; }
.hm-vd-articles strong { font: 700 16.5px var(--f-titre); white-space: nowrap; }
@media (max-width: 767px) {
    .hm-vd-solde--trois { grid-template-columns: minmax(0, 1fr); gap: 14px; }
    .hm-vd-recu__corps { grid-template-columns: minmax(0, 1fr); }
    .hm-vd-compte__tete { flex-wrap: wrap; }
}
