/* ── Reset & Variables ── */
*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
:root {
  /* ─ Brand ─ */
  --brand-primary: #1a365d;
  --brand-accent: #0ea5e9;
  --brand-accent-hover: #0284c7;
  --brand-gradient: linear-gradient(135deg, #1a365d 0%, #1e4a7a 50%, #0ea5e9 100%);

  /* ─ Surfaces ─ */
  --bg: #F7F9FC; --white: #FFF; --surface: #F0F4FA;
  --border: #E2E8F0; --border-hover: #CBD5E1;

  /* ─ Palette ─ */
  --blue-50: #EFF6FF; --blue-100: #DBEAFE; --blue-200: #BFDBFE;
  --blue-500: #3B82F6; --blue-600: #2563EB; --blue-700: #1D4ED8;
  --green-50: #F0FDF4; --green-100: #DCFCE7; --green-600: #16A34A;
  --teal-50: #F0FDFA; --teal-100: #CCFBF1; --teal-500: #14B8A6; --teal-600: #0D9488;
  --amber-50: #FFFBEB; --amber-100: #FEF3C7; --amber-500: #F59E0B; --amber-600: #D97706;
  --red-50: #FEF2F2; --red-100: #FEE2E2; --red-500: #EF4444; --red-600: #DC2626;
  --indigo-50: #EEF2FF; --indigo-500: #6366F1; --indigo-600: #4F46E5;

  /* ─ Text ─ */
  --text: #1E293B; --text-sec: #475569; --text-muted: #94A3B8;

  /* ─ Typography ─ */
  --font: 'Inter', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, monospace;

  /* ─ Elevation ─ */
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.04);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.06);
  --shadow-lg: 0 8px 24px rgba(0,0,0,0.08);
  --shadow-xl: 0 20px 40px rgba(0,0,0,0.1);
  --shadow-brand: 0 4px 14px rgba(14,165,233,0.2);

  /* ─ Shape ─ */
  --radius: 12px; --radius-sm: 8px; --radius-xs: 6px; --radius-pill: 9999px;

  /* ─ Motion ─ */
  --transition: 0.2s ease;
  --transition-fast: 0.12s ease;
  --transition-slow: 0.3s ease;
}
body { font-family: var(--font); background: var(--bg); color: var(--text); line-height: 1.6; -webkit-font-smoothing: antialiased; }
a { color: var(--brand-accent); text-decoration: none; }
a:hover { color: var(--brand-accent-hover); }

/* ── Animations ── */
@keyframes fadeInUp { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.6; } }
@keyframes slideInRight { from { opacity: 0; transform: translateX(16px); } to { opacity: 1; transform: translateX(0); } }
@keyframes shimmer { 0% { background-position: -200% 0; } 100% { background-position: 200% 0; } }
.animate-fade-in-up { animation: fadeInUp 0.3s ease both; }
.animate-fade-in { animation: fadeIn 0.2s ease both; }

