/* Load the Aditor brand fonts first (same two the handbook renderer uses -
   scripts/build-handbook/build.py): Hanken Grotesk for text, IBM Plex Mono
   for eyebrows/labels. @import keeps it to one place for all control-plane
   pages; must stay the first statement in this file. */
@import url('https://fonts.googleapis.com/css2?family=Hanken+Grotesk:wght@400;500;600;700;800&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

/*
 * Aditor design system - control-plane tokens.
 *
 * These mirror the handbook renderer's brand so cloudbrain.aditor.ai looks
 * like the handbooks it ships (the canonical source:
 * scripts/build-handbook/assets/handbook.css - warm dark surfaces, one
 * burnt-orange primary, Hanken Grotesk + IBM Plex Mono). Everything is a
 * --ds-* token so app.css (the components) inherits the brand with no
 * per-component change. The brain is a dark surface by design - there is a
 * single dark theme here, matching the handbook's `color-scheme: dark`.
 */
:root {
  color-scheme: dark;

  /* --- brand: a single burnt-orange primary action per screen --- */
  --ds-primary: #e0532f;
  --ds-primary-hover: #ea613c;
  --ds-primary-active: #c7461f;
  --ds-on-primary: #140a06;          /* near-black warm ink reads on the orange */
  --ds-accent-ink: #f08a62;          /* lighter orange for links/hover text */
  --ds-accent-soft: rgba(224, 83, 47, 0.14);

  /* --- warm dark surfaces (bg / panel / inset) --- */
  --ds-bg: #0a0a0b;
  --ds-surface: #141315;
  --ds-surface-raised: #0b0a0c;      /* inset wells: inputs, readonly fields */
  --ds-border: rgba(241, 236, 225, 0.12);
  --ds-border-strong: rgba(241, 236, 225, 0.22);
  --ds-text: #f1ece1;                /* warm paper ink */
  --ds-text-muted: #9c9589;
  --ds-text-faint: #6a655c;
  --ds-text-on-primary: var(--ds-on-primary);

  /* --- status tones (build status pill, form errors) --- */
  --ds-positive: #74d6a0;
  --ds-positive-bg: rgba(116, 214, 160, 0.13);
  --ds-pending: #e8b65a;
  --ds-pending-bg: rgba(232, 182, 90, 0.13);
  --ds-negative: #f0795f;
  --ds-negative-bg: rgba(240, 121, 95, 0.13);
  --ds-neutral: #9c9589;
  --ds-neutral-bg: rgba(156, 149, 137, 0.13);

  /* --- type ramp --- */
  --ds-font-family: 'Hanken Grotesk', system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --ds-font-mono: 'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --ds-text-xs: 0.75rem;
  --ds-text-sm: 0.875rem;
  --ds-text-md: 1rem;
  --ds-text-lg: 1.25rem;
  --ds-text-xl: 1.75rem;
  --ds-text-2xl: 2.4rem;
  --ds-line-height: 1.6;

  /* --- 4/8 spacing scale --- */
  --ds-space-1: 4px;
  --ds-space-2: 8px;
  --ds-space-3: 16px;
  --ds-space-4: 24px;
  --ds-space-5: 32px;
  --ds-space-6: 48px;

  /* --- radii --- */
  --ds-radius-sm: 8px;
  --ds-radius-md: 11px;
  --ds-radius-xl: 16px;

  /* --- panel depth --- */
  --ds-shadow-panel: 0 1px 0 rgba(241, 236, 225, 0.03) inset, 0 24px 60px -26px rgba(0, 0, 0, 0.72);
}
