/* Elevation — Fluent key + ambient shadow pairs, exact alpha values from the file.
   Đa Liên Phát usage is deliberately restrained: surfaces that sit in the page flow
   (cards, tables, panels) use a 1px border and NO shadow. Shadows are reserved for
   things that float above the page: menus, popovers, dialogs, toasts, drawers. */

:root {
  --shadow-ambient: rgba(0, 0, 0, 0.12);
  --shadow-key: rgba(0, 0, 0, 0.14);

  --shadow-2: 0 0 2px var(--shadow-ambient), 0 1px 2px var(--shadow-key);
  --shadow-4: 0 0 2px var(--shadow-ambient), 0 2px 4px var(--shadow-key);
  --shadow-8: 0 0 2px var(--shadow-ambient), 0 4px 8px var(--shadow-key);
  --shadow-16: 0 0 2px var(--shadow-ambient), 0 8px 16px var(--shadow-key);
  --shadow-28: 0 0 8px var(--shadow-ambient), 0 14px 28px var(--shadow-key);
  --shadow-64: 0 0 8px var(--shadow-ambient), 0 32px 64px var(--shadow-key);

  /* Named roles */
  --elevation-flyout: var(--shadow-8);
  --elevation-dialog: var(--shadow-64);
  --elevation-toast: var(--shadow-16);
  --elevation-drawer: var(--shadow-64);
  --elevation-card: none;
}