/* ==========================================================================
   SISTEMA BTIME v2 — TOKENS
   Camada 1: primitivos (o que a cor É). Camada 2: semânticos (o que a cor FAZ).
   Componentes consomem só a camada 2.
   ========================================================================== */

/* CAMADA 1 — PRIMITIVOS */
:root {
  --or-pink-50: #FEF1F7; --or-pink-100: #FCDEED; --or-pink-200: #FABDDB; --or-pink-300: #F68EC2; --or-pink-400: #F25AA6; --or-pink-500: #EE2B8C; --or-pink-600: #D41173; --or-pink-700: #AF0E5E; --or-pink-800: #890B4A; --or-pink-900: #630836; --or-pink-950: #3D0521;
  --or-purple-50: #F9F2FD; --or-purple-100: #F1E1FA; --or-purple-200: #E4C2F4; --or-purple-300: #D097ED; --or-purple-400: #BB67E4; --or-purple-500: #A73CDD; --or-purple-600: #8E22C3; --or-purple-700: #741CA0; --or-purple-800: #5B167E; --or-purple-900: #42105B; --or-purple-950: #290A38;
  --or-neutral-0: #FFFFFF; --or-neutral-50: #F9F9FB; --or-neutral-100: #F3F3F7; --or-neutral-200: #E8E8ED; --or-neutral-300: #CCCCD7; --or-neutral-400: #A5A5B6; --or-neutral-500: #8C8CA6; --or-neutral-600: #6C6C87; --or-neutral-700: #393956; --or-neutral-800: #252537; --or-neutral-900: #181825; --or-neutral-950: #131320; --or-neutral-1000: #0B0B14; --or-neutral-1100: #08080F;
  --or-cyan-50: #E3FCFF; --or-cyan-100: #C5FAFF; --or-cyan-200: #9EF2FA; --or-cyan-300: #83E7F0; --or-cyan-400: #5EE1ED; --or-cyan-500: #30D9E8; --or-cyan-600: #08B3C0; --or-cyan-700: #139DAA; --or-cyan-800: #07717A; --or-cyan-900: #024F56; --or-cyan-950: #022F34;
  --or-blue-50: #F3F7FE; --or-blue-100: #E1ECFF; --or-blue-200: #C3D8FF; --or-blue-300: #9BBEFF; --or-blue-400: #5E8EED; --or-blue-500: #306EE8; --or-blue-600: #215ACA; --or-blue-700: #1345AA; --or-blue-800: #0F347F; --or-blue-900: #0C2558; --or-blue-950: #0B1730;
  --or-green-50: #E5FFEB; --or-green-100: #C7FFD6; --or-green-200: #A3F8BD; --or-green-300: #83EBA5; --or-green-400: #5CD689; --or-green-500: #33CC6B; --or-green-600: #089A49; --or-green-700: #1B7340; --or-green-800: #005A2D; --or-green-900: #003E1D; --or-green-950: #012711;
  --or-amber-50: #FFF7ED; --or-amber-100: #FFEED5; --or-amber-200: #FFDBA8; --or-amber-300: #FEC671; --or-amber-400: #F5B13D; --or-amber-500: #F29E0D; --or-amber-600: #C37E09; --or-amber-700: #8F5A00; --or-amber-800: #6F4500; --or-amber-900: #4F3001; --or-amber-950: #311C01;
  --or-red-50: #FEF4F3; --or-red-100: #FEE4E2; --or-red-200: #FEC8C3; --or-red-300: #FFA099; --or-red-400: #E64C4C; --or-red-500: #DF2020; --or-red-600: #BB1B1B; --or-red-700: #9E030C; --or-red-800: #7D0006; --or-red-900: #570204; --or-red-950: #330A08;

  --or-font-sans: "Plus Jakarta Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --or-font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* escala modular 1,2 · base 16px */
  --or-text-2xs: 0.694rem; --or-text-xs: 0.833rem; --or-text-sm: 0.875rem; --or-text-md: 1rem;
  --or-text-lg: 1.2rem; --or-text-xl: 1.44rem; --or-text-2xl: 1.728rem; --or-text-3xl: 2.074rem; --or-text-4xl: 2.488rem;
  --or-text-5xl: clamp(2.488rem, 1.6rem + 3.9vw, 3.583rem);
  --or-text-6xl: clamp(2.25rem, 1.2rem + 4.6vw, 4.3rem);
  --or-text-marquee: clamp(2.074rem, 1.4rem + 2.8vw, 3.1rem);
  --or-lh-tight: 1.15; --or-lh-snug: 1.3; --or-lh-normal: 1.6; --or-lh-ui: 1.43;
  --or-ls-display: -0.02em; --or-ls-tight: -0.01em; --or-ls-label: 0.08em; --or-ls-mono: 0.04em;
  --or-weight-regular: 400; --or-weight-medium: 500; --or-weight-semibold: 600; --or-weight-bold: 700; --or-weight-extra: 800;
  --or-measure: 68ch;

  /* espaço · múltiplos de 4px */
  --or-space-0: 0; --or-space-1: 0.25rem; --or-space-2: 0.5rem; --or-space-3: 0.75rem; --or-space-4: 1rem; --or-space-5: 1.25rem;
  --or-space-6: 1.5rem; --or-space-8: 2rem; --or-space-10: 2.5rem; --or-space-12: 3rem; --or-space-16: 4rem; --or-space-20: 5rem;
  --or-space-24: 6rem; --or-space-32: 8rem;

  /* forma */
  --or-radius-xs: 4px; --or-radius-sm: 8px; --or-radius-md: 12px; --or-radius-lg: 16px; --or-radius-xl: 24px; --or-radius-full: 9999px;
  --or-radius-control: var(--or-radius-full);
  --or-border-hairline: 1px; --or-border-thick: 2px;
  --or-focus-offset: 2px; --or-focus-halo: 4px;

  /* tamanhos */
  --or-size-touch: 2.75rem; --or-size-control-sm: 2.25rem; --or-size-control-md: 2.75rem; --or-size-control-lg: 3.25rem;
  --or-size-icon-sm: 1rem; --or-size-icon-md: 1.25rem; --or-size-icon-lg: 1.5rem;
  --or-nav-h: 4rem; --or-menu-min: 14rem; --or-tooltip-max: 16rem; --or-modal-sm: 26rem; --or-modal-md: 35rem; --or-container: 76rem;

  /* camadas */
  --or-z-base: 0; --or-z-raised: 10; --or-z-sticky: 100; --or-z-nav: 200; --or-z-dropdown: 300; --or-z-overlay: 400; --or-z-modal: 500; --or-z-toast: 600; --or-z-tooltip: 700;

  /* movimento */
  --or-dur-instant: 80ms; --or-dur-fast: 140ms; --or-dur-normal: 220ms; --or-dur-slow: 380ms; --or-dur-reveal: 720ms; --or-dur-marquee: 40s;
  --or-ease-out: cubic-bezier(0.16, 1, 0.3, 1); --or-ease-in: cubic-bezier(0.55, 0, 1, 0.45);
  --or-ease-in-out: cubic-bezier(0.65, 0, 0.35, 1); --or-ease-spring: cubic-bezier(0.34, 1.4, 0.64, 1);

  /* breakpoints (referência: media queries repetem estes valores) */
  --or-bp-sm: 40rem; --or-bp-md: 48rem; --or-bp-lg: 64rem; --or-bp-xl: 80rem;
}

