/**
 * VBS v1.9.79 — Canonical UX/UI Design System
 * Consolidates runtime layers from v1.9.72, v1.9.74, v1.9.76, footer credit, and v1.9.78 typography.
 * v1.9.79 adds contrast normalization, 44px interaction targets, adaptive dashboard, booking-flow simplification, shell cleanup, and admin action density hardening.
 */
/* === v1.9.72 consistency layer === */
/*
 * VBS v1.9.72 — system-wide UI/UX consistency pass.
 * Loaded last in the screen cascade so this file can reduce accumulated visual
 * density without changing feature-owned business logic.
 */
@media screen {
  body.vbs-app {
    --ux72-surface: #ffffff;
    --ux72-surface-soft: #f8fafc;
    --ux72-border: #d8e1eb;
    --ux72-text: #172b4d;
    --ux72-muted: #56677c;
    --ux72-primary: #155cb6;
    --ux72-radius: 16px;
    --ux72-shadow: 0 8px 24px rgba(15, 23, 42, .065);
  }

  /* Reduce visual chrome so page tasks start higher in the viewport. */
  body.vbs-app .topbar:not(.topbar-dashboard-utility) {
    min-height: 76px;
    margin-bottom: 14px;
    padding: 10px 12px;
    gap: 12px;
    border-radius: var(--ux72-radius);
  }

  body.vbs-app .topbar:not(.topbar-dashboard-utility) .topbar-university-logo {
    width: 42px;
    height: 42px;
    flex-basis: 42px;
    border-radius: 12px;
  }

  body.vbs-app .topbar:not(.topbar-dashboard-utility) .topbar-meta-row {
    min-height: 18px;
    gap: 7px;
    margin-bottom: 1px;
  }

  body.vbs-app .topbar:not(.topbar-dashboard-utility) .topbar-kicker {
    min-height: 0;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--ux72-muted);
    font-size: .69rem;
    letter-spacing: .015em;
  }

  body.vbs-app .topbar:not(.topbar-dashboard-utility) .topbar-version-badge {
    min-height: 20px;
    padding: 2px 7px;
    font-size: .68rem;
  }

  body.vbs-app .topbar:not(.topbar-dashboard-utility) h1 {
    font-size: clamp(1.14rem, 1.35vw, 1.45rem);
    line-height: 1.22;
  }

  body.vbs-app .topbar:not(.topbar-dashboard-utility) p {
    margin-top: 1px;
    color: var(--ux72-muted);
    font-size: .82rem;
  }

  body.vbs-app .topbar-context-action {
    min-height: 44px;
    padding-inline: 13px;
  }

  /* Flatten inactive navigation groups to lower sidebar visual noise. */
  body.vbs-app .sidebar-menu {
    gap: 4px;
  }

  body.vbs-app .nav-group {
    padding: 5px;
    border-color: transparent;
    background: transparent;
  }

  body.vbs-app .nav-group-active {
    border-color: rgba(125, 211, 252, .14);
    background: rgba(255, 255, 255, .05);
  }

  body.vbs-app .sidebar-nav-title {
    margin: 1px 7px 5px;
  }

  body.vbs-app .nav-link {
    min-height: 44px;
  }

  /* Consistent reading rhythm and clearer interactive states. */
  body.vbs-app :where(.card, .form-section, .page-toolbar) {
    scroll-margin-top: 96px;
  }

  body.vbs-app :where(.card, .form-section, .page-toolbar):focus-within {
    border-color: #c6d7e8;
  }

  body.vbs-app :where(input[type="search"], input[type="text"], input[type="email"], input[type="tel"], input[type="password"], select, textarea) {
    transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
  }

  body.vbs-app :where(input[type="search"], input[type="text"], input[type="email"], input[type="tel"], input[type="password"], select, textarea):focus {
    border-color: #6ea4dc;
    background: #fff;
  }

  body.vbs-app .table-wrap tbody tr {
    transition: background-color .12s ease;
  }

  body.vbs-app .table-wrap tbody tr:focus-within > td {
    background: #f2f7fd;
  }

  body.vbs-app .actions > form {
    margin: 0;
  }

  /* Small screens: keep orientation controls visible but remove redundant text. */
  @media (max-width: 1024px) {
    body.vbs-app .topbar:not(.topbar-dashboard-utility) {
      top: max(6px, env(safe-area-inset-top));
      min-height: 68px;
      margin-bottom: 12px;
    }

    body.vbs-app .topbar:not(.topbar-dashboard-utility) .topbar-meta-row {
      display: none;
    }

    body.vbs-app .vbs-breadcrumb {
      margin-bottom: 2px;
      font-size: .76rem;
    }
  }

  @media (max-width: 640px) {
    body.vbs-app .topbar:not(.topbar-dashboard-utility) {
      position: sticky;
      grid-template-columns: minmax(0, 1fr);
      min-height: 60px;
      padding: 8px 9px;
      border-radius: 14px;
      box-shadow: var(--ux72-shadow);
    }

    body.vbs-app .topbar:not(.topbar-dashboard-utility) .topbar-left {
      gap: 8px;
    }

    body.vbs-app .topbar:not(.topbar-dashboard-utility) .topbar-university-logo {
      display: none;
    }

    body.vbs-app .topbar:not(.topbar-dashboard-utility) h1 {
      font-size: 1.05rem;
      line-height: 1.2;
    }

    body.vbs-app .topbar:not(.topbar-dashboard-utility) p {
      display: none;
    }

    body.vbs-app .vbs-breadcrumb ol {
      gap: 4px;
    }

    body.vbs-app .vbs-breadcrumb li + li::before {
      margin-inline-end: 4px;
    }

    body.vbs-app .mobile-tabbar {
      padding-bottom: max(4px, env(safe-area-inset-bottom));
    }
  }

  @media (pointer: coarse) {
    body.vbs-app :where(.btn, button, .nav-link, .mobile-tabbar-link, summary[role="button"], summary.btn) {
      min-height: 46px;
    }
  }

  @media (prefers-reduced-motion: reduce) {
    body.vbs-app :where(input, select, textarea, .table-wrap tbody tr) {
      transition: none;
    }
  }
}
/* === v1.9.74 static top menu === */
/*
 * VBS v1.9.74 — Unified Static Top Menu
 * One authenticated application bar across Dashboard and internal pages.
 * Page identity is rendered as non-sticky content so the sticky chrome stays compact.
 */
