/**
 * Tema PACS — Instituto do Coração
 * Paleta unificada (login + app interno + compartilhamento)
 */
:root {
    --font: Verdana, Geneva, sans-serif;

    /* Teal escuro (header, navbar, rodapé) */
    --dark-teal: #0a2f2f;
    --dark-teal-deep: #071f1f;
    --dark-teal-mid: #0c3838;

    /* Verde principal */
    --green: #1a9e52;
    --green-dark: #15803d;
    --green-light: #22c55e;
    --green-glow: #22c55e;
    --green-soft: #e8f7ef;

    /* Superfícies e texto */
    --page-bg: #eceff0;
    --white: #ffffff;
    --text: #1f2937;
    --text-dark: #1f2937;
    --text-muted: #6b7280;
    --border: #dfe3e8;
    --background-light: #eceff0;

    /* Raio e sombras */
    --radius-xl: 16px;
    --radius-lg: 12px;
    --shadow: 0 4px 24px rgba(15, 35, 35, 0.08);
    --shadow-lg: 0 8px 32px rgba(15, 35, 35, 0.10);

    /* Aliases legados (compatibilidade com style.css / viewer) */
    --primary-green: var(--green);
    --primary-green-dark: var(--green-dark);
    --primary-green-light: var(--green-light);

    /* Semântico — ações destrutivas / alertas */
    --accent-red: #dc3545;
    --accent-red-dark: #b91c1c;
    --accent-red-light: #f87171;

    /* Gradientes reutilizáveis */
    --gradient-header: linear-gradient(180deg, var(--dark-teal-mid) 0%, var(--dark-teal) 55%, var(--dark-teal-deep) 100%);
    --gradient-green-btn: linear-gradient(180deg, #1fad58 0%, var(--green) 45%, var(--green-dark) 100%);
    --gradient-accent-bar: linear-gradient(90deg, var(--dark-teal), var(--green));

    /* Navbar */
    --app-nav-bg-start: var(--dark-teal-mid);
    --app-nav-bg-end: var(--dark-teal-deep);
    --app-nav-surface: rgba(255, 255, 255, 0.10);
    --app-nav-surface-hover: rgba(255, 255, 255, 0.16);
    --app-nav-surface-active: rgba(255, 255, 255, 0.22);
    --app-nav-text: rgba(255, 255, 255, 0.92);
    --app-nav-text-muted: rgba(255, 255, 255, 0.72);

    /* Share mobile */
    --share-green: var(--green);
    --share-green-dark: var(--green-dark);

    /* RGBA helpers (focus rings, hovers) */
    --green-ring: rgba(26, 158, 82, 0.25);
    --green-ring-soft: rgba(26, 158, 82, 0.12);
    --green-overlay: rgba(26, 158, 82, 0.22);
    --green-border: rgba(26, 158, 82, 0.65);
}

html,
body {
    font-family: var(--font);
}