/* BAV — compléments au-dessus de Bootstrap 5 (le strict nécessaire). */

/* Pastille de couleur de tri (couleur du déposant, RG-27). */
.color-dot {
    display: inline-block;
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
    border: 1px solid rgba(0, 0, 0, 0.35);
    vertical-align: text-bottom;
}

/* Frise des phases de l'événement (pilotage 1p). */
.phase-stepper {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    list-style: none;
    padding: 0;
}

.phase-stepper li {
    padding: 0.3rem 0.7rem;
    background: var(--bs-secondary-bg);
    border-radius: var(--bs-border-radius);
    font-size: 0.9rem;
}

.phase-stepper li.current {
    background: var(--bs-primary);
    color: #fff;
    font-weight: 600;
}

/*
 * Tooltip CSS pur (pas de JS Bootstrap) pour un bouton désactivé : un
 * <button disabled> a pointer-events:none, donc ni :hover ni title ne s'y
 * déclenchent — le hover est porté par le <span> englobant à la place.
 * Réutilise les variables --bs-tooltip-* (même rendu que .tooltip Bootstrap).
 */
.disabled-tooltip {
    position: relative;
    display: inline-block;
}

.disabled-tooltip::after {
    content: attr(data-tooltip);
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translate(-50%, -0.3rem);
    width: max-content;
    max-width: var(--bs-tooltip-max-width, 200px);
    padding: var(--bs-tooltip-padding-y, 0.25rem) var(--bs-tooltip-padding-x, 0.5rem);
    background: var(--bs-tooltip-bg, #000);
    color: var(--bs-tooltip-color, #fff);
    border-radius: var(--bs-tooltip-border-radius, 0.375rem);
    font-size: var(--bs-tooltip-font-size, 0.765625rem);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.15s ease-out;
    z-index: 1080;
}

.disabled-tooltip:hover::after,
.disabled-tooltip:focus-within::after {
    opacity: 1;
}

/* Caisse : cibles tactiles généreuses sur mobile (wireframe 1j : ≥ 44 px). */
@media (max-width: 576px) {
    .cash-actions .btn,
    .cash-actions .form-control,
    .cash-actions .form-select {
        min-height: 44px;
    }
}