/* RehabFlow EMR Styles - Epic/NextGen inspired */
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; background:#f0f2f5; color:#1a1a2e; font-size:13px; }
:root { --primary:#1b4965; --primary-light:#2d6a8f; --accent:#62b6cb; --success:#2d6a4f; --warning:#e9c46a; --danger:#e76f51; --sidebar-bg:#0d1b2a; --sidebar-text:#a8dadc; --header-bg:#1b4965; --card-bg:#ffffff; --border:#d4d4d8; --text-muted:#6b7280; --hover-bg:#f1f5f9; }
/* Login */
.login-page { display:flex; height:100vh; background:linear-gradient(135deg,#0d1b2a 0%,#1b4965 50%,#2d6a8f 100%); align-items:center; justify-content:center; }
.login-box { background:#fff; border-radius:12px; padding:40px; width:420px; box-shadow:0 20px 60px rgba(0,0,0,0.3); }
.login-box h1 { color:var(--primary); font-size:28px; margin-bottom:4px; }
.login-box .subtitle { color:var(--text-muted); margin-bottom:24px; font-size:13px; }
.login-box label { display:block; font-weight:600; margin-bottom:4px; color:#374151; font-size:12px; text-transform:uppercase; letter-spacing:0.5px; }
.login-box input { width:100%; padding:10px 12px; border:1px solid var(--border); border-radius:6px; margin-bottom:16px; font-size:14px; }
.login-box input:focus { outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(98,182,203,0.2); }
.login-box button { width:100%; padding:12px; background:var(--primary); color:#fff; border:none; border-radius:6px; font-size:15px; font-weight:600; cursor:pointer; }
.login-box button:hover { background:var(--primary-light); }
.login-role { display:flex; gap:8px; margin-bottom:20px; }
.login-role button { flex:1; padding:8px; font-size:12px; border:2px solid var(--border); background:#fff; color:#374151; border-radius:6px; cursor:pointer; font-weight:600; }
.login-role button.active { border-color:var(--primary); background:var(--primary); color:#fff; }
/* Layout */
.app-layout { display:flex; height:100vh; }
.sidebar { width:220px; background:var(--sidebar-bg); color:var(--sidebar-text); display:flex; flex-direction:column; flex-shrink:0; }
.sidebar-logo { padding:16px 20px; font-size:18px; font-weight:700; color:#fff; border-bottom:1px solid rgba(255,255,255,0.1); }
.sidebar-logo span { color:var(--accent); }
.sidebar-nav { flex:1; padding:12px 0; overflow-y:auto; }
.sidebar-item { display:flex; align-items:center; gap:10px; padding:10px 20px; cursor:pointer; color:var(--sidebar-text); font-size:13px; transition:all 0.15s; border-left:3px solid transparent; }
.sidebar-item:hover { background:rgba(255,255,255,0.05); color:#fff; }
.sidebar-item.active { background:rgba(255,255,255,0.1); color:#fff; border-left-color:var(--accent); }
.sidebar-item .icon { width:20px; text-align:center; font-size:15px; }
.sidebar-user { padding:16px 20px; border-top:1px solid rgba(255,255,255,0.1); font-size:12px; }
.sidebar-user .name { color:#fff; font-weight:600; }
.sidebar-user .role { color:var(--sidebar-text); font-size:11px; }
/* Main content */
.main-content { flex:1; display:flex; flex-direction:column; overflow:hidden; }
.top-bar { background:var(--header-bg); color:#fff; padding:0 24px; height:48px; display:flex; align-items:center; justify-content:space-between; flex-shrink:0; }
.top-bar h2 { font-size:16px; font-weight:600; }
.top-bar-actions { display:flex; gap:12px; align-items:center; }
.top-bar-actions button { background:rgba(255,255,255,0.15); border:none; color:#fff; padding:6px 14px; border-radius:4px; cursor:pointer; font-size:12px; }
.top-bar-actions button:hover { background:rgba(255,255,255,0.25); }
.content-area { flex:1; overflow-y:auto; padding:20px 24px; }
/* Cards */
.card { background:var(--card-bg); border-radius:8px; border:1px solid var(--border); margin-bottom:16px; }
.card-header { padding:12px 16px; border-bottom:1px solid var(--border); font-weight:600; font-size:14px; display:flex; justify-content:space-between; align-items:center; background:#f8fafc; border-radius:8px 8px 0 0; }
.card-body { padding:16px; }
/* Tables */
.data-table { width:100%; border-collapse:collapse; }
.data-table th { background:#f1f5f9; padding:8px 12px; text-align:left; font-size:11px; text-transform:uppercase; letter-spacing:0.5px; color:var(--text-muted); border-bottom:2px solid var(--border); font-weight:600; }
.data-table td { padding:8px 12px; border-bottom:1px solid #f1f5f9; }
.data-table tr:hover { background:var(--hover-bg); cursor:pointer; }
.data-table tr.selected { background:#e0f2fe; }
/* Badges */
.badge { display:inline-block; padding:2px 8px; border-radius:10px; font-size:11px; font-weight:600; }
.badge-green { background:#d1fae5; color:#065f46; }
.badge-blue { background:#dbeafe; color:#1e40af; }
.badge-yellow { background:#fef3c7; color:#92400e; }
.badge-red { background:#fee2e2; color:#991b1b; }
.badge-gray { background:#f3f4f6; color:#4b5563; }
.badge-purple { background:#ede9fe; color:#5b21b6; }
/* Buttons */
.btn { padding:7px 16px; border:none; border-radius:5px; cursor:pointer; font-size:12px; font-weight:600; display:inline-flex; align-items:center; gap:6px; }
.btn-primary { background:var(--primary); color:#fff; }
.btn-primary:hover { background:var(--primary-light); }
.btn-success { background:var(--success); color:#fff; }
.btn-warning { background:var(--warning); color:#1a1a2e; }
.btn-danger { background:var(--danger); color:#fff; }
.btn-outline { background:#fff; border:1px solid var(--border); color:#374151; }
.btn-outline:hover { background:#f9fafb; }
.btn-sm { padding:4px 10px; font-size:11px; }
.btn-lg { padding:10px 24px; font-size:14px; }
/* Forms */
.form-group { margin-bottom:12px; }
.form-group label { display:block; font-weight:600; margin-bottom:3px; font-size:11px; text-transform:uppercase; letter-spacing:0.3px; color:#4b5563; }
.form-group input, .form-group select, .form-group textarea { width:100%; padding:7px 10px; border:1px solid var(--border); border-radius:4px; font-size:13px; font-family:inherit; }
.form-group input:focus, .form-group select:focus, .form-group textarea:focus { outline:none; border-color:var(--accent); box-shadow:0 0 0 2px rgba(98,182,203,0.2); }
.form-group textarea { resize:vertical; min-height:60px; }
.form-row { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:12px; }
.form-row-3 { grid-template-columns:1fr 1fr 1fr; }
.form-row-4 { grid-template-columns:1fr 1fr 1fr 1fr; }
.form-row-2 { grid-template-columns:1fr 1fr; }
/* Tabs */
.tabs { display:flex; border-bottom:2px solid var(--border); margin-bottom:16px; gap:0; }
.tab { padding:8px 20px; cursor:pointer; font-size:13px; font-weight:500; color:var(--text-muted); border-bottom:2px solid transparent; margin-bottom:-2px; transition:all 0.15s; }
.tab:hover { color:var(--primary); }
.tab.active { color:var(--primary); border-bottom-color:var(--primary); font-weight:600; }
/* Dashboard */
.dash-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-bottom:20px; }
.stat-card { background:#fff; border-radius:8px; padding:16px 20px; border:1px solid var(--border); }
.stat-card .stat-value { font-size:28px; font-weight:700; color:var(--primary); }
.stat-card .stat-label { font-size:12px; color:var(--text-muted); margin-top:2px; }
.stat-card .stat-icon { font-size:24px; float:right; opacity:0.3; }
/* Schedule */
.schedule-grid { display:grid; grid-template-columns:80px repeat(auto-fill,minmax(180px,1fr)); border:1px solid var(--border); border-radius:8px; overflow:hidden; }
.schedule-time { background:#f8fafc; padding:8px; font-size:11px; color:var(--text-muted); border-bottom:1px solid #eee; display:flex; align-items:flex-start; justify-content:center; font-weight:600; }
.schedule-slot { border-bottom:1px solid #f1f5f9; border-left:1px solid #f1f5f9; padding:4px; min-height:48px; }
.schedule-appt { padding:4px 8px; border-radius:4px; font-size:11px; margin:2px 0; cursor:pointer; border-left:3px solid; }
.schedule-appt.eval { background:#dbeafe; border-left-color:#3b82f6; color:#1e40af; }
.schedule-appt.followup { background:#d1fae5; border-left-color:#10b981; color:#065f46; }
.schedule-appt.discharge { background:#fef3c7; border-left-color:#f59e0b; color:#92400e; }
.schedule-appt .appt-name { font-weight:600; }
.schedule-appt .appt-type { font-size:10px; opacity:0.8; }
/* Chart tabs */
.chart-tabs { display:flex; background:#f1f5f9; border-radius:8px 8px 0 0; padding:0; overflow-x:auto; }
.chart-tab { padding:10px 20px; cursor:pointer; font-size:12px; font-weight:500; color:var(--text-muted); border-bottom:2px solid transparent; white-space:nowrap; }
.chart-tab:hover { color:var(--primary); background:rgba(27,73,101,0.05); }
.chart-tab.active { color:var(--primary); background:#fff; font-weight:600; border-bottom-color:var(--primary); }
/* Note status */
.note-status { display:flex; align-items:center; gap:8px; padding:8px 12px; border-radius:6px; margin-bottom:12px; font-size:12px; font-weight:600; }
.note-status.draft { background:#fef3c7; color:#92400e; }
.note-status.signed { background:#d1fae5; color:#065f46; }
.note-status.locked { background:#e0e7ff; color:#3730a3; }
.note-status.cosign-needed { background:#fee2e2; color:#991b1b; }
/* Modal */
.modal-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.5); display:flex; align-items:center; justify-content:center; z-index:1000; }
.modal { background:#fff; border-radius:10px; width:90%; max-width:700px; max-height:85vh; overflow-y:auto; box-shadow:0 20px 60px rgba(0,0,0,0.3); }
.modal-header { padding:16px 20px; border-bottom:1px solid var(--border); display:flex; justify-content:space-between; align-items:center; background:#f8fafc; border-radius:10px 10px 0 0; }
.modal-header h3 { font-size:16px; }
.modal-body { padding:20px; }
.modal-footer { padding:12px 20px; border-top:1px solid var(--border); display:flex; justify-content:flex-end; gap:8px; }
.close-btn { background:none; border:none; font-size:20px; cursor:pointer; color:#6b7280; padding:4px 8px; }
/* ROM/MMT table */
.assessment-table { width:100%; border-collapse:collapse; font-size:12px; }
.assessment-table th, .assessment-table td { border:1px solid var(--border); padding:4px 8px; text-align:center; }
.assessment-table th { background:#f1f5f9; font-size:10px; text-transform:uppercase; }
.assessment-table input { width:50px; padding:2px 4px; border:1px solid #ddd; border-radius:3px; text-align:center; font-size:12px; }
/* Search */
.search-box { position:relative; }
.search-box input { padding-left:32px; }
.search-box::before { content:'🔍'; position:absolute; left:10px; top:50%; transform:translateY(-50%); font-size:13px; }
/* Signature area */
.signature-area { border:2px dashed var(--border); border-radius:8px; padding:20px; text-align:center; margin:12px 0; }
.signature-area.signed { border-color:var(--success); background:#f0fdf4; }
.signature-area .sig-text { font-family:'Brush Script MT',cursive; font-size:24px; color:var(--primary); }
/* Scrollbar */
::-webkit-scrollbar { width:8px; }
::-webkit-scrollbar-track { background:#f1f1f1; }
::-webkit-scrollbar-thumb { background:#c4c4c4; border-radius:4px; }
::-webkit-scrollbar-thumb:hover { background:#a8a8a8; }
/* Animations */
@keyframes fadeIn { from{opacity:0;transform:translateY(10px)} to{opacity:1;transform:translateY(0)} }
.fade-in { animation:fadeIn 0.2s ease-out; }
/* Alert */
.alert { padding:10px 16px; border-radius:6px; margin-bottom:12px; font-size:13px; display:flex; align-items:center; gap:8px; }
.alert-info { background:#dbeafe; color:#1e40af; border:1px solid #93c5fd; }
.alert-warning { background:#fef3c7; color:#92400e; border:1px solid #fcd34d; }
.alert-success { background:#d1fae5; color:#065f46; border:1px solid #6ee7b7; }
.alert-danger { background:#fee2e2; color:#991b1b; border:1px solid #fca5a5; }
/* CPT/ICD chips */
.code-chip { display:inline-flex; align-items:center; gap:4px; padding:3px 10px; background:#f1f5f9; border:1px solid var(--border); border-radius:12px; font-size:11px; margin:2px; }
.code-chip .code { font-weight:700; color:var(--primary); }
.code-chip .remove { cursor:pointer; color:#ef4444; font-weight:700; margin-left:4px; }
/* Print */
@media print { .sidebar,.top-bar { display:none; } .content-area { padding:0; } }