/* ==========================================================================
   Tema hex_terminal — MODO ESCURO "iluminado" (estilo Apple + palco preto)

   Carregado POR ÚLTIMO (depois de tema-hex-terminal.css) e só vale em
   [data-bs-theme="dark"] e na tela (nada muda na impressão nem no claro).
   Para desfazer basta remover o <link> deste arquivo em views/layout/header.php.

   Ideia:
   - ícones "acendem" como LEDs sobre o preto: cor viva + halo suave
     (drop-shadow), mais forte no hover / item ativo;
   - ícones de destaque ficam em "azulejo" estilo app da Apple: gradiente
     translúcido, filete de luz no topo (inset) e brilho externo na cor do tom;
   - cores de sistema do iOS no escuro (vermelho, laranja, verde, azul);
   - o gradiente vermelho→laranja da marca continua sendo o destaque principal.
   ========================================================================== */

@media screen {

[data-bs-theme="dark"] {
    /* cores de sistema da Apple (versão escura, mais vivas sobre o preto) */
    --ap-red: #FF453A;
    --ap-orange: #FF9F0A;
    --ap-yellow: #FFD60A;
    --ap-green: #30D158;
    --ap-blue: #0A84FF;
    --ap-teal: #64D2FF;

    --danger: var(--ap-red);
    --warning: var(--ap-orange);
    --success: var(--ap-green);

    /* tom de brilho da marca (vermelho→laranja) */
    --lit: color-mix(in srgb, var(--accent) 45%, var(--hx-orange));

    /* halo de LED: usa a cor atual do ícone (currentColor) */
    --halo-sm: drop-shadow(0 0 4px color-mix(in srgb, currentColor 55%, transparent));
    --halo: drop-shadow(0 0 5px color-mix(in srgb, currentColor 60%, transparent))
            drop-shadow(0 0 14px color-mix(in srgb, currentColor 30%, transparent));
    --halo-strong: drop-shadow(0 0 6px color-mix(in srgb, currentColor 80%, transparent))
                   drop-shadow(0 0 20px color-mix(in srgb, currentColor 45%, transparent));

    /* filete de luz no topo dos cartões e azulejos (vidro da Apple) */
    --hairline-top: inset 0 1px 0 rgba(255, 255, 255, .07);
}

/* ------------------------------------------------------------ superfícies */
[data-bs-theme="dark"] .card,
[data-bs-theme="dark"] .modal-content,
[data-bs-theme="dark"] .dropdown-menu,
[data-bs-theme="dark"] .cmdk-caixa {
    box-shadow: var(--hairline-top), var(--shadow-md);
}
[data-bs-theme="dark"] .card { box-shadow: var(--hairline-top); }

/* ------------------------------------------------------------ sidebar */
[data-bs-theme="dark"] .sidebar-link-icon i {
    transition: color .2s ease, filter .25s ease;
}
[data-bs-theme="dark"] .sidebar-link:hover .sidebar-link-icon,
[data-bs-theme="dark"] .sidebar-link:focus-visible .sidebar-link-icon {
    color: var(--lit);
}
[data-bs-theme="dark"] .sidebar-link:hover .sidebar-link-icon i,
[data-bs-theme="dark"] .sidebar-link:focus-visible .sidebar-link-icon i {
    filter: var(--halo);
}

/* item ativo: ícone em gradiente da marca + halo laranja, barra luminosa e
   pastilha de vidro com brilho no topo */
[data-bs-theme="dark"] .sidebar-link.active {
    background:
        radial-gradient(120% 140% at 0% 50%, color-mix(in srgb, var(--accent) 22%, transparent), transparent 70%),
        var(--accent-soft);
    box-shadow: var(--hairline-top), inset 0 0 0 1px color-mix(in srgb, var(--accent) 28%, transparent);
}
[data-bs-theme="dark"] .sidebar-link.active .sidebar-link-icon i {
    filter: drop-shadow(0 0 5px color-mix(in srgb, var(--hx-orange) 75%, transparent))
            drop-shadow(0 0 14px color-mix(in srgb, var(--accent) 55%, transparent));
}
[data-bs-theme="dark"] .sidebar-link.active::before {
    box-shadow: 0 0 10px color-mix(in srgb, var(--hx-orange) 80%, transparent),
                0 0 22px color-mix(in srgb, var(--accent) 50%, transparent);
}

/* CIPA: verde de segurança aceso, com respiração suave do halo */
[data-bs-theme="dark"] .sidebar-link-icon-cipa i {
    filter: var(--halo-strong);
}

/* ------------------------------------------------------------ topbar */
[data-bs-theme="dark"] .topbar-icon-btn,
[data-bs-theme="dark"] .topbar-burger {
    box-shadow: var(--hairline-top);
    transition: background .2s ease, color .2s ease, box-shadow .2s ease;
}
[data-bs-theme="dark"] .topbar-icon-btn .bi,
[data-bs-theme="dark"] .topbar-burger .bi,
[data-bs-theme="dark"] .topbar-search-btn .bi {
    transition: color .2s ease, filter .25s ease;
}
[data-bs-theme="dark"] .topbar-icon-btn:hover .bi,
[data-bs-theme="dark"] .topbar-burger:hover .bi,
[data-bs-theme="dark"] .topbar-search-btn:hover .bi {
    color: var(--lit);
    filter: var(--halo);
}
[data-bs-theme="dark"] .topbar-icon-btn:hover {
    box-shadow: var(--hairline-top), 0 0 18px -4px color-mix(in srgb, var(--accent) 55%, transparent);
}
[data-bs-theme="dark"] .topbar-clock-icon {
    color: var(--hx-orange);
    filter: var(--halo);
}

/* ------------------------------------------------------------ azulejos de ícone (KPI, cards, módulo) */
/* tom padrão: vidro neutro; cada variante troca só a variável --tone */
[data-bs-theme="dark"] .kpi-card,
[data-bs-theme="dark"] .dash-card-icon,
[data-bs-theme="dark"] .module-icon-badge {
    --tone: var(--text-600);
}
[data-bs-theme="dark"] .kpi-card-danger  { --tone: var(--danger); }
[data-bs-theme="dark"] .kpi-card-warning { --tone: var(--warning); }
[data-bs-theme="dark"] .kpi-card-success { --tone: var(--success); }
[data-bs-theme="dark"] .kpi-card-accent  { --tone: var(--lit); }
[data-bs-theme="dark"] .dash-card-icon-accent { --tone: var(--lit); }
[data-bs-theme="dark"] .module-icon-badge { --tone: var(--lit); }
[data-bs-theme="dark"] .module-icon-badge-success { --tone: var(--success); }

[data-bs-theme="dark"] .kpi-card .kpi-icon,
[data-bs-theme="dark"] .dash-card-icon,
[data-bs-theme="dark"] .module-icon-badge {
    color: var(--tone);
    background: linear-gradient(160deg,
        color-mix(in srgb, var(--tone) 26%, transparent),
        color-mix(in srgb, var(--tone) 7%, transparent));
    border: 1px solid color-mix(in srgb, var(--tone) 32%, transparent);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16),
                0 0 20px -6px color-mix(in srgb, var(--tone) 60%, transparent);
    transition: box-shadow .25s ease, transform .2s ease, border-color .25s ease;
}
/* o padrão neutro (sem variante) fica mais discreto: só um vidro claro */
[data-bs-theme="dark"] .kpi-card:not([class*="kpi-card-"]) .kpi-icon {
    background: linear-gradient(160deg, rgba(255, 255, 255, .11), rgba(255, 255, 255, .03));
    border-color: rgba(255, 255, 255, .10);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .14);
}
[data-bs-theme="dark"] .kpi-card .kpi-icon i,
[data-bs-theme="dark"] .dash-card-icon i,
[data-bs-theme="dark"] .module-icon-badge i {
    filter: var(--halo);
}
[data-bs-theme="dark"] .kpi-card:hover .kpi-icon,
[data-bs-theme="dark"] .kpi-card:hover .dash-card-icon {
    border-color: color-mix(in srgb, var(--tone) 55%, transparent);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2),
                0 0 26px -3px color-mix(in srgb, var(--tone) 75%, transparent);
}
[data-bs-theme="dark"] .kpi-card:hover .kpi-icon i { filter: var(--halo-strong); }
/* no hover o cartão neutro "acende" na cor da marca */
[data-bs-theme="dark"] .kpi-card:not([class*="kpi-card-"]):hover .kpi-icon { color: var(--lit); }

