/**
 * Gaming platform theme polish — visual only.
 * Loaded after styles.css / auth.css. Does not change markup or JS hooks.
 */

/* -------------------------------------------------------------------------- */
/* Shared dark shell                                                          */
/* -------------------------------------------------------------------------- */

body.sinqlo-page[data-appearance="dark"] {
  background:
    radial-gradient(1200px 600px at 10% -10%, rgb(var(--color-primary-rgb) / 0.16), transparent 55%),
    radial-gradient(900px 500px at 100% 0%, rgb(var(--color-cyan-rgb) / 0.1), transparent 50%),
    var(--page);
  color: var(--ink);
}

/* Bootstrap utilities stay light-theme (near-black) unless we override them. */
body.sinqlo-page[data-appearance="dark"] .text-muted,
body.sinqlo-page[data-appearance="dark"] .text-body-secondary,
body.sinqlo-page[data-appearance="dark"] .text-secondary,
body.sinqlo-page[data-appearance="dark"] .text-black-50,
body.sinqlo-page[data-appearance="dark"] .form-text,
body.sinqlo-page[data-appearance="dark"] .form-control::placeholder,
body.sinqlo-page[data-appearance="dark"] .form-select::placeholder {
  color: var(--muted) !important;
}

body.sinqlo-page[data-appearance="dark"] .text-dark,
body.sinqlo-page[data-appearance="dark"] .text-black,
body.sinqlo-page[data-appearance="dark"] .text-body,
body.sinqlo-page[data-appearance="dark"] .text-body-emphasis,
body.sinqlo-page[data-appearance="dark"] .text-reset {
  color: var(--ink) !important;
}

body.sinqlo-page[data-appearance="dark"] .table,
body.sinqlo-page[data-appearance="dark"] .table > :not(caption) > * > *,
body.sinqlo-page[data-appearance="dark"] .games-table,
body.sinqlo-page[data-appearance="dark"] .games-table td,
body.sinqlo-page[data-appearance="dark"] .games-table th {
  color: var(--ink);
  border-color: var(--line);
}

body.sinqlo-page[data-appearance="dark"] .table thead th,
body.sinqlo-page[data-appearance="dark"] .games-table thead th {
  color: var(--muted);
}

body.sinqlo-page[data-appearance="dark"] .table .text-muted,
body.sinqlo-page[data-appearance="dark"] .games-table .text-muted,
body.sinqlo-page[data-appearance="dark"] td.text-muted,
body.sinqlo-page[data-appearance="dark"] th.text-muted {
  color: var(--muted) !important;
}

