/* Dinamik site renk paleti — ana + vurgu rengi tüm arayüze yayılır */

html,
body {
  background: var(--bg-dark) !important;
  scrollbar-color: rgba(var(--primary-rgb), 0.55) var(--theme-scrollbar-track) !important;
}

html::-webkit-scrollbar-track,
body::-webkit-scrollbar-track {
  background: var(--theme-scrollbar-track) !important;
}

html::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-thumb {
  border-color: var(--theme-scrollbar-track) !important;
}

#topbar {
  background: var(--theme-topbar-bg) !important;
}

@media (max-width: 900px) {
  #topbar {
    background: var(--theme-topbar-bg-mobile) !important;
  }
}

#sidebar {
  background: var(--theme-sidebar-bg) !important;
}

.bottom-bar {
  background: var(--theme-bottom-bar-bg) !important;
}

@media (max-width: 900px) {
  .action-bar {
    background: var(--theme-action-bar-bg-mobile) !important;
  }
}

.mob-menu {
  background: var(--theme-mob-menu-bg) !important;
}

.sb-banners .vip-action-card__surface--sb,
.vip-action-card__surface--home {
  background:
    radial-gradient(ellipse 90% 70% at 50% 0%, rgba(var(--q-r), var(--q-g), var(--q-b), 0.2) 0%, transparent 62%),
    var(--theme-surface-gradient) !important;
}

.is-admin-page {
  background: var(--bg-dark) !important;
}

/* Sidebar & mobil menü */
.mob-item.active,
.mob-shortcut.active,
.sb-item.active {
  color: var(--primary-accent) !important;
}

@media (hover: hover) and (pointer: fine) {
  .home-section-link:hover,
  .sb-item:hover {
    color: var(--primary-accent) !important;
  }
}

.mob-item.active::after {
  background: var(--theme-line-gradient) !important;
}

.mob-icon,
.mob-shortcut__icon,
.sb-icon {
  color: var(--primary) !important;
}

.mob-item.active {
  background: rgba(var(--primary-rgb), 0.1) !important;
}

.sb-item.active {
  color: var(--primary-accent) !important;
}

/* Mobil menü: hover kapalı (dokunmatik yapışkan hover) */
.mob-menu .mob-item:not(.active):hover,
.mob-menu .mob-shortcut:not(.active):hover {
  color: rgba(190, 215, 240, 0.88) !important;
  background: transparent !important;
  border-color: transparent !important;
  transform: none !important;
}

.mob-menu .mob-shortcut:not(.active):hover {
  color: rgba(190, 215, 240, 0.85) !important;
  background: rgba(255, 255, 255, 0.03) !important;
  border-color: rgba(255, 255, 255, 0.06) !important;
}

.mob-menu .mob-item:not(.active):hover .mob-icon {
  opacity: 0.75 !important;
}

.mob-menu .mob-footer-link:hover {
  color: rgba(160, 190, 220, 0.75) !important;
}

.mob-menu .mob-footer-link--danger:hover {
  color: rgba(255, 120, 120, 0.85) !important;
}

.mob-menu .mob-header-tg:hover,
.mob-menu .mob-social-btn:hover,
.mob-menu .mob-close--sheet:hover {
  transform: none !important;
  box-shadow: none !important;
}

.mob-menu .mob-header-tg:hover {
  background: rgba(255, 255, 255, 0.04) !important;
}

.mob-menu .mob-close--sheet:hover {
  background: rgba(255, 255, 255, 0.04) !important;
  color: rgba(220, 235, 255, 0.85) !important;
}

.mob-menu .mob-item.active:hover {
  color: var(--primary-accent) !important;
  background: rgba(var(--primary-rgb), 0.1) !important;
  border-color: rgba(var(--primary-rgb), 0.22) !important;
}

.mob-menu .mob-shortcut.active:hover {
  color: var(--primary-accent) !important;
  background: rgba(var(--primary-rgb), 0.12) !important;
  border-color: rgba(var(--primary-rgb), 0.28) !important;
}

/* Auth & birleşik butonlar */
.auth-btn,
.auth-btn--combined,
.mob-auth-btn,
.mob-auth-btn-outline:hover,
.profile-link-btn,
.profile-save-btn,
.evt-btn-primary,
.task-btn,
.game-play-btn,
.mkt-btn,
.avatar-circle,
.mob-avatar {
  background: var(--theme-btn-gradient) !important;
  color: #fff !important;
}

.game-play-btn:hover,
.game-play-btn:focus {
  color: #fff !important;
}

.auth-btn,
.auth-btn--combined,
.mob-auth-btn,
.profile-save-btn,
.evt-btn-primary:hover,
.task-btn:hover {
  box-shadow: 0 6px 22px var(--theme-btn-shadow) !important;
}

