/*
Typography Option 1 — Operations / Professional UI
Best fit if the dashboard should feel like an airline operations tool:
neutral, compact, structured, and low-drama.
Suggested font stack: IBM Plex Sans if available, then system UI.
*/

@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

:root {
  --font-sans: "Poppins", "IBM Plex Sans", "Inter", "Segoe UI", Roboto, Arial, sans-serif;
  --font-display: "Poppins", "IBM Plex Sans", "Inter", "Segoe UI", Roboto, Arial, sans-serif;

  --type-weight-regular: 400;
  --type-weight-medium: 500;
  --type-weight-semibold: 600;
  /* Four steps. Bold is the ceiling: it is what chips, badges, buttons and
     uppercase eyebrows use, and nothing on a Crew Center page goes above it.
     The extrabold and black steps were removed because every screen that
     reached for them ended up looking like a different product. */
  --type-weight-bold: 700;

  /* Five steps, and nothing between them. --letter-caps is the one every
     uppercase micro-label uses — eyebrows, table heads, chip text — which the
     dashboard had been hand-picking anywhere from .04em to .16em. */
  --letter-tighter: -0.03em;
  --letter-tight: -0.015em;
  --letter-normal: 0;
  --letter-wide: 0.015em;
  --letter-caps: 0.05em;

  /* Thirteen steps, roughly an eighth apart. The Crew Center had 83 distinct
     font sizes across seven sheets — .82, .84, .85, .86, .88, .9, .91 all
     within four pixels of each other — so no two screens agreed on what
     "small label" or "card heading" meant. Every size now lands on a step.

     Map overlay labels are the one exception: they are canvas furniture sized
     against the tiles, not page type, and live-ops.css keeps its own. */
  --type-size-4xs: .62rem;
  --type-size-3xs: .68rem;
  --type-size-2xs: .72rem;
  --type-size-xs: .76rem;
  --type-size-sm: .82rem;
  --type-size-md: .88rem;
  --type-size-base: .95rem;
  --type-size-lg: 1.02rem;
  --type-size-xl: 1.12rem;
  --type-size-2xl: 1.25rem;
  --type-size-3xl: 1.4rem;
  --type-size-4xl: 1.6rem;
  --type-size-5xl: 1.8rem;

  /* Above the scale sit two fluid steps, and only the hero band uses them:
     the photo headers on Fleet, Crew and an aircraft's own page, which are
     full-bleed and have to hold their own against the image behind them. A
     fixed step cannot — 3.2rem is right at 1400px and absurd on a phone.
     Every other title on every other page is --type-size-4xl. */
  --type-size-hero: clamp(1.65rem, 2.2vw, 2.3rem);
  --type-size-display: clamp(2rem, 4vw, 3.2rem);
}

body {
  font-family: var(--font-sans);
  font-size: var(--type-size-base);
  font-weight: var(--type-weight-regular);
  line-height: 1.54;
  letter-spacing: var(--letter-normal);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

h1,
h2,
h3,
.profile-heading h1,
.card-title-row h2,
.quick-actions h2 {
  font-family: var(--font-display);
  font-weight: var(--type-weight-semibold);
  letter-spacing: var(--letter-tight);
}

.profile-heading h1 {
  font-size: var(--type-size-2xl);
}

.card-title-row h2,
.quick-actions h2 {
  font-size: var(--type-size-base);
}

.crew-welcome .muted {
  font-size: var(--type-size-xl);
  font-weight: var(--type-weight-semibold);
}

.crew-welcome .fw-semibold {
  font-size: var(--type-size-2xl);
  font-weight: var(--type-weight-semibold) !important;
}

.crew-id {
  font-size: var(--type-size-lg);
  font-weight: var(--type-weight-semibold);
}

.sidebar-link {
  font-size: var(--type-size-base);
  font-weight: var(--type-weight-medium);
  letter-spacing: var(--letter-normal);
}

.sidebar-submenu a,
.nav-section-label {
  font-weight: var(--type-weight-medium);
}

.nav-section-label {
  font-size: var(--type-size-xs);
  letter-spacing: var(--letter-caps);
}

.profile-heading p,
.profile-stats span,
.flight-metrics span,
.next-flight-footer span,
.time-stack span,
.stat-item span,
.training-item span {
  font-weight: var(--type-weight-medium);
}

.profile-stats strong,
.flight-metrics strong,
.next-flight-footer strong,
.flight-number strong,
.route-row strong,
.stat-item strong,
.time-stack strong,
.training-item p {
  font-weight: var(--type-weight-semibold);
  letter-spacing: var(--letter-tight);
}

.stat-item strong {
  font-size: var(--type-size-3xl);
}

.btn,
.language-switch button,
.status-chip,
.badge {
  /* Bold to match the branded buttons (--bs-btn-font-weight:700) and the
     standardised badge weight; was semibold, which silently overrode both. */
  font-weight: var(--type-weight-bold);
  letter-spacing: var(--letter-normal);
}

.feed-item strong,
.training-item strong,
.user-menu .dropdown-item,
.quick-grid button {
  font-weight: var(--type-weight-semibold);
}

.feed-item p,
.company-row p,
.flash-content span {
  font-weight: var(--type-weight-regular);
  line-height: 1.45;
}


/* Keep image badges consistent in the Operations typography variant. */
.rank-badge {
  height: 26px;
}


.u-fw-medium { font-weight: var(--type-weight-medium); }
.u-fw-semibold { font-weight: var(--type-weight-semibold); }
.u-fw-bold { font-weight: var(--type-weight-bold); }

