/* * Modo escuro do Folha (ativado por js/folha-preferencias.js com ) * e janela de Aparência (tema e tamanho da fonte). * * Este arquivo cobre o esqueleto e os componentes comuns, com os estados de hover/foco. * O restante das telas recebe o ajuste automático do script, que escurece fundos claros * mantendo o matiz, preserva as cores de status e garante contraste mínimo de 4,5:1 no texto. * Paleta igual à da Central de Regulação. */ :root { --ge-fundo: #101113; --ge-superficie: #1b1d20; --ge-elevada: #24272b; --ge-campo: #15171a; --ge-texto: #e6e8eb; --ge-discreto: #b0b5bd; --ge-borda: #373c43; --ge-acento: #8fd0d0; --ge-suave: #1f3438; --ge-hover: #2a4347; --ge-foco: #6fc0c0; } /* ===================================================================== * Janela de Aparência (modo claro/escuro e tamanho da fonte) — os dois temas * ===================================================================== */ :where(:root[data-tema="escuro"]) :where(:root[data-tema="escuro"]) .fl-fonte-painel { position: fixed; inset: 0; margin: auto; box-sizing: border-box; width: min(440px, calc(100vw - 32px)); max-width: calc(100vw - 32px); max-height: calc(100dvh - 32px); overflow: auto; padding: 20px 22px; border: 1px solid #d9e7e8; border-radius: 14px; color: #33535a; background: #fff; box-shadow: 0 18px 50px rgba(12, 45, 50, .28); font-family: "Source Sans Pro", "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 14px; line-height: 1.45; } .fl-fonte-painel::backdrop { background: rgba(8, 35, 38, .48); } .fl-fonte-painel header { display: flex; align-items: center; justify-content: space-between; gap: 12px; } .fl-fonte-painel h2 { margin: 0; color: #174a52; font-size: 19px; font-weight: 700; } .fl-fonte-painel h2 i { margin-right: 6px; color: #37727b; } .fl-fonte-painel p { margin: 10px 0 18px; color: #6a8184; font-size: 13px; line-height: 1.55; } .fl-tema-opcoes { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 12px 0 20px; } .fl-tema-opcoes button { display: flex; align-items: center; justify-content: center; gap: 8px; } .fl-tema-opcoes button[aria-pressed="true"], .fl-tema-opcoes button[aria-pressed="true"]:hover:not(:disabled) { border-color: #1d5b64; color: #fff; background: #1d5b64; } .fl-fonte-painel .fl-aparencia-rotulo { display: block; margin: 0; font-weight: 600; } .fl-fonte-painel label { display: block; margin: 0; font-weight: 600; } .fl-fonte-painel output { display: block; margin-top: 2px; color: #1d5b64; font-size: 13px; font-weight: 600; } .fl-fonte-controle { display: flex; align-items: center; gap: 10px; margin-top: 12px; } .fl-fonte-controle input[type=range] { flex: 1; min-width: 0; height: 32px; margin: 0; accent-color: #1d5b64; cursor: pointer; } .fl-fonte-painel button { min-width: 44px; min-height: 40px; box-sizing: border-box; padding: 8px 12px; border: 1px solid #d3e3e4; border-radius: 9px; color: #1d5b64; background: #f4f9f9; font: inherit; font-weight: 600; line-height: 1.3; cursor: pointer; white-space: normal; } .fl-fonte-painel button:hover:not(:disabled) { border-color: #9cc7c9; background: #e4f2f2; } .fl-fonte-painel button:disabled { opacity: .45; cursor: default; } .fl-fonte-painel .fl-fonte-principal { border-color: #1d5b64; color: #fff; background: #1d5b64; } .fl-fonte-painel .fl-fonte-principal:hover:not(:disabled) { border-color: #174a52; background: #174a52; } .fl-fonte-painel .fl-fonte-fechar { min-width: 36px; min-height: 36px; padding: 0; font-size: 22px; line-height: 1; } .fl-fonte-painel :focus-visible { outline: 2px solid #6ab1b5; outline-offset: 3px; } .fl-fonte-legenda { display: flex; justify-content: space-between; gap: 12px; margin-top: 8px; color: #6a8184; font-size: 12px; } .fl-fonte-painel footer { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 10px; margin-top: 20px; } @media (max-width: 600px) { .fl-fonte-painel { padding: 16px; } .fl-fonte-painel footer { flex-direction: column; } .fl-fonte-painel footer button { width: 100%; } } :where(:root[data-tema="escuro"]) .fl-fonte-painel { border-color: var(--ge-borda); color: var(--ge-texto); background: var(--ge-superficie); box-shadow: 0 18px 50px rgba(0, 0, 0, .5); } :where(:root[data-tema="escuro"]) .fl-fonte-painel::backdrop { background: rgba(0, 0, 0, .6); } :where(:root[data-tema="escuro"]) .fl-fonte-painel h2 { color: var(--ge-texto); } :where(:root[data-tema="escuro"]) .fl-fonte-painel h2 i, :where(:root[data-tema="escuro"]) .fl-fonte-painel output { color: var(--ge-acento); } :where(:root[data-tema="escuro"]) .fl-fonte-painel p, :where(:root[data-tema="escuro"]) .fl-fonte-legenda { color: var(--ge-discreto); } :where(:root[data-tema="escuro"]) .fl-fonte-painel button { border-color: var(--ge-borda); color: var(--ge-acento); background: var(--ge-elevada); } :where(:root[data-tema="escuro"]) .fl-fonte-painel button:hover:not(:disabled) { border-color: #4b7478; background: var(--ge-hover); } :where(:root[data-tema="escuro"]) .fl-tema-opcoes button[aria-pressed="true"], :where(:root[data-tema="escuro"]) .fl-tema-opcoes button[aria-pressed="true"]:hover:not(:disabled) { border-color: #37808a; color: #fff; background: #2c6a73; } :where(:root[data-tema="escuro"]) .fl-fonte-painel .fl-fonte-principal { border-color: #37808a; color: #fff; background: #2c6a73; } :where(:root[data-tema="escuro"]) .fl-fonte-controle input[type=range] { accent-color: var(--ge-acento); } /* O header tem altura fixa (50px): não acompanha o tamanho da fonte, nem por herança do body. */ :root[data-fl-fonte]:not([data-fl-fonte="0"]) .main-header { font-size: 14px; } /* Com fonte maior, a sidebar aberta alarga 8px por nível (como na Central de Regulação), para os nomes do menu não encostarem na seta. Recolhida ou no celular, nada muda. */ @media (min-width: 768px) { :root[data-fl-fonte]:not([data-fl-fonte="0"]) body.sidebar-mini:not(.sidebar-collapse) .main-sidebar, :root[data-fl-fonte]:not([data-fl-fonte="0"]) body.sidebar-mini:not(.sidebar-collapse) .main-header .logo { width: calc(230px + var(--fl-fonte-acrescimo) * 8); } :root[data-fl-fonte]:not([data-fl-fonte="0"]) body.sidebar-mini:not(.sidebar-collapse) .content-wrapper, :root[data-fl-fonte]:not([data-fl-fonte="0"]) body.sidebar-mini:not(.sidebar-collapse) .main-footer, :root[data-fl-fonte]:not([data-fl-fonte="0"]) body.sidebar-mini:not(.sidebar-collapse) .main-header .navbar { margin-left: calc(230px + var(--fl-fonte-acrescimo) * 8); } } /* Campos crescem junto com a fonte (altura fixa do Bootstrap cortaria o texto). */ :root[data-fl-fonte]:not([data-fl-fonte="0"]) .form-control:not(textarea):not([multiple]), :root[data-fl-fonte]:not([data-fl-fonte="0"]) .input-group-addon { height: auto; min-height: 34px; } :root[data-fl-fonte]:not([data-fl-fonte="0"]) .select2-container .select2-selection--single { height: auto; min-height: 34px; } :root[data-fl-fonte]:not([data-fl-fonte="0"]) .select2-container--default .select2-selection--single .select2-selection__rendered { line-height: 1.6; } /* Durante o ajuste do tema (js/folha-preferencias.js) as transições ficam desligadas: a troca de tema é instantânea e o script lê as cores finais, não as do meio da animação. */ [data-fl-ajustando], [data-fl-ajustando] *, [data-fl-ajustando] *::before, [data-fl-ajustando] *::after { transition: none !important; } /* ===================================================================== * Base * ===================================================================== */ :where(:root[data-tema="escuro"]) { color-scheme: dark; background: var(--ge-fundo); scrollbar-color: #5a6068 var(--ge-superficie); } :where(:root[data-tema="escuro"]) body { color: var(--ge-texto); background: var(--ge-fundo); } :where(:root[data-tema="escuro"]) ::selection { color: #fff; background: #2c6a73; } :where(:root[data-tema="escuro"]) hr { border-top-color: var(--ge-borda); } :where(:root[data-tema="escuro"]) .text-muted, :where(:root[data-tema="escuro"]) .help-block { color: var(--ge-discreto); } :where(:root[data-tema="escuro"]) code { color: #f2a7b8; background: #2b2226; } :where(:root[data-tema="escuro"]) pre { color: var(--ge-texto); border-color: var(--ge-borda); background: var(--ge-elevada); } :where(:root[data-tema="escuro"]) .close { color: var(--ge-texto); text-shadow: none; opacity: .75; } :where(:root[data-tema="escuro"]) .close:hover { color: #fff; opacity: 1; } /* ===================================================================== * Esqueleto: header, sidebar, faixa de título e rodapé * ===================================================================== */ :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .content-wrapper, :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .right-side { background-color: var(--ge-fundo); } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .main-header { box-shadow: 0 2px 14px rgba(0, 0, 0, .45); } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .main-header .logo, :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .main-header .logo:hover { background: #0b2024; } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .main-header .navbar { background: linear-gradient(110deg, #0e2a2e 0%, #174a52 60%, #1d5b64 100%); } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .main-header .navbar .dropdown-menu { border-color: var(--ge-borda); background: var(--ge-elevada); box-shadow: 0 12px 30px rgba(0, 0, 0, .5); } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .main-header .navbar .dropdown-menu > li.header, :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .main-header .navbar .user-footer { color: var(--ge-discreto); background: var(--ge-superficie); } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .main-header .navbar .user-footer .btn { border-color: var(--ge-borda); color: var(--ge-acento); background: var(--ge-elevada); } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .main-header .navbar .user-footer .btn:hover { background: var(--ge-hover); } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .main-header .navbar .dropdown-menu > li .menu > li > a { color: var(--ge-texto); border-bottom-color: var(--ge-borda); } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .main-header .navbar .dropdown-menu > li .menu > li > a:hover { background: var(--ge-hover); } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .wrapper, :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .left-side, :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .main-sidebar { background: var(--ge-superficie); } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .main-sidebar { box-shadow: 1px 0 0 var(--ge-borda), 4px 0 14px rgba(0, 0, 0, .3); } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .sidebar a { color: var(--ge-texto); } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .sidebar .user-panel { border-color: var(--ge-borda); background: var(--ge-elevada); } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .sidebar .user-panel > .info > p::before { color: var(--ge-discreto); } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .sidebar .user-panel > .info > p > a { color: #fff; } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .sidebar-form { border-color: var(--ge-borda); background: var(--ge-campo); } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .sidebar-form input[type="text"], :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .sidebar-form input[type="text"]:focus, :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .sidebar-form input[type="text"]:focus + .input-group-btn .btn { color: var(--ge-texto); background: transparent; } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .sidebar-form input[type="text"]::placeholder, :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .sidebar-form .btn { color: var(--ge-discreto); } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .sidebar-form:focus-within { border-color: #4b7478; box-shadow: 0 0 0 3px rgba(111, 192, 192, .16); } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .sidebar-menu > li > a > [class*="fa-"]:first-child { color: #93a4b0; } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .sidebar-menu > li:hover > a { color: #fff; background: var(--ge-elevada); } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .sidebar-menu > li.active > a, :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .sidebar-menu > li.menu-open > a { color: #fff; background: var(--ge-suave); box-shadow: inset 3px 0 0 var(--ge-foco); } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .sidebar-menu > li.active > a > [class*="fa-"]:first-child, :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .sidebar-menu > li.menu-open > a > [class*="fa-"]:first-child, :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .sidebar-menu > li:hover > a > [class*="fa-"]:first-child { color: var(--ge-acento); } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .sidebar-menu > li > .treeview-menu { background: var(--ge-campo); box-shadow: inset 0 0 0 1px var(--ge-borda); } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .sidebar-menu .treeview-menu > li > a { color: var(--ge-discreto); } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .sidebar-menu .treeview-menu > li > a:hover, :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .sidebar-menu .treeview-menu > li.active > a { color: #fff; background: var(--ge-hover); } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .sidebar-menu a.fl-menu-encontrado { color: var(--ge-acento); } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .sidebar-menu > li.fl-menu-vazio { color: var(--ge-discreto); background: var(--ge-elevada); } @media (min-width: 768px) { :where(:root[data-tema="escuro"]) body.sidebar-mini:not(.sidebar-mini-expand-feature).sidebar-collapse .sidebar-menu > li:hover > a > span:not(.pull-right):not(.pull-right-container), :where(:root[data-tema="escuro"]) body.sidebar-mini:not(.sidebar-mini-expand-feature).sidebar-collapse .sidebar-menu > li:hover > .treeview-menu { border-color: var(--ge-borda); background: var(--ge-elevada); box-shadow: 6px 8px 22px rgba(0, 0, 0, .5); } } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .content-header > h1, :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .content-header > h1[style] { color: var(--ge-texto) !important; } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .content-header > .breadcrumb { background: rgba(31, 52, 56, .75); box-shadow: none; } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .content-header > .breadcrumb > li > a { color: var(--ge-acento); } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .content-header > .breadcrumb > li, :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .content-header > .breadcrumb > li:last-child, :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .content-header > .breadcrumb > li + li::before { color: var(--ge-discreto); } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .main-footer { border-top-color: var(--ge-borda); color: var(--ge-discreto); background: var(--ge-superficie); } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .main-footer > strong > a { color: var(--ge-texto); } :where(:root[data-tema="escuro"]) body.skin-personalizada06-light .main-footer > .pull-right { color: var(--ge-acento); background: var(--ge-suave); } /* ===================================================================== * Bootstrap 3 / AdminLTE 2 * ===================================================================== */ :where(:root[data-tema="escuro"]) .box, :where(:root[data-tema="escuro"]) .nav-tabs-custom, :where(:root[data-tema="escuro"]) .info-box, :where(:root[data-tema="escuro"]) .panel, :where(:root[data-tema="escuro"]) .list-group-item, :where(:root[data-tema="escuro"]) .modal-content, :where(:root[data-tema="escuro"]) .popover, :where(:root[data-tema="escuro"]) .thumbnail { color: var(--ge-texto); background-color: var(--ge-superficie); border-color: var(--ge-borda); } :where(:root[data-tema="escuro"]) .box { box-shadow: 0 1px 3px rgba(0, 0, 0, .4); } :where(:root[data-tema="escuro"]) .box.box-default, :where(:root[data-tema="escuro"]) .box-header.with-border, :where(:root[data-tema="escuro"]) .box-footer, :where(:root[data-tema="escuro"]) .modal-header, :where(:root[data-tema="escuro"]) .modal-footer, :where(:root[data-tema="escuro"]) .panel-heading, :where(:root[data-tema="escuro"]) .panel-footer, :where(:root[data-tema="escuro"]) .nav-tabs-custom > .nav-tabs { border-color: var(--ge-borda); } :where(:root[data-tema="escuro"]) .box-footer, :where(:root[data-tema="escuro"]) .panel-footer { background-color: var(--ge-superficie); } :where(:root[data-tema="escuro"]) .box-header, :where(:root[data-tema="escuro"]) .box-header .box-title, :where(:root[data-tema="escuro"]) .box .box-tools .btn-box-tool { color: var(--ge-texto); } :where(:root[data-tema="escuro"]) .box.box-solid.box-default > .box-header, :where(:root[data-tema="escuro"]) .panel-default > .panel-heading { color: var(--ge-texto); background-color: var(--ge-elevada); border-color: var(--ge-borda); } :where(:root[data-tema="escuro"]) .well { background-color: var(--ge-elevada); border-color: var(--ge-borda); box-shadow: none; } :where(:root[data-tema="escuro"]) .table > thead > tr > th, :where(:root[data-tema="escuro"]) .table > tbody > tr > th, :where(:root[data-tema="escuro"]) .table > tfoot > tr > th, :where(:root[data-tema="escuro"]) .table > thead > tr > td, :where(:root[data-tema="escuro"]) .table > tbody > tr > td, :where(:root[data-tema="escuro"]) .table > tfoot > tr > td, :where(:root[data-tema="escuro"]) .table-bordered, :where(:root[data-tema="escuro"]) .table > thead > tr > th { border-color: var(--ge-borda); } :where(:root[data-tema="escuro"]) .table-striped > tbody > tr:nth-of-type(odd) { background-color: rgba(255, 255, 255, .025); } :where(:root[data-tema="escuro"]) .table-hover > tbody > tr:hover, :where(:root[data-tema="escuro"]) table.dataTable tbody tr:hover { background-color: var(--ge-hover); } :where(:root[data-tema="escuro"]) .form-control, :where(:root[data-tema="escuro"]) input[type="text"], :where(:root[data-tema="escuro"]) input[type="search"], :where(:root[data-tema="escuro"]) input[type="number"], :where(:root[data-tema="escuro"]) input[type="email"], :where(:root[data-tema="escuro"]) input[type="password"], :where(:root[data-tema="escuro"]) input[type="tel"], :where(:root[data-tema="escuro"]) input[type="date"], :where(:root[data-tema="escuro"]) input[type="datetime-local"], :where(:root[data-tema="escuro"]) input[type="time"], :where(:root[data-tema="escuro"]) input[type="month"], :where(:root[data-tema="escuro"]) select, :where(:root[data-tema="escuro"]) textarea { color: var(--ge-texto); background-color: var(--ge-campo); border-color: var(--ge-borda); } :where(:root[data-tema="escuro"]) .form-control:focus, :where(:root[data-tema="escuro"]) input:focus, :where(:root[data-tema="escuro"]) select:focus, :where(:root[data-tema="escuro"]) textarea:focus { border-color: var(--ge-foco); box-shadow: 0 0 0 3px rgba(111, 192, 192, .18); } :where(:root[data-tema="escuro"]) .form-control[disabled], :where(:root[data-tema="escuro"]) .form-control[readonly], :where(:root[data-tema="escuro"]) fieldset[disabled] .form-control { color: var(--ge-discreto); background-color: var(--ge-elevada); } :where(:root[data-tema="escuro"]) ::placeholder { color: #8d949c; opacity: 1; } :where(:root[data-tema="escuro"]) .input-group-addon { color: var(--ge-discreto); background-color: var(--ge-elevada); border-color: var(--ge-borda); } :where(:root[data-tema="escuro"]) legend { color: var(--ge-texto); border-bottom-color: var(--ge-borda); } :where(:root[data-tema="escuro"]) .btn-default { color: var(--ge-texto); background-color: var(--ge-elevada); border-color: var(--ge-borda); } :where(:root[data-tema="escuro"]) .btn-default:hover, :where(:root[data-tema="escuro"]) .btn-default:focus, :where(:root[data-tema="escuro"]) .btn-default:active, :where(:root[data-tema="escuro"]) .btn-default.active, :where(:root[data-tema="escuro"]) .open > .dropdown-toggle.btn-default { color: #fff; background-color: var(--ge-hover); border-color: #4f5a66; } :where(:root[data-tema="escuro"]) .btn-link { color: #8fd0d0; } :where(:root[data-tema="escuro"]) .dropdown-menu { background-color: var(--ge-elevada); border-color: var(--ge-borda); box-shadow: 0 10px 26px rgba(0, 0, 0, .5); } :where(:root[data-tema="escuro"]) .dropdown-menu > li > a { color: var(--ge-texto); } :where(:root[data-tema="escuro"]) .dropdown-menu > li > a:hover, :where(:root[data-tema="escuro"]) .dropdown-menu > li > a:focus { color: #fff; background-color: var(--ge-hover); } :where(:root[data-tema="escuro"]) .dropdown-menu .divider { background-color: var(--ge-borda); } :where(:root[data-tema="escuro"]) .dropdown-header { color: var(--ge-discreto); } :where(:root[data-tema="escuro"]) .nav-tabs { border-bottom-color: var(--ge-borda); } :where(:root[data-tema="escuro"]) .nav-tabs > li > a:hover { background-color: var(--ge-elevada); border-color: var(--ge-borda); } :where(:root[data-tema="escuro"]) .nav-tabs > li.active > a, :where(:root[data-tema="escuro"]) .nav-tabs > li.active > a:hover, :where(:root[data-tema="escuro"]) .nav-tabs > li.active > a:focus { color: var(--ge-texto); background-color: var(--ge-superficie); border-color: var(--ge-borda); border-bottom-color: transparent; } :where(:root[data-tema="escuro"]) .nav-tabs-custom > .nav-tabs > li > a { color: var(--ge-discreto); } :where(:root[data-tema="escuro"]) .nav-tabs-custom > .nav-tabs > li.active > a { color: var(--ge-texto); background-color: var(--ge-superficie); } :where(:root[data-tema="escuro"]) .nav-tabs-custom > .tab-content { background-color: var(--ge-superficie); } :where(:root[data-tema="escuro"]) .nav-pills > li > a:hover, :where(:root[data-tema="escuro"]) .nav-stacked > li > a:hover { background-color: var(--ge-elevada); } :where(:root[data-tema="escuro"]) .pagination > li > a, :where(:root[data-tema="escuro"]) .pagination > li > span { color: var(--ge-acento); background-color: var(--ge-elevada); border-color: var(--ge-borda); } :where(:root[data-tema="escuro"]) .pagination > li > a:hover, :where(:root[data-tema="escuro"]) .pagination > li > span:hover { color: #fff; background-color: var(--ge-hover); border-color: var(--ge-borda); } :where(:root[data-tema="escuro"]) .pagination > .disabled > a, :where(:root[data-tema="escuro"]) .pagination > .disabled > span { color: #6b7178; background-color: var(--ge-superficie); border-color: var(--ge-borda); } :where(:root[data-tema="escuro"]) a.list-group-item:hover, :where(:root[data-tema="escuro"]) button.list-group-item:hover { background-color: var(--ge-hover); } :where(:root[data-tema="escuro"]) .progress { background-color: var(--ge-elevada); box-shadow: none; } :where(:root[data-tema="escuro"]) .popover-title { background-color: var(--ge-elevada); border-bottom-color: var(--ge-borda); } :where(:root[data-tema="escuro"]) .popover.top > .arrow::after { border-top-color: var(--ge-superficie); } :where(:root[data-tema="escuro"]) .popover.bottom > .arrow::after { border-bottom-color: var(--ge-superficie); } :where(:root[data-tema="escuro"]) .popover.left > .arrow::after { border-left-color: var(--ge-superficie); } :where(:root[data-tema="escuro"]) .popover.right > .arrow::after { border-right-color: var(--ge-superficie); } :where(:root[data-tema="escuro"]) .modal-backdrop.in { opacity: .7; } /* ===================================================================== * Plugins * ===================================================================== */ :where(:root[data-tema="escuro"]) .select2-container--default .select2-selection--single, :where(:root[data-tema="escuro"]) .select2-container--default .select2-selection--multiple { background-color: var(--ge-campo); border-color: var(--ge-borda); } :where(:root[data-tema="escuro"]) .select2-container--default .select2-selection--single .select2-selection__rendered { color: var(--ge-texto); } :where(:root[data-tema="escuro"]) .select2-container--default .select2-selection--single .select2-selection__placeholder { color: #8d949c; } :where(:root[data-tema="escuro"]) .select2-container--default .select2-selection--multiple .select2-selection__choice { color: var(--ge-texto); background-color: var(--ge-suave); border-color: var(--ge-borda); } :where(:root[data-tema="escuro"]) .select2-dropdown { color: var(--ge-texto); background-color: var(--ge-elevada); border-color: var(--ge-borda); } :where(:root[data-tema="escuro"]) .select2-container--default .select2-search--dropdown .select2-search__field { color: var(--ge-texto); background-color: var(--ge-campo); border-color: var(--ge-borda); } :where(:root[data-tema="escuro"]) .select2-container--default .select2-results__option[aria-selected=true] { background-color: var(--ge-suave); } :where(:root[data-tema="escuro"]) .select2-container--default .select2-results__option--highlighted[aria-selected] { color: #fff; background-color: #2c6a73; } :where(:root[data-tema="escuro"]) .selectize-input, :where(:root[data-tema="escuro"]) .selectize-input.full, :where(:root[data-tema="escuro"]) .selectize-control.single .selectize-input.input-active { color: var(--ge-texto); background: var(--ge-campo); border-color: var(--ge-borda); box-shadow: none; } :where(:root[data-tema="escuro"]) .selectize-input input { color: var(--ge-texto); } :where(:root[data-tema="escuro"]) .selectize-dropdown { color: var(--ge-texto); background: var(--ge-elevada); border-color: var(--ge-borda); } :where(:root[data-tema="escuro"]) .selectize-dropdown .active { color: #fff; background-color: var(--ge-hover); } :where(:root[data-tema="escuro"]) .selectize-control.multi .selectize-input > div { color: var(--ge-texto); background: var(--ge-suave); } :where(:root[data-tema="escuro"]) .ui-widget-content, :where(:root[data-tema="escuro"]) .ui-datepicker { color: var(--ge-texto); background: var(--ge-elevada); border-color: var(--ge-borda); } :where(:root[data-tema="escuro"]) .ui-widget-header { color: var(--ge-texto); background: var(--ge-suave); border-color: var(--ge-borda); } :where(:root[data-tema="escuro"]) .ui-state-default, :where(:root[data-tema="escuro"]) .ui-widget-content .ui-state-default { color: var(--ge-texto); background: var(--ge-superficie); border-color: var(--ge-borda); } :where(:root[data-tema="escuro"]) .ui-state-hover, :where(:root[data-tema="escuro"]) .ui-widget-content .ui-state-hover { color: #fff; background: var(--ge-hover); border-color: #4f5a66; } :where(:root[data-tema="escuro"]) .ui-state-highlight, :where(:root[data-tema="escuro"]) .ui-widget-content .ui-state-highlight { color: #fff; background: #2c6a73; border-color: #37808a; } :where(:root[data-tema="escuro"]) .ui-menu .ui-menu-item-wrapper.ui-state-active { color: #fff; background: #2c6a73; border-color: #37808a; } :where(:root[data-tema="escuro"]) .swal2-popup { color: var(--ge-texto); background: var(--ge-superficie); } :where(:root[data-tema="escuro"]) .swal2-title, :where(:root[data-tema="escuro"]) .swal2-html-container, :where(:root[data-tema="escuro"]) .swal2-content { color: var(--ge-texto); } :where(:root[data-tema="escuro"]) .swal2-input, :where(:root[data-tema="escuro"]) .swal2-textarea, :where(:root[data-tema="escuro"]) .swal2-select { color: var(--ge-texto); background: var(--ge-campo); border-color: var(--ge-borda); } :where(:root[data-tema="escuro"]) .ms-container .ms-list { background: var(--ge-campo); border-color: var(--ge-borda); } :where(:root[data-tema="escuro"]) .ms-container .ms-selectable li.ms-elem-selectable, :where(:root[data-tema="escuro"]) .ms-container .ms-selection li.ms-elem-selection { color: var(--ge-texto); border-bottom-color: var(--ge-borda); } :where(:root[data-tema="escuro"]) .ms-container .ms-selectable li.ms-hover, :where(:root[data-tema="escuro"]) .ms-container .ms-selection li.ms-hover { color: #fff; background-color: #2c6a73; } :where(:root[data-tema="escuro"]) .dataTables_wrapper .dataTables_paginate .paginate_button { color: var(--ge-texto) !important; } :where(:root[data-tema="escuro"]) .dataTables_wrapper .dataTables_info, :where(:root[data-tema="escuro"]) .dataTables_wrapper .dataTables_length, :where(:root[data-tema="escuro"]) .dataTables_wrapper .dataTables_filter { color: var(--ge-discreto); } /* Highcharts: botão de exportação e menu */ :where(:root[data-tema="escuro"]) .highcharts-menu { background: var(--ge-elevada) !important; border-color: var(--ge-borda) !important; } :where(:root[data-tema="escuro"]) .highcharts-menu-item { color: var(--ge-texto) !important; } :where(:root[data-tema="escuro"]) .highcharts-menu-item:hover { background: var(--ge-hover) !important; } /* Impressão: o papel continua claro. */ @media print { :root[data-tema="escuro"], :where(:root[data-tema="escuro"]) body { color-scheme: light; color: #000; background: #fff; } } /* Telas do Folha: campo em foco tem fundo amarelo-claro no layout; dropdowns do header têm cores inline */ :root[data-tema="escuro"] input:focus, :root[data-tema="escuro"] .select2-container--focus { background-color: var(--ge-campo); } :where(:root[data-tema="escuro"]) .fl-ferramentas-menu > li > button { color: var(--ge-texto); } :where(:root[data-tema="escuro"]) .fl-ferramentas-menu > li > button:hover, :where(:root[data-tema="escuro"]) .fl-ferramentas-menu > li > button:focus-visible { color: #fff; background: var(--ge-hover); } :where(:root[data-tema="escuro"]) .fl-ferramentas-menu > li > button > i { color: var(--ge-acento); } :root[data-tema="escuro"] body.skin-personalizada06-light .sidebar .user-panel > .info > p { color: var(--ge-texto); } :root[data-tema="escuro"] body.skin-personalizada06-light .sidebar .user-panel > .info > a { color: var(--ge-acento); } @media (max-width: 767px) { :root[data-tema="escuro"] .main-header .navbar-custom-menu > .navbar-nav > li.fl-ferramentas > .dropdown-menu { background: var(--ge-elevada); } }