body.sinqlo-page[data-appearance="dark"] .app-sidebar,
body.sinqlo-page[data-appearance="dark"] .app-sidebar--dash {
  background: linear-gradient(180deg, #0d0f14 0%, #0a0b10 100%);
  border-right-color: var(--sidebar-border);
  box-shadow: 8px 0 32px rgba(0, 0, 0, 0.25);
}

body.sinqlo-page[data-appearance="dark"] .app-sidebar--dash .sidebar-link.active,
body.sinqlo-page[data-appearance="dark"] .sidebar-link.active {
  background: var(--sidebar-link-active-bg);
  color: #fff;
  box-shadow: inset 0 0 0 1px rgb(var(--color-primary-rgb) / 0.35);
}

body.sinqlo-page[data-appearance="dark"] .app-sidebar--dash .sidebar-link:hover {
  background: var(--sidebar-link-hover-bg);
  color: var(--ink);
}

body.sinqlo-page[data-appearance="dark"] .main-wrap,
body.sinqlo-page[data-appearance="dark"] .dash-page--bento {
  background: transparent;
}

body.sinqlo-page[data-appearance="dark"] .bento-cell,
body.sinqlo-page[data-appearance="dark"] .deposit-card,
body.sinqlo-page[data-appearance="dark"] .withdraw-card,
body.sinqlo-page[data-appearance="dark"] .profile-card,
body.sinqlo-page[data-appearance="dark"] .notification-card,
body.sinqlo-page[data-appearance="dark"] .notif-card,
body.sinqlo-page[data-appearance="dark"] .table-card,
body.sinqlo-page[data-appearance="dark"] .panel {
  background: linear-gradient(165deg, rgb(255 255 255 / 0.03) 0%, var(--card) 42%);
  border: 1px solid var(--line);
  box-shadow: var(--shadow);
  backdrop-filter: blur(8px);
}

body.sinqlo-page[data-appearance="dark"] .bento-cell:hover {
  border-color: rgb(var(--color-primary-rgb) / 0.28);
}

body.sinqlo-page[data-appearance="dark"] .bento-quick__btn--accent,
body.sinqlo-page[data-appearance="dark"] .btn-primary,
body.sinqlo-page[data-appearance="dark"] .page-btn:not(.muted-btn):not(.btn-light) {
  background: var(--gradient);
  border-color: transparent;
  color: #fff;
  box-shadow: 0 8px 22px rgb(var(--color-primary-rgb) / 0.28);
}

body.sinqlo-page[data-appearance="dark"] .bento-quick__btn--accent:hover,
body.sinqlo-page[data-appearance="dark"] .btn-primary:hover {
  filter: brightness(1.06);
  box-shadow: 0 10px 28px rgb(var(--color-primary-rgb) / 0.36);
}

body.sinqlo-page[data-appearance="dark"] .form-control,
body.sinqlo-page[data-appearance="dark"] .form-select,
body.sinqlo-page[data-appearance="dark"] .search-control {
  background: var(--surface) !important;
  border-color: var(--line) !important;
  color: var(--ink) !important;
}

body.sinqlo-page[data-appearance="dark"] .form-control:focus,
body.sinqlo-page[data-appearance="dark"] .form-select:focus {
  border-color: rgb(var(--color-primary-rgb) / 0.55) !important;
  box-shadow: 0 0 0 3px rgb(var(--color-primary-rgb) / 0.16) !important;
}

body.sinqlo-page[data-appearance="dark"] .badge,
body.sinqlo-page[data-appearance="dark"] .deposit-hero__cta,
body.sinqlo-page[data-appearance="dark"] .bento-spotlight__action {
  border-radius: 999px;
}

body.sinqlo-page[data-appearance="dark"] .deposit-hero__cta {
  background: var(--gradient);
  color: #fff;
  border: 0;
  box-shadow: 0 8px 22px rgb(var(--color-primary-rgb) / 0.3);
}

body.sinqlo-page[data-appearance="dark"] .binary-stat,
body.sinqlo-page[data-appearance="dark"] .bento-game-stat {
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: 14px;
}

body.sinqlo-page[data-appearance="dark"] .mobile-menu-btn,
body.sinqlo-page[data-appearance="dark"] .circle-btn,
body.sinqlo-page[data-appearance="dark"] .user-menu__toggle,
body.sinqlo-page[data-appearance="dark"] .sinqlo-appearance-toggle {
  background: var(--surface) !important;
  border: 1px solid var(--line) !important;
  color: var(--ink) !important;
}

@media (prefers-reduced-motion: reduce) {
  body.sinqlo-page[data-appearance="dark"] * {
    transition: none !important;
    animation: none !important;
  }
}

/* -------------------------------------------------------------------------- */
/* Auth pages — gaming split                                                  */
/* -------------------------------------------------------------------------- */

body.sinqlo-page.auth-v2-page[data-appearance="dark"] {
  background: #08090d;
}

body.sinqlo-page.auth-v2-page[data-appearance="dark"] .auth-v2__hero {
  position: relative;
  background:
    radial-gradient(800px 420px at 20% 10%, rgb(var(--color-primary-rgb) / 0.35), transparent 60%),
    radial-gradient(700px 400px at 90% 80%, rgb(var(--color-cyan-rgb) / 0.18), transparent 55%),
    linear-gradient(160deg, #0d0f14 0%, #12151c 55%, #08090d 100%);
  color: #f8fafc;
  border-right: 1px solid rgba(255, 255, 255, 0.06);
}

body.sinqlo-page.auth-v2-page[data-appearance="dark"] .auth-v2__hero::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
  background-size: 48px 48px;
  opacity: 0.35;
  mask-image: linear-gradient(180deg, #000 20%, transparent 95%);
}

body.sinqlo-page.auth-v2-page[data-appearance="dark"] .auth-v2__hero-inner,
body.sinqlo-page.auth-v2-page[data-appearance="dark"] .auth-v2__hero-bottom {
  position: relative;
  z-index: 1;
}

body.sinqlo-page.auth-v2-page[data-appearance="dark"] .auth-v2__hero-title {
  color: #fff;
  letter-spacing: -0.03em;
  text-shadow: 0 10px 40px rgba(0, 0, 0, 0.35);
}

body.sinqlo-page.auth-v2-page[data-appearance="dark"] .auth-v2__hero-text,
body.sinqlo-page.auth-v2-page[data-appearance="dark"] .auth-v2__feature p,
body.sinqlo-page.auth-v2-page[data-appearance="dark"] .auth-v2__footer--hero,
body.sinqlo-page.auth-v2-page[data-appearance="dark"] .auth-v2__footer--hero a {
  color: rgba(243, 244, 246, 0.78);
}

body.sinqlo-page.auth-v2-page[data-appearance="dark"] .auth-v2__feature {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 14px;
  backdrop-filter: blur(10px);
}

body.sinqlo-page.auth-v2-page[data-appearance="dark"] .auth-v2__feature-icon {
  background: rgb(var(--color-primary-rgb) / 0.22);
  color: #c4b5fd;
  border: 1px solid rgb(var(--color-primary-rgb) / 0.35);
}

body.sinqlo-page.auth-v2-page[data-appearance="dark"] .auth-v2__form-side,
body.sinqlo-page.auth-v2-page[data-appearance="dark"] .auth-v2__panel {
  background: #0d0f14;
  border-color: rgba(255, 255, 255, 0.06);
}

body.sinqlo-page.auth-v2-page[data-appearance="dark"] .auth-v2__card,
body.sinqlo-page.auth-v2-page[data-appearance="dark"] .auth-v2__card--auth {
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.04) 0%, #12151c 40%);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 20px;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.45);
}

body.sinqlo-page.auth-v2-page[data-appearance="dark"] .auth-v2__input {
  background: #151923;
  border-color: rgba(255, 255, 255, 0.1);
  color: #f3f4f6;
}

body.sinqlo-page.auth-v2-page[data-appearance="dark"] .auth-v2__input:focus-within {
  border-color: rgb(var(--color-primary-rgb) / 0.55);
  box-shadow: 0 0 0 3px rgb(var(--color-primary-rgb) / 0.18);
  background: #1a1f2b;
}

body.sinqlo-page.auth-v2-page[data-appearance="dark"] .auth-v2__input input,
body.sinqlo-page.auth-v2-page[data-appearance="dark"] .auth-v2__account-picker select,
body.sinqlo-page.auth-v2-page[data-appearance="dark"] label {
  color: #f3f4f6;
}

body.sinqlo-page.auth-v2-page[data-appearance="dark"] .auth-v2__input input::placeholder {
  color: #6b7280;
}

body.sinqlo-page.auth-v2-page[data-appearance="dark"] .auth-v2__btn--primary {
  background: linear-gradient(135deg, #9b7bff 0%, #7c5cff 50%, #22d3ee 160%);
  border: 0;
  color: #fff;
  box-shadow: 0 12px 30px rgb(124 92 255 / 0.35);
}

body.sinqlo-page.auth-v2-page[data-appearance="dark"] .auth-v2__btn--primary:hover:not(:disabled) {
  filter: brightness(1.05);
}

body.sinqlo-page.auth-v2-page[data-appearance="dark"] .auth-v2__btn--primary:disabled {
  opacity: 0.55;
  box-shadow: none;
}

body.sinqlo-page.auth-v2-page[data-appearance="dark"] .auth-v2__brand-logo {
  filter: drop-shadow(0 8px 24px rgba(0, 0, 0, 0.35));
}

@media (max-width: 900px) {
  body.sinqlo-page.auth-v2-page[data-appearance="dark"] .auth-v2__hero {
    min-height: 220px;
  }
}

/* -------------------------------------------------------------------------- */
/* Games hub cards                                                            */
/* -------------------------------------------------------------------------- */

body.sinqlo-page[data-appearance="dark"] .games-card {
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.04) 0%, #12151c 45%);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 18px;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.35);
  transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
}

body.sinqlo-page[data-appearance="dark"] .games-card:hover {
  transform: translateY(-3px);
  border-color: rgb(var(--color-primary-rgb) / 0.45);
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.45), 0 0 0 1px rgb(var(--color-primary-rgb) / 0.2);
}

