/* =============================================
   BookingsHorizon – Horizon Dark Theme
   Design tokens from GovAssist Horizon
   ============================================= */

:root {
  /* Backgrounds */
  --hz-bg:            #0d1117;
  --hz-bg-card:       #161b22;
  --hz-bg-card-hover: #1c2333;
  --hz-bg-input:      #0d1117;
  --hz-bg-surface:    #1a2233;

  /* Borders */
  --hz-border:        #21262d;
  --hz-border-active: #3b82f6;

  /* Text */
  --hz-text:          #e6edf3;
  --hz-text-secondary:#8b949e;
  --hz-text-muted:    #484f58;

  /* Accents */
  --hz-blue:          #3b82f6;
  --hz-teal:          #2dd4bf;
  --hz-amber:         #f59e0b;
  --hz-red:           #ef4444;
  --hz-green:         #22c55e;
  --hz-purple:        #a78bfa;
  --hz-coral:         #f97066;

  /* Functional */
  --hz-chip-bg:       rgba(59,130,246,0.12);
}

/* ── Global ───────────────────────────────── */
body {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  background-color: var(--hz-bg);
  color: var(--hz-text);
}

main { flex: 1; }

a { color: var(--hz-blue); }
a:hover { color: #60a5fa; }

hr { border-color: var(--hz-border); opacity: .5; }

/* ── Navbar ───────────────────────────────── */
.navbar {
  background-color: var(--hz-bg-card) !important;
  border-bottom: 1px solid var(--hz-border);
}
.navbar-brand { color: var(--hz-text) !important; font-weight: 600; }
.navbar-brand:hover { color: var(--hz-blue) !important; }
.navbar-nav .nav-link { color: var(--hz-text-secondary) !important; }
.navbar-nav .nav-link:hover,
.navbar-nav .nav-link.active { color: var(--hz-text) !important; }
.navbar-toggler { border-color: var(--hz-border); }

.dropdown-menu {
  background-color: var(--hz-bg-surface);
  border: 1px solid var(--hz-border);
}
.dropdown-item { color: var(--hz-text-secondary); }
.dropdown-item:hover, .dropdown-item:focus {
  background-color: var(--hz-bg-card-hover);
  color: var(--hz-text);
}
.dropdown-divider { border-color: var(--hz-border); }

/* ── Cards ────────────────────────────────── */
.card {
  background-color: var(--hz-bg-card);
  border: 1px solid var(--hz-border);
  transition: box-shadow 0.2s;
  color: var(--hz-text);
}
.card:hover { box-shadow: 0 0 0 1px var(--hz-border); }
.card-header {
  background-color: var(--hz-bg-surface);
  border-bottom: 1px solid var(--hz-border);
  color: var(--hz-text);
}
.card-body { color: var(--hz-text); }
.card-title { color: var(--hz-text); }

/* Stat cards with coloured left border */
.card.border-primary  { border-color: var(--hz-blue) !important; }
.card.border-success  { border-color: var(--hz-green) !important; }
.card.border-info     { border-color: var(--hz-teal) !important; }
.card.border-danger   { border-color: var(--hz-red) !important; }
.card.border-warning  { border-color: var(--hz-amber) !important; }
.card.border-secondary{ border-color: var(--hz-text-muted) !important; }

/* ── Forms ────────────────────────────────── */
.form-control, .form-select {
  background-color: var(--hz-bg-input);
  border: 1px solid var(--hz-border);
  color: var(--hz-text);
}
.form-control:focus, .form-select:focus {
  background-color: var(--hz-bg-input);
  border-color: var(--hz-border-active);
  color: var(--hz-text);
  box-shadow: 0 0 0 0.2rem rgba(59,130,246,0.25);
}
.form-control::placeholder { color: var(--hz-text-muted); }
.form-label { color: var(--hz-text-secondary); }
.form-text { color: var(--hz-text-muted); }
.form-control-color { padding: 0.25rem; }
.form-check-input {
  background-color: var(--hz-bg-input);
  border-color: var(--hz-border);
}
.form-check-input:checked {
  background-color: var(--hz-blue);
  border-color: var(--hz-blue);
}
.form-check-label { color: var(--hz-text-secondary); }

/* ── Buttons ──────────────────────────────── */
.btn-primary {
  background-color: var(--hz-blue);
  border-color: var(--hz-blue);
  color: #fff;
}
.btn-primary:hover {
  background-color: #2563eb;
  border-color: #2563eb;
}
.btn-outline-primary {
  color: var(--hz-blue);
  border-color: var(--hz-blue);
}
.btn-outline-primary:hover {
  background-color: var(--hz-blue);
  color: #fff;
}
.btn-outline-secondary {
  color: var(--hz-text-secondary);
  border-color: var(--hz-border);
}
.btn-outline-secondary:hover {
  background-color: var(--hz-bg-surface);
  color: var(--hz-text);
  border-color: var(--hz-text-secondary);
}
.btn-outline-danger {
  color: var(--hz-red);
  border-color: var(--hz-red);
}
.btn-outline-danger:hover {
  background-color: var(--hz-red);
  color: #fff;
}
.btn-outline-success {
  color: var(--hz-green);
  border-color: var(--hz-green);
}
.btn-outline-success:hover {
  background-color: var(--hz-green);
  color: #fff;
}
.btn-secondary {
  background-color: var(--hz-bg-surface);
  border-color: var(--hz-border);
  color: var(--hz-text);
}
.btn-secondary:hover {
  background-color: var(--hz-bg-card-hover);
  border-color: var(--hz-text-muted);
}

/* ── Tables ───────────────────────────────── */
.table {
  color: var(--hz-text);
  --bs-table-bg: transparent;
  --bs-table-color: var(--hz-text);
  --bs-table-border-color: var(--hz-border);
}
.table th {
  font-weight: 600;
  white-space: nowrap;
  color: var(--hz-text-secondary);
  background-color: var(--hz-bg-surface);
  border-bottom-color: var(--hz-border);
}
.table td { border-bottom-color: var(--hz-border); }
.table-hover > tbody > tr:hover {
  --bs-table-hover-bg: var(--hz-bg-card-hover);
  color: var(--hz-text);
}

/* ── Badges ───────────────────────────────── */
.badge { font-weight: 500; }
.badge.bg-success  { background-color: var(--hz-green) !important; }
.badge.bg-warning  { background-color: var(--hz-amber) !important; color: #000 !important; }
.badge.bg-danger   { background-color: var(--hz-red) !important; }
.badge.bg-info     { background-color: var(--hz-teal) !important; color: #000 !important; }
.badge.bg-secondary{ background-color: var(--hz-text-muted) !important; }
.badge.bg-light    { background-color: var(--hz-chip-bg) !important; color: var(--hz-blue) !important; }

/* ── Alerts ───────────────────────────────── */
.alert-success {
  background-color: rgba(34,197,94,0.12);
  border-color: rgba(34,197,94,0.25);
  color: var(--hz-green);
}
.alert-danger {
  background-color: rgba(239,68,68,0.12);
  border-color: rgba(239,68,68,0.25);
  color: var(--hz-red);
}
.alert .btn-close { filter: invert(1) grayscale(100%) brightness(200%); }

/* ── Modals ───────────────────────────────── */
.modal-content {
  background-color: var(--hz-bg-surface);
  border: 1px solid var(--hz-border);
  color: var(--hz-text);
}
.modal-header { border-bottom-color: var(--hz-border); }
.modal-footer { border-top-color: var(--hz-border); }
.btn-close { filter: invert(1) grayscale(100%) brightness(200%); }

/* ── Tabs ─────────────────────────────────── */
.nav-tabs {
  border-bottom-color: var(--hz-border);
}
.nav-tabs .nav-link {
  color: var(--hz-text-secondary);
  border-color: transparent;
}
.nav-tabs .nav-link:hover {
  border-color: var(--hz-border) var(--hz-border) transparent;
  color: var(--hz-text);
}
.nav-tabs .nav-link.active {
  background-color: var(--hz-bg-card);
  border-color: var(--hz-border) var(--hz-border) var(--hz-bg-card);
  color: var(--hz-blue);
}

/* ── List group ───────────────────────────── */
.list-group-item {
  background-color: var(--hz-bg-card);
  border-color: var(--hz-border);
  color: var(--hz-text);
}
.list-group-item-action:hover,
.list-group-item-action:focus {
  background-color: var(--hz-bg-card-hover);
  color: var(--hz-text);
}

/* ── Footer ───────────────────────────────── */
footer {
  background-color: var(--hz-bg-card) !important;
  border-top: 1px solid var(--hz-border) !important;
  color: var(--hz-text-muted) !important;
}

/* ── Text utilities ───────────────────────── */
.text-muted { color: var(--hz-text-muted) !important; }
.text-primary { color: var(--hz-blue) !important; }
.text-success { color: var(--hz-green) !important; }
.text-danger { color: var(--hz-red) !important; }
.text-warning { color: var(--hz-amber) !important; }
.text-info { color: var(--hz-teal) !important; }
.text-secondary { color: var(--hz-text-secondary) !important; }

.lead { color: var(--hz-text-secondary); }

/* ── FullCalendar Dark Theme ──────────────── */
.fc {
  font-size: 0.9rem;
  --fc-border-color: var(--hz-border);
  --fc-page-bg-color: var(--hz-bg-card);
  --fc-neutral-bg-color: var(--hz-bg-surface);
  --fc-list-event-hover-bg-color: var(--hz-bg-card-hover);
  --fc-today-bg-color: rgba(59,130,246,0.08);
  --fc-highlight-color: rgba(59,130,246,0.15);
  --fc-non-business-color: rgba(13,17,23,0.3);
  --fc-now-indicator-color: var(--hz-red);
  --fc-event-border-color: transparent;
}
.fc .fc-toolbar-title {
  font-size: 1.2rem;
  color: var(--hz-text);
}
.fc .fc-button {
  background-color: var(--hz-bg-surface);
  border-color: var(--hz-border);
  color: var(--hz-text-secondary);
}
.fc .fc-button:hover {
  background-color: var(--hz-bg-card-hover);
  border-color: var(--hz-text-muted);
  color: var(--hz-text);
}
.fc .fc-button-active,
.fc .fc-button:active {
  background-color: var(--hz-blue) !important;
  border-color: var(--hz-blue) !important;
  color: #fff !important;
}
.fc .fc-button:disabled {
  background-color: var(--hz-bg-surface);
  border-color: var(--hz-border);
  color: var(--hz-text-muted);
}
.fc .fc-event {
  cursor: pointer;
  border-radius: 4px;
  padding: 2px 4px;
  border: none;
}
.fc .fc-timegrid-slot {
  height: 2.5em;
}
.fc .fc-timegrid-slot-label { color: var(--hz-text-muted); }
.fc .fc-col-header-cell {
  background-color: var(--hz-bg-surface);
}
.fc .fc-col-header-cell-cushion {
  font-weight: 600;
  color: var(--hz-text-secondary);
  text-decoration: none;
}
.fc .fc-col-header-cell-cushion:hover {
  color: var(--hz-blue);
}
.fc .fc-timegrid-divider {
  background: var(--hz-border);
  padding: 0;
}

/* Timegrid body cells - force dark background */
.fc .fc-timegrid-col {
  background-color: var(--hz-bg-card);
}
.fc .fc-timegrid-col.fc-day-today {
  background-color: rgba(59,130,246,0.06) !important;
}

/* Day grid (month view) */
.fc .fc-daygrid-day {
  background-color: var(--hz-bg-card);
}
.fc .fc-daygrid-day.fc-day-today {
  background-color: rgba(59,130,246,0.08) !important;
}
.fc .fc-daygrid-day-number {
  color: var(--hz-text-secondary);
  text-decoration: none;
}
.fc .fc-daygrid-day-number:hover {
  color: var(--hz-blue);
}
.fc .fc-daygrid-day-top { color: var(--hz-text-muted); }

/* Axis / gutter */
.fc .fc-timegrid-axis {
  background-color: var(--hz-bg-surface);
}

/* Now indicator */
.fc .fc-timegrid-now-indicator-line {
  border-color: var(--hz-red);
}
.fc .fc-timegrid-now-indicator-arrow {
  border-top-color: var(--hz-red);
}

.fc .fc-highlight { background: rgba(59,130,246,0.15); }
.fc .fc-more-link { color: var(--hz-blue); }

/* Popover */
.fc .fc-popover {
  background-color: var(--hz-bg-surface);
  border-color: var(--hz-border);
}
.fc .fc-popover-header {
  background-color: var(--hz-bg-card-hover);
  color: var(--hz-text);
}

/* Slot lane background (the actual grid area behind events) */
.fc .fc-timegrid-slot-lane {
  background-color: var(--hz-bg-card) !important;
}
.fc .fc-timegrid-bg-harness {
  background-color: transparent;
}

/* Override any remaining white from FC theme */
.fc-theme-standard td,
.fc-theme-standard th,
.fc-theme-standard .fc-scrollgrid {
  border-color: var(--hz-border);
}
.fc-theme-standard .fc-scrollgrid-section > td {
  border-color: var(--hz-border);
}

/* Nuclear: force dark on every FC view container and cell */
.fc .fc-view-harness,
.fc .fc-scrollgrid-section-body table,
.fc .fc-scrollgrid-section-header table {
  background-color: var(--hz-bg-card);
}
.fc .fc-timegrid-slots table {
  background-color: var(--hz-bg-card);
}
.fc .fc-day-today .fc-timegrid-col-frame {
  background-color: rgba(59,130,246,0.06);
}

/* ── Resource filter sidebar ──────────────── */
#resource-filters .form-check {
  padding-left: 1.8em;
}
#resource-filters .badge {
  display: inline-block;
  width: 12px;
  height: 12px;
  border-radius: 3px;
  vertical-align: middle;
}

/* ── Login/register cards ─────────────────── */
.card-title i {
  font-size: 2rem;
}

/* ── Responsive calendar ──────────────────── */
@media (max-width: 768px) {
  .fc .fc-toolbar {
    flex-direction: column;
    gap: 0.5rem;
  }
  .fc .fc-toolbar-title {
    font-size: 1rem;
  }
}

/* ── Selection states ─────────────────────── */
::selection {
  background-color: rgba(59,130,246,0.3);
  color: #fff;
}

/* ── Scrollbar (webkit) ───────────────────── */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--hz-bg); }
::-webkit-scrollbar-thumb { background: var(--hz-border); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--hz-text-muted); }