/* ==========================================================================
   MOVEMAX Connect — Design Tokens (`Specification/public site design.md` §7)
   Single source of truth for colours, typography, spacing, radii, and shadows.
   ========================================================================== */

:root {
  /* Brand — confirmed */
  --mm-green-700: #1b7f4b; /* primary */
  --mm-green-800: #145a37; /* hover / dark green */
  --mm-green-50: #e6f4ec;  /* light green surface */
  --mm-yellow-500: #f5c518;
  --mm-yellow-50: #fff4c2;
  --mm-orange-500: #f57c00;
  --mm-orange-700: #c2410c;

  /* Depth ramp for the public site */
  --mm-green-600: #23945a; /* eyebrow text on white */
  --mm-green-200: #bfe3ce; /* secondary button border */
  --mm-green-900: #0f4229; /* deep green text on light green surfaces */
  --mm-green-950: #0a3622; /* deep forest footer, hero scrim */
  --mm-green-500: #2b9e5b; /* mid accent (hover borders) */
  --mm-green-400: #56b985; /* focus / active accent */
  --mm-green-300: #9ad4b3; /* light accent border on hover */

  /* Neutrals — confirmed */
  --mm-ink-900: #1e2420;
  --mm-ink-800: #3a3a3a;
  --mm-ink-700: #4a4a4a;
  --mm-ink-600: #5a5a5a;
  --mm-ink-500: #6b7280; /* small print on light surfaces (contrast floor) */
  --mm-surface: #f6f6f6;
  --mm-white: #ffffff;
  --mm-line: #e6e8e6; /* hairlines and dividers */
  --mm-line-strong: #d3d8d4; /* input and table borders that must read on white */

  /* Wayfinding tints — category band only (§7.1 & D-01) */
  --mm-tint-green: #dcf2e5;
  --mm-tint-blue: #dde8fb;
  --mm-tint-purple: #eaddfb;
  --mm-tint-orange: #fde8d2;
  --mm-tint-teal: #d5f0ef;
  --mm-tint-blue-fg: #2f5fd0;
  --mm-tint-purple-fg: #6d3bd1;
  --mm-tint-teal-fg: #0f766e;

  /* Semantic */
  --mm-success: #1b7f4b;
  --mm-warning: #f57c00;
  --mm-danger: #c2410c;
  --mm-info: #145a37;
  --mm-focus: #1b7f4b;
  --mm-danger-bg: #fef2f2;
  --mm-danger-border: #f8b4b4;

  /* Semantic ink + surface pairs (badges, banners, alerts) */
  --mm-warning-ink: #92400e;
  --mm-warning-bg: #fffbeb;
  --mm-warning-border: #fde68a;
  --mm-info-ink: #1e40af;
  --mm-info-bg: #eff6ff;
  --mm-info-border: #bfdbfe;
  --mm-neutral-bg: #f1f5f9;
  --mm-neutral-ink: #475569;

  /* Scrims & translucent surfaces (§4.1, §4.2, §4.4) */
  --mm-header-scrolled-bg: rgba(255, 255, 255, 0.98);
  --mm-hero-scrim-desktop: linear-gradient(
    90deg,
    rgba(255, 255, 255, 0.72) 0%,
    rgba(255, 255, 255, 0.52) 34%,
    rgba(255, 255, 255, 0.12) 52%,
    rgba(255, 255, 255, 0) 64%
  );
  --mm-hero-scrim-mobile: linear-gradient(
    180deg,
    rgba(10, 54, 34, 0.86) 0%,
    rgba(10, 54, 34, 0.94) 100%
  );
  --mm-hero-card-bg: rgba(16, 110, 64, 0.95);
  --mm-white-85: rgba(255, 255, 255, 0.85);
  --mm-white-80: rgba(255, 255, 255, 0.8);
  --mm-white-70: rgba(255, 255, 255, 0.7);
  --mm-white-60: rgba(255, 255, 255, 0.6);
  --mm-white-20: rgba(255, 255, 255, 0.2);
  --mm-white-16: rgba(255, 255, 255, 0.18);
  --mm-white-15: rgba(255, 255, 255, 0.15);

  /* ==========================================================================
     Authenticated Workspace Ramp (Menus 2-14) — single source of truth
     ========================================================================== */
  /* Workspace surfaces */
  --mm-ws-bg: #f3f6f4; /* app canvas behind cards */
  --mm-ws-surface-2: #f8faf9; /* table heads, kanban columns */
  --mm-ws-surface-3: #fbfdfc; /* row hover */
  --mm-ws-surface-4: #f1f5f3; /* search field well */
  --mm-ws-track: #e2e8f0; /* progress bar track */

  /* Sidebar dark ramp (role-differentiated) */
  --mm-ws-sidebar-ink: #8ce0b3; /* accent text on dark green */
  --mm-ws-sidebar-ink-soft: #9de6be;
  --mm-ws-sidebar-ink-quiet: #a7f3d0;
  --mm-ws-sidebar-partner: #99f6e4;
  --mm-ws-sidebar-client: #93c5fd;
  --mm-ws-sidebar-grad-end: #072818;
  --mm-ws-sidebar-partner-start: #0d3b2e;
  --mm-ws-sidebar-partner-end: #07221b;
  --mm-ws-sidebar-client-start: #102a43;
  --mm-ws-sidebar-client-end: #0a1929;
  --mm-ws-sidebar-line: rgba(255, 255, 255, 0.12);
  --mm-ws-sidebar-line-soft: rgba(255, 255, 255, 0.08);
  --mm-ws-sidebar-hover: rgba(255, 255, 255, 0.1);
  --mm-ws-sidebar-surface: rgba(255, 255, 255, 0.07);

  /* Workspace structure */
  --mm-ws-sidebar-w: 276px;
  --mm-ws-content-max: 1440px;
  --mm-ws-topbar-bg: rgba(255, 255, 255, 0.96);

  /* Focus + elevation */
  --mm-focus-ring: 0 0 0 3px rgba(27, 127, 75, 0.35);
  --mm-focus-ring-inverse: 0 0 0 3px rgba(140, 224, 179, 0.55);
  --mm-shadow-drawer: 24px 0 56px rgba(10, 54, 34, 0.28);
  --mm-shadow-modal: 0 28px 64px rgba(10, 54, 34, 0.26);

  /* Motion */
  --mm-ease-entrance: cubic-bezier(0.16, 1, 0.3, 1);
  --mm-duration-entrance: 420ms;

  /* Z-index scale */
  --mm-z-base: 1;
  --mm-z-sticky: 30;
  --mm-z-sidebar: 40;
  --mm-z-tabbar: 50;
  --mm-z-dropdown: 120;
  --mm-z-drawer: 130;
  --mm-z-dialog: 140;
  --mm-z-toast: 150;

  /* Legacy aliases from Developer Spec §10.1 */
  --mm-green: var(--mm-green-700);
  --mm-green-dark: var(--mm-green-800);
  --mm-green-light: var(--mm-green-50);
  --mm-yellow: var(--mm-yellow-500);
  --mm-yellow-light: var(--mm-yellow-50);
  --mm-orange: var(--mm-orange-500);
  --mm-orange-dark: var(--mm-orange-700);
  --mm-text: var(--mm-ink-900);
  --mm-text-secondary: var(--mm-ink-600);
  --mm-bg: var(--mm-surface);

  /* Typography (§7.2) */
  --mm-font-display: "Poppins", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  --mm-font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  /* Spacing scale (§7.3: 4 · 8 · 12 · 16 · 24 · 32 · 48 · 64 · 96 · 128) */
  --mm-space-4: 4px;
  --mm-space-8: 8px;
  --mm-space-12: 12px;
  --mm-space-16: 16px;
  --mm-space-24: 24px;
  --mm-space-20: 20px;
  --mm-space-28: 28px;
  --mm-space-32: 32px;
  --mm-space-48: 48px;
  --mm-space-64: 64px;
  --mm-space-96: 96px;
  --mm-space-128: 128px;

  /* Container & Grid (§7.3) */
  --mm-container: 1240px;
  --mm-gutter: 24px;

  /* Radii (§7.3: 8 chips · 12 cards/inputs · 16 panels · 999 pills/buttons) */
  --mm-radius-sm: 8px;
  --mm-radius-md: 12px;
  --mm-radius-lg: 16px;
  --mm-radius-full: 9999px; /* circular discs, pills, progress tracks */
  --mm-radius-pill: 999px;

  /* Shadows (§7.3 & Senior UI System) */
  --mm-shadow-subtle: 0 1px 3px rgba(0, 0, 0, 0.05);
  --mm-shadow-card: 0 4px 16px rgba(10, 54, 34, 0.06);
  --mm-shadow-hover: 0 12px 28px rgba(10, 54, 34, 0.12);
  --mm-shadow-raised: 0 16px 36px rgba(14, 59, 41, 0.14);
  --mm-shadow-float: 0 20px 48px rgba(14, 59, 41, 0.22);

  /* Transitions & Motion Timing */
  --mm-transition-fast: 150ms cubic-bezier(0.2, 0.8, 0.2, 1);
  --mm-transition-base: 220ms cubic-bezier(0.2, 0.8, 0.2, 1);
  --mm-transition-slow: 320ms cubic-bezier(0.2, 0.8, 0.2, 1);

  /* Typography scale (shared public + workspace) */
  --mm-text-xs: 0.72rem;
  --mm-text-sm: 0.82rem;
  --mm-text-base: 0.9rem;
  --mm-text-lg: 1.05rem;
  --mm-text-xl: 1.3rem;
  --mm-leading-tight: 1.2;
  --mm-leading-base: 1.55;

  /* Bootstrap 5 Theme Harmonization */
  --bs-primary: var(--mm-green-700);
  --bs-primary-rgb: 27, 127, 75;
  --bs-success: var(--mm-green-600);
  --bs-success-rgb: 35, 148, 90;
  --bs-warning: var(--mm-warning);
  --bs-danger: var(--mm-danger);
  --bs-info: var(--mm-info);
  --bs-link-color: var(--mm-green-700);
  --bs-link-hover-color: var(--mm-green-800);
  --bs-focus-ring-color: rgba(27, 127, 75, 0.25);
  --bs-body-font-family: var(--mm-font-sans);
  --bs-border-color: var(--mm-line);
}

@media (max-width: 719px) {
  :root {
    --mm-gutter: 16px;
  }
}