/*
 * Legacy AURA token names retained for existing role stylesheets.
 * Values stay aligned with aura-design-system.css.
 */
:root {
    --aura-font-heading-large: 26px;
    --aura-font-heading-small: 18px;
    --aura-font-text: 14px;
    --aura-font-text-small: 12px;
    --aura-font-number: 28px;

    --aura-font-normal: 400;
    --aura-font-medium: 500;
    --aura-font-heading: 600;

    --aura-line-heading: 1.2;
    --aura-line-heading-small: 1.25;
    --aura-line-heading-tertiary: 1.3;
    --aura-line-text: 1.45;

    --aura-color-text: #18324b;
    --aura-color-heading: #18324b;
    --aura-color-muted: #64748b;
    --aura-color-primary: #075fa8;
    --aura-color-primary-hover: #064d88;
    --aura-color-border: #e1e8ee;
    --aura-color-surface: #ffffff;
    --aura-color-background: #f4f7fa;

    --aura-space-page: 28px;
    --aura-space-section: 24px;
    --aura-space-card: 18px;
    --aura-gap-card: 16px;
    --aura-radius-card: 12px;
    --aura-shadow-card: 0 4px 16px rgba(24, 50, 75, .05);
}

html { font-size: var(--aura-font-text); }

body,
button,
input,
select,
textarea {
    font-family: Arial, Helvetica, sans-serif;
    font-size: var(--aura-font-text);
    font-weight: var(--aura-font-normal);
}

body {
    color: var(--aura-color-text);
    background: var(--aura-color-background);
    line-height: var(--aura-line-text);
}

a {
    color: inherit;
    text-decoration: none;
    transition: color .15s ease;
}

a:hover,
a:focus-visible { color: var(--aura-color-primary); }

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 2px solid var(--aura-color-primary);
    outline-offset: 3px;
}

.aura-heading-1 {
    font-size: var(--aura-font-heading-large);
    font-weight: var(--aura-font-heading);
    line-height: var(--aura-line-heading);
}

.aura-heading-2 {
    font-size: var(--aura-font-heading-small);
    font-weight: var(--aura-font-heading);
    line-height: var(--aura-line-heading-small);
}

.aura-heading-3 {
    font-size: 15px;
    font-weight: var(--aura-font-heading);
    line-height: var(--aura-line-heading-tertiary);
}

.aura-text {
    font-size: var(--aura-font-text);
    font-weight: var(--aura-font-normal);
    line-height: var(--aura-line-text);
}

.aura-text-small {
    font-size: var(--aura-font-text-small);
    font-weight: var(--aura-font-normal);
    line-height: var(--aura-line-text);
}

.aura-number {
    font-size: var(--aura-font-number);
    font-weight: var(--aura-font-heading);
    line-height: 1.2;
}

@media (max-width: 760px) {
    :root {
        --aura-space-page: 20px;
        --aura-space-card: 18px;
    }
}