/* Dark mode через prefers-color-scheme */
@media (prefers-color-scheme: dark) {
  :root {
    --accent: #f60173;
    --secondary: #f4f4f4; /* Светлый акцент для темной темы */
    --bg: #04041a;
    --text-main: #f4f4f4;
    --text-muted: #9ca3af;
    --border: #2a2a40;    /* Добавлено: видимая, но мягкая граница для темной темы */
    --btn-bg: #0f0f25;

  body {
    color: var(--secondary);
    background: var(--bg);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

/* --- Общие ссылки (только цвет и hover) --- */
a {
  color: rgba(255, 255, 255, 0.9);
  text-decoration-color: rgba(246, 1, 115, 0.7);
}

a:hover {
    color: var(--secondary);
    text-decoration-color: var(--accent);
 }

/* --- Внешние ссылки стрелка (только цвет/иконка для темной темы) --- */
a[href^="http"]:not([href*="localhost"]):not(.footer-badge-link)::after {
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="%23aaa" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M7 17L17 7"/><path d="M7 7h10v10"/></svg>') no-repeat center;
}

mark {
  background: linear-gradient(to top, rgba(255, 215, 0, 0.25) 55%, transparent 45%);
}

details {
  background-color: rgba(40, 40, 40, 0.2);
  border-color: rgba(255, 255, 255, 0.1);
}

details:hover {
  background-color: rgba(40, 40, 40, 0.3);
  border-color: rgba(255, 255, 255, 0.15);
}

summary::after {
  color: #aaa;
}

details[open] summary::after {
  color: #ccc;
}

th {
  color: #eee;
  background-color: rgba(255, 255, 255, 0.04);
  border-bottom: 2px solid rgba(255, 255, 255, 0.12);
}

th,
td {
  border-bottom-color: rgba(255, 255, 255, 0.08);
}

tbody tr:nth-child(even) {
  background-color: rgba(255, 255, 255, 0.02);
}

tbody tr:nth-child(odd) {
  background-color: transparent;
}

tbody tr:hover {
  background-color: rgba(255, 255, 255, 0.08) !important;
}

code {
  background-color: rgba(225, 228, 232, 0.08); /* светло-серый с прозрачностью */
  color: #f97583; /* более мягкий красный для тёмного фона */
}

pre {
  background-color: rgba(20, 20, 20, 0.4); /* тёмно-серый фон */
  border-color: rgba(255, 255, 255, 0.12);
  color: #e6edf3; /* светлый текст */
}

.inline-spoiler {
  background-color: rgba(255, 255, 255, 0.1); /* Фон для скрытия текста */
}

.inline-spoiler.open {
  color: inherit; /* Текст становится видимым */
  background-color: transparent; /* Фон убирается */
}

  header {
    background-color: rgba(4, 4, 26, 0.7);
  }
}
}