:root {
  --brand: #0d6e6e;
  --brand-dark: #0a5757;
}

body {
  background: #f4f6f8;
  font-family: "Segoe UI", "Tahoma", system-ui, sans-serif;
}

.app-nav {
  background: linear-gradient(90deg, var(--brand-dark), var(--brand));
}
.app-nav .navbar-brand {
  display: flex;
  align-items: center;
  gap: .55rem;
  font-size: 1.15rem;
}
.brand-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: #ffd34d;
  display: inline-block;
}

.search-card {
  border: none;
  border-radius: 14px;
}
.search-card .form-label {
  font-weight: 600;
  font-size: .85rem;
  color: #555;
}

.btn-primary {
  background: var(--brand);
  border-color: var(--brand);
}
.btn-primary:hover {
  background: var(--brand-dark);
  border-color: var(--brand-dark);
}
.btn-outline-primary {
  color: var(--brand);
  border-color: var(--brand);
}
.btn-outline-primary:hover {
  background: var(--brand);
  border-color: var(--brand);
}

.results-table thead th {
  background: #eef2f3;
  font-size: .85rem;
  white-space: nowrap;
}
.ltr-num {
  direction: ltr;
  unicode-bidi: embed;
  font-variant-numeric: tabular-nums;
}

.person-card .card-header {
  background: linear-gradient(90deg, var(--brand-dark), var(--brand));
  color: #fff;
}
.person-card .card-header .text-muted {
  color: rgba(255, 255, 255, .8) !important;
}
.detail-list dt {
  color: #667;
  font-weight: 600;
  padding: .5rem 0;
}
.detail-list dd {
  padding: .5rem 0;
  border-bottom: 1px solid #eef0f2;
}

#results.searching {
  opacity: .55;
  transition: opacity .15s ease-in-out;
  pointer-events: none;
}

.page-link {
  color: var(--brand);
}
.page-item.active .page-link {
  background: var(--brand);
  border-color: var(--brand);
}