/*
 * Shadow utility classes
 * Source: Figma UiKit57Hours / tokens.source.json (57hours UI kit)
 *
 * Requires design-tokens.css to be loaded first (shadow CSS variables).
 *
 * Usage: add the class to any element to apply the shadow.
 * Example: <div class="shadow-md">Card content</div>
 *
 * Shadow scale:
 *   2xs → xs → sm → md → lg → xl → 2xl  (lightest to strongest)
 */

.shadow-none { box-shadow: none; }

/* 0 1px 0 0 — barely visible lift */
.shadow-2xs  { box-shadow: var(--shadow-2xs); }

/* 0 1px 2px 0 — subtle */
.shadow-xs   { box-shadow: var(--shadow-xs); }

/* 0 1px 3px + 0 1px 2px -1px — small card */
.shadow-sm   { box-shadow: var(--shadow-sm); }

/* 0 4px 6px -1px + 0 2px 4px -2px — default card */
.shadow-md   { box-shadow: var(--shadow-md); }

/* 0 10px 15px -3px + 0 4px 6px -4px — elevated panel */
.shadow-lg   { box-shadow: var(--shadow-lg); }

/* 0 20px 25px -5px + 0 8px 10px -6px — modal / drawer */
.shadow-xl   { box-shadow: var(--shadow-xl); }

/* 0 25px 50px -12px — full-page overlay */
.shadow-2xl  { box-shadow: var(--shadow-2xl); }