/* Accent optionnelle (définissable via style="--tarif-accent:#fff") */
.tarif-flip {
    --tarif-accent: var(--tarif-accent, inherit);
}

.tarif-flip .tarif-title {
    /* Couleur du titre: utilise l’accent si fourni sinon hérite du thème */
    color: var(--tarif-accent);
}

/* Flip 3D (ne dépend plus d’un id strict si tu changes l’ancre) */
.tarif-flip .card-flip {
    perspective: 1000px;
}
.tarif-flip .card-flip .card-inner {
    position: relative;
    width: 100%;
    transform-style: preserve-3d;
    transition: transform .6s ease;
}
.tarif-flip .card-flip .card-inner.is-flipped {
    transform: rotateY(180deg);
}
.tarif-flip .card-flip .card-face {
    position: absolute;
    inset: 0;
    backface-visibility: hidden;
}
.tarif-flip .card-flip .card-back {
    transform: rotateY(180deg);
}
/* Mesure temporaire */
.tarif-flip .card-flip .card-face.measure {
    position: static !important;
    transform: none !important;
}

/* Étirement */
.tarif-flip .card-flip .card {
    height: 100%;
}
.tarif-flip .card-face > .card-body {
    display: flex;
    flex-direction: column;
    height: 100%;
}

/* Badge accent optionnel */
.badge-accent {
    background: rgba(255,255,255,.12);
    color: var(--tarif-accent, var(--bs-primary, #0d6efd));
    border: 1px solid currentColor;
    font-weight: 500;
}

/* Bouton flip : assure visibilité s’il hérite d’une classe outline trop faible */
.tarif-flip [data-action="flip"] {
    opacity: 1;
}

/* Si on veut forcer style accent quand accentColor fourni */
.tarif-flip[style*="--tarif-accent"] [data-action="flip"].btn-outline-light {
    border-color: var(--tarif-accent);
    color: var(--tarif-accent);
}
.tarif-flip[style*="--tarif-accent"] [data-action="flip"].btn-outline-light:hover {
    background: var(--tarif-accent);
    color: #111;
}