/*
 * Raven Select design contract.
 *
 * This is the only token source.  Component geometry belongs in
 * raven-visual-foundation.css and palette application belongs in
 * raven-visual-theme.css.
 */
:root {
  --raven-color-ink: #070809;
  --raven-color-panel: #101215;
  --raven-color-paper: #ffffff;
  --raven-color-text-primary: #111111;
  --raven-color-text-muted: #5e5e5e;
  --raven-color-text-inverse: #f7f8fa;
  --raven-color-border: #e2e2e2;
  --raven-color-border-dark: #4b525c;
  --raven-color-accent-lime: #d7ff43;
  --raven-color-accent-red: #e63a2e;
  --raven-color-success: #34783c;
  --raven-color-warning: #a65d00;
  --raven-color-danger: #b53c39;

  --raven-font-ui: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", sans-serif;
  --raven-font-display: "Helvetica Neue", Arial, sans-serif;
  --raven-font-mono: "SFMono-Regular", "SF Mono", "Roboto Mono", monospace;

  --raven-radius-xs: 0.25rem;
  --raven-radius-sm: 0.5rem;
  --raven-radius-md: 0.75rem;
  --raven-radius-pill: 999px;

  --raven-space-1: 0.25rem;
  --raven-space-2: 0.5rem;
  --raven-space-3: 0.75rem;
  --raven-space-4: 1rem;
  --raven-space-6: 1.5rem;
  --raven-space-8: 2rem;

  --raven-shadow-raised: 0 18px 60px rgba(0, 0, 0, 0.22);
  --raven-shadow-drawer: -20px 0 60px rgba(0, 0, 0, 0.22);
  --raven-motion-fast: 160ms;
  --raven-motion-normal: 260ms;
  --raven-motion-slow: 420ms;
  --raven-ease-premium: cubic-bezier(0.16, 1, 0.3, 1);

  /* Stacking contract, from ordinary content to blocking system feedback. */
  --raven-z-base: 0;
  --raven-z-sticky-header: 100;
  --raven-z-mobile-navigation: 200;
  --raven-z-generic-overlay: 300;
  --raven-z-product-modal: 400;
  --raven-z-cart-drawer: 500;
  --raven-z-blocking-agreement: 600;
  --raven-z-member-portal: 700;
  --raven-z-critical-dialog: 800;
  --raven-z-toast: 900;

  /* Local, non-overlay layering inside the Hero and startup notice only. */
  --raven-z-local-1: 1;
  --raven-z-local-2: 2;
  --raven-z-hero-base: 10;
  --raven-z-hero-bright: 20;
  --raven-z-hero-shear: 22;
  --raven-z-hero-lines: 23;
  --raven-z-hero-vignette: 24;
  --raven-z-hero-noise: 25;
  --raven-z-hero-content: 40;
}

html[data-theme="light"] {
  --raven-theme-page: var(--raven-color-paper);
  --raven-theme-surface: var(--raven-color-paper);
  --raven-theme-elevated: #f5f5f5;
  --raven-theme-text: var(--raven-color-text-primary);
  --raven-theme-muted: var(--raven-color-text-muted);
  --raven-theme-border: var(--raven-color-border);
  --raven-theme-button: var(--raven-color-text-primary);
  --raven-theme-button-text: var(--raven-color-paper);
  --raven-theme-disabled: #e7e7e7;
  --raven-theme-disabled-text: #5e5e5e;
  --raven-theme-overlay: rgba(0, 0, 0, 0.48);
}

html[data-theme="dark"] {
  --raven-theme-page: #08090a;
  --raven-theme-surface: #15181c;
  --raven-theme-elevated: #1d2126;
  --raven-theme-text: var(--raven-color-text-inverse);
  --raven-theme-muted: #c7cbd1;
  --raven-theme-border: var(--raven-color-border-dark);
  --raven-theme-button: var(--raven-color-paper);
  --raven-theme-button-text: var(--raven-color-text-primary);
  --raven-theme-disabled: #343941;
  --raven-theme-disabled-text: #b8bec7;
  --raven-theme-overlay: rgba(0, 0, 0, 0.76);
}
