/*
 * Tom Select - Mudark Brutal theme overrides.
 * Vendor build: tom-select.bootstrap5.min.css (uses --* CSS custom properties).
 *
 * Paleta do tema:
 *   #0e090a fundo | #22100f superficie | #170c0e card
 *   #a3161c primary | #e0262d borda ativa | #d4a24c texto de destaque
 *   #3a1518 / #5a1d20 hairlines
 * O tema e sempre escuro e usa border-radius: 0.
 *
 * Estrutura quando <select class="form-select">:
 *   .ts-wrapper.form-select    <- borda/foco ficam AQUI
 *     .ts-control              <- border: none, background: transparent (vendor)
 *       .item                  <- pill
 *     .ts-dropdown
 */

/* -- Control background ------------------------------------------- */
.ts-control,
.ts-wrapper.single.input-active .ts-control,
.full .ts-control {
    background-color: #22100f !important;
    color: #efe4d6 !important;
    border-radius: 0 !important;
}

.disabled .ts-control {
    background-color: #1c0d0e !important;
    color: #a8988c !important;
}

.ts-control > input,
.ts-control > input::placeholder {
    color: #a8988c !important;
}

/* -- Focus ring ---------------------------------------------------- */
.ts-wrapper.form-select,
.ts-wrapper.form-control {
    border-radius: 0 !important;
}

.ts-wrapper.form-select.focus,
.ts-wrapper.form-control.focus,
.focus .ts-control {
    border-color: #e0262d !important;
    box-shadow: 0 0 0 0.2rem rgba(163, 22, 28, 0.35) !important;
    outline: 0 !important;
}

/* Suprime a sombra interna p/ nao clipar dentro do wrapper */
.ts-wrapper.form-select .ts-control,
.ts-wrapper.form-control .ts-control {
    box-shadow: none !important;
}

/* Simplifica o calc de padding do vendor no sm multi */
.ts-wrapper.form-select-sm.multi.has-items .ts-control {
    padding-top: calc(.75rem - 5px) !important;
    padding-bottom: calc(.75rem - 5px) !important;
}

/* -- Tags (itens selecionados) ------------------------------------- */
.ts-wrapper.multi .ts-control > div {
    background: rgba(163, 22, 28, 0.35) !important;
    border: 1px solid #5a1d20 !important;
    border-radius: 0 !important;
    color: #efe4d6 !important;
    font-size: .75rem;
    font-weight: 500;
    line-height: 1.4;
    padding: 2px 6px;
    margin: 1px 3px 1px 0;
}

.ts-wrapper.multi .ts-control > div.active {
    background: #a3161c !important;
    border-color: #e0262d !important;
    color: #fff !important;
}

/* Botao remover (x) */
.ts-wrapper.plugin-remove_button:not(.rtl) .item .remove {
    border-left-color: #5a1d20 !important;
    color: #d4a24c !important;
    opacity: .75;
}

.ts-wrapper.plugin-remove_button:not(.rtl) .item .remove:hover {
    background: rgba(163, 22, 28, 0.45) !important;
    color: #f2cf7a !important;
    opacity: 1;
}

.ts-wrapper.plugin-remove_button:not(.rtl) .item.active .remove {
    border-left-color: rgba(255, 255, 255, 0.35) !important;
    color: #fff !important;
    opacity: .85;
}

/* -- Dropdown ------------------------------------------------------ */
.ts-dropdown,
.ts-dropdown.form-control,
.ts-dropdown.form-select {
    background: #170c0e !important;
    border-radius: 0 !important;
    border-color: #3a1518 !important;
    box-shadow: 0 5px 15px rgba(10, 6, 7, 0.7) !important;
    color: #efe4d6 !important;
}

.ts-dropdown .optgroup-header {
    background: #170c0e !important;
    color: #a8988c !important;
}

.ts-dropdown .option {
    color: #efe4d6 !important;
}

.ts-dropdown .active {
    background-color: #c4161c !important;
    color: #fff !important;
}

.ts-dropdown .create {
    color: #d4a24c !important;
}