/* ── Admin sidebar layout ───────────────────────────────────────────── */
#layoutSidenav {
  display: flex;
}

#layoutSidenav_nav {
  flex-basis: 225px;
  flex-shrink: 0;
  transition: transform .15s ease-in-out;
  z-index: 1038;
  transform: translateX(0);
}

#layoutSidenav_content {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-width: 0;
  flex-grow: 1;
  min-height: calc(100vh - 56px);
}

.sb-nav-fixed .sb-topnav {
  position: sticky;
  top: 0;
  z-index: 1039;
}
.sb-nav-fixed #layoutSidenav #layoutSidenav_nav {
  width: 225px;
  height: calc(100vh - 56px);
  z-index: 1038;
  overflow-y: auto;
  position: fixed;
  top: 56px;
  left: 0;
}
.sb-nav-fixed #layoutSidenav #layoutSidenav_content {
  padding-left: 225px;
  top: 56px;
}

/* Sidebar nav */
.sb-sidenav {
  display: flex;
  flex-direction: column;
  height: 100%;
  flex-wrap: nowrap;
}
.sb-sidenav .sb-sidenav-menu { flex-grow: 1; }
.sb-sidenav .sb-sidenav-menu .nav { flex-direction: column; flex-wrap: nowrap; }
.sb-sidenav .sb-sidenav-menu .nav .sb-sidenav-menu-heading {
  padding: .75rem 1rem .25rem;
  font-size: .75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: rgba(255,255,255,.4);
}
.sb-sidenav-dark { background: #1a202c; }
.sb-sidenav-dark .sb-sidenav-footer { background: #111827; }
.sb-sidenav .nav-link {
  display: flex;
  align-items: center;
  padding: .6rem 1rem;
  font-size: .875rem;
  color: rgba(255,255,255,.6);
  border-left: 3px solid transparent;
}
.sb-sidenav .nav-link:hover { color: #fff; background: rgba(255,255,255,.05); }
.sb-sidenav .nav-link.active { color: #fff; border-left-color: #4299e1; background: rgba(66,153,225,.15); }
.sb-sidenav .sb-nav-link-icon { width: 1.5rem; text-align: center; font-size: 1rem; }

/* ── General styles ─────────────────────────────────────────────────── */
body { font-size: .9rem; }

.customer-layout { background: #f8fafc; }

.stat-card {
  border: none;
  border-radius: 12px;
  transition: transform .15s ease, box-shadow .15s ease;
}
.stat-card:hover { transform: translateY(-2px); box-shadow: 0 4px 20px rgba(0,0,0,.1); }

.stat-card .stat-icon {
  width: 52px;
  height: 52px;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
}

/* Booking status badges */
.badge-pending  { background: #fef3c7; color: #92400e; }
.badge-confirmed{ background: #d1fae5; color: #065f46; }
.badge-cancelled{ background: #fee2e2; color: #991b1b; }
.badge-no-show  { background: #e5e7eb; color: #374151; }
.badge-no-show48{ background: #fed7aa; color: #92400e; }
.badge-no-show24{ background: #fecaca; color: #991b1b; }

.badge-draft    { background: #e5e7eb; color: #374151; }
.badge-sent     { background: #dbeafe; color: #1e40af; }
.badge-paid     { background: #d1fae5; color: #065f46; }
.badge-overdue  { background: #fee2e2; color: #991b1b; }
.badge-void     { background: #e5e7eb; color: #6b7280; }

/* Slot picker */
.slot-btn {
  border: 2px solid #e2e8f0;
  border-radius: 8px;
  padding: .4rem .8rem;
  font-size: .8rem;
  cursor: pointer;
  background: white;
  transition: all .15s;
  user-select: none;
}
.slot-btn:hover { border-color: #3b82f6; background: #eff6ff; }
.slot-btn.selected { border-color: #2563eb; background: #2563eb; color: white; }
.slot-btn.unavailable { border-color: #e5e7eb; background: #f9fafb; color: #9ca3af; cursor: not-allowed; }

/* Page headings */
.page-header { margin-bottom: 1.5rem; }
.page-header h1 { font-size: 1.5rem; font-weight: 700; margin: 0; }

/* Table improvements */
.table th { font-size: .8rem; text-transform: uppercase; letter-spacing: .05em; color: #6b7280; font-weight: 600; }
.table td { vertical-align: middle; }
.table-hover tbody tr:hover { background: #f8fafc; }

/* Card improvements */
.card { border: 1px solid #e2e8f0; border-radius: 10px; }
.card-header { background: white; border-bottom: 1px solid #e2e8f0; font-weight: 600; }

/* Form improvements */
.form-label { font-weight: 500; font-size: .875rem; }

/* Pagination */
.pagination { margin: 0; }
