/* patients.css — Styles for patient list, cards, modals, forms, tables */
:root{
  --primary: #2563eb;
  --primary-600: #1e40af;
  --accent: linear-gradient(135deg,#667eea 0%,#764ba2 100%);
  --muted: #6b7280;
  --bg: #f6f7fb;
  --card-bg: #ffffff;
  --radius: 8px;
  --shadow-sm: 0 4px 12px rgba(2,6,23,0.08);
}

/* Page wrapper */
.patients-page {
  background: var(--bg);
  min-height: 100vh;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

/* Header / Stats */
.patients-header{padding:1.25rem 1.5rem 0;}
.patients-title{font-size:2.25rem;font-weight:700;color:var(--primary-600);margin:0 0 .25rem}
.patients-sub{color:var(--muted);margin:0 0 1rem}

.stats-card{background:var(--card-bg);border-radius:var(--radius);box-shadow:var(--shadow-sm);overflow:hidden;padding:1rem;margin-bottom:1rem}
.patients-stats{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.patients-stats .count{font-size:2rem;font-weight:700;color:#fff;background:linear-gradient(90deg,#6d28d9,#7c3aed);padding:1rem 1.5rem;border-radius:8px;text-align:center;min-width:110px}
.patients-stats .label{color:var(--muted)}

/* Card */
.card { background: var(--card-bg); border-radius: var(--radius); box-shadow: var(--shadow-sm); padding: 1rem; }

/* Buttons */
.btn { display:inline-block;padding:.55rem .9rem;border-radius:6px;border:0;cursor:pointer;font-weight:600 }
.btn-primary{background:var(--primary);color:#fff}
.btn-secondary{background:#6b7280;color:#fff}
.btn-danger{background:#ef4444;color:#fff}
.btn-sm{padding:.35rem .6rem;font-size:.9rem}

/* Table */
.patients-table{width:100%;border-collapse:collapse;background:transparent}
.patients-table th, .patients-table td{padding:.85rem 1rem;text-align:left;border-bottom:1px solid #eef2f6}
.patients-table thead th{background:#fbfdff;color:#334155;font-weight:700}
.patients-table tbody tr:hover{background:#f8fafc}
.patients-table td.actions{white-space:nowrap}

/* Bulk actions */
.bulk-actions{display:flex;gap:.5rem;align-items:center;margin-top:.75rem}

/* Forms */
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.75rem}
.form-group label{font-size:.9rem;color:var(--muted);margin-bottom:.25rem}
.form-group label .required{color:#ef4444;margin-left:6px;font-weight:700}
.form-group input[type="text"],.form-group input[type="email"],.form-group input[type="date"],.form-group select,.form-group textarea{width:100%;padding:.5rem;border:1px solid #e6e9ef;border-radius:6px}

/* Modals */
.modal{display:none;position:fixed;inset:0;z-index:12000;background:rgba(2,6,23,0.5);align-items:center;justify-content:center}
.modal.open{display:flex}
.modal.open .modal-content{animation:modalShow .22s cubic-bezier(.2,.9,.26,1);}

@keyframes modalShow{
  from { opacity: 0; transform: translateY(-6px) scale(.98); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
.modal-content{width:92%;max-width:920px;background:var(--card-bg);border-radius:8px;overflow:hidden;box-shadow:0 20px 50px rgba(2,6,23,0.2)}
.modal-header{display:flex;align-items:center;justify-content:space-between;padding:1rem 1.25rem;border-bottom:1px solid #eef2f6}
.modal-body{padding:1rem 1.25rem}
.modal-footer{padding:1rem 1.25rem;border-top:1px solid #eef2f6;display:flex;justify-content:flex-end;gap:.5rem}
.modal-close{background:none;border:0;font-size:1.4rem;cursor:pointer;color:var(--muted)}

/* Responsive */
@media (max-width: 900px){
  .patients-stats{flex-direction:column;align-items:flex-start}
  .patients-title{font-size:1.6rem}
  .modal-content{width:96%}
}

/* Utilities */
.text-success{color:#16a34a}
.text-error{color:#dc2626}
.center{text-align:center}
.small{font-size:.85rem;color:var(--muted)}

/* Sidebar-safe: ensure overlay covers sidebar */
.dashboard-container .modal{z-index:13000}

/* Tweak for sidebar main-content spacing if needed */
.main-content .card{margin-bottom:1.5rem}

/* Scroll tweaks for modal content */
.modal-content::-webkit-scrollbar{height:8px;width:8px}
.modal-content::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:8px}

/* Form validation visuals */
.input-error { border-color: #ef4444 !important; box-shadow: 0 0 0 3px rgba(239,68,68,0.06); }
.error-message { color: #b91c1c; background: #fff5f5; border: 1px solid #fecaca; padding: 0.5rem; border-radius:6px; margin-bottom:0.75rem; font-size:0.95rem }