/*
 * MIKUY — Digital Design Tokens v1.0
 * Phase: PORTAL-WEB-F1 — Design System Foundation
 * Authority: brand/mikuy-brand-design-tokens-v1.0.json
 *
 * SOURCE tokens below come directly from the approved corporate baseline.
 * IMPLEMENTATION tokens are neutral scale decisions required to build a
 * consistent UI. They do not introduce new brand colors.
 */

:root {
  /* ================================================================
     BRAND COLORS — SOURCE TOKENS
     ================================================================ */
  --mk-color-brand-primary: #1B4332;
  --mk-color-brand-secondary: #2C5A45;
  --mk-color-brand-soft: #E8F0EB;
  --mk-color-brand-line: #B8CCBF;
  --mk-color-accent: #E07A28;
  --mk-color-accent-soft: #F5E6CC;
  --mk-color-ink: #22271F;
  --mk-color-text-secondary: #5A6E60;
  --mk-color-muted: #8A9B8F;
  --mk-color-border: #DDE3E0;
  --mk-color-background: #F7F9F8;
  --mk-color-surface: #FFFFFF;
  --mk-color-status-pass: #1B7F4B;

  /* Semantic aliases — no new colors */
  --mk-color-text: var(--mk-color-ink);
  --mk-color-text-subtle: var(--mk-color-text-secondary);
  --mk-color-link: var(--mk-color-brand-primary);
  --mk-color-link-hover: var(--mk-color-brand-secondary);
  --mk-color-focus: var(--mk-color-accent);
  --mk-color-warning: var(--mk-color-accent);
  --mk-color-warning-bg: var(--mk-color-accent-soft);

  /* ================================================================
     TYPOGRAPHY — SOURCE TOKENS
     ================================================================ */
  --mk-font-heading: Georgia, 'Times New Roman', serif;
  --mk-font-body: 'Segoe UI', system-ui, -apple-system, 'Helvetica Neue', sans-serif;
  --mk-font-data: Consolas, 'Cascadia Code', 'SFMono-Regular', ui-monospace, monospace;
  --mk-font-weight-heading: 700;
  --mk-font-weight-regular: 400;
  --mk-font-weight-medium: 600;
  --mk-font-weight-bold: 700;

  /* Implementation type scale */
  --mk-font-size-xs: 0.75rem;
  --mk-font-size-sm: 0.875rem;
  --mk-font-size-base: 1rem;
  --mk-font-size-lg: 1.125rem;
  --mk-font-size-xl: 1.25rem;
  --mk-font-size-2xl: 1.5rem;
  --mk-font-size-3xl: 2rem;
  --mk-font-size-4xl: 2.5rem;

  --mk-line-height-tight: 1.2;
  --mk-line-height-heading: 1.3;
  --mk-line-height-body: 1.6;

  /* ================================================================
     GEOMETRY — SOURCE TOKENS
     ================================================================ */
  --mk-container-max: 1180px;
  --mk-container-app-max: 1440px;
  --mk-container-admin-max: 1520px;
  --mk-producer-shell-max: 760px;
  --mk-logistics-shell-max: 820px;
  --mk-reading-max: 68ch;
  --mk-page-gutter-desktop: 28px;
  --mk-page-gutter-mobile: 20px;

  --mk-radius-sm: 4px;
  --mk-radius-md: 8px;
  --mk-radius-lg: 10px;

  /* Documentation values; media queries use the same literal values. */
  --mk-breakpoint-mobile: 640px;
  --mk-breakpoint-navigation: 860px;
  --mk-breakpoint-wide-collapse: 900px;

  /* ================================================================
     SPACING — IMPLEMENTATION SCALE
     4px base rhythm; no visual identity change.
     ================================================================ */
  --mk-space-0: 0;
  --mk-space-1: 0.25rem;
  --mk-space-2: 0.5rem;
  --mk-space-3: 0.75rem;
  --mk-space-4: 1rem;
  --mk-space-5: 1.25rem;
  --mk-space-6: 1.5rem;
  --mk-space-8: 2rem;
  --mk-space-10: 2.5rem;
  --mk-space-12: 3rem;
  --mk-space-16: 4rem;

  /* ================================================================
     CONTROLS / ACCESSIBILITY — IMPLEMENTATION TOKENS
     ================================================================ */
  --mk-control-min-height: 44px;
  --mk-touch-target-min: 44px;
  --mk-border-width: 1px;
  --mk-focus-width: 3px;
  --mk-focus-offset: 2px;

  /* App shell */
  --mk-sidebar-width: 260px;
  --mk-admin-sidebar-width: 280px;
  --mk-topbar-min-height: 64px;
  --mk-public-header-min-height: 84px;
  --mk-logo-public-width: 210px;
  --mk-logo-sidebar-width: 158px;
  --mk-logo-sidebar-mobile-width: 44px;
  --mk-logo-shell-width: 160px;
  --mk-logo-auth-width: 190px;
  --mk-logo-footer-width: 180px;

  /* Motion */
  --mk-duration-fast: 120ms;
  --mk-duration-base: 180ms;
}