/* ==========================================================================
   1. Utilitários Gerais
   ========================================================================== */

.readonly {
    background-color: #e8e8e8;
    pointer-events: none !important;
    cursor: not-allowed !important;
}



/* ==========================================================================
   2. Validação de Senha
   ========================================================================== */

#password-contain p {
    padding-right: 13px;
}

#password-contain p.valid {
    color: #0ab39c;
}

#password-contain p.valid::before {
    position: relative;
    content: "✔";
}

#password-contain p.invalid {
    color: #f06548;
}

#password-contain p.invalid::before {
    position: relative;
    content: "✖";
}



/* ==========================================================================
   3. Botões
   ========================================================================== */

/* Sombra no foco/hover */
.btn-primary:focus,
.btn-primary:hover {
    box-shadow: 0 0 0 3px rgba(41, 86, 164, 0.4) !important;
}

.btn-secondary:focus,
.btn-secondary:hover {
    box-shadow: 0 0 0 3px rgba(250, 170, 49, 0.5) !important;
}

.btn-light:focus,
.btn-light:hover {
    box-shadow: 0 0 0 3px rgba(238, 238, 238, 0.6) !important;
}



/* ==========================================================================
   4. DataTables
   ========================================================================== */

/* Fix: dataTables.bootstrap5.css aplica background-color: var(--bs-table-bg) em todos os descendentes da
   tabela, tornando o dropdown-menu transparente. Style.css também define z-index: 2 no dropdown-menu,
   que fica atrás das linhas da tabela. */
.dataTables_wrapper .dropdown-menu {
    background-color: #fff;
    z-index: 1055;
    border-radius: 12px !important;
    overflow: hidden;
}

/* Fix: style.css define `.dataTables_wrapper button { color: #fff }` para os botões de controle da tabela,
   mas essa regra vaza para botões de ação dentro das células td. Aqui restauramos as cores corretas
   para cada variante btn-outline dentro de td — modo claro. */
body:not(.dark-only) .dataTables_wrapper tbody td .btn-outline-primary {
    color: #2956a4;
}

body:not(.dark-only) .dataTables_wrapper tbody td .btn-outline-secondary {
    color: #838383;
}

body:not(.dark-only) .dataTables_wrapper tbody td .btn-outline-success {
    color: #65c15c;
}

body:not(.dark-only) .dataTables_wrapper tbody td .btn-outline-danger {
    color: #fc564a;
}

body:not(.dark-only) .dataTables_wrapper tbody td .btn-outline-warning {
    color: #ffc107;
}

body:not(.dark-only) .dataTables_wrapper tbody td .btn-outline-info {
    color: #40b8f5;
}

body:not(.dark-only) .dataTables_wrapper tbody td .btn-outline-dark {
    color: #212529;
}

body:not(.dark-only) .dataTables_wrapper tbody td .btn-outline-light {
    color: #f8f9fa;
}

body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-primary:hover,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-primary:active,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-primary:focus,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-primary.show,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-secondary:hover,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-secondary:active,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-secondary:focus,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-secondary.show,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-success:hover,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-success:active,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-success:focus,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-success.show,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-danger:hover,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-danger:active,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-danger:focus,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-danger.show,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-warning:hover,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-warning:active,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-warning:focus,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-warning.show,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-info:hover,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-info:active,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-info:focus,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-info.show,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-dark:hover,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-dark:active,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-dark:focus,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-dark.show,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-light:hover,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-light:active,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-light:focus,
body:not(.dark-only) .dataTables_wrapper tbody td .btn.btn-outline-light.show {
    color: #fff !important;
}

/* Cores dos btn-outline dentro das células td — modo escuro */
body.dark-only .dataTables_wrapper tbody td .btn-outline-primary {
    color: #7366ff !important;
}

body.dark-only .dataTables_wrapper tbody td .btn-outline-secondary {
    color: #b3b3b3 !important;
}

body.dark-only .dataTables_wrapper tbody td .btn-outline-success {
    color: #65c15c !important;
}

body.dark-only .dataTables_wrapper tbody td .btn-outline-danger {
    color: #fc564a !important;
}

body.dark-only .dataTables_wrapper tbody td .btn-outline-warning {
    color: #ffc107 !important;
}

body.dark-only .dataTables_wrapper tbody td .btn-outline-info {
    color: #40b8f5 !important;
}

body.dark-only .dataTables_wrapper tbody td .btn-outline-dark {
    color: #e9ecef !important;
}

