/* --- 1. Inputs, Textareas e Selects --- */
form[class*="forminator-"] .forminator-input,
form[class*="forminator-"] .forminator-textarea,
form[class*="forminator-"] .forminator-select {
    display: block !important;
    width: 100% !important;
    padding: 0.8rem 0.75rem !important;
    font-size: 1rem !important;
    color: #212529 !important;
    background-color: #fff !important;
    /* Borda primária sutil no estado normal */
    border: 1px solid var(--bs-primary) !important; 
    border-radius: 0.375rem !important;
    appearance: none !important;
    transition: all 0.2s ease-in-out !important;
}

/* Foco: Borda da cor primária e sombra brilhante primária */
form[class*="forminator-"] .forminator-input:focus,
form[class*="forminator-"] .forminator-textarea:focus,
form[class*="forminator-"] .forminator-select:focus {
    border-color: var(--bs-primary) !important;
    outline: 0 !important;
    /* Cria aquele brilho azul (ou da sua cor primária) ao redor do input */
    box-shadow: 0 0 0 0.25rem rgba(var(--bs-primary-rgb), 0.25) !important;
}

/* --- 2. Botões --- */
.forminator-button {
    background-color: var(--bs-primary) !important;
    border: 1px solid var(--bs-primary) !important;
    color: #fff !important;
    border-radius: 0.375rem !important;
    padding: 0.8rem 1.25rem !important;
    transition: all 0.2s ease-in-out !important;
}

.forminator-button:hover {
    background-color: var(--bs-primary) !important;
    filter: brightness(0.9); /* Escurece levemente o botão no hover */
    color: #fff !important;
}

/* --- 3. Checkbox Primário --- */
.forminator-checkbox .forminator-checkbox-input:checked + .forminator-checkbox-box {
    background-color: var(--bs-primary) !important;
    border-color: var(--bs-primary) !important;
}

/* Estilo para a mensagem de erro do Forminator */
.forminator-error-message {
    display: block; /* Garante que o Bootstrap mostre a mensagem */
    width: 100%;
    margin-top: 0.25rem;
    font-size: 0.875em; /* Tamanho padrão do Bootstrap para feedback */
    color: var(--bs-danger); /* Usa a cor de erro do seu Bootstrap */
}

/* Adiciona a borda vermelha ao input quando houver erro */
.forminator-field.forminator-has-error .form-control {
    border-color: var(--bs-danger) !important;
    padding-right: calc(1.5em + 0.75rem);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' width='12' height='12' fill='none' stroke='%23dc3545'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right calc(0.375em + 0.1875rem) center;
    background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}

/* 1. Estilização das Abas (Pills) */
.nav-pills .nav-link.active {
    background-color: var(--bs-primary) !important;
    color: #ffffff !important;
}

.nav-pills .nav-link {
    color: var(--bs-primary);
    border: 1px solid var(--bs-primary);
}

.nav-pills .nav-link:hover {
    background-color: var(--bs-primary);
    color: #ffffff;
}

/* 1. Força a cor de fundo branca e a borda no menu do Select2 */
/* 1. O container que de fato é a janela flutuante */
.select2-dropdown {
    background-color: #ffffff !important;
    border: 1px solid #ced4da !important;
    border-radius: 0.375rem !important;
    overflow: hidden !important; /* Garante que os cantos arredondados funcionem */
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
    z-index: 99999 !important;
}

/* 2. Força o fundo branco na lista de resultados */
.select2-results {
    background-color: #ffffff !important;
}

.select2-results__options {
    background-color: #ffffff !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* 3. Estilização de cada item da lista */
.select2-results__option {
    background-color: #ffffff !important;
    color: #212529 !important;
    padding: 0.5rem 1rem !important;
    cursor: pointer !important;
}

/* 4. Estilo do item selecionado (hover) com sua cor primária */
.select2-results__option--highlighted {
    background-color: var(--bs-primary) !important;
    color: #ffffff !important;
}

/* 5. Caso o item já esteja selecionado no form */
.select2-results__option[aria-selected="true"] {
    background-color: #e9ecef !important; /* Um cinza claro para indicar seleção */
    color: #212529 !important;
}