/* ==============================================
   GLOBAL DARK THEME OVERRIDE — Tango Palette
   Jet Black #0A0A0A · Dark Gray #1F1F1F
   Purple #6B2EE5 · Fuchsia Pink #E9407A
   Forces dark appearance across ALL pages.
   This should be the LAST stylesheet loaded.
   ============================================= */

/* ── Force dark body and root ── */
html, body {
  background: #0A0A0A !important;
  color: #FFFFFF !important;
}

/* Prevent white flash */
html { background: #0A0A0A !important; }

/* ── Modal / sheet backdrops ── */
.modal-overlay, .bottom-sheet, .modal-center {
  background-color: #1F1F1F !important;
  color: #fff !important;
}

.bottom-sheet {
  background: #1F1F1F !important;
  border-top: 1px solid rgba(107, 46, 229, 0.15) !important;
}

/* ── Cards and containers ── */
.card, .glass-card, .info-card, .action-modal-card {
  background: rgba(31, 31, 31, 0.92) !important;
  border-color: rgba(255, 255, 255, 0.07) !important;
  color: #fff !important;
}

/* ── Navigation ── */
.bottom-nav, #bottomNav {
  background: rgba(10, 10, 10, 0.97) !important;
  border-top: 1px solid rgba(107, 46, 229, 0.15) !important;
}

.nav-item, .nav-link {
  color: rgba(255, 255, 255, 0.45) !important;
}

.nav-item.active, .nav-link.active {
  color: var(--primary) !important;
}

/* ── Page header ── */
.page-header, .app-header, .room-header {
  background: rgba(10, 10, 10, 0.97) !important;
  border-bottom: 1px solid rgba(107, 46, 229, 0.12) !important;
  color: #fff !important;
}

/* ── Inputs ── */
input, textarea, select {
  background: rgba(255, 255, 255, 0.06) !important;
  border-color: rgba(255, 255, 255, 0.10) !important;
  color: #fff !important;
}

input::placeholder, textarea::placeholder {
  color: rgba(255, 255, 255, 0.35) !important;
}

.form-input {
  background: rgba(255, 255, 255, 0.06) !important;
  border: 1px solid rgba(255, 255, 255, 0.10) !important;
  color: #fff !important;
}

/* ── Buttons ── */
.btn-glass {
  background: rgba(255, 255, 255, 0.07) !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  color: #fff !important;
}

/* ── Message bubbles ── */
.msg-bubble {
  background: rgba(255, 255, 255, 0.07) !important;
  color: #fff !important;
}

.msg-row.own .msg-bubble {
  background: linear-gradient(135deg, rgba(107, 46, 229, 0.45), rgba(107, 46, 229, 0.28)) !important;
}

/* ── Chat page ── */
.chat-page,
.page-content.no-nav.chat-page,
#dmMessages {
  background: #0A0A0A !important;
  background-color: #0A0A0A !important;
}

/* ── Chat input area ── */
.chat-input-area, .chat-input-wrap, .chat-input-inner {
  background: rgba(10, 10, 10, 0.97) !important;
  border-color: rgba(255, 255, 255, 0.08) !important;
}

.chat-input-wrap input, .chat-input-inner input {
  background: transparent !important;
  color: #fff !important;
}

/* ── DM full-screen panel ── */
.dms-fullscreen-v2 {
  background: #0A0A0A !important;
}

/* ── Sheet menu items ── */
.sheet-menu-item {
  background: rgba(255, 255, 255, 0.04) !important;
  border-color: rgba(255, 255, 255, 0.07) !important;
  color: #fff !important;
}

.sheet-menu-item:hover, .sheet-menu-item:active {
  background: rgba(107, 46, 229, 0.10) !important;
}

/* ── Tabs ── */
.tab-bar, .tabs {
  background: rgba(0, 0, 0, 0.35) !important;
}

/* ── Lists ── */
.member-item:hover, .member-item:active {
  background: rgba(107, 46, 229, 0.08) !important;
}

/* ── Search bar ── */
.search-bar {
  background: rgba(255, 255, 255, 0.06) !important;
  border-color: rgba(255, 255, 255, 0.10) !important;
}

/* ── Tags ── */
.tag {
  background: rgba(255, 255, 255, 0.10) !important;
  color: rgba(255, 255, 255, 0.80) !important;
}

.tag.gold    { background: rgba(255, 215, 0,   0.20) !important; color: #FFD700 !important; }
.tag.primary { background: rgba(107, 46, 229,  0.20) !important; color: #A076FF !important; }
.tag.danger  { background: rgba(255, 42,  42,  0.20) !important; color: #FF2A2A !important; }
.tag.pink    { background: rgba(233, 64,  122, 0.20) !important; color: #E9407A !important; }

/* ── Profile / store / explore ── */
.profile-card, .store-card, .explore-card {
  background: rgba(31, 31, 31, 0.96) !important;
  color: #fff !important;
}

/* ── Scrollbar ── */
::-webkit-scrollbar              { width: 4px; height: 4px; }
::-webkit-scrollbar-track        { background: transparent; }
::-webkit-scrollbar-thumb        { background: rgba(107, 46, 229, 0.35); border-radius: 10px; }
::-webkit-scrollbar-thumb:hover  { background: rgba(233, 64, 122, 0.55); }
* { scrollbar-width: thin; scrollbar-color: rgba(107, 46, 229, 0.35) transparent; }
