/* ============================================================================
   Modo escuro (mesmo modelo do FormulariosDinamico)

   O <html> recebe data-theme="dark" (regras deste arquivo) e data-bs-theme="dark"
   (componentes do Bootstrap 5.3). A escolha fica no localStorage ("theme") e é
   aplicada no <head> do template antes do primeiro desenho, para a página não piscar.
   Carregado depois do bootstrap.css: html[data-theme] (0,1,1) vence [data-bs-theme] (0,1,0).
   ============================================================================ */

html[data-theme="dark"] {
    color-scheme: dark;

    /* variáveis do template.html */
    --primary-blue:   #60a5fa;
    --secondary-blue: #3b82f6;
    --light-blue:     rgba(30, 58, 138, 0.25);
    --accent-blue:    #93c5fd;
    --white:          #0d1626;
    --pure-white:     #111d30;
    --gray-lighter:   #0d1626;
    --gray-light:     #111d30;
    --gray-medium:    #2a3a55;
    --gray-border:    #2a3a55;
    --text-primary:   #e2e8f0;
    --text-secondary: #8fa8c8;
    --text-muted:     #8fa8c8;

    /* Bootstrap 5.3 */
    --bs-body-bg:            #0d1626;
    --bs-body-bg-rgb:        13, 22, 38;
    --bs-body-color:         #e2e8f0;
    --bs-body-color-rgb:     226, 232, 240;
    --bs-emphasis-color:     #f1f5f9;
    --bs-secondary-color:    #8fa8c8;
    --bs-secondary-bg:       #1a2a40;
    --bs-tertiary-bg:        #15233a;
    --bs-tertiary-bg-rgb:    21, 35, 58;
    --bs-border-color:       #2a3a55;
    --bs-heading-color:      #e2e8f0;
    --bs-link-color:         #60a5fa;
    --bs-link-color-rgb:     96, 165, 250;
    --bs-link-hover-color:   #93c5fd;
    --bs-link-hover-color-rgb: 147, 197, 253;
}

/* Só durante o clique no botão: transição suave sem animar o carregamento da página */
.theme-transitioning,
.theme-transitioning *,
.theme-transitioning *::before,
.theme-transitioning *::after {
    transition: background-color 0.3s ease, background 0.3s ease, border-color 0.3s ease,
                color 0.2s ease, box-shadow 0.3s ease !important;
}

/* main.css (legado) fixa "div, p, h1-h3 { color: #333 }". Com especificidade de elemento
   e carregado depois, isto devolve a cor herdada sem atropelar as classes de cor. */
:where(html[data-theme="dark"]) :is(div, h1, h2, h3, p, pre) {
    color: inherit;
}

