
:root{
  --sky:#2da7ff;
  --sky2:#7fd3ff;
  --ink:#0f172a;
  --muted:#64748b;
}

/* Arabic-friendly font */
body{
  font-family: "Cairo", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
  color: var(--ink);
}
h1,h2,h3,h4,h5,h6{ letter-spacing: .2px; }

.bg-soft{background: #f6fbff;}
.app-bg{
  position:fixed; inset:0;
  background:
    radial-gradient(1200px 600px at 80% -10%, rgba(45,167,255,.20), transparent 60%),
    radial-gradient(900px 500px at 10% 0%, rgba(127,211,255,.22), transparent 55%),
    radial-gradient(800px 500px at 50% 120%, rgba(45,167,255,.10), transparent 60%);
  pointer-events:none;
  z-index:-1;
}

.glass{
  background: rgba(255,255,255,.75) !important;
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(15,23,42,.06);
}

.text-sky{color: var(--sky) !important;}

.btn-sky{
  background: linear-gradient(135deg,var(--sky),var(--sky2));
  color:#fff;
  border: none;
}
.btn-sky:hover{ filter: brightness(.97); color:#fff; }

.card{
  border: 1px solid rgba(15,23,42,.06);
  border-radius: 18px;
}
.card.soft-shadow{ box-shadow: 0 14px 40px rgba(2, 132, 199, .08); }

.hover-lift{ transition: transform .12s ease, box-shadow .12s ease; }
.hover-lift:hover{ transform: translateY(-2px); box-shadow: 0 18px 50px rgba(2, 132, 199, .14); }

.form-control, .form-select{
  border-radius: 14px;
  border-color: rgba(15,23,42,.10);
}
.form-control:focus, .form-select:focus{
  border-color: rgba(45,167,255,.55);
  box-shadow: 0 0 0 .25rem rgba(45,167,255,.15);
}

.badge-soft{
  background: rgba(45,167,255,.12);
  color: #0369a1;
  border: 1px solid rgba(45,167,255,.18);
}

.kpi{
  display:flex; gap:14px; align-items:center;
}
.kpi .icon{
  width:46px; height:46px; border-radius:14px;
  display:grid; place-items:center;
  background: rgba(45,167,255,.12);
  border: 1px solid rgba(45,167,255,.18);
  color:#0369a1;
}
.kpi .v{ font-weight:800; font-size:1.35rem; color:var(--ink); }
.kpi .l{ color:var(--muted); font-size:.92rem; }
