/* Payment Gateway Management Portal — brand layer over AdminLTE.
   Deep navy for trust, teal for accents. */
:root {
  --pg-navy: #1f4e79;
  --pg-navy-dark: #163a5b;
  --pg-navy-soft: #eaf1f8;
  --pg-teal: #17a2b8;
  --pg-teal-soft: #e6f6f8;
}

body { font-family: 'Source Sans Pro', -apple-system, 'Segoe UI', Roboto, sans-serif; }

/* Top bar & brand */
.navbar-portal { background: var(--pg-navy) !important; border-bottom: 3px solid var(--pg-teal) !important; }
.navbar-portal .nav-link, .navbar-portal .navbar-brand { color: #fff !important; }
.brand-mark {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 34px; height: 34px; padding: 0 6px; border-radius: 17px;
  background: var(--pg-teal); color: #fff; font-weight: 700; font-size: .8rem;
}
.brand-mark.user-mark { background: #fff; color: var(--pg-navy); font-size: .95rem; }
.headline-pill {
  background: rgba(255,255,255,.14); border-radius: 20px; padding: 5px 14px; margin-right: 8px;
  display: flex; align-items: center; color: #fff !important; text-decoration: none !important; white-space: nowrap;
}
.headline-pill:hover { background: rgba(255,255,255,.24); }
.headline-pill .lbl { font-size: .8rem; opacity: .85; margin-right: 6px; }
.headline-pill i { color: #9fe3ee; margin-right: 6px; }

/* Sidebar */
.main-sidebar { background: #13263a !important; }
.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link.active {
  background: var(--pg-navy) !important; color: #fff; box-shadow: inset 3px 0 0 var(--pg-teal);
}
.nav-sidebar .nav-header { color: #9fe3ee !important; opacity: .75; font-size: .72rem; letter-spacing: .08em; }
.brand-link { border-bottom: 1px solid rgba(23,162,184,.35) !important; }
.user-panel-role { font-size: .75rem; color: #9fe3ee; display: block; line-height: 1.1; }

/* Primary colour → navy */
.btn-primary { background: var(--pg-navy); border-color: var(--pg-navy); }
.btn-primary:hover, .btn-primary:focus, .btn-primary:active,
.btn-primary:not(:disabled):not(.disabled):active { background: var(--pg-navy-dark) !important; border-color: var(--pg-navy-dark) !important; }
.btn-outline-primary { color: var(--pg-navy); border-color: var(--pg-navy); }
.btn-outline-primary:hover { background: var(--pg-navy); border-color: var(--pg-navy); color: #fff; }
.card-primary.card-outline { border-top-color: var(--pg-navy); }
.card-primary:not(.card-outline) > .card-header { background: var(--pg-navy); }
.bg-primary, .badge-primary { background-color: var(--pg-navy) !important; }
.text-primary { color: var(--pg-navy) !important; }
a { color: var(--pg-navy); }
a:hover { color: var(--pg-navy-dark); }
.page-item.active .page-link { background: var(--pg-navy); border-color: var(--pg-navy); }
.page-link { color: var(--pg-navy); }
.nav-pills .nav-link.active { background: var(--pg-navy); }
.nav-tabs .nav-link.active { border-top: 3px solid var(--pg-teal); font-weight: 600; }
.form-control:focus { border-color: var(--pg-teal); box-shadow: 0 0 0 .15rem rgba(23,162,184,.25); }
.bg-navy-soft { background: var(--pg-navy-soft) !important; }
.bg-teal-soft { background: var(--pg-teal-soft) !important; }

/* KPI boxes */
.info-box { min-height: 88px; }
/* AdminLTE keeps box text on one line and cuts it off; wrap it instead so
   narrow screens show whole titles. min-width: 0 lets the text column shrink
   inside the flex box instead of pushing past its edge. */
.info-box .info-box-content { min-width: 0; }
.info-box .info-box-text { text-transform: none; font-weight: 600; color: #555; white-space: normal; line-height: 1.25; }
.info-box .info-box-number { font-size: clamp(1.05rem, 1.6vw, 1.3rem); font-weight: 700; overflow-wrap: anywhere; }
.info-box small.sub { color: #888; display: block; white-space: normal; line-height: 1.3; }
a.info-box-link { color: inherit; text-decoration: none; }
a.info-box-link:hover .info-box { box-shadow: 0 0 0 2px var(--pg-teal); }
/* Boxes in one row share a height, whatever their text length. */
.kpi-row > [class*="col-"] { display: flex; }
.kpi-row > [class*="col-"] > .info-box,
.kpi-row > [class*="col-"] > a.info-box-link { flex: 1 1 auto; display: flex; }
.kpi-row > [class*="col-"] > a.info-box-link > .info-box { flex: 1 1 auto; }

/* Login */
.login-side { background: linear-gradient(160deg, var(--pg-navy) 0%, #13263a 100%); color: #fff; }
.login-side .accent { color: #9fe3ee; }

/* Tables */
.table td, .table th { vertical-align: middle; }
.table-sm td, .table-sm th { padding: .4rem .5rem; }
.money { font-variant-numeric: tabular-nums; white-space: nowrap; }
.ref { font-family: SFMono-Regular, Menlo, Consolas, monospace; font-size: .82rem; }
/* Inside a scrolling table, keep references on one line: the table scrolls
   sideways instead of breaking MLIMIPAY-DEPOSIT-798961 over three lines. */
.table-responsive .ref, .table-responsive td.text-nowrap { white-space: nowrap; }
pre.json { max-height: 22rem; overflow: auto; font-size: .78rem; white-space: pre-wrap; word-break: break-all; }
dl.kv dt { font-weight: 600; color: #555; }

@media print { .no-print { display: none !important; } }