:root {
  --font-body: "Roboto", "Noto Sans", "Segoe UI", sans-serif;
  --font-heading: "Roboto", "Noto Sans", "Segoe UI", sans-serif;
  --bg-body: linear-gradient(180deg, #f6f8fc 0%, #eef2f9 100%);
  --text-main: #1d1b20;
  --text-muted: #625b71;
  --heading-color: #1d1b20;
  --link-color: #0b57d0;
  --link-hover-color: #0043b5;
  --surface: #ffffff;
  --surface-alt: #eef2fa;
  --surface-border: #d8deea;
  --shadow-soft: 0 1px 2px rgba(60, 64, 67, 0.24), 0 2px 6px rgba(60, 64, 67, 0.12);
  --primary: #0b57d0;
  --primary-strong: #0043b5;
  --primary-contrast: #ffffff;
  --success: #0d7a38;
  --danger: #b3261e;
  --info: #00639b;
  --warning: #9a6700;
  --navbar-bg: linear-gradient(90deg, #0b57d0, #1a73e8 55%, #4285f4 100%);
  --navbar-link: rgba(255, 255, 255, 0.92);
  --navbar-link-active: #ffffff;
}

h1, h2, h3, h4, h5, h6 {
  letter-spacing: 0;
}

.btn {
  border-radius: 10px;
  font-weight: 500;
  letter-spacing: 0.01em;
  text-transform: none;
}

.btn-primary,
.btn-outline-primary:hover {
  box-shadow: 0 1px 3px rgba(11, 87, 208, 0.35);
}

.btn-primary:hover,
.btn-outline-primary:hover {
  box-shadow: 0 3px 8px rgba(11, 87, 208, 0.35);
}

.card,
.table,
.dashboard-kpi,
.chart-box,
.chart-container {
  border-radius: 8px;
}

.table thead th {
  font-size: 0.75rem;
  font-weight: 500;
}

.dashboard-kpi-title {
  letter-spacing: 0.06em;
}

.navbar .nav-link {
  border-radius: 999px;
  padding-left: 0.8rem;
  padding-right: 0.8rem;
}

.navbar .nav-link.active,
.navbar .nav-link:hover {
  background: rgba(255, 255, 255, 0.18);
}