/* =================================================================
   ARQUIVO: style.css (V 20.0 - FINAL)
   MÓDULO: Gestão Pública
   CORREÇÃO: Sticky Tracker Posicionado Corretamente
   ================================================================= */

/* 1. TIPOGRAFIA & BASE */

#nav-placeholder {
    font-family: 'Inter', sans-serif !important;
}

.prose-academic {
    font-family: 'Merriweather', serif;
    color: #374151;
    line-height: 1.9;
    font-size: 1.1rem;
}
.prose-academic h3 {
    font-family: 'Inter', sans-serif;
    font-size: 1.5rem;
    color: #111827;
    font-weight: 800;
    margin-top: 2.5rem;
    margin-bottom: 1rem;
    border-bottom: 2px solid #f3f4f6;
    padding-bottom: 0.5rem;
}
.prose-academic p { margin-bottom: 1.5rem; text-align: justify; }
.prose-academic ul { list-style-type: disc; padding-left: 1.5rem; margin-bottom: 1.5rem; }

/* 2. SIDEBAR PRINCIPAL (Menu da Aula) */
.sidebar-sticky { 
    position: sticky; 
    top: 6rem; 
    max-height: calc(100vh - 7rem); 
    overflow-y: auto;
    scrollbar-width: thin;
}
.unit-link:hover { background-color: #fffbeb; color: #b45309; }

/* 3. ESTILOS DO QUIZ (CARDS) */
.question-card {
    background: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 0.75rem;
    padding: 1.75rem;
    margin-bottom: 3rem;
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
    /* Garante que o scroll pare antes de esconder o título */
    scroll-margin-top: 180px; 
}

.option-label {
    display: block;
    padding: 1.25rem;
    border: 1px solid #e5e7eb;
    border-radius: 0.5rem;
    cursor: pointer;
    transition: all 0.2s;
    background-color: #fff;
    margin-bottom: 0.75rem;
}
.option-label:hover { background-color: #fffbeb; border-color: #d97706; }

.option-radio {
    accent-color: #d97706;
    margin-right: 1rem;
    transform: scale(1.4);
}

/* 4. TRACKER (GABARITO LATERAL) - CORREÇÃO DO STICKY */

/* Esta classe faz o tracker "flutuar" acompanhando a rolagem */
.tracker-sticky {
    position: sticky; /* O segredo do funcionamento */
    top: 7rem !important; /* Distância do topo (Abaixo do Header do Modal) */
    z-index: 20;
    align-self: flex-start; /* Garante que o elemento não estique */
}

.tracker-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 0.75rem;
}

.tracker-square {
    width: 100%;
    height: 3.5rem; /* Tamanho Grande Aprovado */
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #f9fafb;
    border: 2px solid #e5e7eb;
    border-radius: 0.5rem;
    font-weight: 800;
    font-size: 1.25rem;
    color: #9ca3af;
    cursor: pointer;
    transition: all 0.2s;
    box-shadow: 0 1px 2px rgba(0,0,0,0.05);
}

.tracker-square:hover { 
    background-color: #fff; 
    border-color: #d97706;
    color: #d97706;
    transform: translateY(-2px);
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
}

/* Estados do Tracker */
.tracker-square.filled { background-color: #3b82f6; color: white; border-color: #2563eb; }
.tracker-square.correct-green { background-color: #16a34a; color: white; border-color: #15803d; }
.tracker-square.wrong-red { background-color: #dc2626; color: white; border-color: #b91c1c; }

/* 5. FEEDBACK E MODAIS */
.correct-highlight { background-color: #dcfce7 !important; border-color: #16a34a !important; color: #14532d; }
.wrong-highlight { background-color: #fee2e2 !important; border-color: #dc2626 !important; color: #7f1d1d; }

.explanation-box {
    margin-top: 1.5rem;
    padding: 1.5rem;
    background-color: #f8fafc;
    border-left: 5px solid #64748b;
    border-radius: 0.5rem;
    display: none;
    line-height: 1.6;
}
.explanation-box.show { display: block; animation: fadeIn 0.4s ease-out; }

/* Animações Leves */
@keyframes fadeIn { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }
.animate-fade-in { animation: fadeIn 0.3s ease-out forwards; }

#timer-display.danger { color: #dc2626; animation: pulse 1s infinite; }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.5; } }