/**
 * Global Styles
 * Base typography and shared element styles.
 */
body {
    background-color: var(--color-background);
    color: var(--color-on-surface);
    font-family: var(--font-body);
    font-size: 16px;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-headline);
    color: var(--color-on-surface);
    line-height: 1.2;
}

h1 { font-size: 2.5rem; font-weight: 800; }
h2 { font-size: 2rem; font-weight: 700; }
h3 { font-size: 1.5rem; font-weight: 700; }

.text-primary { color: var(--color-primary); }
.text-on-surface-variant { color: var(--color-on-surface-variant); }

/* Utilities */
.primary-gradient { 
    background: linear-gradient(135deg, #003d9b 0%, #0052cc 100%); 
}

.material-symbols-outlined { 
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24; 
    vertical-align: middle; 
}

/* Transitions */
a, button, input {
    transition: var(--transition-base);
}

/* Scrollbar */
::-webkit-scrollbar {
    width: 8px;
}
::-webkit-scrollbar-track {
    background: var(--color-surface-container);
}
::-webkit-scrollbar-thumb {
    background: var(--color-outline-variant);
    border-radius: var(--radius-full);
}
::-webkit-scrollbar-thumb:hover {
    background: var(--color-outline);
}