﻿:root{
  --bg:#f6f6f3; --card:#ffffff; --ink:#242a33; --muted:#8a9099;
  --line:#ececEC; --line2:#eef0ee;
  --brand:#0d9488; --brand-ink:#0f766e; --brand-tint:#e7f6f3;
  --amber:#f59e0b;
  --radius:20px;
  --shadow:0 1px 2px rgba(20,25,40,.03), 0 8px 26px rgba(20,25,40,.05);
}
body{
  background:var(--bg); color:var(--ink);
  font-family:ui-rounded,"Segoe UI",-apple-system,system-ui,Roboto,sans-serif;
  font-size:14px;
}

/* ---------- Top navbar ---------- */
.app-navbar{
  background:rgba(255,255,255,.92); backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
  position:sticky; top:0; z-index:1030; padding:.55rem 0;
}
.app-navbar .navbar-brand{ display:flex; align-items:center; gap:.6rem; font-weight:800; letter-spacing:-.3px; color:var(--ink); }
.app-navbar .brand-logo{
  width:40px; height:40px; border-radius:14px; flex:none;
  background:var(--brand); color:#fff; display:grid; place-items:center;
  box-shadow:0 10px 22px rgba(13,148,136,.32);
}
.app-navbar .navbar-nav .nav-link{
  color:#5a6069; font-weight:700; border-radius:999px;
  padding:.5rem .95rem; margin:.05rem .1rem; transition:.15s;
}
.app-navbar .navbar-nav .nav-link:hover{ background:#eef0ee; color:var(--ink); }
.app-navbar .navbar-nav .nav-link.active{ background:var(--brand); color:#fff; box-shadow:0 6px 14px rgba(13,148,136,.3); }

.nav-bell{ width:40px;height:40px;border-radius:50%;border:0;background:transparent;color:#7a828c; display:grid;place-items:center; }
.nav-bell:hover{ background:#eef0ee; color:var(--ink); }
.user-chip{ display:flex; align-items:center; gap:.55rem; text-decoration:none; }
.user-chip .avatar{ width:34px;height:34px;border-radius:50%;flex:none;background:var(--brand-tint);color:var(--brand-ink);font-weight:800;font-size:12px;display:grid;place-items:center; }
.user-chip .u-name{ font-weight:800; color:var(--ink); line-height:1.05; }
.user-chip .u-role{ font-size:11px; color:var(--muted); }

/* ---------- Content ---------- */
.app-main{ padding-top:1.6rem; padding-bottom:2.6rem; }
h1,h2,h3,h4{ letter-spacing:-.3px; }
h3{ font-weight:800; font-size:1.35rem; }

/* ---------- Cards ---------- */
.card{ border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow); }
.card .card-body{ padding:1.15rem 1.3rem; }
.card .card-header{ background:#fff; border-bottom:1px solid var(--line); font-weight:800; padding:1rem 1.3rem; }
.display-6{ font-weight:800; letter-spacing:-.5px; }

/* ---------- Buttons ---------- */
.btn{ border-radius:12px; font-weight:700; }
.btn-primary{ background:var(--brand); border-color:var(--brand); box-shadow:0 8px 18px rgba(13,148,136,.22); }
.btn-primary:hover,.btn-primary:focus{ background:var(--brand-ink); border-color:var(--brand-ink); }
.btn-outline-primary{ color:var(--brand-ink); border-color:#bfe6e0; }
.btn-outline-primary:hover{ background:var(--brand); border-color:var(--brand); color:#fff; }
.btn-outline-secondary{ color:#5a6069; border-color:var(--line); }
.btn-outline-secondary:hover{ background:#eef0ee; color:var(--ink); border-color:var(--line); }
.btn-success{ background:var(--brand); border-color:var(--brand); }
.btn-success:hover{ background:var(--brand-ink); border-color:var(--brand-ink); }
.btn-sm{ border-radius:10px; }

/* ---------- Tables ---------- */
.table{ --bs-table-bg:transparent; margin-bottom:0; }
.table>thead th{ color:var(--muted); text-transform:uppercase; font-size:.7rem; letter-spacing:.05em; font-weight:800; border-bottom:1px solid var(--line); padding:.8rem 1rem; }
.table>tbody td{ padding:.85rem 1rem; border-color:var(--line2); vertical-align:middle; }
.table tbody tr:hover>*{ background:#f7faf9; }

/* ---------- Progress ---------- */
.progress{ background:#edf0ee; border-radius:99px; }
.progress-bar{ background:var(--brand); border-radius:99px; }
.progress-bar.bg-success{ background:var(--brand)!important; }

/* ---------- Badges ---------- */
.badge{ font-weight:700; border-radius:999px; padding:.35em .7em; }
.badge.bg-success{ background:var(--brand-tint)!important; color:var(--brand-ink)!important; }
.badge.bg-secondary{ background:#eef0ee!important; color:#6b7280!important; }
.badge.bg-warning{ background:#fef3e7!important; color:#b45309!important; }
.badge.bg-light{ background:#f2f3f1!important; color:#8a9099!important; }

/* ---------- Forms ---------- */
.form-control,.form-select{ border-radius:12px; border-color:var(--line); padding:.5rem .8rem; }
.form-control:focus,.form-select:focus{ border-color:var(--brand); box-shadow:0 0 0 3px var(--brand-tint); }
.form-label{ font-weight:700; font-size:.82rem; color:#5a6069; }

/* ---------- Alerts ---------- */
.alert{ border-radius:14px; border:1px solid transparent; }
.alert-info{ background:#eaf5ff; color:#2f5aa8; border-color:#d8e8ff; }
.alert-success{ background:var(--brand-tint); color:var(--brand-ink); border-color:#c8ece5; }
.alert-warning{ background:#fef3e7; color:#92500c; border-color:#f8e2c4; }
.alert-danger{ background:#fdecec; color:#9b2226; border-color:#f7d3d3; }

/* ---------- Dashboard ---------- */
.greet-title{ font-size:1.55rem; font-weight:800; display:flex; align-items:center; gap:.5rem; }
.greet-sub{ color:var(--muted); margin-top:.15rem; }
.chip-term{ display:inline-flex; align-items:center; gap:.5rem; background:#fff; border:1px solid var(--line);
  border-radius:999px; padding:.5rem .9rem; font-weight:700; font-size:.85rem; }
.chip-term .d{ width:8px;height:8px;border-radius:50%;background:var(--brand); }

.kpi-card{ background:#fff; border:1px solid var(--line); border-radius:24px; padding:1.15rem 1.2rem; box-shadow:var(--shadow); }
.kpi-ic{ width:44px;height:44px;border-radius:16px;display:grid;place-items:center;margin-bottom:.7rem; }
.kpi-ic svg{ width:22px;height:22px; }
.kpi-ic.t1{ background:#e7f6f3;color:#0d9488; } .kpi-ic.t2{ background:#e8f2ff;color:#2563eb; }
.kpi-ic.t3{ background:#fef3e7;color:#d97706; } .kpi-ic.t4{ background:#fdeef0;color:#e11d63; }
.kpi-val{ font-size:1.7rem;font-weight:800;letter-spacing:-.5px;line-height:1; }
.kpi-lbl{ color:var(--muted);font-weight:700;margin-top:.25rem; }

.eval-item{ display:flex; gap:.7rem; }
.eval-ini{ width:38px;height:38px;border-radius:50%;flex:none;background:var(--brand-tint);color:var(--brand-ink);font-weight:800;font-size:12px;display:grid;place-items:center; }
.eval-cls{ background:#eef0ee;border-radius:999px;padding:.05rem .5rem;font-size:11px;font-weight:700;color:#6b7280; }