/* ====== Base theme variables ====== */
html[data-theme="light"] {
  --page-bg: #f8f9fa;
  --section-bg: #ffffff;
  --section-alt-bg: #f8f9fa;
  --card-bg: #ffffff;
  --text-color: #212529;
}

html[data-theme="dark"] {
  --page-bg: #121212;
  --section-bg: #1e1e1e;
  --section-alt-bg: #111827;
  --card-bg: #1f2933;
  --text-color: #f8f9fa;
}

/* ====== Global ====== */
body {
  background-color: var(--page-bg);
  color: var(--text-color);
}

main {
  min-height: 60vh;
}

/* Smooth theme transitions */
body,
.card,
#home-hero,
#motivation,
#analytics-overview,
#latest-activity {
  transition: background-color 0.25s ease, color 0.25s ease;
}

/* Cards follow theme */
.card {
  background-color: var(--card-bg);
  color: var(--text-color);
}

/* Hero and light sections respect theme */
#home-hero,
#motivation {
  background-color: var(--section-alt-bg) !important;
}

/* Analytics overview section uses main section background */
#analytics-overview {
  background-color: var(--section-bg);
}

/* Force body text and headings to follow theme color */
body,
p,
span,
li,
h1,
h2,
h3,
h4,
h5,
h6 {
  color: var(--text-color);
}

/* Muted text adjusted for dark mode */
html[data-theme="dark"] .text-muted {
  color: rgba(248, 249, 250, 0.6) !important;
}

/* Links */
a {
  color: #0d6efd;
}

html[data-theme="dark"] a {
  color: #66b2ff;
}

/* Outline primary button in dark mode */
html[data-theme="dark"] .btn-outline-primary {
  color: #66b2ff;
  border-color: #66b2ff;
}

html[data-theme="dark"] .btn-outline-primary:hover {
  background-color: #66b2ff;
  color: #111827;
}

/* ====== Team cards ====== */
.team-card-img {
  width: 100%;
  height: 220px;
  object-fit: cover;
  object-position: center;
}

/* ====== Latest Activity ====== */
#latest-activity {
  background-color: var(--section-bg);
}

#latest-activity .list-group-item {
  background-color: var(--card-bg);
  color: var(--text-color);
  border-color: rgba(0, 0, 0, 0.125);
}

html[data-theme="dark"] #latest-activity .list-group-item {
  border-color: #2d3748;
}

#latest-activity .list-group-item p,
#latest-activity .list-group-item small,
#latest-activity .list-group-item h3 {
  color: var(--text-color);
}

/* ====== Footer ====== */
footer {
  background-color: #111827;
  color: #f8f9fa;
}

/* Footer subtitle "Stay on top of your tasks." */
footer .small.text-muted {
  color: rgba(255, 255, 255, 0.7);
}

/* In light mode, footer subtitle darker */
html[data-theme="light"] footer .small.text-muted {
  color: #6c757d;
}

footer a {
  text-decoration: none;
}

/* Keep social icons visible in both modes */
footer a.text-light {
  color: #f8f9fa !important;
}