/* CAMADA 2 — SEMÂNTICOS · ESCURO (padrão) */
:root {
  --or-bg-canvas: var(--or-neutral-1000);
  --or-bg-surface: var(--or-neutral-950);
  --or-bg-raised: var(--or-neutral-900);
  --or-bg-subtle: var(--or-neutral-800);
  --or-bg-sunken: var(--or-neutral-1100);
  --or-border-subtle: var(--or-neutral-800);
  --or-border-default: var(--or-neutral-700);
  --or-border-strong: var(--or-neutral-600);
  --or-text: var(--or-neutral-50);
  --or-text-muted: var(--or-neutral-400);
  --or-text-subtle: var(--or-neutral-500);
  --or-text-disabled: var(--or-neutral-600);
  --or-text-on-fill: #FFFFFF;
  --or-text-on-bright: var(--or-neutral-1000);
  --or-text-on-success: var(--or-neutral-1000);
  --or-brand: var(--or-pink-400);
  --or-brand-vivid: var(--or-pink-500);
  --or-brand-hover: var(--or-pink-300);
  --or-brand-fill: var(--or-pink-600);
  --or-brand-fill-hover: var(--or-pink-700);
  --or-brand-fill-active: var(--or-pink-800);
  --or-brand-soft: rgba(238,43,140,0.12);
  --or-brand-ring: rgba(238,43,140,0.35);
  --or-accent: var(--or-purple-400);
  --or-accent-fill: var(--or-purple-600);
  --or-accent-soft: rgba(167,60,221,0.14);
  --or-info: var(--or-cyan-500);
  --or-info-soft: rgba(48,217,232,0.12);
  --or-success: var(--or-green-500);
  --or-success-fill: var(--or-green-500);
  --or-success-soft: rgba(51,204,107,0.12);
  --or-warning: var(--or-amber-500);
  --or-warning-soft: rgba(242,158,13,0.12);
  --or-danger: var(--or-red-300);
  --or-danger-mark: var(--or-red-400);
  --or-danger-fill: var(--or-red-600);
  --or-danger-fill-hover: var(--or-red-700);
  --or-danger-soft: rgba(230,76,76,0.12);
  --or-focus: var(--or-pink-400);
  --or-accent-fill-hover: var(--or-purple-700);
  --or-overlay-scrim: rgba(8, 8, 15, 0.72);
  --or-glass: rgba(19, 19, 32, 0.72);
  --or-shadow-1: 0 1px 2px rgba(0, 0, 0, 0.4);
  --or-shadow-2: 0 4px 20px rgba(0, 0, 0, 0.3), inset 0 1px 0 rgba(255, 255, 255, 0.05);
  --or-shadow-3: 0 8px 32px rgba(0, 0, 0, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.06);
  --or-shadow-4: 0 24px 64px rgba(0, 0, 0, 0.6);
  --or-glow-brand: 0 0 24px rgba(238, 43, 140, 0.35);
  --or-gradient-brand: linear-gradient(135deg, var(--or-pink-500), var(--or-purple-500));
  --or-gradient-nebula: linear-gradient(90deg, var(--or-pink-500), #E830C9, var(--or-purple-500));
  --or-gradient-surface: linear-gradient(160deg, rgba(37, 37, 55, 0.9), rgba(19, 19, 32, 0.6));
  --or-gradient-hairline: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.16), transparent);
  color-scheme: dark;
}

