/**
 * Fix para Selects - Opções Legíveis
 * Pedegarimpo MVP - Semana de Educação para a Vida 2025
 */

/* Corrigir cor das opções dos selects */
select.form-control option {
    background-color: #ffffff !important;
    color: #1a3a5c !important;
    padding: 8px 12px;
}

/* Opção selecionada */
select.form-control option:checked {
    background-color: #4a90e2 !important;
    color: #ffffff !important;
}

/* Hover nas opções */
select.form-control option:hover {
    background-color: #f0f0f0 !important;
    color: #1a3a5c !important;
}

/* Select aberto (dropdown) */
select.form-control:focus option {
    background-color: #ffffff !important;
    color: #1a3a5c !important;
}

/* Para navegadores webkit (Chrome, Safari) */
select.form-control {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23ffffff' d='M10.293 3.293L6 7.586 1.707 3.293A1 1 0 00.293 4.707l5 5a1 1 0 001.414 0l5-5a1 1 0 10-1.414-1.414z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    padding-right: 40px;
}

/* Alternativa: Usar estilo nativo do navegador */
select.form-control.native-style {
    -webkit-appearance: auto;
    -moz-appearance: auto;
    appearance: auto;
    background-image: none;
    padding-right: 16px;
}

/* Para admin também */
.admin-container select,
.perfil-container select,
form select {
    background-color: rgba(255, 255, 255, 0.1) !important;
    color: #ffffff !important;
}

.admin-container select option,
.perfil-container select option,
form select option {
    background-color: #ffffff !important;
    color: #1a3a5c !important;
    padding: 8px 12px;
}

.admin-container select option:checked,
.perfil-container select option:checked,
form select option:checked {
    background-color: #4a90e2 !important;
    color: #ffffff !important;
}