/* ═══════════════════════════════════════════════════════════════
   HôtelCompare.tn — Filament Admin Theme
   Palette : Navy #0a2e4b · Teal #117992 · White #FFFFFF
   ═══════════════════════════════════════════════════════════════ */

/* ── CSS Variables ───────────────────────────────────────────── */
:root {
  --hc-navy:        #0a2e4b;
  --hc-navy-light:  #0d3a5e;
  --hc-navy-dark:   #071f33;
  --hc-teal:        #117992;
  --hc-teal-light:  #148daa;
  --hc-teal-dark:   #0d5f73;
  --hc-white:       #ffffff;
  --hc-bg:          #f0f4f8;
  --hc-border:      #e2e8f0;
  --hc-text-muted:  rgba(255,255,255,0.55);
  --hc-text-sub:    rgba(255,255,255,0.75);
}

/* ── Sidebar ─────────────────────────────────────────────────── */
.fi-sidebar {
  background-color: var(--hc-navy) !important;
  border-right: none !important;
}

/* Sidebar header / brand area */
.fi-sidebar-header {
  background-color: var(--hc-navy-dark) !important;
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
  padding: 1rem 1.25rem !important;
}

/* Brand logo text */
.fi-logo {
  color: var(--hc-white) !important;
  font-size: 1.1rem !important;
  font-weight: 800 !important;
  letter-spacing: -0.02em !important;
}

/* Nav group labels */
.fi-sidebar-group-label {
  color: var(--hc-text-muted) !important;
  font-size: 0.65rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  padding-left: 0.75rem !important;
}

/* Nav items */
.fi-sidebar-item-button {
  color: var(--hc-text-sub) !important;
  border-radius: 0.5rem !important;
  margin: 1px 0.5rem !important;
  transition: all 0.15s ease !important;
}
.fi-sidebar-item-button:hover {
  background-color: rgba(255,255,255,0.08) !important;
  color: var(--hc-white) !important;
}
/* Active nav item */
.fi-sidebar-item-button[aria-current="page"],
.fi-sidebar-item-button.fi-active {
  background-color: var(--hc-teal) !important;
  color: var(--hc-white) !important;
}
.fi-sidebar-item-button[aria-current="page"] svg,
.fi-sidebar-item-button.fi-active svg {
  color: var(--hc-white) !important;
}

/* Nav item icons */
.fi-sidebar-item-icon {
  color: var(--hc-text-sub) !important;
}

/* Nav item label */
.fi-sidebar-item-label {
  font-size: 0.875rem !important;
  font-weight: 500 !important;
}

/* Collapsible group chevron */
.fi-sidebar-group-collapse-button svg {
  color: var(--hc-text-muted) !important;
}

/* Sidebar footer (user widget) */
.fi-sidebar-footer {
  background-color: var(--hc-navy-dark) !important;
  border-top: 1px solid rgba(255,255,255,0.08) !important;
}

/* ── Topbar ──────────────────────────────────────────────────── */
.fi-topbar {
  background-color: var(--hc-white) !important;
  border-bottom: 1px solid var(--hc-border) !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.06) !important;
}

.fi-topbar-nav {
  background-color: var(--hc-white) !important;
}

/* Topbar breadcrumb */
.fi-breadcrumbs-item-label {
  color: #64748b !important;
  font-size: 0.8rem !important;
}
.fi-breadcrumbs-item:last-child .fi-breadcrumbs-item-label {
  color: var(--hc-navy) !important;
  font-weight: 600 !important;
}

/* ── Page background ─────────────────────────────────────────── */
.fi-body {
  background-color: var(--hc-bg) !important;
}
.fi-main {
  background-color: var(--hc-bg) !important;
}

/* ── Page header ─────────────────────────────────────────────── */
.fi-page-header {
  background-color: var(--hc-white) !important;
  border-bottom: 1px solid var(--hc-border) !important;
  padding: 1rem 1.5rem !important;
  margin-bottom: 1.5rem !important;
}
.fi-page-header-heading {
  color: var(--hc-navy) !important;
  font-weight: 800 !important;
  font-size: 1.25rem !important;
}
.fi-page-header-subheading {
  color: #64748b !important;
  font-size: 0.85rem !important;
}

/* ── Cards / Sections ────────────────────────────────────────── */
.fi-section,
.fi-card {
  background-color: var(--hc-white) !important;
  border: 1px solid var(--hc-border) !important;
  border-radius: 0.75rem !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04) !important;
}
.fi-section-header {
  border-bottom: 1px solid var(--hc-border) !important;
  padding: 0.875rem 1.25rem !important;
}
.fi-section-header-heading {
  color: var(--hc-navy) !important;
  font-weight: 700 !important;
  font-size: 0.9rem !important;
}

/* ── Tables ──────────────────────────────────────────────────── */
.fi-ta-table {
  border-radius: 0.75rem !important;
  overflow: hidden !important;
  border: 1px solid var(--hc-border) !important;
}
.fi-ta-header-cell {
  background-color: #f8fafc !important;
  color: var(--hc-navy) !important;
  font-size: 0.75rem !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
  border-bottom: 2px solid var(--hc-border) !important;
}
.fi-ta-row {
  border-bottom: 1px solid #f1f5f9 !important;
  transition: background-color 0.1s ease !important;
}
.fi-ta-row:hover {
  background-color: #f8fafc !important;
}
.fi-ta-cell {
  padding: 0.75rem 1rem !important;
  font-size: 0.875rem !important;
  color: #374151 !important;
}