.auth-btn--combined,
.mob-auth-btn {
  background: linear-gradient(
    135deg,
    color-mix(in srgb, var(--primary) 88%, #ffffff 12%),
    color-mix(in srgb, var(--primary) 55%, #000000 45%)
  ) !important;
}

.bb-menu-icon {
  background: linear-gradient(
    135deg,
    color-mix(in srgb, var(--primary) 95%, #ffffff 5%),
    color-mix(in srgb, var(--primary) 50%, #000000 50%)
  ) !important;
  box-shadow: 0 4px 16px rgba(var(--primary-rgb), 0.4) !important;
}

.pass-toggle:hover,
.auth-check input {
  accent-color: var(--primary) !important;
}

/* Oyun kartları */
.game-card {
  --game-accent: var(--primary-accent);
  --game-accent-soft: rgba(var(--primary-accent-rgb), 0.42);
}

.game-card-ring-spinner {
  background: conic-gradient(
    from 0deg,
    transparent 0deg 200deg,
    rgba(var(--primary-accent-rgb), 0.35) 250deg,
    var(--primary-accent) 295deg,
    #ffffff 302deg,
    var(--primary-accent) 309deg,
    rgba(var(--primary-accent-rgb), 0.4) 330deg,
    transparent 360deg
  ) !important;
}

.game-card-aura {
  background: radial-gradient(
    ellipse 90% 70% at 50% 0%,
    rgba(var(--primary-accent-rgb), 0.28) 0%,
    transparent 68%
  ) !important;
}

.game-card:hover .game-card-surface {
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.12),
    inset 0 -1px 0 rgba(0, 0, 0, 0.35),
    0 16px 40px rgba(0, 0, 0, 0.55),
    0 0 28px rgba(var(--primary-rgb), 0.18) !important;
}

.game-bet-info {
  border-color: rgba(var(--primary-rgb), 0.18) !important;
}

.game-bet-divider {
  background: rgba(var(--primary-rgb), 0.18) !important;
}

.game-bet-value,
.game-play-btn,
.sg-win-amount,
.coin-amount,
.profile-coins-row,
.mkt-balance strong,
.lb-score,
.evt-date-ico,
.task-info-text strong {
  color: var(--primary-accent) !important;
}

.game-card-footer {
  border-top-color: rgba(var(--primary-rgb), 0.08) !important;
}

.btn-game-back:hover {
  background: rgba(var(--primary-rgb), 0.16) !important;
  border-color: rgba(var(--primary-rgb), 0.55) !important;
}

/* Profil, market, formlar */
.share-icon {
  background: rgba(var(--primary-rgb), 0.1) !important;
  border-color: rgba(var(--primary-rgb), 0.2) !important;
  color: var(--primary-accent) !important;
}

.profile-field input:focus,
.auth-field input:focus,
.pass-toggle:hover {
  border-color: rgba(var(--primary-rgb), 0.75) !important;
  box-shadow: 0 0 16px rgba(var(--primary-rgb), 0.25) !important;
}

.evt-btn-outline:hover {
  background: rgba(var(--primary-rgb), 0.12) !important;
}

.rank-1 .lb-rank-badge {
  background: var(--theme-btn-gradient) !important;
  box-shadow: 0 0 14px rgba(var(--primary-rgb), 0.5) !important;
}

.rank-1 .lb-avatar-wrap {
  border-color: rgba(var(--primary-rgb), 0.6) !important;
  box-shadow: 0 0 24px rgba(var(--primary-rgb), 0.3) !important;
}

.home-section-star svg,
.home-section-star--social svg {
  color: var(--primary-accent) !important;
}

.mob-body::-webkit-scrollbar-thumb {
  background: rgba(var(--primary-rgb), 0.22) !important;
}

/* Oyun embed (Blackjack, Dice) */
.bj-embed .bj-btn-deal,
.dice-embed .dice-btn-bet {
  background: var(--theme-btn-gradient) !important;
  box-shadow: 0 6px 22px var(--theme-btn-shadow) !important;
}

.bj-embed .bj-btn-deal:hover:not(:disabled),
.dice-embed .dice-btn-bet:hover:not(:disabled) {
  box-shadow: 0 8px 28px var(--theme-btn-shadow-hover) !important;
}

.bj-embed .bj-primary,
.bj-embed .bj-primary.bj-bold,
.dice-embed .dice-balance-value {
  color: var(--primary-accent) !important;
}

.bj-embed .bj-action-btn-strong {
  background: rgba(var(--primary-rgb), 0.14) !important;
  border: 1px solid rgba(var(--primary-rgb), 0.22) !important;
}

.bj-embed .bj-action-btn-strong:hover:not(:disabled) {
  background: rgba(var(--primary-rgb), 0.24) !important;
}

.bj-embed .game-logo-title,
.bj-embed .result-overlay.blackjack {
  color: var(--primary-accent) !important;
}

.bj-embed .game-logo-subtitle {
  color: var(--primary) !important;
}

/* Admin panel (site paletiyle uyumlu) */
.admin-btn {
  background: linear-gradient(
    135deg,
    var(--primary),
    color-mix(in srgb, var(--primary) 70%, #000000 30%)
  ) !important;
}

.admin-sidebar .sb-dropdown-item:hover,
.admin-sidebar .sb-dropdown-item.active {
  color: var(--primary-accent) !important;
  background: rgba(var(--primary-rgb), 0.08) !important;
}

.admin-file-field {
  border-color: rgba(var(--primary-rgb), 0.28) !important;
}