/* 2USD — ZAR Inspired Home V1
   Visual-only. No financial or application logic.
*/

:root {
  --zar-bg: #02150d;
  --zar-card: #07271b;
  --zar-card-2: #0b3021;
  --zar-primary: #1db866;
  --zar-light: #35c98d;
  --zar-ink: #e9f2ec;
  --zar-muted: #7f968a;
  --zar-line: rgba(53,201,141,.13);
}

/* HOME BACKGROUND */
body:has(.dashboard-page) {
  background: #02150d !important;
  color: var(--zar-ink);
}

body:has(.dashboard-page) .app,
body:has(.dashboard-page) .app-container,
body:has(.dashboard-page) .app-shell,
body:has(.dashboard-page) .main-content,
body:has(.dashboard-page) .page-shell,
.dashboard-page {
  background-color: transparent !important;
  color: var(--zar-ink);
}

.dashboard-page {
  background-image:
    radial-gradient(
      ellipse 380px 210px at 85% 0%,
      rgba(29,184,102,.12),
      transparent 75%
    ) !important;
}

/* PROFILE / HEADER */
.dashboard-page .profile-card,
.dashboard-page .profile-shell {
  background: linear-gradient(
    145deg,#0b3323,#062117
  ) !important;
  border-color: var(--zar-line) !important;
  box-shadow: 0 12px 32px rgba(0,0,0,.18) !important;
}

.dashboard-page .profile-name,
.dashboard-page .profile-welcome {
  color: #f2fff7 !important;
}

.dashboard-page .profile-id,
.dashboard-page .profile-label,
.dashboard-page .profile-telegram-id {
  color: #9ab7a7 !important;
}

/* WALLET CARDS */
.dashboard-page .wallet-cards {
  gap: 10px !important;
}

.dashboard-page .wallet-card {
  background: linear-gradient(
    135deg,#0c3525 0%,#07271b 65%,#061e15 100%
  ) !important;
  background-image: linear-gradient(
    135deg,#0c3525,#07271b 65%,#061e15
  ) !important;
  border: 1px solid var(--zar-line) !important;
  border-radius: 17px !important;
  box-shadow:
    0 9px 24px rgba(0,0,0,.2),
    inset 0 1px 0 rgba(255,255,255,.035) !important;
}

.dashboard-page .wallet-card::before,
.dashboard-page .wallet-card::after {
  box-shadow: none !important;
}

.dashboard-page .wallet-card-title,
.dashboard-page .wallet-card-note {
  color: #93b7a3 !important;
}

.dashboard-page .wallet-card-value {
  color: #f3fff7 !important;
  text-shadow: none !important;
  font-variant-numeric: tabular-nums;
}

.dashboard-page .wallet-card-invest .wallet-card-value {
  color: #35d991 !important;
}

.dashboard-page .wallet-card-icon {
  color: #53e5a2 !important;
  background: rgba(29,184,102,.12) !important;
  border-color: rgba(53,201,141,.16) !important;
}

/* DASHBOARD LINKS */
.dashboard-page .dashboard-link,
.dashboard-page .dashboard-link-box {
  background: linear-gradient(
    145deg,#0b3021,#07271b
  ) !important;
  border: 1px solid var(--zar-line) !important;
  border-radius: 14px !important;
  box-shadow: none !important;
}

.dashboard-page .dashboard-link-copy strong {
  color: #f0fff6 !important;
}

.dashboard-page .dashboard-link-copy small {
  color: #8da999 !important;
}

.dashboard-page .dashboard-link-icon,
.dashboard-page .dashboard-link-arrow-box {
  background: rgba(29,184,102,.12) !important;
  color: #35c98d !important;
  border-color: rgba(53,201,141,.12) !important;
}

.dashboard-page .dashboard-link-icon svg,
.dashboard-page .dashboard-link-arrow-box svg {
  color: #35c98d !important;
  stroke: currentColor;
}

/* LIVE CLOCK */
.dashboard-page .dashboard-live-clock {
  background: #08291c !important;
  border: 1px solid var(--zar-line) !important;
  border-radius: 13px !important;
  box-shadow: none !important;
}

.dashboard-page .dashboard-live-clock-label,
.dashboard-page .dashboard-live-expiry-label {
  color: #8eac9b !important;
}

.dashboard-page .dashboard-live-clock-value,
.dashboard-page .dashboard-live-expiry-value {
  color: #35c98d !important;
}

/* HOME ACTION CARDS */
.dashboard-page .home-wheel-card {
  background: #092d1e !important;
  border: 1px solid var(--zar-line) !important;
  border-radius: 16px !important;
  box-shadow: none !important;
}

/* BOTTOM NAVIGATION */
body:has(.dashboard-page) .bottom-nav {
  background: rgba(3,23,14,.97) !important;
  border-top: 1px solid rgba(53,201,141,.14) !important;
  box-shadow: 0 -8px 28px rgba(0,0,0,.18) !important;
  backdrop-filter: blur(16px);
}

body:has(.dashboard-page) .bottom-nav-inner {
  background: transparent !important;
  border-color: transparent !important;
}

body:has(.dashboard-page) .bottom-nav .nav-item {
  background: transparent !important;
  box-shadow: none !important;
}

body:has(.dashboard-page) .bottom-nav .nav-icon,
body:has(.dashboard-page) .bottom-nav .nav-label {
  color: #829b8e !important;
}

body:has(.dashboard-page) .bottom-nav .nav-item.active .nav-icon,
body:has(.dashboard-page) .bottom-nav .nav-item.active .nav-label {
  color: #3be399 !important;
}

body:has(.dashboard-page) .bottom-nav .vip-nav-btn {
  background: linear-gradient(
    145deg,#1db866,#0c7547
  ) !important;
  border: 1px solid #4de2a0 !important;
  box-shadow: 0 5px 18px rgba(29,184,102,.25) !important;
}

body:has(.dashboard-page) .bottom-nav .vip-text,
body:has(.dashboard-page) .bottom-nav .vip-crown {
  color: #ffffff !important;
}

/* GENERAL FINISH */
.dashboard-page button,
body:has(.dashboard-page) .bottom-nav button {
  -webkit-tap-highlight-color: transparent;
}

@media (max-width: 390px) {
  .dashboard-page .wallet-cards {
    gap: 8px !important;
  }

  .dashboard-page .wallet-card {
    border-radius: 15px !important;
  }
}