/* ==========================================================================
   ONGLETS "RECHERCHE / CRÉATION" — façon onglets de navigateur, utilisés dans
   les modales d'ajout qui proposent de rechercher un élément existant ou
   d'en créer un nouveau (SelectionProprietaire, LierAnimalActeModal,
   AjoutOperationModal, GestionActesView...).
   ========================================================================== */

.onglets {
    display: flex;
    border-bottom: 1px solid var(--border);
    margin-bottom: 20px;
}

.onglet {
    flex: 1;
    padding: 11px 18px;
    background: transparent;
    border: none;
    border-bottom: 3px solid transparent;
    font-size: 0.78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--text);
    opacity: 0.5;
    cursor: pointer;
    transition: all 0.15s ease;
}

.onglet:hover:not(.onglet-actif) {
    opacity: 0.85;
    background: var(--background);
}

.onglet-actif {
    color: var(--secondary);
    opacity: 1;
    background: var(--secondary-pastel);
    border-bottom-color: var(--secondary);
}

/* Variante collée directement sous le header d'une modale : la bande d'onglets
   "casse" le padding du modal-body (32px, cf. modal.css) pour s'étendre bord à
   bord, comme des onglets de navigateur rattachés à la fenêtre du dessus.
   À utiliser uniquement quand les onglets sont le tout premier élément du
   modal-body. */
.onglets--header {
    margin: -32px -32px 20px;
    padding: 0 14px;
}