/* ============================================================
   CORREÇÃO GLOBAL DE DROPDOWNS - QA REPORT FINAL
   ============================================================

   PROBLEMAS IDENTIFICADOS:
   1. Plugin Nice-Select criando setas duplas
   2. SVG com stroke ao invés de fill
   3. Inconsistência de estilos entre páginas

   SOLUÇÃO: Desabilitar Nice-Select e aplicar estilo Bootstrap
   consistente em TODAS as páginas
   ============================================================ */

/* ===========================
   1. DESABILITAR NICE-SELECT
   =========================== */

/* Esconder todos os elementos nice-select gerados pelo plugin */
.nice-select {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

/* Garantir que selects nativos sejam sempre visíveis - EXCETO os do SweetAlert2 */
select.form-select,
select:not([id^="swal2-"]):not(.swal2-select) {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* ===========================
   2. ESTILO UNIFICADO DE DROPDOWNS
   =========================== */

/* Aplicar estilo consistente a TODOS os form-select */
.form-select,
select.form-select,
.property-sidebar-area .form-select,
.encomendar-form-area .form-select {
    /* SETA: SVG sólido preto, 16x16px - PADRÃO BOOTSTRAP */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%23000' d='M8 11L3 6h10z'/%3E%3C/svg%3E") !important;
    background-position: calc(100% - 12px) 50% !important;
    background-size: 16px 16px !important;
    background-repeat: no-repeat !important;

    /* REMOVER APARÊNCIA NATIVA - garantir apenas uma seta */
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;

    /* ESPAÇAMENTO UNIFORME */
    padding-right: 40px !important;

    /* ALINHAMENTO VERTICAL CORRETO */
    vertical-align: baseline !important;
    line-height: 1.5 !important;

    /* BORDA PADRÃO */
    border: 1px solid #ced4da !important;
    border-radius: 0.25rem !important;

    /* TRANSIÇÃO SUAVE */
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out !important;
}

/* ===========================
   3. ESTADOS INTERATIVOS
   =========================== */

/* Estado de foco */
.form-select:focus,
select.form-select:focus {
    border-color: #86b7fe !important;
    outline: 0 !important;
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25) !important;
}

/* Estado de hover */
.form-select:hover,
select.form-select:hover {
    border-color: #9ca3af !important;
    cursor: pointer !important;
}

/* Estado disabled */
.form-select:disabled,
select.form-select:disabled {
    background-color: #e9ecef !important;
    cursor: not-allowed !important;
    opacity: 1 !important;
}

/* ===========================
   4. VALIDAÇÃO - Manter seta única
   =========================== */

/* Sobrescrever estilos de validação do Bootstrap para manter apenas uma seta */
.form-select:valid,
.form-select:invalid,
.was-validated .form-select:valid,
.was-validated .form-select:invalid {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%23000' d='M8 11L3 6h10z'/%3E%3C/svg%3E") !important;
    background-position: calc(100% - 12px) 50% !important;
    padding-right: 40px !important;
}

/* ===========================
   5. SELECT2 (Múltipla seleção)
   =========================== */

/* Select2 deve permanecer funcional para múltipla seleção */
.select2-container {
    display: block !important;
}

.select2-container--bootstrap-5 .select2-selection {
    min-height: calc(1.5em + 0.75rem + 2px) !important;
    border: 1px solid #ced4da !important;
}

/* ===========================
   6. RESPONSIVIDADE
   =========================== */

@media (max-width: 767px) {
    .form-select {
        font-size: 16px !important; /* Prevenir zoom em iOS */
    }
}

/* ===========================
   7. PÁGINAS ESPECÍFICAS
   =========================== */

/* Página de busca - manter consistência */
.others-section-area .filter-group select {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%23000' d='M8 11L3 6h10z'/%3E%3C/svg%3E") !important;
}

/* Página de encomenda - garantir padding consistente */
.encomendar-form-area .form-select {
    padding: 12px 40px 12px 16px !important;
}

/* ===========================
   8. LIMPEZA DE CONFLITOS
   =========================== */

/* Remover qualquer pseudo-elemento que possa criar setas extras */
.form-select::before,
.form-select::after,
select::before,
select::after {
    display: none !important;
    content: none !important;
}

/* Garantir que nenhum wrapper adicione setas */
.select-wrapper::before,
.select-wrapper::after {
    display: none !important;
    content: none !important;
}