/* =========== Base theme =========== */
:root{
  --brand:#0ea5e9;
  --brand2:#0b72d1;
  --accent:#22c55e;
  --ink:#0f172a;
  --muted:#64748b;
  --bg:#f6f7fb;
}
*{ font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; }
html,body{ height:100%; }
body{ background:var(--bg); color:var(--ink); }
a{ text-decoration:none; }

/* Buttons */
.btn-primary{
  background:linear-gradient(135deg,var(--brand),var(--brand2));
  border:0; box-shadow:0 6px 18px rgba(14,165,233,.35);
}
.btn-primary:hover{ filter:brightness(.95); box-shadow:0 8px 22px rgba(14,165,233,.45); }
.btn-outline-light:hover{ background:#fff; color:#0f172a; }

/* Cards & tables */
.card{ border-radius:16px; box-shadow:0 4px 16px rgba(2,8,23,.06); }
.card-soft{
  border:1px solid #e5e7eb; border-radius:18px; background:#fff;
  box-shadow:0 6px 24px rgba(2,8,23,.06);
}
.card-soft:hover{ box-shadow:0 10px 34px rgba(2,8,23,.10); transition:.25s ease; }
.table thead th{ background:#f1f5f9; }

/* Headings */
.page-title{ font-weight:800; letter-spacing:.2px; }

/* ===== Hero (landing) ===== */
.hero-block{
  background:
    radial-gradient(1200px 420px at -10% -30%, #22d3ee 0%, rgba(34,211,238,.15) 20%, transparent 55%),
    linear-gradient(135deg, #0ea5e9 0%, #0b72d1 55%, #0b3ea3 100%);
  color:#fff; border-radius:20px; box-shadow:0 10px 30px rgba(2,6,23,.25);
}
.hero-block, .hero-block *{ color:#f9fafb; } /* <-- text always readable on dark hero */
.hero-title{ font-weight:800; line-height:1.15; letter-spacing:.2px; }
.hero-title span{ text-decoration:underline; text-decoration-color:rgba(255,255,255,.45); }
.hero-sub{ opacity:.9; margin:0; }
.hero-logo{ height:42px; width:42px; border-radius:10px; object-fit:cover; box-shadow:0 4px 14px rgba(0,0,0,.25); }

/* Stat chips (used on landing) */
.chip{
  display:flex; gap:.75rem; align-items:center; padding:.65rem .8rem;
  border-radius:14px; background:rgba(255,255,255,.12); backdrop-filter: blur(6px);
  border:1px solid rgba(255,255,255,.2);
}
.chip i{ font-size:1.15rem; line-height:1; }
.chip .k{ font-size:.72rem; opacity:.85; margin-bottom:-2px; }
.chip .v{ font-weight:700; font-size:1.05rem; }

/* ===== Dashboard Stat tiles (colored) ===== */
.stat{
  display:block; color:#fff; text-decoration:none; border-radius:22px; padding:18px;
  position:relative; overflow:hidden; box-shadow:0 14px 32px rgba(2,8,23,.18)
}
.stat .i{
  width:44px; height:44px; border-radius:12px; display:grid; place-items:center;
  background:rgba(255,255,255,.18); margin-bottom:10px;
}
.stat .k{ font-size:.92rem; opacity:.95; }
.stat .v{ font-size:2rem; font-weight:800; line-height:1; }
.g1{ background:linear-gradient(135deg,#22c55e,#16a34a); }
.g2{ background:linear-gradient(135deg,#0ea5e9,#2563eb); }
.g3{ background:linear-gradient(135deg,#f59e0b,#d97706); }
.g4{ background:linear-gradient(135deg,#8b5cf6,#6366f1); }

/* Quick actions */
.quick .act{
  display:flex; align-items:center; gap:10px; padding:14px 12px;
  border:1px solid #e5e7eb; border-radius:14px; background:#fff;
  text-decoration:none; color:#0f172a;
}
.quick .act:hover{
  border-color:#0ea5e9; box-shadow:0 8px 24px rgba(14,165,233,.18);
  transform:translateY(-2px); transition:.2s;
}
.quick .bi{ font-size:20px; color:#0ea5e9; }

/* Notice Board list (inside .card-soft) */
.card-soft .list-group-item{
  background:transparent; border:0; border-bottom:1px dashed rgba(148,163,184,.25);
}
.card-soft .list-group-item:last-child{ border-bottom:0; }

/* Tiny chart container */
.chart-card{ padding:18px; height:100%; }
.chart-card h6{ margin-bottom:12px; font-weight:700; }

/* ==== Forms / Modals ==== */
.modal-content{ border-radius:18px; }
.modal-header{ border-bottom:none; }
.modal-footer{ border-top:none; }
.form-label{ font-weight:600; color:#0f172a; }
.form-control, .form-select{ border-radius:12px; }
.form-control:focus, .form-select:focus{
  box-shadow:0 0 0 .2rem rgba(14,165,233,.15);
  border-color:#0ea5e9;
}
/* Preview card border in add-employee form */
#empForm .border{ border-color:#e5e7eb !important; }

/* Print-friendly certificate */
.cert-paper{ background:#fff; padding:40px; border:1px solid #e5e7eb; border-radius:12px; width:210mm; min-height:297mm; margin:auto; }
@media print{ nav, footer, .no-print{ display:none!important; } body{ background:#fff; } .cert-paper{ border:0; box-shadow:none; } }
.logo-sm{ height:40px; }

/* ====== Dark mode (auto) ====== */
@media (prefers-color-scheme: dark){
  body{ background:#0b1220; color:#e5e7eb; }
  .card, .card-soft, .quick .act{ background:#0f172a; border-color:#1f2a44; color:#e5e7eb; }
  .table thead th{ background:#0b1324; color:#cbd5e1; }
  .quick .bi{ color:#7dd3fc; }
  .card-soft .list-group-item{ border-bottom:1px dashed rgba(148,163,184,.28); }
}

/* ====== Responsive tweaks ====== */
@media (max-width: 991.98px){
  .hero-title{ font-size:1.65rem; }
}
@media (max-width: 575.98px){
  .hero-title{ font-size:1.35rem; }
  .hero-sub{ font-size:.95rem; }
}
/* RIGHT RAIL — LIGHT VARIANT */
section.container .col-lg-4 .card-soft{
  background:#ffffff !important;
  color:#0f172a !important;
  border-color:#e5e7eb !important;
}
section.container .col-lg-4 .card-soft .text-muted,
section.container .col-lg-4 .card-soft .small{ color:#475569 !important; }
section.container .col-lg-4 .card-soft .list-group-item{
  border-bottom:1px dashed rgba(15,23,42,.12) !important;
}