/* ------------------------------------------------------------------- */
/* GLOBAL VARIABLES (Dark Mode) */
/* ------------------------------------------------------------------- */
[data-theme="dark"] {
  --bg1: #0b1220;
  --glass: rgba(255,255,255,0.04);
  --accent: #0078d7;
  --text: #e6eef8;
  --muted: rgba(230,238,248,0.6);
  --window-bg: rgba(18, 28, 40, 0.98);
  --border-color: rgba(255,255,255,0.08);
  --hover-bg: rgba(255,255,255,0.07);
  --taskbar-bg: rgba(18, 28, 40, 0.9);
  --start-btn-grad: linear-gradient(180deg,#005c99,#0078d7);
  --task-item-bg: rgba(255, 255, 255, 0.08);
  --task-item-active-bg: rgba(0, 120, 215, 0.2);
}

/* ------------------------------------------------------------------- */
/* GLOBAL VARIABLES (Light Mode) - High Contrast / Vibrant Accent */
/* ------------------------------------------------------------------- */
[data-theme="light"] {
  /* friendlier light theme palette */
  --bg1: #f5f7fb;
  --glass: rgba(10,10,10,0.03);
  --accent: #0057ff; /* VIBRANT ELECTRIC BLUE accent */
  --text: #17202a; /* dark text color (almost black) */
  --muted: rgba(23,32,42,0.65); /* Slightly darker muted text */
  --window-bg: rgba(255, 255, 255, 0.98);
  --border-color: rgba(0,0,0,0.15); /* Darker border for higher contrast */
  --hover-bg: rgba(0,0,0,0.1); /* Darker hover for more noticeable feedback */
  --taskbar-bg: linear-gradient(180deg, rgba(255,255,255,0.9), rgba(245,247,250,0.95));
  --start-btn-grad: linear-gradient(180deg,#003cb3,#0057ff); /* Gradient using new accent */
  
  /* Component-specific colors derived from palette */
  --task-item-bg: rgba(0, 0, 0, 0.08); /* Darker task item background */
  --task-item-active-bg: rgba(0, 87, 255, 0.15); /* New accent with higher transparency */
}

/* ------------------------------------------------------------------- */
/* GLOBAL LIGHT MODE BASE STYLES */
/* ------------------------------------------------------------------- */
[data-theme="light"] body {
  background-color: var(--bg1);
  color: var(--text); /* Set base text color */
}

/* ------------------------------------------------------------------- */
/* LIGHT MODE COMPONENT STYLES */
/* ------------------------------------------------------------------- */

[data-theme="light"] #taskbar {
  background: var(--taskbar-bg);
  border-top: 1px solid var(--border-color);
  box-shadow: 0 -1px 8px rgba(0,0,0,0.2); /* Much darker shadow */
}

[data-theme="light"] .app {
  background: var(--window-bg);
  border: 1px solid var(--border-color);
  box-shadow: 0 12px 32px rgba(0,0,0,0.15); /* Larger, darker shadow */
}

[data-theme="light"] #start-menu {
  background: var(--window-bg);
  border: 1px solid var(--border-color);
  box-shadow: 0 8px 24px rgba(0,0,0,0.2);
  color: var(--text); /* Ensure all start menu text is correct */
}

[data-theme="light"] .icon span {
  text-shadow: 0 1px 2px rgba(0,0,0,0.15);
  color: var(--text);
}

[data-theme="light"] .menu-app:hover {
  background: var(--hover-bg);
}

[data-theme="light"] .notification {
  /* Using window-bg for better visibility than subtle hover-bg */
  background: var(--window-bg); 
  border: 1px solid var(--border-color);
  color: var(--text);
}

[data-theme="light"] .task-item {
  background: var(--task-item-bg); /* Using new variable */
  color: var(--text);
}

[data-theme="light"] .task-item:hover {
  background: var(--hover-bg);
}

[data-theme="light"] .task-item.active {
  background: var(--task-item-active-bg); /* Using new variable */
}

[data-theme="light"] .menu-section {
  border-color: var(--border-color);
}

[data-theme="light"] .start-header {
  background: rgba(255, 255, 255, 0.8);
  border-bottom: 1px solid var(--border-color);
}

