/* assets/css/style.css */

/* Pastel blues — define once */
:root{
  --blue-50:#f0f6ff;
  --blue-100:#e3efff;
  --blue-200:#cfe3ff;
  --blue-300:#b7d5ff;
  --blue-400:#8ebcff;
  --blue-500:#6ea7ff;
  --blue-600:#4e91f0;
  --blue-700:#3c79cc;
  --blue-800:#2f60a6;
  --blue-900:#244c85;
}

/* assets/css/style.css — no CSS variables */

/* ===== Theme: navy + pastel blue, weighty containers, textured background ===== */

/* Base + page background */
.theme-blue{
  background:#eaf1ff; /* fallback behind the gradient wrapper */
  color:#0b234b;
  font-family: system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial;
}

/* Subtle patterned/gradient background for the page area */
.page-bg{
  /* layered gradients for depth */
  background:
    radial-gradient(1200px 600px at 80% -100px, rgba(23,52,94,0.18), transparent 60%),
    radial-gradient(900px 400px at -10% 0%, rgba(110,167,255,0.22), transparent 55%),
    linear-gradient(180deg, #eef4ff 0%, #f6f9ff 100%);
}

/* Gradient Navbar (with navy) */
.nav-gradient{
  background: linear-gradient(135deg, #6ea7ff 0%, #3c79cc 45%, #17345e 100%);
}
.navbar .navbar-brand{ color:#ffffff; font-weight:800; letter-spacing:.2px; }
.navbar .navbar-brand:hover{ color:#fff; }
.navbar .btn-light{ background:#e8f0ff; border: none; }
.navbar .btn-light:hover{ background:#dbe8ff; }

/* Hero */
.hero{
  background: linear-gradient(180deg, rgba(110,167,255,.18), rgba(240,246,255,.92));
  border: 1px solid #c7ddff;
  border-radius: 1rem;
  padding: 1.25rem;
  box-shadow: 0 18px 50px rgba(17,44,92,.18);
}

/* Cards — heavier weight + shadow */
.card{
  border: 1px solid #cfe0ff;
  border-radius: 1rem;
  background: #ffffff;
  box-shadow:
    0 22px 70px rgba(17,44,92,.20),
    0 8px 18px rgba(17,44,92,.12);
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.card:hover{
  transform: translateY(-3px);
  box-shadow:
    0 28px 90px rgba(17,44,92,.26),
    0 12px 24px rgba(17,44,92,.16);
  border-color:#b9d0ff;
}

/* KPI chips */
.kpi{ display:flex; align-items:center; gap:.75rem; }
.kpi .icon{
  width:44px; height:44px; border-radius:12px;
  display:grid; place-items:center;
  background:#e3efff; color:#17345e;
  box-shadow: inset 0 0 0 1px #cfe0ff;
}
.kpi .value{ font-size:1.35rem; font-weight:800; color:#132a52; }
.kpi .label{ font-size:.85rem; color:#41609e; }

/* Tabs (pills) */
.nav-pills .nav-link{
  color:#17345e;
  border: 1px solid #cfe0ff;
  background:#f3f7ff;
  margin-right:.5rem;
}
.nav-pills .nav-link:hover{ background:#eaf2ff; }
.nav-pills .nav-link.active{
  color:#0b234b;
  background:#6ea7ff;
  border-color:#6ea7ff;
  box-shadow: 0 6px 18px rgba(110,167,255,.45);
}

/* Tables */
.table thead th{
  color:#0b234b;
  border-bottom: 2px solid #cfe0ff;
}
.table-hover tbody tr:hover{ background:#f4f8ff; }

/* Buttons */
.btn-primary{ background:#3c79cc; border-color:#3c79cc; }
.btn-primary:hover{ background:#2f60a6; border-color:#2f60a6; }
.btn-outline-primary{ color:#2f60a6; border-color:#8ebcff; }
.btn-outline-primary:hover{ background:#8ebcff; border-color:#8ebcff; color:#0b234b; }
.btn-navy{ background:#17345e; border-color:#17345e; color:#fff; }
.btn-navy:hover{ background:#102746; border-color:#102746; color:#fff; }

/* Badges */
.badge.bg-status{ background:#8ebcff; color:#0b234b; }

/* Soft separator */
.hr-soft{
  border:0; height:1px;
  background: linear-gradient(90deg, rgba(143,188,255,0), rgba(143,188,255,.8), rgba(143,188,255,0));
  margin: .75rem 0 1rem;
}

/* NEW — heavier shadow without !important; higher specificity than .card */
.card.shadow-fat{
  box-shadow:
    0 28px 100px rgba(17,44,92,.28),
    0 12px 28px rgba(17,44,92,.14);
}



/* Make tables + cards breathe on small screens */
@media (max-width: 576px){
  .card{ border-radius: .8rem; }
  .hero{ border-radius: .9rem; }
}