/**
 * GENID — design tokens + Bootstrap 5 bridge
 * Load order: bootstrap.min.css → app.min.css → theme.css
 *
 * Replaces legacy Veltrix blues (#626ed4, #38a4f8) and scattered hex usage.
 */

:root,
[data-bs-theme="light"] {
  /* —— Canonical palette —— */
  --color-primary: #a8d8ef;
  --color-primary-hover: #94c8e4;
  --color-primary-active: #7ebad8;
  --color-primary-border: #6ba8c8;

  --color-link: #2f6f8f;
  --color-link-hover: #255a73;

  --color-text-dark: #123948;
  --color-text-darker: #0d2a38;

  /* Single accent (highlights, info emphasis — not primary actions) */
  --color-accent: #00a1e6;
  --color-accent-hover: #0090cc;
  --color-accent-active: #007eb3;

  /* RGB for Bootstrap rgba() / focus rings */
  --color-primary-rgb: 168, 216, 239;
  --color-accent-rgb: 0, 161, 230;
  --color-focus-ring-rgb: 126, 186, 216;

  /* Surfaces & neutrals */
  --color-surface: #ffffff;
  --color-surface-subtle: #f8fbfd;
  --color-surface-muted: #f8f8fa;
  --color-border-subtle: #e9ecef;
  --color-bg-muted: #e9ecef;
  --color-border-soft: #c5dfea;
  --color-topnav-bg: #b8dce8;
  --color-row-highlight: #f0f9fc;
  --color-neutral-bar: #e2e8ec;
  --color-success: #2e9d5c;

  --color-primary-disabled-bg: #d4e8f2;
  --color-primary-disabled-border: #c5dfea;
  --color-btn-disabled-text: #6d7a82;
  --color-outline-disabled-text: #8a9aa3;

  /* —— Legacy aliases (existing views) —— */
  --genid-pastel: var(--color-primary);
  --genid-pastel-border: var(--color-primary-border);
  --genid-pastel-ink: var(--color-text-dark);
  --genid-pastel-ink-strong: var(--color-text-darker);
  --genid-pastel-active: var(--color-accent);

  /* —— Bootstrap variable bridge —— */
  --bs-primary: var(--color-primary);
  --bs-primary-rgb: var(--color-primary-rgb);
  --bs-blue: var(--color-primary);
  --bs-link-color: var(--color-link);
  --bs-link-hover-color: var(--color-link-hover);
  --bs-info: var(--color-accent);
  --bs-info-rgb: var(--color-accent-rgb);
  --bs-cyan: var(--color-accent);
}

/* —— Reboot: bundled bootstrap.css set default <a> to pastel #a8d8ef (very low contrast on white).
   Use theme link colours everywhere plain links appear (Actions Log, tables, body copy). —— */
a {
  color: var(--bs-link-color);
}
a:hover {
  color: var(--bs-link-hover-color);
}
a:not([href]):not([class]),
a:not([href]):not([class]):hover {
  color: inherit;
  text-decoration: none;
}

/* —— Primary buttons: dark text on pastel (accessibility) —— */
.btn-primary {
  --bs-btn-color: var(--color-text-dark);
  --bs-btn-bg: var(--color-primary);
  --bs-btn-border-color: var(--color-primary-active);
  --bs-btn-hover-color: var(--color-text-darker);
  --bs-btn-hover-bg: var(--color-primary-hover);
  --bs-btn-hover-border-color: var(--color-primary-border);
  --bs-btn-focus-shadow-rgb: var(--color-focus-ring-rgb);
  --bs-btn-active-color: var(--color-text-darker);
  --bs-btn-active-bg: var(--color-primary-active);
  --bs-btn-active-border-color: var(--color-primary-border);
  --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
  --bs-btn-disabled-color: var(--color-btn-disabled-text);
  --bs-btn-disabled-bg: var(--color-primary-disabled-bg);
  --bs-btn-disabled-border-color: var(--color-primary-disabled-border);
}

