/*
 * MyDS (Malaysia Government Design System) design tokens for the MDTM portal.
 * Colours are the MyDS primitive palette as space-separated RGB channels, used via rgb(var(--x)).
 * Headings use Poppins, body uses Inter (both self-hosted in ../fonts).
 * Source: github.com/govtechmy/myds packages/style/styles/theme/color.css
 */
:root {
    /* Primary (MyDS blue) */
    --mdtm-primary: 37 99 235;       /* primary-600 #2563eb */
    --mdtm-primary-700: 29 78 216;   /* primary-700 */
    --mdtm-primary-50: 239 246 255;  /* primary-50 */

    /* Neutrals */
    --mdtm-ink: 24 24 27;            /* gray-900 */
    --mdtm-muted: 107 107 116;       /* gray-500 */
    --mdtm-line: 228 228 231;        /* gray-200 */
    --mdtm-bg: 255 255 255;          /* white */
    --mdtm-bg-alt: 244 244 245;      /* gray-100 */

    /* Status */
    --mdtm-danger: 220 38 38;        /* danger-600 */
    --mdtm-success: 22 163 74;       /* success-600 */
    --mdtm-warning: 234 179 8;       /* warning-500 */

    /* Government bar + main navigation */
    --mdtm-gov-bg: 23 37 84;         /* primary-950 (jalur kerajaan gelap) */
    --mdtm-gov-bg-2: 30 58 138;      /* primary-900, hover/active on the navy bars */

    /* MDTM crest accents (yellow + red) for section headings and the active nav item */
    --mdtm-accent: 234 179 8;        /* warning-500 #eab308 */
    --mdtm-accent-2: 220 38 38;      /* danger-600 */

    /* Typography (MyDS: Poppins headings, Inter body) */
    --mdtm-font-head: "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;
    --mdtm-font-body: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
}

body {
    font-family: var(--mdtm-font-body);
    color: rgb(var(--mdtm-ink));
    background: rgb(var(--mdtm-bg));
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--mdtm-font-head);
    font-weight: 600;
    color: rgb(var(--mdtm-ink));
}

/* MyDS heading sizes */
h1 { font-size: 2.25rem; line-height: 2.75rem; }   /* 36/44 */
h2 { font-size: 1.875rem; line-height: 2.375rem; } /* 30/38 */
h3 { font-size: 1.5rem; line-height: 2rem; }       /* 24/32 */
h4 { font-size: 1.25rem; line-height: 1.75rem; }   /* 20/28 */

body, p { font-size: 1rem; line-height: 1.75rem; } /* 16/28 */

a { color: rgb(var(--mdtm-primary)); }
a:hover { color: rgb(var(--mdtm-primary-700)); }