body {
    background-color: #f8f9fa;
}

.login-card {
    width: 100%;
    max-width: 450px;
    border-radius: 1rem;
    box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.1);
}

.navbar {
    box-shadow: 0 0.125rem 0.25rem rgba(0,0,0,0.075);
}

/* Ensure tables are scrollable on small screens */
.table-responsive { overflow-x: auto; }

/* Prevent text overflow */
.text-truncate-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Minimum tap targets for buttons and links styled as buttons */
.btn { min-height: 44px; }
.btn-icon { min-height: 44px; min-width: 44px; display:inline-flex; align-items:center; justify-content:center; }

/* Utility for equal-height cards if needed */
.card h5.card-title { font-size: 1rem; }

/* Mobile tweaks for dashboard cards */
@media (max-width: 576px) {
  .kpi-card { min-height: 96px !important; }
  .kpi-card .card-body { padding: 0.75rem !important; }
  .journey-card { min-height: 90px !important; }
  .btn { min-height: 40px; font-size: 0.95rem; }
  /* Force KPI grid to 2 per row on small screens */
  .col-md-3.col-sm-6 { flex: 0 0 50%; max-width: 50%; }
  /* Header content wraps neatly */
  .content-header .d-flex { flex-wrap: wrap; }
  .content-header .search-container form { width: 100%; }
  .content-header .search-container input { min-width: 0; }
  .container-fluid, .main-content { padding: 0.5rem !important; }
  /* Inline filter bars wrap */
  .filters, .filters .d-flex { flex-wrap: wrap; gap: 0.5rem; }

  /* Inside pages: prevent horizontal overflow */
  .main-content, .container-fluid, .card, .card-body { overflow-x: hidden; }

  /* Action buttons (Follow-up, Quote, Report, Admission, Back) in view page */
  .page-actions, .btn-toolbar, .btn-group { flex-wrap: wrap; gap: 0.5rem; }
  .page-actions .btn, .btn-toolbar .btn, .btn-group .btn { flex: 1 1 48%; max-width: 48%; }

  /* Tab bar wraps on small screens */
  .nav-tabs { flex-wrap: wrap; gap: 0.25rem; }
  .nav-tabs .nav-link { padding: 0.4rem 0.6rem; font-size: 0.9rem; }

  /* Stat tiles compact */
  .stat, .stat .card-body { padding: 0.5rem !important; }
  .stat h5, .stat h6 { font-size: 0.95rem; }

  /* Generic 2-col and 3-col mobile grids (opt-in via class) */
  .grid-2-mobile > * { flex: 0 0 48%; max-width: 48%; }
  .grid-3-mobile > * { flex: 0 0 31%; max-width: 31%; }
}

/* Make patient tables comfortable on small screens */
@media (max-width: 576px) {
  table.table td, table.table th { white-space: nowrap; font-size: 0.9rem; }
}