:root{--bg-primary:#060D1A;--bg-secondary:#0C1628;--bg-card:rgba(17,30,53,0.8);--bg-sidebar:#0A1525;--cyan:#0EA5E9;--cyan-dim:rgba(14,165,233,0.12);--cyan-glow:rgba(14,165,233,0.35);--purple:#6366F1;--purple-dim:rgba(99,102,241,0.12);--purple-glow:rgba(99,102,241,0.35);--green:#10B981;--orange:#F59E0B;--red:#EF4444;--grad-primary:linear-gradient(135deg,#0EA5E9 0%,#6366F1 100%);--grad-hero:linear-gradient(135deg,#060D1A 0%,#0C1E3A 50%,#060D1A 100%);--grad-green:linear-gradient(135deg,#10B981 0%,#059669 100%);--grad-orange:linear-gradient(135deg,#F59E0B 0%,#D97706 100%);--grad-purple:linear-gradient(135deg,#6366F1 0%,#4F46E5 100%);--grad-cyan:linear-gradient(135deg,#0EA5E9 0%,#0284C7 100%);--grad-blue:linear-gradient(135deg,#0EA5E9 0%,#0284C7 100%);--grad-card:linear-gradient(135deg,rgba(14,165,233,0.06) 0%,rgba(99,102,241,0.06) 100%);--text-primary:#F1F5F9;--text-secondary:#94A3B8;--text-muted:#475569;--text-accent:#38BDF8;--border:rgba(148,163,184,0.1);--border-accent:rgba(14,165,233,0.35);--border-glow:rgba(14,165,233,0.6);--shadow-sm:0 2px 8px rgba(0,0,0,0.4);--shadow:0 8px 32px rgba(0,0,0,0.5);--shadow-lg:0 20px 60px rgba(0,0,0,0.6);--shadow-cyan:0 0 30px rgba(14,165,233,0.15);--shadow-purple:0 0 30px rgba(99,102,241,0.15);--shadow-glow:0 0 40px rgba(14,165,233,0.2),0 0 80px rgba(99,102,241,0.1);--glass-bg:rgba(17,30,53,0.6);--glass-border:rgba(148,163,184,0.1);--glass-blur:blur(20px);--sidebar-width:260px;--topbar-height:64px;--radius-sm:8px;--radius:12px;--radius-lg:20px;--radius-xl:28px;--font:"Inter",-apple-system,BlinkMacSystemFont,sans-serif;--transition:all 0.3s cubic-bezier(0.4,0,0.2,1);--transition-fast:all 0.15s ease;--primary:#0EA5E9;--primary-light:rgba(14,165,233,0.12);--secondary:#10B981;--white:rgba(255,255,255,0.06);--gray:#94A3B8;--gray-light:rgba(255,255,255,0.04);--gray-border:rgba(148,163,184,0.1);--shadow-card:0 8px 32px rgba(0,0,0,0.5);--radius-card:12px}*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--font);background:var(--bg-primary);color:var(--text-primary);line-height:1.6;min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased}a{color:var(--cyan);text-decoration:none;transition:var(--transition-fast)}a:hover{color:#fff}img{max-width:100%;display:block}h1,h2,h3,h4,h5,h6{font-weight:700;line-height:1.2;color:var(--text-primary)}p{color:var(--text-secondary)}input,select,textarea,button{font-family:inherit}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#0EA5E9,#6366F1);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#0EA5E9}@keyframes fadeInUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInDown{from{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInLeft{from{opacity:0;transform:translateX(-30px)}to{opacity:1;transform:translateX(0)}}@keyframes fadeInRight{from{opacity:0;transform:translateX(30px)}to{opacity:1;transform:translateX(0)}}@keyframes scaleIn{from{opacity:0;transform:scale(0.85)}to{opacity:1;transform:scale(1)}}@keyframes pulseGlow{0%,100%{box-shadow:0 0 10px rgba(14,165,233,0.4)}50%{box-shadow:0 0 30px rgba(14,165,233,0.7),0 0 60px rgba(99,102,241,0.3)}}@keyframes pulseDot{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.4);opacity:0.7}}@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}@keyframes gradientShift{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}@keyframes shine{0%{left:-100%}100%{left:200%}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes blink{0%,100%{opacity:1}50%{opacity:0}}@keyframes slideInRight{from{transform:translateX(120%);opacity:0}to{transform:translateX(0);opacity:1}}@keyframes slideOutRight{from{transform:translateX(0);opacity:1}to{transform:translateX(120%);opacity:0}}@keyframes wave{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}@keyframes shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}@keyframes bounceIn{0%{transform:scale(0.3);opacity:0}50%{transform:scale(1.05)}70%{transform:scale(0.9)}100%{transform:scale(1);opacity:1}}@keyframes counterPop{0%{transform:scale(1)}50%{transform:scale(1.15)}100%{transform:scale(1)}}@keyframes typingDot{0%,60%,100%{transform:translateY(0);opacity:0.4}30%{transform:translateY(-6px);opacity:1}}@keyframes progressFill{from{width:0%}to{width:var(--progress-width,100%)}}@keyframes particleDrift{0%{transform:translateY(0) translateX(0) scale(1);opacity:0.6}50%{transform:translateY(-40px) translateX(20px) scale(1.1);opacity:1}100%{transform:translateY(0) translateX(0) scale(1);opacity:0.6}}.app-layout{display:flex;min-height:100vh}.main-content{flex:1;margin-left:var(--sidebar-width);display:flex;flex-direction:column;min-height:100vh;transition:margin-left 0.3s ease}.sidebar{position:fixed;top:0;left:0;width:var(--sidebar-width);height:100vh;background:var(--bg-sidebar);border-right:1px solid rgba(148,163,184,0.08);display:flex;flex-direction:column;z-index:100;overflow-y:auto;overflow-x:hidden;transition:transform 0.3s ease}.sidebar-brand{display:flex;align-items:center;gap:12px;padding:24px 20px 20px;border-bottom:1px solid rgba(148,163,184,0.08)}.sidebar-brand .logo-icon{width:42px;height:42px;border-radius:var(--radius-sm);background:var(--grad-primary);display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0;box-shadow:0 4px 20px rgba(14,165,233,0.3);animation:pulseGlow 3s ease-in-out infinite}.sidebar-brand h1{font-size:16px;font-weight:800;background:var(--grad-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.sidebar-brand span{font-size:10px;color:var(--text-muted);display:block;margin-top:1px;letter-spacing:0.5px;text-transform:uppercase}.sidebar-nav{flex:1;padding:16px 12px;display:flex;flex-direction:column;gap:2px}.nav-section{font-size:10px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:var(--text-muted);padding:12px 8px 6px;display:block}.nav-item{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:var(--radius-sm);color:var(--text-secondary);font-size:14px;font-weight:500;transition:var(--transition);position:relative;overflow:hidden;cursor:pointer;text-decoration:none}.nav-item .icon{font-size:16px;width:20px;text-align:center;flex-shrink:0}.nav-item:hover{color:var(--text-primary);background:rgba(14,165,233,0.08);transform:translateX(4px)}.nav-item.active{color:#fff;background:var(--grad-primary);box-shadow:0 4px 20px rgba(14,165,233,0.25)}.nav-item.active::after{content:'';position:absolute;right:0;top:50%;transform:translateY(-50%);width:3px;height:60%;background:#fff;border-radius:2px}.sidebar-footer{padding:16px 12px;border-top:1px solid rgba(148,163,184,0.08)}.user-card{display:flex;align-items:center;gap:10px;padding:10px;border-radius:var(--radius-sm);background:rgba(255,255,255,0.03);border:1px solid rgba(148,163,184,0.08)}.user-avatar{width:36px;height:36px;border-radius:50%;background:var(--grad-primary);display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:#fff;flex-shrink:0}.user-info{flex:1;min-width:0}.user-info .name{font-size:13px;font-weight:600;color:var(--text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-info .role{font-size:11px;color:var(--text-muted);text-transform:uppercase;letter-spacing:0.5px}.logout-btn{background:none;border:none;color:var(--text-muted);cursor:pointer;font-size:16px;padding:4px;border-radius:4px;transition:var(--transition-fast);flex-shrink:0}.logout-btn:hover{color:var(--red);background:rgba(239,68,68,0.1)}.topbar{height:var(--topbar-height);background:rgba(6,13,26,0.9);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid rgba(148,163,184,0.08);display:flex;align-items:center;justify-content:space-between;padding:0 24px;position:sticky;top:0;z-index:50}.topbar-left{display:flex;align-items:center;gap:16px}.page-title{font-size:18px;font-weight:700;background:var(--grad-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.topbar-right{display:flex;align-items:center;gap:8px}.topbar-btn{width:38px;height:38px;border-radius:var(--radius-sm);background:rgba(255,255,255,0.04);border:1px solid rgba(148,163,184,0.1);color:var(--text-secondary);cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;transition:var(--transition);position:relative}.topbar-btn:hover{background:rgba(14,165,233,0.1);border-color:rgba(14,165,233,0.35);color:var(--cyan);box-shadow:0 0 15px rgba(14,165,233,0.2)}.topbar-btn .badge{position:absolute;top:4px;right:4px;width:8px;height:8px;background:var(--red);border-radius:50%;border:2px solid var(--bg-primary);animation:pulseDot 2s ease-in-out infinite}.page-body{flex:1;padding:24px;overflow-y:auto}.card{background:var(--glass-bg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--glass-border);border-radius:var(--radius-lg);padding:24px;transition:var(--transition);position:relative;overflow:hidden}.card::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,#0EA5E9,transparent);opacity:0;transition:opacity 0.3s ease}.card:hover{border-color:rgba(14,165,233,0.35);box-shadow:0 0 30px rgba(14,165,233,0.12);transform:translateY(-2px)}.card:hover::before{opacity:1}.card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;gap:12px}.card-title{font-size:16px;font-weight:700;color:var(--text-primary)}.card-subtitle{font-size:13px;color:var(--text-muted);margin-top:2px}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:24px}.stat-card{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-lg);padding:20px;display:flex;align-items:center;gap:16px;transition:var(--transition);position:relative;overflow:hidden;cursor:default}.stat-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}.stat-icon{width:52px;height:52px;border-radius:var(--radius);display:flex;align-items:center;justify-content:center;font-size:22px;flex-shrink:0;animation:float 4s ease-in-out infinite}.stat-icon.blue{background:rgba(14,165,233,0.15);box-shadow:0 4px 20px rgba(14,165,233,0.2)}.stat-icon.green{background:rgba(16,185,129,0.15);box-shadow:0 4px 20px rgba(16,185,129,0.2)}.stat-icon.orange{background:rgba(245,158,11,0.15);box-shadow:0 4px 20px rgba(245,158,11,0.2)}.stat-icon.purple{background:rgba(99,102,241,0.15);box-shadow:0 4px 20px rgba(99,102,241,0.2)}.stat-icon.cyan{background:rgba(14,165,233,0.15);box-shadow:0 4px 20px rgba(14,165,233,0.2)}.stat-icon.red{background:rgba(239,68,68,0.15);box-shadow:0 4px 20px rgba(239,68,68,0.2)}.stat-value{font-size:28px;font-weight:800;color:var(--text-primary);line-height:1;letter-spacing:-1px}.stat-label{font-size:13px;color:var(--text-muted);margin-top:4px;font-weight:500}.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:20px}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.container{max-width:1200px;margin:0 auto;padding:0 24px}.table-wrap{overflow-x:auto;border-radius:var(--radius);border:1px solid rgba(148,163,184,0.08)}table{width:100%;border-collapse:collapse;font-size:14px}thead tr{background:rgba(14,165,233,0.04);border-bottom:1px solid rgba(148,163,184,0.08)}thead th{padding:12px 16px;text-align:left;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:0.8px;color:var(--text-muted);white-space:nowrap}tbody tr{border-bottom:1px solid rgba(148,163,184,0.06);transition:var(--transition-fast)}tbody tr:last-child{border-bottom:none}tbody tr:hover{background:rgba(14,165,233,0.03)}tbody td{padding:12px 16px;color:var(--text-secondary);vertical-align:middle}tbody td b,tbody td strong{color:var(--text-primary);font-weight:600}.badge-pill{display:inline-flex;align-items:center;padding:4px 12px;border-radius:100px;font-size:11px;font-weight:700;letter-spacing:0.5px;text-transform:uppercase;white-space:nowrap}.badge-pill.pending{background:rgba(245,158,11,0.12);color:#FCD34D;border:1px solid rgba(245,158,11,0.25)}.badge-pill.confirmed{background:rgba(16,185,129,0.12);color:#34D399;border:1px solid rgba(16,185,129,0.25)}.badge-pill.completed{background:rgba(14,165,233,0.12);color:#38BDF8;border:1px solid rgba(14,165,233,0.25)}.badge-pill.cancelled{background:rgba(239,68,68,0.12);color:#F87171;border:1px solid rgba(239,68,68,0.25)}.badge-pill.patient{background:rgba(99,102,241,0.12);color:#A5B4FC;border:1px solid rgba(99,102,241,0.25)}.badge-pill.doctor{background:rgba(14,165,233,0.12);color:#38BDF8;border:1px solid rgba(14,165,233,0.25)}.badge-pill.admin{background:rgba(245,158,11,0.12);color:#FCD34D;border:1px solid rgba(245,158,11,0.25)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 20px;border-radius:var(--radius-sm);font-size:14px;font-weight:600;cursor:pointer;border:none;transition:var(--transition);position:relative;overflow:hidden;white-space:nowrap;text-decoration:none;font-family:var(--font)}.btn::after{content:'';position:absolute;top:0;left:-100%;width:60%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,0.15),transparent);transform:skewX(-20deg)}.btn:hover::after{animation:shine 0.6s ease forwards}.btn:active{transform:scale(0.97)}.btn-primary{background:var(--grad-primary);color:#fff;box-shadow:0 4px 20px rgba(14,165,233,0.3)}.btn-primary:hover{box-shadow:0 6px 30px rgba(14,165,233,0.5);transform:translateY(-2px);color:#fff}.btn-secondary{background:rgba(255,255,255,0.06);color:var(--text-secondary);border:1px solid rgba(148,163,184,0.1)}.btn-secondary:hover{background:rgba(255,255,255,0.1);color:var(--text-primary);border-color:rgba(14,165,233,0.35)}.btn-outline{background:transparent;color:var(--cyan);border:1px solid rgba(14,165,233,0.35)}.btn-outline:hover{background:rgba(14,165,233,0.1);box-shadow:0 0 20px rgba(14,165,233,0.2);color:var(--cyan)}.btn-success{background:var(--grad-green);color:#fff;box-shadow:0 4px 15px rgba(16,185,129,0.3)}.btn-success:hover{box-shadow:0 6px 25px rgba(16,185,129,0.5);transform:translateY(-2px)}.btn-danger{background:linear-gradient(135deg,#EF4444,#DC2626);color:#fff;box-shadow:0 4px 15px rgba(239,68,68,0.3)}.btn-danger:hover{box-shadow:0 6px 25px rgba(239,68,68,0.5);transform:translateY(-2px)}.btn-warning{background:var(--grad-orange);color:#fff}.btn-sm{padding:6px 14px;font-size:12px;border-radius:6px}.btn-lg{padding:14px 28px;font-size:16px;border-radius:var(--radius)}.btn-block{width:100%}.btn:disabled{opacity:0.5;cursor:not-allowed;transform:none!important}.form-group{margin-bottom:16px}.form-label{display:block;font-size:13px;font-weight:600;color:var(--text-secondary);margin-bottom:6px}.form-control{width:100%;padding:10px 14px;background:rgba(12,22,40,0.8);border:1px solid rgba(148,163,184,0.12);border-radius:var(--radius-sm);color:var(--text-primary);font-size:14px;font-family:var(--font);transition:var(--transition);outline:none;appearance:none;-webkit-appearance:none}.form-control::placeholder{color:var(--text-muted)}.form-control:focus{border-color:var(--cyan);background:rgba(14,165,233,0.04);box-shadow:0 0 0 3px rgba(14,165,233,0.12)}.form-control:hover:not(:focus){border-color:rgba(148,163,184,0.2)}select.form-control{cursor:pointer;padding-right:36px}select.form-control option{background:#0C1628;color:var(--text-primary)}textarea.form-control{resize:vertical;min-height:80px}.input-group{position:relative;display:flex;align-items:center}.input-group .input-icon{position:absolute;left:12px;font-size:16px;pointer-events:none;z-index:1}.input-group .form-control{padding-left:40px}.alert{padding:12px 16px;border-radius:var(--radius-sm);font-size:14px;font-weight:500;display:flex;align-items:center;gap:10px;margin-bottom:12px;animation:fadeInDown 0.3s ease;border:1px solid transparent}.alert-success{background:rgba(16,185,129,0.1);color:#34D399;border-color:rgba(16,185,129,0.2)}.alert-danger{background:rgba(239,68,68,0.1);color:#F87171;border-color:rgba(239,68,68,0.2)}.alert-warning{background:rgba(245,158,11,0.1);color:#FCD34D;border-color:rgba(245,158,11,0.2)}.alert-info{background:rgba(14,165,233,0.1);color:#38BDF8;border-color:rgba(14,165,233,0.2)}#alert-container{position:fixed;bottom:24px;right:24px;z-index:9999;display:flex;flex-direction:column;gap:10px;max-width:360px;width:100%}#alert-container .alert{animation:slideInRight 0.4s cubic-bezier(0.4,0,0.2,1);box-shadow:var(--shadow-lg);cursor:pointer;backdrop-filter:blur(12px)}.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.75);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:1000;display:none;align-items:center;justify-content:center;padding:20px}.modal-overlay.open{display:flex}.modal{background:#0C1628;border:1px solid rgba(14,165,233,0.2);border-radius:var(--radius-xl);width:100%;max-width:520px;max-height:90vh;overflow-y:auto;box-shadow:var(--shadow-glow);animation:scaleIn 0.3s cubic-bezier(0.4,0,0.2,1);position:relative}.modal::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:var(--grad-primary);border-radius:var(--radius-xl) var(--radius-xl) 0 0}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px 16px;border-bottom:1px solid rgba(148,163,184,0.08)}.modal-title{font-size:16px;font-weight:700;color:var(--text-primary)}.modal-close{width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,0.05);border:1px solid rgba(148,163,184,0.1);color:var(--text-muted);cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;transition:var(--transition-fast)}.modal-close:hover{background:rgba(239,68,68,0.15);color:var(--red);border-color:rgba(239,68,68,0.3)}.modal-body{padding:20px 24px}.modal-footer{display:flex;align-items:center;justify-content:flex-end;gap:10px;padding:16px 24px 20px;border-top:1px solid rgba(148,163,184,0.08)}.tabs{display:flex;gap:4px;margin-bottom:20px;background:rgba(12,22,40,0.6);border-radius:var(--radius-sm);padding:4px;border:1px solid rgba(148,163,184,0.08)}.tab-btn{flex:1;padding:8px 16px;border-radius:6px;background:none;border:none;color:var(--text-muted);font-size:13px;font-weight:600;cursor:pointer;transition:var(--transition);font-family:var(--font);white-space:nowrap}.tab-btn:hover{color:var(--text-primary);background:rgba(255,255,255,0.04)}.tab-btn.active{background:var(--grad-primary);color:#fff;box-shadow:0 2px 12px rgba(14,165,233,0.3)}.tab-pane{display:none}.tab-pane.active{display:block;animation:fadeInUp 0.3s ease}.divider{text-align:center;color:var(--text-muted);font-size:13px;margin:20px 0;position:relative}.divider::before,.divider::after{content:'';position:absolute;top:50%;width:42%;height:1px;background:rgba(148,163,184,0.1)}.divider::before{left:0}.divider::after{right:0}.chat-container{display:flex;flex-direction:column;height:calc(100vh - 120px)}.chat-wrapper{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-xl);display:flex;flex-direction:column;height:100%;overflow:hidden;backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur)}.chat-header{padding:16px 20px;border-bottom:1px solid rgba(148,163,184,0.08);display:flex;align-items:center;gap:12px;background:rgba(14,165,233,0.03);flex-shrink:0}.chat-bot-avatar{width:44px;height:44px;border-radius:50%;background:var(--grad-primary);display:flex;align-items:center;justify-content:center;font-size:22px;box-shadow:0 0 20px rgba(14,165,233,0.3);animation:pulseGlow 3s ease-in-out infinite}.chat-messages{flex:1;overflow-y:auto;padding:20px;display:flex;flex-direction:column;gap:14px;scroll-behavior:smooth;min-height:0}.chat-messages::-webkit-scrollbar{width:4px}.chat-messages::-webkit-scrollbar-thumb{background:rgba(14,165,233,0.3);border-radius:2px}.msg-row{display:flex;flex-direction:column}.msg-row.user{align-items:flex-end}.msg-row.bot{align-items:flex-start}.chat-bubble{max-width:78%;padding:12px 16px;border-radius:18px;font-size:14px;line-height:1.6;word-break:break-word;animation:fadeInUp 0.3s ease}.chat-bubble.user{background:var(--grad-primary);color:#fff;border-bottom-right-radius:4px;box-shadow:0 4px 15px rgba(14,165,233,0.25)}.chat-bubble.bot{background:rgba(17,30,53,0.8);border:1px solid rgba(148,163,184,0.1);color:var(--text-primary);border-bottom-left-radius:4px}.chat-bubble .time{font-size:10px;opacity:0.5;margin-top:6px;display:block}.quick-replies{padding:8px 20px 10px;display:flex;flex-wrap:wrap;gap:6px;border-top:1px solid rgba(148,163,184,0.06);background:rgba(0,0,0,0.1);min-height:0;max-height:120px;overflow-y:auto;flex-shrink:0}.quick-reply-btn{padding:6px 14px;border-radius:100px;background:rgba(14,165,233,0.08);border:1px solid rgba(14,165,233,0.25);color:#38BDF8;font-size:12px;font-weight:600;cursor:pointer;transition:var(--transition);white-space:nowrap;font-family:var(--font)}.quick-reply-btn:hover{background:var(--cyan);color:#000;box-shadow:0 0 12px rgba(14,165,233,0.4)}.chat-input-area{padding:12px 16px;border-top:1px solid rgba(148,163,184,0.08);display:flex;gap:10px;align-items:flex-end;background:rgba(0,0,0,0.1);flex-shrink:0}.chat-input{flex:1;background:rgba(12,22,40,0.8);border:1px solid rgba(148,163,184,0.12);border-radius:12px;padding:10px 14px;color:var(--text-primary);font-size:14px;font-family:var(--font);resize:none;outline:none;max-height:120px;transition:border-color 0.2s;line-height:1.5}.chat-input:focus{border-color:var(--cyan)}.chat-input::placeholder{color:var(--text-muted)}.typing-indicator{display:flex;gap:4px;align-items:center;padding:4px 0}.typing-dot{width:7px;height:7px;border-radius:50%;background:var(--cyan);animation:typingDot 1.4s ease-in-out infinite}.typing-dot:nth-child(2){animation-delay:0.2s}.typing-dot:nth-child(3){animation-delay:0.4s}.auth-page{display:flex;min-height:100vh;background:var(--bg-primary)}.auth-left{flex:1;background:var(--grad-hero);background-size:200% 200%;animation:gradientShift 8s ease infinite;display:flex;align-items:center;justify-content:center;padding:60px 48px;position:relative;overflow:hidden}.auth-left::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 30% 40%,rgba(14,165,233,0.1) 0%,transparent 50%),radial-gradient(circle at 70% 60%,rgba(99,102,241,0.1) 0%,transparent 50%);animation:particleDrift 8s ease-in-out infinite}.auth-left>div{position:relative;z-index:1;max-width:420px}.auth-left h2{font-size:36px;font-weight:800;color:#fff;margin-bottom:16px;line-height:1.2}.auth-left p{font-size:16px;color:rgba(255,255,255,0.7);line-height:1.7;margin-bottom:32px}.auth-features{display:flex;flex-direction:column;gap:14px}.auth-feature{display:flex;align-items:center;gap:12px;color:rgba(255,255,255,0.85);font-size:15px;font-weight:500}.auth-feature .icon{width:36px;height:36px;border-radius:var(--radius-sm);background:rgba(14,165,233,0.15);display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;border:1px solid rgba(14,165,233,0.2)}.auth-right{width:480px;display:flex;align-items:center;justify-content:center;padding:40px 32px;background:var(--bg-secondary);border-left:1px solid rgba(148,163,184,0.08)}.auth-form-wrap{width:100%;max-width:380px}.auth-logo{display:flex;align-items:center;gap:10px;margin-bottom:32px}.auth-logo .logo-icon{width:40px;height:40px;border-radius:var(--radius-sm);background:var(--grad-primary);display:flex;align-items:center;justify-content:center;font-size:18px;box-shadow:0 4px 20px rgba(14,165,233,0.3)}.auth-logo h1{font-size:18px;font-weight:800;background:var(--grad-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.auth-title{font-size:26px;font-weight:800;color:var(--text-primary);margin-bottom:6px}.auth-subtitle{font-size:14px;color:var(--text-muted);margin-bottom:28px}body.landing{background:var(--bg-primary)}.landing-nav{position:fixed;top:0;left:0;right:0;z-index:200;background:rgba(6,13,26,0.9);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid rgba(148,163,184,0.08);transition:var(--transition)}.nav-inner{display:flex;align-items:center;justify-content:space-between;height:68px}.nav-brand{display:flex;align-items:center;gap:10px;font-size:18px;font-weight:800;background:var(--grad-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.nav-brand .logo-icon{width:36px;height:36px;border-radius:8px;background:var(--grad-primary);display:flex;align-items:center;justify-content:center;font-size:16px}.nav-links{display:flex;align-items:center;gap:8px}.nav-links a{color:var(--text-secondary);font-size:14px;font-weight:500;padding:8px 14px;border-radius:var(--radius-sm);transition:var(--transition)}.nav-links a:hover{color:var(--text-primary);background:rgba(255,255,255,0.06)}.hero{min-height:100vh;display:flex;align-items:center;padding:100px 0 60px;position:relative;overflow:hidden;background:var(--grad-hero)}.hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 20% 50%,rgba(14,165,233,0.1) 0%,transparent 50%),radial-gradient(ellipse at 80% 20%,rgba(99,102,241,0.1) 0%,transparent 50%),radial-gradient(ellipse at 60% 80%,rgba(16,185,129,0.05) 0%,transparent 40%);pointer-events:none}#particles-canvas{position:absolute;inset:0;pointer-events:none;z-index:0}.hero-content{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}.hero-content h1{font-size:clamp(36px,5vw,64px);font-weight:900;line-height:1.1;color:#fff;margin-bottom:20px;letter-spacing:-2px}.hero-content h1 span{background:var(--grad-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.hero-content p{font-size:18px;color:rgba(255,255,255,0.7);line-height:1.7;margin-bottom:36px;max-width:480px}.hero-btns{display:flex;gap:14px;flex-wrap:wrap}.typing-cursor{display:inline-block;width:3px;height:1em;background:var(--cyan);margin-left:4px;vertical-align:middle;animation:blink 1s step-end infinite}.hero-card{background:rgba(17,30,53,0.7);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(14,165,233,0.15);border-radius:var(--radius-xl);padding:32px;box-shadow:var(--shadow-glow);animation:float 6s ease-in-out infinite}.hero-card h3{font-size:16px;font-weight:700;color:var(--text-primary);margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid rgba(148,163,184,0.08)}.hero-stat{display:flex;align-items:center;gap:16px;padding:14px 0;border-bottom:1px solid rgba(148,163,184,0.06)}.hero-stat:last-child{border-bottom:none}.hero-stat .num{font-size:28px;font-weight:800;background:var(--grad-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1}.hero-stat .lbl{font-size:13px;color:var(--text-muted);margin-top:2px}.wave-divider{position:relative;overflow:hidden;line-height:0}.wave-divider svg{display:block;width:200%;animation:wave 12s linear infinite}.features-section{padding:100px 0;background:var(--bg-secondary);position:relative}.section-header{text-align:center;margin-bottom:60px}.section-header h2{font-size:clamp(28px,4vw,44px);font-weight:800;color:var(--text-primary);margin-bottom:12px;letter-spacing:-1px}.section-header p{font-size:17px;color:var(--text-muted);max-width:520px;margin:0 auto}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px}.feature-card{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-xl);padding:32px;transition:var(--transition);position:relative;overflow:hidden;cursor:default}.feature-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:var(--grad-primary);transform:scaleX(0);transition:transform 0.4s ease}.feature-card:hover{border-color:rgba(14,165,233,0.35);transform:translateY(-6px);box-shadow:0 0 30px rgba(14,165,233,0.12)}.feature-card:hover::before{transform:scaleX(1)}.feature-icon{font-size:36px;margin-bottom:16px;display:block;animation:float 4s ease-in-out infinite}.feature-card:nth-child(2) .feature-icon{animation-delay:0.5s}.feature-card:nth-child(3) .feature-icon{animation-delay:1s}.feature-card:nth-child(4) .feature-icon{animation-delay:1.5s}.feature-card:nth-child(5) .feature-icon{animation-delay:2s}.feature-card:nth-child(6) .feature-icon{animation-delay:2.5s}.feature-card h3{font-size:18px;font-weight:700;color:var(--text-primary);margin-bottom:10px}.feature-card p{font-size:14px;color:var(--text-muted);line-height:1.7}.stats-section{padding:80px 0;background:var(--bg-primary);position:relative}.stats-section::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(14,165,233,0.04) 0%,transparent 70%)}.stats-counter-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;position:relative;z-index:1}.counter-card{text-align:center;padding:32px 20px;background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-xl);transition:var(--transition)}.counter-card:hover{border-color:rgba(14,165,233,0.35);box-shadow:0 0 30px rgba(14,165,233,0.12);transform:translateY(-4px)}.counter-number{font-size:48px;font-weight:900;background:var(--grad-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;line-height:1;margin-bottom:8px;letter-spacing:-2px}.counter-label{font-size:14px;color:var(--text-muted);font-weight:500}.roles-section{padding:100px 0;background:var(--bg-secondary)}.roles-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.role-card{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-xl);padding:40px 32px;text-align:center;transition:var(--transition);position:relative;overflow:hidden}.role-card::after{content:'';position:absolute;bottom:0;left:0;right:0;height:3px;background:var(--grad-primary);transform:scaleX(0);transition:transform 0.4s ease}.role-card:hover{border-color:rgba(14,165,233,0.35);transform:translateY(-8px);box-shadow:var(--shadow-glow)}.role-card:hover::after{transform:scaleX(1)}.role-icon{font-size:52px;margin-bottom:20px;display:block;animation:float 5s ease-in-out infinite}.role-card:nth-child(2) .role-icon{animation-delay:1s}.role-card:nth-child(3) .role-icon{animation-delay:2s}.role-card h3{font-size:22px;font-weight:800;color:var(--text-primary);margin-bottom:12px}.role-card p{font-size:14px;color:var(--text-muted);line-height:1.7;margin-bottom:28px}.btn-block{display:block;text-align:center}.testimonials-section{padding:100px 0;background:var(--bg-primary)}.testimonials-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.testimonial-card{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-xl);padding:28px;transition:var(--transition)}.testimonial-card:hover{border-color:rgba(14,165,233,0.35);transform:translateY(-4px);box-shadow:0 0 30px rgba(14,165,233,0.1)}.testimonial-stars{color:#FCD34D;font-size:16px;margin-bottom:14px;letter-spacing:2px}.testimonial-text{font-size:14px;color:var(--text-secondary);line-height:1.7;margin-bottom:20px;font-style:italic}.testimonial-author{display:flex;align-items:center;gap:12px}.testimonial-avatar{width:40px;height:40px;border-radius:50%;background:var(--grad-primary);display:flex;align-items:center;justify-content:center;font-size:16px;font-weight:700;color:#fff;flex-shrink:0}.testimonial-name{font-size:14px;font-weight:700;color:var(--text-primary)}.testimonial-role{font-size:12px;color:var(--text-muted)}.cta-section{padding:80px 0;background:var(--grad-hero);position:relative;overflow:hidden}.cta-section::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(14,165,233,0.12) 0%,transparent 60%)}.cta-inner{position:relative;z-index:1;text-align:center}.cta-inner h2{font-size:clamp(28px,4vw,44px);font-weight:800;color:#fff;margin-bottom:16px}.cta-inner p{font-size:17px;color:rgba(255,255,255,0.7);margin-bottom:36px}.cta-btns{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}.footer{background:var(--bg-secondary);border-top:1px solid rgba(148,163,184,0.08);padding:40px 0;text-align:center}.footer p{color:var(--text-muted);font-size:14px}.footer a{color:var(--cyan)}.footer a:hover{color:#fff}.doctor-card{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-xl);padding:24px;display:flex;gap:16px;transition:var(--transition);position:relative;overflow:hidden}.doctor-card::before{content:'';position:absolute;top:0;left:0;width:4px;height:100%;background:var(--grad-primary);transform:scaleY(0);transition:transform 0.3s ease;transform-origin:bottom}.doctor-card:hover{border-color:rgba(14,165,233,0.35);transform:translateY(-4px);box-shadow:0 0 30px rgba(14,165,233,0.12)}.doctor-card:hover::before{transform:scaleY(1)}.doctor-avatar{width:64px;height:64px;border-radius:var(--radius);background:var(--grad-primary);display:flex;align-items:center;justify-content:center;font-size:28px;flex-shrink:0;box-shadow:0 4px 20px rgba(14,165,233,0.25)}.doctor-info h3{font-size:16px;font-weight:700;color:var(--text-primary);margin-bottom:4px}.doctor-info .spec{font-size:13px;color:#38BDF8;font-weight:600;margin-bottom:6px}.doctor-info .meta{font-size:12px;color:var(--text-muted)}.doctor-info .stars{font-size:12px}.spinner{width:36px;height:36px;border:3px solid rgba(148,163,184,0.1);border-top-color:var(--cyan);border-radius:50%;animation:spin 0.8s linear infinite;margin:24px auto}.loading-overlay{position:fixed;inset:0;background:rgba(6,13,26,0.8);backdrop-filter:blur(4px);z-index:9998;display:flex;align-items:center;justify-content:center}.skeleton{background:linear-gradient(90deg,rgba(14,165,233,0.04) 25%,rgba(14,165,233,0.08) 50%,rgba(14,165,233,0.04) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:var(--radius-sm)}.skeleton-text{height:14px;margin-bottom:8px;border-radius:4px}.skeleton-text.w-75{width:75%}.skeleton-text.w-50{width:50%}.skeleton-text.w-25{width:25%}.skeleton-card{background:var(--glass-bg);border:1px solid var(--glass-border);border-radius:var(--radius-lg);padding:24px}.skeleton-avatar{width:48px;height:48px;border-radius:50%}.skeleton-title{height:20px;width:60%;margin-bottom:12px}.skeleton-line{height:12px;margin-bottom:8px}.progress-bar-wrap{background:rgba(255,255,255,0.06);border-radius:100px;height:8px;overflow:hidden}.progress-bar{height:100%;border-radius:100px;background:var(--grad-primary);animation:progressFill 1.5s ease forwards;box-shadow:0 0 10px rgba(14,165,233,0.3)}.empty-state{text-align:center;padding:48px 24px;color:var(--text-muted)}.empty-state .icon{font-size:48px;margin-bottom:16px;display:block;opacity:0.6;animation:float 4s ease-in-out infinite}.empty-state h3{font-size:18px;font-weight:700;color:var(--text-secondary);margin-bottom:8px}.empty-state p{font-size:14px;color:var(--text-muted);margin-bottom:20px;max-width:300px;margin-left:auto;margin-right:auto}.reveal{opacity:0;transform:translateY(30px);transition:opacity 0.7s ease,transform 0.7s ease}.reveal.revealed{opacity:1!important;transform:translateY(0)!important}.reveal-left{opacity:0;transform:translateX(-30px);transition:opacity 0.7s ease,transform 0.7s ease}.reveal-left.revealed{opacity:1;transform:translateX(0)}.reveal-right{opacity:0;transform:translateX(30px);transition:opacity 0.7s ease,transform 0.7s ease}.reveal-right.revealed{opacity:1;transform:translateX(0)}.reveal-scale{opacity:0;transform:scale(0.9);transition:opacity 0.6s ease,transform 0.6s ease}.reveal-scale.revealed{opacity:1;transform:scale(1)}.hero .reveal,.hero .reveal-left,.hero .reveal-right,.hero .reveal-scale,.landing-nav .reveal{opacity:1!important;transform:none!important}.stagger-1{transition-delay:0.1s}.stagger-2{transition-delay:0.2s}.stagger-3{transition-delay:0.3s}.stagger-4{transition-delay:0.4s}.stagger-5{transition-delay:0.5s}.stagger-6{transition-delay:0.6s}.mt-0{margin-top:0}.mt-1{margin-top:8px}.mt-2{margin-top:16px}.mt-3{margin-top:24px}.mt-4{margin-top:32px}.mb-0{margin-bottom:0}.mb-1{margin-bottom:8px}.mb-2{margin-bottom:16px}.mb-3{margin-bottom:24px}.text-center{text-align:center}.text-right{text-align:right}.text-muted{color:var(--text-muted)}.text-accent{color:var(--cyan)}.text-success{color:var(--green)}.text-danger{color:var(--red)}.d-flex{display:flex}.align-center{align-items:center}.justify-between{justify-content:space-between}.gap-1{gap:8px}.gap-2{gap:16px}.gap-3{gap:24px}.w-100{width:100%}.flex-1{flex:1}.truncate{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.gradient-text{background:var(--grad-primary);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.glow-border{border:1px solid rgba(14,165,233,0.35);box-shadow:0 0 20px rgba(14,165,233,0.15)}.status-dot{width:8px;height:8px;border-radius:50%;display:inline-block}.status-dot.online{background:var(--green);animation:pulseDot 2s infinite}.status-dot.offline{background:var(--text-muted)}.status-dot.busy{background:var(--red);animation:pulseDot 2s infinite}.medicine-item{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:8px;margin-bottom:8px}.ai-badge{display:inline-flex;align-items:center;gap:5px;background:linear-gradient(135deg,rgba(14,165,233,0.15),rgba(99,102,241,0.15));border:1px solid rgba(14,165,233,0.3);border-radius:100px;padding:3px 10px;font-size:11px;font-weight:700;color:#38BDF8;letter-spacing:0.5px}.char-count{font-size:11px;color:var(--text-muted);text-align:right;margin-top:2px}.suggestion-chips{display:flex;flex-wrap:wrap;gap:6px;padding:8px 20px 4px;border-top:1px solid rgba(148,163,184,0.06)}.suggestion-chip{padding:4px 12px;border-radius:100px;font-size:12px;background:rgba(99,102,241,0.1);border:1px solid rgba(99,102,241,0.25);color:#A5B4FC;cursor:pointer;transition:var(--transition);font-family:var(--font)}.suggestion-chip:hover{background:#6366F1;color:#fff}.quick-replies-area{padding:6px 20px 8px;display:flex;flex-wrap:wrap;gap:6px;border-top:1px solid rgba(148,163,184,0.06);background:rgba(0,0,0,0.08);min-height:0}.send-btn{padding:10px 20px;border-radius:12px;flex-shrink:0;background:var(--grad-primary);border:none;cursor:pointer;color:#fff;font-size:14px;font-weight:600;font-family:var(--font);display:flex;align-items:center;gap:6px;transition:var(--transition);box-shadow:0 4px 12px rgba(14,165,233,0.3);align-self:flex-end}.send-btn:hover{transform:translateY(-1px);box-shadow:0 6px 20px rgba(14,165,233,0.5)}.send-btn:disabled{opacity:0.5;cursor:not-allowed;transform:none}@media(max-width:1024px){.stats-counter-grid{grid-template-columns:repeat(2,1fr)}.roles-grid{grid-template-columns:1fr 1fr}.testimonials-grid{grid-template-columns:1fr 1fr}.hero-content{grid-template-columns:1fr;gap:40px}.hero-card{max-width:400px}}@media(max-width:768px){:root{--sidebar-width:0px}.sidebar{transform:translateX(-100%);width:260px;z-index:200}.sidebar.open{transform:translateX(0);box-shadow:4px 0 40px rgba(0,0,0,0.5)}.main-content{margin-left:0}#menu-btn{display:flex!important}.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}.stats-grid{grid-template-columns:1fr 1fr}.stats-counter-grid{grid-template-columns:1fr 1fr}.roles-grid{grid-template-columns:1fr}.testimonials-grid{grid-template-columns:1fr}.auth-page{flex-direction:column}.auth-left{display:none}.auth-right{width:100%;padding:32px 20px}.nav-links a:not(.btn){display:none}.hero{padding:80px 0 40px}.hero-content{grid-template-columns:1fr}.hero-card{display:none}.page-body{padding:16px}.topbar{padding:0 16px}.modal{max-width:100%;margin:0 10px}.features-grid{grid-template-columns:1fr}.chat-bubble{max-width:90%}.doctor-card{flex-direction:column}}@media(max-width:480px){.stats-grid{grid-template-columns:1fr}.stats-counter-grid{grid-template-columns:1fr 1fr}.hero-btns{flex-direction:column}.cta-btns{flex-direction:column;align-items:center}.tabs{flex-wrap:wrap}.tab-btn{flex:none}#alert-container{left:12px;right:12px;bottom:12px}.medicine-item{grid-template-columns:1fr 1fr}}
/* ===== COMPREHENSIVE RESPONSIVE ===== */
/* Tablet: 1024px */
@media(max-width:1024px){
  .stats-counter-grid{grid-template-columns:repeat(2,1fr)}
  .roles-grid{grid-template-columns:1fr 1fr}
  .testimonials-grid{grid-template-columns:1fr 1fr}
  .hero-content{grid-template-columns:1fr;gap:40px}
  .hero-card{max-width:400px}
  .grid-3{grid-template-columns:1fr 1fr}
  .features-grid{grid-template-columns:1fr 1fr}
}
/* Mobile: 768px */
@media(max-width:768px){
  :root{--sidebar-width:0px;--topbar-height:56px}
  .sidebar{transform:translateX(-100%);width:280px;z-index:200;box-shadow:none}
  .sidebar.open{transform:translateX(0);box-shadow:4px 0 40px rgba(0,0,0,0.6)}
  .main-content{margin-left:0}
  #menu-btn{display:flex!important}
  .grid-2,.grid-3,.grid-4{grid-template-columns:1fr}
  .stats-grid{grid-template-columns:1fr 1fr}
  .stats-counter-grid{grid-template-columns:1fr 1fr}
  .roles-grid{grid-template-columns:1fr}
  .testimonials-grid{grid-template-columns:1fr}
  .features-grid{grid-template-columns:1fr}
  .auth-page{flex-direction:column}
  .auth-left{display:none}
  .auth-right{width:100%;padding:32px 20px;min-height:100vh}
  .nav-links a:not(.btn){display:none}
  .hero{padding:80px 0 40px}
  .hero-content{grid-template-columns:1fr}
  .hero-card{display:none}
  .hero-content h1{font-size:clamp(28px,8vw,48px);letter-spacing:-1px}
  .hero-content p{font-size:16px}
  .hero-btns{flex-direction:column;align-items:flex-start}
  .hero-btns .btn{width:100%;justify-content:center}
  .page-body{padding:16px}
  .topbar{padding:0 16px}
  .topbar-btn{width:34px;height:34px;font-size:14px}
  .page-title{font-size:15px}
  .modal{max-width:100%;margin:0;border-radius:var(--radius-lg) var(--radius-lg) 0 0;position:fixed;bottom:0;left:0;right:0;max-height:90vh}
  .modal-overlay{align-items:flex-end;padding:0}
  .card{padding:16px;border-radius:var(--radius)}
  .card-header{flex-wrap:wrap;gap:8px}
  .card-title{font-size:15px}
  .stat-card{padding:14px}
  .stat-value{font-size:22px}
  .stat-icon{width:44px;height:44px;font-size:18px}
  .table-wrap{border-radius:var(--radius-sm)}
  thead th{padding:10px 12px;font-size:10px}
  tbody td{padding:10px 12px;font-size:13px}
  .btn-lg{padding:12px 20px;font-size:15px}
  .chat-bubble{max-width:90%}
  .chat-wrapper{border-radius:var(--radius-lg)}
  .chat-input-area{padding:10px 12px}
  .doctor-card{flex-direction:column}
  .doctor-avatar{width:52px;height:52px;font-size:22px}
  .section-header h2{font-size:clamp(22px,6vw,36px)}
  .section-header p{font-size:15px}
  .counter-number{font-size:36px}
  .role-card{padding:28px 20px}
  .role-icon{font-size:40px}
  .cta-inner h2{font-size:clamp(22px,6vw,36px)}
  .cta-btns{flex-direction:column;align-items:center}
  .cta-btns .btn{width:100%;max-width:300px;justify-content:center}
  .tabs{flex-wrap:wrap}
  .tab-btn{flex:none;font-size:12px;padding:6px 12px}
  .medicine-item{grid-template-columns:1fr 1fr}
  .modal-footer{flex-wrap:wrap}
  .modal-footer .btn{flex:1;min-width:120px}
  .auth-form-wrap{max-width:100%}
  .auth-title{font-size:22px}
  .nav-inner{padding:0 16px}
  .container{padding:0 16px}
  .features-section,.roles-section,.testimonials-section,.stats-section{padding:60px 0}
  .hero-btns a,.hero-btns button{width:100%;text-align:center}
}
/* Small mobile: 480px */
@media(max-width:480px){
  :root{--topbar-height:52px}
  .stats-grid{grid-template-columns:1fr 1fr}
  .stats-counter-grid{grid-template-columns:1fr 1fr}
  .stat-card{padding:12px;gap:10px}
  .stat-value{font-size:20px}
  .stat-icon{width:38px;height:38px;font-size:16px}
  .stat-label{font-size:11px}
  .hero-content h1{font-size:clamp(24px,9vw,40px)}
  .hero-btns{flex-direction:column}
  .cta-btns{flex-direction:column;align-items:center}
  #alert-container{left:8px;right:8px;bottom:8px}
  .medicine-item{grid-template-columns:1fr}
  .card{padding:14px}
  .page-body{padding:12px}
  .topbar{padding:0 12px}
  .page-title{font-size:14px}
  .topbar-btn{width:32px;height:32px;font-size:13px}
  .sidebar-brand{padding:16px 14px}
  .sidebar-brand h1{font-size:14px}
  .nav-item{padding:9px 10px;font-size:13px}
  .modal-body{padding:16px}
  .modal-header{padding:16px 16px 12px}
  .modal-footer{padding:12px 16px 16px}
  .btn-sm{padding:5px 10px;font-size:11px}
  .btn{padding:9px 16px;font-size:13px}
  .form-control{padding:9px 12px;font-size:13px}
  .form-label{font-size:12px}
  .table-wrap table{font-size:12px}
  thead th{padding:8px 10px}
  tbody td{padding:8px 10px}
  .chat-messages{padding:12px}
  .chat-bubble{padding:10px 12px;font-size:13px}
  .quick-reply-btn{padding:5px 10px;font-size:11px}
  .chat-input{padding:8px 10px;font-size:13px}
  .send-btn{padding:8px 14px;font-size:13px}
  .counter-number{font-size:32px}
  .counter-label{font-size:12px}
  .role-card{padding:24px 16px}
  .role-icon{font-size:36px}
  .role-card h3{font-size:18px}
  .feature-card{padding:24px}
  .feature-icon{font-size:28px}
  .feature-card h3{font-size:16px}
  .testimonial-card{padding:20px}
  .section-header{margin-bottom:40px}
  .features-section,.roles-section,.testimonials-section,.stats-section{padding:48px 0}
  .hero{padding:70px 0 32px}
  .nav-brand{font-size:15px}
  .nav-brand .logo-icon{width:30px;height:30px;font-size:14px}
  .nav-links .btn-sm{padding:5px 10px;font-size:12px}
  .auth-title{font-size:20px}
  .auth-subtitle{font-size:13px}
  .auth-logo h1{font-size:16px}
  .user-card{padding:8px}
  .user-info .name{font-size:12px}
  .user-info .role{font-size:10px}
  .logout-btn{font-size:14px}
  .empty-state{padding:32px 16px}
  .empty-state .icon{font-size:36px}
  .empty-state h3{font-size:16px}
  .badge-pill{padding:3px 8px;font-size:10px}
  .tabs{gap:2px;padding:3px}
  .tab-btn{padding:6px 10px;font-size:11px}
  .modal{max-height:95vh}
  .modal-title{font-size:14px}
  .grid-2{gap:12px}
  .card-header{gap:6px}
  .card-subtitle{font-size:11px}
}
/* Very small: 360px */
@media(max-width:360px){
  .stats-grid{grid-template-columns:1fr}
  .stats-counter-grid{grid-template-columns:1fr}
  .hero-content h1{font-size:clamp(22px,10vw,36px)}
  .page-body{padding:10px}
  .card{padding:12px}
  .stat-card{flex-direction:column;text-align:center;gap:8px}
  .stat-icon{margin:0 auto}
  .topbar-right{gap:4px}
  .topbar-btn{width:30px;height:30px;font-size:12px}
}
/* Landscape mobile */
@media(max-width:768px) and (orientation:landscape){
  .hero{min-height:auto;padding:80px 0 40px}
  .auth-right{min-height:auto;padding:24px 20px}
  .modal{max-height:85vh}
  .chat-container{height:calc(100vh - 80px)}
}
/* Touch improvements */
@media(hover:none) and (pointer:coarse){
  .btn{min-height:44px}
  .nav-item{min-height:44px}
  .form-control{min-height:44px}
  .topbar-btn{width:44px;height:44px}
  .tab-btn{min-height:40px}
  .quick-reply-btn{min-height:36px;padding:8px 14px}
  .cw-qr-btn{min-height:36px;padding:8px 14px}
  .modal-close{width:36px;height:36px}
}
/* Print */
@media print{
  .sidebar,.topbar,.topbar-btn,#alert-container,.modal-overlay,#particles-canvas{display:none!important}
  .main-content{margin-left:0!important}
  .card{box-shadow:none;border:1px solid #ddd}
  body{background:#fff;color:#000}
}

/* ===== COMPONENT RESPONSIVE FIXES ===== */
.appt-row{display:flex;align-items:center;justify-content:space-between;padding:14px 0;border-bottom:1px solid rgba(148,163,184,0.06);gap:12px;flex-wrap:wrap}
.appt-row-left{display:flex;align-items:center;gap:12px;flex:1;min-width:0}
.appt-avatar{width:42px;height:42px;border-radius:10px;background:linear-gradient(135deg,rgba(14,165,233,0.2),rgba(99,102,241,0.2));display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0}
.appt-info{flex:1;min-width:0}
.appt-name{font-weight:600;font-size:14px;color:var(--text-primary)}
.appt-time{font-size:12px;color:var(--text-muted);margin-top:2px}
.appt-reason{font-size:12px;color:var(--text-muted);margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:200px}
.doctor-profile-card{background:rgba(99,102,241,0.06);border:1px solid rgba(99,102,241,0.15);border-radius:12px;padding:16px;margin-top:20px}
.doctor-profile-label{font-size:12px;font-weight:700;color:#A5B4FC;margin-bottom:8px;text-transform:uppercase;letter-spacing:0.5px}
.doctor-profile-spec{font-size:13px;color:var(--text-secondary)}
.rx-info-box{padding:10px 14px;background:rgba(99,102,241,0.08);border:1px solid rgba(99,102,241,0.2);border-radius:8px;margin-bottom:16px;font-size:13px;color:#A5B4FC}
.filter-row{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end}
.filter-row .form-group{margin:0;flex:1;min-width:160px}
.filter-row .btn{flex-shrink:0;align-self:flex-end}
.status-filter{min-width:120px;max-width:160px}
.header-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.profile-name-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.profile-avatar-wrap{text-align:center;margin-bottom:28px}
.profile-avatar{width:80px;height:80px;border-radius:50%;background:var(--grad-primary);display:flex;align-items:center;justify-content:center;font-size:32px;font-weight:800;color:#fff;margin:0 auto 12px;box-shadow:0 0 30px rgba(14,165,233,0.3)}
.profile-display-name{font-size:18px;font-weight:700;color:var(--text-primary)}
.account-info-row{display:flex;justify-content:space-between;align-items:center;font-size:14px}
.account-info-label{color:var(--text-muted)}
.account-info-value{font-weight:600;color:var(--text-primary)}
.doctor-schedule-row{display:flex;align-items:center;justify-content:space-between;padding:14px 0;border-bottom:1px solid rgba(148,163,184,0.06);flex-wrap:wrap;gap:8px}
.doctor-schedule-left{display:flex;align-items:center;gap:12px;flex:1;min-width:0}
.doctor-schedule-avatar{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,rgba(14,165,233,0.2),rgba(99,102,241,0.2));display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0}
.doctor-schedule-actions{display:flex;align-items:center;gap:8px;flex-shrink:0;flex-wrap:wrap}
@media(max-width:768px){
  .profile-name-grid{grid-template-columns:1fr}
  .filter-row{flex-direction:column}
  .filter-row .form-group{min-width:100%}
  .status-filter{max-width:100%;width:100%}
  .header-actions{width:100%;justify-content:flex-end}
  .appt-row{flex-direction:column;align-items:flex-start}
  .doctor-schedule-row{flex-direction:column;align-items:flex-start}
  .doctor-schedule-actions{width:100%}
  .account-info-row{flex-wrap:wrap;gap:4px}
  .doctors-grid-container{grid-template-columns:1fr!important}
}
@media(max-width:480px){
  .profile-name-grid{grid-template-columns:1fr}
  .appt-avatar{width:36px;height:36px;font-size:15px}
  .appt-name{font-size:13px}
  .appt-time{font-size:11px}
  .doctor-schedule-avatar{width:36px;height:36px;font-size:15px}
  .profile-avatar{width:64px;height:64px;font-size:26px}
  .profile-display-name{font-size:16px}
  .rx-info-box{font-size:12px;padding:8px 12px}
  .filter-row .btn{width:100%}
}