/* ============================================================
   888 ExpressCarWash — MIDNIGHT AMBER (qorong'u hi-tech tema)
   Umumiy, 6 ilovaga. <head> ichida inline <style> dan KEYIN ulanadi:
     <link rel="stylesheet" href="glass.css">
   Tungi ko'k fon + amber/oltin urg'u. Hamma rolga bir xil.
   ============================================================ */

:root{
  --mam-bg:     #0A0D16;
  --mam-surf:   #131829;
  --mam-surf2:  #1A2138;
  --mam-border: #28304A;
  --mam-text:   #EAEEF2;
  --mam-muted:  #93A0B8;
  --mam-accent: #F5A524;
  --mam-ink:    #3A2702;
  --muted: #93A0B8 !important;
}

/* --- 1. Qorong'u fon (tungi ko'k + amber/ko'k porlash) --- */
html, body{
  background:
    radial-gradient(circle at 14% 10%, rgba(245,165,36,.10) 0%, transparent 40%),
    radial-gradient(circle at 86% 6%,  rgba(37,99,235,.16) 0%, transparent 42%),
    radial-gradient(circle at 88% 90%, rgba(245,165,36,.08) 0%, transparent 44%),
    radial-gradient(circle at 6% 94%,  rgba(37,99,235,.12) 0%, transparent 42%),
    #0A0D16 !important;
  background-attachment: fixed !important;
  color: var(--mam-text) !important;
}

/* asosiy konteynerlar — shaffof + matn ochiq (descendantlar meros oladi) */
.phone, .wrap{ background: transparent !important; box-shadow:none !important; color: var(--mam-text) !important; }

/* umumiy matn ranglari (klassga ega bo'lmaganlar) */
body, .phone, .wrap, p, h1, h2, h3, h4, label, li, td, th{ color: var(--mam-text) !important; }

/* xira (muted) yozuvlar */
.muted, .r-sub, .ss, .wmeta, .hi-meta, .td, .sl, .kl, .gsub, .lsub, .lhint,
.section-label, .group-title, .stat-label, .auth-sub, .hint, small{ color: var(--mam-muted) !important; }

/* inline to'q matn ranglarini yoritamiz (ochiq fonga mo'ljallangan) */
[style*="#475569"], [style*="#334155"], [style*="#3a4252"], [style*="#2C4A6B"],
[style*="#0F1729"], [style*="#1e293b"], [style*="#1F2937"], [style*="#0f172a"],
[style*="#063"], [style*="#067"], [style*="#1F6FD6"]{ color: var(--mam-text) !important; }

/* --- 2. Neytral kartalar → qorong'u shisha --- */
.card, .panel, .row, .hcard, .add, .pkg, .extra, .stat, .kpi,
.map-prev, .photo-box, .cbrow, .shift, .link-card, .seg, .modal, .pop, .sheet{
  background: rgba(19,24,41,0.82) !important;
  -webkit-backdrop-filter: blur(14px) saturate(140%);
  backdrop-filter: blur(14px) saturate(140%);
  border: 1px solid var(--mam-border) !important;
  box-shadow: 0 8px 28px rgba(0,0,0,.45) !important;
  color: var(--mam-text) !important;
}

/* --- 3. Rangli statistik kartalar (qorong'uga moslab) --- */
.kpi.big{    background: linear-gradient(135deg,#0F6E56,#0B5440) !important; color:#fff !important; border:none !important; }
.kpi.profit{ background: linear-gradient(135deg,#13213F,#0B142A) !important; color:#fff !important; border:1px solid #28304A !important; }
.kpi.big, .kpi.profit{ -webkit-backdrop-filter:none; backdrop-filter:none; box-shadow:0 10px 30px rgba(0,0,0,.5) !important; }

/* --- 4. Inputlar → qorong'u --- */
.inp, .field input, select, select.inp, textarea, .linp{
  background: #0E1322 !important;
  border: 1px solid var(--mam-border) !important;
  color: var(--mam-text) !important;
}
.inp::placeholder, .field input::placeholder, textarea::placeholder, .linp::placeholder{ color:#5E6B85 !important; }
select option{ background:#131829; color:var(--mam-text); }

/* --- 5. Tugmalar: asosiy = amber, semantik ranglar saqlanadi --- */
.btn{ box-shadow: 0 6px 22px rgba(0,0,0,.4) !important; }
.btn-primary, .btn.primary, .btn-blue, .lbtn, .seg-on, .fab, .cta{
  background: var(--mam-accent) !important; color: var(--mam-ink) !important; border:none !important;
}
/* amber fon ustidagi matn to'q bo'lsin */
[style*="#F5A524"], .badge-amber{ }

/* --- 6. Pastki tabbar → zamonaviy "suzuvchi" pill --- */
.tabbar{
  background: rgba(22,28,46,0.82) !important;
  -webkit-backdrop-filter: blur(26px) saturate(180%);
  backdrop-filter: blur(26px) saturate(180%);
  left: 0 !important; right: 0 !important; width: auto !important;
  max-width: 360px; margin: 0 auto !important;
  bottom: 12px !important; border-radius: 24px !important;
  border: 1px solid rgba(245,165,36,0.55) !important;
  box-shadow: 0 14px 36px rgba(0,0,0,.55), 0 0 0 1px rgba(245,165,36,.10) !important;
  padding: 9px 6px calc(9px + env(safe-area-inset-bottom)) !important;
}
.tabbar .tab.active, .tabbar .active, .tab.on{ color: var(--mam-accent) !important; }
.tabbar .tab{ border-radius: 14px !important; }

/* --- 7. Yuqori header → tungi ko'k gradient + amber urg'u --- */
.topbar, .track-head{
  background: linear-gradient(135deg,#131829,#0B0F1C) !important;
  border-bottom: 1px solid var(--mam-border) !important;
  box-shadow: 0 12px 34px rgba(0,0,0,.45) !important;
  color: var(--mam-text) !important;
}

/* --- 8. Bo'limlar orasidagi ajratgich chiziqlar --- */
hr, .divider{ border-color: var(--mam-border) !important; }
