/* 
 * Ajaa Design Tokens v2
 * Shared design system variables and base resets
 */

:root {
  /* Colors - Backgrounds & Surfaces */
  --bg: #ffffff;
  --surface: #ffffff;
  --surface-soft: #f8f7fc;
  --surface-purple: #f2f0ff;
  --app-bg: #f8f7fc;
  --app-surface-soft: #fbfaff;
  --surface-glass-86: rgba(255, 255, 255, 0.86);
  --surface-glass-75: rgba(255, 255, 255, 0.75);
  --surface-glass-74: rgba(255, 255, 255, 0.74);
  --surface-glass-72: rgba(255, 255, 255, 0.72);
  --surface-glass-08: rgba(255, 255, 255, 0.08);
  --surface-glass-12: rgba(255, 255, 255, 0.12);
  --surface-glass-18: rgba(255, 255, 255, 0.18);

  /* Colors - Text */
  --fg: #17151f;
  --muted: #6d687c;
  --soft: #918ba3;

  /* Colors - Borders */
  --border: #e8e5f0;
  --border-strong: #dad5ea;
  --border-glass: rgba(232, 229, 240, 0.82);

  /* Colors - Brand & Accents */
  --accent: #3A2D97;
  --accent-soft: #efeaff;
  --accent-2: #7c68ff;
  --accent-border: #ddd5ff;
  --accent-border-soft: #e1dcfb;
  --accent-border-muted: #ded7fb;
  --accent-border-subtle: #dcd5f5;
  --accent-status-bg: #f1efff;
  --on-accent: #ffffff;
  --accent-glow: rgba(58, 45, 151, 0.10);
  --accent-border-alpha: rgba(58, 45, 151, 0.38);
  --on-dark-muted: rgba(255, 255, 255, 0.58);
  --on-dark-soft: rgba(255, 255, 255, 0.68);
  --on-dark-subtle: rgba(255, 255, 255, 0.70);

  /* Colors - Status */
  --success: #12845b;
  --success-bright: #10b981;
  --success-strong: #15803d;
  --success-bg: #ecf9f2;
  --success-bg-strong: #ecfdf5;
  --success-bg-bright: #f0fdf4;
  --success-status-bg: #eaf8f2;
  --success-surface-soft: #eef9f4;
  --success-border: #cfeddf;
  --success-border-strong: #d1fae5;
  --success-border-bright: #bbf7d0;
  --warning: #a86b00;
  --warning-strong: #866017;
  --warning-bg: #fff7e8;
  --warning-border: #f4dfb7;
  --danger: #b42318;
  --danger-bright: #ef4444;
  --danger-strong: #7b3131;
  --danger-bg: #fff1f0;
  --danger-bg-soft: #fef2f2;
  --danger-bg-muted: #f7eeee;
  --danger-status-bg: #fff0ed;
  --danger-border: #ffd7d3;
  --danger-border-soft: #fee2e2;
  --danger-border-muted: #eed6d6;
  --danger-hover-bg: #fff0ef;
  --danger-hover-border: #ffd5d1;
  --info: #3158a8;
  --info-bright: #2563eb;
  --info-bg: #edf4ff;
  --info-bg-bright: #f0f7ff;
  --info-border: #d8e6ff;
  --info-border-bright: #dbeafe;
  --neutral-status: #655f75;
  --neutral-status-bg: #f4f2f8;
  --neutral-status-border: #e8e3f0;
  --neutral: #6b7280;
  --neutral-bg: #f3f4f6;
  --neutral-border: #e5e7eb;
  --paused-status-bg: #f4f1eb;
  --placeholder: #aaa5b6;
  --decorative-dot: #d6d0e8;
  --dark-surface: #171329;

  /* Effects */
  --shadow: 0 24px 80px rgba(37, 29, 97, 0.12);
  --shadow-shell: 0 10px 28px rgba(30, 24, 70, 0.045);
  --shadow-auth: 0 24px 80px rgba(37, 29, 97, 0.11);
  --shadow-auth-soft: 0 10px 28px rgba(30, 24, 70, 0.055);
  --shadow-document: 0 18px 54px rgba(37, 29, 97, 0.08);
  --shadow-document-soft: 0 8px 22px rgba(30, 24, 70, 0.045);
  --shadow-home-subtle: 0 8px 30px rgba(30, 24, 70, 0.05);
  --shadow-home-card: 0 10px 34px rgba(30, 24, 70, 0.05);
  --shadow-home-control: 0 8px 22px rgba(30, 24, 70, 0.08);
  --shadow-home-panel: 0 16px 60px rgba(30, 24, 70, 0.08);
  --shadow-home-dark: 0 28px 58px rgba(23, 19, 41, 0.28);
  --shadow-accent-button: 0 14px 34px rgba(58, 45, 151, 0.20);
  --shadow-accent-card: 0 18px 40px rgba(58, 45, 151, 0.18);
  --shadow-accent-feature: 0 22px 60px rgba(58, 45, 151, 0.13);

  /* Geometry */
  --radius-xl: 30px;
  --radius-lg: 28px;
  --radius-md: 20px;
  --radius-sm: 14px;
  --radius-document-lg: 24px;
  --radius-document-md: 18px;
  --radius-document-sm: 12px;
  --radius-pill: 999px;
  --app-sidebar: 280px;
  --app-sidebar-compact: 236px;
  --document-sidebar-compact: 232px;
  --app-topbar: 76px;
  --document-topbar: 72px;
  --max: 1180px;

  /* Spacing scale */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.5rem;
  --space-6: 2rem;
  --space-7: 2.5rem;
  --space-10: 4rem;

  /* Typography */
  --font-display: "Inter", "Sohne", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  --font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  --font-mono: "SFMono-Regular", "Cascadia Mono", Menlo, ui-monospace, monospace;
  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-xl: 1.5rem;
  --text-strong: var(--fg);
  --text-muted: var(--muted);
  --text-on-accent: var(--on-accent);
  --shadow-sm: var(--shadow-shell);
}

/* Base Resets */
* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  background: var(--bg);
  color: var(--fg);
  font-family: var(--font-body);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

a {
  color: inherit;
  text-decoration: none;
}

button, input {
  font: inherit;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}