/*
 * Mailiens customer UI design tokens.
 * Variables only: importing this file must not alter presentation by itself.
 * Values are extracted from the approved customer baselines captured 2026-09-12.
 */
:root {
  /* Brand and application shell */
  --ml-color-shell: #364354;
  --ml-color-sidebar: #10243e;
  --ml-color-sidebar-active: #078f88;
  --ml-color-header-text: #ffffff;
  --ml-color-header-muted: #d7e2eb;

  /* Content */
  --ml-color-ink: #10243e;
  --ml-color-text: #344457;
  --ml-color-muted: #647875;
  --ml-color-subtle: #829188;
  --ml-color-surface: #ffffff;
  --ml-color-surface-soft: #f8fbfa;
  --ml-color-surface-muted: #eef4f1;
  --ml-color-border: #c7dcd8;
  --ml-color-border-soft: #d5e2df;
  --ml-color-border-strong: #b9d2ce;

  /* Actions and states */
  --ml-color-action: #078f88;
  --ml-color-action-dark: #075f59;
  --ml-color-action-soft: #eef9f8;
  --ml-color-success: #078f88;
  --ml-color-success-soft: #eef9f8;
  --ml-color-warning: #9a6700;
  --ml-color-warning-soft: #fffaeb;
  --ml-color-danger: #b42318;
  --ml-color-danger-dark: #8f1d16;
  --ml-color-danger-soft: #fef3f2;
  --ml-color-info: #175b8d;
  --ml-color-info-soft: #eff8ff;
  --ml-color-disabled: #9fb1ae;
  --ml-color-disabled-soft: #f4f7f6;

  /* Typography */
  --ml-font-family: "Aptos", "Inter", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --ml-font-size-meta: 9px;
  --ml-font-size-caption: 10px;
  --ml-font-size-body: 11px;
  --ml-font-size-control: 9px;
  --ml-font-size-label: 9px;
  /* Compact operational panels follow Response Control and Creative Control. */
  --ml-font-size-panel-heading: 14px;
  --ml-font-size-subheading: 13px;
  --ml-font-size-panel-value: 16px;
  --ml-font-size-card-heading: 17px;
  --ml-font-size-section-heading: 17px;
  --ml-font-size-page-heading: 22px;
  --ml-line-height-tight: 1.12;
  --ml-line-height-heading: 1.2;
  --ml-line-height-body: 1.35;
  --ml-font-weight-regular: 400;
  --ml-font-weight-medium: 600;
  --ml-font-weight-semibold: 700;
  --ml-font-weight-bold: 750;
  --ml-font-weight-label: 800;
  --ml-letter-spacing-heading: -0.025em;
  --ml-letter-spacing-label: 0.08em;

  /* Spacing */
  --ml-space-1: 2px;
  --ml-space-2: 3px;
  --ml-space-3: 5px;
  --ml-space-4: 6px;
  --ml-space-5: 7px;
  --ml-space-6: 8px;
  --ml-space-7: 9px;
  --ml-space-8: 10px;
  --ml-space-9: 12px;
  --ml-space-10: 16px;
  --ml-space-11: 20px;
  --ml-card-gap: 10px;
  --ml-card-padding-x: 10px;
  --ml-card-padding-y: 9px;
  --ml-control-gap: 5px;

  /* Shape and elevation */
  --ml-radius-control: 3px;
  --ml-radius-card: 4px;
  --ml-radius-panel: 5px;
  --ml-shadow-card: none;
  --ml-shadow-control: none;

  /* Controls */
  --ml-control-height-compact: 26px;
  --ml-control-height: 28px;
  --ml-header-action-width: 138px;
  --ml-control-height-comfortable: 34px;
  --ml-control-height-touch: 44px;
  --ml-control-padding-x: 7px;
  --ml-control-padding-y: 3px;
  --ml-focus-outline: 2px solid #078f88;
  --ml-focus-outline-offset: 2px;
  --ml-focus-shadow: none;

  /* Shell geometry */
  --ml-shell-header-height: 72px;
  --ml-shell-sidebar-width: 214px;
  --ml-content-max-width: 1440px;

  /* Responsive thresholds */
  --ml-breakpoint-mobile: 520px;
  --ml-breakpoint-tablet: 700px;
  --ml-breakpoint-laptop: 1050px;

  /* Motion */
  --ml-duration-fast: 120ms;
  --ml-duration-standard: 180ms;
  --ml-easing-standard: ease;
}