/* file: portal/app/static/css/spacing.css
 *
 * Spacing tokens — based on 4px grid.
 * --space-N where N is the multiplier of 4px.
 * Also includes border radii and box shadows.
 */

@layer tokens {

:root {
    /* --- Spacing (4px base grid) --- */
    --space-0:   0;
    --space-1:   0.25rem;   /*  4px */
    --space-2:   0.5rem;    /*  8px */
    --space-3:   0.75rem;   /* 12px */
    --space-4:   1rem;      /* 16px */
    --space-5:   1.25rem;   /* 20px */
    --space-6:   1.5rem;    /* 24px */
    --space-8:   2rem;      /* 32px */
    --space-10:  2.5rem;    /* 40px */
    --space-12:  3rem;      /* 48px */
    --space-16:  4rem;      /* 64px */

    /* --- Border radii (purpose-named) --- */
    --radius-chip:   5px;        /* small chips: step chips, metadata chips */
    --radius-field:  0.375rem;   /* inputs, selects */
    --radius-box:    0.5rem;     /* cards, panels, modals */
    --radius-button: 12px;       /* primary, secondary, outline buttons */
    --radius-full:   9999px;     /* pills, avatars, circular buttons */

    /* --- Box shadows --- */
    --shadow-sm:  0 1px 2px rgba(0, 0, 0, 0.05);
    --shadow-md:  0 4px 6px rgba(0, 0, 0, 0.07);
    --shadow-lg:  0 10px 15px rgba(0, 0, 0, 0.1);
}

} /* end @layer tokens */