/* ── Toast notifications ── */
.toast-container { position: fixed; bottom: 24px; right: 24px; z-index: 9999; display: flex; flex-direction: column; gap: 8px; pointer-events: none; }
.toast { pointer-events: auto; display: flex; align-items: center; gap: 10px; padding: 12px 20px; border-radius: var(--radius-sm); font-size: 0.875rem; font-weight: 500; color: #fff; box-shadow: var(--shadow-lg); animation: slideInRight 0.3s ease both; max-width: 360px; }
.toast-success { background: var(--green-600); }
.toast-info { background: var(--brand-accent); }
.toast-warning { background: var(--amber-600); }
.toast-error { background: var(--red-600); }
.toast-close { background: none; border: none; color: rgba(255,255,255,0.7); cursor: pointer; font-size: 1.1rem; padding: 0 0 0 8px; }
.toast-close:hover { color: #fff; }

/* ── Batch action bar ── */
.batch-bar {
  position: fixed; bottom: -60px; left: 50%; transform: translateX(-50%);
  background: var(--brand-primary); color: #fff; padding: 10px 20px;
  border-radius: var(--radius-pill); box-shadow: var(--shadow-xl);
  display: flex; align-items: center; gap: 12px; font-size: 0.875rem; font-weight: 500;
  z-index: 9998; transition: bottom 0.25s ease;
}
.batch-bar.visible { bottom: 24px; }
.batch-bar .btn-sm { padding: 5px 14px; font-size: 0.8rem; }

/* Patient checkboxes */
.patient-check {
  width: 16px; height: 16px; accent-color: var(--brand-accent); cursor: pointer;
  flex-shrink: 0; border-radius: 3px;
}
.kanban-card-enhanced { position: relative; }
.kanban-card-enhanced .patient-check {
  position: absolute; top: 8px; right: 8px; opacity: 0; transition: opacity 0.15s;
}
.kanban-card-enhanced:hover .patient-check,
.kanban-card-enhanced .patient-check:checked { opacity: 1; }
.kanban-card-enhanced .kce-link {
  display: block; color: inherit; text-decoration: none;
}

/* ── Skeleton loader ── */
.skeleton { background: linear-gradient(90deg, var(--surface) 25%, #e2e8f0 50%, var(--surface) 75%); background-size: 200% 100%; animation: shimmer 1.5s infinite; border-radius: var(--radius-xs); }
.skeleton-text { height: 14px; margin-bottom: 8px; width: 80%; }
.skeleton-title { height: 20px; margin-bottom: 12px; width: 50%; }
.skeleton-card { height: 80px; border-radius: var(--radius); }

/* ── Empty states ── */
.empty-state { text-align: center; padding: 60px 24px; }
.empty-state-icon { width: 64px; height: 64px; margin: 0 auto 16px; color: var(--text-muted); opacity: 0.5; }
.empty-state-title { font-size: 1.1rem; font-weight: 600; color: var(--text); margin-bottom: 6px; }
.empty-state-text { font-size: 0.875rem; color: var(--text-sec); margin-bottom: 20px; max-width: 360px; margin-left: auto; margin-right: auto; }

/* ── Auth (split layout — flagship) ── */
.auth-page { min-height: 100vh; display: flex; }
.auth-page .mobile-nav { display: none !important; }

/* ─ Hero (left — white with emblem) ─ */
.auth-hero {
  flex: 1; display: flex; flex-direction: column; justify-content: center; align-items: center;
  padding: 60px; color: var(--text-main); position: relative; overflow: hidden;
  background: #fff;
}
.auth-hero::before { display: none; }
.auth-hero::after { display: none; }
.auth-hero-emblem { animation: fadeInUp 0.6s ease both; text-align: center; margin-bottom: 12px; }
.auth-hero-emblem img { max-width: 200px; width: 40%; height: auto; }
.auth-hero-brand { text-align: center; margin-bottom: 36px; animation: fadeInUp 0.6s ease 0.1s both; }
.auth-hero-brand span { font-size: 2rem; font-weight: 700; letter-spacing: 3px; color: var(--brand-primary); text-transform: uppercase; }
.auth-hero-content { position: relative; z-index: 1; text-align: left; max-width: 480px; animation: fadeInUp 0.6s ease both; }
.auth-hero h1 { font-size: 2.2rem; font-weight: 700; line-height: 1.15; margin-bottom: 6px; letter-spacing: -0.5px; color: var(--brand-primary); }
.auth-hero h1 em { font-style: normal; color: var(--brand-accent); }
.auth-hero-sub { font-size: 1rem; opacity: 0.6; line-height: 1.5; margin-bottom: 28px; font-weight: 400; }

/* Feature grid 2×3 */
.auth-features { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 32px; }
.auth-feature {
  display: flex; align-items: flex-start; gap: 10px;
  padding: 10px 12px; border-radius: 8px;
  background: var(--bg); backdrop-filter: none;
  border: 1px solid var(--border);
  animation: fadeInUp 0.5s ease both;
  transition: background 0.2s, border-color 0.2s;
}
.auth-feature:hover { background: #f0f7ff; border-color: rgba(14,165,233,0.3); }
.auth-feature:nth-child(2) { animation-delay: 0.05s; }
.auth-feature:nth-child(3) { animation-delay: 0.10s; }
.auth-feature:nth-child(4) { animation-delay: 0.15s; }
.auth-feature:nth-child(5) { animation-delay: 0.20s; }
.auth-feature:nth-child(6) { animation-delay: 0.25s; }
.auth-feature:nth-child(7) { animation-delay: 0.30s; }
.auth-feature-icon {
  width: 32px; height: 32px; border-radius: 8px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
}
.auth-feature-icon svg { width: 16px; height: 16px; }
.auth-feature-icon.fi-docs   { background: rgba(14,165,233,0.18); color: #38bdf8; }
.auth-feature-icon.fi-surg   { background: rgba(239,68,68,0.18);  color: #f87171; }
.auth-feature-icon.fi-cons   { background: rgba(168,85,247,0.18); color: #c084fc; }
.auth-feature-icon.fi-ward   { background: rgba(34,197,94,0.18);  color: #4ade80; }
.auth-feature-icon.fi-alerts { background: rgba(251,146,60,0.18); color: #fb923c; }
.auth-feature-icon.fi-online { background: rgba(99,102,241,0.18); color: #a5b4fc; }
.auth-feature-icon.fi-amb    { background: rgba(20,184,166,0.18); color: #5eead4; }
.auth-feature-text { flex: 1; min-width: 0; }
.auth-feature-title { font-size: 0.78rem; font-weight: 600; margin-bottom: 1px; line-height: 1.2; color: var(--text-main); }
.auth-feature-desc { font-size: 0.68rem; color: var(--text-muted); line-height: 1.3; }
@media (max-width: 1100px) { .auth-features { grid-template-columns: 1fr; } }

/* Trust bar */
.auth-trust {
  display: flex; align-items: center; gap: 20px;
  padding-top: 32px; border-top: 1px solid var(--border);
  animation: fadeIn 0.8s ease 0.4s both;
}
.auth-trust-item { font-size: 0.75rem; color: var(--text-muted); display: flex; align-items: center; gap: 6px; }
.auth-trust-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--brand-accent); opacity: 0.6; }

/* ─ Form side (right — dark blue) ─ */
.auth-side {
  width: 480px; min-width: 420px; display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 40px 48px;
  background: linear-gradient(160deg,#0f1b2d 0%,#1a365d 40%,#1e4a7a 70%,#0c4a6e 100%);
  color: #fff;
  box-shadow: -4px 0 40px rgba(0,0,0,0.12);
}
.auth-side-logo { margin-bottom: 32px; text-align: center; animation: fadeInUp 0.3s ease both; }
.auth-side-logo img { height: 72px; }
.auth-card { width: 100%; max-width: 380px; animation: fadeInUp 0.4s ease 0.15s both; }
.auth-card h2 { font-size: 1.4rem; font-weight: 700; color: #fff; margin-bottom: 4px; }
.auth-card .auth-subtitle { font-size: 0.875rem; color: rgba(255,255,255,0.6); margin-bottom: 28px; }
.auth-card label { display: block; font-size: 0.75rem; font-weight: 600; color: rgba(255,255,255,0.7); margin-bottom: 18px; text-transform: uppercase; letter-spacing: 0.5px; }
.auth-card input {
  display: block; width: 100%; padding: 12px 16px;
  border: 1.5px solid rgba(255,255,255,0.2); border-radius: var(--radius-sm);
  font-size: 0.95rem; margin-top: 6px; font-family: var(--font);
  transition: var(--transition); background: rgba(255,255,255,0.08); color: #fff;
}
.auth-card input:focus { outline: none; border-color: var(--brand-accent); box-shadow: 0 0 0 4px rgba(14,165,233,0.2); background: rgba(255,255,255,0.12); }
.auth-card input::placeholder { color: rgba(255,255,255,0.4); font-size: 0.88rem; }
.auth-link { margin-top: 24px; font-size: 0.85rem; color: rgba(255,255,255,0.5); text-align: center; }
.auth-link a { font-weight: 600; color: var(--brand-accent); }
.auth-divider { display: flex; align-items: center; gap: 12px; margin: 20px 0; color: rgba(255,255,255,0.4); font-size: 0.78rem; }
.auth-divider::before, .auth-divider::after { content: ''; flex: 1; height: 1px; background: rgba(255,255,255,0.15); }

@media (max-width: 1024px) {
  .auth-hero { padding: 40px; }
  .auth-hero h1 { font-size: 2rem; }
  .auth-side { width: 420px; min-width: 360px; padding: 32px; }
}
@media (max-width: 768px) {
  .auth-hero { display: none; }
  .auth-side { width: 100%; min-width: unset; min-height: 100vh; padding: 24px; }
  .auth-side-logo img { height: 56px; }
}

/* ── Buttons ── */
.btn { display: inline-flex; align-items: center; gap: 6px; padding: 10px 20px; font-family: var(--font); font-size: 0.875rem; font-weight: 600; border: none; border-radius: var(--radius-sm); cursor: pointer; transition: var(--transition); text-decoration: none; white-space: nowrap; }
.btn:active { transform: scale(0.97); }
.btn-primary { background: var(--brand-accent); color: #fff; }
.btn-primary:hover { background: var(--brand-accent-hover); box-shadow: var(--shadow-brand); transform: translateY(-1px); color: #fff; }
.btn-secondary { background: var(--white); color: var(--text-sec); border: 1.5px solid var(--border); }
.btn-secondary:hover { border-color: var(--brand-accent); color: var(--brand-accent); }
.btn-ghost { background: transparent; color: var(--text-sec); padding: 8px 12px; }
.btn-ghost:hover { background: var(--surface); color: var(--text); }
.btn-danger { background: var(--red-50); color: var(--red-600); border: 1px solid var(--red-100); }
.btn-danger:hover { background: var(--red-600); color: #fff; }
.btn-full { width: 100%; justify-content: center; margin-top: 8px; }
.btn-sm { padding: 6px 12px; font-size: 0.8rem; }
.btn-lg { padding: 13px 28px; font-size: 0.95rem; }
.btn-sm { padding: 6px 12px; font-size: 0.78rem; }
.btn-danger { background: var(--red-50); color: var(--red-600); border: 1px solid var(--red-100); }
.btn-danger:hover { background: var(--red-100); }

/* ── Alerts ── */
.alert { padding: 12px 16px; border-radius: var(--radius-sm); font-size: 0.88rem; margin-bottom: 16px; }
.alert-error { background: var(--red-50); color: var(--red-600); border: 1px solid #FECACA; }
.alert-warning { background: var(--amber-50); color: var(--amber-600); border: 1px solid #FDE68A; }
.alert-info { background: var(--blue-50); color: var(--blue-600); border: 1px solid var(--blue-200); }

/* ── Layout ── */
.layout { display: flex; min-height: 100vh; }
.sidebar { width: 240px; background: var(--brand-primary); padding: 20px 14px; display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh; flex-shrink: 0; transition: width 0.25s ease, padding 0.25s ease; }
.sidebar.collapsed { width: 56px; padding: 20px 6px; overflow: hidden; }
.sidebar.collapsed .sidebar-logo { font-size: 0; margin-bottom: 12px; }
.sidebar.collapsed .sidebar-logo img { display: none; }
.sidebar.collapsed .sidebar-logo::after { content: ''; display: block; width: 28px; height: 28px; background: url('/static/img/emblem.png') no-repeat center; background-size: contain; }
.sidebar.collapsed .nav-item { font-size: 0; justify-content: center; padding: 10px 8px; overflow: hidden; }
.sidebar.collapsed .nav-item svg { font-size: initial; flex-shrink: 0; }
.sidebar.collapsed .sidebar-footer { font-size: 0; overflow: hidden; }
.sidebar.collapsed .sidebar-footer .nav-item { font-size: 0; }
.sidebar.collapsed .sidebar-toggle { font-size: 0.9rem; }
.sidebar-toggle { display: flex; align-items: center; justify-content: center; width: 100%; height: 28px; border-radius: 6px; border: 1px solid rgba(255,255,255,0.12); background: rgba(255,255,255,0.06); cursor: pointer; font-size: 0.72rem; color: rgba(255,255,255,0.5); transition: all 0.15s; margin-bottom: 12px; flex-shrink: 0; }
.sidebar-toggle:hover { background: rgba(255,255,255,0.12); color: rgba(255,255,255,0.8); }
.sidebar-logo { margin-bottom: 28px; padding: 0 4px; white-space: nowrap; }
.sidebar-logo img { height: 28px; }
.sidebar-nav { display: flex; flex-direction: column; gap: 2px; flex: 1; }
.nav-item { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: var(--radius-sm); font-size: 0.85rem; font-weight: 500; color: rgba(255,255,255,0.65); transition: var(--transition); white-space: nowrap; position: relative; }
.nav-item:hover { background: rgba(255,255,255,0.08); color: rgba(255,255,255,0.95); }
.nav-item.active { background: rgba(255,255,255,0.12); color: #fff; font-weight: 600; }
.nav-item.active::before { content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 3px; height: 20px; background: var(--brand-accent); border-radius: 0 3px 3px 0; }
.nav-item .nav-badge { margin-left: auto; font-size: 0.68rem; font-weight: 700; background: var(--brand-accent); color: #fff; padding: 1px 7px; border-radius: var(--radius-pill); }
.nav-logout { color: rgba(255,255,255,0.4); font-size: 0.8rem; }
.nav-logout:hover { color: rgba(255,255,255,0.7); background: rgba(255,255,255,0.06); }
.sidebar-footer { border-top: 1px solid rgba(255,255,255,0.1); padding-top: 12px; }
.sidebar-doctor { font-size: 0.82rem; font-weight: 600; margin-bottom: 2px; color: rgba(255,255,255,0.9); text-decoration: none; display: block; }
a.sidebar-doctor:hover { color: #fff; }

/* ── Profile page ── */
.profile-form label { display: block; margin-bottom: 14px; font-weight: 500; font-size: 0.875rem; }
.profile-form input[type="text"],
.profile-form input[type="email"],
.profile-form input[type="password"] {
  display: block; width: 100%; margin-top: 4px; padding: 10px 12px; border: 1px solid var(--border);
  border-radius: var(--radius-sm); font-size: 0.9rem; font-family: var(--font);
  transition: border-color 0.15s;
}
.profile-form input:focus { outline: none; border-color: var(--brand-accent); box-shadow: 0 0 0 3px rgba(14,165,233,0.1); }
.profile-section { background: var(--white); border: 1px solid var(--border); border-radius: var(--radius); padding: 20px; margin-bottom: 16px; }
.profile-section h3 { font-size: 1rem; margin-bottom: 14px; color: var(--brand-primary); }
.profile-hint { font-size: 0.82rem; color: var(--text-sec); line-height: 1.5; margin-bottom: 16px; }
.profile-steps { display: flex; flex-direction: column; gap: 10px; margin-bottom: 16px; }
.profile-step { display: flex; align-items: flex-start; gap: 10px; font-size: 0.85rem; line-height: 1.4; }
.step-num {
  width: 24px; height: 24px; border-radius: 50%; background: var(--brand-accent); color: #fff;
  display: flex; align-items: center; justify-content: center; font-size: 0.75rem; font-weight: 700; flex-shrink: 0;
}
.profile-badge { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: var(--radius-sm); font-size: 0.82rem; font-weight: 500; margin-top: 8px; }
.profile-badge-ok { background: var(--green-50); color: var(--green-600); border: 1px solid var(--green-100); }
.profile-badge-warn { background: var(--amber-50); color: var(--amber-600); border: 1px solid var(--amber-100); }
.alert-success { background: var(--green-50); color: var(--green-600); border: 1px solid var(--green-100); padding: 10px 16px; border-radius: var(--radius-sm); font-size: 0.875rem; }
.sidebar-stats { font-size: 0.75rem; color: rgba(255,255,255,0.4); margin-bottom: 8px; }
.main { flex: 1; padding: 24px 28px; overflow-x: auto; }

/* ── Toolbar ── */
.toolbar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 24px; gap: 12px; flex-wrap: wrap; }
.toolbar-left, .toolbar-right { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.page-title { font-size: 1.3rem; font-weight: 700; }
.badge { font-size: 0.72rem; font-weight: 600; padding: 4px 10px; border-radius: 100px; background: var(--surface); color: var(--text-sec); }
.badge-blue { background: var(--blue-50); color: var(--blue-600); }
.select-filter { padding: 8px 12px; border: 1px solid var(--border); border-radius: var(--radius-sm); font-size: 0.82rem; font-family: var(--font); background: var(--white); color: var(--text); cursor: pointer; transition: var(--transition); }
.select-filter:focus { outline: none; border-color: var(--blue-500); box-shadow: 0 0 0 2px var(--blue-100); }
.search-input { padding: 8px 12px; border: 1px solid var(--border); border-radius: var(--radius-sm); font-size: 0.82rem; font-family: var(--font); background: var(--white); color: var(--text); width: 200px; transition: var(--transition); }
.search-input:focus { outline: none; border-color: var(--blue-500); box-shadow: 0 0 0 2px var(--blue-100); width: 260px; }
.search-input::placeholder { color: var(--text-muted); }

/* ── Kanban ── */
.kanban { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.kanban-col { background: var(--surface); border-radius: var(--radius); padding: 12px; min-height: 300px; }
.kanban-col-header { display: flex; justify-content: space-between; align-items: center; padding-bottom: 10px; margin-bottom: 10px; border-bottom: 1px solid var(--border); }
.kanban-col-title { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--text-muted); }
.kanban-col-count { font-size: 0.68rem; font-weight: 700; background: var(--blue-50); color: var(--blue-600); padding: 2px 8px; border-radius: 100px; min-width: 22px; text-align: center; }
.kanban-cards { display: flex; flex-direction: column; gap: 8px; }
.kanban-card { display: block; background: var(--white); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 12px 14px; transition: var(--transition); cursor: pointer; position: relative; }
.kanban-card:hover { border-color: var(--blue-200); box-shadow: var(--shadow-md); transform: translateY(-2px); }
.card-name { font-size: 0.85rem; font-weight: 600; margin-bottom: 2px; color: var(--text); }
.card-diag { font-size: 0.72rem; color: var(--text-muted); margin-bottom: 4px; }
.card-op { font-size: 0.72rem; color: var(--text-sec); margin-bottom: 6px; }
.card-meta { display: flex; gap: 4px; flex-wrap: wrap; }
.tag { font-size: 0.65rem; font-weight: 600; padding: 2px 7px; border-radius: 5px; }
.tag-blue { background: var(--blue-50); color: var(--blue-600); }
.tag-green { background: var(--green-50); color: var(--green-600); }
.tag-amber { background: var(--amber-50); color: var(--amber-500); }
.tag-teal { background: var(--teal-50); color: var(--teal-600); }
.tag-red { background: var(--red-50); color: var(--red-500); }

/* ── Cards ── */
.card { background: var(--white); border: 1px solid var(--border); border-radius: var(--radius); padding: 24px; margin-bottom: 16px; }
.card h3 { font-size: 0.95rem; font-weight: 600; margin-bottom: 16px; display: flex; align-items: center; gap: 8px; color: var(--text); }
.card h3 svg { color: var(--text-muted); flex-shrink: 0; }

/* ── Forms ── */
.form-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.form-grid-compact { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.span-2 { grid-column: span 2; }
.span-full { grid-column: 1 / -1; }
.patient-form label, .daily-form label { display: block; font-size: 0.8rem; font-weight: 500; color: var(--text-sec); }
.patient-form input, .patient-form select,
.daily-form input, .daily-form select, .daily-form textarea {
  display: block; width: 100%; padding: 8px 10px; border: 1px solid var(--border);
  border-radius: var(--radius-xs); font-size: 0.88rem; margin-top: 3px; font-family: var(--font);
  transition: var(--transition);
}
.patient-form input:focus, .patient-form select:focus,
.daily-form input:focus, .daily-form select:focus, .daily-form textarea:focus {
  outline: none; border-color: var(--blue-500); box-shadow: 0 0 0 2px var(--blue-100);
}
.form-actions { display: flex; gap: 8px; justify-content: flex-end; margin-top: 16px; }

/* ── Upload ── */
.upload-card { display: flex; flex-direction: column; align-items: center; gap: 12px; border: 2px dashed var(--border); background: var(--surface); text-align: center; transition: var(--transition); }
.upload-card:hover { border-color: var(--blue-200); }
.upload-card form { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; justify-content: center; }
.upload-hint { font-size: 0.8rem; color: var(--text-muted); }

/* ── Detail page ── */
.detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.next-action-card { background: var(--amber-50); border: 1px solid #FDE68A; border-radius: var(--radius-sm); padding: 12px 16px; font-size: 0.9rem; color: var(--amber-600); margin-bottom: 16px; display: flex; align-items: center; gap: 8px; }
.next-action-card strong { white-space: nowrap; }

/* ── Data table ── */
.table-wrap { overflow-x: auto; }
.data-table { width: 100%; border-collapse: collapse; font-size: 0.82rem; }
.data-table th { text-align: left; padding: 10px 10px; font-weight: 600; color: var(--text-muted); border-bottom: 2px solid var(--border); font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.04em; }
.data-table td { padding: 10px 10px; border-bottom: 1px solid var(--border); }
.data-table tbody tr { transition: var(--transition); }
.data-table tbody tr:hover { background: var(--surface); }
.clickable-row { cursor: pointer; }
.clickable-row:hover { background: var(--blue-50) !important; }
.text-red { color: var(--red-500); font-weight: 600; }
.text-amber { color: var(--amber-600); font-weight: 500; }

/* ── Morning review ── */
.morning-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 14px; }
.morning-card { display: block; background: var(--white); border: 1px solid var(--border); border-radius: var(--radius); padding: 16px; transition: var(--transition); }
.morning-card:hover { border-color: var(--blue-200); box-shadow: var(--shadow-md); transform: translateY(-2px); }
.morning-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 4px; }
.morning-name { font-size: 0.9rem; font-weight: 600; color: var(--text); }
.morning-op { font-size: 0.75rem; color: var(--text-sec); margin-bottom: 10px; }
.morning-metrics { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; margin-bottom: 8px; }
.metric { background: var(--surface); border-radius: var(--radius-xs); padding: 8px 10px; }
.metric-label { font-size: 0.68rem; color: var(--text-muted); display: block; margin-bottom: 2px; }
.metric-value { font-size: 0.95rem; font-weight: 600; }
.morning-date { font-size: 0.7rem; color: var(--text-muted); }
.morning-no-data { font-size: 0.78rem; color: var(--text-muted); font-style: italic; padding: 8px 0; }
.morning-action { font-size: 0.78rem; color: var(--amber-600); margin-top: 8px; font-weight: 500; }

/* ── Analytics: KPI row ── */
.kpi-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-bottom: 20px; }
.kpi-card { background: var(--white); border: 1px solid var(--border); border-radius: var(--radius); padding: 20px; text-align: center; transition: var(--transition); }
.kpi-card:hover { box-shadow: var(--shadow-sm); }
.kpi-value { font-size: 2rem; font-weight: 700; display: block; line-height: 1.2; color: var(--text); }
.kpi-label { font-size: 0.78rem; color: var(--text-muted); display: block; margin-top: 4px; }
.kpi-blue { border-color: var(--blue-200); background: var(--blue-50); }
.kpi-blue .kpi-value { color: var(--blue-600); }
.kpi-amber { border-color: #FDE68A; background: var(--amber-50); }
.kpi-amber .kpi-value { color: var(--amber-600); }
.kpi-red { border-color: var(--red-100); background: var(--red-50); }
.kpi-red .kpi-value { color: var(--red-500); }
.kpi-row-5 { grid-template-columns: repeat(5, 1fr); }
.card-compact { padding: 16px; }
.card-compact h3 { font-size: 0.85rem; margin-bottom: 12px; }
.alert-banner-danger { color: var(--red-600); }
.morning-table td { padding: 10px 8px; }
.morning-table .pt-name { font-size: 0.85rem; }

/* ── Analytics: grid ── */
.analytics-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; margin-bottom: 16px; }

/* ── Analytics: Alerts card ── */
.alerts-card { margin-bottom: 20px; border-color: var(--red-100); }
.alerts-card h3 { color: var(--red-600); }
.alerts-count { font-size: 0.72rem; background: var(--red-500); color: #fff; padding: 2px 8px; border-radius: 100px; margin-left: 4px; }
.alerts-list { display: flex; flex-direction: column; gap: 6px; }
.alert-row { display: flex; justify-content: space-between; align-items: center; padding: 10px 14px; border-radius: var(--radius-sm); transition: var(--transition); text-decoration: none; gap: 12px; }
.alert-row:hover { transform: translateX(4px); }
.alert-danger { background: var(--red-50); }
.alert-danger:hover { background: var(--red-100); }
.alert-warning { background: var(--amber-50); }
.alert-warning:hover { background: var(--amber-100); }
.alert-row-left { display: flex; align-items: center; gap: 10px; }
.alert-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; }
.alert-dot-danger { background: var(--red-500); }
.alert-dot-warning { background: var(--amber-500); }
.alert-patient { font-size: 0.85rem; font-weight: 600; color: var(--text); }
.alert-message { font-size: 0.8rem; color: var(--text-sec); white-space: nowrap; }

/* ── Analytics: Funnel ── */
.funnel { display: flex; flex-direction: column; gap: 10px; }
.funnel-row { display: flex; align-items: center; gap: 12px; }
.funnel-label { font-size: 0.8rem; color: var(--text-sec); min-width: 140px; white-space: nowrap; }
.funnel-bar-wrap { flex: 1; height: 24px; background: var(--surface); border-radius: 4px; overflow: hidden; }
.funnel-bar { height: 100%; background: linear-gradient(90deg, var(--blue-500), var(--blue-600)); border-radius: 4px; min-width: 4px; transition: width 0.6s ease; }
.funnel-count { font-size: 0.85rem; font-weight: 700; color: var(--text); min-width: 24px; text-align: right; }

/* ── Analytics: Op stats ── */
.op-stats { display: flex; flex-direction: column; gap: 8px; }
.op-stat-row { display: flex; justify-content: space-between; align-items: center; padding: 8px 12px; background: var(--surface); border-radius: var(--radius-xs); }
.op-stat-label { font-size: 0.82rem; color: var(--text-sec); }
.op-stat-count { font-size: 0.95rem; font-weight: 700; color: var(--blue-600); }

/* ── Analytics: Stay stats ── */
.stay-stats { display: flex; flex-direction: column; gap: 8px; }
.stay-row { display: flex; justify-content: space-between; align-items: center; padding: 8px 12px; background: var(--surface); border-radius: var(--radius-xs); }
.stay-label { font-size: 0.82rem; color: var(--text-sec); }
.stay-right { display: flex; align-items: center; gap: 8px; }
.stay-days { font-size: 0.95rem; font-weight: 700; color: var(--text); }
.stay-n { font-size: 0.7rem; color: var(--text-muted); }

/* ── Analytics: No diary ── */
.no-diary-list { display: flex; flex-direction: column; gap: 6px; }
.no-diary-row { display: flex; justify-content: space-between; align-items: center; padding: 8px 12px; background: var(--amber-50); border-radius: var(--radius-xs); transition: var(--transition); text-decoration: none; }
.no-diary-row:hover { background: var(--amber-100); }
.no-diary-name { font-size: 0.85rem; font-weight: 500; color: var(--text); }

.empty-text { font-size: 0.85rem; color: var(--text-muted); font-style: italic; padding: 8px 0; }
.success-text { color: var(--green-600); font-style: normal; font-weight: 500; }

/* ── Alert banner ── */
.alert-banner { background: var(--amber-50); border: 1px solid #FDE68A; border-radius: var(--radius); padding: 8px 12px; margin-bottom: 16px; display: flex; flex-direction: column; gap: 4px; }
.alert-banner-item { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: var(--radius-xs); font-size: 0.84rem; color: var(--amber-600); text-decoration: none; transition: var(--transition); font-weight: 500; }
.alert-banner-item:hover { background: var(--amber-100); }
.alert-banner-icon { font-size: 1rem; }

/* ── Patient list table ── */
.list-filters { display: flex; gap: 10px; margin-bottom: 16px; align-items: center; flex-wrap: wrap; }
.search-wide { flex: 1; min-width: 200px; }
.patient-table { font-size: 0.84rem; }
.patient-table th { position: sticky; top: 0; background: var(--white); z-index: 1; padding: 12px 10px; }
.patient-table td { padding: 12px 10px; vertical-align: middle; }
.patient-table tbody tr { border-bottom: 1px solid var(--border); cursor: pointer; transition: var(--transition); }
.patient-table tbody tr:hover { background: var(--blue-50); }
.pt-name { font-weight: 600; font-size: 0.88rem; color: var(--text); }
.pt-diag { font-size: 0.72rem; color: var(--text-muted); margin-top: 1px; }
.pt-op { font-size: 0.82rem; color: var(--text-sec); white-space: nowrap; }
.pt-day { font-weight: 600; text-align: center; }
.pt-action { font-size: 0.8rem; color: var(--amber-600); max-width: 220px; }

/* Phase badges */
.phase-badge { font-size: 0.72rem; font-weight: 600; padding: 3px 10px; border-radius: 100px; white-space: nowrap; }
.phase-coral { background: #FFF1F0; color: #E04E3E; }
.phase-amber { background: var(--amber-50); color: var(--amber-600); }
.phase-green { background: var(--green-50); color: var(--green-600); }
.phase-blue { background: var(--blue-50); color: var(--blue-600); }
.phase-teal { background: var(--teal-50); color: var(--teal-600); }
.phase-purple { background: #F3F0FF; color: #6366F1; }
.phase-gray { background: var(--surface); color: var(--text-muted); }

/* Pain bar */
.pain-bar-wrap { display: flex; align-items: center; gap: 6px; min-width: 80px; }
.pain-bar { height: 6px; border-radius: 3px; transition: width 0.3s; }
.pain-bar-green { background: var(--green-600); }
.pain-bar-amber { background: var(--amber-500); }
.pain-bar-red { background: var(--red-500); }
.pain-num { font-size: 0.82rem; font-weight: 600; min-width: 14px; }

/* ── Patient detail: trend column ── */
.trend-up { color: var(--red-500); font-weight: 600; font-size: 0.78rem; }
.trend-down { color: var(--green-600); font-weight: 600; font-size: 0.78rem; }
.trend-same { color: var(--text-muted); font-size: 0.78rem; }

/* Auto insights */
.insights-card { background: var(--surface); border-radius: var(--radius-sm); padding: 14px 16px; margin-top: 16px; }
.insights-card h4 { font-size: 0.82rem; font-weight: 600; color: var(--text-sec); margin-bottom: 8px; }
.insight-row { display: flex; align-items: flex-start; gap: 8px; padding: 4px 0; font-size: 0.82rem; color: var(--text-sec); }
.insight-icon { flex-shrink: 0; }
.insight-ok { color: var(--green-600); }
.insight-warn { color: var(--amber-600); }
.insight-danger { color: var(--red-600); }

/* ── Detail header ── */
.detail-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 16px; gap: 16px; }
.detail-header-left { flex: 1; }
.detail-name { font-size: 1.4rem; font-weight: 700; margin-bottom: 4px; }
.detail-meta { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; font-size: 0.85rem; color: var(--text-sec); margin-bottom: 4px; }
.meta-dot { color: var(--text-muted); }
.detail-diagnosis { font-size: 0.82rem; color: var(--text-muted); }
.data-badge { font-size: 0.72rem; font-weight: 600; padding: 4px 12px; border-radius: 100px; background: var(--green-50); color: var(--green-600); white-space: nowrap; }
.today-row { background: var(--blue-50); }
.today-label { font-size: 0.65rem; color: var(--blue-600); font-weight: 600; }

/* ── Discharge / preop cards ── */
.discharge-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); padding: 16px; margin-bottom: 16px; }
.discharge-ready { background: var(--green-50); border-color: var(--green-100); }
.preop-card { background: var(--blue-50); border: 1px solid var(--blue-200); border-radius: var(--radius); padding: 16px; margin-bottom: 16px; }
.discharge-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.discharge-title { font-size: 0.9rem; font-weight: 600; }
.discharge-score { font-size: 0.85rem; font-weight: 700; color: var(--text-sec); }
.discharge-bar-wrap { height: 6px; background: var(--border); border-radius: 3px; margin-bottom: 10px; overflow: hidden; }
.discharge-bar { height: 100%; background: var(--green-600); border-radius: 3px; transition: width 0.4s; }
.preop-bar { background: var(--blue-600); }
.discharge-criteria { display: flex; flex-wrap: wrap; gap: 6px 14px; }
.dc-item { font-size: 0.8rem; white-space: nowrap; }
.dc-ok { color: var(--green-600); }
.dc-pending { color: var(--text-muted); }

/* ── KPI strip (horizontal) ── */
.kpi-strip { display: flex; gap: 8px; margin-bottom: 16px; flex-wrap: wrap; }
.kpi-strip-item { background: var(--white); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 8px 14px; text-align: center; min-width: 80px; }
.kpi-strip-label { font-size: 0.65rem; color: var(--text-muted); display: block; }
.kpi-strip-val { font-size: 0.95rem; font-weight: 700; }
.kpi-strip-goal { background: var(--surface); border-style: dashed; }
.kpi-strip-goal .kpi-strip-label { color: var(--text-sec); }
.kpi-strip-goal .kpi-strip-val { font-size: 0.82rem; color: var(--text-sec); }
.kpi-mini-red { border-color: var(--red-100); background: var(--red-50); }
.kpi-mini-red .kpi-strip-val { color: var(--red-500); }
.kpi-mini-amber { border-color: #FDE68A; background: var(--amber-50); }
.kpi-mini-amber .kpi-strip-val { color: var(--amber-600); }

/* ── Diary panel (chart + table side by side) ── */
.diary-panel { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.diary-chart { margin-bottom: 0; }
.diary-chart canvas { width: 100%; }
.diary-table { margin-bottom: 0; overflow: hidden; }
.chart-legend { display: flex; gap: 12px; margin-top: 6px; }
.legend-item { font-size: 0.68rem; color: var(--text-sec); display: flex; align-items: center; gap: 3px; }
.legend-color { width: 8px; height: 8px; border-radius: 2px; display: inline-block; }
.data-table-sm { font-size: 0.78rem; }
.data-table-sm th, .data-table-sm td { padding: 6px 6px; }
.insights-inline { display: flex; flex-wrap: wrap; gap: 6px 12px; margin-top: 8px; font-size: 0.75rem; font-weight: 500; }

/* ── View toggle ── */
.view-toggle { display: flex; border: 1px solid var(--border); border-radius: var(--radius-sm); overflow: hidden; margin-left: 4px; }
.vt-btn { display: flex; align-items: center; justify-content: center; padding: 6px 10px; color: var(--text-muted); transition: var(--transition); }
.vt-btn:hover { background: var(--surface); color: var(--text); }
.vt-active { background: var(--blue-50); color: var(--blue-600); }

/* ── Doctor switch ── */
.doctor-option { display: flex; align-items: center; gap: 10px; padding: 12px; border: 1px solid var(--border); border-radius: var(--radius-sm); margin-bottom: 8px; cursor: pointer; transition: var(--transition); }
.doctor-option:hover { border-color: var(--blue-200); background: var(--blue-50); }
.doctor-option input[type="radio"] { accent-color: var(--blue-600); }
.doctor-option-name { font-weight: 600; font-size: 0.9rem; }
.doctor-option-email { font-size: 0.78rem; color: var(--text-muted); margin-left: auto; }

/* ── Compact morning review ── */
.morning-compact { display: flex; flex-direction: column; gap: 6px; }
.mc-row { display: flex; align-items: center; gap: 10px; padding: 10px 14px; background: var(--white); border: 1px solid var(--border); border-radius: var(--radius-sm); transition: var(--transition); text-decoration: none; }
.mc-row:hover { border-color: var(--blue-200); background: var(--blue-50); }
.mc-name { font-size: 0.88rem; font-weight: 600; color: var(--text); min-width: 180px; }
.mc-op { font-size: 0.78rem; color: var(--text-sec); min-width: 130px; }
.mc-metrics { display: flex; gap: 12px; flex: 1; }
.mc-metric { font-size: 0.8rem; color: var(--text-sec); white-space: nowrap; }
.mc-metric strong { font-weight: 600; color: var(--text); }
.mc-action { font-size: 0.78rem; color: var(--amber-600); margin-left: auto; max-width: 200px; text-align: right; }
.mc-alert { border-color: var(--red-100); background: var(--red-50); }

/* ── Patient Detail (redesigned v2) ── */
.pd-main { max-width: 1200px; }

/* Header */
.pd-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; gap: 12px; }
.pd-header-left { display: flex; align-items: center; gap: 14px; flex: 1; }
.pd-avatar { width: 48px; height: 48px; border-radius: 50%; background: var(--blue-600); color: #fff; display: flex; align-items: center; justify-content: center; font-size: 1.1rem; font-weight: 700; flex-shrink: 0; }
.pd-header-info { flex: 1; }
.pd-name-row { display: flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.pd-name { font-size: 1.2rem; font-weight: 700; }
.pd-age { font-size: 0.85rem; color: var(--text-sec); }
.pd-header-diag-code { font-size: 0.75rem; font-weight: 600; color: var(--blue-600); background: var(--blue-50); padding: 2px 8px; border-radius: 4px; }
.pd-badges-row { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 4px; }
.pd-badge { font-size: 0.72rem; font-weight: 600; padding: 2px 10px; border-radius: 100px; white-space: nowrap; }
.pd-badge-ward { background: var(--blue-50); color: var(--blue-600); }
.pd-badge-allergy { background: var(--red-50); color: var(--red-600); border: 1px solid var(--red-100); }
.pd-badge-blood { background: var(--surface); color: var(--text-sec); }
.pd-close { font-size: 1.8rem; color: var(--text-muted); line-height: 1; padding: 4px 8px; border-radius: var(--radius-xs); transition: var(--transition); text-decoration: none; }
.pd-close:hover { background: var(--surface); color: var(--text); }

/* Status bar */
.pd-status-bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; flex-wrap: wrap; }
.pd-stage-pills { display: flex; gap: 5px; flex-wrap: wrap; }
.pd-pill { padding: 5px 12px; font-size: 0.75rem; font-weight: 600; border-radius: 100px; border: 1px solid var(--border); background: var(--white); color: var(--text-sec); cursor: pointer; font-family: var(--font); transition: var(--transition); }
.pd-pill:hover { border-color: var(--blue-200); background: var(--blue-50); }
.pd-pill-active { background: var(--blue-600); color: #fff; border-color: var(--blue-600); }
.pd-pill-active:hover { background: var(--blue-700); }
.pd-status-indicators { display: flex; align-items: center; gap: 10px; }
.pd-bot-indicator { font-size: 0.75rem; color: var(--text-muted); font-weight: 500; display: flex; align-items: center; gap: 5px; }
.pd-bot-dot { width: 7px; height: 7px; border-radius: 50%; display: inline-block; }
.pd-priority-dot { width: 10px; height: 10px; border-radius: 50%; }
.pd-priority-urgent { background: var(--red-500); box-shadow: 0 0 0 3px var(--red-100); }
.pd-priority-attention { background: var(--amber-500); box-shadow: 0 0 0 3px var(--amber-100); }

/* Metrics strip */
.pd-metrics-strip { display: flex; gap: 8px; margin-bottom: 10px; flex-wrap: wrap; }
.pd-metric-card { background: var(--white); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 8px 14px; text-align: center; min-width: 110px; flex: 1; }
.pd-metric-label { font-size: 0.6rem; font-weight: 700; color: var(--text-muted); letter-spacing: 0.5px; display: block; margin-bottom: 1px; }
.pd-metric-val { font-size: 0.95rem; font-weight: 700; display: block; }
.pd-metric-sub { font-size: 0.7rem; color: var(--text-muted); }
.pd-pain-green { border-color: var(--green-100); background: var(--green-50); }
.pd-pain-green .pd-pain-val { color: var(--green-600); }
.pd-pain-amber { border-color: #FDE68A; background: var(--amber-50); }
.pd-pain-amber .pd-pain-val { color: var(--amber-600); }
.pd-pain-red { border-color: var(--red-100); background: var(--red-50); }
.pd-pain-red .pd-pain-val { color: var(--red-500); }

/* KPI status strip */
.kpi-strip-wrap { padding: 16px 24px 12px; background: #f8fafc; border-bottom: 1px solid #e2e8f0; }
.kpi-op-line { display: flex; align-items: baseline; gap: 8px; margin-bottom: 14px; flex-wrap: wrap; }
.kpi-op-name { font-weight: 700; font-size: 1.1rem; color: #1e293b; }
.kpi-op-date { color: #64748b; font-size: 0.95rem; }
.kpi-op-days { color: #6366f1; font-weight: 700; font-size: 1.1rem; }
.kpi-vitals { display: flex; align-items: flex-end; gap: 0; flex-wrap: wrap; }
.kpi-vital { padding-right: 20px; }
.kpi-vital-bordered { border-left: 1px solid #e2e8f0; padding: 0 20px; }
.kpi-vital-label { font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.05em; color: #94a3b8; margin-bottom: 2px; }
.kpi-vital-val { font-size: 1.35rem; font-weight: 700; color: #1e293b; }
.kpi-vital-unit { font-size: 0.8rem; font-weight: 400; color: #94a3b8; }
.kpi-red { color: #ef4444 !important; }
.kpi-amber { color: #f59e0b !important; }
.kpi-green { color: #16a34a !important; }

/* Next action banner */
.pd-banner { background: var(--amber-50); border: 1px solid #FDE68A; border-radius: var(--radius-sm); padding: 8px 14px; font-size: 0.84rem; color: var(--amber-600); font-weight: 600; margin-bottom: 12px; }
.pd-banner-icon { margin-right: 4px; }

/* Two-column layout */
.pd-two-col { display: grid; grid-template-columns: 3fr 2fr; gap: 16px; align-items: start; }
.pd-col-left { min-width: 0; }
.pd-col-right { min-width: 0; }

/* Collapsible sections */
.pd-section { background: var(--white); border: 1px solid var(--border); border-radius: var(--radius); margin-bottom: 12px; overflow: hidden; }
.pd-section-header { font-size: 0.88rem; font-weight: 600; color: var(--text); padding: 12px 16px; cursor: pointer; display: flex; align-items: center; gap: 8px; user-select: none; transition: var(--transition); }
.pd-section-header:hover { background: var(--surface); }
.pd-section-header-static { cursor: default; }
.pd-section-header-static:hover { background: transparent; }
.pd-section-icon { font-size: 1rem; }
.pd-section > summary { list-style: none; }
.pd-section > summary::-webkit-details-marker { display: none; }
.pd-section > summary::after { content: "\25B6"; font-size: 0.6rem; color: var(--text-muted); margin-left: auto; transition: transform 0.2s; }
.pd-section[open] > summary::after { transform: rotate(90deg); }
.pd-section-body { padding: 0 16px 16px; }
.pd-subsection-title { font-size: 0.7rem; font-weight: 700; color: var(--text-muted); letter-spacing: 0.6px; text-transform: uppercase; margin: 12px 0 6px; }

/* Diary form inside section */
.pd-diary-form-wrap { background: var(--surface); border-radius: var(--radius-sm); padding: 12px; margin-bottom: 12px; }
.pd-diary-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.pd-diary-grid label { display: block; font-size: 0.78rem; font-weight: 500; color: var(--text-sec); }
.pd-diary-grid input, .pd-diary-grid select, .pd-diary-grid textarea {
  display: block; width: 100%; padding: 6px 8px; border: 1px solid var(--border);
  border-radius: var(--radius-xs); font-size: 0.78rem; margin-top: 2px; font-family: var(--font);
  transition: var(--transition); background: var(--white);
}
.pd-diary-grid input:focus, .pd-diary-grid select:focus, .pd-diary-grid textarea:focus {
  outline: none; border-color: var(--blue-500); box-shadow: 0 0 0 2px var(--blue-100);
}
.pd-diary-notes-label { grid-column: 1 / -1; }
.pd-diary-form-actions { display: flex; justify-content: flex-end; margin-top: 8px; }

/* Mini charts (3 in a row inside left column) */
.pd-mini-charts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 12px; }
.pd-chart-card { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-sm); padding: 6px; }
.pd-chart-title { font-size: 0.72rem; font-weight: 600; color: var(--text-sec); margin-bottom: 2px; }
.pd-chart-note { font-size: 0.68rem; color: var(--text-muted); font-style: italic; margin-top: 2px; }

/* Diary table */
.pd-diary-table-wrap { overflow-x: auto; }
.pd-diary-note-cell { max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 0.75rem; color: var(--text-muted); }

/* Notes list */
.pd-notes-list { margin-bottom: 10px; }
.pd-note-item { display: flex; gap: 8px; padding: 5px 0; border-bottom: 1px solid var(--surface); font-size: 0.82rem; }
.pd-note-item:last-child { border-bottom: none; }
.pd-note-time { font-size: 0.72rem; color: var(--text-muted); white-space: nowrap; min-width: 60px; }
.pd-note-text { color: var(--text); }

/* Events list */
.pd-events-list { margin-bottom: 10px; }
.pd-event-item { display: flex; align-items: flex-start; gap: 8px; padding: 4px 0; font-size: 0.8rem; }
.pd-event-dot { width: 8px; height: 8px; border-radius: 50%; flex-shrink: 0; margin-top: 5px; background: var(--text-muted); }
.pd-event-diary { background: var(--green-600); }
.pd-event-note { background: var(--blue-600); }
.pd-event-recommendation { background: var(--blue-500); }
.pd-event-operation { background: #8B5CF6; }
.pd-event-stage_change { background: var(--amber-500); }
.pd-event-alert { background: var(--red-500); }
.pd-event-time { font-size: 0.7rem; color: var(--text-muted); white-space: nowrap; min-width: 72px; }
.pd-event-text { color: var(--text-sec); }

/* Edit form (right column) */
.pd-edit-form { font-size: 0.78rem; }
.pd-subgroup { border-left: 3px solid var(--border); padding-left: 12px; margin-bottom: 14px; }
.pd-subgroup-personal { border-left-color: var(--blue-500); }
.pd-subgroup-diagnosis { border-left-color: var(--green-600); }
.pd-subgroup-hospital { border-left-color: var(--amber-500); }
.pd-subgroup-messenger { border-left-color: #8B5CF6; }
.pd-subgroup-title { font-size: 0.7rem; font-weight: 700; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.5px; margin-bottom: 8px; }
.pd-inline-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.pd-field { display: block; font-size: 0.75rem; font-weight: 500; color: var(--text-sec); }
.pd-field-wide { grid-column: 1 / -1; }
.pd-field input, .pd-field select {
  display: block; width: 100%; padding: 5px 8px; border: 1px solid var(--border);
  border-radius: var(--radius-xs); font-size: 0.78rem; margin-top: 2px; font-family: var(--font);
  transition: var(--transition); background: var(--white);
}
.pd-field input:focus, .pd-field select:focus {
  outline: none; border-color: var(--blue-500); box-shadow: 0 0 0 2px var(--blue-100);
}
.pd-edit-actions { display: flex; justify-content: flex-end; margin-top: 10px; }

/* Bot links in edit form */
.pd-bot-links { margin-top: 4px; }
.pd-bot-btn { display: inline-block; padding: 3px 10px; border-radius: 100px; font-size: 0.7rem; font-weight: 600; text-decoration: none; cursor: pointer; border: none; font-family: var(--font); transition: var(--transition); }
.pd-bot-tg { background: #0088cc; color: #fff; }
.pd-bot-tg:hover { background: #006da3; }
.pd-bot-max { background: #6C5CE7; color: #fff; }
.pd-bot-max:hover { background: #5a4bd6; }
.pd-bot-copy { background: var(--white); color: var(--text-sec); border: 1px solid var(--border); }
.pd-bot-copy:hover { border-color: var(--blue-500); color: var(--text); }

/* Actions section */
.pd-actions-section { border: 1px solid var(--border); }
.pd-action-buttons { display: flex; gap: 8px; flex-wrap: wrap; }
.pd-note-form { background: var(--surface); border-radius: var(--radius-sm); padding: 10px; margin-bottom: 10px; }
.pd-note-textarea { width: 100%; padding: 6px 8px; border: 1px solid var(--border); border-radius: var(--radius-xs); font-family: var(--font); font-size: 0.82rem; resize: vertical; }
.pd-note-textarea:focus { outline: none; border-color: var(--blue-500); box-shadow: 0 0 0 3px var(--blue-100); }
.pd-note-form-actions { display: flex; gap: 6px; margin-top: 6px; }

/* ── Ward-based inpatient & morning review ── */
.ward-summary {
  display: flex; gap: 10px; margin-bottom: 16px; flex-wrap: wrap;
}
.ward-summary-item {
  background: var(--white); border: 1px solid var(--border); border-radius: var(--radius-sm);
  padding: 8px 14px; text-align: center; min-width: 100px;
}
.ward-summary-item .ws-label { font-size: 0.65rem; color: var(--text-muted); display: block; font-weight: 600; text-transform: uppercase; letter-spacing: 0.3px; }
.ward-summary-item .ws-val { font-size: 1rem; font-weight: 700; display: block; }
.ward-summary-item.ws-red { border-color: var(--red-100); background: var(--red-50); }
.ward-summary-item.ws-red .ws-val { color: var(--red-500); }
.ward-summary-item.ws-amber { border-color: #FDE68A; background: var(--amber-50); }
.ward-summary-item.ws-amber .ws-val { color: var(--amber-600); }

.ward-card {
  background: var(--white); border: 1px solid var(--border); border-radius: var(--radius);
  margin-bottom: 16px; overflow: hidden;
}
.ward-header {
  display: flex; justify-content: space-between; align-items: center;
  padding: 10px 16px; background: var(--surface); border-bottom: 1px solid var(--border);
  font-size: 0.85rem; font-weight: 700; color: var(--text);
}
.ward-header .ward-occ { font-size: 0.72rem; font-weight: 600; color: var(--text-muted); }
.ward-patient-row {
  display: flex; align-items: center; gap: 10px; padding: 8px 16px;
  border-bottom: 1px solid var(--border); font-size: 0.82rem;
  transition: var(--transition); cursor: pointer; text-decoration: none; color: var(--text);
}
.ward-patient-row:last-child { border-bottom: none; }
.ward-patient-row:hover { background: var(--blue-50); }
.ward-patient-row .wp-name { font-weight: 600; min-width: 150px; white-space: nowrap; }
.ward-patient-row .wp-age { color: var(--text-muted); min-width: 30px; }
.ward-vitals {
  display: flex; gap: 14px; flex: 1; align-items: center; flex-wrap: wrap;
}
.ward-vitals .wv-item { white-space: nowrap; font-size: 0.78rem; color: var(--text-sec); }
.ward-vitals .wv-item strong { font-weight: 600; color: var(--text); }
.ward-vitals .wv-pain-green strong { color: var(--green-600); }
.ward-vitals .wv-pain-amber strong { color: var(--amber-600); }
.ward-vitals .wv-pain-red strong { color: var(--red-500); }
.ward-vitals .wv-trend-down { color: var(--green-600); }
.ward-vitals .wv-trend-up { color: var(--red-500); }
.ward-patient-row .wp-action { font-size: 0.75rem; color: var(--amber-600); margin-left: auto; max-width: 180px; text-align: right; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.ward-alert-red { border-left: 3px solid var(--red-500); background: var(--red-50); }
.ward-alert-red:hover { background: var(--red-100); }
.ward-alert-yellow { border-left: 3px solid var(--amber-500); background: var(--amber-50); }
.ward-alert-yellow:hover { background: var(--amber-100); }

.ward-quick-form {
  display: inline-flex; align-items: center; gap: 4px; margin-left: 8px;
}
.ward-quick-form input[type="number"] {
  width: 56px; padding: 3px 5px; border: 1px solid var(--border); border-radius: var(--radius-xs);
  font-size: 0.75rem; font-family: var(--font); text-align: center;
}
.ward-quick-form input[type="number"]:focus {
  outline: none; border-color: var(--blue-500); box-shadow: 0 0 0 2px var(--blue-100);
}
.ward-quick-form .btn-sm {
  padding: 3px 8px; font-size: 0.72rem; background: var(--green-600); color: #fff;
  border: none; border-radius: var(--radius-xs); cursor: pointer;
}
.ward-quick-form .btn-sm:hover { background: var(--blue-700); }

/* ── Responsive ── */
@media (max-width: 1200px) {
  .kpi-row { grid-template-columns: repeat(2, 1fr); }
  .kpi-row-5 { grid-template-columns: repeat(3, 1fr); }
  .analytics-grid { grid-template-columns: 1fr; }
  .diary-panel { grid-template-columns: 1fr; }
  .pd-mini-charts { grid-template-columns: 1fr; }
}
@media (max-width: 1024px) {
  .kanban { grid-template-columns: repeat(2, 1fr); }
  .detail-grid { grid-template-columns: 1fr; }
  .pd-two-col { grid-template-columns: 1fr; }
  .pd-mini-charts { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 768px) {
  .sidebar { display: none !important; }
  .layout { display: block !important; }
  .main { padding: 0 !important; max-width: 100vw; overflow-x: hidden; }
  .kanban { grid-template-columns: 1fr; }
  .form-grid { grid-template-columns: 1fr; }
  .span-2 { grid-column: span 1; }
  .form-grid-compact { grid-template-columns: repeat(2, 1fr); }
  .kpi-row { grid-template-columns: 1fr 1fr; }
  .search-input { width: 140px; }
  .search-input:focus { width: 180px; }
  .pd-mini-charts { grid-template-columns: 1fr; }
  .pd-metrics-strip { flex-direction: column; }
  .pd-diary-grid { grid-template-columns: repeat(2, 1fr); }
  .pd-inline-grid { grid-template-columns: 1fr; }
  .pd-field-wide { grid-column: span 1; }

  /* Patient detail — mobile */
  .pd-header { flex-wrap: wrap; gap: 8px; }
  .pd-name { font-size: 1rem; }
  .pd-avatar { width: 40px; height: 40px; font-size: 0.9rem; }
  .pd-close { display: none; }

  /* Stage pills — horizontal scroll */
  .pd-stage-pills { overflow-x: auto; -webkit-overflow-scrolling: touch; flex-wrap: nowrap; gap: 4px; padding-bottom: 4px; }
  .pd-pill { padding: 6px 10px; font-size: 0.72rem; flex-shrink: 0; }

  /* Tabs — larger touch targets, scrollable */
  .pd-tabs { padding: 0 12px; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .pd-tab { padding: 12px 14px; font-size: 0.82rem; min-height: 44px; }

  /* KPI strip — wrap to grid */
  .pd-kpi-mobile { flex-wrap: wrap !important; }

  /* Table — compact font */
  .pd-table { font-size: 0.72rem; }
  .pd-table th { padding: 6px 6px; font-size: 0.65rem; }
  .pd-table td { padding: 6px 6px; }

  /* Profile form — single column */
  .pf-grid { grid-template-columns: 1fr !important; }
  .pf-grid label.wide { grid-column: span 1; }

  /* Charts — full width */
  .pd-charts { grid-template-columns: 1fr; }
  .pd-chart-box { min-height: auto; }

  /* Two-column to single */
  .pd-two-col { grid-template-columns: 1fr; }

  /* Cards — less padding */
  .pd-card { margin-bottom: 8px; }
  .pd-card-hdr { padding: 8px 12px; }
  .pd-card-body { padding: 8px 12px; }

  /* KPI strip — mobile grid */
  .kpi-strip-wrap { padding: 12px 14px 10px; }
  .kpi-op-line { margin-bottom: 10px; }
  .kpi-op-name { font-size: 0.95rem; }
  .kpi-op-days { font-size: 0.95rem; }
  .kpi-vitals {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
  }
  .kpi-vital {
    padding: 8px 10px;
    background: #fff;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
  }
  .kpi-vital-bordered {
    border-left: 1px solid #e2e8f0;
    padding: 8px 10px;
  }
  .kpi-vital-label { font-size: 0.65rem; }
  .kpi-vital-val { font-size: 1.15rem; }

  /* Kanban cards — full width, larger touch */
  .kanban-card { padding: 14px 16px; }
  .kanban-card-name { font-size: 0.88rem; }

  /* Bottom nav padding */
  .main { padding-bottom: 70px !important; }
}

/* ── Mobile bottom navigation ── */
.mobile-nav {
  display: none;
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 1000;
  background: rgba(255,255,255,0.92);
  -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px);
  border-top: 1px solid rgba(0,0,0,0.08);
  padding: 8px 0 max(env(safe-area-inset-bottom, 8px), 8px);
  justify-content: space-around; align-items: flex-start;
  box-shadow: 0 -1px 0 rgba(0,0,0,0.06);
}
/* Reserve space for mobile-nav so content doesn't hide under it + lock horizontal scroll */
@media (max-width: 768px) {
  html, body { max-width: 100vw; overflow-x: hidden; }
  body { padding-bottom: calc(72px + env(safe-area-inset-bottom, 0px)); }
}

/* ════════════════════════════════════════════════
   Mobile-first universal patches (Steps 6-7)
   ════════════════════════════════════════════════ */

/* Bottom-sheet style for ALL modals on mobile */
@media (max-width: 768px) {
  .pd-modal-bg, .psy-modal-bg, .qc-modal-bg, .dw-modal-bg {
    align-items: flex-end !important;
    padding: 0 !important;
  }
  .pd-modal-box, .psy-modal-box, .qc-modal-box, .dw-modal-box,
  .pd-modal-bg > div, .psy-modal-bg > div {
    width: 100% !important;
    max-width: 100% !important;
    border-radius: 16px 16px 0 0 !important;
    max-height: 92vh;
    overflow-y: auto;
    animation: bsheet-up .22s ease-out;
  }
  /* drag-handle visual cue */
  .pd-modal-box::before, .psy-modal-box::before, .qc-modal-box::before, .dw-modal-box::before {
    content: ''; display: block; width: 40px; height: 4px; border-radius: 2px;
    background: #D9D8D1; margin: 8px auto 0;
  }
}
@keyframes bsheet-up { from { transform: translateY(100%); } to { transform: translateY(0); } }

/* Toast helper (success/info/error) */
.toast { pointer-events: auto; padding: 10px 14px; border-radius: 10px; font-size: 13px;
  font-weight: 500; color: #fff; box-shadow: 0 8px 24px rgba(0,0,0,0.18); animation: toast-in .22s ease-out; max-width: 320px; }
.toast.success { background: oklch(0.45 0.15 155); }
.toast.info    { background: oklch(0.42 0.16 252); }
.toast.error   { background: oklch(0.50 0.18 25); }
.toast.fade    { animation: toast-out .25s ease-in forwards; }
@keyframes toast-in  { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
@keyframes toast-out { to   { opacity: 0; transform: translateY(8px); } }
@media (max-width: 768px) {
  .toast-container { left: 16px !important; right: 16px !important; bottom: calc(80px + env(safe-area-inset-bottom, 0px)) !important; }
  .toast { max-width: none; }
}

/* Disable hover-only interactions on touch devices */
@media (hover: none) {
  .wd-card:hover, .pd-section:hover, .diary-archive-card:hover { background: inherit; border-color: inherit; }
}

/* Mobile FAB (Floating Action Button) — hidden on desktop */
.mobile-fab {
  display: none;
  position: fixed;
  right: 16px;
  bottom: calc(80px + env(safe-area-inset-bottom, 0px));
  width: 56px; height: 56px;
  border-radius: 50%;
  background: oklch(0.42 0.16 252);
  color: #fff;
  align-items: center; justify-content: center;
  box-shadow: 0 8px 20px -4px oklch(0.42 0.16 252 / 0.45), 0 4px 8px rgba(0,0,0,0.10);
  z-index: 999;
  text-decoration: none;
  transition: transform .12s ease;
}
.mobile-fab:active { transform: scale(0.94); }
@media (max-width: 768px) {
  .mobile-fab { display: inline-flex; }
  .app-page-newbtn { display: none !important; }
}
.mobile-nav-item {
  display: flex; flex-direction: column; align-items: center; gap: 3px;
  text-decoration: none; color: #94a3b8; font-size: 0.62rem; font-weight: 500;
  padding: 4px 12px; border-radius: 10px; transition: all 0.15s;
  min-width: 56px; min-height: 44px; justify-content: center;
  -webkit-tap-highlight-color: transparent;
}
.mobile-nav-item svg { stroke: #94a3b8; transition: stroke 0.15s; width: 24px; height: 24px; }
.mobile-nav-item.active { color: #6366f1; }
.mobile-nav-item.active svg { stroke: #6366f1; }
.mobile-nav-item:active { opacity: 0.7; }
@media (max-width: 768px) {
  .mobile-nav { display: flex; }
}

/* ── Landscape optimization ── */
@media (max-width: 768px) and (orientation: landscape) {
  .mobile-nav { padding: 4px 0; }
  .mobile-nav-item { flex-direction: row; gap: 6px; font-size: 0.7rem; min-height: 36px; }
  .mobile-nav-item svg { width: 18px; height: 18px; }
  .kpi-vitals { grid-template-columns: repeat(4, 1fr) !important; }
  .kpi-strip-wrap { padding: 8px 14px 6px; }
}

/* ── Chat with patient ── */
.pd-chat-card { background: var(--white); border: 1px solid var(--border); border-radius: var(--radius-sm); overflow: hidden; margin-bottom: 12px; display: flex; flex-direction: column; }
.pd-chat-header { display: flex; justify-content: space-between; align-items: center; padding: 8px 14px; font-size: 0.82rem; font-weight: 600; border-bottom: 1px solid var(--border); background: var(--surface); }
.pd-chat-status { font-size: 0.68rem; font-weight: 500; padding: 2px 8px; border-radius: 10px; }
.pd-chat-online { background: #DCFCE7; color: #166534; }
.pd-chat-offline { background: #F1F5F9; color: #64748B; }
.pd-chat-messages { max-height: 180px; min-height: 60px; overflow-y: auto; padding: 10px; background: #f8fafc; flex: 1; }
.pd-chat-empty { text-align: center; color: var(--text-muted); font-size: 0.75rem; padding: 16px 0; }
.pd-chat-inactive { text-align: center; padding: 16px; color: var(--text-muted); font-size: 0.78rem; }
.pd-chat-form { display: flex; gap: 6px; padding: 8px; border-top: 1px solid var(--border); }
.pd-chat-input { flex: 1; padding: 6px 10px; border: 1px solid var(--border); border-radius: var(--radius-xs); font-size: 0.78rem; font-family: var(--font); }
.pd-chat-send { padding: 6px 12px; background: #6366F1; color: white; border: none; border-radius: var(--radius-xs); font-size: 0.85rem; cursor: pointer; min-width: 36px; }
.pd-chat-send:hover { background: #4f46e5; }
.pd-chat-msg { margin-bottom: 6px; }
.pd-chat-in { text-align: left; }
.pd-chat-out { text-align: right; }
.pd-chat-bubble { display: inline-block; max-width: 80%; padding: 6px 10px; border-radius: 10px; font-size: 0.75rem; line-height: 1.35; white-space: pre-wrap; word-break: break-word; }
.pd-chat-bubble-in { background: #E2E8F0; color: var(--text); border-bottom-left-radius: 2px; }
.pd-chat-bubble-out { background: #6366F1; color: #fff; border-bottom-right-radius: 2px; }
.pd-chat-time { font-size: 0.62rem; color: var(--text-muted); margin-top: 1px; }

/* ── Exam progress (patient list) ── */
.exam-progress-wrap { display:flex; align-items:center; gap:6px; min-width:90px; }
.exam-progress-bar { flex:1; height:6px; background:#e2e8f0; border-radius:3px; overflow:hidden; min-width:48px; }
.exam-progress-fill { height:100%; border-radius:3px; background:#f59e0b; transition:width 0.3s; }
.exam-progress-fill.exam-half { background:#3b82f6; }
.exam-progress-fill.exam-done { background:#10b981; }
.exam-progress-text { font-size:0.7rem; font-weight:600; color:#64748b; white-space:nowrap; }
.pt-exam { min-width:100px; }

/* ── Exam progress (patient detail header tag) ── */
.pd-tag-exam { background:#fef3c7; color:#92400e; }
.pd-tag-exam-half { background:#dbeafe; color:#1e40af; }
.pd-tag-exam-done { background:#dcfce7; color:#065f46; }

/* ── Exam progress strip (patient detail) ── */
.pd-exam-strip { display:flex; align-items:center; gap:10px; padding:6px 24px; background:#fff; border-bottom:1px solid #e2e8f0; flex-shrink:0; }
.pd-exam-label { font-size:0.72rem; font-weight:600; color:#64748b; text-transform:uppercase; letter-spacing:0.3px; white-space:nowrap; }
.pd-exam-bar-outer { flex:1; height:8px; background:#e2e8f0; border-radius:4px; overflow:hidden; max-width:280px; }
.pd-exam-bar-inner { height:100%; border-radius:4px; background:#f59e0b; transition:width 0.3s; }
.pd-exam-bar-inner.exam-half { background:#3b82f6; }
.pd-exam-bar-inner.exam-done { background:#10b981; }
.pd-exam-count { font-size:0.78rem; font-weight:700; color:#1e293b; }
.pd-exam-pct { font-size:0.72rem; font-weight:600; color:#64748b; }
.pd-exam-op-name { font-size:0.7rem; font-weight:600; color:#7c3aed; background:#ede9fe; padding:2px 8px; border-radius:100px; white-space:nowrap; }
.pd-exam-empty { font-size:0.78rem; color:#94a3b8; font-style:italic; }
.pd-exam-assign-form { display:flex; align-items:center; gap:6px; }
.pd-exam-select { font-size:0.74rem; padding:4px 8px; border:1px solid #e2e8f0; border-radius:6px; color:#334155; background:#fff; cursor:pointer; }
.pd-exam-select:focus { outline:none; border-color:#93c5fd; box-shadow:0 0 0 2px rgba(59,130,246,0.15); }
.pd-exam-assign-btn { font-size:0.72rem; font-weight:600; padding:4px 14px; border:none; border-radius:6px; background:#3b82f6; color:#fff; cursor:pointer; white-space:nowrap; transition:background 0.15s; }
.pd-exam-assign-btn:hover { background:#2563eb; }
.pd-exam-send-btn { display:flex; align-items:center; gap:4px; font-size:0.68rem; font-weight:600; padding:3px 10px; border:1px solid #e2e8f0; border-radius:6px; background:#fff; cursor:pointer; white-space:nowrap; transition:all 0.15s; }
.pd-exam-send-tg { color:#229ED9; }
.pd-exam-send-tg:hover { background:#e8f4fd; border-color:#229ED9; }
.pd-exam-send-max { color:#0077FF; }
.pd-exam-send-max:hover { background:#e6f0ff; border-color:#0077FF; }
.pd-exam-copy-btn { display:flex; align-items:center; gap:4px; font-size:0.68rem; font-weight:600; padding:3px 8px; border:1px solid #e2e8f0; border-radius:6px; background:#fff; color:#64748b; cursor:pointer; white-space:nowrap; transition:all 0.15s; }
.pd-exam-copy-btn:hover { background:#f1f5f9; border-color:#94a3b8; }
.pd-exam-copy-btn.copied { background:#dcfce7; color:#059669; border-color:#bbf7d0; }
.pd-exam-reassign-btn { font-size:0.68rem; font-weight:500; padding:3px 10px; border:1px solid #e2e8f0; border-radius:6px; background:#fff; color:#64748b; cursor:pointer; white-space:nowrap; transition:all 0.15s; }
.pd-exam-reassign-btn:hover { background:#f1f5f9; color:#334155; }
.pd-exam-assign-dropdown { align-items:center; gap:6px; margin-left:4px; }

/* ── Intake section (patient questionnaire) — single-column stack ── */
.intake-grid { display:block; padding:4px 18px 8px; }
.intake-field { display:grid; grid-template-columns:180px 1fr; gap:14px; padding:9px 4px; border-bottom:1px solid #E4E2DA; align-items:start; }
.intake-field:last-child { border-bottom:none; }
.intake-field-label { font-size:10px; font-weight:500; text-transform:uppercase; letter-spacing:0.05em; color:#8F949A; font-family:'IBM Plex Mono', ui-monospace, monospace; padding-top:2px; line-height:1.4; }
.intake-field-value { font-size:13px; color:#14181C; line-height:1.5; white-space:pre-wrap; word-break:break-word; }
.intake-field-highlight { background:#eff6ff; border-radius:6px; padding-left:12px; padding-right:12px; }
.intake-field-highlight .intake-field-label { color:#1e40af; }
.intake-field-highlight .intake-field-value { color:#1e3a8a; }
.intake-field-alert { background:#fef2f2; border-radius:6px; padding-left:12px; padding-right:12px; }
.intake-field-alert .intake-field-label { color:#b91c1c; }
.intake-field-alert .intake-field-value { color:#991b1b; font-weight:500; }
.intake-link { color:#3b82f6; text-decoration:none; font-size:13px; word-break:break-all; }
.intake-link:hover { text-decoration:underline; }
.intake-anamnesis-bar { padding:10px 18px; border-top:1px solid #E4E2DA; background:#f8fafc; }
.intake-anamnesis-btn { display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:600; padding:8px 14px; border:1px solid #3b82f6; border-radius:8px; background:#fff; color:#3b82f6; cursor:pointer; transition:all 0.15s; }
.intake-anamnesis-btn:hover { background:#eff6ff; }
@media (max-width:640px) { .intake-field { grid-template-columns:1fr; gap:4px; } .intake-field-label { padding-top:0; } }

/* ═══════════════════════════════════════════
   Quick Create Modal — funnel 2 (walk-in)
   ═══════════════════════════════════════════ */
.qc-modal-bg {
  display:none; position:fixed; inset:0;
  background:rgba(15,23,42,0.45);
  z-index:1000; align-items:flex-start; justify-content:center;
  backdrop-filter:blur(3px); padding:48px 16px;
  overflow-y:auto;
}
.qc-modal-bg.open { display:flex; }
.qc-modal {
  background:#fff; border-radius:16px;
  width:520px; max-width:100%;
  box-shadow:0 25px 60px rgba(0,0,0,0.25);
  padding:28px;
  animation:qcSlideIn 0.2s ease-out;
}
@keyframes qcSlideIn {
  from { transform:translateY(-12px); opacity:0; }
  to { transform:translateY(0); opacity:1; }
}
.qc-modal-head { margin-bottom:22px; }
.qc-modal-head h3 {
  margin:0 0 6px; font-size:1.15rem; font-weight:700;
  color:#0f172a; letter-spacing:-0.3px;
}
.qc-modal-sub {
  margin:0; font-size:0.82rem; color:#64748b; line-height:1.5;
}

/* Mode tabs */
.qc-mode-tabs {
  display:grid; grid-template-columns:1fr 1fr; gap:8px;
  margin-bottom:20px;
}
.qc-mode-tab {
  padding:14px 14px; cursor:pointer;
  border:2px solid #e2e8f0; border-radius:12px;
  background:#fff; transition:all 0.15s;
  text-align:left;
}
.qc-mode-tab:hover { border-color:#94a3b8; }
.qc-mode-tab.qc-mode-active {
  border-color:#3b82f6;
  background:#eff6ff;
  box-shadow:0 0 0 3px rgba(59,130,246,0.1);
}
.qc-mode-title {
  font-size:0.86rem; font-weight:700; color:#0f172a;
  margin-bottom:4px;
}
.qc-mode-tab.qc-mode-active .qc-mode-title { color:#1e40af; }
.qc-mode-desc {
  font-size:0.72rem; color:#64748b; line-height:1.45;
}

/* ── Consultation mode (Очно / Онлайн) ── */
.qc-cmode-row { margin-bottom: 18px; }
.qc-cmode-label {
  font-size: 0.74rem; font-weight: 600; color: #64748b;
  text-transform: uppercase; letter-spacing: 0.06em;
  margin-bottom: 8px;
}
.qc-cmode-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.qc-cmode-tab {
  padding: 12px 14px; cursor: pointer;
  border: 2px solid #e2e8f0; border-radius: 10px;
  background: #fff; transition: all 0.15s;
  display: flex; align-items: center; gap: 10px;
}
.qc-cmode-tab:hover { border-color: #94a3b8; }
.qc-cmode-tab.qc-cmode-active {
  border-color: #10b981;
  background: #ecfdf5;
  box-shadow: 0 0 0 3px rgba(16,185,129,0.10);
}
.qc-cmode-icon { font-size: 22px; flex-shrink: 0; }
.qc-cmode-tab-title {
  font-size: 0.86rem; font-weight: 700; color: #0f172a;
  line-height: 1.2;
}
.qc-cmode-tab.qc-cmode-active .qc-cmode-tab-title { color: #047857; }
.qc-cmode-tab-desc {
  font-size: 0.7rem; color: #64748b; line-height: 1.35; margin-top: 2px;
}

/* ── Success banner (consultation mode hint) ── */
.qc-mode-banner {
  display: none; align-items: flex-start; gap: 12px;
  padding: 12px 16px; margin: 0 0 18px;
  background: linear-gradient(135deg, #ecfdf5 0%, #f0fdf4 100%);
  border: 1px solid #a7f3d0; border-left: 3px solid #10b981;
  border-radius: 10px;
}
.qc-mode-banner-icon { font-size: 20px; flex-shrink: 0; }
.qc-mode-banner-text {
  font-size: 0.78rem; color: #065f46; line-height: 1.55;
}
.qc-field { margin-bottom:14px; }
.qc-field label {
  display:block; font-size:0.78rem; font-weight:600;
  color:#334155; margin-bottom:6px;
}
.qc-req { color:#dc2626; font-weight:700; }
.qc-opt {
  font-weight:500; font-size:0.7rem; color:#94a3b8;
  margin-left:4px; text-transform:lowercase;
}
.qc-field input, .qc-field select {
  width:100%; padding:11px 14px;
  border:1.5px solid #e2e8f0; border-radius:10px;
  font-size:0.92rem; font-family:inherit; color:#0f172a;
  background:#fff; transition:all 0.15s;
  -webkit-appearance:none;
}
.qc-field input:focus, .qc-field select:focus {
  outline:none; border-color:#3b82f6;
  box-shadow:0 0 0 3px rgba(59,130,246,0.1);
}
.qc-actions {
  display:flex; gap:10px; justify-content:flex-end;
  margin-top:20px;
}
.qc-actions .btn {
  padding:11px 20px; font-size:0.86rem; font-weight:600;
  border-radius:10px; cursor:pointer;
}

/* Success screen */
.qc-success-head {
  text-align:center; margin-bottom:24px;
  padding-bottom:20px; border-bottom:1px solid #e2e8f0;
}
.qc-success-icon {
  width:56px; height:56px; border-radius:50%;
  background:#dcfce7; color:#16a34a;
  font-size:1.6rem; font-weight:700;
  display:flex; align-items:center; justify-content:center;
  margin:0 auto 12px;
}
.qc-success-head h3 {
  margin:0 0 6px; font-size:1.2rem; font-weight:700; color:#0f172a;
}

/* Share buttons */
.qc-share-group {
  display:flex; flex-direction:column; gap:10px;
  margin-bottom:18px;
}
.qc-share-btn {
  display:flex; align-items:center; gap:14px;
  padding:14px 18px; border-radius:12px;
  text-decoration:none; font-size:0.95rem; font-weight:600;
  color:#fff; transition:all 0.15s;
  border:none;
}
.qc-share-btn:hover { transform:translateY(-1px); box-shadow:0 6px 16px rgba(0,0,0,0.15); }
.qc-share-icon {
  width:32px; height:32px; border-radius:8px;
  background:rgba(255,255,255,0.2);
  display:flex; align-items:center; justify-content:center;
  font-size:1rem; font-weight:700;
}
.qc-share-tg { background:#229ED9; }
.qc-share-max { background:#0077FF; }
.qc-share-qr { background:#0f172a; cursor:pointer; font-family:inherit; border:none; text-align:left; }

/* ═══ Documents received strip in patient detail ═══ */
.pd-docs-strip {
  display:flex; align-items:center; gap:8px; flex-wrap:wrap;
  padding:10px 16px;
  background:#f8fafc; border-bottom:1px solid #e2e8f0;
  font-size:0.78rem;
}
.pd-docs-label { color:#64748b; font-weight:500; }
.pd-docs-mark {
  padding:5px 12px; border:1px solid #cbd5e1; background:#fff;
  border-radius:6px; font-size:0.76rem; color:#334155;
  cursor:pointer; font-family:inherit;
  transition:all 0.15s;
}
.pd-docs-mark:hover { border-color:#3b82f6; color:#3b82f6; }
.pd-docs-badge {
  display:inline-flex; align-items:center; gap:6px;
  padding:5px 12px; background:#dcfce7; color:#15803d;
  border-radius:6px; font-weight:600; font-size:0.78rem;
}
.pd-docs-clear {
  width:22px; height:22px; border-radius:50%;
  border:none; background:#fee2e2; color:#991b1b;
  cursor:pointer; font-size:0.95rem; line-height:1;
}
.pd-docs-clear:hover { background:#fecaca; }

/* Bot send button (ghost-bot color) */
.pd-exam-send-bot { background:#7c3aed; color:#fff; }
.pd-exam-send-bot:hover { background:#6d28d9; }

/* ═══ Hospitalization readiness checklist ═══ */
.hr-checklist { display:flex; flex-direction:column; gap:8px; margin-bottom:18px; }
.hr-item {
  display:flex; gap:12px; align-items:center;
  padding:12px 14px;
  background:#fff; border:1.5px solid #e2e8f0;
  border-radius:10px;
  transition:all 0.15s;
}
.hr-item.hr-done { background:#f0fdf4; border-color:#bbf7d0; }
.hr-check-label {
  display:flex; gap:12px; align-items:center;
  cursor:pointer; flex:1; user-select:none;
}
.hr-check-label input[type="checkbox"] {
  position:absolute; opacity:0; pointer-events:none;
}
.hr-check-mark {
  width:22px; height:22px; border-radius:6px;
  border:2px solid #cbd5e1; background:#fff;
  display:inline-flex; align-items:center; justify-content:center;
  flex-shrink:0; transition:all 0.15s;
}
.hr-check-label input:checked ~ .hr-check-mark {
  background:#16a34a; border-color:#16a34a;
}
.hr-check-label input:checked ~ .hr-check-mark::after {
  content:'✓'; color:#fff; font-size:0.92rem; font-weight:700;
}
.hr-check-title { font-size:0.86rem; font-weight:600; color:#0f172a; }
.hr-check-meta { font-size:0.74rem; color:#64748b; margin-top:2px; }
.hr-static {
  width:22px; height:22px; border-radius:6px;
  background:#e2e8f0; color:#64748b;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:0.85rem; font-weight:700; flex-shrink:0;
}
.hr-item.hr-done .hr-static { background:#16a34a; color:#fff; }

/* Secretary block */
.hr-secretary-block {
  margin-top:18px; padding:18px;
  background:linear-gradient(135deg,#eff6ff,#dbeafe);
  border:1.5px solid #93c5fd;
  border-radius:12px;
}
.hr-secretary-title {
  font-size:0.95rem; font-weight:700; color:#1e40af;
  margin-bottom:6px;
}
.hr-secretary-desc {
  font-size:0.82rem; color:#334155; line-height:1.6;
  margin-bottom:14px;
}
.hr-secretary-btn {
  width:100%; padding:14px; font-size:0.95rem; font-weight:600;
  background:#1e40af; color:#fff; border:none; border-radius:10px;
  cursor:pointer; transition:all 0.15s;
}
.hr-secretary-btn:hover { background:#1e3a8a; transform:translateY(-1px); box-shadow:0 4px 12px rgba(30,64,175,0.3); }
.hr-sent-info {
  margin-top:10px; padding:10px 12px;
  background:#dcfce7; color:#15803d;
  border-radius:8px; font-size:0.82rem; font-weight:600;
}
.hr-secretary-contact {
  margin-top:12px; padding-top:12px;
  border-top:1px solid #bfdbfe;
  font-size:0.84rem; color:#1e40af;
}
.hr-secretary-contact a { color:#1e40af; font-weight:600; text-decoration:none; }
.hr-secretary-contact a:hover { text-decoration:underline; }
.hr-locked {
  margin-top:18px; padding:14px;
  background:#f8fafc; border:1px dashed #cbd5e1;
  border-radius:8px; font-size:0.8rem; color:#64748b; text-align:center;
}

/* ═══ Post-op consilium morphology form ═══ */
.postop-grid {
  display:grid; grid-template-columns:1fr 1fr;
  gap:12px; margin-bottom:14px;
}
.postop-field { display:flex; flex-direction:column; }
.postop-wide { grid-column:1 / -1; }
.postop-field label {
  font-size:0.75rem; font-weight:600; color:#475569;
  margin-bottom:5px;
}
.postop-field input, .postop-field select, .postop-field textarea {
  padding:10px 12px;
  border:1.5px solid #e2e8f0; border-radius:8px;
  font-size:0.86rem; font-family:inherit; color:#0f172a;
  background:#fff;
}
.postop-field input:focus, .postop-field select:focus, .postop-field textarea:focus {
  outline:none; border-color:#3b82f6;
  box-shadow:0 0 0 3px rgba(59,130,246,0.1);
}
.postop-actions { text-align:right; margin-bottom:18px; }

.postop-asklepius {
  margin-top:18px; padding:16px;
  background:#fef3c7; border:1.5px solid #fcd34d;
  border-radius:10px;
}
.postop-asklepius .hr-check-title { color:#78350f; }
.postop-asklepius .hr-check-meta { color:#92400e; }
.postop-asklepius .hr-check-label input:checked ~ .hr-check-mark {
  background:#d97706; border-color:#d97706;
}

@media (max-width:640px) {
  .postop-grid { grid-template-columns:1fr; }
}

/* ═══ Universal QR Modal ═══ */
.qr-modal-bg {
  display:none; position:fixed; inset:0;
  background:rgba(15,23,42,0.65);
  z-index:2000; align-items:center; justify-content:center;
  backdrop-filter:blur(4px); padding:24px;
}
.qr-modal-bg.open { display:flex; }
.qr-modal {
  background:#fff; border-radius:18px;
  width:380px; max-width:100%;
  padding:28px;
  box-shadow:0 25px 60px rgba(0,0,0,0.3);
  animation:qcSlideIn 0.2s ease-out;
}
.qr-modal-head { text-align:center; margin-bottom:20px; }
.qr-modal-head h3 {
  margin:0 0 6px; font-size:1.15rem; font-weight:700; color:#0f172a;
}
.qr-modal-head p { margin:0; font-size:0.82rem; color:#64748b; }
.qr-canvas {
  background:#fff; padding:12px;
  border:2px solid #e2e8f0; border-radius:12px;
  margin-bottom:16px;
}
.qr-canvas img { max-width:100%; }
.qr-url {
  background:#f8fafc; padding:10px 12px;
  border-radius:8px; font-size:0.74rem;
  font-family:'SF Mono',Menlo,monospace;
  color:#3b82f6; word-break:break-all;
  margin-bottom:16px; text-align:center;
}
.qr-close-btn { width:100%; padding:12px; }

/* Copy link block */
.qc-copy-block {
  background:#f8fafc; border:1px solid #e2e8f0;
  border-radius:12px; padding:14px;
  margin-bottom:18px;
}
.qc-copy-block label {
  display:block; font-size:0.74rem; font-weight:600;
  color:#64748b; margin-bottom:8px;
  text-transform:uppercase; letter-spacing:0.4px;
}
.qc-copy-row {
  display:flex; gap:8px; align-items:stretch;
}
.qc-copy-row input {
  flex:1; padding:10px 12px;
  border:1.5px solid #e2e8f0; border-radius:8px;
  font-size:0.82rem; font-family:'SF Mono',Menlo,Consolas,monospace;
  color:#3b82f6; background:#fff;
}
.qc-copy-row .btn {
  padding:10px 16px; font-size:0.82rem; white-space:nowrap;
  border-radius:8px;
}

@media (max-width:480px) {
  .qc-modal { padding:22px; }
  .qc-modal-head h3 { font-size:1.05rem; }
  .qc-share-btn { padding:12px 14px; font-size:0.88rem; }
  .qc-copy-row { flex-direction:column; }
}