/*
 * Tom Select - tema dourado/brasa (adaptado do dk-purple).
 * Vendor build: tom-select.bootstrap5.min.css (uses --* CSS custom properties).
 *
 * Paleta do tema:
 *   #140c0a fundo | #261813 superficie | #0f0806 card
 *   #9c6a1a primary | #d4a62a borda ativa | #e0b040 texto de destaque
 *   #3d261d / #5a3a28 hairlines | #a8401c hover (vermelho-brasa)
 * 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: #261813 !important;
    color: #f1e3c8 !important;
    border-radius: 0 !important;
}

.disabled .ts-control {
    background-color: #1f1410 !important;
    color: #c9ab7a !important;
}

.ts-control > input,
.ts-control > input::placeholder {
    color: #c9ab7a !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: #d4a62a !important;
    box-shadow: 0 0 0 0.2rem rgba(212, 166, 42, 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(212, 166, 42, 0.35) !important;
    border: 1px solid #5a3a28 !important;
    border-radius: 0 !important;
    color: #f1e3c8 !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: #9c6a1a !important;
    border-color: #d4a62a !important;
    color: #fff !important;
}

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

.ts-wrapper.plugin-remove_button:not(.rtl) .item .remove:hover {
    background: rgba(212, 166, 42, 0.45) !important;
    color: #f5d675 !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: #0f0806 !important;
    border-radius: 0 !important;
    border-color: #3d261d !important;
    box-shadow: 0 5px 15px rgba(12, 6, 4, 0.7) !important;
    color: #f1e3c8 !important;
}

.ts-dropdown .optgroup-header {
    background: #0f0806 !important;
    color: #c9ab7a !important;
}

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

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

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