/**
 * FANATBET — принудительная тёмная тема на всех страницах.
 * Подключается последним (footer), чтобы перебить inline :root и prefers-color-scheme: light.
 */
html {
  color-scheme: dark;
}

:root {
  --primary-color: #3b82f6;
  --primary-light: #60a5fa;
  --primary-dark: #2563eb;
  --gradient-blue: linear-gradient(135deg, #3b82f6, #2563eb);
  --gradient-blue-hover: linear-gradient(135deg, #60a5fa, #3b82f6);
  --gradient-bc: linear-gradient(135deg, #f59e0b, #f97316);
  --text-primary: #f1f5f9;
  --text-secondary: #94a3b8;
  --text-muted: #64748b;
  --bg-body: #0f172a;
  --bg-light: #0f172a;
  --bg: #0f172a;
  --bg-primary: #1e293b;
  --bg-secondary: #0f172a;
  --bg-card: #1e293b;
  --bg-card-hover: #243044;
  --bg-elevated: #334155;
  --bg-input: #1e293b;
  --border-color: #334155;
  --border-subtle: #293548;
  --success-color: #10b981;
  --danger-color: #ef4444;
  --warning-color: #f59e0b;
  --live-color: #ef4444;
  --muted: #64748b;
  --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.2);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.25);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.35);
  --shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
}

@media (prefers-color-scheme: light) {
  :root {
    --primary-color: #3b82f6;
    --primary-light: #60a5fa;
    --primary-dark: #2563eb;
    --gradient-blue: linear-gradient(135deg, #3b82f6, #2563eb);
    --gradient-blue-hover: linear-gradient(135deg, #60a5fa, #3b82f6);
    --gradient-bc: linear-gradient(135deg, #f59e0b, #f97316);
    --text-primary: #f1f5f9;
    --text-secondary: #94a3b8;
    --text-muted: #64748b;
    --bg-body: #0f172a;
    --bg-light: #0f172a;
    --bg: #0f172a;
    --bg-primary: #1e293b;
    --bg-secondary: #0f172a;
    --bg-card: #1e293b;
    --bg-card-hover: #243044;
    --bg-elevated: #334155;
    --bg-input: #1e293b;
    --border-color: #334155;
    --border-subtle: #293548;
    --success-color: #10b981;
    --danger-color: #ef4444;
    --warning-color: #f59e0b;
    --live-color: #ef4444;
    --muted: #64748b;
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.2);
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.25);
    --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.35);
    --shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
  }
}

body {
  background-color: var(--bg-body) !important;
  color: var(--text-primary) !important;
}

.header,
.feed-header,
.page-header-bar {
  background: rgba(15, 23, 42, 0.95) !important;
  border-color: var(--border-color) !important;
  color: var(--text-primary) !important;
}

.app-main,
.app-layout,
.container {
  background-color: transparent;
  color: var(--text-primary);
}

.card,
.profile-section,
.section-card,
.feed-form,
.feed-post,
.feed-card,
.friend-card,
.friend-item,
.match-card,
.top-match-card,
.battle-card,
.notification-item,
.settings-section,
.bonus-card,
.transaction-item,
.coupon-card,
.modal-content,
.modal-box,
.popup-content,
.dialog-content,
.achievement-card,
.achievement,
.loto-card,
.toto-card,
.exchange-card,
.market-item,
.store-item,
.chat-container,
.messenger-sidebar,
.messenger-main,
.forecast-card,
.event-card,
.live-event-card,
.filter-panel,
.search-panel,
.stats-card,
.info-box,
.content-box,
.white-box,
.panel,
.box {
  background: var(--bg-card) !important;
  border-color: var(--border-color) !important;
  color: var(--text-primary);
}

table,
.table-wrap,
.data-table {
  background: var(--bg-card) !important;
  color: var(--text-primary) !important;
}

th {
  background: var(--bg-elevated) !important;
  color: var(--text-secondary) !important;
}

td {
  color: var(--text-primary) !important;
  border-color: var(--border-color) !important;
}

tr:hover {
  background: var(--bg-card-hover) !important;
}

input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="search"],
input[type="tel"],
input[type="url"],
textarea,
select {
  background: var(--bg-input) !important;
  border-color: var(--border-color) !important;
  color: var(--text-primary) !important;
}

input::placeholder,
textarea::placeholder {
  color: var(--text-muted) !important;
}

/* Убираем жёлтый фон автозаполнения браузера */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active,
textarea:-webkit-autofill,
textarea:-webkit-autofill:hover,
textarea:-webkit-autofill:focus,
textarea:-webkit-autofill:active,
select:-webkit-autofill,
select:-webkit-autofill:hover,
select:-webkit-autofill:focus,
select:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 1000px var(--bg-input) inset !important;
  box-shadow: 0 0 0 1000px var(--bg-input) inset !important;
  -webkit-text-fill-color: var(--text-primary) !important;
  caret-color: var(--text-primary);
  transition: background-color 5000s ease-in-out 0s;
}

input:autofill,
textarea:autofill,
select:autofill {
  box-shadow: 0 0 0 1000px var(--bg-input) inset !important;
  -webkit-text-fill-color: var(--text-primary) !important;
  caret-color: var(--text-primary);
}

.feed-form textarea,
.comment-input,
.search-input {
  background: var(--bg-input) !important;
  border-color: var(--border-color) !important;
  color: var(--text-primary) !important;
}

.tabs,
.tab-nav {
  border-color: var(--border-color) !important;
}

.tab,
.tab-btn {
  color: var(--text-secondary) !important;
}

