/* ============================================================
   nisphfa.css — Dark Blue Government Theme
   Base: Bootstrap 5 dark mode + blue accent
   ============================================================ */

/* ── CSS Variables ──────────────────────────────────────────── */
:root {
  --nisphfa-blue:        #1a6fdb;
  --nisphfa-blue-dark:   #1259b8;
  --nisphfa-blue-light:  #3d8ef0;
  --nisphfa-blue-glow:   rgba(26, 111, 219, 0.18);
  --nisphfa-surface:     #0f1923;
  --nisphfa-surface-2:   #141f2e;
  --nisphfa-surface-3:   #1a2840;
  --nisphfa-border:      rgba(26, 111, 219, 0.18);
  --nisphfa-border-soft: rgba(255,255,255,0.07);
  --nisphfa-text-muted:  #7a8fa8;
}

/* ── Global ─────────────────────────────────────────────────── */
[data-bs-theme="dark"] {
  --bs-body-bg:          #0d1520;
  --bs-body-color:       #c8d8e8;
  --bs-primary:          #1a6fdb;
  --bs-primary-rgb:      26, 111, 219;
  --bs-link-color:       #3d8ef0;
  --bs-border-color:     rgba(26,111,219,0.2);
  --bs-card-bg:          #111c2d;
  --bs-secondary-bg:     #141f2e;
  --bs-table-bg:         transparent;
  --bs-table-hover-bg:   rgba(26,111,219,0.07);
}

body {
  font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
  font-size: .9375rem;
  background-color: #0d1520;
}

/* ── Scrollbar ──────────────────────────────────────────────── */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: var(--nisphfa-surface); }
::-webkit-scrollbar-thumb { background: var(--nisphfa-blue-dark); border-radius: 3px; }

/* ── Top bar ────────────────────────────────────────────────── */
.nisphfa-topbar {
  background: var(--nisphfa-blue-dark);
  color: rgba(255,255,255,.85);
  font-size: .78rem;
}

/* ── Navbar ─────────────────────────────────────────────────── */
.nisphfa-navbar {
  background: #0a1322 !important;
  border-bottom: 1px solid var(--nisphfa-border);
  padding: .6rem 0;
}

.nisphfa-navbar .nav-link {
  color: #a0b8cc !important;
  font-size: .875rem;
  font-weight: 500;
  padding: .4rem .85rem !important;
  border-radius: 6px;
  transition: all .18s;
}
.nisphfa-navbar .nav-link:hover,
.nisphfa-navbar .nav-link.active {
  color: #ffffff !important;
  background: var(--nisphfa-blue-glow);
}

/* ── Logo icon ──────────────────────────────────────────────── */
.nisphfa-logo-icon {
  width: 36px; height: 36px;
  background: var(--nisphfa-blue);
  border-radius: 8px;
  display: flex; align-items: center; justify-content: center;
  color: #fff;
  font-size: 1rem;
  flex-shrink: 0;
}
.nisphfa-logo-icon--lg  { width: 48px; height: 48px; font-size: 1.4rem; border-radius: 10px; }
.nisphfa-logo-icon--xl  { width: 64px; height: 64px; font-size: 1.9rem; border-radius: 14px; }

.nisphfa-brand-sub {
  font-size: .65rem;
  color: var(--nisphfa-text-muted);
  letter-spacing: .04em;
}