/* CAMADA 2 — SEMÂNTICOS · CLARO (só os tokens mudam) */
[data-theme="light"] {
  --or-bg-canvas: var(--or-neutral-100);
  --or-bg-surface: var(--or-neutral-0);
  --or-bg-raised: var(--or-neutral-0);
  --or-bg-subtle: var(--or-neutral-200);
  --or-bg-sunken: var(--or-neutral-200);
  --or-border-subtle: var(--or-neutral-200);
  --or-border-default: var(--or-neutral-300);
  --or-border-strong: var(--or-neutral-600);
  --or-text: #121221;
  --or-text-muted: #5A5A72;
  --or-text-subtle: var(--or-neutral-600);
  --or-text-disabled: var(--or-neutral-400);
  --or-text-on-fill: #FFFFFF;
  --or-text-on-bright: var(--or-neutral-1000);
  --or-text-on-success: #FFFFFF;
  --or-brand: var(--or-pink-700);
  --or-brand-vivid: var(--or-pink-500);
  --or-brand-hover: var(--or-pink-800);
  --or-brand-fill: var(--or-pink-600);
  --or-brand-fill-hover: var(--or-pink-700);
  --or-brand-fill-active: var(--or-pink-800);
  --or-brand-soft: rgba(212,17,115,0.08);
  --or-brand-ring: rgba(212,17,115,0.30);
  --or-accent: var(--or-purple-600);
  --or-accent-fill: var(--or-purple-600);
  --or-accent-soft: rgba(142,34,195,0.08);
  --or-info: var(--or-cyan-800);
  --or-info-soft: rgba(19,157,170,0.08);
  --or-success: var(--or-green-700);
  --or-success-fill: var(--or-green-700);
  --or-success-soft: rgba(27,115,64,0.08);
  --or-warning: var(--or-amber-700);
  --or-warning-soft: rgba(143,90,0,0.08);
  --or-danger: var(--or-red-600);
  --or-danger-mark: var(--or-red-600);
  --or-danger-fill: var(--or-red-600);
  --or-danger-fill-hover: var(--or-red-700);
  --or-danger-soft: rgba(187,27,27,0.08);
  --or-focus: var(--or-pink-600);
  --or-accent-fill-hover: var(--or-purple-700);
  --or-overlay-scrim: rgba(11, 11, 20, 0.45);
  --or-glass: rgba(243, 243, 247, 0.8);
  --or-shadow-1: 0 1px 2px rgba(18, 18, 33, 0.06), 0 1px 1px rgba(18, 18, 33, 0.04);
  --or-shadow-2: 0 4px 16px rgba(18, 18, 33, 0.08);
  --or-shadow-3: 0 8px 28px rgba(18, 18, 33, 0.12);
  --or-shadow-4: 0 24px 56px rgba(18, 18, 33, 0.18);
  --or-glow-brand: 0 0 24px rgba(212, 17, 115, 0.22);
  --or-gradient-surface: linear-gradient(160deg, #FFFFFF, var(--or-pink-50));
  --or-gradient-hairline: linear-gradient(90deg, transparent, rgba(18, 18, 33, 0.14), transparent);
  color-scheme: light;
}