/* ==========================================================================
   FOLHA DE ESTILOS UNIFICADA - DASHBOARD PREMIUM v6.0
   Padrão ANAK - Vermelho #a61e20
   Descrição: Design ultra premium com performance otimizada
   ========================================================================== */

/* === Variáveis Globais do Sistema === */
:root {
    /* Cores Principais ANAK */
    --cor-principal: #a61e20;
    --cor-principal-anak: #a61e20;
    --cor-principal-hover: #8a1a1c;
    
    /* Cores dos Cards por Categoria */
    --cor-card-1: #a61e20;      /* Alunos Cadastrados - Vermelho ANAK */
    --cor-card-2: #28a745;      /* Alunos Ativos - Verde Sucesso */
    --cor-card-3: #17a2b8;      /* Alunos Novos - Azul Info */
    --cor-card-4: #fd7e14;      /* Matrículas Ativas - Laranja */
    
    /* Cores de Texto e Interface */
    --cor-texto-titulo: #1e2022;
    --cor-texto-legenda: #6c757d;
    --cor-texto-secundario: #8b92a8;
    --cor-borda-card: #e9ecef;
    --cor-fundo-card: #ffffff;
    --cor-fundo-page: linear-gradient(135deg, #f5f7fa 0%, #e9ecef 100%);
    
    /* Sombras Premium */
    --sombra-card-sutil: 0 4px 15px rgba(0, 0, 0, 0.04);
    --sombra-card-hover: 0 12px 30px rgba(0, 0, 0, 0.1);
    --sombra-botao: 0 8px 20px rgba(166, 30, 32, 0.25);
    --sombra-botao-hover: 0 12px 28px rgba(166, 30, 32, 0.35);
    
    /* Fontes */
    --fonte-principal: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --fonte-principal-ui: var(--fonte-principal);
}

/* === Container Principal Isolado === */
.container-fluid.inimacao {

    min-height: 100vh !important;
    padding: 2rem !important;
    position: relative !important;
}

/* === Título Principal (h1) === */
.container-fluid.inimacao #hopscotch-title,
.container-fluid.inimacao h1.h1-reponsive {
    font-family: var(--fonte-principal) !important;
    font-size: 32px !important;
    font-weight: 700 !important;
    color: var(--cor-texto-titulo) !important;
    margin-bottom: 30px !important;
    padding-left: 15px !important;
    border-left: 5px solid var(--cor-principal-anak) !important;
    line-height: 1.2 !important;
    letter-spacing: -0.5px !important;
}

/* === Breadcrumb Premium === */
.container-fluid.inimacao .breadcrumb {
    
    backdrop-filter: blur(8px) !important;
    border: 1px solid var(--cor-borda-card) !important;
    border-radius: 12px !important;
    padding: 0.75rem 1.25rem !important;
    box-shadow: var(--sombra-card-sutil) !important;
    margin-bottom: 1.5rem !important;
}

.container-fluid.inimacao .breadcrumb-item a {
    color: var(--cor-principal-anak) !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    transition: opacity 0.2s ease !important;
}

.container-fluid.inimacao .breadcrumb-item a:hover {
    opacity: 0.7 !important;
}

/* === Botão de Ajuda Premium === */
.container-fluid.inimacao .btn-default {
    background: var(--cor-principal-anak) !important;
    color: white !important;
    border: none !important;
    border-radius: 30px !important;
    padding: 0.75rem 2rem !important;
    font-weight: 600 !important;
    box-shadow: var(--sombra-botao) !important;
    transition: all 0.2s ease !important;
    font-size: 14px !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.container-fluid.inimacao .btn-default:hover {
    background: var(--cor-principal-hover) !important;
    transform: translateY(-2px) !important;
    box-shadow: var(--sombra-botao-hover) !important;
}

.container-fluid.inimacao .btn-default i {
    margin-right: 8px !important;
}

/* === Welcome Text === */
.container-fluid.inimacao .welcome-text {
    background: white !important;
    border-radius: 16px !important;
    padding: 1.5rem 2rem !important;
    margin: 1.5rem 0 !important;
    box-shadow: var(--sombra-card-sutil) !important;
    border: 1px solid var(--cor-borda-card) !important;
}

.container-fluid.inimacao .welcome-text h4 {
    font-size: 1.25rem !important;
    font-weight: 600 !important;
    color: var(--cor-texto-titulo) !important;
    margin: 0 !important;
}

/* === Cards Cascading Admin (Estilo Base Unificado) === */
.container-fluid.inimacao .cascading-admin-card,
.container-fluid.inimacao .card.features {
    background: var(--cor-fundo-card) !important;
    border: 1px solid var(--cor-borda-card) !important;
    border-radius: 16px !important;
    padding: 28px !important;
    position: relative !important;
    overflow: hidden !important;
    box-shadow: var(--sombra-card-sutil) !important;
    transition: transform 0.25s ease, box-shadow 0.25s ease !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    height: 160px !important;
    margin-bottom: 1.5rem !important;
}

/* === Hover Otimizado (sem animações pesadas) === */
.container-fluid.inimacao .cascading-admin-card:hover,
.container-fluid.inimacao .card.features:hover {
    transform: translateY(-5px) !important;
    box-shadow: var(--sombra-card-hover) !important;
}

/* === Barra Superior Colorida === */
.container-fluid.inimacao .cascading-admin-card::before,
.container-fluid.inimacao .card.features::before {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 5px !important;
    background-color: var(--cor-padrao, var(--cor-principal-anak)) !important;
    border-radius: 15px 15px 0 0 !important;
}

/* === Cores Específicas dos Cards === */
.container-fluid.inimacao #tur01.cascading-admin-card::before { 
    background-color: var(--cor-card-1) !important; 
}
.container-fluid.inimacao #tur02.cascading-admin-card::before { 
    background-color: var(--cor-card-2) !important; 
}
.container-fluid.inimacao #tur03.cascading-admin-card::before { 
    background-color: var(--cor-card-3) !important; 
}
.container-fluid.inimacao #tur04.cascading-admin-card::before { 
    background-color: var(--cor-card-4) !important; 
}