body.dark-only .dataTables_wrapper tbody td .btn-outline-light {
    color: #2b2b36 !important;
}

/* Hover — modo escuro (amarelo pede texto escuro, demais pedem texto branco) */
body.dark-only .dataTables_wrapper tbody td .btn.btn-outline-primary:hover,
body.dark-only .dataTables_wrapper tbody td .btn.btn-outline-primary:active,
body.dark-only .dataTables_wrapper tbody td .btn.btn-outline-primary:focus,
body.dark-only .dataTables_wrapper tbody td .btn.btn-outline-secondary:hover,
body.dark-only .dataTables_wrapper tbody td .btn.btn-outline-secondary:active,
body.dark-only .dataTables_wrapper tbody td .btn.btn-outline-secondary:focus,
body.dark-only .dataTables_wrapper tbody td .btn.btn-outline-success:hover,
body.dark-only .dataTables_wrapper tbody td .btn.btn-outline-success:active,
body.dark-only .dataTables_wrapper tbody td .btn.btn-outline-success:focus,
body.dark-only .dataTables_wrapper tbody td .btn.btn-outline-danger:hover,
body.dark-only .dataTables_wrapper tbody td .btn.btn-outline-danger:active,
body.dark-only .dataTables_wrapper tbody td .btn.btn-outline-danger:focus,
body.dark-only .dataTables_wrapper tbody td .btn.btn-outline-info:hover,
body.dark-only .dataTables_wrapper tbody td .btn.btn-outline-info:active,
body.dark-only .dataTables_wrapper tbody td .btn.btn-outline-info:focus,
body.dark-only .dataTables_wrapper tbody td .btn.btn-outline-dark:hover,
body.dark-only .dataTables_wrapper tbody td .btn.btn-outline-dark:active,
body.dark-only .dataTables_wrapper tbody td .btn.btn-outline-dark:focus {
    color: #fff !important;
}

body.dark-only .dataTables_wrapper tbody td .btn.btn-outline-warning:hover,
body.dark-only .dataTables_wrapper tbody td .btn.btn-outline-warning:active,
body.dark-only .dataTables_wrapper tbody td .btn.btn-outline-warning:focus,
body.dark-only .dataTables_wrapper tbody td .btn.btn-outline-light:hover,
body.dark-only .dataTables_wrapper tbody td .btn.btn-outline-light:active,
body.dark-only .dataTables_wrapper tbody td .btn.btn-outline-light:focus {
    color: #000 !important;
}



/* ==========================================================================
   5. Tabela
   ========================================================================== */

/* Reduz o padding das células */
.table td.grupo-acesso {
    padding: 0.2rem 0.85rem !important;
}

/* Hover — modo claro */
body:not(.dark-only) .table {
    --bs-table-hover-bg: #fafafa !important;
}

body:not(.dark-only) .table thead.dataTable-head {
    background-color: #f7f8f9;
}

/* Hover — modo escuro */
body.dark-only .table {
    --bs-table-hover-bg: rgba(255, 255, 255, 0.05) !important;
}

body.dark-only .table thead.dataTable-head {
    background-color: rgba(255, 255, 255, 0.03);
}

/* Striped — modo escuro */
body.dark-only .table-striped tbody tr:nth-of-type(odd)>* {
    background-color: #21232b !important;
}



/* ==========================================================================
   6. Dark Mode — Componentes
   ========================================================================== */

/* form-select */
body.dark-only .form-select {
    background-color: #262932;
    border: 1px solid #374558;
}

/* Sidebar: item ativo com texto branco */
body.dark-only .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links .simplebar-wrapper .simplebar-mask .simplebar-content-wrapper .simplebar-content>li .sidebar-link.active span,
body.dark-sidebar .page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links .simplebar-wrapper .simplebar-mask .simplebar-content-wrapper .simplebar-content>li .sidebar-link.active span {
    color: #fff !important;
}

/* Vanilla Smart Select */
body.dark-only .vs-container--default .vs-selection {
    background-color: transparent;
    border-color: rgba(255, 255, 255, 0.1);
    color: #e9ecef;
}

body.dark-only .vs-container--default.vs-container--disabled .vs-selection {
    background-color: rgba(255, 255, 255, 0.02);
    border-color: rgba(255, 255, 255, 0.05);
}

body.dark-only .vs-dropdown.vs-container--default {
    background-color: #2b2b36;
    border-color: rgba(255, 255, 255, 0.1);
}

body.dark-only .vs-dropdown.vs-container--default .vs-search {
    border-bottom-color: rgba(255, 255, 255, 0.1);
    color: #e9ecef;
    background-color: transparent;
}

