/* ============================================================
   KRAIL — Taj Design System Tokens
   Source: ksharma-xyz/KRAIL @ main · taj/src/commonMain
   ============================================================ */

@font-face {
  font-family: "Antonio";
  src: url("fonts/antonio_regular.ttf") format("truetype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Antonio";
  src: url("fonts/antonio_medium.ttf") format("truetype");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Antonio";
  src: url("fonts/antonio_semibold.ttf") format("truetype");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

/* ---------- Light mode (default) ---------- */
:root {
  /* Surfaces & content */
  --krail-surface: #FFFFFF;
  --krail-on-surface: #010101;
  --krail-on-surface-placeholder: #595959;
  --krail-soft-label: #767676;
  --krail-secondary-label: #2E2E2E;
  --krail-scrim: #000000;

  /* Containers */
  --krail-discover-chip-bg: #F5F5F5;
  --krail-discover-card-bg: #F5F5F5;
  --krail-theme-selection-bg: #F5F5F5;
  --krail-bottom-sheet-bg: #F5F5F5;
  --krail-past-departure-row: #EEEEEE;

  /* Outlines & handles */
  --krail-outline-subtle: rgba(1,1,1,0.2);
  --krail-sheet-drag-handle: rgba(0,0,0,0.4);

  /* Status & alerts */
  --krail-error: #BA1A1A;
  --krail-error-container: #FFDAD6;
  --krail-on-error: #FFFFFF;
  --krail-on-error-container: #410002;
  --krail-alert: #FFBA27;
  --krail-deviation-early: #008913;
  --krail-deviation-late:  #E72020;

  /* Journey */
  --krail-future-journey: #3A3A3A;
  --krail-past-journey:   #BBBBBB;
  --krail-walking-path:   #757575;

  /* Stop label (same in both modes) */
  --krail-stop-label-surface: #1C1B1A;
  --krail-on-stop-label-surface: #FCF6F1;

  /* Brand statics (theme-mode independent) */
  --krail-magic-yellow: #FFC800;
  --krail-badge: #FF0000;
  --krail-user-location-dot: #1C70F2;
  --krail-seed: #FFBA27;

  /* Transport / theme palette */
  --krail-bus:          #00B5EF;
  --krail-train:        #F6891F;
  --krail-metro:        #009B77;
  --krail-ferry:        #5AB031;
  --krail-coach:        #742282;
  --krail-light-rail:   #E4022D;
  --krail-purple-drip:  #AC00C9;
  --krail-barbie-pink:  #E0218A;

  /* Active selected theme (Train default) */
  --krail-theme: var(--krail-train);
  --krail-theme-bg: rgba(246,137,31,0.15);

  /* Spacing scale (dp = px) */
  --krail-space-none: 0;
  --krail-space-xxs: 2px;
  --krail-space-xs:  4px;
  --krail-space-s:   6px;
  --krail-space-m:   8px;
  --krail-space-ml:  10px;
  --krail-space-l:   12px;
  --krail-space-xl:  16px;
  --krail-space-xxl: 20px;
  --krail-space-xxxl: 24px;
  --krail-space-xxxxl: 32px;

  /* Radius scale */
  --krail-radius-none: 0;
  --krail-radius-xs: 4px;
  --krail-radius-s:  8px;
  --krail-radius-m:  12px;
  --krail-radius-l:  16px;
  --krail-radius-xl: 24px;
  --krail-radius-xxl: 28px;
  --krail-radius-full: 50px;

  /* Icon sizes */
  --krail-icon-xs: 16px;
  --krail-icon-s:  20px;
  --krail-icon-m:  24px;
  --krail-icon-l:  32px;
  --krail-icon-xl: 36px;
  --krail-icon-xxl: 44px;
  --krail-icon-xxxl: 48px;
  --krail-icon-fab:  56px;

  /* Strokes */
  --krail-stroke-hairline: 0.5px;
  --krail-stroke-thin: 1px;
  --krail-stroke-regular: 2px;
  --krail-stroke-medium: 3px;
  --krail-stroke-thick: 4px;
  --krail-stroke-extra-thick: 8px;

  /* Component dimensions */
  --krail-page-h-pad: 16px;
  --krail-page-v-pad: 16px;
  --krail-page-section-gap: 24px;
  --krail-card-h-pad: 16px;
  --krail-card-v-pad: 16px;
  --krail-card-radius: 16px;
  --krail-card-internal-gap: 12px;
  --krail-bottom-sheet-radius: 24px;
  --krail-bottom-sheet-pad: 16px;
  --krail-button-small-h: 20px;
  --krail-button-medium-h: 32px;
  --krail-text-field-h: 48px;
  --krail-text-field-radius: 50px;
  --krail-button-round: 48px;

  /* Typography — system stack default */
  --krail-font-default: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --krail-font-antonio: "Antonio", -apple-system, sans-serif;
}

/* ---------- Dark mode ---------- */
[data-theme="dark"] {
  --krail-surface: #1C1B1A;
  --krail-on-surface: #FCF6F1;
  --krail-on-surface-placeholder: #A9A5A2;
  --krail-soft-label: #B0B0B0;
  --krail-secondary-label: #E2E2E2;
  --krail-scrim: #000000;

  --krail-discover-chip-bg: #292929;
  --krail-discover-card-bg: #292929;
  --krail-theme-selection-bg: #292929;
  --krail-bottom-sheet-bg: #292929;
  --krail-past-departure-row: #2C2B2A;

  --krail-outline-subtle: rgba(252,246,241,0.2);
  --krail-sheet-drag-handle: rgba(255,255,255,0.4);

  --krail-error: #FFB4AB;
  --krail-error-container: #93000A;
  --krail-on-error: #690005;
  --krail-on-error-container: #FFDAD6;
  --krail-alert: #F4B400;
  --krail-deviation-early: #00B219;
  --krail-deviation-late:  #FF2B2B;

  --krail-future-journey: #EEEEEE;
  --krail-past-journey:   #8F8F8F;
  --krail-walking-path:   #9E9E9E;

  --krail-theme-bg: rgba(246,137,31,0.45);
}

/* ---------- Type scale (system font) ---------- */
.krail-display-large    { font-family: var(--krail-font-default); font-weight: 700; font-size: 34px; line-height: 40px; letter-spacing: 0; }
.krail-display-medium   { font-family: var(--krail-font-default); font-weight: 700; font-size: 24px; line-height: 32px; letter-spacing: 0; }
.krail-display-small    { font-family: var(--krail-font-default); font-weight: 700; font-size: 20px; line-height: 28px; letter-spacing: 0; }
.krail-headline-large   { font-family: var(--krail-font-default); font-weight: 700; font-size: 28px; line-height: 36px; letter-spacing: 0; }
.krail-headline-medium  { font-family: var(--krail-font-default); font-weight: 700; font-size: 24px; line-height: 32px; letter-spacing: 0; }
.krail-headline-small   { font-family: var(--krail-font-default); font-weight: 700; font-size: 20px; line-height: 28px; letter-spacing: 0; }
.krail-title-large      { font-family: var(--krail-font-default); font-weight: 700; font-size: 18px; line-height: 24px; letter-spacing: 0.15px; }
.krail-title-medium     { font-family: var(--krail-font-default); font-weight: 700; font-size: 16px; line-height: 20px; letter-spacing: 0.15px; }
.krail-title-medium-reg { font-family: var(--krail-font-default); font-weight: 400; font-size: 16px; line-height: 20px; letter-spacing: 0.15px; }
.krail-title-small      { font-family: var(--krail-font-default); font-weight: 700; font-size: 14px; line-height: 18px; letter-spacing: 0.15px; }
.krail-body-large       { font-family: var(--krail-font-default); font-weight: 400; font-size: 18px; line-height: 26px; letter-spacing: 0.5px; }
.krail-body-medium      { font-family: var(--krail-font-default); font-weight: 400; font-size: 16px; line-height: 24px; letter-spacing: 0.5px; }
.krail-body-small       { font-family: var(--krail-font-default); font-weight: 400; font-size: 14px; line-height: 20px; letter-spacing: 0.5px; }
.krail-label-large      { font-family: var(--krail-font-default); font-weight: 700; font-size: 14px; line-height: 20px; letter-spacing: 1px; }
.krail-label-medium     { font-family: var(--krail-font-default); font-weight: 400; font-size: 12px; line-height: 16px; letter-spacing: 0.5px; }
.krail-label-small      { font-family: var(--krail-font-default); font-weight: 400; font-size: 10px; line-height: 12px; letter-spacing: 0.5px; }
.krail-intro-tagline    { font-family: var(--krail-font-default); font-weight: 900; font-size: 28px; line-height: 36px; letter-spacing: 0; }
.krail-emoji            { font-family: var(--krail-font-default); font-weight: 700; font-size: 64px; line-height: 72px; letter-spacing: 0; }

/* Antonio overrides — applied via .krail-antonio on container or specific classes */
.krail-antonio,
.krail-antonio * { font-family: var(--krail-font-antonio); }
.krail-antonio .krail-body-medium { font-weight: 700; } /* per AntonioTypography.kt */
.krail-antonio .krail-label-large { font-weight: 400; }
.krail-antonio .krail-intro-tagline { font-weight: 400; }