.tab.active,
.tab-btn.active {
  color: var(--primary-light) !important;
}

.mobile-nav {
  background: rgba(15, 23, 42, 0.98) !important;
  border-top-color: var(--border-color) !important;
}

.sports-filter .sport-btn,
.sport-tab,
.league-filter-btn,
.filter-btn {
  background: var(--bg-card) !important;
  border-color: var(--border-color) !important;
  color: var(--text-secondary) !important;
}

.sports-filter .sport-btn.active,
.sport-tab.active,
.league-filter-btn.active,
.filter-btn.active {
  background: rgba(59, 130, 246, 0.2) !important;
  border-color: var(--primary-color) !important;
  color: var(--primary-light) !important;
}

.glicko-mini-block,
.glicko-vert-block,
.sstats-tab-btn,
.sstats-odd-btn-compact,
.match-event-item,
.event-time-badge,
.sstats-profits-table,
.sstats-profits-table th {
  background: var(--bg-card) !important;
  border-color: var(--border-color) !important;
  color: var(--text-primary) !important;
}

.sstats-odd-label-compact,
.event-type-name {
  color: var(--text-secondary) !important;
}

.glicko-mini-logo,
.glicko-vert-logo,
.sstats-glicko-logo {
  background: var(--bg-elevated) !important;
}

.stat-card,
.request-item,
.recommended-item,
.search-suggestions,
.quick-action-btn {
  background: var(--bg-card) !important;
  border-color: var(--border-color) !important;
  color: var(--text-primary) !important;
}

.friend-name,
.friend-level,
.stat-value,
.stat-label,
.activity-title,
.activity-content {
  color: var(--text-primary);
}

.friend-status {
  color: var(--text-secondary) !important;
}

.feed-post,
.stories-section,
.story-item,
.comment-form,
.reaction-bar {
  background: var(--bg-card) !important;
  border-color: var(--border-color) !important;
  color: var(--text-primary);
}

.feed-post.pinned {
  background: rgba(245, 158, 11, 0.08) !important;
  border-color: rgba(245, 158, 11, 0.35) !important;
}

.feed-comment,
.comment-item,
.reply-item {
  background: var(--bg-body) !important;
  border-color: var(--border-subtle) !important;
}

.profile-hero-card,
.profile-stats-grid,
.profile-tabs-content,
.coupon-history-item,
.bet-item,
.history-item {
  background: var(--bg-card) !important;
  border-color: var(--border-color) !important;
}

.page-title,
.title,
h1, h2, h3, h4 {
  color: var(--text-primary);
}

.text-muted,
.secondary-text,
.meta-text,
.subtitle,
.description {
  color: var(--text-secondary) !important;
}

a:not(.btn):not(.btn-primary):not(.odd-btn) {
  color: var(--primary-light);
}

.dropdown-menu,
.popup-menu,
.context-menu {
  background: var(--bg-card) !important;
  border-color: var(--border-color) !important;
}

.dropdown-item:hover {
  background: var(--bg-card-hover) !important;
}

/* Топ капперов, блоки событий и прогнозов */
.top-cappers-section,
.capper-card,
.event-info,
.forecast-preview,
.action-btn.secondary {
  background: var(--bg-card) !important;
  border-color: var(--border-color) !important;
  color: var(--text-primary);
}

.capper-card {
  background: linear-gradient(135deg, rgba(30, 58, 95, 0.45), rgba(30, 41, 59, 0.9)) !important;
}

.event-info {
  background: rgba(30, 58, 95, 0.35) !important;
  border: 1px solid var(--border-color) !important;
}

.team-logo {
  background: var(--bg-elevated) !important;
}

.team-name,
.event-vs,
.league-info,
.event-details {
  color: var(--text-primary);
}

.event-details,
.event-time {
  color: var(--text-secondary) !important;
}

/* Страницы входа и регистрации */
.auth-container,
.quick-login-container {
  background: var(--bg-card) !important;
  border: 1px solid var(--border-color) !important;
  color: var(--text-primary);
}

.login-method-switcher {
  background: var(--bg-elevated) !important;
}

.auth-container .form-group input,
.auth-container input[type="text"],
.auth-container input[type="email"],
.auth-container input[type="password"],
.auth-container input[type="tel"] {
  background: var(--bg-input) !important;
  border-color: var(--border-color) !important;
  color: var(--text-primary) !important;
}

.auth-container input:-webkit-autofill,
.auth-container input:-webkit-autofill:hover,
.auth-container input:-webkit-autofill:focus,
.auth-container input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 1000px var(--bg-input) inset !important;
  box-shadow: 0 0 0 1000px var(--bg-input) inset !important;
  -webkit-text-fill-color: var(--text-primary) !important;
  caret-color: var(--text-primary);
}

.auth-container .checkmark {
  background-color: var(--bg-input) !important;
  border-color: var(--border-color) !important;
}

.auth-container h2,
.auth-container label,
.auth-container .checkbox-text {
  color: var(--text-primary);
}

/* Top matches page */
body.top-matches-page {
  color-scheme: dark;
}

body.top-matches-page .event-header {
  background-color: rgba(51, 65, 85, 0.55) !important;
}

body.top-matches-page .event-stats {
  background-color: rgba(15, 23, 42, 0.75) !important;
}

body.top-matches-page .bet-btn:not(:hover):not(.disabled) {
  background-color: var(--bg-input) !important;
  border-color: var(--border-color) !important;
}

body.top-matches-page .sport-btn:not(.active) {
  background-color: var(--bg-elevated) !important;
}

body.top-matches-page .no-events {
  border: 1px solid var(--border-color);
}