/* ===================== GeraProva — tema (cores + fonte + animações) ===================== */
:root {
    --gp-indigo: #4f46e5;
    --gp-purple: #7c3aed;
    --gp-blue: #3b82f6;
    --gp-grad: linear-gradient(120deg, #4f46e5 0%, #7c3aed 100%);
    --gp-grad-vivo: linear-gradient(120deg, #3b82f6, #4f46e5, #6366f1, #7c3aed);
    --gp-ink: #1b1733;
}

html, body {
    font-family: 'Plus Jakarta Sans', 'Segoe UI', system-ui, -apple-system, sans-serif;
    background: #f5f6fc;
    color: var(--gp-ink);
    scroll-behavior: smooth;
}

a, .btn-link { color: #5a4bd6; text-decoration: none; }
a:hover { color: #764ba2; }
h1, h2, h3, .fw-bold, .fw-semibold { letter-spacing: -0.015em; }

/* ----- gradiente animado (hero / faixas) ----- */
@keyframes gpShift {
    0% { background-position: 0% 50%; }
    50% { background-position: 100% 50%; }
    100% { background-position: 0% 50%; }
}
.gp-anim-grad {
    background: var(--gp-grad-vivo);
    background-size: 300% 300%;
    animation: gpShift 16s ease infinite;
}

/* ----- botões ----- */
.btn { transition: transform .12s ease, box-shadow .15s ease, filter .12s ease, background-position .4s ease; border-radius: .6rem; }
.btn:hover { transform: translateY(-1px); }
.btn-primary {
    --bs-btn-bg: #667eea; --bs-btn-border-color: #667eea;
    --bs-btn-hover-bg: #5a4bd6; --bs-btn-hover-border-color: #5a4bd6;
    --bs-btn-active-bg: #764ba2; --bs-btn-active-border-color: #764ba2;
}
.btn-gradient {
    background: linear-gradient(90deg, #667eea, #764ba2, #667eea);
    background-size: 200% auto;
    color: #fff; border: 0;
}
.btn-gradient:hover { background-position: right center; color: #fff; box-shadow: 0 8px 20px rgba(102,80,170,.35); }

.text-primary { color: #5a4bd6 !important; }
.btn:focus, .btn:active:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 .1rem #fff, 0 0 0 .25rem #8a7bf0;
}

/* ----- cards ----- */
.card {
    border: 1px solid rgba(118, 75, 162, 0.16);
    border-radius: 1rem; background: #fff;
    box-shadow: 0 8px 24px rgba(40, 40, 90, 0.06);
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.card:hover { transform: translateY(-5px); border-color: rgba(118, 75, 162, 0.45); box-shadow: 0 18px 42px rgba(102, 80, 170, 0.18); }

/* ----- pílula de ícone colorida ----- */
.gp-ico {
    width: 3rem; height: 3rem; flex: 0 0 auto;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: .9rem; color: #fff; font-size: 1.35rem;
    box-shadow: 0 6px 16px rgba(0,0,0,.12);
    transition: transform .18s ease;
}
.card:hover .gp-ico { transform: scale(1.08) rotate(-3deg); }
.gp-grad-1 { background: linear-gradient(135deg, #4f46e5, #7c3aed); }
.gp-grad-2 { background: linear-gradient(135deg, #3b82f6, #4f46e5); }
.gp-grad-3 { background: linear-gradient(135deg, #4facfe, #2563eb); }
.gp-grad-4 { background: linear-gradient(135deg, #6366f1, #8b5cf6); }
.gp-grad-5 { background: linear-gradient(135deg, #8b5cf6, #6d28d9); }
.gp-grad-6 { background: linear-gradient(135deg, #06b6d4, #4f46e5); }

/* ----- número grande com gradiente ----- */
.gp-stat {
    font-weight: 800;
    background: var(--gp-grad);
    -webkit-background-clip: text; background-clip: text; color: transparent;
}

/* ----- plano em destaque ----- */
.gp-destaque { outline: 2px solid #667eea; transform: scale(1.03); }
.gp-destaque:hover { transform: scale(1.03) translateY(-5px); }
.gp-badge-grad { background: var(--gp-grad); color: #fff; }

/* ----- navbar com leve blur ----- */
.gp-navbar { backdrop-filter: saturate(140%) blur(2px); }

/* ----- tabela ----- */
.table > :not(caption) > * > * { padding: .8rem 1rem; }

/* ----- entrada suave do conteúdo (troca de página) ----- */
@keyframes gpFadeUp {
    from { opacity: 0; transform: translateY(10px); }
    to { opacity: 1; transform: translateY(0); }
}
/* fill-mode "backwards" (não "both"): um transform residual no fim da animação
   viraria containing block e quebraria position:fixed dos modais internos. */
.gp-app-main > *, .gp-public-main > * {
    animation: gpFadeUp .35s ease backwards;
}

/* ----- detalhes de plataforma moderna ----- */
::selection { background: rgba(124, 58, 237, .22); color: inherit; }

* { scrollbar-width: thin; scrollbar-color: #c7c9f0 transparent; }
*::-webkit-scrollbar { width: 9px; height: 9px; }
*::-webkit-scrollbar-thumb { background: #c7c9f0; border-radius: 99px; }
*::-webkit-scrollbar-thumb:hover { background: #a5a8e8; }
*::-webkit-scrollbar-track { background: transparent; }

:focus-visible {
    outline: 3px solid rgba(124, 58, 237, .5);
    outline-offset: 2px;
    border-radius: .35rem;
}

/* ----- badge/chip reutilizável ----- */
.gp-chip {
    display: inline-flex; align-items: center; gap: .4rem;
    padding: .3rem .75rem;
    border-radius: 999px;
    background: rgba(79, 70, 229, .1);
    color: #4f46e5;
    font-size: .78rem; font-weight: 800;
}

/* ----- skeleton de carregamento ----- */
@keyframes gpShimmer {
    from { background-position: 200% 0; }
    to { background-position: -200% 0; }
}
.gp-skeleton {
    border-radius: .6rem;
    background: linear-gradient(90deg, #ecedfa 25%, #f8f8ff 50%, #ecedfa 75%);
    background-size: 200% 100%;
    animation: gpShimmer 1.4s linear infinite;
    color: transparent;
    user-select: none;
}

/* ----- respeita usuários sensíveis a movimento ----- */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
    html, body { scroll-behavior: auto; }
}

/* ===================== infra do Blazor (manter) ===================== */
.content { padding-top: 1.1rem; }
h1:focus { outline: none; }
.valid.modified:not([type=checkbox]) { outline: 1px solid #26b050; }
.invalid { outline: 1px solid #e50000; }
.validation-message { color: #e50000; }

.blazor-error-boundary { background: #b32121; padding: 1rem; color: #fff; }
.blazor-error-boundary::after { content: "Ocorreu um erro."; }

.darker-border-checkbox.form-check-input { border-color: #929292; }

/* ----- impressão: esconde o shell do app (cartão-resposta, provas, etc.) ----- */
@media print {
    .gp-topbar, .gp-sidebar, .gp-footer, .gp-public-topbar { display: none !important; }
    .gp-app-main { margin: 0 !important; padding: 0 !important; }
    body { background: #fff !important; }
}