:root {
    --bg-color: #050505;
    --text-color: #ffffff;
    --panel-bg: rgba(255, 255, 255, 0.03);
    --panel-border: rgba(255, 255, 255, 0.1);
    --scrollbar-track: #0f172a;
    --scrollbar-thumb: #334155;
    --scrollbar-thumb-hover: #475569;
    --section-bg: #0a0f1c;
    --section-bg-dark: #000000;
    --text-color-light: #d4d4d4;
    --brand-purple: #f59e0b;
    --navbar-text: #ffffff;
    --navbar-text-hover: #f59e0b;
}

body.light-mode {
    --bg-color: #f8f9fa;
    --text-color: #212529;
    --panel-bg: rgba(0, 0, 0, 0.05);
    --panel-border: rgba(0, 0, 0, 0.1);
    --scrollbar-track: #e9ecef;
    --scrollbar-thumb: #ced4da;
    --scrollbar-thumb-hover: #adb5bd;
    --section-bg: #ffffff;
    --section-bg-dark: #f8f9fa;
    --text-color-light: #495057;
    --brand-purple: #d97706; /* A slightly darker amber for light mode */
    --navbar-text: #212529;
    --navbar-text-hover: #d97706;
}

body {
    background-color: var(--bg-color);
    color: var(--text-color);
    transition: background-color 0.3s ease, color 0.3s ease;
}

.glass-panel {
    background: var(--panel-bg);
    border-color: var(--panel-border);
}

.bg-brand-dark {
    background-color: var(--section-bg-dark);
    transition: background-color 0.3s ease;
}

#experience {
    background-color: var(--section-bg);
    transition: background-color 0.3s ease;
}

.text-white {
    color: var(--text-color);
}

.text-gray-300 {
   color: var(--text-color-light);
}

.text-brand-purple {
    color: var(--brand-purple);
}

.hover\:text-brand-purple:hover {
    color: var(--navbar-text-hover);
}

.border-slate-800 {
    border-color: var(--panel-border);
}

/* Update scrollbar for light mode */
body.light-mode ::-webkit-scrollbar-track {
    background: var(--scrollbar-track);
}

body.light-mode ::-webkit-scrollbar-thumb {
    background: var(--scrollbar-thumb);
}

body.light-mode ::-webkit-scrollbar-thumb:hover {
    background: var(--scrollbar-thumb-hover);
}

/* General text color for sections */
.text-slate-200 {
    color: var(--text-color);
}
.text-slate-300 {
    color: var(--text-color-light);
}
.text-slate-400 {
    color: var(--text-color-light);
}
.text-slate-500 {
    color: var(--text-color-light);
}
body.light-mode .text-slate-200,
body.light-mode .text-slate-300,
body.light-mode .text-slate-400,
body.light-mode .text-slate-500 {
    color: #495057; /* A consistent muted text color for light mode */
}
body.light-mode .text-lg.text-gray-400 {
    color: #495057;
}

body.light-mode .text-white {
    color: var(--text-color);
}
body.light-mode .font-bold.text-white {
    color: var(--text-color);
}

body.light-mode .hover\:text-white:hover {
    color: var(--text-color) !important;
}

body.light-mode .text-gray-600 {
    color: #6c757d;
}
body.light-mode .text-gray-800 {
    color: #495057;
}

/* Specific component adjustments */
body.light-mode .glass-panel {
    background: rgba(255, 255, 255, 0.5);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(0, 0, 0, 0.08);
}

body.light-mode .bg-slate-900 {
    background-color: #e9ecef;
}

body.light-mode .border-slate-700 {
    border-color: #dee2e6;
}
body.light-mode .hover\:border-slate-600:hover {
    border-color: #ced4da;
}
body.light-mode .before\:bg-gradient-to-b.before\:from-transparent.before\:via-slate-700.before\:to-transparent::before {
    background-image: linear-gradient(to bottom, transparent, #dee2e6, transparent);
}
body.light-mode .hover\:bg-slate-800:hover {
    background-color: #e9ecef;
}
body.light-mode .bg-gradient-to-b.from-\[\#0a0f1c\].to-black {
    background-image: linear-gradient(to bottom, #f8f9fa, #f8f9fa);
}
body.light-mode .border-white\/5 {
    border-color: rgba(0,0,0,0.05);
}
body.light-mode .text-black {
    color: #f8f9fa;
}
body.light-mode .bg-brand-purple.text-black {
    color: #212529;
}