/**
 * Sistema Global de Scrollbars Minimalistas - Formulários
 * Aplicado em todos os formulários (onboarding, pesquisas, pitch)
 */

/* ==========================================
   SCROLLBAR GLOBAL PARA FUNDO ESCURO (#121F4B)
   ========================================== */

/* Scrollbar padrão para o body do formulário (fundo escuro) */
body {
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, 0.6) transparent;
}

body::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

body::-webkit-scrollbar-track {
    background: transparent;
}

body::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.6);
    border-radius: 10px;
}

body::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.8);
}

/* ==========================================
   SCROLLBAR PARA CONTAINERS BRANCOS/CLAROS
   ========================================== */

/* Containers de formulário brancos precisam scrollbar cinza */
.onboarding-form-container,
.form-container,
.white-container,
.content-box,
.modal-content,
.dropdown-options,
[data-theme="light"] {
    scrollbar-width: thin;
    scrollbar-color: #cbd5e0 transparent;
}

.onboarding-form-container::-webkit-scrollbar,
.form-container::-webkit-scrollbar,
.white-container::-webkit-scrollbar,
.content-box::-webkit-scrollbar,
.modal-content::-webkit-scrollbar,
.dropdown-options::-webkit-scrollbar,
[data-theme="light"]::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

.onboarding-form-container::-webkit-scrollbar-track,
.form-container::-webkit-scrollbar-track,
.white-container::-webkit-scrollbar-track,
.content-box::-webkit-scrollbar-track,
.modal-content::-webkit-scrollbar-track,
.dropdown-options::-webkit-scrollbar-track,
[data-theme="light"]::-webkit-scrollbar-track {
    background: transparent;
}

.onboarding-form-container::-webkit-scrollbar-thumb,
.form-container::-webkit-scrollbar-thumb,
.white-container::-webkit-scrollbar-thumb,
.content-box::-webkit-scrollbar-thumb,
.modal-content::-webkit-scrollbar-thumb,
.dropdown-options::-webkit-scrollbar-thumb,
[data-theme="light"]::-webkit-scrollbar-thumb {
    background: #cbd5e0;
    border-radius: 10px;
}

.onboarding-form-container::-webkit-scrollbar-thumb:hover,
.form-container::-webkit-scrollbar-thumb:hover,
.white-container::-webkit-scrollbar-thumb:hover,
.content-box::-webkit-scrollbar-thumb:hover,
.modal-content::-webkit-scrollbar-thumb:hover,
.dropdown-options::-webkit-scrollbar-thumb:hover,
[data-theme="light"]::-webkit-scrollbar-thumb:hover {
    background: #a0aec0;
}

/* ==========================================
   CAMPOS DE FORMULÁRIO
   ========================================== */

/* Campos de seleção e textarea com scroll */
textarea,
select[multiple],
.multiselect-container {
    scrollbar-width: thin;
    scrollbar-color: #cbd5e0 transparent;
}

textarea::-webkit-scrollbar,
select[multiple]::-webkit-scrollbar,
.multiselect-container::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

textarea::-webkit-scrollbar-track,
select[multiple]::-webkit-scrollbar-track,
.multiselect-container::-webkit-scrollbar-track {
    background: transparent;
}

textarea::-webkit-scrollbar-thumb,
select[multiple]::-webkit-scrollbar-thumb,
.multiselect-container::-webkit-scrollbar-thumb {
    background: #cbd5e0;
    border-radius: 10px;
}

textarea::-webkit-scrollbar-thumb:hover,
select[multiple]::-webkit-scrollbar-thumb:hover,
.multiselect-container::-webkit-scrollbar-thumb:hover {
    background: #a0aec0;
}

/* ==========================================
   MODAIS E POPUPS
   ========================================== */

.modal-body,
.popup-content,
.toast-container {
    scrollbar-width: thin;
    scrollbar-color: #cbd5e0 transparent;
}

.modal-body::-webkit-scrollbar,
.popup-content::-webkit-scrollbar,
.toast-container::-webkit-scrollbar {
    width: 6px;
}

.modal-body::-webkit-scrollbar-track,
.popup-content::-webkit-scrollbar-track,
.toast-container::-webkit-scrollbar-track {
    background: transparent;
}

.modal-body::-webkit-scrollbar-thumb,
.popup-content::-webkit-scrollbar-thumb,
.toast-container::-webkit-scrollbar-thumb {
    background: #cbd5e0;
    border-radius: 10px;
}

.modal-body::-webkit-scrollbar-thumb:hover,
.popup-content::-webkit-scrollbar-thumb:hover,
.toast-container::-webkit-scrollbar-thumb:hover {
    background: #a0aec0;
}

/* ==========================================
   RESPONSIVIDADE MOBILE
   ========================================== */

@media (max-width: 768px) {
    /* Scrollbars um pouco menores no mobile */
    body::-webkit-scrollbar,
    *::-webkit-scrollbar {
        width: 4px;
        height: 4px;
    }
    
    .onboarding-form-container::-webkit-scrollbar,
    .form-container::-webkit-scrollbar,
    textarea::-webkit-scrollbar,
    select[multiple]::-webkit-scrollbar {
        width: 4px;
        height: 4px;
    }
}

/* ==========================================
   CONTAINERS ESPECÍFICOS DE FORMULÁRIOS
   ========================================== */

/* Dropdown do seletor DDI */
.countries-dropdown,
.ddi-dropdown {
    scrollbar-width: thin;
    scrollbar-color: #cbd5e0 transparent;
}

.countries-dropdown::-webkit-scrollbar,
.ddi-dropdown::-webkit-scrollbar {
    width: 6px;
}

.countries-dropdown::-webkit-scrollbar-track,
.ddi-dropdown::-webkit-scrollbar-track {
    background: transparent;
}

.countries-dropdown::-webkit-scrollbar-thumb,
.ddi-dropdown::-webkit-scrollbar-thumb {
    background: #cbd5e0;
    border-radius: 10px;
}

.countries-dropdown::-webkit-scrollbar-thumb:hover,
.ddi-dropdown::-webkit-scrollbar-thumb:hover {
    background: #a0aec0;
}

/* Listas de opções customizadas */
.custom-options,
.options-list {
    scrollbar-width: thin;
    scrollbar-color: #cbd5e0 transparent;
}

.custom-options::-webkit-scrollbar,
.options-list::-webkit-scrollbar {
    width: 6px;
}

.custom-options::-webkit-scrollbar-track,
.options-list::-webkit-scrollbar-track {
    background: transparent;
}

.custom-options::-webkit-scrollbar-thumb,
.options-list::-webkit-scrollbar-thumb {
    background: #cbd5e0;
    border-radius: 10px;
}

.custom-options::-webkit-scrollbar-thumb:hover,
.options-list::-webkit-scrollbar-thumb:hover {
    background: #a0aec0;
}