body.dark-only .vs-dropdown.vs-container--default .vs-search:focus {
    color: #fff;
    background-color: transparent;
}

body.dark-only .vs-dropdown.vs-container--default .vs-result {
    color: #e9ecef;
}

body.dark-only .vs-dropdown.vs-container--default .vs-result:hover {
    background-color: rgba(255, 255, 255, 0.05);
    color: #fff;
}

body.dark-only .vs-dropdown.vs-container--default .vs-result[aria-selected=true] {
    background-color: rgba(255, 255, 255, 0.1);
    color: #fff;
}

body.dark-only .vs-dropdown.vs-container--default .vs-result--highlighted {
    background-color: #2956a4;
    color: #fff;
}

body.dark-only .vs-dropdown.vs-container--default .vs-results--loading,
body.dark-only .vs-dropdown.vs-container--default .vs-results--no-results {
    color: #adb5bd;
}

body.dark-only .vs-container--default .vs-selection__placeholder {
    color: #adb5bd;
}

body.dark-only .vs-container--default .vs-selection__clear {
    color: #adb5bd;
}




/* ==========================================================================
   7. Sidebar — Abertura Compacta via Hover
   ========================================================================== */

/* 1. Largura e sombra */
.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper.close_icon {
    width: 80px !important;
    transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.4s ease !important;
}

.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper.close_icon:hover {
    width: 265px !important;
    box-shadow: 0 0 25px rgba(0, 0, 0, 0.15) !important;
    transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.4s ease !important;
    height: 100% !important;
}

/* 2. Largura máxima dos itens de menu */
.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper.close_icon .sidebar-main .sidebar-links .simplebar-wrapper .simplebar-mask .simplebar-content-wrapper .simplebar-content>li {
    max-width: 80px !important;
    transition: max-width 0.4s cubic-bezier(0.4, 0, 0.2, 1), margin 0.4s ease !important;
}

.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper.close_icon:hover .sidebar-main .sidebar-links .simplebar-wrapper .simplebar-mask .simplebar-content-wrapper .simplebar-content>li {
    max-width: 265px !important;
    margin: initial !important;
    transition: max-width 0.4s cubic-bezier(0.4, 0, 0.2, 1), margin 0.4s ease !important;
}

/* 3. Textos dos itens do menu */
.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper.close_icon .sidebar-main .sidebar-links .simplebar-wrapper .simplebar-mask .simplebar-content-wrapper .simplebar-content>li a span {
    display: inline-block !important;
    opacity: 0;
    visibility: hidden;
    max-width: 0;
    overflow: hidden;
    white-space: nowrap;
    transition: opacity 0.25s ease, max-width 0.25s ease, visibility 0.25s ease !important;
}

.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper.close_icon:hover .sidebar-main .sidebar-links .simplebar-wrapper .simplebar-mask .simplebar-content-wrapper .simplebar-content>li a span {
    opacity: 1;
    visibility: visible;
    max-width: 150px;
    transition: opacity 0.3s ease 0.15s, max-width 0.3s ease 0.15s, visibility 0.3s ease 0.15s !important;
}

/* 4. Títulos de seção */
.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper.close_icon .sidebar-main-title {
    display: block !important;
    opacity: 0;
    visibility: hidden;
    max-height: 0;
    padding: 0 20px !important;
    margin: 0 !important;
    overflow: hidden;
    white-space: nowrap;
    transition: opacity 0.25s ease, max-height 0.25s ease, visibility 0.25s ease, padding 0.25s ease, margin 0.25s ease !important;
}

.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper.close_icon:hover .sidebar-main-title {
    opacity: 1;
    visibility: visible;
    max-height: 50px;
    padding: 25px 0 6px 20px !important;
    margin-top: 10px !important;
    transition: opacity 0.3s ease 0.15s, max-height 0.3s ease 0.15s, visibility 0.3s ease 0.15s, padding 0.3s ease 0.15s, margin 0.3s ease 0.15s !important;
}

/* 5. Submenus */
.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper.close_icon .sidebar-main .sidebar-links .sidebar-list .sidebar-title.active~.sidebar-submenu {
    display: none !important;
}

.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper.close_icon:hover .sidebar-main .sidebar-links .sidebar-list .sidebar-title.active~.sidebar-submenu {
    display: block !important;
}

/* 6. Setas (.according-menu) */
.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper.close_icon .according-menu {
    display: block !important;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.25s ease, visibility 0.25s ease !important;
}

