/* Inline styles extracted from the HTML and combined for clarity */
:root {
    --primary-green-light: #86efac;
    --primary-green-dark: #4ade80;
    --light-bg: #f0fdf4;
    --dark-bg: #0a0a0a;
    --card-bg-light: rgba(255, 255, 255, 0.8);
    --card-bg-dark: rgba(15, 23, 42, 0.8);
    --text-light-theme: #14532d;
    --text-dark-theme: #e9f0f8;
    --text-muted-light: #3f6212;
    --text-muted-dark: #94a3b8;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Poppins', sans-serif;
    transition: background-color 0.5s ease, color 0.5s ease;
}

/* Light Mode */
body {
    background-color: var(--light-bg);
    color: var(--text-light-theme);
}
.dark body {
    background-color: var(--dark-bg);
    color: var(--text-dark-theme);
}

/* Preloader Styles */
#preloader {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #000;
    z-index: 1000;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    transition: opacity 0.8s ease-in-out, visibility 0.8s ease-in-out;
}
#preloader.hidden {
    opacity: 0;
    visibility: hidden;
}
.preloader-svg {
    width: 90%;
    max-width: 400px;
    height: auto;
}
.preloader-path {
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
    animation: draw-ekg 2.5s ease-in-out forwards;
    filter: drop-shadow(0 0 4px var(--primary-green-dark));
}
.preloader-text {
    opacity: 0;
    animation: fade-in-text 1s ease-in forwards 2.5s;
    font-weight: bold;
    text-align: center;
}

@keyframes draw-ekg { to { stroke-dashoffset: 0; } }
@keyframes fade-in-text { to { opacity: 1; } }
@keyframes heartbeat {
    0% { transform: scale(1); }
    10% { transform: scale(1); }
    20% { transform: scale(1.08); }
    30% { transform: scale(1); }
    40% { transform: scale(1); }
    100% { transform: scale(1); }
}
.preloader-path.drawn {
    animation: heartbeat 1.2s ease-in-out infinite 2.6s;
    transform-origin: 155px 50px; /* Center of the heart shape */
}


/* Page Content & Transitions */
.page-content {
    display: none;
    animation: fadeInPage 0.6s ease-in-out;
    padding-bottom: 80px; /* Space for mobile nav */
}
.page-content.active {
    display: block;
}
@keyframes fadeInPage {
    from { opacity: 0; transform: translateY(15px); }
    to { opacity: 1; transform: translateY(0); }
}

/* Sidebar & Mobile Navigation */
#sidebar { background-color: rgba(255, 255, 255, 0.6); color: var(--text-light-theme); }
.dark #sidebar { background-color: rgba(0, 0, 0, 0.8); color: #d1d5db; }

#sidebar nav a {
    transition: all 0.2s ease-in-out;
}
#sidebar nav a:hover {
    transform: translateX(5px);
}

#sidebar nav a.active, #mobile-nav a.active {
    color: #16a34a;
}
.dark #sidebar nav a.active, .dark #mobile-nav a.active {
    color: var(--primary-green-dark);
}

#sidebar nav a.active {
    background-color: #dcfce7;
    box-shadow: inset 4px 0 0 #16a34a;
}
.dark #sidebar nav a.active {
    background-color: #111827;
    box-shadow: inset 4px 0 0 var(--primary-green-dark);
}

#mobile-nav {
    background-color: rgba(255, 255, 255, 0.8);
    box-shadow: 0 -5px 20px rgba(0,0,0,0.1);
    color: var(--text-muted-light);
}
.dark #mobile-nav {
    background-color: rgba(0, 0, 0, 0.8);
    box-shadow: 0 -5px 20px rgba(0,0,0,0.4);
    color: #9ca3af;
}

