/* ============================================================
   Tom Select — surcharges de style (colocalisées avec la lib).
   Le DOM .ts-wrapper/.ts-control/.ts-dropdown est généré par le JS de Tom Select
   → non componentisable en Tailwind. CSS brut, chargé APRÈS tom-select.css via <link>
   dans base_app.html / base_public.html. Utilise les tokens runtime var(--color-*)
   (définis dans revolucy.min.css, chargé avant).
   ============================================================ */

/* --- Dans les fiches prospect/client (.fiche-form) : même gabarit que les inputs --- */
/* NB : les selects Tom Select ne reçoivent plus les classes DaisyUI `select select-bordered`
   (exclues côté JS dans utils.js), donc le wrapper n'a aucun style DaisyUI à neutraliser. */
.fiche-form .champ .ts-wrapper { margin-top: 0 !important; width: 100%; }
.fiche-form .champ .ts-wrapper .ts-control {
    display: flex;
    align-items: center;
    min-height: 38px;
    padding: 8px 12px;
    font-size: 13px;
    border-radius: 8px;
    border: 1px solid var(--color-border);
    background: var(--color-base-200);
}
/* L'input interne de Tom Select (recherche/autogrow) ne doit pas hériter du gabarit
   des inputs classiques (.fiche-form .champ input) : sinon width:100% + height + bordure
   le forcent en pleine largeur, l'item sélectionné passe sur 2 lignes et se fait rogner */
.fiche-form .champ .ts-wrapper .ts-control > input {
    width: auto;
    height: auto;
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    box-shadow: none;
}
/* Focus : halo discret comme les inputs, et neutralisation de l'outline focus-visible
   de DaisyUI (outline ink + offset) qui crée un double cadre foncé sur le contrôle Tom Select */
.fiche-form .champ .ts-wrapper.focus .ts-control {
    border-color: var(--color-navy-300);
    box-shadow: 0 0 0 3px rgba(30, 45, 92, .08);
}
.fiche-form .champ .ts-wrapper .ts-control,
.fiche-form .champ .ts-wrapper .ts-control input:focus,
.fiche-form .champ .ts-wrapper .ts-control input:focus-visible {
    outline: none !important;
}

/* --- Hors .fiche-form --- */
div.ts-wrapper .ts-control {
    padding: 9px 8px 10px 8px;
    font-size: 0.875rem;
    border-radius: 8px;
    border: 1px solid #c5c5c5;
    background: var(--color-base-200);
}
/* Masque le <select> d'origine une fois TomSelect initialisé (évite le doublon select natif + widget) */
select.tomselected { display: none !important; }
/* Le menu déroulant passe au-dessus du contenu qui suit (cartes, tableaux) au lieu d'être masqué */
.ts-dropdown { z-index: 60; }
.config-tache-collaborateurs .ts-wrapper {
    width: 100%;
    min-width: 0;
}
.config-tache-collaborateurs .ts-wrapper.multi .ts-control {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    min-height: 44px;
    padding: 7px 8px;
}
.config-tache-collaborateurs .ts-wrapper.multi .ts-control > .item {
    max-width: 100%;
    overflow-wrap: anywhere;
}
.config-tache-collaborateurs .ts-wrapper.multi .ts-control > input {
    flex: 1 1 4rem;
    min-width: 0;
    max-width: 100%;
}
/* Rattachement d'un email : champs de hauteur uniforme, valeur tronquée sur une ligne */
.email-rattacher-form .ts-control {
    flex-wrap: nowrap;
    overflow: hidden;
    min-height: 40px;
    background: #fff;
}
.email-rattacher-form .ts-control > .item {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}