/* ==========================================================================
   Vandeto — Hot Deal  (v2)
   Affichage fidèle desktop & mobile. Couleurs AdForest : #d2281e / #ff6a2b.
   ========================================================================== */

.vhd-badge {
    display: inline-flex !important;
    align-items: center;
    gap: 5px;
    box-sizing: border-box;
    font-family: inherit;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: #fff;
    padding: 5px 10px;
    border-radius: 999px;
    white-space: nowrap;
    width: auto;
    max-width: none;
    z-index: 6;
    -webkit-font-smoothing: antialiased;
}
.vhd-badge .vhd-txt { display: inline-block; }

/* --- Flamme : taille verrouillée pour résister à TOUTES les grilles --- */
.vhd-badge svg.vhd-fire {
    display: inline-block !important;
    vertical-align: middle;
    width: 18px !important;
    height: 18px !important;
    min-width: 18px !important;
    min-height: 18px !important;
    max-width: none !important;
    max-height: none !important;
    flex: 0 0 auto !important;
    filter: drop-shadow(0 1px 1px rgba(0, 0, 0, .25));
}

/* Position sur les cartes : par défaut en haut à gauche ; le JS place le badge
   juste sous le tag PROMOTION quand il existe. */
.vhd-on-card { position: absolute; top: 8px; left: 8px; }
.vhd-rel { position: relative !important; }

/* Pastille (style Discret) */
.vhd-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #d2281e;
    display: inline-block;
    flex: 0 0 auto;
    animation: vhd-dot 1.2s ease-in-out infinite;
}
@keyframes vhd-dot { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: .2; transform: scale(.7); } }