/* números dos KPIs coloridos também levam um brilho bem leve */
[data-bs-theme="dark"] .kpi-card-danger .kpi-value,
[data-bs-theme="dark"] .kpi-card-warning .kpi-value,
[data-bs-theme="dark"] .kpi-card-success .kpi-value {
    text-shadow: 0 0 18px color-mix(in srgb, var(--tone) 45%, transparent);
}

/* ------------------------------------------------------------ notificações */
[data-bs-theme="dark"] .np-icone {
    box-shadow: var(--hairline-top);
}
[data-bs-theme="dark"] .np-icone i { filter: var(--halo-sm); }
[data-bs-theme="dark"] .np-icone.tom-danger  { color: var(--danger);  background: color-mix(in srgb, var(--danger) 20%, transparent); }
[data-bs-theme="dark"] .np-icone.tom-warning { color: var(--warning); background: color-mix(in srgb, var(--warning) 20%, transparent); }
[data-bs-theme="dark"] .np-icone.tom-primary { color: var(--ap-blue); background: color-mix(in srgb, var(--ap-blue) 20%, transparent); }
[data-bs-theme="dark"] .np-item.nao-lida .np-icone {
    box-shadow: var(--hairline-top), 0 0 16px -4px color-mix(in srgb, currentColor 70%, transparent);
}

