/**
 * VBS v1.9.80 UI finish — presentation-only, additive styling.
 * Purpose: consistent content rhythm and usable responsive forms/dialogs/tables.
 * No permissions, workflow, data, or server behaviour is changed.
 */
body.vbs-app {
  --ui-finish-border: #d7e2ee;
  --ui-finish-primary: #155cb6;
  --ui-finish-muted: #526579;
  --ui-finish-focus: #1d4ed8;
  --ui-finish-surface: #fff;
}
body.vbs-app :where(.main-page-flow, .page-context-copy, .topbar-static-left, .topbar-static-actions) { min-width: 0; }
body.vbs-app :where(.page-context-heading h1, .section-title, .card-title) { overflow-wrap: anywhere; }
body.vbs-app :where(.alert, .flash-alert, .card, .form-section) { overflow-wrap: break-word; }
/* Consistent visibility for keyboard users without permanently outlining mouse clicks. */
body.vbs-app :where(a, button, input, select, textarea, summary, [role="button"]):focus-visible {
  outline: 3px solid var(--ui-finish-focus);
  outline-offset: 3px;
}
body.vbs-app :where(input, select, textarea)[aria-invalid="true"],
body.vbs-app :where(input, select, textarea).is-invalid {
  border-color: #b42318;
  box-shadow: 0 0 0 2px rgba(180,35,24,.12);
}
body.vbs-app :where(input, select, textarea):disabled { opacity: .77; cursor: not-allowed; }
body.vbs-app :where(.card, .page-toolbar, .form-section) { min-width: 0; }
body.vbs-app .main-page-flow :where(.actions, .ui-pagination) { row-gap: .65rem; }
/* Never widen the app shell because a long email, ID, URL, or table cell is present. */
body.vbs-app :where(.table-wrap, .table-mobile-cards) { max-width: 100%; }
body.vbs-app .table-wrap :where(td, th) { overflow-wrap: anywhere; }
body.vbs-app .table-wrap :where(a, button, summary) { scroll-margin-inline: 14px; }
body.vbs-app .table-wrap:focus-visible { outline: 3px solid var(--ui-finish-focus); outline-offset: -3px; }
/* The bottom navigator must not obscure the last actionable field on mobile. */
@media (max-width: 1024px) {
  body.vbs-app.has-sidebar .main-page-flow { padding-bottom: max(6rem, calc(5rem + env(safe-area-inset-bottom))); }
  body.vbs-app .mobile-tabbar { padding-bottom: max(.25rem, env(safe-area-inset-bottom)); }
}
@media (max-width: 640px) {
  body.vbs-app :where(.page-context-heading, .topbar-static-utility) { max-width: 100%; }
  body.vbs-app :where(.page-context-heading h1, .dashboard-page-heading h1) { line-height: 1.28; }
  body.vbs-app :where(.page-toolbar, .searchbar, .filter-row) :where(input, select, textarea) { max-width: 100%; min-width: 0; }
  body.vbs-app .ui-pagination { justify-content: center; }
  body.vbs-app .ui-pagination :where(a, button) { min-height: 44px; }
}
/* Container-dependent user directory: sidebar open/collapsed should not dictate form wrapping. */
body.vbs-app[data-page="users.php"] .users-directory {
  container-type: inline-size;
  container-name: user-directory;
}
body.vbs-app[data-page="users.php"] .users-toolbar { min-width: 0; }
body.vbs-app[data-page="users.php"] .users-filters { min-width: 0; }
body.vbs-app[data-page="users.php"] .users-filter-search { min-width: 0; }
body.vbs-app[data-page="users.php"] .users-directory :where(input, select) { max-width: 100%; }
body.vbs-app[data-page="users.php"] .users-directory .users-filter-actions { flex-wrap: wrap; }
/* Popover enters the browser top layer, avoiding clipping by scrollable tables. */
body.vbs-app[data-page="users.php"] .users-action-menu-panel[popover] {
  position: fixed;
  inset: auto;
  margin: 0;
  width: min(252px, calc(100vw - 24px));
  max-height: min(360px, calc(100dvh - 24px));
  overflow-y: auto;
  overscroll-behavior: contain;
  z-index: 1000;
}
body.vbs-app[data-page="users.php"] .users-action-menu-panel[popover]:not(:popover-open) { display: none; }
body.vbs-app[data-page="users.php"] .users-action-menu-panel[popover]:popover-open { display: block; }
body.vbs-app[data-page="users.php"] .users-action-menu > summary[aria-expanded="true"] { background: #e8f2ff; border-color: #8bb6e7; }
body.vbs-app[data-page="users.php"] .users-table-wrap .users-action-menu-panel :where(button, a) { min-height: 44px; }
/* Native modal: content always scrolls inside the dialog while its action bar remains visible. */
body.vbs-app[data-page="users.php"] .user-editor[open] { overscroll-behavior: contain; }
body.vbs-app[data-page="users.php"] .user-editor-head { padding-top: max(.9rem, env(safe-area-inset-top)); }
body.vbs-app[data-page="users.php"] .user-editor-actions { padding-bottom: max(.8rem, env(safe-area-inset-bottom)); }
body.vbs-app[data-page="users.php"] .user-editor-close { min-height: 44px; min-width: 44px; }
@container user-directory (max-width: 1250px) {
  body.vbs-app[data-page="users.php"] .users-toolbar {
    grid-template-columns: minmax(0,1fr) auto;
    grid-template-areas: "heading add" "filters filters";
    align-items: center;
  }
  body.vbs-app[data-page="users.php"] .users-toolbar-heading { grid-area: heading; }
  body.vbs-app[data-page="users.php"] .users-add { grid-area: add; }
  body.vbs-app[data-page="users.php"] .users-filters { grid-area: filters; }
}
@container user-directory (max-width: 840px) {
  body.vbs-app[data-page="users.php"] .users-filters {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }
  body.vbs-app[data-page="users.php"] .users-filter-actions { grid-column: 1 / -1; }
  body.vbs-app[data-page="users.php"] .users-filter-search { grid-column: 1 / -1; }
}
@container user-directory (max-width: 560px) {
  body.vbs-app[data-page="users.php"] .users-toolbar {
    grid-template-columns: minmax(0,1fr);
    grid-template-areas: "heading" "add" "filters";
    padding: .9rem;
  }
  body.vbs-app[data-page="users.php"] .users-add { width: 100%; justify-content: center; }
  body.vbs-app[data-page="users.php"] .users-filters { grid-template-columns: minmax(0,1fr); }
  body.vbs-app[data-page="users.php"] .users-filter-search,
  body.vbs-app[data-page="users.php"] .users-filter-actions { grid-column: 1; }
}
@media (prefers-reduced-motion: reduce) {
  body.vbs-app :where(button, a, input, select, textarea, .table-wrap tbody tr) { transition-duration: .01ms !important; }
}
@media (forced-colors: active) {
  body.vbs-app :where(a, button, input, select, textarea, summary):focus-visible { outline-color: Highlight; }
  body.vbs-app[data-page="users.php"] .users-action-menu-panel[popover] { border: 1px solid CanvasText; }
}
@media print {
  body.vbs-app .mobile-tabbar, body.vbs-app .app-backdrop { display: none !important; }
  body.vbs-app.has-sidebar .main-page-flow { padding-bottom: 0 !important; }
}

/* UX review: identify the actual document and distinguish format from access. */
body.vbs-app .booking-document-link {
  display: block;
  overflow-wrap: anywhere;
  color: var(--ui-finish-primary);
  text-decoration: underline;
  text-underline-offset: .18em;
  padding-block: .45rem;
}
body.vbs-app .booking-document-access-note {
  display: block;
  color: var(--ui-finish-muted);
  font-weight: 400;
  line-height: 1.55;
}
body.vbs-app .guided-step-feedback { margin-block: .5rem; }