/* ---- 1. Pulse flamme ---- */
.vhd-style-glow { background: linear-gradient(135deg, #ff6a2b, #d2281e); animation: vhd-glow 1.6s ease-in-out infinite; }
@keyframes vhd-glow {
    0%, 100% { box-shadow: 0 0 0 0 rgba(210, 40, 30, .45); transform: scale(1); }
    50%      { box-shadow: 0 0 16px 3px rgba(255, 106, 43, .7); transform: scale(1.05); }
}

/* ---- 2. Onde radar ---- */
.vhd-style-radar { position: relative; background: #d2281e; }
.vhd-style-radar::after { content: ""; position: absolute; inset: 0; border-radius: inherit; animation: vhd-radar 1.5s ease-out infinite; }
@keyframes vhd-radar { 0% { box-shadow: 0 0 0 0 rgba(210, 40, 30, .5); } 100% { box-shadow: 0 0 0 13px rgba(210, 40, 30, 0); } }

/* ---- 3. Flash ---- */
.vhd-style-flash { background: #d2281e; animation: vhd-flash 1s steps(1, end) infinite; }
@keyframes vhd-flash { 0%, 49% { opacity: 1; } 50%, 100% { opacity: .4; } }

/* ---- 4. Flamme agitée ---- */
.vhd-style-shake { background: linear-gradient(135deg, #ff6a2b, #d2281e); }
.vhd-style-shake svg.vhd-fire { transform-origin: 50% 80%; animation: vhd-shake .9s ease-in-out infinite; }
@keyframes vhd-shake { 0%, 100% { transform: rotate(-9deg) scale(1); } 50% { transform: rotate(9deg) scale(1.08); } }

/* ---- 5. Reflet ---- */
.vhd-style-shine { background: #d2281e; position: relative; overflow: hidden; }
.vhd-style-shine::before {
    content: ""; position: absolute; top: 0; left: -60%; width: 45%; height: 100%;
    background: linear-gradient(120deg, transparent, rgba(255, 255, 255, .55), transparent);
    animation: vhd-shine 2s linear infinite;
}
.vhd-style-shine svg.vhd-fire, .vhd-style-shine .vhd-txt { position: relative; z-index: 1; }
@keyframes vhd-shine { 0% { left: -60%; } 100% { left: 120%; } }

/* ---- 6. Ruban néon ---- */
.vhd-style-ribbon { background: linear-gradient(135deg, #ff6a2b, #d2281e); border-radius: 6px; animation: vhd-ribbon 1.3s ease-in-out infinite; }
@keyframes vhd-ribbon { 0%, 100% { filter: brightness(1); } 50% { filter: brightness(1.35); } }

/* ---- 7. Discret ---- */
.vhd-style-soft { background: #fff; border: 1px solid #f0997b; color: #a32d2d; }

/* Réduction d'animations */
@media (prefers-reduced-motion: reduce) {
    .vhd-style-glow, .vhd-style-radar::after, .vhd-style-flash, .vhd-style-shake svg.vhd-fire,
    .vhd-style-shine::before, .vhd-style-ribbon, .vhd-dot { animation: none !important; }
}

/* ==========================================================================
   Responsive — fidélité mobile
   ========================================================================== */
@media (max-width: 1024px) {
    .vhd-badge { font-size: 10px; padding: 5px 9px; }
    .vhd-badge svg.vhd-fire { width: 17px !important; height: 17px !important; min-width: 17px !important; min-height: 17px !important; }
}
@media (max-width: 600px) {
    .vhd-badge { font-size: 9px; padding: 4px 7px; gap: 4px; letter-spacing: .03em; }
    .vhd-badge svg.vhd-fire { width: 15px !important; height: 15px !important; min-width: 15px !important; min-height: 15px !important; }
}

/* ==========================================================================
   Aperçus admin (flamme isolée)
   ========================================================================== */
.vhd-flame-slot svg.vhd-fire { width: 30px !important; height: 30px !important; min-width: 30px !important; min-height: 30px !important; filter: drop-shadow(0 1px 1px rgba(0,0,0,.25)); }

/* ==========================================================================
   Espace annonceur [vandeto_hotdeal]
   ========================================================================== */
.vhd-dash { max-width: 720px; }
.vhd-dash-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 18px; background: #fff; border: 1px solid #eee; border-radius: 10px; margin-bottom: 18px; }
.vhd-balance-num { font-size: 30px; font-weight: 700; color: #d2281e; margin-right: 6px; }
.vhd-balance-lbl { color: #777; font-size: 14px; }
.vhd-buy-btn { background: #d2281e; color: #fff !important; text-decoration: none; padding: 9px 16px; border-radius: 8px; font-weight: 600; font-size: 14px; }
.vhd-buy-btn:hover { background: #b3231b; }
.vhd-ad-list { list-style: none; margin: 0; padding: 0; }
.vhd-ad-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px; border: 1px solid #eee; border-radius: 8px; margin-bottom: 8px; background: #fff; }
.vhd-ad-title { font-weight: 600; color: #2c2c2a; }
.vhd-tag-on { background: #fdecec; color: #a32d2d; font-size: 12px; font-weight: 600; padding: 5px 10px; border-radius: 6px; white-space: nowrap; }
.vhd-boost-btn { background: linear-gradient(135deg, #ff6a2b, #d2281e); color: #fff; border: 0; cursor: pointer; padding: 8px 14px; border-radius: 8px; font-weight: 600; font-size: 13px; }
.vhd-boost-btn:disabled { opacity: .5; cursor: not-allowed; }

/* Ligne pricing injectée */
.vhd-price-line { margin: 4px 0; font-weight: 600; color: #d2281e; }
li[data-vhd="1"] { font-weight: 600; }

/* Notice "Activer Hot Deal" sur la fiche de l'annonce (propriétaire) */
.vhd-ad-notice {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    background: #fdecec;
    border: 1px solid #f3b9b3;
    border-left: 4px solid #d2281e;
    border-radius: 8px;
    padding: 12px 16px;
    margin: 0 0 16px;
    font-size: 15px;
    color: #8f2018;
}
.vhd-ad-notice .vhd-ad-ico { font-size: 20px; line-height: 1; }
.vhd-ad-notice .vhd-ad-txt { flex: 1 1 auto; font-weight: 600; }
.vhd-ad-notice .vhd-ad-txt small { color: #b5564e; font-weight: 500; }
.vhd-ad-btn {
    background: linear-gradient(135deg, #ff6a2b, #d2281e);
    color: #fff; border: 0; cursor: pointer;
    padding: 9px 18px; border-radius: 8px; font-weight: 700; font-size: 14px;
    white-space: nowrap;
}
.vhd-ad-btn:hover { filter: brightness(1.08); }
.vhd-ad-btn:disabled { opacity: .6; cursor: default; }
.vhd-ad-buy { color: #d2281e; font-weight: 700; text-decoration: underline; }
.vhd-ad-btn2 { background: #fff; color: #8f2018; border: 1px solid #e0a59f; }
.vhd-ad-btn2:hover { filter: none; background: #fbeae8; }
.vhd-ad-link { color: #8f2018; font-weight: 600; text-decoration: underline; white-space: nowrap; }
.vhd-ad-notice.vhd-ad-ok { background: #eafaef; border-color: #b7e4c4; border-left-color: #2faa57; color: #1d7a3d; }
.vhd-ad-notice.vhd-ad-ok .vhd-ad-link { color: #1d7a3d; }