[data-theme="light"] .menu-app {
  border-color: var(--border-color);
}

[data-theme="light"] .menu-app img {
  background: var(--hover-bg);
}

[data-theme="light"] .quick-link {
  color: var(--text); /* Ensure quick link text is correct */
}

[data-theme="light"] .quick-link:hover {
  background: var(--hover-bg);
}

/* SCROLLBARS */
[data-theme="light"] .content::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.3); /* Darker thumb */
}

[data-theme="light"] .content::-webkit-scrollbar-thumb:hover {
  background: rgba(0, 0, 0, 0.5); /* Even darker hover */
}

/* FORMS */
[data-theme="light"] form label { color: var(--text); } /* Added: Ensures labels are readable */

[data-theme="light"] form input,
[data-theme="light"] form textarea {
  background: rgba(0,0,0,0.05); /* Slightly darker input background */
  border: 1px solid var(--border-color);
  color: var(--text);
}

[data-theme="light"] form input:focus,
[data-theme="light"] form textarea:focus {
  background: white;
  border-color: var(--accent);
}

/* PROJECTS/CARDS */
[data-theme="light"] .project {
  background: white;
  border: 1px solid var(--border-color);
}

[data-theme="light"] .project:hover {
  border-color: var(--accent);
  box-shadow: 0 8px 24px rgba(0,0,0,0.15);
}

[data-theme="light"] .project h4 {
  color: var(--text);
}

[data-theme="light"] .project p {
  color: var(--muted);
}

[data-theme="light"] .tech-tag {
  background: rgba(0, 87, 255, 0.15); /* Uses new accent */
  color: var(--accent);
}

/* SEARCH BOX */
[data-theme="light"] #search-box {
  background: var(--task-item-bg); /* Using task-item background for consistency */
  border: 1px solid var(--border-color);
  color: var(--text);
}

[data-theme="light"] #search-box:hover {
  background: rgba(0, 0, 0, 0.1);
}

[data-theme="light"] #search-box:focus-within {
  background: white;
  border-color: var(--accent);
}

/* TITLEBAR */
[data-theme="light"] .titlebar {
  background: linear-gradient(180deg, rgba(255,255,255,0.95), rgba(250,250,250,0.95));
  border-bottom: 1px solid var(--border-color);
  color: var(--text);
}

[data-theme="light"] .titlebar .controls button {
  color: var(--text);
}

[data-theme="light"] .titlebar .controls button:hover {
  background: var(--hover-bg);
}

[data-theme="light"] .titlebar .controls .close:hover {
  background: #e81123;
  color: white;
}

/* THEME TOGGLE (Light) */
[data-theme="light"] #theme-toggle {
  background: rgba(0,0,0,0.08);
  border-radius: 6px;
  padding: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all 0.15s ease;
  border: 1px solid rgba(0,0,0,0.1);
}

[data-theme="light"] #theme-toggle:hover {
  background: rgba(0,0,0,0.12);
  transform: translateY(-1px);
}

[data-theme="light"] .theme-icon { color: var(--text); }

/* THEME TOGGLE (Dark) */
[data-theme="dark"] #theme-toggle {
  background: rgba(255,255,255,0.04);
  border-radius: 6px;
  padding: 6px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all 0.15s ease;
  border: 1px solid rgba(255,255,255,0.06);
}

[data-theme="dark"] #theme-toggle:hover {
  background: rgba(255,255,255,0.06);
  transform: translateY(-1px);
}

[data-theme="dark"] .theme-icon { color: var(--text); }

/* FILTER BUTTONS */
[data-theme="light"] .filter-btn {
  border: 1px solid rgba(0,0,0,0.15);
  color: var(--text);
  background-color: var(--window-bg);
}

[data-theme="light"] .filter-btn.active {
  background: var(--accent);
  color: #fff;
  border-color: var(--accent);
}

/* Ensures all major containers have the correct default color */
[data-theme="light"] .menu-left,
[data-theme="light"] .menu-right {
  color: var(--text);
}

[data-theme="light"] .app-info {
  color: var(--text);
}