/* ============================================================
   DARK-MODE.CSS — Tema escuro baseado em variáveis
   ============================================================ */

/* =====================  ROOT OVERRIDES  ===================== */
/* Aqui trocamos apenas variáveis — nada de estilos diretos */

body.dark-mode {
    /* Cores base */
    --cor-branco: #ffffff;
    --cor-preto: #e6e6e6;

    /* Fundo geral */
    --modal-bg: var(--dark-card-bg);
    --menu-bg: var(--dark-menu-bg);
    --menu-bg-hover: var(--dark-menu-hover);
    --submenu-bg: var(--dark-submenu-bg);

    /* Bordas e sombras */
    --menu-border: var(--dark-border);
    --submenu-border: var(--dark-border);
    --menu-shadow: var(--dark-shadow);

    /* Navbar */
    --modal-header-bg: var(--cor-primaria-escura);
    --modal-header-border: var(--cor-primaria);

    background: var(--dark-bg);
    color: var(--cor-branco);
}

body.dark-mode .table td,
body.dark-mode .table th,
body.dark-mode .card,
body.dark-mode .card-body,
body.dark-mode .modal-body,
body.dark-mode .modal-content,
body.dark-mode .nav-link,
body.dark-mode span,
body.dark-mode p,
body.dark-mode div {
    color: var(--cor-branco) !important;
}

/* =====================  CARDS  ===================== */

body.dark-mode .card,
body.dark-mode .card-time {
    background: var(--dark-card-bg);
    border-color: var(--cor-primaria);
    box-shadow: none;
}

body.dark-mode .card-header-second {
    background: var(--cor-primaria-escura);
    color: var(--cor-branco);
}


/* =====================  NAVBAR  ===================== */

body.dark-mode nav.navbar.bg-minha-cor {
    background-color: var(--cor-primaria-escura);
    border-bottom-color: var(--cor-primaria);
}

body.dark-mode nav.navbar.bg-minha-cor img {
    filter: brightness(0) invert(1);
}


/* =====================  DROPDOWN  ===================== */

body.dark-mode .dropdown-menu {
    background: var(--cor-primaria-escura);
}

body.dark-mode .dropdown-item {
    background: var(--cor-primaria-escura);
    color: var(--cor-branco);
}

body.dark-mode .dropdown-item:hover {
    background: var(--cor-primaria);
}


/* =====================  TEXTO BOOTSTRAP  ===================== */

body.dark-mode .text-dark,
body.dark-mode .text-secondary,
body.dark-mode .text-muted {
    color: var(--cor-branco);
}


/* =====================  MENU LATERAL  ===================== */

body.dark-mode .side-menu {
    background: var(--dark-menu-bg);
    border-color: var(--dark-border);
    box-shadow: var(--dark-shadow);
}

body.dark-mode .side-menu-list li a,
body.dark-mode .submenu-title {
    color: var(--cor-branco);
    border-bottom: 1px solid var(--dark-border);
}

body.dark-mode .side-menu-list li a:hover,
body.dark-mode .submenu-title:hover {
    background: var(--dark-menu-hover);
}


/* =====================  SUBMENU  ===================== */

body.dark-mode .submenu-list {
    background: var(--dark-submenu-bg);
    border-left: 2px solid var(--dark-border);
}

body.dark-mode .submenu-title::after {
    color: var(--cor-branco);
}


/* =====================  ÍCONES  ===================== */

body.dark-mode .morph-icon line {
    stroke: var(--cor-branco);
}