/* =========================================================================
   OMM AI Hub — Design Tokens
   Foundations sampled from the OMM Extract design system (theme.css,
   primeng-theme.config.ts, styles.scss).
   ========================================================================= */

/* ---------- Inter (variable, ships with the site) ---------------------- */
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("../fonts/Inter-VariableFont_opsz,wght.ttf") format("truetype-variations");
}

:root {
  /* Primary (Aura "blue") */
  --omm-primary-50:  #eff6ff;
  --omm-primary-100: #dbeafe;
  --omm-primary-200: #bfdbfe;
  --omm-primary-300: #93c5fd;
  --omm-primary-400: #60a5fa;
  --omm-primary-500: #3b82f6;
  --omm-primary-600: #2563eb;
  --omm-primary-700: #1d4ed8;
  --omm-primary-800: #1e40af;
  --omm-primary-900: #1e3a8a;
  --omm-primary-950: #172554;

  /* Sky (secondary accent) */
  --omm-sky-50:  #f0f9ff;
  --omm-sky-100: #e0f2fe;
  --omm-sky-200: #bae6fd;
  --omm-sky-300: #7dd3fc;
  --omm-sky-400: #38bdf8;
  --omm-sky-500: #0ea5e9;
  --omm-sky-600: #0284c7;
  --omm-sky-700: #0369a1;
  --omm-sky-800: #075985;
  --omm-sky-900: #0c4a6e;
  --omm-sky-950: #082f49;

  /* Neutrals */
  --omm-zinc-50:  #fafafa;
  --omm-zinc-100: #f4f4f5;
  --omm-zinc-200: #e4e4e7;
  --omm-zinc-300: #d4d4d8;
  --omm-zinc-400: #a1a1aa;
  --omm-zinc-500: #71717a;
  --omm-zinc-600: #52525b;
  --omm-zinc-700: #3f3f46;
  --omm-zinc-800: #27272a;
  --omm-zinc-900: #18181b;
  --omm-zinc-950: #09090b;

  --omm-slate-300: #cbd5e1;
  --omm-slate-400: #94a3b8;
  --omm-slate-700: #334155;

  /* Semantic */
  --omm-success: #16a34a;
  --omm-success-50: #f0fdf4;
  --omm-warning: #f59e0b;
  --omm-danger:  #ef4444;
  --omm-info:    var(--omm-sky-500);

  /* Surfaces & text */
  --omm-bg:          var(--omm-zinc-100);
  --omm-bg-content:  #ffffff;
  --omm-bg-raised:   #ffffff;
  --omm-bg-subtle:   var(--omm-zinc-50);
  --omm-bg-hover:    var(--omm-zinc-100);

  --omm-fg:          var(--omm-slate-700);
  --omm-fg-strong:   var(--omm-zinc-900);
  --omm-fg-muted:    var(--omm-zinc-500);
  --omm-fg-subtle:   var(--omm-zinc-400);
  --omm-fg-on-primary: #ffffff;

  --omm-border:      var(--omm-zinc-200);
  --omm-border-strong: var(--omm-zinc-300);
  --omm-divider:     var(--omm-zinc-200);

  /* Type families */
  --omm-font-sans: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --omm-font-mono: ui-monospace, "SF Mono", "Cascadia Mono", "JetBrains Mono",
                   "Roboto Mono", Consolas, "Liberation Mono", monospace;
  --omm-font-icon: "Material Symbols Rounded";

  /* Type scale */
  --omm-text-xs:   12px;
  --omm-text-sm:   14px;
  --omm-text-base: 16px;
  --omm-text-md:   18px;
  --omm-text-lg:   20px;
  --omm-text-xl:   24px;
  --omm-text-2xl:  30px;
  --omm-text-3xl:  36px;
  --omm-text-4xl:  48px;

  --omm-leading-tight:  1.15;
  --omm-leading-snug:   1.3;
  --omm-leading-normal: 1.5;
  --omm-leading-relax:  1.65;

  --omm-weight-normal:   400;
  --omm-weight-medium:   500;
  --omm-weight-semibold: 600;
  --omm-weight-bold:     700;

  --omm-tracking-tight:  -0.01em;
  --omm-tracking-normal: 0;
  --omm-tracking-wide:   0.04em;
  --omm-tracking-wider:  0.08em;

  /* Spacing — 4px base */
  --omm-space-0:  0;
  --omm-space-1:  4px;
  --omm-space-2:  8px;
  --omm-space-3:  12px;
  --omm-space-4:  16px;
  --omm-space-5:  20px;
  --omm-space-6:  24px;
  --omm-space-8:  32px;
  --omm-space-10: 40px;
  --omm-space-12: 48px;
  --omm-space-16: 64px;

  /* Radii — capsule-forward */
  --omm-radius-xs:   4px;
  --omm-radius-sm:   6px;
  --omm-radius-md:   8px;
  --omm-radius-lg:   12px;
  --omm-radius-xl:   16px;
  --omm-radius-2xl:  20px;
  --omm-radius-pill: 9999px;

  /* Shadows */
  --omm-shadow-sm:    0 1px 2px 0 rgb(0 0 0 / 0.05);
  --omm-shadow:       0 1px 3px 0 rgb(0 0 0 / 0.10);
  --omm-shadow-card:  0 1px 3px rgba(0,0,0,0.08), 0 1px 2px rgba(0,0,0,0.04);
  --omm-shadow-md:    0 4px 6px -1px rgb(0 0 0 / 0.10), 0 2px 4px -1px rgb(0 0 0 / 0.06);
  --omm-shadow-lg:    0 16px 32px rgba(59, 130, 246, 0.20);
  --omm-shadow-hover: 0 20px 40px rgba(59, 130, 246, 0.30);

  /* Motion */
  --omm-ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --omm-ease-out:      cubic-bezier(0.0, 0, 0.2, 1);
  --omm-ease-in-out:   cubic-bezier(0.4, 0, 0.6, 1);
  --omm-duration-fast: 150ms;
  --omm-duration:      200ms;
  --omm-duration-slow: 300ms;
}

/* ============================================================
   Element-level type
   ============================================================ */
html, body {
  font-family: var(--omm-font-sans);
  color: var(--omm-fg);
  background: var(--omm-bg);
  font-size: var(--omm-text-base);
  line-height: var(--omm-leading-normal);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.material-symbols-rounded,
.omm-icon {
  font-family: var(--omm-font-icon);
  font-weight: 400;
  font-style: normal;
  font-variation-settings: "FILL" 0, "GRAD" 0, "opsz" 24;
  display: inline-block;
  line-height: 1;
  -webkit-font-feature-settings: "liga";
  font-feature-settings: "liga";
  -webkit-font-smoothing: antialiased;
  user-select: none;
}
