/* =====================================================================
   FinRight Portal — dashboard styles (extends the site theme)
   ===================================================================== */
.portal-body { background: var(--fr-bg-soft2); min-height: 100vh; display: flex; flex-direction: column; }
.portal-main { flex: 1; padding: 2.2rem 0 3rem; }

/* Top bar */
.portal-nav {
  background: var(--fr-grad-ink);
  padding: .8rem 0;
  box-shadow: 0 8px 26px -14px rgba(14, 35, 64, .5);
  position: sticky; top: 0; z-index: 1030;
}
.portal-nav .nav-link { color: rgba(255, 255, 255, .82) !important; font-weight: 600; font-size: .93rem; border-radius: 10px; padding: .5rem .85rem !important; }
.portal-nav .nav-link:hover { color: #ecc766 !important; }
.portal-user { display: inline-flex; align-items: center; gap: .55rem; }
.portal-avatar {
  width: 34px; height: 34px; border-radius: 50%; display: inline-grid; place-items: center;
  background: var(--fr-grad-gold); color: #3a2c05; font-weight: 800; font-size: .95rem; flex: none;
}
@media (max-width: 991.98px) {
  .portal-nav .navbar-collapse { background: rgba(255,255,255,.06); border-radius: 14px; margin-top: .8rem; padding: .8rem; }
}

/* Page head */
.portal-title { font-size: 1.55rem; margin-bottom: .2rem; }
.portal-sub { color: var(--fr-muted); font-size: .95rem; }

/* Stat tiles */
.stat-tile {
  background: #fff; border: 1px solid var(--fr-line); border-radius: 16px; padding: 1.25rem 1.4rem;
  display: flex; align-items: center; gap: 1rem; height: 100%;
}
.stat-tile .ic {
  width: 52px; height: 52px; border-radius: 14px; display: grid; place-items: center; font-size: 1.5rem; flex: none;
  background: rgba(27, 74, 130, .1); color: var(--fr-primary-d);
}
.stat-tile.tile-pending .ic  { background: rgba(230, 179, 74, .16); color: #a97c14; }
.stat-tile.tile-approved .ic { background: rgba(25, 135, 84, .12); color: #198754; }
.stat-tile.tile-rejected .ic { background: rgba(220, 53, 69, .1); color: #dc3545; }
.stat-tile .num { font-family: "Plus Jakarta Sans", sans-serif; font-weight: 800; font-size: 1.7rem; line-height: 1; color: var(--fr-ink); }
.stat-tile .lbl { font-size: .82rem; color: var(--fr-muted); font-weight: 600; }

/* Account-type selector (register) */
.role-select .role-radio {
  position: absolute; opacity: 0; width: 0; height: 0; pointer-events: none;
}
.role-card {
  position: relative; display: flex; align-items: center; gap: .85rem; height: 100%;
  padding: 1.05rem 1.1rem; border: 1.6px solid var(--fr-line); border-radius: 16px;
  background: #fff; cursor: pointer; transition: all var(--fr-trans); margin: 0;
}
.role-card:hover { border-color: var(--fr-primary-l); background: rgba(27, 74, 130, .03); }
.role-ic {
  flex: none; width: 46px; height: 46px; border-radius: 13px; display: grid; place-items: center;
  font-size: 1.35rem; background: rgba(27, 74, 130, .1); color: var(--fr-primary-d);
  transition: all var(--fr-trans);
}
.role-txt { display: flex; flex-direction: column; line-height: 1.25; min-width: 0; }
.role-title { font-family: "Plus Jakarta Sans", sans-serif; font-weight: 800; color: var(--fr-ink); font-size: 1rem; }
.role-desc { font-size: .82rem; color: var(--fr-muted); }
.role-check {
  position: absolute; top: 12px; right: 12px; width: 22px; height: 22px; border-radius: 50%;
  display: grid; place-items: center; font-size: .8rem; color: #fff; background: var(--fr-primary);
  opacity: 0; transform: scale(.5); transition: all var(--fr-trans);
}
/* Selected state */
.role-radio:checked + .role-card {
  border-color: var(--fr-primary); background: rgba(27, 74, 130, .06);
  box-shadow: 0 8px 24px -12px rgba(27, 74, 130, .4);
}
.role-radio:checked + .role-card .role-ic { background: var(--fr-grad); color: #fff; box-shadow: var(--fr-shadow-brand); }
.role-radio:checked + .role-card .role-check { opacity: 1; transform: scale(1); }
.role-radio:focus-visible + .role-card { outline: 3px solid rgba(27, 74, 130, .35); outline-offset: 2px; }

/* Keep autofilled fields on-brand (no browser blue/yellow wash) */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
  -webkit-text-fill-color: var(--fr-ink);
  -webkit-box-shadow: 0 0 0 40px #fff inset;
  box-shadow: 0 0 0 40px #fff inset;
  caret-color: var(--fr-ink);
}

/* Cards / tables */
.portal-card { background: #fff; border: 1px solid var(--fr-line); border-radius: 16px; }
.portal-card .card-head { padding: 1.1rem 1.4rem; border-bottom: 1px solid var(--fr-line); display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.portal-card .card-head h5 { margin: 0; font-size: 1.05rem; }
.portal-card .card-body-pad { padding: 1.4rem; }
.table-portal { margin: 0; }
.table-portal thead th {
  font-size: .74rem; letter-spacing: .08em; text-transform: uppercase; color: var(--fr-muted);
  border-bottom: 1px solid var(--fr-line); padding: .85rem 1.4rem; background: var(--fr-bg-soft);
  white-space: nowrap;
}
.table-portal tbody td { padding: .95rem 1.4rem; vertical-align: middle; border-color: var(--fr-line); font-size: .92rem; color: var(--fr-body); }
.table-portal tbody tr:hover { background: rgba(27, 74, 130, .03); }

/* Forms */
.portal-form-card { background: #fff; border: 1px solid var(--fr-line); border-radius: 18px; padding: 2rem; }
.auth-wrap { max-width: 460px; margin: 2.5rem auto; }
.auth-wrap.wide { max-width: 720px; }
.auth-logo { text-align: center; margin-bottom: 1.4rem; }
.auth-logo img { height: 54px; }

/* File chip */
.file-chip { display: inline-flex; align-items: center; gap: .45rem; font-size: .85rem; color: var(--fr-primary-d); font-weight: 600; }
.file-chip i { font-size: 1.1rem; }

/* Description clamp in tables */
.desc-clamp { max-width: 260px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: inline-block; vertical-align: middle; }

/* Footer */
.portal-footer { background: var(--fr-ink); color: rgba(255, 255, 255, .6); font-size: .85rem; padding: 1rem 0; }
.portal-footer a { color: rgba(255, 255, 255, .75); }
.portal-footer a:hover { color: #ecc766; }

/* Review buttons */
.btn-approve { background: #198754; color: #fff; }
.btn-approve:hover { background: #157347; color: #fff; }
.btn-reject { background: #dc3545; color: #fff; }
.btn-reject:hover { background: #bb2d3b; color: #fff; }