@media screen {
  body.vbs-app {
    --ux74-topbar-height: 58px;
    --ux74-topbar-border: #dce5ef;
    --ux74-topbar-text: #15304f;
    --ux74-topbar-muted: #6d7f95;
  }

  body.vbs-app.has-sidebar .topbar-static-utility {
    position: sticky;
    top: 0;
    z-index: 48;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px;
    width: 100%;
    max-width: none;
    min-width: 0;
    min-height: var(--ux74-topbar-height);
    margin: 0 0 14px;
    padding: 7px 10px 7px 12px;
    border: 1px solid var(--ux74-topbar-border);
    border-radius: 14px !important;
    background: rgba(255,255,255,.97);
    box-shadow: 0 4px 16px rgba(32,64,99,.05);
    backdrop-filter: blur(18px) saturate(150%);
  }

  body.vbs-app.has-sidebar .topbar-static-left,
  body.vbs-app.has-sidebar .topbar-static-actions {
    display: flex;
    align-items: center;
    min-width: 0;
  }

  body.vbs-app.has-sidebar .topbar-static-left {
    gap: 12px;
  }

  body.vbs-app.has-sidebar .topbar-static-brand {
    color: var(--ux74-topbar-text);
    text-decoration: none;
    font-size: .9rem;
    white-space: nowrap;
  }

  body.vbs-app.has-sidebar .topbar-static-brand:hover {
    color: #0f5fa8;
  }

  body.vbs-app.has-sidebar .topbar-static-divider {
    width: 1px;
    height: 22px;
    flex: 0 0 1px;
    background: var(--ux74-topbar-border);
  }

  body.vbs-app.has-sidebar .topbar-static-location {
    max-width: min(48vw, 620px);
    overflow: hidden;
    color: var(--ux74-topbar-muted);
    font-size: .82rem;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body.vbs-app.has-sidebar .topbar-static-actions {
    justify-content: flex-end;
    gap: 8px;
  }

  body.vbs-app.has-sidebar .topbar-static-action {
    min-height: 40px;
    padding: 7px 12px;
    border-radius: 11px;
    font-size: .82rem;
  }

  body.vbs-app.has-sidebar .topbar-static-utility .topbar-user {
    min-width: 0;
    min-height: 42px;
    padding: 3px 7px 3px 4px;
    border-color: #d8e2ee;
    border-radius: 11px;
    box-shadow: none;
  }

  body.vbs-app.has-sidebar .topbar-static-utility .avatar {
    width: 34px;
    height: 34px;
    flex-basis: 34px;
    border-radius: 9px;
  }

  body.vbs-app.has-sidebar .topbar-static-utility .topbar-user-copy strong {
    font-size: .8rem;
  }

  body.vbs-app.has-sidebar .topbar-static-utility .topbar-user-copy .small {
    max-width: 240px;
    overflow: hidden;
    font-size: .68rem;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  /* Page identity belongs to page content, not to the sticky application bar. */
  body.vbs-app.has-sidebar .page-context-heading {
    display: flex;
    align-items: center;
    min-width: 0;
    min-height: 72px;
    margin: 0 0 12px;
    padding: 2px 6px 8px;
  }

  body.vbs-app.has-sidebar .page-context-heading-main {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
  }

  body.vbs-app.has-sidebar .page-context-emblem {
    display: grid;
    place-items: center;
    width: 38px;
    height: 46px;
    flex: 0 0 38px;
  }

  body.vbs-app.has-sidebar .page-context-emblem img {
    width: auto;
    max-width: 34px;
    max-height: 44px;
    object-fit: contain;
  }

  body.vbs-app.has-sidebar .page-context-copy {
    min-width: 0;
  }

  body.vbs-app.has-sidebar .page-context-heading .vbs-breadcrumb {
    margin-bottom: 2px;
    font-size: .72rem;
  }

  body.vbs-app.has-sidebar .page-context-meta {
    display: flex;
    align-items: center;
    gap: 7px;
    min-height: 18px;
    margin-bottom: 1px;
    color: #63758b;
    font-size: .66rem;
    font-weight: 600;
  }

  body.vbs-app.has-sidebar .page-context-heading .topbar-version-badge {
    min-height: 19px;
    padding: 1px 6px;
    font-size: .64rem;
  }

  body.vbs-app.has-sidebar .page-context-heading h1 {
    margin: 0;
    color: #0f2138;
    font-size: clamp(1.28rem, 1.65vw, 1.6rem);
    font-weight: 800;
    line-height: 1.16;
    letter-spacing: -.018em;
  }

  body.vbs-app.has-sidebar .page-context-heading p {
    margin: 3px 0 0;
    color: #65758c;
    font-size: .82rem;
    line-height: 1.4;
  }

  /* Dashboard R6 used a page-specific bar. Normalize it to the same app bar. */
  body.vbs-app[data-page="dashboard.php"] .topbar-static-utility {
    min-height: var(--ux74-topbar-height);
    margin: 0 0 14px !important;
    padding: 7px 10px 7px 12px;
    border: 1px solid var(--ux74-topbar-border);
    border-radius: 14px !important;
    background: rgba(255,255,255,.97);
    box-shadow: 0 4px 16px rgba(32,64,99,.05);
  }

  @media (max-width: 1024px) {
    body.vbs-app.has-sidebar .topbar-static-utility {
      top: max(6px, env(safe-area-inset-top));
      min-height: 56px;
      margin-bottom: 10px;
      padding: 6px 8px;
    }

    body.vbs-app.has-sidebar .topbar-static-actions {
      display: flex;
    }

    body.vbs-app.has-sidebar .topbar-static-action {
      display: none;
    }

    body.vbs-app.has-sidebar .topbar-static-location {
      max-width: 44vw;
    }

    body.vbs-app.has-sidebar .page-context-heading {
      min-height: 64px;
      margin-bottom: 10px;
      padding-inline: 3px;
    }
  }

  @media (max-width: 640px) {
    body.vbs-app.has-sidebar .topbar-static-utility {
      position: sticky;
      grid-template-columns: minmax(0, 1fr) auto;
      min-height: 54px;
      padding: 5px 6px;
      border-radius: 12px !important;
    }

    body.vbs-app.has-sidebar .topbar-static-left {
      gap: 8px;
    }

    body.vbs-app.has-sidebar .topbar-static-brand {
      font-size: .82rem;
    }

    body.vbs-app.has-sidebar .topbar-static-divider {
      height: 18px;
    }

    body.vbs-app.has-sidebar .topbar-static-location {
      max-width: 36vw;
      font-size: .74rem;
    }

    body.vbs-app.has-sidebar .topbar-static-utility .topbar-user {
      width: 40px;
      min-width: 40px;
      min-height: 40px;
      padding: 3px;
      justify-content: center;
    }

    body.vbs-app.has-sidebar .topbar-static-utility .topbar-user-copy,
    body.vbs-app.has-sidebar .topbar-static-utility .topbar-user-chevron {
      display: none;
    }

    body.vbs-app.has-sidebar .page-context-heading {
      min-height: 58px;
      margin-bottom: 8px;
    }

    body.vbs-app.has-sidebar .page-context-emblem {
      display: none;
    }

    body.vbs-app.has-sidebar .page-context-heading .vbs-breadcrumb,
    body.vbs-app.has-sidebar .page-context-meta {
      display: none;
    }

    body.vbs-app.has-sidebar .page-context-heading h1 {
      font-size: 1.2rem;
    }

    body.vbs-app.has-sidebar .page-context-heading p {
      display: -webkit-box;
      overflow: hidden;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
      font-size: .78rem;
    }
  }

  @media (max-width: 390px) {
    body.vbs-app.has-sidebar .topbar-static-divider,
    body.vbs-app.has-sidebar .topbar-static-location {
      display: none;
    }
  }

  @media (prefers-reduced-motion: reduce) {
    body.vbs-app.has-sidebar .topbar-static-utility,
    body.vbs-app.has-sidebar .topbar-static-utility * {
      transition: none;
    }
  }
}
/* === v1.9.76 top alignment === */
/*
 * VBS v1.9.76 — Unified Top Menu Edge Alignment
 * Keep the authenticated application bar on the same top edge on every page.
 * Dashboard R6 already starts at y=0; internal pages previously inherited the
 * canonical workspace top padding, creating a visible 14–28px gap.
 */
@media screen {
  /* The static application bar owns the top edge of the workspace. Horizontal
     and bottom padding remain page/layout controlled; only the leading edge is
     normalized here. */
  body.vbs-app.has-sidebar .main-content {
    padding-top: 0 !important;
  }

  body.vbs-app.has-sidebar .topbar-static-utility {
    top: 0;
    margin-top: 0 !important;
  }

  /* The dashboard has a high-specificity R6 workspace rule. State the same
     contract explicitly so later dashboard tuning cannot reintroduce drift. */
  body.vbs-app[data-page="dashboard.php"].has-sidebar .main-content {
    padding-top: 0 !important;
  }

  body.vbs-app[data-page="dashboard.php"] .topbar-static-utility {
    top: 0;
    margin-top: 0 !important;
  }

  @media (max-width: 1024px) {
    body.vbs-app.has-sidebar .main-content {
      padding-top: 0 !important;
    }

    /* Preserve safe-area support without adding the former 6–8px visual gap. */
    body.vbs-app.has-sidebar .topbar-static-utility {
      top: env(safe-area-inset-top, 0px);
    }
  }

  @media (max-width: 820px) {
    body.vbs-app.has-sidebar .main-content {
      padding-top: 0 !important;
    }
  }

  @media (max-width: 640px) {
    body.vbs-app.has-sidebar .main-content {
      padding-top: 0 !important;
    }
  }
}
/* === footer presentation === */
/* Scoped footer presentation; retains the existing application shell. */
body.vbs-app .footer.vbs-footer-credit {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .5rem;
  padding: .75rem 1rem;
  margin-block-start: 2rem;
  border: 1px solid #dbe5f0;
  border-radius: 16px;
  background: linear-gradient(135deg, #f8fafc, #eef5ff);
  color: #334155;
  font-size: .8125rem;
  line-height: 1.4;
}
body.vbs-app .vbs-footer-credit :where(p) { margin: 0; }
body.vbs-app .vbs-footer-credit-content { min-width: 0; }
body.vbs-app .vbs-footer-credit-line { font-weight: 500; }
body.vbs-app .vbs-footer-developer {
  display: inline-block;
  padding-block: .0625rem;
  color: #1e40af;
  font-weight: 700;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: .2em;
  border-radius: 4px;
}
body.vbs-app .vbs-footer-developer:hover { color: #172554; text-decoration-thickness: 2px; }
body.vbs-app .vbs-footer-developer:focus-visible { outline: 3px solid #1d4ed8; outline-offset: 3px; }
body.vbs-app .vbs-footer-external { font-size: .9em; }
body.vbs-app .vbs-footer-contact { margin-block-start: .125rem; overflow-wrap: anywhere; }
body.vbs-app .vbs-footer-line-id,
body.vbs-app .vbs-footer-line-link {
  display: inline-flex;
  align-items: center;
  padding: .0625rem .5rem;
  margin-block: .0625rem;
  border: 1px solid #b7dfcd;
  border-radius: 999px;
  background: #eaf8ef;
  color: #14532d;
  font-weight: 700;
  text-decoration: none;
  text-underline-offset: .18em;
  white-space: nowrap;
}
body.vbs-app .vbs-footer-line-link:hover {
  border-color: #86cda9;
  background: #dcfce7;
  color: #166534;
  text-decoration: underline;
}
body.vbs-app .vbs-footer-line-link:focus-visible {
  outline: 3px solid #15803d;
  outline-offset: 3px;
}
body.vbs-app .vbs-footer-copyright { color: #475569; font-size: .75rem; white-space: normal; }
@media (min-width: 960px) {
  body.vbs-app .footer.vbs-footer-credit { flex-direction: row; align-items: center; justify-content: space-between; }
}
@media (forced-colors: active) {
  body.vbs-app .footer.vbs-footer-credit,
  body.vbs-app .vbs-footer-line-id,
  body.vbs-app .vbs-footer-line-link { border-color: CanvasText; }
  body.vbs-app .vbs-footer-developer,
  body.vbs-app .vbs-footer-line-link { color: LinkText; }
}
@media print {
  body.vbs-app .footer.vbs-footer-credit { background: none; box-shadow: none; border: 0; padding: 0; }
}

/* Legal/policy links: desktop = bottom-right, mobile = stacked and left aligned. */
body.vbs-app .vbs-footer-right {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: .3rem;
  min-width: 0;
}
body.vbs-app .vbs-footer-legal {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .25rem .5rem;
  font-size: .75rem;
  line-height: 1.5;
}
body.vbs-app .vbs-footer-legal a {
  color: #334155;
  text-decoration: none;
  text-underline-offset: .2em;
  border-radius: 4px;
}
body.vbs-app .vbs-footer-legal a:hover {
  color: #1e40af;
  text-decoration: underline;
}
body.vbs-app .vbs-footer-legal a:focus-visible {
  outline: 3px solid #1d4ed8;
  outline-offset: 3px;
}
body.vbs-app .vbs-footer-legal span[aria-hidden="true"] { color: #94a3b8; }
@media (min-width: 960px) {
  body.vbs-app .vbs-footer-right { align-items: flex-end; text-align: right; }
  body.vbs-app .vbs-footer-legal { justify-content: flex-end; }
}
@media (forced-colors: active) {
  body.vbs-app .vbs-footer-legal a { color: LinkText; }
}
/* === v1.9.78 typography === */
/**
 * VBS v1.9.78 — System-wide Typography Normalization
 *
 * Goal:
 * - Reduce the number of micro font sizes accumulated across legacy UI layers.
 * - Keep forms at 16px for mobile usability.
 * - Establish a 13px practical floor for readable application text.
 * - Preserve compact layouts without globally scaling the interface.
 *
 * This stylesheet is intentionally loaded last from templates/header.php.
 */

:root {
    --vbs-type-xs: 0.8125rem;   /* 13px */
    --vbs-type-sm: 0.875rem;    /* 14px */
    --vbs-type-base: 1rem;      /* 16px */
    --vbs-type-lg: 1.125rem;    /* 18px */
    --vbs-type-xl: 1.25rem;     /* 20px */
    --vbs-type-2xl: 1.5rem;     /* 24px */
    --vbs-type-3xl: 1.75rem;    /* 28px */
    --vbs-leading-tight: 1.3;
    --vbs-leading-ui: 1.45;
    --vbs-leading-body: 1.6;
}

/* --------------------------------------------------------------------------
   Application baseline
   -------------------------------------------------------------------------- */
body.vbs-app {
    font-size: var(--vbs-type-base);
    line-height: var(--vbs-leading-body);
}

body.vbs-app :is(input, select, textarea) {
    font-size: var(--vbs-type-base);
}

body.vbs-app :is(.btn, button, [role="button"]) {
    font-size: var(--vbs-type-sm);
    line-height: var(--vbs-leading-ui);
}

body.vbs-app :is(.section-title, .card-title) {
    line-height: var(--vbs-leading-tight);
}

body.vbs-app .section-title {
    font-size: var(--vbs-type-xl);
    font-weight: 700;
}

body.vbs-app :is(.small, small, .helper-text, .help-text, .field-help, .form-help, .hint-text) {
    font-size: var(--vbs-type-sm);
    line-height: var(--vbs-leading-ui);
}

body.vbs-app :is(.badge, .chip, .filter-chip, .count-pill, .system-version-badge) {
    font-size: var(--vbs-type-xs);
    line-height: 1.35;
}

/* --------------------------------------------------------------------------
   Navigation shell: sidebar, static top menu and page context
   -------------------------------------------------------------------------- */
body.vbs-app .sidebar-nav-title,
body.vbs-app .sidebar-footer-role {
    font-size: var(--vbs-type-xs);
    line-height: 1.4;
}

body.vbs-app .sidebar-nav a,
body.vbs-app .sidebar-nav button {
    font-size: 0.9375rem; /* 15px */
}

body.vbs-app.has-sidebar .topbar-static-utility .topbar-static-brand,
body.vbs-app.has-sidebar .topbar-static-utility .topbar-static-brand strong {
    font-size: var(--vbs-type-sm);
}

body.vbs-app.has-sidebar .topbar-static-utility .topbar-static-location {
    font-size: var(--vbs-type-sm);
    line-height: 1.35;
}

body.vbs-app.has-sidebar .topbar-static-utility .topbar-user-copy strong {
    font-size: var(--vbs-type-sm);
    line-height: 1.3;
}

body.vbs-app.has-sidebar .topbar-static-utility .topbar-user-copy .small {
    font-size: var(--vbs-type-xs);
    line-height: 1.35;
}

body.vbs-app.has-sidebar .page-context-heading .vbs-breadcrumb {
    font-size: var(--vbs-type-xs);
    line-height: 1.4;
}

body.vbs-app.has-sidebar .page-context-meta {
    font-size: 0.75rem; /* 12px: deliberately tertiary metadata */
    line-height: 1.4;
}

body.vbs-app.has-sidebar .page-context-heading .topbar-version-badge {
    font-size: 0.75rem;
    line-height: 1.3;
}

body.vbs-app.has-sidebar .page-context-heading h1 {
    font-size: var(--vbs-type-2xl);
    line-height: 1.2;
    font-weight: 700;
}

body.vbs-app.has-sidebar .page-context-heading p {
    font-size: var(--vbs-type-sm);
    line-height: 1.5;
}

body.vbs-app .topbar-kicker,
body.vbs-app .topbar-version-badge {
    font-size: var(--vbs-type-xs);
}

/* Mobile bottom navigation must remain readable at arm's length. */
body.vbs-app .mobile-tabbar-link strong {
    font-size: var(--vbs-type-xs);
    line-height: 1.25;
}

/* --------------------------------------------------------------------------
   Forms, filters, workflow cards and validation
   -------------------------------------------------------------------------- */
body.vbs-app .filter-field > span,
body.vbs-app .workflow-next-kicker,
body.vbs-app .workflow-role-action-next > span,
body.vbs-app .workflow-shortcut-label,
body.vbs-app .workflow-step-copy small {
    font-size: var(--vbs-type-xs);
    line-height: 1.4;
}

body.vbs-app :is(.field-error, .field-status, .validation-message, .form-error, .form-success) {
    font-size: var(--vbs-type-sm);
    line-height: 1.45;
}

body.vbs-app .permission-option-copy code,
body.vbs-app .permission-role-link small {
    font-size: var(--vbs-type-xs);
}

/* --------------------------------------------------------------------------
   Data tables and mobile table cards
   -------------------------------------------------------------------------- */
body.vbs-app .table-wrap table {
    font-size: var(--vbs-type-sm);
    line-height: 1.45;
}

body.vbs-app .table-wrap thead th,
body.vbs-app thead th {
    font-size: var(--vbs-type-sm);
    line-height: 1.35;
}

body.vbs-app .table-wrap :is(.btn, .table-action, .action-link) {
    font-size: var(--vbs-type-sm);
}

body.vbs-app .table-wrap td[data-label]::before,
body.vbs-app .table-mobile-cards td[data-label]::before,
body.vbs-app .table-wrap table.table-card-early td[data-label]::before {
    font-size: var(--vbs-type-xs);
    line-height: 1.35;
}

/* --------------------------------------------------------------------------
   Dashboard — collapse legacy 9.9–12.8px micro typography into 13/14px roles
   -------------------------------------------------------------------------- */
body.vbs-app[data-page="dashboard.php"] :is(
    .showcase-eyebrow,
    .dashboard-hero-vehicle-meta,
    .dashboard-hero-vehicle-status,
    .dashboard-hero-vehicle-label,
    .dashboard-context > span,
    .dashboard-context span,
    .dashboard-system-chip,
    .dashboard-version-chip,
    .dashboard-soft-chip,
    .dashboard-period-chip,
    .dashboard-vehicle-slider-toggle,
    .availability-badge,
    .driver-availability-text,
    .availability-count span,
    .requester-home-eyebrow,
    .requester-home-card-eyebrow,
    .requester-home-availability,
    .requester-request-no,
    .requester-action-booking,
    .requester-attention-badge,
    .requester-current-stage,
    .requester-step-state,
    .requester-step-number,
    .requester-step-headline,
    .requester-step-label,
    .requester-step-time,
    .requester-step-signed,
    .requester-timeline-detail-link,
    .requester-inline-link,
    .requester-trip-resource dt,
    .requester-trip-resource dd,
    .dashboard-monthly-metrics dt,
    .dashboard-section-action,
    .dashboard-details-toggle,
    .dashboard-resource-summary-metrics,
    .dashboard-agenda-row time
) {
    font-size: var(--vbs-type-xs);
    line-height: 1.4;
}

body.vbs-app[data-page="dashboard.php"] :is(
    .stat-note,
    .stat-card .stat-note,
    .dashboard-monthly-snapshot .stat-note,
    .fleet-card-body p,
    .showcase-section-head p,
    .driver-spotlight-intro > p,
    .requester-kpi-copy small,
    .requester-action-content > p,
    .requester-home-empty span,
    .requester-home-empty strong,
    .requester-request-destination small,
    .requester-request-destination strong,
    .requester-trip-main span,
    .requester-trip-time span,
    .requester-timeline-step p,
    .requester-timeline-footnote,
    .requester-progress-copy,
    .requester-booking-summary p
) {
    font-size: var(--vbs-type-sm);
    line-height: 1.45;
}

body.vbs-app[data-page="dashboard.php"] :is(.stat-card h3, .dashboard-card-title) {
    font-size: var(--vbs-type-base);
    line-height: 1.35;
}

/* --------------------------------------------------------------------------
   Guided booking flow / route review
   -------------------------------------------------------------------------- */
body.vbs-app[data-page="booking_create.php"] :is(
    .guided-step-kicker,
    .guided-step-link > span,
    .guided-step-link strong,
    .route-review-badge,
    .route-review-toolbar-copy span,
    .route-review-toolbar-copy strong,
    .route-map-frame-head span,
    .route-map-frame-head strong,
    .route-review-route-head span,
    .map-route-point small,
    .map-route-badge,
    .guided-progress-copy span,
    .guided-final-row span,
    .guided-final-confirm small
) {
    font-size: var(--vbs-type-xs);
    line-height: 1.4;
}

body.vbs-app[data-page="booking_create.php"] :is(
    .guided-step-heading p,
    .map-hint,
    .map-summary,
    .classification-derived-copy small,
    .contact-profile-kicker,
    .requester-identity-label,
    .document-source-heading small,
    .document-or-divider
) {
    font-size: var(--vbs-type-sm);
    line-height: 1.45;
}

body.vbs-app[data-page="booking_create.php"] .map-actions-inline .btn,
body.vbs-app[data-page="booking_create.php"] .booking-map-toggle {
    font-size: var(--vbs-type-sm);
}

/* --------------------------------------------------------------------------
   Booking lists and resource detail pages
   -------------------------------------------------------------------------- */
body.vbs-app[data-page="bookings.php"] :is(
    .vbs-booking-departure span,
    .vbs-muted,
    .vbs-booking-requester,
    .vbs-booking-department,
    .filter-chip
) {
    font-size: var(--vbs-type-sm);
    line-height: 1.45;
}

body.vbs-app:is([data-page="vehicle_view.php"], [data-page="driver_view.php"]) :is(
    .resource-metric-grid span,
    .resource-attribute-chips span,
    .resource-section-heading > strong,
    .resource-section-heading > a,
    .resource-availability,
    .resource-availability-card small,
    .resource-availability-card span,
    .resource-history-list time,
    .resource-history-list span,
    .resource-history-list b
) {
    font-size: var(--vbs-type-sm);
    line-height: 1.4;
}

/* --------------------------------------------------------------------------
   User management / administration
   -------------------------------------------------------------------------- */
body.vbs-app[data-page="users.php"] :is(
    .user-editor-step,
    .user-editor-eyebrow,
    .users-count,
    .users-toolbar-note,
    .users-meta-line,
    .user-active-choice small,
    .user-editor-description,
    .user-editor-section-note
) {
    font-size: var(--vbs-type-xs);
    line-height: 1.45;
}

body.vbs-app[data-page="users.php"] .users-filters label {
    font-size: var(--vbs-type-sm);
}

/* --------------------------------------------------------------------------
   Login / authentication
   -------------------------------------------------------------------------- */
body.vbs-app[data-page="login.php"] :is(
    .auth-hero-badge,
    .auth-version-badge,
    .auth-step-number,
    .auth-oauth-note,
    .auth-help-note,
    .footer-meta,
    .auth-membership-steps li,
    .auth-access-summary,
    .auth-mobile-brand span
) {
    font-size: var(--vbs-type-xs);
    line-height: 1.45;
}

body.vbs-app[data-page="login.php"] :is(
    .auth-form-subtitle,
    .google-signin-copy small
) {
    font-size: var(--vbs-type-sm);
    line-height: 1.45;
}

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */
body.vbs-app .app-footer,
body.vbs-app .footer-credit,
body.vbs-app .footer-meta {
    font-size: var(--vbs-type-xs);
    line-height: 1.45;
}

/* --------------------------------------------------------------------------
   Responsive refinements
   -------------------------------------------------------------------------- */
@media (max-width: 768px) {
    body.vbs-app.has-sidebar .page-context-heading h1 {
        font-size: var(--vbs-type-xl);
    }

    body.vbs-app.has-sidebar .topbar-static-utility .topbar-static-location {
        font-size: var(--vbs-type-xs);
    }

    body.vbs-app :is(.btn, button, [role="button"]) {
        font-size: var(--vbs-type-sm);
    }
}

/* --------------------------------------------------------------------------
   Operational / audit / notification / map utility text
   -------------------------------------------------------------------------- */
body.vbs-app :is(
    .audit-hash,
    .audit-filter-badge,
    .audit-json,
    .audit-event-code,
    .notification-channel,
    .notification-tab span,
    .notification-meta-grid dt,
    .pickup-sync-diff code,
    .pickup-bulk-form table code,
    .pickup-directory td::before,
    .permission-overview-stats span
) {
    font-size: var(--vbs-type-xs);
    line-height: 1.4;
}

body.vbs-app .leaflet-control-attribution {
    font-size: 0.75rem; /* 12px: map provider/legal attribution */
    line-height: 1.3;
}

body.vbs-app .topbar-university-logo-mark,
body.vbs-app #booking-review-button.is-conditionally-disabled:not([disabled])::before,
body.vbs-app .requester-mode-card.is-selected::after {
    font-size: var(--vbs-type-xs);
}

/* Match the high-specificity progressive booking layer without cascade overrides. */
body.vbs-app[data-page="booking_create.php"].booking-guided-enhanced :is(
    .guided-step-kicker,
    .guided-step-link > span,
    .guided-step-link strong,
    .guided-progress-copy span,
    .guided-final-row span,
    .guided-final-confirm small
) {
    font-size: var(--vbs-type-xs);
    line-height: 1.4;
}

body.vbs-app[data-page="booking_create.php"].booking-guided-enhanced :is(
    .guided-step-heading p,
    .classification-derived-copy small
) {
    font-size: var(--vbs-type-sm);
    line-height: 1.45;
}

/* ========================================================================== */
/* v1.9.79 UX/UI hardening                                                    */
/* ========================================================================== */

:root {
  --vbs-text-primary: #172033;
  --vbs-text-secondary: #526277;
  --vbs-text-tertiary: #5f7085;
  --vbs-text-disabled: #6a7889;
  --vbs-focus-ring: #1d4ed8;
  --vbs-touch-target: 44px;
  --vbs-danger-surface: #fff7f7;
  --vbs-warning-surface: #fffaf1;
}

body.vbs-app {
  --app-muted: var(--vbs-text-secondary);
  --vbs-muted: var(--vbs-text-secondary);
}

/* Readability / WCAG contrast normalization. */
body.vbs-app .muted,
body.vbs-app .topbar-static-location,
body.vbs-app .page-context-meta,
body.vbs-app .page-context-heading p,
body.vbs-app .users-meta-line,
body.vbs-app .requester-home-eyebrow,
body.vbs-app .requester-home-card-eyebrow,
body.vbs-app .requester-kpi-copy small,
body.vbs-app .occ-status-card small,
body.vbs-app .occ-kpi small {
  color: var(--vbs-text-secondary) !important;
}

body.vbs-app :is(.helper-text, .help-text, .field-help, .form-help, .hint-text) {
  color: var(--vbs-text-tertiary);
}

/* One application identity: profile remains in the top menu; sidebar is navigation only. */
body.vbs-app .sidebar-nav {
  padding-bottom: 12px;
}

/* Keep the footer at the bottom on short pages without forcing it over long content. */
body.vbs-app.has-sidebar .main-content {
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
}

body.vbs-app.has-sidebar .main-page-flow {
  min-width: 0;
  padding-bottom: 2rem;
}

body.vbs-app.has-sidebar .footer.vbs-footer-credit {
  margin-block-start: auto;
}

/* 44px interaction contract for core navigation and compact controls. */
body.vbs-app :is(
  .topbar-context-action,
  .topbar-user,
  .sidebar-toggle,
  .nav-link,
  .mobile-tabbar-link,
  .guided-step-link,
  .guided-step-edit,
  .users-row-actions > .btn,
  .users-row-actions > form > .btn,
  .users-action-menu > summary,
  .table-action,
  .ui-pagination a,
  .ui-pagination button
) {
  min-height: var(--vbs-touch-target);
}

/* Booking flow: two status layers on desktop, one compact progress layer on mobile. */
body.vbs-app[data-page="booking_create.php"].booking-guided-enhanced .guided-progress-copy > span {
  display: none;
}

body.vbs-app[data-page="booking_create.php"].booking-guided-enhanced .guided-step-link {
  min-height: var(--vbs-touch-target);
}

body.vbs-app[data-page="booking_create.php"].booking-guided-enhanced .guided-step-link:disabled {
  color: var(--vbs-text-disabled);
  background: #f4f6f8;
  opacity: 1;
}

body.vbs-app[data-page="booking_create.php"].booking-guided-enhanced .guided-step-heading h3 {
  margin-top: 0;
}

@media (max-width: 720px) {
  body.vbs-app[data-page="booking_create.php"].booking-guided-enhanced .guided-stepper {
    display: none;
  }

  body.vbs-app[data-page="booking_create.php"].booking-guided-enhanced .guided-progress {
    margin-bottom: 8px;
  }
}

/* Adaptive first-use dashboard: replace repeated zero-state cards with one guided start panel. */
body.vbs-app[data-page="dashboard.php"] .requester-first-use {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 18px;
  padding: 22px 24px;
  border-color: #cfe0f3;
  background: linear-gradient(135deg, #ffffff 0%, #f5f9ff 100%);
}

body.vbs-app[data-page="dashboard.php"] .requester-first-use-icon {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  border-radius: 16px;
  background: #eaf3ff;
  color: #1769d2;
}

body.vbs-app[data-page="dashboard.php"] .requester-first-use-copy h2 {
  margin: 2px 0 4px;
  font-size: var(--vbs-type-lg);
  line-height: 1.35;
}

body.vbs-app[data-page="dashboard.php"] .requester-first-use-copy p {
  margin: 0;
  color: var(--vbs-text-secondary);
  font-size: var(--vbs-type-sm);
  line-height: 1.55;
}

body.vbs-app[data-page="dashboard.php"] .requester-first-use-steps {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin: 14px 0 0;
  padding: 0;
  list-style: none;
}

body.vbs-app[data-page="dashboard.php"] .requester-first-use-steps li {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: var(--vbs-text-secondary);
  font-size: var(--vbs-type-sm);
}

body.vbs-app[data-page="dashboard.php"] .requester-first-use-steps li > span {
  width: 24px;
  height: 24px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  color: #fff;
  background: #1769d2;
  font-size: 12px;
  font-weight: 800;
}

body.vbs-app[data-page="dashboard.php"] .requester-first-use-action {
  white-space: nowrap;
}

@media (max-width: 820px) {
  body.vbs-app[data-page="dashboard.php"] .requester-first-use {
    grid-template-columns: 1fr;
    align-items: start;
    padding: 18px;
  }

  body.vbs-app[data-page="dashboard.php"] .requester-first-use-icon {
    width: 46px;
    height: 46px;
  }

  body.vbs-app[data-page="dashboard.php"] .requester-first-use-action {
    width: 100%;
  }
}

/* User directory: one primary action + overflow menu. */
body.vbs-app[data-page="users.php"] .users-row-actions {
  position: relative;
  flex-wrap: nowrap;
  align-items: center;
  gap: 6px;
}

body.vbs-app[data-page="users.php"] .users-action-menu {
  position: relative;
}

body.vbs-app[data-page="users.php"] .users-action-menu > summary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  list-style: none;
  cursor: pointer;
  user-select: none;
}

body.vbs-app[data-page="users.php"] .users-action-menu > summary::-webkit-details-marker {
  display: none;
}

body.vbs-app[data-page="users.php"] .users-action-menu-panel {
  position: absolute;
  z-index: 30;
  inset-inline-end: 0;
  top: calc(100% + 6px);
  min-width: 190px;
  padding: 6px;
  border: 1px solid #d4dfec;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 16px 38px rgba(15, 23, 42, .14);
}

body.vbs-app[data-page="users.php"] .users-action-menu-panel form {
  margin: 0;
}

body.vbs-app[data-page="users.php"] .users-action-menu-link {
  width: 100%;
  min-height: 40px;
  display: flex;
  align-items: center;
  padding: 8px 10px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #243247;
  font: inherit;
  font-size: var(--vbs-type-sm);
  text-align: start;
  text-decoration: none;
  cursor: pointer;
}

body.vbs-app[data-page="users.php"] .users-action-menu-link:hover,
body.vbs-app[data-page="users.php"] .users-action-menu-link:focus-visible {
  background: #eef5ff;
  color: #164f89;
  outline: none;
}

body.vbs-app[data-page="users.php"] .users-action-menu-link.is-danger {
  color: #b42318;
}

body.vbs-app[data-page="users.php"] .users-action-menu-link.is-danger:hover,
body.vbs-app[data-page="users.php"] .users-action-menu-link.is-danger:focus-visible {
  background: var(--vbs-danger-surface);
  color: #8f1d15;
}

@media (max-width: 760px) {
  body.vbs-app[data-page="users.php"] .users-row-actions {
    flex-wrap: wrap;
  }

  body.vbs-app[data-page="users.php"] .users-action-menu-panel {
    inset-inline-start: 0;
    inset-inline-end: auto;
  }
}

/* Operational control: surface exceptions first and keep English as supporting terminology. */
body.vbs-app[data-page="operational_control.php"] .occ-status-priority {
  border-width: 1px;
  box-shadow: 0 8px 22px rgba(15, 23, 42, .07);
}

body.vbs-app[data-page="operational_control.php"] .occ-status-priority.occ-status-danger {
  background: var(--vbs-danger-surface);
}

body.vbs-app[data-page="operational_control.php"] .occ-en-label {
  display: block;
  margin-top: 2px;
  color: var(--vbs-text-tertiary);
  font-size: var(--vbs-type-xs);
  font-weight: 500;
}

/* Focus visibility contract for custom interactive controls introduced in this layer. */
body.vbs-app :is(.users-action-menu > summary, .requester-first-use-action):focus-visible {
  outline: 3px solid var(--vbs-focus-ring);
  outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  body.vbs-app .users-action-menu-panel {
    scroll-behavior: auto;
  }
}

@media print {
  body.vbs-app .main-page-flow {
    padding-bottom: 0;
  }
}