/* Brand colors shared with the native iPad theme. */
:root {
  --crew-header-height: 76px;
  --crew-canvas: #f4f7fb;
  --crew-ink: #18283c;
  --crew-muted: #52647a;
  --crew-control: #edf2f8;
  --crew-blue: #0758cf;
  --crew-blue-soft: #e8f0fc;
  --app-bg: var(--crew-canvas);
  --app-ink: var(--crew-ink);
  --app-muted: var(--crew-muted);
  --app-pink: var(--crew-blue);
  --app-accent: var(--crew-blue);
  --app-blush: var(--crew-blue-soft);
  --brand: var(--crew-blue);
  --brand-soft: var(--crew-blue-soft);
  --ink: var(--crew-ink);
  --secondary: var(--crew-muted);
  --inner: var(--crew-control);
}
.crew-brand-mark {
  flex: none;
  width: 20px;
  height: 20px;
  object-fit: contain;
  transform: rotate(-15deg);
}
.home-brand {
  color: var(--crew-ink);
  font-family: "Avenir Next", system-ui, sans-serif;
  font-weight: 600;
  font-size: 15px;
  line-height: 1.25;
  letter-spacing: normal;
}
.app-sidebar,
body:not(.app-immersive) > .topbar,
body:is([data-app-page="home"], [data-app-page="schedule"], [data-app-page="sessions"], [data-app-page="transcript"], [data-app-page="profile"], [data-app-page="settings"], [data-app-page="crew"]),
body:is(.crew-preflight, .crew-waiting),
.schedule-toolbar {
  background: var(--crew-canvas);
  color: var(--crew-ink);
}
body[data-app-page="crew"] {
  --crew-choice-ink: var(--crew-ink);
  --crew-choice-muted: var(--crew-muted);
  --crew-choice-blue: var(--crew-blue);
  --crew-choice-surface: var(--crew-canvas);
}
.app-navigation a[aria-current=page],
.app-navigation a[aria-current=page]:hover,
.app-settings-link[aria-current=page],
.schedule-tabbar a[aria-current],
#crew-view .schedule-tabbar a[aria-current] {
  color: var(--crew-blue);
  background: var(--crew-blue-soft);
}
#home-view .crew-entry-public .crew-entry-action,
.booking-primary:enabled {
  color: #fff;
  background: var(--crew-blue);
}
body:not(.app-immersive) .primary { box-shadow: none; }
#home-view .crew-entry-public .crew-entry-top > svg,
.booking-waiting-card > svg,
#crew-view .crew-size-icon,
#crew-view .crew-code-entry summary svg:first-child { color: var(--crew-blue); }
.booking-calendar,
#change-account-photo,
.native-account-identity svg,
.is-latest .session-history-icon {
  color: var(--crew-blue);
  background: var(--crew-blue-soft);
}
#profile-average-ring {
  background: conic-gradient(var(--crew-blue) var(--average-score, 0%), #e9e9eb 0);
}
.profile-score-point::before { background: var(--crew-blue); }
#crew-view .crew-size-action,
#crew-view .crew-size-card[aria-pressed=true] .crew-size-action,
#crew-view .crew-size-seats > span { background: var(--crew-control); }
#crew-view .crew-size-seats > .matched { background: var(--crew-blue); }
body:not(.app-immersive) :is(button,a,summary,input,select):focus-visible,
.booking-sheet button:focus-visible { outline-color: var(--crew-blue); }

/* Keep the title centered on pages with or without a Back button. */
.schedule-toolbar > h1 { grid-column: 2; }
.schedule-toolbar-actions { grid-column: 3; }
#room-preflight-toolbar > .schedule-back { grid-column: 1; }
.home-brand { gap: 7px; }
@media (max-width: 720px) {
  :root { --crew-header-height: 64px; }
}
:is(.schedule-toolbar, #crew-view .schedule-toolbar, #room-preflight-toolbar, #transcript-view > .schedule-toolbar, body.crew-waiting .crew-waiting-header) {
  min-height: var(--crew-header-height);
}
body.crew-waiting .crew-waiting-header { justify-items: center; }