.btn-outline-primary {
  --bs-btn-color: var(--color-link);
  --bs-btn-border-color: var(--color-primary-active);
  --bs-btn-hover-color: var(--color-text-darker);
  --bs-btn-hover-bg: var(--color-primary);
  --bs-btn-hover-border-color: var(--color-primary-active);
  --bs-btn-focus-shadow-rgb: var(--color-focus-ring-rgb);
  --bs-btn-active-color: var(--color-text-darker);
  --bs-btn-active-bg: var(--color-primary-hover);
  --bs-btn-active-border-color: var(--color-primary-border);
  --bs-btn-disabled-color: var(--color-outline-disabled-text);
  --bs-btn-disabled-border-color: var(--color-primary-disabled-border);
  --bs-gradient: none;
}

/* Info = accent; white label for contrast on saturated accent */
.btn-info {
  --bs-btn-color: #fff;
  --bs-btn-bg: var(--color-accent);
  --bs-btn-border-color: var(--color-accent-hover);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--color-accent-hover);
  --bs-btn-hover-border-color: var(--color-accent-active);
  --bs-btn-active-color: #fff;
  --bs-btn-active-bg: var(--color-accent-active);
  --bs-btn-active-border-color: var(--color-accent-active);
  --bs-btn-focus-shadow-rgb: var(--color-accent-rgb);
}

.btn-outline-info {
  --bs-btn-color: var(--color-accent);
  --bs-btn-border-color: var(--color-accent);
  --bs-btn-hover-color: #fff;
  --bs-btn-hover-bg: var(--color-accent);
  --bs-btn-hover-border-color: var(--color-accent);
  --bs-btn-focus-shadow-rgb: var(--color-accent-rgb);
}

/* Pastel primary fills: never assume white body text */
.bg-primary {
  background-color: var(--color-primary) !important;
  color: var(--color-text-dark) !important;
}

.text-bg-primary {
  background-color: var(--color-primary) !important;
  color: var(--color-text-dark) !important;
}

/* “Primary” as text color = link (pastel as hex is illegible on white) */
.text-primary {
  color: var(--color-link) !important;
}

/* Login / cards: utility whites on bg-primary become readable */
.bg-primary .text-white,
.bg-primary .text-white-50 {
  color: var(--color-text-dark) !important;
}

.bg-primary .text-white-50 {
  opacity: 0.72;
}

.date.bg-primary {
  color: var(--color-text-dark) !important;
}

/* Top navigation */
.topnav .navbar-nav .nav-link,
.topnav .nav-link.dropdown-toggle {
  color: var(--color-text-dark) !important;
}

.topnav .navbar-nav > .dropdown.active > a {
  color: var(--color-text-darker) !important;
}

/* —— Alerts —— */
.alert-primary {
  --bs-alert-color: var(--color-text-dark);
  --bs-alert-bg: rgba(var(--color-primary-rgb), 0.35);
  --bs-alert-border-color: var(--color-primary-active);
}

.alert-info {
  --bs-alert-color: var(--color-text-dark);
  --bs-alert-bg: rgba(var(--color-accent-rgb), 0.12);
  --bs-alert-border-color: var(--color-accent);
}

/* —— Badges —— */
.badge.text-bg-primary,
.badge.bg-primary {
  background-color: var(--color-primary) !important;
  color: var(--color-text-dark) !important;
}

.badge.text-bg-info,
.badge.bg-info {
  background-color: var(--color-accent) !important;
  color: #fff !important;
}

/* —— Cards —— */
.card {
  border-color: var(--color-border-subtle);
}

.card-header {
  background-color: var(--color-surface);
  border-bottom-color: var(--color-border-subtle);
  color: var(--color-text-dark);
}

/* —— Tables —— */
.table {
  --bs-table-border-color: var(--color-border-subtle);
}

