/* Repost Talkov Stage 7: theme switcher + system mode */
:root {
  color-scheme: dark;
  --talkov-theme-bg: #07101a;
  --talkov-theme-surface: rgba(14,21,31,.985);
  --talkov-theme-surface-2: rgba(12,18,27,.965);
  --talkov-theme-surface-soft: rgba(255,255,255,.04);
  --talkov-theme-text: #eef2f6;
  --talkov-theme-muted: #bcc8d3;
  --talkov-theme-line: rgba(34,50,65,.82);
  --talkov-theme-line-soft: rgba(34,50,65,.58);
  --talkov-theme-shadow: 0 14px 34px rgba(0,0,0,.16);
}

html[data-theme="light"] {
  color-scheme: light;
  --talkov-theme-bg: #f4efe7;
  --talkov-theme-surface: rgba(255,255,255,.96);
  --talkov-theme-surface-2: rgba(248,243,235,.98);
  --talkov-theme-surface-soft: rgba(34,50,65,.05);
  --talkov-theme-text: #22313f;
  --talkov-theme-muted: #5f6e7b;
  --talkov-theme-line: rgba(59,83,102,.18);
  --talkov-theme-line-soft: rgba(59,83,102,.16);
  --talkov-theme-shadow: 0 14px 34px rgba(33,43,54,.08);
}

html[data-theme="light"] body {
  background:
    radial-gradient(circle at top center, rgba(181,194,210,.45), transparent 35%),
    linear-gradient(180deg, #f7f3ee 0%, #efe7dd 100%);
  color: var(--talkov-theme-text);
}

html[data-theme="light"] .card,
html[data-theme="light"] .block,
html[data-theme="light"] .dropdown-menu,
html[data-theme="light"] .modal-content,
html[data-theme="light"] .offcanvas,
html[data-theme="light"] .talkov-final-unity,
html[data-theme="light"] .talkov-route-strip__item,
html[data-theme="light"] .talkov-sidecard--compactFinal,
html[data-theme="light"] .talkov-forum-showcase,
html[data-theme="light"] .talkov-comments-timeline,
html[data-theme="light"] .talkov-curator-line {
  background: linear-gradient(180deg, var(--talkov-theme-surface), var(--talkov-theme-surface-2)) !important;
  color: var(--talkov-theme-text);
  border-color: var(--talkov-theme-line) !important;
  box-shadow: var(--talkov-theme-shadow);
}

html[data-theme="light"] .header,
html[data-theme="light"] .sticky-top,
html[data-theme="light"] header.sticky-top {
  background: rgba(255,255,255,.82);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--talkov-theme-line);
}

html[data-theme="light"] .logo__name,
html[data-theme="light"] .tab a,
html[data-theme="light"] .text,
html[data-theme="light"] .title,
html[data-theme="light"] .talkov-final-unity__title,
html[data-theme="light"] .talkov-route-strip__item strong,
html[data-theme="light"] h1,
html[data-theme="light"] h2,
html[data-theme="light"] h3,
html[data-theme="light"] h4,
html[data-theme="light"] strong {
  color: var(--talkov-theme-text) !important;
}

html[data-theme="light"] .description,
html[data-theme="light"] .text-secondary,
html[data-theme="light"] .talkov-final-unity__text,
html[data-theme="light"] .talkov-curator-line__meta em,
html[data-theme="light"] .talkov-comments-timeline__text,
html[data-theme="light"] .talkov-forum-showcase__text {
  color: var(--talkov-theme-muted) !important;
}

html[data-theme="light"] .btn.btn-primary,
html[data-theme="light"] .addpost__btn,
html[data-theme="light"] .talkov-login-btn {
  box-shadow: 0 10px 24px rgba(200,161,90,.14);
}

html[data-theme="light"] .theme__swither-title::after,
html[data-theme="light"] .theme__swither::before {
  color: #22313f;
}

.talkov-theme-switcher {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  padding: .28rem;
  border-radius: 999px;
  background: var(--talkov-theme-surface-soft);
  border: 1px solid var(--talkov-theme-line-soft);
  backdrop-filter: blur(8px);
}

.talkov-theme-switcher__btn {
  display: inline-flex;
  align-items: center;
  gap: .38rem;
  border: 0;
  padding: .5rem .72rem;
  border-radius: 999px;
  background: transparent;
  color: var(--talkov-theme-text);
  line-height: 1;
  transition: background .18s ease, color .18s ease, transform .18s ease, box-shadow .18s ease;
}

.talkov-theme-switcher__btn:hover {
  background: rgba(127,183,230,.12);
  color: #7fb7e6;
}

.talkov-theme-switcher__btn.is-active {
  background: rgba(200,161,90,.12);
  color: #c8a15a;
  box-shadow: inset 0 0 0 1px rgba(200,161,90,.22);
}

.talkov-theme-switcher__icon {
  font-size: 1rem;
}

.talkov-theme-switcher__text {
  font-size: .86rem;
  font-weight: 600;
}

.talkov-theme-menu .dropdown-item.is-active,
.talkov-theme-menu .dropdown-item:active {
  background: rgba(200,161,90,.12);
  color: #c8a15a;
}

@media (max-width: 991px) {
  .talkov-theme-switcher__text {
    display: none;
  }

  .talkov-theme-switcher__btn {
    padding: .5rem .62rem;
  }
}

@media (max-width: 767px) {
  .header.container {
    gap: .7rem;
    flex-wrap: wrap;
  }

  .talkov-theme-switcher {
    order: 3;
    width: 100%;
    justify-content: center;
  }
}