/* ==========================================================================
   LIBREBOOKING — CORPORATE NAVY THEME OVERRIDES
   Author: UI/UX pass
   HOW TO USE:
     1) Load this file AFTER librebooking.css and bootstrap.
     2) Edit SECTION 01 for quick rebrand.
     3) Add tiny tweaks in SECTION 99 if needed.
   ========================================================================== */


/* ========================================================================== 
   01. TOKENS (COLORS, RADIUS, SHADOWS, TYPOGRAPHY)
   ========================================================================== */
:root {
  /* Brand palette */
  --brand-primary: #171C32;     /* Corporate Navy — main brand color */
  --brand-on-primary: #ffffff;  /* Text/icons on brand surfaces */
  --brand-primary-600: #0F1426; /* Darker navy for hover/active */
  --brand-primary-300: #2A3355; /* Lighter navy accent */

  /* Link palette */
  --link: #1E3A8A;
  --link-hover: #0F172A;

  /* Accent palette */
  --accent-1: #EF7D17;
  --accent-2: #00B4DA;
  --accent-3: #74C9DF;

  /* Neutrals */
  --ink: #171C32;
  --ink-2: #35354B;
  --muted: #6b7280;
  --border: #e5e7eb;
  --surface: #ffffff;
  --surface-2: #f6f7fb;
  --page-bg: #f8fafc;

  /* Tables */
  --thead-bg: #E8EAF3;
  --thead-fg: #0f172a;

  /* States */
  --success: #16a34a;
  --info: #2563eb;
  --warning: #eab308;
  --danger: #ef4444;

  /* Focus ring */
  --focus: #2563eb;

  /* Shape & elevation */
  --radius-sm: 6px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --shadow-1: 0 1px 2px rgba(0,0,0,.06);
  --shadow-2: 0 6px 24px rgba(0,0,0,.08);
}


/* ========================================================================== 
   02. BASE / RESET
   ========================================================================== */
html, body { background: var(--page-bg); color: var(--ink); }
body { font-family: system-ui, -apple-system, "Segoe UI", Inter, Roboto, Arial, sans-serif; }
a, a:link, a:visited {
  color: var(--link) !important;
  text-decoration: none;
}
a:hover, a:focus {
  color: var(--link-hover) !important;
  text-decoration: underline;
}
:focus {
  outline: 2px solid var(--focus);
  outline-offset: 2px;
}


/* ========================================================================== 
   03. NAVBAR / HEADER BAR
   ========================================================================== */
.navbar, nav.navbar, #header, .topbar {
  background: var(--brand-primary) !important;
  color: var(--brand-on-primary) !important;
  border-bottom: 1px solid rgba(0,0,0,0);
  box-shadow: var(--shadow-1);
}
.navbar .navbar-brand,
.navbar .nav-link,
.navbar a {
  color: var(--brand-on-primary) !important;
}
.navbar .nav-link:hover,
.navbar a:hover {
  color: #e6e8f2 !important;
}


/* ========================================================================== 
   04. NAVBAR DROPDOWNS
   ========================================================================== */
.navbar .dropdown-menu,
.navbar-nav .dropdown-menu,
.dropdown-menu[role="menu"] {
  background-color: #ffffff !important;
  border: 1px solid rgba(23,28,50,0.15) !important;
}
.navbar .dropdown-menu .dropdown-item,
.navbar .dropdown-menu a,
.navbar .dropdown-menu a:link,
.navbar .dropdown-menu a:visited {
  color: var(--brand-primary) !important;
  background: #ffffff !important;
  text-decoration: none !important;
}
.navbar .dropdown-menu .dropdown-item:hover,
.navbar .dropdown-menu .dropdown-item:focus,
.navbar .dropdown-menu .dropdown-item:active,
.navbar .dropdown-menu .dropdown-item.active {
  background-color: var(--brand-primary) !important;
  color: var(--brand-on-primary) !important;
}
.navbar .nav-item.show .nav-link,
.navbar .nav-item.open .nav-link {
  color: var(--brand-on-primary) !important;
}


/* ========================================================================== 
   05. DASHBOARD (PANELS / HEADER / LINKS)
   ========================================================================== */
.dashboard-header {
  background: var(--brand-primary) !important;
  color: var(--brand-on-primary) !important;
  border: 1px solid var(--brand-primary);
  border-radius: var(--radius-md);
  padding: .8rem 1rem;
  box-shadow: var(--shadow-2);
}
.dashboard-header .badge { background: var(--brand-primary); color: var(--brand-on-primary); }
.dashboard-contents a,
#page-dashboard a {
  color: var(--link) !important;
}
.dashboard-contents a:hover,
#page-dashboard a:hover {
  color: var(--link-hover) !important;
}


/* ========================================================================== 
   06. AVAILABILITY / RESOURCE LISTING
   ========================================================================== */
.availabilityDashboard .resourceName a {
  color: var(--link) !important;
}
.availabilityDashboard .resourceName a:hover {
  color: var(--link-hover) !important;
}


/* ========================================================================== 
   07. BUTTONS
   ========================================================================== */