body.sinqlo-page[data-appearance="dark"] .games-card__icon {
  background: rgb(var(--color-primary-rgb) / 0.18);
  color: #c4b5fd;
  border: 1px solid rgb(var(--color-primary-rgb) / 0.3);
}

body.sinqlo-page[data-appearance="dark"] .games-card__stats {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.06);
}

body.sinqlo-page[data-appearance="dark"] .games-badge {
  background: rgb(var(--color-primary-rgb) / 0.16);
  color: #ddd6fe;
}

body.sinqlo-page[data-appearance="dark"] .games-badge--lock {
  background: rgb(245 158 11 / 0.18);
  color: #fbbf24;
}

body.sinqlo-page[data-appearance="dark"] .games-card__status--live,
body.sinqlo-page[data-appearance="dark"] .games-card__status--active {
  background: rgb(16 185 129 / 0.2);
  color: #34d399;
}

body.sinqlo-page[data-appearance="dark"] .notif-card {
  background: var(--surface);
  border-color: var(--line);
  box-shadow: none;
}

body.sinqlo-page[data-appearance="dark"] .notif-card__title {
  color: var(--ink);
}

body.sinqlo-page[data-appearance="dark"] .notif-card__text,
body.sinqlo-page[data-appearance="dark"] .notif-card__time {
  color: var(--muted);
}

