/*
 * Aequitas Auto — identidade visual.
 *
 * Paleta: navy (autoridade/confiança, ciência/Unicamp) + dourado (equidade,
 * balança da Aequitas, também o topo do próprio Selo). Prata e bronze
 * emprestados diretamente dos níveis do Selo para os badges de gradação.
 *
 * Tipografia: "Fraunces" (serifada, editorial) nos títulos para dar peso
 * institucional sem parecer jurídico-frio; "Inter" no corpo, para leitura
 * limpa em formulários e tabelas.
 */

:root {
    --aeq-navy-950: #0d1526;
    --aeq-navy-900: #141f38;
    --aeq-navy-800: #1c2c4d;
    --aeq-navy-700: #283b66;
    --aeq-gold-600: #b8912f;
    --aeq-gold-500: #cda54a;
    --aeq-gold-400: #dfc079;
    --aeq-silver-500: #9aa3af;
    --aeq-bronze-500: #b0783f;
    --aeq-bg: #f7f5ef;
    --aeq-surface: #ffffff;
    --aeq-ink: #16192a;
    --aeq-ink-muted: #5b6172;
    --aeq-border: #e4e0d4;

    --bs-body-font-family: "Inter", system-ui, -apple-system, sans-serif;
    --bs-body-bg: var(--aeq-bg);
    --bs-body-color: var(--aeq-ink);
    --bs-primary: var(--aeq-navy-800);
    --bs-primary-rgb: 28, 44, 77;
    --bs-link-color: var(--aeq-navy-800);
    --bs-link-hover-color: var(--aeq-gold-600);
    --bs-border-radius: 0.6rem;
    --bs-border-radius-lg: 0.9rem;
}

body {
    background-color: var(--aeq-bg);
}

h1, h2, h3, .display-6, .navbar-brand {
    font-family: "Fraunces", Georgia, serif;
    letter-spacing: -0.01em;
}

/* Navbar --------------------------------------------------------------- */

.navbar.aeq-navbar {
    background: linear-gradient(180deg, var(--aeq-navy-950), var(--aeq-navy-900));
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.06) inset, 0 6px 18px rgba(13, 21, 38, 0.25);
}

.aeq-navbar .navbar-brand {
    font-size: 1.35rem;
    font-weight: 600;
    color: #f4efe2;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.aeq-navbar .navbar-brand .aeq-mark {
    color: var(--aeq-gold-500);
}

.aeq-navbar .btn-outline-light {
    border-color: rgba(244, 239, 226, 0.4);
    color: #f4efe2;
}

.aeq-navbar .btn-outline-light:hover {
    background: rgba(244, 239, 226, 0.08);
    border-color: var(--aeq-gold-400);
    color: #f4efe2;
}

/* .btn-gold is a general-purpose accent button, used in the navbar, the
   hero and anywhere else a primary/positive action needs to stand out
   (e.g. "marcar para publicação"). Not scoped to a container. */
.btn-gold {
    background: var(--aeq-gold-500);
    border-color: var(--aeq-gold-500);
    color: var(--aeq-navy-950);
    font-weight: 600;
}

.btn-gold:hover {
    background: var(--aeq-gold-400);
    border-color: var(--aeq-gold-400);
    color: var(--aeq-navy-950);
}

/* Hero ------------------------------------------------------------------ */

.aeq-hero {
    background: linear-gradient(135deg, var(--aeq-navy-900), var(--aeq-navy-700));
    color: #f4efe2;
    border-radius: var(--bs-border-radius-lg);
    padding: 3.5rem 3rem;
    position: relative;
    overflow: hidden;
}

.aeq-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 82% 22%, rgba(205, 165, 74, 0.28), transparent 55%);
    pointer-events: none;
}

.aeq-hero h1 {
    font-size: clamp(2rem, 4vw, 2.75rem);
    color: #ffffff;
}

.aeq-hero .lead {
    color: #d8d3c4;
    max-width: 42rem;
    position: relative;
}

.aeq-hero .btn-gold {
    border: none;
    padding: 0.7rem 1.6rem;
    position: relative;
}

/* Cards & surfaces -------------------------------------------------------*/

.card {
    border: 1px solid var(--aeq-border);
    box-shadow: 0 1px 3px rgba(20, 31, 56, 0.06);
}

.bg-white.rounded-3.shadow-sm,
.table-responsive.bg-white.rounded-3.shadow-sm {
    border: 1px solid var(--aeq-border);
}

/* Buttons ----------------------------------------------------------------*/

.btn-primary {
    background-color: var(--aeq-navy-800);
    border-color: var(--aeq-navy-800);
}

.btn-primary:hover,
.btn-primary:focus {
    background-color: var(--aeq-navy-700);
    border-color: var(--aeq-navy-700);
}

.btn-outline-primary {
    color: var(--aeq-navy-800);
    border-color: var(--aeq-navy-800);
}

.btn-outline-primary:hover {
    background-color: var(--aeq-navy-800);
    border-color: var(--aeq-navy-800);
}

/* Selo badges --------------------------------------------------------- */

.aeq-badge {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.3rem 0.7rem;
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 600;
    letter-spacing: 0.02em;
}

.aeq-badge::before {
    content: "";
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 50%;
}

.aeq-badge-gold {
    background: linear-gradient(135deg, #f2dfa8, var(--aeq-gold-500));
    color: #4a3a0d;
}
.aeq-badge-gold::before { background: var(--aeq-gold-600); }

.aeq-badge-silver {
    background: linear-gradient(135deg, #e7eaee, var(--aeq-silver-500));
    color: #383e47;
}
.aeq-badge-silver::before { background: #6b7280; }

.aeq-badge-bronze {
    background: linear-gradient(135deg, #e7c8a6, var(--aeq-bronze-500));
    color: #4a2e12;
}
.aeq-badge-bronze::before { background: #8a5a2b; }

.aeq-badge-ungraded {
    background: #edecE6;
    color: var(--aeq-ink-muted);
}
.aeq-badge-ungraded::before { background: #b7b2a2; }

/* "Não recomendado" (REGRAS_DO_SELO.md Nível 0) — deliberately a muted
   slate/neutral tone, not red/danger. This isn't an alarm, it's a
   refusal; the styling shouldn't look like an error state. */
.aeq-badge-not-recommended {
    background: #e2e6ea;
    color: #3d4650;
}
.aeq-badge-not-recommended::before { background: #6b7684; }

/* Forms ------------------------------------------------------------------*/

.form-control:focus,
.form-select:focus {
    border-color: var(--aeq-gold-500);
    box-shadow: 0 0 0 0.2rem rgba(205, 165, 74, 0.25);
}

label {
    font-weight: 500;
    color: var(--aeq-navy-900);
}