.btn, button, input[type="button"], input[type="submit"] {
  border-radius: var(--radius-md);
  border: 1px solid transparent;
  font-weight: 600;
  box-shadow: var(--shadow-1);
}
.btn-primary,
a.btn-primary,
button.btn-primary,
input[type="submit"].btn-primary {
  background-color: var(--brand-primary) !important;
  border-color: var(--brand-primary) !important;
  color: var(--brand-on-primary) !important;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.show > .btn-primary.dropdown-toggle {
  background-color: var(--brand-primary-600) !important;
  border-color: var(--brand-primary-600) !important;
  color: var(--brand-on-primary) !important;
}
.btn-success, a.btn-success, button.btn-success {
  background-color: var(--brand-primary) !important;
  border-color: var(--brand-primary) !important;
  color: var(--brand-on-primary) !important;
}
.btn-success:hover, .btn-success:focus {
  background-color: var(--brand-primary-600) !important;
  border-color: var(--brand-primary-600) !important;
}
.btn-outline-primary, a.btn.btn-outline-primary {
  color: var(--brand-primary) !important;
  border-color: var(--brand-primary) !important;
  background: transparent !important;
}
.btn-outline-primary:hover, .btn-outline-primary:focus {
  background: var(--brand-primary) !important;
  color: var(--brand-on-primary) !important;
}


/* ========================================================================== 
   08. TABLES
   ========================================================================== */
table thead th {
  background: var(--thead-bg);
  color: var(--thead-fg);
  border-bottom: 1px solid var(--border);
}
table tbody td {
  border-bottom: 1px solid var(--border);
}
table tbody tr:hover {
  background: #f2f4fb;
}
.table-striped > tbody > tr:nth-of-type(odd) {
  background-color: #f5f7fd;
}


/* ========================================================================== 
   09. FORMS
   ========================================================================== */
input[type="text"], input[type="email"], input[type="password"],
input[type="number"], select, textarea {
  border: 1px solid var(--border);
  border-radius: var(--radius-md);
  background: #fff;
  color: var(--ink);
  padding: .55rem .65rem;
}
input::placeholder, textarea::placeholder {
  color: var(--muted);
}
input:focus, select:focus, textarea:focus {
  outline: 2px solid var(--focus);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--focus) 25%, transparent);
  border-color: var(--focus);
}


/* ========================================================================== 
   10. RESERVATION GRID HEADERS
   ========================================================================== */
table.reservations td.resdate {
  background: var(--ink-2) !important;
  color: #fff !important;
}
table.reservations tr.today td.resdate {
  background: var(--brand-primary-600) !important;
  color: #fff !important;
}


/* ========================================================================== 
   11. CHIPS / TAGS
   ========================================================================== */
#page-reservation .reservation-group,
#page-reservation .reservation-resource {
  background: color-mix(in srgb, var(--brand-primary) 14%, white);
  color: var(--ink);
  border: 1px solid color-mix(in srgb, var(--brand-primary) 28%, white);
  border-radius: 999px;
}


/* ========================================================================== 
   12. ALERTS
   ========================================================================== */
.alert-success { background: color-mix(in srgb, var(--success) 12%, #fff); border: 1px solid var(--success); color: #065f46; }
.alert-info    { background: color-mix(in srgb, var(--info)    12%, #fff); border: 1px solid var(--info);    color: #0c4a6e; }
.alert-warning { background: color-mix(in srgb, var(--warning) 12%, #fff); border: 1px solid var(--warning); color: #7c3e00; }
.alert-danger  { background: color-mix(in srgb, var(--danger)  12%, #fff); border: 1px solid var(--danger);  color: #7f1d1d; }


/* ========================================================================== 
   13. FOOTER
   ========================================================================== */
#footer, .footer {
  background: var(--surface);
  color: var(--muted);
  border-top: 1px solid var(--border);
}
#footer a { color: var(--link) !important; }
#footer a:hover { color: var(--link-hover) !important; }


/* ========================================================================== 
   14. CALENDAR FIXES
   ========================================================================== */
.fc .fc-daygrid-day-number,
.fc .fc-col-header-cell-cushion {
  color: var(--ink) !important;
}
.fc-event, .fc-event-dot, .fc-daygrid-event {
  background-color: var(--brand-primary) !important;
  border-color: var(--brand-primary) !important;
  color: var(--brand-on-primary) !important;
  border-radius: var(--radius-sm);
  padding: 0 4px;
}
.fc-event:hover, .fc-event:focus {
  background-color: var(--brand-primary-600) !important;
  border-color: var(--brand-primary-600) !important;
  color: var(--brand-on-primary) !important;
}
.fc .fc-day-today {
  background-color: #fdf6ec !important;
  color: var(--ink) !important;
}


/* ========================================================================== 
   15. READABILITY FIXES (high contrast on dark surfaces)
   ========================================================================== */
.text-muted { color: var(--muted) !important; }
.bg-primary, .bg-success, .bg-info, .bg-warning, .bg-danger,
.badge-primary, .badge-success, .badge-info, .badge-warning, .badge-danger {
  color: #ffffff !important;
}
.bg-primary a, .bg-success a, .bg-info a, .bg-warning a, .bg-danger a {
  color: #ffffff !important;
  text-decoration: underline;
}
.card, .modal-content, .dropdown-menu {
  background: var(--surface);
  color: var(--ink);
}


/* ========================================================================== 
   99. LAST-MILE TWEAKS
   ========================================================================== */
.dashboard-contents a.some-legacy-class {
  /* color: var(--link) !important; */
}
.plugin-scope .btn-success {
  /* background: var(--brand-primary) !important; */
}