/* Estilos para tags/chips APENAS dos dropdowns multi-select */
/* Seletores específicos para dropdowns com multi=True */

/* Tags/chips dos itens selecionados - APENAS MULTI-SELECT */
body .Select--multi .Select-value,
body .Select--multi .css-12jo7m5,
body .Select--is-multi .css-12jo7m5,
body .css-2b097c-container.Select--is-multi .css-12jo7m5,
body div[data-dash-component-type="Dropdown"].Select--multi .Select-value,
body .dash-dropdown.Select--multi .Select-value,
/* Classes específicas do React-Select para multi-select */
body .css-1rhbuit-multiValue,
body .css-12jo7m5-multiValue,
body .css-1p3m7a8-multiValue {
    background-color: #f0f0f0 !important;
    border: 1px solid #d0d0d0 !important;
    color: #333 !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    border-radius: 4px !important;
    padding: 5px 5px !important;
    margin: 2px !important;
    transition: all 0.2s ease !important;
    /* Forçar sobrescrita de qualquer cor azul */
    background: #f0f0f0 !important;
}

/* Estado hover - mais escuro - APENAS MULTI-SELECT */
body .Select--multi .Select-value:hover,
body .Select--multi .css-12jo7m5:hover,
body .Select--is-multi .css-12jo7m5:hover,
body .css-2b097c-container.Select--is-multi .css-12jo7m5:hover,
body div[data-dash-component-type="Dropdown"].Select--multi .Select-value:hover,
body .dash-dropdown.Select--multi .Select-value:hover,
body .css-1rhbuit-multiValue:hover,
body .css-12jo7m5-multiValue:hover,
body .css-1p3m7a8-multiValue:hover {
    background-color: #e0e0e0 !important;
    border-color: #b0b0b0 !important;
    color: #222 !important;
    background: #e0e0e0 !important;
}

/* Texto dentro das tags - APENAS MULTI-SELECT */
body .Select--multi .Select-value-label,
body .Select--multi .css-xb97g8,
body .Select--is-multi .css-xb97g8,
body .css-2b097c-container.Select--is-multi .css-xb97g8,
body div[data-dash-component-type="Dropdown"].Select--multi .Select-value-label,
body .dash-dropdown.Select--multi .Select-value-label,
body .css-1fdsijx-multiValueLabel,
body .css-xb97g8-multiValueLabel {
    color: #333 !important;
    font-size: 14px !important;
    font-weight: 400 !important;
}

/* Texto no hover - APENAS MULTI-SELECT */
body .Select--multi .Select-value:hover .Select-value-label,
body .Select--multi .css-12jo7m5:hover .css-xb97g8,
body .Select--is-multi .css-12jo7m5:hover .css-xb97g8,
body .css-2b097c-container.Select--is-multi .css-12jo7m5:hover .css-xb97g8,
body div[data-dash-component-type="Dropdown"].Select--multi .Select-value:hover .Select-value-label,
body .dash-dropdown.Select--multi .Select-value:hover .Select-value-label,
body .css-1rhbuit-multiValue:hover .css-xb97g8,
body .css-1rhbuit-multiValue:hover .css-1fdsijx-multiValueLabel {
    color: #222 !important;
}

/* Botão X para remover tags - APENAS MULTI-SELECT */
body .Select--multi .Select-value-icon,
body .Select--multi .css-19bqh2r,
body .Select--is-multi .css-19bqh2r,
body .css-2b097c-container.Select--is-multi .css-19bqh2r,
body div[data-dash-component-type="Dropdown"].Select--multi .Select-value-icon,
body .dash-dropdown.Select--multi .Select-value-icon,
body .css-19bqh2r-multiValueRemove {
    border-left: 1px solid #d0d0d0 !important;
    color: #666 !important;
    background-color: transparent !important;
    transition: all 0.2s ease !important;
}

/* Botão X no hover - APENAS MULTI-SELECT */
body .Select--multi .Select-value-icon:hover,
body .Select--multi .css-19bqh2r:hover,
body .Select--is-multi .css-19bqh2r:hover,
body .css-2b097c-container.Select--is-multi .css-19bqh2r:hover,
body div[data-dash-component-type="Dropdown"].Select--multi .Select-value-icon:hover,
body .dash-dropdown.Select--multi .Select-value-icon:hover,
body .css-19bqh2r-multiValueRemove:hover {
    background-color: #d0d0d0 !important;
    color: #333 !important;
}