/* Table search */
.fi-ta-search-field input {
  border-radius: 0.5rem !important;
  border-color: var(--hc-border) !important;
  font-size: 0.875rem !important;
}
.fi-ta-search-field input:focus {
  border-color: var(--hc-teal) !important;
  box-shadow: 0 0 0 3px rgba(17,121,146,0.12) !important;
}

/* ── Buttons ─────────────────────────────────────────────────── */
/* Primary button */
.fi-btn-color-primary {
  background-color: var(--hc-teal) !important;
  border-color: var(--hc-teal) !important;
  color: white !important;
}
.fi-btn-color-primary:hover {
  background-color: var(--hc-teal-light) !important;
  border-color: var(--hc-teal-light) !important;
}
/* Secondary/gray button */
.fi-btn-color-gray {
  border-color: var(--hc-border) !important;
  color: var(--hc-navy) !important;
}

/* ── Form fields ─────────────────────────────────────────────── */
.fi-input {
  border-radius: 0.5rem !important;
  border-color: var(--hc-border) !important;
  font-size: 0.875rem !important;
}
.fi-input:focus,
.fi-input-wrapper:focus-within {
  border-color: var(--hc-teal) !important;
  box-shadow: 0 0 0 3px rgba(17,121,146,0.12) !important;
}
.fi-fo-field-wrp-label {
  color: var(--hc-navy) !important;
  font-weight: 600 !important;
  font-size: 0.8rem !important;
}

/* ── Badges / Pills ──────────────────────────────────────────── */
.fi-badge-color-success {
  background-color: #dcfce7 !important;
  color: #166534 !important;
}
.fi-badge-color-danger {
  background-color: #fee2e2 !important;
  color: #991b1b !important;
}
.fi-badge-color-warning {
  background-color: #fef9c3 !important;
  color: #854d0e !important;
}
.fi-badge-color-info,
.fi-badge-color-primary {
  background-color: #e0f2fe !important;
  color: #075985 !important;
}

/* ── Stats / Widgets ─────────────────────────────────────────── */
.fi-wi-stats-overview-stat {
  background-color: var(--hc-white) !important;
  border: 1px solid var(--hc-border) !important;
  border-radius: 0.75rem !important;
  box-shadow: 0 1px 3px rgba(0,0,0,0.04) !important;
}
.fi-wi-stats-overview-stat-label {
  color: #64748b !important;
  font-size: 0.8rem !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
}
.fi-wi-stats-overview-stat-value {
  color: var(--hc-navy) !important;
  font-weight: 800 !important;
  font-size: 1.75rem !important;
}
.fi-wi-stats-overview-stat-description {
  color: #64748b !important;
  font-size: 0.8rem !important;
}

/* ── Tabs ────────────────────────────────────────────────────── */
.fi-tabs-tab {
  color: #64748b !important;
  font-size: 0.875rem !important;
  font-weight: 500 !important;
}
.fi-tabs-tab[aria-selected="true"],
.fi-tabs-tab.fi-active {
  color: var(--hc-teal) !important;
  border-bottom-color: var(--hc-teal) !important;
}

/* ── Notifications ───────────────────────────────────────────── */
.fi-no-notification {
  border-radius: 0.75rem !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.12) !important;
}

/* ── Toggle / Checkbox ───────────────────────────────────────── */
.fi-checkbox-input:checked {
  background-color: var(--hc-teal) !important;
  border-color: var(--hc-teal) !important;
}
.fi-toggle-input:checked {
  background-color: var(--hc-teal) !important;
}

/* ── Dashboard charts ────────────────────────────────────────── */
.fi-wi-chart {
  background-color: var(--hc-white) !important;
  border: 1px solid var(--hc-border) !important;
  border-radius: 0.75rem !important;
}

/* ── Scrollbar (webkit) ──────────────────────────────────────── */
.fi-sidebar ::-webkit-scrollbar {
  width: 4px;
}
.fi-sidebar ::-webkit-scrollbar-track {
  background: transparent;
}
.fi-sidebar ::-webkit-scrollbar-thumb {
  background: rgba(255,255,255,0.15);
  border-radius: 4px;
}
.fi-sidebar ::-webkit-scrollbar-thumb:hover {
  background: rgba(255,255,255,0.25);
}

/* ── Modal ───────────────────────────────────────────────────── */
.fi-modal-window {
  border-radius: 1rem !important;
  box-shadow: 0 20px 60px rgba(0,0,0,0.15) !important;
}
.fi-modal-header {
  background-color: var(--hc-navy) !important;
  border-radius: 1rem 1rem 0 0 !important;
  padding: 1rem 1.5rem !important;
}
.fi-modal-heading {
  color: var(--hc-white) !important;
  font-weight: 700 !important;
}
.fi-modal-close-btn {
  color: rgba(255,255,255,0.7) !important;
}

/* ── Dropdown ────────────────────────────────────────────────── */
.fi-dropdown-panel {
  border-radius: 0.75rem !important;
  border: 1px solid var(--hc-border) !important;
  box-shadow: 0 4px 16px rgba(0,0,0,0.1) !important;
}

/* ── Pagination ──────────────────────────────────────────────── */
.fi-pagination-item-btn[aria-current="page"] {
  background-color: var(--hc-teal) !important;
  border-color: var(--hc-teal) !important;
  color: var(--hc-white) !important;
}