﻿/* ============================================================================
   chaoscience-theme-fixes.css
   Localização: /wwwroot/styles/chaoscience-theme-fixes.css
   
   Correções adicionais de tema que o MudBlazor não cobre nativamente.
   Garante que cores de hover, texto e interações estejam corretas.
   ============================================================================ */

/* ============================================================================
   TEMA CLARO - Correções
   ============================================================================ */

.mud-theme-light {
    /* ────────────────────────────────────────────────────────────────────
       DRAWER / MENU LATERAL
       ──────────────────────────────────────────────────────────────────── */
    /* Texto padrão do menu - ESCURO */
    .mud-drawer .mud-nav-link

{
    color: #1E1E1E !important;
}

/* Ícones do menu - ESCURO */
.mud-drawer .mud-nav-link .mud-icon-root {
    color: #424242 !important;
}

/* Hover no menu - FUNDO AZUL CLARO */
.mud-drawer .mud-nav-link:hover {
    background-color: rgba(11, 141, 191, 0.08) !important;
}

/* Hover no menu - TEXTO AZUL */
.mud-drawer .mud-nav-link:hover {
    color: #0B8DBF !important;
}

    /* Hover no menu - ÍCONE AZUL */
    .mud-drawer .mud-nav-link:hover .mud-icon-root {
        color: #0B8DBF !important;
    }

/* Item ativo do menu - FUNDO AZUL */
.mud-drawer .mud-nav-link.active {
    background-color: rgba(11, 141, 191, 0.12) !important;
    color: #0B8DBF !important;
}

    /* Item ativo do menu - ÍCONE AZUL */
    .mud-drawer .mud-nav-link.active .mud-icon-root {
        color: #0B8DBF !important;
    }

/* ────────────────────────────────────────────────────────────────────
       BOTÕES
       ──────────────────────────────────────────────────────────────────── */

/* Botão Secondary (roxo) - garantir contraste */
.mud-button-root.mud-button-filled.mud-button-filled-secondary {
    background-color: #6B3A9A !important;
    color: #FFFFFF !important;
}

    .mud-button-root.mud-button-filled.mud-button-filled-secondary:hover {
        background-color: #5A2F84 !important;
    }

/* Botão Outlined Secondary - texto roxo legível */
.mud-button-root.mud-button-outlined.mud-button-outlined-secondary {
    color: #6B3A9A !important;
    border-color: #6B3A9A !important;
}

    .mud-button-root.mud-button-outlined.mud-button-outlined-secondary:hover {
        background-color: rgba(107, 58, 154, 0.08) !important;
    }

/* ────────────────────────────────────────────────────────────────────
       CHIPS / BADGES
       ──────────────────────────────────────────────────────────────────── */

/* Chip Secondary - roxo com bom contraste */
.mud-chip.mud-chip-color-secondary {
    background-color: #6B3A9A !important;
    color: #FFFFFF !important;
}

/* ────────────────────────────────────────────────────────────────────
       TABS
       ──────────────────────────────────────────────────────────────────── */

/* Tab ativo - indicador azul */
.mud-tabs .mud-tab.mud-tab-active {
    color: #0B8DBF !important;
}

/* Tab hover */
.mud-tabs .mud-tab:hover {
    color: #0B8DBF !important;
}

}

/* ============================================================================
   TEMA ESCURO - Correções
   ============================================================================ */

