/* darkmode.css - Style untuk Tema Gelap (Dark Mode) */

html, body {
  background: radial-gradient(circle at 50% 50%, #0F172A 0%, #020617 100%) !important;
}

/* Header */
.header-text h1 {
  color: #F8FAFC !important;
}

.header-badge {
  color: #38BDF8 !important;
  background: rgba(56, 189, 248, 0.08) !important;
  border-color: rgba(56, 189, 248, 0.15) !important;
}

/* Card Utama */
.app-card {
  background: rgba(15, 23, 42, 0.45) !important;
  border-color: rgba(255, 255, 255, 0.04) !important;
  box-shadow: 
    0 25px 50px -12px rgba(0, 0, 0, 0.5), 
    0 0 100px rgba(0, 242, 254, 0.02),
    inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

.app-card:hover {
  border-color: rgba(255, 255, 255, 0.08) !important;
  box-shadow: 
    0 35px 70px -15px rgba(0, 0, 0, 0.6), 
    0 0 120px rgba(0, 242, 254, 0.03),
    inset 0 1px 0 rgba(255, 255, 255, 0.08) !important;
}

/* Elemen SVG dalam Mode Gelap */
.Cards {
  fill: rgba(30, 41, 59, 0.4) !important;
  stroke: rgba(51, 65, 85, 0.4) !important;
  stroke-width: 1.5px !important;
}

.oDoLive-Speed {
  fill: #F8FAFC !important;
}

.oDoLive-Status {
  fill: #E2E8F0 !important;
}

.rtextnum {
  fill: #F8FAFC !important;
}

.rtext {
  fill: #94A3B8 !important;
}

.rtextmbms {
  fill: #64748B !important;
}

.oDo-Meter {
  fill: #64748B !important;
}

.oDoTop-Speed {
  fill: #64748B !important;
}

.main-Gaugebg {
  stroke: rgba(30, 41, 59, 0.8) !important;
}

.deskStart {
  stroke: rgba(30, 41, 59, 0.8) !important;
}

.progressbg {
  stroke: rgba(30, 41, 59, 0.8) !important;
}

.uiBg {
  fill: #475569 !important;
}

/* Penyesuaian Logo dalam Mode Gelap */
svg [style*="fill: #4d4d4d"] {
  fill: #F8FAFC !important; /* Warna Putih Slate untuk teks utama logo */
}

svg [style*="fill: #3da6ff"] {
  fill: #38BDF8 !important; /* Neon Blue untuk aksen logo */
}

/* Tombol Mode Gelap */
.darkmode {
  fill: #64748B !important;
}

.darkmode:hover {
  fill: #38BDF8 !important;
}

/* Footer & Credits */
.Credits {
  color: #64748B !important;
}

.Credits a {
  color: #38BDF8 !important;
}

.Credits a:hover {
  color: #7dd3fc !important;
}

.copyright {
  color: #475569 !important;
}

.jitter-Mob {
  fill: #94A3B8 !important;
}

/* Dark Mode Overrides for Client IP Container */
.client-ip-container {
  color: #94A3B8 !important;
}

.client-ip-container span#client-ip-text {
  color: #38BDF8 !important;
}