body.sinqlo-page[data-appearance="dark"] .notif-card--empty {
  background: var(--surface);
}

/* -------------------------------------------------------------------------- */
/* Network list pages — FD orders, downline, level chart                      */
/* -------------------------------------------------------------------------- */

body.sinqlo-page[data-appearance="dark"] .fd-order-card,
body.sinqlo-page[data-appearance="dark"] .fd-order-card--empty {
  background: linear-gradient(165deg, rgb(255 255 255 / 0.03) 0%, var(--card) 55%);
  border-color: var(--line);
  box-shadow: 0 8px 20px rgb(0 0 0 / 0.22);
}

body.sinqlo-page[data-appearance="dark"] .fd-order-card--active {
  background: linear-gradient(90deg, rgb(16 185 129 / 0.14) 0%, var(--card) 48%);
}

body.sinqlo-page[data-appearance="dark"] .fd-order-card--matured {
  background: linear-gradient(90deg, rgb(37 99 235 / 0.14) 0%, var(--card) 48%);
}

body.sinqlo-page[data-appearance="dark"] .fd-order-card--pending {
  background: linear-gradient(90deg, rgb(245 158 11 / 0.14) 0%, var(--card) 48%);
}

body.sinqlo-page[data-appearance="dark"] .fd-order-card--matured .fd-order-card__index {
  color: #93c5fd;
}

