/* 
   STUDENTPEEPS DESIGN SYSTEM ALIGNMENT
   Mapped to sp_design.css design tokens.
*/

:root {
    --background: var(--paper, #F5F6FA);
    --foreground: var(--ink, #0F1533);
    --primary: var(--blue, #2442E6);
    --primary-foreground: #FFFFFF;
    --secondary: var(--blue-ink, #1A32BF);
    --secondary-foreground: #FFFFFF;
    --muted: var(--surface-2, #EDEFF6);
    --muted-foreground: var(--ink-3, #71779A);
    --border: var(--rule, #E0E3EE);
    --input: var(--rule-2, #C8CDDE);
    --ring: var(--blue, #2442E6);
    --radius: 0.75rem;

    /* TYPOGRAPHY */
    --font-primary: var(--f, "Anek Latin", sans-serif);
    --font-display: var(--f, "Anek Latin", sans-serif);
    --font-decorative: var(--f, "Anek Latin", sans-serif);

    /* FONT SIZES */
    --font-xs: 0.75rem;
    --font-sm: 0.875rem;
    --font-base: 1rem;
    --font-lg: 1.125rem;
    --font-xl: 1.25rem;
    --font-2xl: 1.5rem;
    --font-3xl: 1.875rem;
    --font-4xl: 2.25rem;
    --font-5xl: 3rem;

    /* SPACING */
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-6: 1.5rem;
    --space-12: 3rem;
    --space-16: 4rem;

    --primary-color: var(--primary);
    --secondary-color: var(--secondary);
    --accent-color: var(--primary);
    --font-family-primary: var(--font-primary);
    --font-family-secondary: var(--font-primary);
}

body {
    background-color: var(--paper, #F5F6FA) !important;
    color: var(--ink, #0F1533) !important;
    font-family: var(--f, "Anek Latin", sans-serif) !important;
    font-size: var(--font-base);
    line-height: 1.5;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6, .heading-xl, .heading-sm {
    font-family: var(--f, "Anek Latin", sans-serif) !important;
    font-weight: 740 !important;
    color: var(--ink, #0F1533) !important;
    line-height: 1.15;
}

a {
    color: inherit;
    text-decoration: none;
}