/* ---------------------------------------------------------------- layout base */
html[data-theme="dark"] body {
    background: linear-gradient(135deg, #0d1626 0%, #111d30 50%, #0d1626 100%) !important;
    color: #e2e8f0;
}
html[data-theme="dark"] body::before { opacity: 0.4; }

html[data-theme="dark"] .header-section {
    background: linear-gradient(to bottom, #111d30 0%, #0d1626 100%) !important;
    border-bottom-color: #2a3a55 !important;
}
html[data-theme="dark"] .header-section h2 { color: #60a5fa !important; text-shadow: none; }
html[data-theme="dark"] .header-section h5 { color: #8fa8c8 !important; }

html[data-theme="dark"] .content {
    background: #111d30 !important;
    border-color: #2a3a55 !important;
    color: #e2e8f0;
}
html[data-theme="dark"] .content:hover {
    border-color: #3b5a85 !important;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.35) !important;
}

html[data-theme="dark"] footer {
    background: linear-gradient(135deg, #0d1626 0%, #111d30 100%) !important;
    border-top: 1px solid #2a3a55;
}

html[data-theme="dark"] #alertMsg {
    background: #111d30 !important;
    border-color: #60a5fa !important;
    color: #e2e8f0 !important;
}

/* ---------------------------------------------------------------- tipografia */
html[data-theme="dark"] h1, html[data-theme="dark"] h2, html[data-theme="dark"] h3,
html[data-theme="dark"] h4, html[data-theme="dark"] h5, html[data-theme="dark"] h6 { color: #e2e8f0; }
/* main.css (legado) dá "text-shadow: 0 1px 1px #fff" em h1/h2: no escuro vira um borrão claro */
html[data-theme="dark"] h1, html[data-theme="dark"] h2 { text-shadow: none; }
html[data-theme="dark"] strong { color: #f1f5f9; }
html[data-theme="dark"] a { color: #60a5fa; }
html[data-theme="dark"] a:hover { color: #93c5fd; }
html[data-theme="dark"] a.btn { color: var(--bs-btn-color); }
html[data-theme="dark"] a.btn:hover { color: var(--bs-btn-hover-color); }
html[data-theme="dark"] .text-muted,
html[data-theme="dark"] .text-secondary { color: #8fa8c8 !important; }
/* text-dark sobre fundo claro (badge amarela, bg-warning) continua escuro */
html[data-theme="dark"] .text-dark:not(.bg-warning):not(.bg-info):not(.badge) { color: #e2e8f0 !important; }
html[data-theme="dark"] hr { border-color: #2a3a55; opacity: 1; }

/* ---------------------------------------------------------------- utilitários claros */
html[data-theme="dark"] .bg-light,
html[data-theme="dark"] .bg-white,
html[data-theme="dark"] .table-light,
html[data-theme="dark"] .table-light > * > * {
    background-color: #1a2a40 !important;
    color: #e2e8f0 !important;
    --bs-table-bg: #1a2a40;
    --bs-table-color: #e2e8f0;
    border-color: #2a3a55 !important;
}
html[data-theme="dark"] .badge.bg-light { color: #c8d8f0 !important; }
html[data-theme="dark"] .border,
html[data-theme="dark"] .border-top,
html[data-theme="dark"] .border-bottom { border-color: #2a3a55 !important; }

/* ---------------------------------------------------------------- cards, tabelas, listas */
html[data-theme="dark"] .card {
    --bs-card-bg: #111d30;
    --bs-card-cap-bg: #1a2a40;
    --bs-card-border-color: #2a3a55;
    --bs-card-color: #e2e8f0;
    color: #e2e8f0;
}
html[data-theme="dark"] .table {
    --bs-table-bg: transparent;
    --bs-table-color: #e2e8f0;
    --bs-table-border-color: #2a3a55;
    --bs-table-striped-bg: rgba(96, 165, 250, 0.04);
    --bs-table-striped-color: #e2e8f0;
    --bs-table-hover-bg: rgba(96, 165, 250, 0.07);
    --bs-table-hover-color: #e2e8f0;
}
html[data-theme="dark"] .table-hover tbody tr:hover { background-color: rgba(96, 165, 250, 0.07) !important; }
html[data-theme="dark"] .list-group {
    --bs-list-group-bg: #111d30;
    --bs-list-group-color: #e2e8f0;
    --bs-list-group-border-color: #2a3a55;
    --bs-list-group-action-hover-bg: #1a2a40;
}

/* ---------------------------------------------------------------- formulários */
html[data-theme="dark"] .form-control,
html[data-theme="dark"] .form-select {
    background-color: #0d1626;
    border-color: #2a3a55;
    color: #e2e8f0;
}
html[data-theme="dark"] .form-control:focus,
html[data-theme="dark"] .form-select:focus {
    background-color: #0d1626;
    border-color: #60a5fa;
    color: #e2e8f0;
    box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.18);
}
html[data-theme="dark"] .form-control:disabled,
html[data-theme="dark"] .form-control[readonly],
html[data-theme="dark"] .form-select:disabled { background-color: #15233a; color: #8fa8c8; }
html[data-theme="dark"] .form-control::placeholder { color: #5b7799; }
html[data-theme="dark"] .form-control::file-selector-button { background-color: #1a2a40; color: #c8d8f0; }
html[data-theme="dark"] .form-label,
html[data-theme="dark"] .form-check-label { color: #c8d8f0; }
html[data-theme="dark"] .form-check-input { background-color: #0d1626; border-color: #3a5070; }
html[data-theme="dark"] .form-check-input:checked { background-color: #3b82f6; border-color: #3b82f6; }
html[data-theme="dark"] .input-group-text { background: #1a2a40; border-color: #2a3a55; color: #8fa8c8; }
/* calendário nativo do <input type="date"> */
html[data-theme="dark"] input[type="date"]::-webkit-calendar-picker-indicator,
html[data-theme="dark"] input[type="datetime-local"]::-webkit-calendar-picker-indicator { filter: invert(0.8); }

/* ---------------------------------------------------------------- botões */
html[data-theme="dark"] .btn-outline-primary { --bs-btn-color: #60a5fa; --bs-btn-border-color: #60a5fa; --bs-btn-hover-bg: #60a5fa; --bs-btn-hover-border-color: #60a5fa; --bs-btn-hover-color: #0d1626; }
html[data-theme="dark"] .btn-outline-secondary { --bs-btn-color: #8fa8c8; --bs-btn-border-color: #3a5070; --bs-btn-hover-bg: #3a5070; --bs-btn-hover-border-color: #3a5070; --bs-btn-hover-color: #e2e8f0; }
html[data-theme="dark"] .btn-outline-dark { --bs-btn-color: #c8d8f0; --bs-btn-border-color: #3a5070; --bs-btn-hover-bg: #3a5070; --bs-btn-hover-color: #fff; }
html[data-theme="dark"] .btn-light { --bs-btn-bg: #1a2a40; --bs-btn-border-color: #2a3a55; --bs-btn-color: #e2e8f0; --bs-btn-hover-bg: #243550; --bs-btn-hover-color: #e2e8f0; }

/* ---------------------------------------------------------------- alertas */
html[data-theme="dark"] .alert-info    { --bs-alert-bg: rgba(96, 165, 250, 0.12); --bs-alert-border-color: rgba(96, 165, 250, 0.3); --bs-alert-color: #93c5fd; }
html[data-theme="dark"] .alert-danger  { --bs-alert-bg: rgba(239, 68, 68, 0.12);  --bs-alert-border-color: rgba(239, 68, 68, 0.3);  --bs-alert-color: #fca5a5; }
html[data-theme="dark"] .alert-warning { --bs-alert-bg: rgba(245, 158, 11, 0.12); --bs-alert-border-color: rgba(245, 158, 11, 0.3); --bs-alert-color: #fcd34d; }
html[data-theme="dark"] .alert-success { --bs-alert-bg: rgba(16, 185, 129, 0.12); --bs-alert-border-color: rgba(16, 185, 129, 0.3); --bs-alert-color: #6ee7b7; }
html[data-theme="dark"] .alert-secondary,
html[data-theme="dark"] .alert-light   { --bs-alert-bg: #1a2a40; --bs-alert-border-color: #2a3a55; --bs-alert-color: #c8d8f0; }
html[data-theme="dark"] .alert strong  { color: inherit; }

/* ---------------------------------------------------------------- modais, dropdowns, paginação */
html[data-theme="dark"] .modal { --bs-modal-bg: #111d30; --bs-modal-border-color: #2a3a55; --bs-modal-color: #e2e8f0; }
html[data-theme="dark"] .modal-header,
html[data-theme="dark"] .modal-footer { border-color: #2a3a55; }
html[data-theme="dark"] .page-link { background-color: #111d30; border-color: #2a3a55; color: #8fa8c8; }
html[data-theme="dark"] .page-link:hover { background-color: #1a2a40; color: #60a5fa; }
html[data-theme="dark"] .page-item.active .page-link { background: #3b82f6; border-color: #3b82f6; color: #fff; }

/* ---------------------------------------------------------------- menu (fragments/menu.html) */
/* menu fixo ao rolar: o azul claro do tema escuro ficaria forte demais como faixa */
html[data-theme="dark"] #barraMenu.scrolled { background: linear-gradient(135deg, #0f1f3d 0%, #1e3a8a 100%); }
html[data-theme="dark"] .navbar-modern {
    background: linear-gradient(to bottom, #111d30 0%, #0d1626 100%) !important;
    border-color: #2a3a55;
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.35);
}
html[data-theme="dark"] .navbar-modern .nav-link { color: #b8cce8; }
html[data-theme="dark"] .navbar-modern .nav-link:hover { color: #93c5fd; background: rgba(96, 165, 250, 0.10); }
html[data-theme="dark"] .navbar-modern .nav-link.active { background: rgba(96, 165, 250, 0.12); }
html[data-theme="dark"] .navbar-modern .dropdown-menu {
    background: #111d30;
    border-color: #2a3a55;
    box-shadow: 0 12px 35px rgba(0, 0, 0, 0.45);
}
html[data-theme="dark"] .navbar-modern .dropdown-item { color: #b8cce8 !important; }
html[data-theme="dark"] .navbar-modern .dropdown-item.text-danger { color: #fca5a5 !important; }
html[data-theme="dark"] .navbar-modern .dropdown-item:hover,
html[data-theme="dark"] .navbar-modern .dropdown-item:focus { background: rgba(96, 165, 250, 0.10); color: #93c5fd !important; }
html[data-theme="dark"] .navbar-modern .dropdown-divider { border-color: #243450; }
html[data-theme="dark"] .navbar-modern .navbar-toggler { background: rgba(96, 165, 250, 0.10); }
html[data-theme="dark"] .navbar-modern .navbar-toggler-icon { filter: invert(0.85); }

/* ---------------------------------------------------------------- telas do sistema de eventos */
html[data-theme="dark"] .projeto-info,
html[data-theme="dark"] .info-section,
html[data-theme="dark"] .embed-code-container,
html[data-theme="dark"] .parceiro-item,
html[data-theme="dark"] .anexo-item {
    background-color: #15233a !important;
    border-color: #2a3a55 !important;
    color: #e2e8f0;
}
html[data-theme="dark"] .embed-code { background-color: #0d1626 !important; color: #c8d8f0; border-color: #2a3a55 !important; }
html[data-theme="dark"] .info-label,
html[data-theme="dark"] .metric-label,
html[data-theme="dark"] .stat-label { color: #8fa8c8 !important; }
html[data-theme="dark"] .metric-card,
html[data-theme="dark"] .legend { background-color: #15233a !important; color: #e2e8f0; }
html[data-theme="dark"] .card-projeto { border-color: #2a3a55 !important; }
html[data-theme="dark"] .card-projeto:hover { border-color: #3b82f6 !important; }
html[data-theme="dark"] .timeline-item { border-left-color: #3b82f6; }

/* Cards da página inicial (services.css, estilo 7, e colors/color.css) */
html[data-theme="dark"] .tc-services-style7 .services-title { color: #e2e8f0; }
html[data-theme="dark"] .tc-services-style7 .services-desc p { color: #a9bdd6; }
html[data-theme="dark"] .tc-services-style7 .services-desc,
html[data-theme="dark"] .tc-services-style7 .services-icon { background-color: #15233a; }
html[data-theme="dark"] .tc-services-style7 .services-item,
html[data-theme="dark"] .tc-services-style7 .services-desc { box-shadow: 11px 16px 30px -11px rgba(0, 0, 0, 0.85); }
html[data-theme="dark"] .tc-services-style7 a:hover .services-title { color: #93c5fd; }

/* Sugestões de endereço do Google (cadastro e edição) */
html[data-theme="dark"] .sugestoes-endereco { background: #111d30; border-color: #2a3a55; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.45); }
html[data-theme="dark"] .sugestao-item { border-bottom-color: #2a3a55; color: #e2e8f0; }
html[data-theme="dark"] .sugestao-item:hover { background: #1a2a40; }

/* Botão lua/sol do menu. É um <button> só com ícone: sem flex ele fica mais baixo que os
   links de texto da mesma linha e o ícone sobe. No celular o menu é uma lista e aparece o texto. */
.nav-item-tema { display: flex; align-items: stretch; }
.dark-toggle {
    background: none;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-width: 46px;
}
.navbar-modern .dark-toggle i { margin-right: 0; font-size: 1.1rem; }
/* .navbar-modern .nav-link i (menu.html) põe display nos ícones: aqui precisa ser mais específico */
.navbar-modern .dark-toggle .dm-sun { display: none; }
html[data-theme="dark"] .navbar-modern .dark-toggle .dm-sun { display: inline-block; }
html[data-theme="dark"] .navbar-modern .dark-toggle .dm-moon { display: none; }
@media (max-width: 991px) {
    .nav-item-tema { display: block; }
    .dark-toggle { width: 100%; justify-content: flex-start; }
    .dark-toggle::after { content: 'Modo escuro'; }
    html[data-theme="dark"] .dark-toggle::after { content: 'Modo claro'; }
}