:root {
  --bf-primary: #0d3b66;
  --bf-accent: #1a6bb5;
  --bf-success: #2d6a4f;
  --bf-warning: #e9c46a;
  --bf-danger: #c1121f;
  --bf-light: #f4f7fb;
  --bf-sidebar: #0a2d4d;
}

html { font-size: 14px; position: relative; min-height: 100%; }
@media (min-width: 768px) { html { font-size: 16px; } }

body { margin-bottom: 60px; background: var(--bf-light); }

.bf-navbar { background: linear-gradient(135deg, var(--bf-primary), var(--bf-accent)) !important; }
.bf-logo { color: #7dd3fc; }

.portal-body { background: #eef2f7; margin-bottom: 0; }
.portal-container { min-height: calc(100vh - 56px); }
.portal-sidebar { background: var(--bf-sidebar); min-height: calc(100vh - 56px); }
.portal-nav .nav-link { color: rgba(255,255,255,.75); padding: .6rem 1rem; border-radius: .375rem; margin: .15rem .5rem; }
.portal-nav .nav-link:hover, .portal-nav .nav-link.active { color: #fff; background: rgba(255,255,255,.1); }
.portal-main { background: #fff; min-height: calc(100vh - 56px); border-left: 1px solid #dee2e6; }

.hero-section {
  background: linear-gradient(135deg, var(--bf-primary) 0%, var(--bf-accent) 100%);
  color: #fff;
  border-radius: 1rem;
  padding: 3rem 2rem;
  margin-bottom: 2rem;
}

.portal-card {
  border: none;
  border-radius: .75rem;
  box-shadow: 0 2px 12px rgba(13,59,102,.08);
  transition: transform .15s ease;
}
.portal-card:hover { transform: translateY(-2px); }

.stat-card { border-left: 4px solid var(--bf-accent); }
.stat-card .stat-value { font-size: 1.75rem; font-weight: 700; color: var(--bf-primary); }

.score-gauge {
  width: 140px; height: 140px;
  border-radius: 50%;
  background: conic-gradient(var(--bf-accent) calc(var(--score-pct) * 1%), #e9ecef 0);
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto;
}
.score-gauge-inner {
  width: 110px; height: 110px; border-radius: 50%;
  background: #fff;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
}
.score-gauge-inner .score-num { font-size: 2rem; font-weight: 800; color: var(--bf-primary); line-height: 1; }

.rating-excellent { color: #2d6a4f; }
.rating-good { color: #40916c; }
.rating-fair { color: #e9c46a; }
.rating-poor { color: #e76f51; }
.rating-highrisk { color: var(--bf-danger); }

.lender-on-file-row { border-left: 3px solid var(--bf-accent); padding-left: 1rem; margin-bottom: 1rem; }

.page-header { border-bottom: 2px solid var(--bf-light); padding-bottom: 1rem; margin-bottom: 1.5rem; }
.page-header h1 { color: var(--bf-primary); font-weight: 700; margin: 0; }

.form-section-title {
  font-size: .85rem; text-transform: uppercase; letter-spacing: .05em;
  color: var(--bf-accent); font-weight: 600; margin: 1.5rem 0 .75rem;
  padding-bottom: .25rem; border-bottom: 1px solid #dee2e6;
}

.btn-bf-primary { background: var(--bf-primary); border-color: var(--bf-primary); color: #fff; }
.btn-bf-primary:hover { background: var(--bf-accent); border-color: var(--bf-accent); color: #fff; }

.footer { background: #fff; }

.upload-zone {
  background: linear-gradient(180deg, #f8fbff 0%, #fff 100%);
  border: 2px dashed #b8d4f0;
  border-radius: .75rem;
  transition: border-color .15s ease, background-color .15s ease;
}
.upload-zone [data-upload-drop] {
  cursor: pointer;
}
.upload-zone-active,
.upload-zone.upload-zone-active {
  border-color: var(--bf-accent);
  background: linear-gradient(180deg, #eef6ff 0%, #fff 100%);
}

.upload-tabs .nav-link {
  color: var(--bf-primary);
  font-weight: 600;
}
.upload-tabs .nav-link.active {
  color: var(--bf-accent);
  border-bottom-color: var(--bf-accent);
}

.upload-tab-subtitle {
  font-size: 0.7rem;
  font-weight: 500;
  opacity: 0.75;
  line-height: 1.2;
  margin-top: 0.15rem;
}

.upload-instruction {
  border-radius: 0.5rem;
  padding: 0.85rem 1rem;
  font-size: 0.9rem;
  line-height: 1.45;
}

.upload-instruction--credit {
  background: #eff6ff;
  border: 1px solid #bfdbfe;
}

.upload-instruction--payment {
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
}

.company-badge {
  color: #fff;
  font-size: .8rem;
  font-weight: 600;
  line-height: 1.3;
  padding: .5rem .75rem;
  border-radius: .5rem;
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.15);
}

.register-hero {
  background: linear-gradient(135deg, var(--bf-primary) 0%, var(--bf-accent) 100%);
  color: #fff;
  border-radius: 1rem;
  padding: 2rem;
}

.register-step {
  display: flex;
  gap: .75rem;
  margin-bottom: 1rem;
}
.register-step-num {
  width: 28px; height: 28px;
  border-radius: 50%;
  background: rgba(255,255,255,.2);
  display: flex; align-items: center; justify-content: center;
  font-weight: 700; flex-shrink: 0;
}

/* Form actions: Cancel always left, primary/save always right */
.bf-form-actions,
.modal-footer.bf-form-actions,
.bf-modal .modal-footer {
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  align-items: center;
  gap: 0.5rem;
  margin-top: 1rem;
}

.bf-modal .modal-footer {
  margin-top: 0;
}

.bf-form-actions > :first-child:not(:only-child),
.bf-modal .modal-footer > :first-child:not(:only-child) {
  margin-right: auto;
}