/* ------------------------------------------------------------ botões só com ícone */
[data-bs-theme="dark"] .btn-icon-action,
[data-bs-theme="dark"] .cal-icone-btn {
    transition: background-color .15s ease, color .15s ease, border-color .15s ease,
                transform .15s ease, box-shadow .2s ease;
}
[data-bs-theme="dark"] .btn-icon-action:hover,
[data-bs-theme="dark"] .btn-icon-action:focus-visible,
[data-bs-theme="dark"] .cal-icone-btn:hover {
    color: var(--lit);
    box-shadow: 0 0 14px -4px color-mix(in srgb, var(--accent) 60%, transparent);
}
[data-bs-theme="dark"] .btn-icon-action:hover .bi,
[data-bs-theme="dark"] .btn-icon-action:focus-visible .bi,
[data-bs-theme="dark"] .cal-icone-btn:hover .bi { filter: var(--halo); }
[data-bs-theme="dark"] .btn-icon-action.btn-icon-danger:hover,
[data-bs-theme="dark"] .btn-icon-action.btn-icon-danger:focus-visible {
    color: var(--danger);
    box-shadow: 0 0 14px -4px color-mix(in srgb, var(--danger) 70%, transparent);
}

/* ------------------------------------------------------------ ícones coloridos soltos (text-success etc.) */
[data-bs-theme="dark"] .bi.text-success { color: var(--ap-green) !important;  filter: var(--halo-sm); }
[data-bs-theme="dark"] .bi.text-danger  { color: var(--ap-red) !important;    filter: var(--halo-sm); }
[data-bs-theme="dark"] .bi.text-warning { color: var(--ap-orange) !important; filter: var(--halo-sm); }
[data-bs-theme="dark"] .bi.text-info    { color: var(--ap-teal) !important;   filter: var(--halo-sm); }
[data-bs-theme="dark"] .bi.text-primary { color: var(--lit) !important;       filter: var(--halo-sm); }

/* ------------------------------------------------------------ menus, abas, paleta (Ctrl K) */
[data-bs-theme="dark"] .dropdown-item .bi,
[data-bs-theme="dark"] .cmdk-item .bi {
    transition: color .2s ease, filter .25s ease;
}
[data-bs-theme="dark"] .dropdown-item:hover .bi,
[data-bs-theme="dark"] .dropdown-item:focus-visible .bi,
[data-bs-theme="dark"] .cmdk-item.ativo .bi,
[data-bs-theme="dark"] .cmdk-item:hover .bi {
    color: var(--lit);
    filter: var(--halo);
}
[data-bs-theme="dark"] .nav-pills .nav-link.active .bi,
[data-bs-theme="dark"] .nav-tabs .nav-link.active .bi {
    color: var(--lit);
    filter: var(--halo);
}

/* ------------------------------------------------------------ botão primário: ícone com leve sombra para não "chapar" no gradiente */
[data-bs-theme="dark"] .btn-primary .bi { filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .35)); }

}

/* quem prefere menos movimento: sem transições nos halos */
@media screen and (prefers-reduced-motion: reduce) {
    [data-bs-theme="dark"] .bi,
    [data-bs-theme="dark"] .kpi-icon,
    [data-bs-theme="dark"] .dash-card-icon,
    [data-bs-theme="dark"] .module-icon-badge,
    [data-bs-theme="dark"] .btn-icon-action { transition: none !important; }
}