/* === Admin-up Container === */
.container-fluid.inimacao .admin-up {
    position: relative !important;
    z-index: 2 !important;
    padding: 0 !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    gap: 8px !important;
    height: auto !important;
}

/* === Ícones (FA Icons) - Marca d'água === */
.container-fluid.inimacao .admin-up .fa,
.container-fluid.inimacao .admin-up .fas,
.container-fluid.inimacao .admin-up i[class*="fa-"] {
    position: absolute !important;
    right: 15px !important;
    bottom: -10px !important;
    font-size: 58px !important;
    color: rgba(0, 0, 0, 0.06) !important;
    z-index: 1 !important;
    transform: rotate(-10deg) !important;
    opacity: 0.9 !important;
    transition: none !important; /* Remove animações dos ícones */
}

/* === Textos e Dados dos Cards === */
.container-fluid.inimacao .data p,
.container-fluid.inimacao .admin-tt,
.container-fluid.inimacao .text-uppercase {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--cor-texto-legenda) !important;
    margin: 0 0 8px 0 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
}

.container-fluid.inimacao .data h4,
.container-fluid.inimacao .font-weight-bold {
    font-family: var(--fonte-principal) !important;
    font-weight: 700 !important;
    font-size: 42px !important;
    color: var(--cor-texto-titulo) !important;
    margin: 0 !important;
    line-height: 1 !important;
}

/* === Estilo DRTY (Números com infinito) === */
.container-fluid.inimacao .drty {
    display: flex !important;
    align-items: baseline !important;
    gap: 8px !important;
    margin: 0 !important;
    font-family: var(--fonte-principal) !important;
    font-weight: 700 !important;
    font-size: 42px !important;
    color: var(--cor-texto-titulo) !important;
    line-height: 1 !important;
}

.container-fluid.inimacao .drty .label-default {
    font-size: 28px !important;
    font-weight: 500 !important;
    color: var(--cor-texto-legenda) !important;
    background: none !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: baseline !important;
}

.container-fluid.inimacao .drty .label-success {
    background: none !important;
    color: var(--cor-texto-titulo) !important;
    font-size: 42px !important;
    font-weight: 700 !important;
    padding: 0 !important;
}

/* === Cards Dashboard Gerais (outros cards) === */
.container-fluid.inimacao .idorew {
    padding: 0 0.75rem !important;
    margin-bottom: 1.5rem !important;
}

/* === Labels Gerais === */
.container-fluid.inimacao .label {
    padding: 0.35rem 0.75rem !important;
    border-radius: 20px !important;
    font-weight: 600 !important;
    font-size: 0.85rem !important;
    display: inline-block !important;
    margin: 0.2rem !important;
}

.container-fluid.inimacao .label-default {
    background: #f1f3f4 !important;
    color: var(--cor-texto-legenda) !important;
    border: 1px solid #e0e0e0 !important;
}

.container-fluid.inimacao .label-success {
    background: #e8f5e9 !important;
    color: #2e7d32 !important;
    border: 1px solid #c8e6c9 !important;
}

/* === Canvas e Gráficos === */
.container-fluid.inimacao canvas {
    border-radius: 8px !important;
    background: rgba(255, 255, 255, 0.5) !important;
    padding: 0.5rem !important;
}

/* === Limpar Card Body Vazio === */
.container-fluid.inimacao .card-body-cascade,
.container-fluid.inimacao .card-body:empty {
    display: none !important;
}

/* === Responsividade === */
@media (max-width: 768px) {
    .container-fluid.inimacao {
        padding: 1rem !important;
    }
    
    .container-fluid.inimacao .cascading-admin-card,
    .container-fluid.inimacao .card.features {
        height: 140px !important;
        padding: 20px !important;
        margin-bottom: 1rem !important;
    }
    
    .container-fluid.inimacao #hopscotch-title,
    .container-fluid.inimacao h1.h1-reponsive {
        font-size: 24px !important;
        margin-bottom: 20px !important;
    }
    
    .container-fluid.inimacao .data h4,
    .container-fluid.inimacao .drty,
    .container-fluid.inimacao .font-weight-bold {
        font-size: 32px !important;
    }
    
    .container-fluid.inimacao .admin-up .fa,
    .container-fluid.inimacao .admin-up i[class*="fa-"] {
        font-size: 45px !important;
    }
}

@media (max-width: 480px) {
    .container-fluid.inimacao .btn-default {
        padding: 0.5rem 1rem !important;
        font-size: 12px !important;
    }
    
    .container-fluid.inimacao .data h4,
    .container-fluid.inimacao .drty {
        font-size: 28px !important;
    }
}

/* === Desabilitar Animações Pesadas === */
.container-fluid.inimacao .animated,
.container-fluid.inimacao .bounceInUp,
.container-fluid.inimacao .bounceInDown,
.container-fluid.inimacao .shake {
    animation: none !important;
    animation-duration: 0s !important;
}

/* === Performance - GPU Acceleration === */
.container-fluid.inimacao .cascading-admin-card,
.container-fluid.inimacao .card.features {
    will-change: transform, box-shadow !important;
    backface-visibility: hidden !important;
    perspective: 1000px !important;
}