body.sinqlo-page[data-appearance="dark"] .downline-filters-form {
  background: linear-gradient(180deg, var(--surface) 0%, rgb(var(--color-primary-rgb) / 0.06) 100%);
  border-color: var(--line);
}

body.sinqlo-page[data-appearance="dark"] .downline-filters-form .form-label {
  color: var(--muted);
}

body.sinqlo-page[data-appearance="dark"] .downline-tab:not(.is-active) {
  background: var(--surface);
  border-color: var(--line);
  color: var(--muted);
}

body.sinqlo-page[data-appearance="dark"] .downline-tab:not(.is-active) span {
  color: var(--ink);
  background: rgb(var(--color-primary-rgb) / 0.14);
}

body.sinqlo-page[data-appearance="dark"] .downline-status--active {
  color: #6ee7b7;
  background: rgb(16 185 129 / 0.16);
}

body.sinqlo-page[data-appearance="dark"] .downline-table tbody tr:hover {
  background: rgb(var(--color-primary-rgb) / 0.08);
}

body.sinqlo-page[data-appearance="dark"] .level-detail-level-card,
body.sinqlo-page[data-appearance="dark"] .level-detail-level-card.accordion-item {
  background: linear-gradient(165deg, rgb(255 255 255 / 0.03) 0%, var(--card) 55%);
  border-color: var(--line);
}

body.sinqlo-page[data-appearance="dark"] .level-detail-level-toggle,
body.sinqlo-page[data-appearance="dark"] .level-detail-level-toggle.accordion-button {
  color: var(--ink);
  background: transparent;
  box-shadow: none;
}

body.sinqlo-page[data-appearance="dark"] .level-detail-level-toggle:not(.collapsed),
body.sinqlo-page[data-appearance="dark"] .level-detail-level-toggle.accordion-button:not(.collapsed) {
  color: var(--ink);
  background: var(--surface);
  box-shadow: none;
}

body.sinqlo-page[data-appearance="dark"] .level-detail-level-body,
body.sinqlo-page[data-appearance="dark"] .level-detail-level-body.accordion-body {
  background: transparent;
  color: var(--ink);
}

body.sinqlo-page[data-appearance="dark"] .level-detail-rank-badge {
  color: var(--ink);
  background: rgb(var(--color-primary-rgb) / 0.12);
  border-color: var(--line);
}

body.sinqlo-page[data-appearance="dark"] .level-detail-empty strong,
body.sinqlo-page[data-appearance="dark"] .level-detail-empty i {
  color: var(--ink);
}

body.sinqlo-page[data-appearance="dark"] .downline-filter-btn.btn-outline-secondary {
  background: var(--surface);
  border-color: var(--line);
  color: var(--ink);
}

body.sinqlo-page[data-appearance="dark"] .sinqlo-drawer-backdrop {
  background: rgba(0, 0, 0, 0.62);
}

body.sinqlo-page[data-appearance="dark"] .sinqlo-drawer.is-open .sinqlo-drawer-panel {
  background: var(--card) !important;
  border-color: var(--line);
  box-shadow: 0 -18px 48px rgba(0, 0, 0, 0.45);
}

html.mobile-app body.sinqlo-page[data-appearance="dark"] .activation-drawer .sinqlo-drawer-header,
html.mobile-app body.sinqlo-page[data-appearance="dark"] .buy-score-drawer .sinqlo-drawer-header {
  background: var(--card) !important;
}

body.sinqlo-page[data-appearance="dark"] .accordion-button::after {
  filter: invert(1) brightness(1.4);
}

@media (prefers-reduced-motion: reduce) {
  body.sinqlo-page[data-appearance="dark"] .games-card {
    transition: none;
  }
  body.sinqlo-page[data-appearance="dark"] .games-card:hover {
    transform: none;
  }
}