.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper.close_icon:hover .according-menu {
    opacity: 1;
    visibility: visible;
    transition: opacity 0.3s ease 0.15s, visibility 0.3s ease 0.15s !important;
}

/* 7. Badges */
.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper.close_icon .badge {
    opacity: 0;
    max-width: 0;
    padding: 0 !important;
    overflow: hidden;
    transition: opacity 0.25s ease, max-width 0.25s ease, padding 0.25s ease !important;
}

.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper.close_icon:hover .badge {
    opacity: 1;
    max-width: 50px;
    padding: 0.45em 0.8em 0.33em !important;
    transition: opacity 0.3s ease 0.15s, max-width 0.3s ease 0.15s, padding 0.3s ease 0.15s !important;
}

/* 8. Logos */
.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper.close_icon .logo-wrapper {
    display: none !important;
}

.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper.close_icon:hover .logo-wrapper {
    display: block !important;
    animation: sidebarFadeIn 0.3s ease forwards;
}

.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper.close_icon .logo-icon-wrapper {
    display: block !important;
    animation: sidebarFadeIn 0.3s ease forwards;
}

.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper.close_icon:hover .logo-icon-wrapper {
    display: none !important;
}

@keyframes sidebarFadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }
}



/* ==========================================================================
   8. Layout — Sticky Footer
   ========================================================================== */

.page-wrapper .page-body-wrapper {
    display: flex !important;
    flex-direction: column !important;
    min-height: 100vh !important;
}

.page-wrapper.compact-wrapper .page-body-wrapper .page-body {
    flex: 1 0 auto !important;
    min-height: auto !important;
}

/* z-index baixo para o sidebar (z-index: 9) passar por cima ao dar hover */
.page-wrapper .page-body-wrapper .footer {
    flex-shrink: 0 !important;
    margin-top: auto !important;
    z-index: 1 !important;
}

/* ==========================================================================
   Busca de Atalhos (Topbar Search)
   ========================================================================== */

/* Spinner oculto por padrão; JS adiciona .ativo para mostrar durante o fetch */
.Typeahead-spinner {
    display: none;
}

.Typeahead-spinner.ativo {
    display: block;
}

/* Itens de resultado */
.Typeahead-menu .ProfileCard {
    padding: 10px 16px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    cursor: pointer;
    transition: background-color 0.15s;
}

.Typeahead-menu .ProfileCard:last-child {
    border-bottom: none;
}

.Typeahead-menu .ProfileCard:hover,
.Typeahead-menu .ProfileCard.selecionado {
    background-color: rgba(0, 0, 0, 0.05);
}

.Typeahead-menu .ProfileCard-badge {
    display: inline-block;
    font-size: 0.7rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #7366ff;
    background-color: rgba(115, 102, 255, 0.1);
    border-radius: 4px;
    padding: 1px 6px;
    margin-right: 8px;
}

.Typeahead-menu .ProfileCard-realName {
    font-size: 0.875rem;
    color: #2c323f;
}

/* Mensagem de nenhum resultado */
.Typeahead-menu .EmptyMessage {
    padding: 12px 16px;
    font-size: 0.85rem;
    color: #888;
    text-align: center;
}

/* Modo escuro */
body.dark-only .Typeahead-menu .ProfileCard {
    border-bottom-color: rgba(255, 255, 255, 0.08);
}

body.dark-only .Typeahead-menu .ProfileCard:hover,
body.dark-only .Typeahead-menu .ProfileCard.selecionado {
    background-color: rgba(255, 255, 255, 0.05);
}

body.dark-only .Typeahead-menu .ProfileCard-realName {
    color: rgba(255, 255, 255, 0.85);
}

body.dark-only .Typeahead-menu .EmptyMessage {
    color: rgba(255, 255, 255, 0.45);
}



/* ==========================================================================
   Correção padding header
   ========================================================================== */

.page-wrapper .page-header .header-wrapper {
    padding: 18px 30px !important;
}



/* ==========================================================================
   11. Tabs com erro de validação
   ========================================================================== */

/* Dot indicador vermelho após o texto da tab */
.nav-pills .nav-link.tab-has-error::after {
    content: '';
    display: inline-block;
    width: 8px;
    height: 8px;
    background-color: #dc3545;
    border-radius: 50%;
    margin-left: 8px;
    vertical-align: middle;
    flex-shrink: 0;
}

/* Tab inativa com erro: texto e borda vermelhos */
.nav-pills .nav-link.tab-has-error:not(.active) {
    color: #dc3545 !important;
    border: 1px solid rgba(220, 53, 69, 0.4);
}

