/* Listes de choix enrichies (Tom Select, cf. js/kal-tomselect.js) - remplace chosen */

.ts-wrapper { width: 100%; }
.ts-wrapper .ts-control { min-height: 30px; font-size: 12px; color: #555; }
.ts-wrapper.multi.has-items .ts-control { padding-left: 4px; padding-top: 3px; }
.ts-wrapper.plugin-remove_button .item { align-items: stretch; }
.ts-wrapper.plugin-remove_button .item .remove { display: flex; align-items: center; }

/* Tom Select recopie les classes du <select> (form-control...) sur son conteneur : le cadre Bootstrap/thème
   est porté par le conteneur, le bloc interne .ts-control devient transparent (sinon double bordure) */
.ts-wrapper.form-control { height: auto; padding: 0; }
.ts-wrapper.form-control .ts-control,
.ts-wrapper.multi.form-control.has-items .ts-control {
    border: none;
    border-radius: inherit;
    background: transparent;
    box-shadow: none;
}

/* Menu attaché au body (dropdownParent) : au-dessus des modales Bootstrap (z-index 1050) */
body > .ts-dropdown { z-index: 2000; font-size: 12px; }

/* Champ obligatoire non renseigné (équivalent du style :invalid de chosen) */
select.tomselect-select:invalid + .ts-wrapper,
select.tomselect-select:invalid + .ts-wrapper:not(.form-control) .ts-control {
    border-color: #E83737;
    background-color: rgba(232, 55, 55, 0.1);
}

/* Désactivé / lecture seule (après la neutralisation ci-dessus pour primer) */
.ts-wrapper.disabled,
.ts-wrapper.locked,
.ts-wrapper.disabled:not(.form-control) .ts-control,
.ts-wrapper.locked:not(.form-control) .ts-control { background-color: #EEE; cursor: not-allowed; }

/* Liste dans un input-group Bootstrap 3 */
.input-group .ts-wrapper { display: table-cell; }
.input-group .input-group-addon:first-child + select + .ts-wrapper .ts-control,
.input-group .input-group-addon:first-child + .ts-wrapper .ts-control { border-top-left-radius: 0; border-bottom-left-radius: 0; }
