/* =============================================
    ARQUIVO: /css/theme-tech.css (UNIFICADO)
    Este arquivo define as cores e as aplica
    tanto no catálogo quanto nos detalhes.
============================================= */

/* =============================================
   1. DEFINIÇÃO DE VARIÁVEIS (O SEU CÓDIGO ATUAL)
============================================= */
body.page-tech {
    /* -- Variáveis do Esqueleto -- */
    --theme-body-bg: linear-gradient(180deg, #1A1D24 0%, #121212 40%);
    --theme-text-light: #f0f0f0;
    --theme-text-muted: #b5b5b5; /* Corrigido para ser legível */
    --theme-bg-dark: #121212;

    --theme-primary: #00BFFF; /* Azul Neon */
    --theme-primary-light: #40C9FF; /* Adicionei esta para o gradiente */
    --theme-secondary: rgb(30, 53, 255); /* azul */
    
    --theme-header-image: url('/img/tecnologia.jpg'); 
    --theme-header-position: center center;
    --theme-header-border: 2px solid var(--theme-primary);
    --theme-header-shadow: 0 5px 20px rgba(0, 0, 0, 0.4);
    
    --theme-title-gradient: linear-gradient(to right, var(--theme-primary), var(--theme-secondary));
    
    --theme-card-bg: #1A1D24;
    --theme-card-border: #333;
    --theme-card-icon-bg: #121212;
    --theme-shadow: rgba(0, 191, 255, 0.3); /* Nome genérico para sombra */
    --theme-card-hover-shadow: 0 10px 25px var(--theme-shadow);
    
    --theme-icon-shadow: 0 0 10px var(--theme-shadow);
    
    --theme-button-text: var(--theme-primary);
    --theme-button-border: 2px solid var(--theme-primary);
    --theme-button-hover-bg: linear-gradient(90deg, var(--theme-primary), var(--theme-secondary));
    --theme-button-hover-shadow: 0 0 15px var(--theme-shadow), 0 0 15px rgba(218, 0, 255, 0.3);
    
    --theme-mobile-arrow-color: var(--theme-primary) !important;
    
    /* Variáveis do Bootstrap (Accordion) */
    --bs-accordion-color: var(--theme-text-light);
    --bs-accordion-bg: var(--theme-card-bg);
    --bs-accordion-border-color: var(--theme-card-border);
    --bs-accordion-button-active-bg: #22252e;
    --bs-accordion-button-active-color: var(--theme-primary);
    --bs-accordion-btn-focus-box-shadow: 0 0 10px var(--theme-shadow);
    --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23f0f0f0'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
    --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%2300BFFF'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");

    /* Aplicação das Cores Básicas */
    background: var(--theme-body-bg);
    color: var(--theme-text-light);
}

/* Correção do text-muted */
.page-tech .text-muted,
body.page-tech .text-muted {
    color: var(--theme-text-muted) !important;
}

/* Sobrescrita para o footer (do seu arquivo) */
.page-tech footer {
    color: white !important;
}

/* =============================================
   2. APLICAÇÃO DO TEMA (PÁGINA DE DETALHES)
   (Este é o bloco novo que você deve ADICIONAR)
============================================= */

/* Aplica cores ao esqueleto .page-course-detail */
.page-tech.page-course-detail .course-hero {
    /* A imagem de fundo do hero de catálogo é diferente, então definimos uma nova */
    background-image: linear-gradient(rgba(18, 18, 18, 0.85), rgba(18, 18, 18, 0.85)), url('../../img/tecnologia.png'); /* Verifique este caminho */
    border-bottom: 2px solid var(--theme-primary);
}
.page-tech.page-course-detail .course-hero .icon {
    color: var(--theme-primary);
    text-shadow: 0 0 10px var(--theme-shadow);
}
.page-tech.page-course-detail .course-hero .meta-pill {
    background: rgba(0, 191, 255, 0.1);
    border: 1px solid var(--theme-primary);
}
.page-tech.page-course-detail .course-hero .meta-pill i {
    color: var(--theme-primary-light);
}
.page-tech.page-course-detail .content-card {
    background-color: var(--theme-card-bg);
    border: 1px solid var(--theme-card-border);
}
.page-tech.page-course-detail .category-title {
    color: var(--theme-text-light) !important;
    border-bottom: 3px solid var(--theme-primary);
}
.page-tech.page-course-detail .tech-checklist li::before {
    color: var(--theme-primary);
    text-shadow: 0 0 8px var(--theme-shadow);
}
.page-tech.page-course-detail .career-tags .tag {
    background-color: #2a2a2a;
    border: 1px solid #444;
    color: var(--theme-text-muted);
}
.page-tech.page-course-detail .salary-level .bar-inner {
    background: linear-gradient(90deg, var(--theme-primary-light), var(--theme-primary));
    box-shadow: 0 0 8px var(--theme-shadow);
}
.page-tech.page-course-detail .price-card {
    background: linear-gradient(145deg, var(--theme-card-bg), #22252e);
    border: 1px solid var(--theme-primary);
    box-shadow: 0 0 20px var(--theme-shadow);
}
.page-tech.page-course-detail .price-card .price-new {
    color: var(--theme-primary);
}
.page-tech.page-course-detail .btn-cta-theme {
    color: var(--theme-primary);
    border: 2px solid var(--theme-primary);
    background: transparent;
}
.page-tech.page-course-detail .btn-cta-theme:hover {
    background-color: var(--theme-primary);
    color: var(--theme-bg-dark); /* Texto escuro no hover */
    box-shadow: 0 0 20px var(--theme-shadow);
}