/* Tab ativa com erro: dot com borda branca para contraste com o fundo azul */
.nav-pills .nav-link.tab-has-error.active::after {
    border: 2px solid white;
    width: 10px;
    height: 10px;
}

/* Widget KPI background */
.card-kpi-bg {
    background-image: url(../images/widget-bg.png);
    background-size: cover;
}

body.dark-only .card-kpi-bg {
    background-blend-mode: color-burn;
}



/* ==========================================================================
   12. Vanilla Smart Select — Estado is-invalid
   ==========================================================================
   O VSS oculta o <select> nativo e insere .vs-container--default como
   próximo irmão imediato (insertBefore(container, select.nextSibling)).
   Por isso usamos o seletor adjacente (+) para propagar a borda vermelha
   do Bootstrap ao widget visual do VSS.
   ========================================================================== */

/* Modo claro */
select.is-invalid+.vs-container--default .vs-selection {
    border-color: #dc3545 !important;
    /* box-shadow: 0 0 0 0.1rem rgba(220, 53, 69, 0.25) !important; */
}

/* Modo escuro */
body.dark-only select.is-invalid+.vs-container--default .vs-selection {
    border-color: #dc3545 !important;
    /* box-shadow: 0 0 0 0.1rem rgba(220, 53, 69, 0.25) !important; */
}



/* ==========================================================================
   13. Dark Mode — Modal
   ==========================================================================
   O style.css tem regras com maior especificidade para .modal-content que
   sobrescrevem os estilos gerais de dark mode de .form-control e .form-select.
   Este bloco reestabelece as cores corretas para todos os controles de formulário
   dentro de qualquer modal quando o dark mode está ativo.
   ========================================================================== */

/* Inputs e textareas */
body.dark-only .modal .form-control {
    background-color: #262932 !important;
    border-color: #374558 !important;
    color: rgba(255, 255, 255, 0.6) !important;
}

body.dark-only .modal .form-control::placeholder {
    color: rgba(255, 255, 255, 0.25) !important;
}

body.dark-only .modal .form-control:focus {
    background-color: #262932 !important;
    border-color: #2956a4 !important;
    color: rgba(255, 255, 255, 0.8) !important;
}

/* Selects nativos */
body.dark-only .modal .form-select {
    background-color: #262932 !important;
    border-color: #374558 !important;
    color: rgba(255, 255, 255, 0.6) !important;
}

/* Labels */
body.dark-only .modal .form-label {
    color: rgba(255, 255, 255, 0.7);
}


/* ==========================================================================
    14. Costumização de font nos form-controls
   ========================================================================== */

.form-control {
    font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, sans-serif;
    font-size: 14px;
    line-height: 1.75;
}

.form-control::placeholder {
    color: #9ca3af;
}

.vs-container--default .vs-selection__placeholder {
    color: #9ca3af;
}

/* ==========================================================================
    15. Sidebar — desabilita capitalize automático do template
   ========================================================================== */

.page-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links .simplebar-wrapper .simplebar-mask .simplebar-content-wrapper .simplebar-content li a,
.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links li a span,
.page-wrapper.compact-sidebar .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links li a span {
    text-transform: none;
}


/* Sidebarsubmenu */
.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links .simplebar-wrapper .simplebar-mask .simplebar-content-wrapper .simplebar-content>li .sidebar-submenu li a {
    font-weight: normal !important;
}

/* Sidebar submenu ativo */
.page-wrapper.compact-wrapper .page-body-wrapper div.sidebar-wrapper .sidebar-main .sidebar-links .simplebar-wrapper .simplebar-mask .simplebar-content-wrapper .simplebar-content>li .sidebar-submenu li a.active {
    color: #fff !important;
}

/* ==========================================================================
   16. Checkboxes — alinhamento vertical
   ========================================================================== */

/* Centraliza verticalmente o checkbox (quadrado) na linha do label.
   Não usar `padding`: o .form-check-input usa appearance:none + box-sizing:border-box
   com tamanho fixo (1em), e padding deformaria o quadradinho. Os toggle switches
   (.form-switch) ficam de fora. */
.form-check:not(.form-switch) .form-check-input[type="checkbox"] {
    margin-top: 5px;
}

/* ==========================================================================
   17. Select de Marca — logo da marca
   ========================================================================== */

.marca-logo-thumb {
    width: 20px;
    height: 20px;
    object-fit: contain;
    margin-right: 8px;
    vertical-align: middle;
}