/* General Styles */
.gradient-text {
    background-image: linear-gradient(to right, #22c55e, #15803d);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}
.dark .gradient-text {
    background-image: linear-gradient(to right, #4ade80, #34d399);
}

/* 3D Background */
#bg-3d-animation {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
}

/* Triage Bot Specific Styles */
.card { background-color: var(--card-bg-light); border: 1px solid #bbf7d0; box-shadow: 0 10px 25px -5px rgba(0,0,0,0.05); }
.dark .card { background-color: var(--card-bg-dark); border: 1px solid #1e293b; box-shadow: 0 10px 25px -5px rgba(0,0,0,0.1); }

textarea, .form-input { width:100%; padding:12px; border-radius:12px; background:#f0fdf4; border: 1px solid #bbf7d0; color:var(--text-light-theme); }
textarea:focus, .form-input:focus { box-shadow: 0 0 10px rgba(74, 222, 128, 0.5); outline: none; border-color: var(--primary-green-dark); }
.dark textarea, .dark .form-input { background:#0f1728; border: 1px solid #26314f; color:#fff; }
textarea { min-height:180px; }

.badge { padding:6px 12px; border-radius:999px; font-size:12px; font-weight:600; display:inline-flex; align-items: center; }
.badge.ok{ background:rgba(25,195,125,.15); color:#059669; border: 1px solid rgba(25,195,125,.3); }
.dark .badge.ok{ color:#35e0a1; }
.badge.warn{ background:rgba(234, 179, 8, .15); color:#a16207; border: 1px solid rgba(234, 179, 8, .3); }
.dark .badge.warn{ background:rgba(255,182,39,.15); color:#ffd37b; border: 1px solid rgba(255,182,39,.3); }
.badge.danger{ background:rgba(220, 38, 38,.15); color:#991b1b; border: 1px solid rgba(220, 38, 38,.3); animation:pulseDangerLight 1.5s infinite; }
.dark .badge.danger{ background:rgba(255,91,91,.15); color:#ff9a9a; border: 1px solid rgba(255,91,91,.3); animation:pulseDangerDark 1.5s infinite; }

@keyframes pulseDangerLight { 0%,100%{ box-shadow:0 0 3px #ef4444; } 50%{ box-shadow:0 0 15px #ef4444; } }
@keyframes pulseDangerDark { 0%,100%{ box-shadow:0 0 3px #ff5b5b; } 50%{ box-shadow:0 0 15px #ff5b5b; } }

kbd { background: #e5e7eb; color: #4b5563; border-radius: 4px; padding: 2px 6px; font-size: 0.8em; }
.dark kbd { background: #374151; color: #d1d5db; }

.health-tip-card { background-color: #dcfce7; }
.dark .health-tip-card { background-color: rgba(15, 23, 42, 0.8); }

/* AI Doctor Chat */
.chat-bubble.ai { background-color: #e5e7eb; color: var(--text-light-theme); }
.dark .chat-bubble.ai { background-color: #374151; color: var(--text-dark-theme); }

.quick-reply-btn { background-color: #f3f4f6; border: 1px solid #e5e7eb; color: var(--text-light-theme); }
.dark .quick-reply-btn { background-color: #1f2937; border: 1px solid #374151; color: var(--text-dark-theme); }
.quick-reply-btn:hover { background-color: #e5e7eb; }
.dark .quick-reply-btn:hover { background-color: #374151; }

/* Theme Toggle */
#theme-toggle-btn {
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    transition: all 0.3s ease;
}
#theme-toggle-btn {
    background-color: rgba(255,255,255,0.7);
    border: 1px solid #dcfce7;
}
.dark #theme-toggle-btn {
    background-color: rgba(15, 23, 42, 0.7);
    border: 1px solid #334155;
}
#theme-toggle-btn:hover {
    transform: scale(1.1) rotate(15deg);
}
#theme-toggle-btn .fa-sun { display: none; }
.dark #theme-toggle-btn .fa-sun { display: inline-block; }
.dark #theme-toggle-btn .fa-moon { display: none; }