/* ===== Dr. AI Clinic — Professional Theme ===== */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');

:root {
  --navy: #0b2545; --navy2: #13315c; --blue: #1d6fa5; --teal: #0d9488;
  --line: #e2e8f0; --bg: #f4f7fb;
}

html, body { font-family: 'Inter', system-ui, sans-serif; }
body { background: var(--bg); color: #0f172a; }

/* ===== LOGIN / REGISTER SCREENS (image background + glass card) ===== */
#authSection {
  background:
    linear-gradient(135deg, rgba(11,37,69,.93) 0%, rgba(29,111,165,.88) 55%, rgba(13,148,136,.82) 100%),
    url('https://images.unsplash.com/photo-1538108149393-fbbd81895907?auto=format&fit=crop&w=1800&q=80') center/cover no-repeat fixed;
}
#authSection > div {
  background: rgba(173, 216, 230, 1);
  backdrop-filter: blur(14px);
  border-radius: 20px;
  border: 1px solid rgba(255,255,255,.6);
  box-shadow: 0 25px 60px rgba(2,8,23,.45);
}

/* ===== APP SHELL ===== */
aside { background: linear-gradient(180deg, #0b2545 0%, #13315c 55%, #1d6fa5 130%) !important; }
aside nav a { border-left: 4px solid transparent; }
aside nav a:hover { background: rgba(255,255,255,.08) !important; border-left-color: #4cc9f0; }
main { background: linear-gradient(180deg, #f8fafc, #eef3f9); }

/* Patient portal top bar gradient */
#dashboardSection > div:first-child {
  background: linear-gradient(90deg, #0b2545, #1d6fa5 60%, #0d9488) !important;
}

/* ===== CARDS & INPUTS ===== */
.bg-white { border: 1px solid var(--line); box-shadow: 0 6px 24px rgba(15,23,42,.06); }
.rounded-xl, .rounded-lg { border-radius: 16px; }
input, select, textarea { border-radius: 10px; border: 1.5px solid var(--line); }
input:focus, select:focus, textarea:focus {
  outline: none; border-color: var(--blue); box-shadow: 0 0 0 4px rgba(29,111,165,.12);
}

/* ===== BUTTONS ===== */
button { transition: transform .15s ease, box-shadow .15s ease, filter .15s; }
button:hover { transform: translateY(-1px); filter: brightness(1.06); }
button:active { transform: translateY(0); }
.bg-blue-600 { box-shadow: 0 6px 18px rgba(29,111,165,.35); }
.bg-green-600 { box-shadow: 0 6px 18px rgba(22,163,74,.3); }
.bg-purple-600 { box-shadow: 0 6px 18px rgba(147,51,234,.3); }
.bg-red-600 { box-shadow: 0 6px 18px rgba(220,38,38,.3); }

/* ===== TABLES ===== */
thead { background: linear-gradient(90deg, #0b2545, #1d6fa5); }
thead th { color: #e2e8f0 !important; font-weight: 600; letter-spacing: .02em; }
tbody tr { transition: background .15s; }
tbody tr:hover { background: #f1f5f9; }

/* ===== HOMEPAGE HERO ===== */
.hero {
  min-height: 92vh;
  background:
    linear-gradient(120deg, rgba(11,37,69,.94), rgba(19,49,92,.85) 45%, rgba(13,148,136,.75)),
    url('https://images.unsplash.com/photo-1576091160550-2173dba999ef?auto=format&fit=crop&w=1800&q=80') center/cover no-repeat;
}
.glass {
  background: rgba(255,255,255,.1);
  border: 1px solid rgba(255,255,255,.25);
  backdrop-filter: blur(10px);
}

/* ===== SCROLLBARS ===== */
::-webkit-scrollbar { width: 9px; height: 9px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #b6c2d2; border-radius: 8px; }
::-webkit-scrollbar-thumb:hover { background: #8fa1b8; }