/* Colorful gradient theme for AdminLTE (procedural) */
:root{
  --grad-a:#ff6cab;
  --grad-b:#7366ff;
  --grad-c:#00c6ff;
  --grad-d:#00f5a0;
  --grad-e:#f9d423;
  --grad-f:#ff4e50;
}

.theme-gradient-bg{
  background: linear-gradient(135deg, rgba(255,108,171,.18), rgba(115,102,255,.18), rgba(0,198,255,.16));
  min-height:100vh;
}

.navbar-gradient{
  background: linear-gradient(90deg, rgba(255,108,171,.20), rgba(115,102,255,.18), rgba(0,198,255,.18));
  backdrop-filter: blur(6px);
}

.sidebar-gradient{
  background: linear-gradient(180deg, rgba(26,33,54,1), rgba(33,25,66,1), rgba(18,45,60,1));
}

.content-gradient{
  background: linear-gradient(135deg, rgba(255,255,255,.65), rgba(255,255,255,.45));
}

.footer-gradient{
  background: linear-gradient(90deg, rgba(33,25,66,1), rgba(18,45,60,1));
}

.card-grad{
  background: linear-gradient(135deg, rgba(255,255,255,.92), rgba(255,255,255,.80));
  border-radius: 18px;
}

.text-shadow{ text-shadow: 0 8px 22px rgba(0,0,0,.18); }
.text-shadow-sm{ text-shadow: 0 4px 14px rgba(0,0,0,.10); }

.user-avatar-grad{
  width:36px;height:36px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  color:#fff;
  background: linear-gradient(135deg, var(--grad-a), var(--grad-b));
  box-shadow: 0 8px 20px rgba(0,0,0,.25);
}

.icon-pill{
  width:34px;
  text-align:center;
  border-radius: 12px;
  padding: 6px 0;
  color:#fff !important;
  margin-right: 10px;
  box-shadow: 0 10px 22px rgba(0,0,0,.18);
}

/* ===== GRADIENT COLOR SET ===== */
.grad-cyan     { background: linear-gradient(135deg,#00c6ff,#0072ff); }
.grad-emerald  { background: linear-gradient(135deg,#2ecc71,#27ae60); }
.grad-violet   { background: linear-gradient(135deg,#9b59b6,#6f42c1); }
.grad-fire     { background: linear-gradient(135deg,#ff512f,#dd2476); }
.grad-sunset   { background: linear-gradient(135deg,#f7971e,#ffd200); }
.grad-ocean    { background: linear-gradient(135deg,#2193b0,#6dd5ed); }
.grad-lime     { background: linear-gradient(135deg,#56ab2f,#a8e063); }
.grad-purple   { background: linear-gradient(135deg,#8e2de2,#4a00e0); }
.grad-amber    { background: linear-gradient(135deg,#f12711,#f5af19); }
.grad-sky      { background: linear-gradient(135deg,#36d1dc,#5b86e5); }
.grad-mint     { background: linear-gradient(135deg,#1d976c,#93f9b9); }

/* Make sidebar active item pop */
.nav-sidebar .nav-link.active{
  background: linear-gradient(90deg, rgba(255,108,171,.38), rgba(115,102,255,.30), rgba(0,198,255,.30)) !important;
  border-radius: 14px;
}

/* Buttons a bit more playful */
.btn-primary{
  background: linear-gradient(135deg, var(--grad-b), var(--grad-a));
  border: none;
}
.btn-primary:hover{ filter: brightness(1.02); }

/* Tables: softer */
.table td, .table th{ border-top: 1px solid rgba(0,0,0,.06); }


/* Backward-compat: old markup (btn/table/row) */
.row{ display:flex; gap:12px; flex-wrap:wrap; align-items:center; }
.btn{
  display:inline-block;
  padding: .45rem .85rem;
  border-radius: 12px;
  border: 1px solid rgba(0,0,0,.12);
  background: rgba(255,255,255,.92);
  color: #111827;
  box-shadow: 0 10px 22px rgba(0,0,0,.06);
}
.btn:hover{ text-decoration:none; filter: brightness(1.01); }
.btn-muted{ background: rgba(255,255,255,.80); }
.btn-danger{
  background: linear-gradient(135deg, var(--grad-f), #b31237);
  color:#fff;
  border:none;
}
.btn-danger:hover{ filter: brightness(1.02); }
table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  overflow:hidden;
  border-radius:16px;
  background: rgba(255,255,255,.86);
  box-shadow: 0 10px 22px rgba(0,0,0,.06);
}
th,td{ padding: .65rem .75rem; border-bottom: 1px solid rgba(0,0,0,.06); vertical-align: top; }
thead th{
  background: linear-gradient(90deg, rgba(115,102,255,.14), rgba(0,198,255,.12), rgba(255,108,171,.12));
}
tbody tr:hover td{ background: rgba(0,0,0,.02); }

.field{ margin-bottom: .9rem; }
.field label{ font-weight:600; color:#374151; }
.field input, .field select, .field textarea{
  width:100%;
  padding:.55rem .75rem;
  border-radius:14px;
  border:1px solid rgba(0,0,0,.14);
  background: rgba(255,255,255,.92);
  outline:none;
  box-shadow: 0 10px 22px rgba(0,0,0,.05);
}
.field input:focus, .field select:focus, .field textarea:focus{
  border-color: rgba(115,102,255,.55);
  box-shadow: 0 12px 26px rgba(115,102,255,.16);
}


/* Dashboard stat boxes */
.stat-box{ border-radius: 18px; overflow: hidden; }
.stat-box .inner h3{ font-weight: 900; letter-spacing: .5px; }
.stat-box .inner p{ font-weight: 700; opacity: .95; }
.stat-box .icon{ opacity: .35; }
.small-box-footer{ border-top: 1px solid rgba(255,255,255,.18)!important; }
.small-box .small-box-footer{ background: rgba(0,0,0,.10); }

.info-box-grad{
  border-radius: 18px;
  overflow: hidden;
  border: 0;
}
.info-box-grad .info-box-icon{
  border-radius: 18px 0 0 18px;
  width: 78px;
}
.info-box-grad .info-box-number{ font-size: 28px; font-weight: 900; }


/* Extra gradient */
.grad-sunset{background:linear-gradient(135deg,#ff512f,#dd2476)!important;color:#fff!important}


/* Info box gradient */
.info-box-gradient{ color:#fff; border:0; box-shadow:0 10px 20px rgba(0,0,0,.12); }
.info-box-gradient .info-box-text{ opacity:.9 }
.info-box-gradient .info-box-number{ font-weight:700 }