.mud-theme-dark {
    /* ────────────────────────────────────────────────────────────────────
       DRAWER / MENU LATERAL
       ──────────────────────────────────────────────────────────────────── */
    /* Texto padrão do menu - BRANCO */
    .mud-drawer .mud-nav-link

{
    color: #FFFFFF !important;
}

/* Ícones do menu - CLAROS */
.mud-drawer .mud-nav-link .mud-icon-root {
    color: #E0E0E0 !important;
}

/* Hover no menu - FUNDO AZUL CLARO */
.mud-drawer .mud-nav-link:hover {
    background-color: rgba(79, 195, 247, 0.12) !important;
}

/* Hover no menu - TEXTO AZUL CLARO */
.mud-drawer .mud-nav-link:hover {
    color: #4FC3F7 !important;
}

    /* Hover no menu - ÍCONE AZUL CLARO */
    .mud-drawer .mud-nav-link:hover .mud-icon-root {
        color: #4FC3F7 !important;
    }

/* Item ativo do menu - FUNDO AZUL */
.mud-drawer .mud-nav-link.active {
    background-color: rgba(79, 195, 247, 0.16) !important;
    color: #4FC3F7 !important;
}

    /* Item ativo do menu - ÍCONE AZUL */
    .mud-drawer .mud-nav-link.active .mud-icon-root {
        color: #4FC3F7 !important;
    }

/* ────────────────────────────────────────────────────────────────────
       BOTÕES
       ──────────────────────────────────────────────────────────────────── */

/* Botão Secondary (roxo) - mais claro para modo escuro */
.mud-button-root.mud-button-filled.mud-button-filled-secondary {
    background-color: #B388E0 !important;
    color: #1A0A24 !important;
}

    .mud-button-root.mud-button-filled.mud-button-filled-secondary:hover {
        background-color: #C89EEB !important;
    }

/* Botão Outlined Secondary - texto roxo claro */
.mud-button-root.mud-button-outlined.mud-button-outlined-secondary {
    color: #B388E0 !important;
    border-color: #B388E0 !important;
}

    .mud-button-root.mud-button-outlined.mud-button-outlined-secondary:hover {
        background-color: rgba(179, 136, 224, 0.12) !important;
    }

/* ────────────────────────────────────────────────────────────────────
       CHIPS / BADGES
       ──────────────────────────────────────────────────────────────────── */

/* Chip Secondary - roxo claro para modo escuro */
.mud-chip.mud-chip-color-secondary {
    background-color: #B388E0 !important;
    color: #1A0A24 !important;
}

/* ────────────────────────────────────────────────────────────────────
       TABS
       ──────────────────────────────────────────────────────────────────── */

/* Tab ativo - indicador azul claro */
.mud-tabs .mud-tab.mud-tab-active {
    color: #4FC3F7 !important;
}

/* Tab hover */
.mud-tabs .mud-tab:hover {
    color: #4FC3F7 !important;
}

/* ────────────────────────────────────────────────────────────────────
       TEXT COLORS - Garantir contraste
       ──────────────────────────────────────────────────────────────────── */

/* Texto primário sempre branco no modo escuro */
.mud-typography-body1,
.mud-typography-body2,
.mud-list-item-text {
    color: #FFFFFF !important;
}

}

/* ============================================================================
   CORREÇÕES GERAIS (AMBOS OS TEMAS)
   ============================================================================ */

/* ────────────────────────────────────────────────────────────────────
   LINKS E AÇÕES
   ──────────────────────────────────────────────────────────────────── */

/* Links em modo claro - azul */
.mud-theme-light .mud-link {
    color: #0B8DBF !important;
}

/* Links em modo escuro - azul claro */
.mud-theme-dark .mud-link {
    color: #4FC3F7 !important;
}

/* ────────────────────────────────────────────────────────────────────
   MUDTEXT COM COLOR SECONDARY
   ──────────────────────────────────────────────────────────────────── */

/* Tema claro - roxo com contraste */
.mud-theme-light .mud-typography.mud-secondary-text {
    color: #6B3A9A !important;
}

/* Tema escuro - roxo claro */
.mud-theme-dark .mud-typography.mud-secondary-text {
    color: #B388E0 !important;
}

/* ────────────────────────────────────────────────────────────────────
   APPBAR
   ──────────────────────────────────────────────────────────────────── */

/* Garantir que ícones do AppBar sejam visíveis */
.mud-theme-light .mud-appbar .mud-icon-button {
    color: #1E1E1E !important;
}

.mud-theme-dark .mud-appbar .mud-icon-button {
    color: #FFFFFF !important;
}

/* ────────────────────────────────────────────────────────────────────
   INPUTS E FORMS
   ──────────────────────────────────────────────────────────────────── */

/* Label de inputs - garantir visibilidade */
.mud-theme-light .mud-input-label {
    color: #5F6368 !important;
}

.mud-theme-dark .mud-input-label {
    color: #BDBDBD !important;
}

/* Input focado - borda azul */
.mud-theme-light .mud-input-root.mud-input-root-focused .mud-input-slot-root::before {
    border-color: #0B8DBF !important;
}

.mud-theme-dark .mud-input-root.mud-input-root-focused .mud-input-slot-root::before {
    border-color: #4FC3F7 !important;
}

/* ────────────────────────────────────────────────────────────────────
   MUDPAPER COM ELEVATION
   ──────────────────────────────────────────────────────────────────── */

/* Garantir que papers tenham fundo correto */
.mud-theme-light .mud-paper {
    background-color: #FFFFFF !important;
}

.mud-theme-dark .mud-paper {
    background-color: #242424 !important;
}

/* ────────────────────────────────────────────────────────────────────
   TRANSIÇÕES SUAVES
   ──────────────────────────────────────────────────────────────────── */

/* Transições suaves para mudança de cor */
.mud-drawer .mud-nav-link,
.mud-drawer .mud-nav-link .mud-icon-root,
.mud-button-root,
.mud-chip,
.mud-link {
    transition: all 0.2s ease-in-out !important;
}