.table:not(.table-dark) {
  /* Bootstrap default #5b626b made row text look “washed out” on striped tables */
  color: var(--color-text-dark);
  --bs-table-striped-color: var(--color-text-dark);
  --bs-table-active-color: var(--color-text-dark);
  --bs-table-hover-color: var(--color-text-dark);
}

.table:not(.table-dark) thead th {
  color: var(--color-text-darker);
}

.table-primary {
  --bs-table-bg: var(--color-primary);
  --bs-table-color: var(--color-text-dark);
  --bs-table-hover-bg: var(--color-primary-hover);
  --bs-table-hover-color: var(--color-text-darker);
}

.table-info {
  --bs-table-bg: rgba(var(--color-accent-rgb), 0.14);
  --bs-table-color: var(--color-text-dark);
}

/* Links inside tables: use theme link colour (darker teal-blue) instead of default bright blue */
.table:not(.table-dark) tbody td a:not(.btn):not(.badge):not(.page-link),
.table:not(.table-dark) tbody th a:not(.btn):not(.badge):not(.page-link),
.table:not(.table-dark) thead th a:not(.btn):not(.badge):not(.page-link),
.table:not(.table-dark) tfoot td a:not(.btn):not(.badge):not(.page-link) {
  color: var(--bs-link-color);
}
.table:not(.table-dark) tbody td a:not(.btn):not(.badge):not(.page-link):hover,
.table:not(.table-dark) tbody th a:not(.btn):not(.badge):not(.page-link):hover,
.table:not(.table-dark) thead th a:not(.btn):not(.badge):not(.page-link):hover,
.table:not(.table-dark) tfoot td a:not(.btn):not(.badge):not(.page-link):hover {
  color: var(--bs-link-hover-color);
}

/* —— Enquiry list tables: prevent zoom-squeeze; keep Action width fixed —— */
.enquiry-table {
  width: 100% !important;
  min-width: 1200px;
  table-layout: fixed;
}

.enquiry-table thead th span {
  white-space: nowrap;
}

/* Action column on the RIGHT (Inactive / Booked Open / Booked Close) */
.enquiry-table--action-right thead th:last-child,
.enquiry-table--action-right tbody td:last-child {
  width: 90px;
  min-width: 90px;
  white-space: nowrap;
}

/* Action column on the LEFT (main Enquiry list where Action is column #2) */
.enquiry-table--action-left thead th:nth-child(2),
.enquiry-table--action-left tbody td:nth-child(2) {
  width: 90px;
  min-width: 90px;
  white-space: nowrap;
}

/* —— Utilities (prefer these over inline hex in PHP) —— */
.text-accent {
  color: var(--color-accent) !important;
}

.text-link-ui {
  color: var(--color-link) !important;
}

.border-primary-token {
  border-color: var(--color-primary-border) !important;
}

.bg-surface-subtle {
  background-color: var(--color-surface-subtle) !important;
}

/* —— Pagination —— */
.pagination {
  --bs-pagination-active-bg: var(--color-primary);
  --bs-pagination-active-border-color: var(--color-primary-border);
  --bs-pagination-active-color: var(--color-text-dark);
  --bs-pagination-focus-box-shadow: 0 0 0 0.2rem rgba(var(--color-focus-ring-rgb), 0.35);
  --bs-pagination-color: var(--color-link);
  --bs-pagination-hover-color: var(--color-link-hover);
}

/* —— List group —— */
.list-group-item-primary {
  color: var(--color-text-dark);
  background-color: rgba(var(--color-primary-rgb), 0.45);
  border-color: var(--color-primary-active);
}

.list-group-item-info {
  color: var(--color-text-dark);
  background-color: rgba(var(--color-accent-rgb), 0.12);
  border-color: var(--color-accent);
}

/* —— Header user menu uses same .noti-icon sizing as bell / fullscreen (app.css: 24px) —— */