/* Elev8 Tech — Shadow, Border Radius & Effects Tokens */

:root {
  /* ── Border radius ── */
  --radius-none:   0px;
  --radius-xs:     2px;
  --radius-sm:     4px;
  --radius-md:     6px;
  --radius-lg:     8px;
  --radius-xl:     12px;
  --radius-2xl:    16px;
  --radius-3xl:    24px;
  --radius-full:   9999px;

  /* ── Semantic radius ── */
  --radius-button:    var(--radius-sm);
  --radius-input:     var(--radius-sm);
  --radius-card:      var(--radius-xl);
  --radius-badge:     var(--radius-full);
  --radius-chip:      var(--radius-full);
  --radius-dialog:    var(--radius-xl);

  /* ── Shadows ── */
  --shadow-xs:   0 1px 2px rgba(28, 45, 107, 0.06);
  --shadow-sm:   0 1px 4px rgba(28, 45, 107, 0.08), 0 1px 2px rgba(28, 45, 107, 0.04);
  --shadow-md:   0 4px 12px rgba(28, 45, 107, 0.10), 0 2px 4px rgba(28, 45, 107, 0.06);
  --shadow-lg:   0 8px 24px rgba(28, 45, 107, 0.12), 0 4px 8px rgba(28, 45, 107, 0.08);
  --shadow-xl:   0 16px 40px rgba(28, 45, 107, 0.14), 0 8px 16px rgba(28, 45, 107, 0.08);
  --shadow-2xl:  0 24px 64px rgba(28, 45, 107, 0.18), 0 12px 24px rgba(28, 45, 107, 0.10);

  /* ── Inner shadows ── */
  --shadow-inner-sm: inset 0 1px 3px rgba(28, 45, 107, 0.08);
  --shadow-inner-md: inset 0 2px 6px rgba(28, 45, 107, 0.12);

  /* ── Focus rings ── */
  --ring-focus:      0 0 0 3px rgba(77, 196, 210, 0.35);
  --ring-focus-navy: 0 0 0 3px rgba(28, 45, 107, 0.25);
  --ring-error:      0 0 0 3px rgba(239, 68, 68, 0.25);

  /* ── Transitions ── */
  --duration-fast:   150ms; /* @kind other */
  --duration-base:   200ms; /* @kind other */
  --duration-slow:   350ms; /* @kind other */
  --duration-slower: 500ms; /* @kind other */

  --ease-default:  cubic-bezier(0.4, 0, 0.2, 1); /* @kind other */
  --ease-in:       cubic-bezier(0.4, 0, 1, 1); /* @kind other */
  --ease-out:      cubic-bezier(0, 0, 0.2, 1); /* @kind other */
  --ease-spring:   cubic-bezier(0.34, 1.56, 0.64, 1); /* @kind other */

  --transition-default: var(--duration-base) var(--ease-default); /* @kind other */
  --transition-fast:    var(--duration-fast) var(--ease-default); /* @kind other */
  --transition-spring:  var(--duration-slow) var(--ease-spring); /* @kind other */

  /* ── Dividers ── */
  --divider-default: 1px solid var(--border-default); /* @kind other */
  --divider-subtle:  1px solid var(--border-subtle); /* @kind other */
  --divider-strong:  1px solid var(--border-strong); /* @kind other */

  /* ── Opacity ── */
  --opacity-disabled: 0.45; /* @kind other */
  --opacity-hover:    0.85; /* @kind other */
  --opacity-overlay:  0.6; /* @kind other */

  /* ── Z-index ── */
  --z-base:     0; /* @kind other */
  --z-raised:   10; /* @kind other */
  --z-dropdown: 100; /* @kind other */
  --z-sticky:   200; /* @kind other */
  --z-overlay:  300; /* @kind other */
  --z-modal:    400; /* @kind other */
  --z-toast:    500; /* @kind other */
  --z-tooltip:  600; /* @kind other */
}