
/* V13 — Full Gradient UI */
:root{
  --g1:#16a34a;
  --g2:#06b6d4;
  --g3:#2563eb;
  --g4:#7c3aed;
  --gradient:linear-gradient(135deg,#16a34a 0%,#06b6d4 45%,#2563eb 100%);
  --gradient2:linear-gradient(135deg,#22c55e 0%,#14b8a6 45%,#3b82f6 100%);
  --bg:#f4f8fb;
  --card:#ffffff;
  --text:#172033;
  --muted:#6b7b91;
  --line:#dce6ef;
}
body{
  background:
    radial-gradient(circle at 10% 0%,rgba(34,197,94,.10),transparent 28%),
    radial-gradient(circle at 90% 5%,rgba(37,99,235,.10),transparent 30%),
    var(--bg)!important;
  color:var(--text)!important;
}
/* Header */
header,.header{
  background:var(--gradient)!important;
  border:0!important;
  color:#fff!important;
  box-shadow:0 8px 25px rgba(20,120,100,.20)!important;
}
header *,.header *{color:#fff!important}
header h1,.header h1,.brand,.logo{
  font-weight:900!important;
  letter-spacing:-.6px;
  text-shadow:0 2px 10px rgba(0,0,0,.15);
}
header small,.header small,header .subtitle,.header .subtitle{
  opacity:.92;
}
/* Header controls */
header button,.header button,header select,.header select{
  background:rgba(255,255,255,.16)!important;
  color:#fff!important;
  border:1px solid rgba(255,255,255,.38)!important;
  box-shadow:none!important;
  backdrop-filter:blur(8px);
}
header button:hover,.header button:hover{
  background:rgba(255,255,255,.27)!important;
}
/* Sidebar */
nav,.sidebar{
  background:#fff!important;
  border-right:1px solid var(--line)!important;
  box-shadow:8px 0 25px rgba(20,60,90,.05)!important;
}
nav a,.sidebar a{
  color:#506176!important;
  border:1px solid transparent!important;
}
nav a:hover,.sidebar a:hover{
  background:linear-gradient(135deg,rgba(34,197,94,.10),rgba(37,99,235,.08))!important;
  color:#138a58!important;
}
nav a.active,.sidebar a.active,.active{
  background:var(--gradient)!important;
  color:#fff!important;
  border-color:transparent!important;
  box-shadow:0 8px 18px rgba(22,163,74,.20)!important;
}
/* Page heading */
h1,h2,h3{
  color:#152238!important;
}
/* Total earnings */
.total-earnings,.total-card{
  background:var(--gradient)!important;
  color:#fff!important;
  border:0!important;
  border-radius:20px!important;
  box-shadow:0 14px 30px rgba(22,130,100,.20)!important;
}
.total-earnings *,.total-card *{color:#fff!important}
.total-earnings .value,.total-card .value{
  font-size:34px!important;
  font-weight:900!important;
  text-shadow:0 2px 8px rgba(0,0,0,.12);
}
/* Home monitor cards */
.monitor-card,.stat-card,.metric-card,.earnings-card{
  background:#fff!important;
  border:1px solid #dce8e8!important;
  border-radius:20px!important;
  box-shadow:0 10px 25px rgba(25,70,80,.08)!important;
  position:relative;
  overflow:hidden;
}
.monitor-card:before,.stat-card:before,.metric-card:before{
  width:6px!important;
  background:var(--gradient2)!important;
}
.monitor-card:hover,.stat-card:hover,.metric-card:hover,.earnings-card:hover{
  transform:translateY(-4px);
  border-color:#9edfc5!important;
  box-shadow:0 18px 35px rgba(25,110,90,.13)!important;
}
.monitor-card .value,.stat-card .value,.metric-card .value{
  color:#172033!important;
  font-weight:900!important;
}
.monitor-card .label,.stat-card .label,.metric-card .label{
  color:#527083!important;
}
.monitor-card .trend,.stat-card .trend,.metric-card .trend{
  color:#0b9f6e!important;
  font-weight:800!important;
}
/* Analytics/chart panel */
.panel,.analytics-panel,.chart-card,.section-card{
  background:#fff!important;
  border:1px solid #dce6ef!important;
  border-radius:22px!important;
  box-shadow:0 12px 30px rgba(30,70,100,.08)!important;
  overflow:hidden;
}
.panel h2,.analytics-panel h2,.chart-card h2{
  background:linear-gradient(90deg,rgba(22,163,74,.10),rgba(6,182,212,.06),transparent);
  border-bottom:1px solid #e4edf2;
}
/* Buttons */
button,.btn{
  background:#fff!important;
  color:#245064!important;
  border:1px solid #cfe0e4!important;
  border-radius:12px!important;
  box-shadow:0 5px 13px rgba(30,70,80,.07)!important;
}
button:hover,.btn:hover{
  border-color:#7bd6b2!important;
  color:#087b59!important;
}
.primary,.btn-primary{
  background:var(--gradient)!important;
  color:#fff!important;
  border:0!important;
}
/* Footer */
footer,.footer{
  background:var(--gradient)!important;
  color:#fff!important;
  border:0!important;
  box-shadow:0 -8px 25px rgba(20,120,100,.15)!important;
}
footer *,.footer *{color:#fff!important}
footer a,.footer a{
  color:#fff!important;
  text-decoration:none;
  font-weight:700;
}
/* Table */
table{
  background:#fff!important;
  border:1px solid #dce6ef!important;
  border-radius:16px!important;
}
th{
  background:linear-gradient(135deg,#ecfdf5,#effcff)!important;
  color:#28705c!important;
}
td{border-color:#e5edf0!important}
/* Responsive */
@media(max-width:700px){
  header,.header{min-height:68px!important}
  .total-earnings,.total-card{border-radius:18px!important}
  .monitor-card,.stat-card,.metric-card,.earnings-card{border-radius:18px!important}
}


/* =========================================================
   FINAL GREEN / CYAN / BLUE GRADIENT OVERRIDES
   Exact selectors for the current dashboard build
========================================================= */
.topbar{
  background:linear-gradient(90deg,#078b50 0%,#0bb878 35%,#08aeea 70%,#2468f2 100%)!important;
  border-bottom:2px solid rgba(255,255,255,.35)!important;
  box-shadow:0 6px 25px rgba(7,139,80,.22),inset 0 -1px 0 rgba(255,255,255,.25)!important;
}
.topbar .top-title{
  font-size:21px!important;
  font-weight:900!important;
  background:linear-gradient(90deg,#fff,#d9fff0,#fff,#d9f5ff)!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  -webkit-text-fill-color:transparent!important;
}
.topbar .credit-small{color:#eafff7!important;font-weight:600!important}
.topbar .credit-small strong{color:#fff!important;font-weight:900!important}
.topbar .icon-btn,
.topbar .top-actions select{
  background:rgba(255,255,255,.15)!important;
  border:1px solid rgba(255,255,255,.42)!important;
  color:#fff!important;
  box-shadow:0 4px 12px rgba(0,0,0,.10)!important;
}
.topbar .refresh-btn{
  background:linear-gradient(135deg,#08a957,#10cf83)!important;
  color:#fff!important;
  border:1px solid rgba(255,255,255,.38)!important;
  box-shadow:0 5px 18px rgba(0,170,90,.35)!important;
}
.topbar .icon-btn:hover,
.topbar .refresh-btn:hover{
  background:rgba(255,255,255,.27)!important;
}
.content{
  background:radial-gradient(700px 360px at 100% 0%,rgba(8,174,234,.10),transparent 65%),radial-gradient(600px 320px at 0% 20%,rgba(8,169,87,.08),transparent 65%),linear-gradient(135deg,#f4fff9 0%,#eef9f5 48%,#eef5ff 100%)!important;
}
.page-head h1{
  background:linear-gradient(90deg,#087c4b,#08aa70,#079fd5,#2468f2)!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  -webkit-text-fill-color:transparent!important;
  font-weight:900!important;
}
.total-earnings-mini{
  border-left:4px solid transparent!important;
  border-image:linear-gradient(180deg,#08a957,#08aeea,#2468f2) 1!important;
  background:linear-gradient(135deg,#fff,#f6fffb,#f2f8ff)!important;
}
.total-earnings-mini strong{
  background:linear-gradient(90deg,#079447,#0acb7c,#08aeea,#2468f2)!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  -webkit-text-fill-color:transparent!important;
  font-weight:900!important;
}
.monitor-card{
  background:linear-gradient(135deg,rgba(255,255,255,.98),rgba(246,255,251,.96),rgba(242,248,255,.98))!important;
  border-color:rgba(8,174,234,.18)!important;
}
.monitor-card:before{
  background:linear-gradient(180deg,#08a957,#0acb8a,#08aeea,#2468f2)!important;
}
.panel,.chart-panel,.mini-card{
  background:linear-gradient(135deg,#fff,#f5fff9,#f2f8ff)!important;
  border-color:rgba(8,174,234,.18)!important;
}
.sidebar{
  background:linear-gradient(180deg,#f8fffc,#effaf6,#eef6ff)!important;
}
.nav-item.active{
  background:linear-gradient(90deg,#08a957,#0acb83,#08aeea)!important;
  border-color:transparent!important;
  box-shadow:0 7px 18px rgba(8,174,100,.25)!important;
}
footer{
  background:linear-gradient(90deg,#078b50 0%,#0bb878 35%,#08aeea 70%,#2468f2 100%)!important;
  color:#fff!important;
  border:0!important;
  box-shadow:0 -6px 22px rgba(8,150,100,.18)!important;
}
footer *{color:#fff!important}
