:root {
  --brand-navy: #0d2b4e;
  --brand-navy-dark: #081d36;
  --brand-gold: #c8952c;
  --brand-bg: #f4f6f9;
}

body {
  background-color: var(--brand-bg);
  font-family: 'Segoe UI', Roboto, Arial, sans-serif;
}

.app-navbar {
  background-color: var(--brand-navy);
}
.app-navbar .navbar-brand { color: #fff; }
.app-navbar .nav-link { color: rgba(255,255,255,0.8); }
.app-navbar .nav-link.active,
.app-navbar .nav-link:hover { color: var(--brand-gold); }

.card-stat {
  border: none;
  border-radius: 12px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.06);
  color: #fff;
}
.card-stat .stat-value { font-size: 1.8rem; font-weight: 700; }
.card-stat .stat-label { font-size: 0.85rem; opacity: 0.9; }

.bg-navy { background: linear-gradient(135deg, var(--brand-navy), var(--brand-navy-dark)); }
.bg-gold { background: linear-gradient(135deg, #dba43a, var(--brand-gold)); }
.bg-teal { background: linear-gradient(135deg, #1f8a70, #146354); }
.bg-plum { background: linear-gradient(135deg, #7b3f61, #582c47); }

.card-panel {
  border: none;
  border-radius: 12px;
  box-shadow: 0 2px 10px rgba(0,0,0,0.06);
  background: #fff;
}

.panel-header {
  background-color: var(--brand-navy);
  color: #fff;
  border-radius: 12px 12px 0 0;
  padding: 0.9rem 1.25rem;
  font-weight: 600;
}

.btn-brand {
  background-color: var(--brand-navy);
  border-color: var(--brand-navy);
  color: #fff;
}
.btn-brand:hover { background-color: var(--brand-navy-dark); color: #fff; }

table.fee-table th, table.fee-table td {
  vertical-align: middle;
}

.login-wrapper {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, var(--brand-navy), var(--brand-navy-dark));
}
.login-card {
  width: 100%;
  max-width: 400px;
  border-radius: 14px;
  border: none;
  box-shadow: 0 10px 40px rgba(0,0,0,0.3);
}

@media print {
  .app-navbar, footer, .no-print { display: none !important; }
}