/* ── Dropdown ───────────────────────────────────────────────── */
.nisphfa-dropdown {
  background: #0f1923;
  border: 1px solid var(--nisphfa-border);
  border-radius: 10px;
  padding: .4rem;
}
.nisphfa-dropdown .dropdown-item {
  border-radius: 6px;
  font-size: .875rem;
  color: #a0b8cc;
  padding: .5rem .8rem;
}
.nisphfa-dropdown .dropdown-item:hover { background: var(--nisphfa-blue-glow); color: #fff; }
.nisphfa-dropdown .dropdown-divider { border-color: var(--nisphfa-border-soft); }

/* ── Cards ──────────────────────────────────────────────────── */
.nisphfa-card {
  background: #111c2d !important;
  border: 1px solid var(--nisphfa-border) !important;
  border-radius: 12px !important;
}
.nisphfa-card-header {
  background: transparent !important;
  border-bottom: 1px solid var(--nisphfa-border-soft) !important;
  padding: 1rem 1.25rem;
}

/* ── Auth cards ─────────────────────────────────────────────── */
.nisphfa-auth-card {
  background: #111c2d !important;
  border: 1px solid var(--nisphfa-border) !important;
  border-radius: 16px !important;
}

/* ── Modal ──────────────────────────────────────────────────── */
.nisphfa-modal-content {
  background: #111c2d !important;
  border: 1px solid var(--nisphfa-border) !important;
  border-radius: 16px !important;
}

/* ── Notice box ─────────────────────────────────────────────── */
.nisphfa-notice {
  background: rgba(26,111,219,.09);
  border: 1px solid rgba(26,111,219,.22);
}

/* ── Welcome bar ────────────────────────────────────────────── */
.nisphfa-welcome-bar {
  background: linear-gradient(135deg, #111c2d 0%, #0f1e38 100%);
  border: 1px solid var(--nisphfa-border);
}

/* ── Progress tracker ───────────────────────────────────────── */
.nisphfa-progress-track {
  display: flex;
  align-items: center;
  gap: 0;
  flex-wrap: wrap;
  row-gap: 1rem;
}
.nisphfa-stage {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: .35rem;
  flex-shrink: 0;
}
.nisphfa-stage-icon {
  width: 40px; height: 40px;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 1rem;
  border: 2px solid var(--nisphfa-border);
  background: #0d1520;
  color: var(--nisphfa-text-muted);
  transition: all .25s;
}
.nisphfa-stage.active .nisphfa-stage-icon {
  background: var(--nisphfa-blue);
  border-color: var(--nisphfa-blue);
  color: #fff;
  box-shadow: 0 0 0 4px var(--nisphfa-blue-glow);
}
.nisphfa-stage.done .nisphfa-stage-icon {
  background: rgba(26,111,219,.15);
  border-color: var(--nisphfa-blue);
  color: var(--nisphfa-blue-light);
}
.nisphfa-stage-label {
  font-size: .7rem;
  color: var(--nisphfa-text-muted);
  font-weight: 500;
  white-space: nowrap;
}
.nisphfa-stage.active .nisphfa-stage-label { color: #fff; }
.nisphfa-stage.done .nisphfa-stage-label   { color: var(--nisphfa-blue-light); }
.nisphfa-stage-connector {
  flex: 1;
  height: 2px;
  background: var(--nisphfa-border);
  min-width: 20px;
  margin-bottom: 1.3rem;
}
.nisphfa-stage-connector.done { background: var(--nisphfa-blue); }

/* ── Tables ─────────────────────────────────────────────────── */
.nisphfa-table {
  color: #c8d8e8;
  font-size: .875rem;
  border-color: var(--nisphfa-border-soft);
}
.nisphfa-table thead th {
  font-size: .72rem;
  font-weight: 600;
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--nisphfa-text-muted);
  background: transparent;
  border-bottom: 1px solid var(--nisphfa-border-soft);
  padding: .85rem 1rem;
}
.nisphfa-table tbody td {
  border-color: var(--nisphfa-border-soft);
  padding: .75rem 1rem;
  vertical-align: middle;
}
.nisphfa-table tbody tr:hover { background: rgba(26,111,219,.05); }

/* ── Notifications ──────────────────────────────────────────── */
.nisphfa-notif-item {
  background: transparent;
  border-color: var(--nisphfa-border-soft);
  padding: .85rem 1.25rem;
}
.nisphfa-notif-item.unread {
  border-left: 3px solid var(--nisphfa-blue);
  background: rgba(26,111,219,.05);
}

/* ── License card ───────────────────────────────────────────── */
.nisphfa-license-card {
  background: linear-gradient(145deg, #0f1e38, #111c2d) !important;
  border: 1px solid var(--nisphfa-blue) !important;
}

/* ── Forms ──────────────────────────────────────────────────── */
.form-control, .form-select {
  background: #0d1520 !important;
  border-color: rgba(26,111,219,.25) !important;
  color: #c8d8e8 !important;
  border-radius: 8px;
}
.form-control:focus, .form-select:focus {
  background: #0d1520 !important;
  border-color: var(--nisphfa-blue) !important;
  box-shadow: 0 0 0 3px var(--nisphfa-blue-glow) !important;
  color: #fff !important;
}
.form-control::placeholder { color: #4a6180; }
.input-group-text {
  background: #0a1322 !important;
  border-color: rgba(26,111,219,.25) !important;
  color: var(--nisphfa-text-muted);
}

/* ── Buttons ────────────────────────────────────────────────── */
.btn-primary {
  background: var(--nisphfa-blue) !important;
  border-color: var(--nisphfa-blue) !important;
  font-weight: 500;
}
.btn-primary:hover {
  background: var(--nisphfa-blue-light) !important;
  border-color: var(--nisphfa-blue-light) !important;
}
.btn-xs { padding: .2rem .6rem; font-size: .78rem; border-radius: 5px; }
.btn-outline-primary { border-color: var(--nisphfa-blue) !important; color: var(--nisphfa-blue-light) !important; }
.btn-outline-primary:hover { background: var(--nisphfa-blue) !important; color: #fff !important; }

/* ── Footer ─────────────────────────────────────────────────── */
.nisphfa-footer {
  background: #060e18;
  border-top: 1px solid var(--nisphfa-border);
}
.nisphfa-footer-link {
  color: var(--nisphfa-text-muted);
  text-decoration: none;
  font-size: .875rem;
  transition: color .15s;
}
.nisphfa-footer-link:hover { color: var(--nisphfa-blue-light); }
.nisphfa-social-link {
  color: var(--nisphfa-text-muted);
  font-size: 1.1rem;
  text-decoration: none;
  transition: color .15s;
}
.nisphfa-social-link:hover { color: var(--nisphfa-blue-light); }

/* ── Hero section (landing page) ───────────────────────────── */
.nisphfa-hero {
  background: linear-gradient(160deg, #060e18 0%, #0a1830 55%, #0d2040 100%);
  min-height: 88vh;
  display: flex;
  align-items: center;
  position: relative;
  overflow: hidden;
}
.nisphfa-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 70% 60% at 60% 50%, rgba(26,111,219,.12) 0%, transparent 70%);
  pointer-events: none;
}
.nisphfa-hero-badge {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  background: rgba(26,111,219,.12);
  border: 1px solid rgba(26,111,219,.3);
  color: var(--nisphfa-blue-light);
  font-size: .8rem;
  font-weight: 500;
  padding: .35rem .9rem;
  border-radius: 50px;
  margin-bottom: 1.5rem;
}

/* ── Section titles ─────────────────────────────────────────── */
.nisphfa-section-tag {
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--nisphfa-blue-light);
}

/* ── Step indicator (forms) ─────────────────────────────────── */
.nisphfa-step-indicator {
  display: flex;
  gap: .5rem;
  margin-bottom: 2rem;
}
.nisphfa-step {
  flex: 1;
  height: 4px;
  border-radius: 2px;
  background: var(--nisphfa-border);
  transition: background .3s;
}
.nisphfa-step.active, .nisphfa-step.done { background: var(--nisphfa-blue); }

/* ── Admin sidebar ──────────────────────────────────────────── */
.nisphfa-admin-sidebar {
  width: 260px;
  background: #060e18;
  border-right: 1px solid var(--nisphfa-border);
  min-height: 100vh;
  flex-shrink: 0;
}
.nisphfa-sidebar-link {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: .65rem 1.25rem;
  border-radius: 8px;
  color: #7a8fa8;
  text-decoration: none;
  font-size: .875rem;
  font-weight: 500;
  transition: all .15s;
  margin: .1rem .5rem;
}
.nisphfa-sidebar-link:hover, .nisphfa-sidebar-link.active {
  background: var(--nisphfa-blue-glow);
  color: #fff;
}
.nisphfa-sidebar-link .bi { font-size: 1rem; }

/* ── Stat cards ─────────────────────────────────────────────── */
.nisphfa-stat-card {
  background: #111c2d;
  border: 1px solid var(--nisphfa-border);
  border-radius: 12px;
  padding: 1.5rem;
}
.nisphfa-stat-icon {
  width: 48px; height: 48px;
  border-radius: 10px;
  background: var(--nisphfa-blue-glow);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.3rem;
  color: var(--nisphfa-blue-light);
}

/* ── Payment initiate page ──────────────────────────────────── */
.nisphfa-payment-card {
  background: linear-gradient(145deg, #0f1e38, #111c2d);
  border: 1px solid var(--nisphfa-blue) !important;
  border-radius: 16px;
}

/* ── Badge overrides ────────────────────────────────────────── */
.badge { font-weight: 500; font-size: .73rem; }
