/* Strong Ally UI refresh — presentation only; no application logic */
:root{
 --sa-navy:#102b50;--sa-navy-2:#173b68;--sa-blue:#2463eb;--sa-blue-2:#3478f6;
 --sa-ink:#10213f;--sa-muted:#647797;--sa-line:#e2eaf4;--sa-bg:#f3f7fc;
 --sa-white:#fff;--sa-green:#079669;--sa-red:#dc3545;--sa-amber:#d97706;
 --sa-radius:18px;--sa-shadow:0 8px 26px rgba(19,48,86,.07);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{color:var(--sa-ink);background:var(--sa-bg);font-family:Inter,"Segoe UI",Roboto,Arial,sans-serif;line-height:1.55}
h1,h2,h3,h4{color:var(--sa-ink);letter-spacing:-.025em;line-height:1.2}
h1{font-size:clamp(1.8rem,2.4vw,2.55rem);font-weight:800}
h2{font-size:1.45rem;font-weight:750} h3{font-size:1.12rem;font-weight:750}
p{color:var(--sa-muted)}
a{transition:color .18s ease,background .18s ease,transform .18s ease}
button,.btn,input[type=submit],input[type=button]{transition:background .18s ease,box-shadow .18s ease,transform .18s ease}
button:hover,.btn:hover,input[type=submit]:hover,input[type=button]:hover{filter:brightness(.98)}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(36,99,235,.3);outline-offset:2px}
input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]),select,textarea{
 border:1px solid #d7e1ee;border-radius:10px;background:#fff;padding:11px 13px;color:var(--sa-ink);max-width:100%;transition:border-color .18s,box-shadow .18s
}
input:focus,select:focus,textarea:focus{border-color:var(--sa-blue);box-shadow:0 0 0 3px rgba(36,99,235,.1)}
button,.btn,input[type=submit],input[type=button]{border-radius:10px;font-weight:650}
table{border-collapse:separate;border-spacing:0;width:100%;background:#fff;border:1px solid var(--sa-line);border-radius:14px;overflow:hidden}
th{background:#f2f6fc;color:#415777;text-transform:uppercase;font-size:.76rem;letter-spacing:.045em;font-weight:750}
th,td{padding:13px 15px;border-bottom:1px solid #edf1f7;text-align:left;vertical-align:middle}
tbody tr:last-child td{border-bottom:0} tbody tr:hover{background:#f8fbff}
.badge,.status,.status-badge{border-radius:999px;padding:5px 10px;font-size:.78rem;font-weight:700}
img{max-width:100%}
/* Admin sidebar shared include */
.sidebar{background:linear-gradient(180deg,#153963 0%,#0c2344 100%)!important;color:#fff!important;box-shadow:8px 0 30px rgba(12,35,68,.08);padding:22px 14px!important}
.sidebar .system-title{font-size:1.22rem!important;font-weight:800!important;line-height:1.25;margin-top:8px;letter-spacing:-.02em}
.sidebar .system-subtitle{color:#c5d5eb!important;font-size:.78rem!important;line-height:1.55;margin-top:8px;margin-bottom:22px}
.sidebar .admin-info{padding:14px 12px!important;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);border-radius:14px;margin:18px 0 22px!important}
.sidebar .admin-name{font-size:.9rem!important;color:#fff}
.sidebar .admin-role{color:#c4d4e9!important}
.sidebar .sidebar-menu{gap:5px!important}
.sidebar .sidebar-menu a,.sidebar .logout a{border-radius:11px!important;padding:12px 13px!important;font-size:.87rem!important;color:#dce8f8!important}
.sidebar .sidebar-menu a:hover,.sidebar .logout a:hover{background:rgba(255,255,255,.09)!important;color:#fff!important;transform:translateX(2px)}
.sidebar .sidebar-menu a.active{background:linear-gradient(135deg,#3478f6,#1d55cf)!important;color:#fff!important;box-shadow:0 7px 16px rgba(12,37,79,.25);font-weight:750}
.sa-brand{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:0 12px 10px}
.sa-brand img{width:68px;height:68px;object-fit:cover;object-position:center;border-radius:50%;border:2px solid rgba(255,255,255,.85);box-shadow:0 4px 16px rgba(0,0,0,.15)}
/* Common page containers/cards */
main,.main-content,.content,.dashboard-content,.page-content,.container{max-width:100%}
.card,.stat-card,.summary-card,.dashboard-card,.content-card,.panel,.section-card,.form-card{
 border:1px solid var(--sa-line)!important;border-radius:var(--sa-radius)!important;background:#fff!important;box-shadow:var(--sa-shadow)!important
}
.stat-card,.summary-card{padding:22px!important}
.card h2,.panel h2,.content-card h2{margin-top:0}
.section-title,.section-heading{font-weight:800;letter-spacing:.04em;color:#3b5271}
hr{border:0;border-top:1px solid var(--sa-line)}
.alert,.message,.notice{border-radius:12px;padding:12px 15px}
.btn-primary,button.primary,.primary-btn{background:var(--sa-blue)!important;border-color:var(--sa-blue)!important;color:#fff!important}
.btn-danger,button.danger,.danger-btn{background:var(--sa-red)!important;color:#fff!important}
@media(max-width:900px){
 .sidebar{padding:16px 12px!important}
 table{display:block;overflow-x:auto;white-space:nowrap}
}
@media(max-width:640px){
 body{font-size:14px}
 h1{font-size:1.75rem}
 .card,.stat-card,.summary-card,.dashboard-card,.content-card,.panel,.section-card,.form-card{border-radius:14px!important}
 th,td{padding:10px 12px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}


/* Dashboard-specific refinements matching the approved visual direction */
.admin-layout{background:#f2f6fc;min-height:100vh}
.admin-layout>.main-content{padding:34px clamp(20px,2.6vw,42px)!important;min-width:0}
.page-title{font-size:clamp(1.9rem,2.5vw,2.65rem)!important;font-weight:800!important;letter-spacing:-.04em;margin-bottom:8px!important}
.welcome{margin-bottom:24px!important;line-height:1.65}
.realtime-bar{border:1px solid #dce9f7;background:#fff!important;border-radius:13px!important;padding:13px 16px!important;box-shadow:0 3px 12px rgba(16,43,80,.035)}
.dashboard-section{margin-top:26px!important}
.section-label{font-size:.82rem!important;font-weight:800!important;letter-spacing:.08em!important;color:#405777!important}
.section-description{margin-top:4px!important;color:#7486a1!important}
.cards{gap:16px!important}
.cards-system{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.cards-collections{grid-template-columns:repeat(3,minmax(0,1fr))!important}
.cards-financial{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.card{padding:23px!important;min-width:0;transition:transform .18s ease,box-shadow .18s ease}
.card:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(19,48,86,.09)!important}
.card-title{font-size:.9rem!important;color:#536985!important;font-weight:700!important}
.card-number{font-size:clamp(1.6rem,2vw,2.05rem)!important;font-weight:800!important;letter-spacing:-.035em;color:#112b4d!important;overflow-wrap:anywhere}
.card-note{font-size:.82rem!important;color:#8292aa!important}
.payment-card{border-top:3px solid #dceaff!important}
.collection-card{background:linear-gradient(145deg,#fff,#f8fbff)!important}
.overdue-card{border-top-color:#f7c9ce!important}
.action-card{display:flex;align-items:center;gap:14px;background:#fff!important}
.action-icon{width:46px;height:46px;display:grid;place-items:center;border-radius:13px;background:#e8f1ff;color:#2463eb;flex-shrink:0}
.action-number{font-size:1.6rem!important;font-weight:800!important;color:#102b50}
.dashboard-footer{color:#7587a2!important}
@media(max-width:1100px){.cards-system{grid-template-columns:repeat(2,minmax(0,1fr))!important}.cards-collections{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:680px){.admin-layout>.main-content{padding:22px 15px!important}.cards-system,.cards-collections,.cards-financial{grid-template-columns:1fr!important}.section-heading{align-items:flex-start;flex-direction:column}.card{padding:18px!important}}

/* ==========================================================
   STRONG ALLY UNIFIED DESIGN SYSTEM — cross-page consistency
   Presentation only. Do not place application logic here.
   ========================================================== */
:root {
  --sa-navy:#102b50; --sa-navy-deep:#0b2040; --sa-blue:#2463eb;
  --sa-blue-hover:#1e50c8; --sa-bg:#f2f6fc; --sa-surface:#ffffff;
  --sa-text:#10213f; --sa-muted:#647797; --sa-border:#e1e9f3;
  --sa-success:#07865e; --sa-danger:#dc3545; --sa-warning:#d97706;
  --sa-radius:16px; --sa-shadow:0 8px 24px rgba(16,43,80,.065);
}
html { min-height:100%; scroll-behavior:smooth; scrollbar-color:#a9b8cc #edf2f8; scrollbar-width:thin; }
body { margin:0; color:var(--sa-text); background:var(--sa-bg); font-family:Inter,"Segoe UI",Roboto,Arial,sans-serif; }
::selection { background:rgba(36,99,235,.22); color:inherit; }
/* Shared admin sidebar: same width, font, spacing and scrolling on every admin page. */
.sidebar {
  position:sticky!important; top:0!important; align-self:flex-start!important;
  width:274px!important; min-width:274px!important; max-width:274px!important;
  height:100vh!important; max-height:100vh!important; overflow-y:auto!important; overflow-x:hidden!important;
  flex:0 0 274px!important; box-sizing:border-box!important;
  background:linear-gradient(180deg,#153963 0%,#0b2242 100%)!important;
  color:#f8fbff!important; padding:22px 14px 18px!important;
  scrollbar-width:thin; scrollbar-color:rgba(215,229,248,.48) transparent;
}
.sidebar::-webkit-scrollbar { width:6px; }
.sidebar::-webkit-scrollbar-track { background:transparent; }
.sidebar::-webkit-scrollbar-thumb { background:rgba(215,229,248,.42); border-radius:20px; }
.sa-brand { display:flex!important; flex-direction:column!important; align-items:center!important; text-align:center!important; gap:9px!important; padding:3px 8px 12px!important; }
.sa-brand img { display:block!important; width:76px!important; height:76px!important; object-fit:contain!important; object-position:center!important; border-radius:50%!important; flex:0 0 auto!important; }
.sidebar .system-title { color:#fff!important; font-size:1.18rem!important; line-height:1.25!important; font-weight:800!important; letter-spacing:-.02em!important; margin:0!important; padding:0!important; }
.sidebar .system-subtitle { color:#c7d8ed!important; font-size:.76rem!important; line-height:1.5!important; padding:0 10px!important; margin:6px 0 20px!important; }
.sidebar .admin-info { margin:0 0 18px!important; padding:13px 12px!important; border-radius:13px!important; background:rgba(255,255,255,.07)!important; border:1px solid rgba(255,255,255,.1)!important; }
.sidebar .admin-name { color:#fff!important; font-size:.88rem!important; font-weight:750!important; line-height:1.4!important; margin:0 0 5px!important; overflow-wrap:anywhere; }
.sidebar .admin-role { color:#c7d8ed!important; font-size:.78rem!important; line-height:1.4!important; }
.sidebar .sidebar-menu { display:flex!important; flex-direction:column!important; align-items:stretch!important; gap:5px!important; }
.sidebar .sidebar-menu > a, .sidebar .logout > a {
  display:flex!important; align-items:center!important; gap:10px!important; min-height:44px!important;
  width:100%!important; box-sizing:border-box!important; padding:11px 12px!important; margin:0!important;
  border:1px solid transparent!important; border-radius:11px!important; background:transparent!important;
  color:#dce8f8!important; text-decoration:none!important; font-size:.86rem!important;
  font-weight:600!important; line-height:1.35!important; white-space:normal!important;
  overflow-wrap:anywhere!important; text-shadow:none!important; box-shadow:none!important;
}
.sidebar .sidebar-menu > a::before { content:""; width:7px; height:7px; flex:0 0 7px; border-radius:2px; background:rgba(210,228,250,.65); }
.sidebar .sidebar-menu > a:hover, .sidebar .logout > a:hover { background:rgba(255,255,255,.09)!important; color:#fff!important; border-color:rgba(255,255,255,.08)!important; transform:none!important; }
.sidebar .sidebar-menu > a.active { background:linear-gradient(135deg,#3478f6,#1d55cf)!important; color:#fff!important; border-color:rgba(255,255,255,.12)!important; box-shadow:0 6px 16px rgba(4,20,50,.2)!important; font-weight:750!important; }
.sidebar .sidebar-menu > a.active::before { background:#fff; box-shadow:0 0 0 3px rgba(255,255,255,.14); }
.sidebar .logout { margin-top:12px!important; padding-top:12px!important; border-top:1px solid rgba(255,255,255,.13)!important; }
.sidebar .logout > a { background:rgba(220,53,69,.12)!important; color:#ffdfe2!important; border-color:rgba(255,120,130,.2)!important; }
.sidebar .logout > a::before { content:"↪"; display:inline-flex; align-items:center; justify-content:center; width:18px; font-size:1.1rem; font-weight:800; }
.sidebar .logout > a:hover { background:#dc3545!important; color:#fff!important; }
/* Make the main content flexible rather than forcing the whole document wider. */
main, .main-content, .content, .dashboard-content, .page-content, .container { min-width:0; max-width:100%; }
body { overflow-x:hidden; }
/* Consistent cards, panels, headings and controls across all pages. */
.card,.stat-card,.summary-card,.dashboard-card,.content-card,.panel,.section-card,.form-card,.table-card {
  border:1px solid var(--sa-border)!important; border-radius:var(--sa-radius)!important;
  background:var(--sa-surface)!important; box-shadow:var(--sa-shadow)!important;
}
button,.btn,input[type=submit],input[type=button],a.button { border-radius:10px; font-weight:650; }
button:not(.btn-danger):not(.danger),.btn-primary,button.primary,.primary-btn,input[type=submit] { border-color:var(--sa-blue); }
.btn-primary,button.primary,.primary-btn { background:var(--sa-blue)!important; color:#fff!important; }
.btn-primary:hover,button.primary:hover,.primary-btn:hover { background:var(--sa-blue-hover)!important; }
input:not([type=checkbox]):not([type=radio]):not([type=submit]):not([type=button]),select,textarea {
  max-width:100%; border:1px solid #d5dfed; border-radius:10px; color:var(--sa-text); background:#fff;
}
input:focus,select:focus,textarea:focus { outline:none; border-color:var(--sa-blue); box-shadow:0 0 0 3px rgba(36,99,235,.11); }
table { width:100%; border-collapse:separate; border-spacing:0; background:#fff; border:1px solid var(--sa-border); border-radius:12px; }
th { background:#f3f6fb; color:#415777; font-size:.75rem; font-weight:750; letter-spacing:.035em; }
th,td { padding:12px 14px; border-bottom:1px solid #edf1f7; vertical-align:middle; }
tbody tr:last-child td { border-bottom:0; }
tbody tr:hover { background:#f8fbff; }
/* Tables scroll inside their own region when columns genuinely need extra width. */
.table-responsive,.table-container,.table-wrapper,.table-scroll,.responsive-table,.overflow-x-auto {
  max-width:100%!important; min-width:0!important; overflow-x:auto!important; overscroll-behavior-x:contain;
  scrollbar-width:thin; scrollbar-color:#a9b8cc #edf2f8;
}
.table-responsive table,.table-container table,.table-wrapper table,.table-scroll table,.responsive-table table { min-width:760px; }
@media (max-width: 900px) {
  .sidebar { width:240px!important; min-width:240px!important; max-width:240px!important; flex-basis:240px!important; }
  .sidebar .system-title { font-size:1.05rem!important; }
}
@media (max-width: 680px) {
  .sidebar { position:relative!important; top:auto!important; width:100%!important; min-width:0!important; max-width:none!important; height:auto!important; max-height:none!important; flex:0 0 auto!important; }
  .sidebar .sidebar-menu { display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .sidebar .sidebar-menu > a { min-height:42px!important; }
  .sidebar .system-subtitle { max-width:440px; }
  .table-responsive table,.table-container table,.table-wrapper table,.table-scroll table,.responsive-table table { min-width:700px; }
}
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; animation:none!important; } }


/* Authentication and registration pages: align with the admin/tenant navy-blue brand. */
.auth-brand-logo { display:flex; justify-content:center; align-items:center; margin:0 auto 14px; }
.auth-brand-logo img { display:block; width:82px; height:82px; object-fit:contain; border-radius:50%; border:2px solid rgba(255,255,255,.9); box-shadow:0 8px 22px rgba(8,32,66,.2); }
body:has(.login-card), body:has(.registration-card), body:has(.page > .card) {
  background:linear-gradient(135deg,#0b2242 0%,#153963 48%,#edf3fb 48%,#f3f7fc 100%)!important;
  color:var(--sa-text);
}
.page { min-height:100vh; padding:32px 18px; display:flex; align-items:center; justify-content:center; }
.login-card, .registration-card, .page > .card {
  border:1px solid rgba(220,231,245,.95)!important; border-radius:22px!important;
  background:#fff!important; box-shadow:0 24px 65px rgba(5,28,60,.2)!important;
  overflow:hidden;
}
.login-card .system-title, .registration-card .system-title, .page > .card .system-title {
  color:#102b50!important; font-size:clamp(1.3rem,2vw,1.75rem)!important;
  font-weight:800!important; letter-spacing:-.035em!important; text-align:center;
}
.login-card .system-subtitle, .registration-card .system-subtitle, .page > .card .system-subtitle {
  color:#647797!important; text-align:center; line-height:1.55;
}
.login-title, .title { color:#102b50!important; font-weight:800!important; }
.login-card .footer, .page > .card .footer, .auth-page-footer {
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px;
  margin-top:22px; padding-top:16px; border-top:1px solid #e1e9f3;
  color:#647797!important; font-size:.78rem!important; text-align:center;
}
.developer-credit, .auth-page-footer span { display:block; color:#647797; }
.developer-credit strong, .auth-page-footer strong { color:#102b50; font-weight:750; }
.login-card button[type=submit], .registration-card button[type=submit], .page > .card button[type=submit],
.login-card input[type=submit], .registration-card input[type=submit] {
  background:#2463eb!important; color:#fff!important; border:1px solid #2463eb!important;
  border-radius:11px!important; font-weight:700!important;
}
.login-card button[type=submit]:hover, .registration-card button[type=submit]:hover { background:#1e50c8!important; }
.login-card a, .registration-card a, .page > .card a { color:#2463eb; }
@media(max-width:600px){
  body:has(.login-card), body:has(.registration-card), body:has(.page > .card) { background:#f3f7fc!important; }
  .page { padding:18px 12px; }
  .auth-brand-logo img { width:70px; height:70px; }
}


/* Registration pending/rejected screens — match the branded authentication pages */
body:has(.status-card) {
  min-height:100vh;
  background:linear-gradient(135deg,#eaf1fb 0%,#f4f7fc 55%,#e8eff9 100%) !important;
  color:var(--sa-text);
}
body:has(.status-card) .page {
  min-height:calc(100vh - 64px);
  padding:36px 18px;
}
body:has(.status-card) .status-card {
  width:min(100%,560px);
  padding:clamp(25px,4vw,40px);
  border:1px solid var(--sa-border);
  border-radius:20px;
  background:rgba(255,255,255,.97);
  box-shadow:0 18px 48px rgba(16,43,80,.12);
}
body:has(.status-card) .auth-brand-logo {display:flex;justify-content:center;align-items:center;margin:0 auto 14px}
body:has(.status-card) .auth-brand-logo img {width:82px;height:82px;object-fit:contain;border-radius:50%;border:2px solid #fff;box-shadow:0 8px 22px rgba(8,32,66,.2)}
body:has(.status-card) .system-title {font-size:clamp(1.3rem,3vw,1.65rem);font-weight:800;letter-spacing:-.03em;color:var(--sa-navy);margin-bottom:8px}
body:has(.status-card) .system-subtitle {color:var(--sa-muted);font-size:.9rem;line-height:1.6;margin-bottom:25px}
body:has(.status-card) .status-title {color:var(--sa-navy);font-weight:800;letter-spacing:-.02em}
body:has(.status-card) .status-message {color:#5e708b;font-size:.94rem;line-height:1.7}
body:has(.status-card) .pending-icon {background:#fff4d8;color:#b76a00;border:1px solid #ffe3a3}
body:has(.status-card) .rejected-icon {background:#ffeaec;color:#c52d3b;border:1px solid #ffd1d6}
body:has(.status-card) .reason-box {border-radius:12px;border-color:#ffd3d7;background:#fff5f5;color:#8f2731;overflow-wrap:anywhere}
body:has(.status-card) .login-button {background:linear-gradient(135deg,#3478f6,#1e55cf);border-radius:11px;box-shadow:0 8px 18px rgba(36,99,235,.2)}
body:has(.status-card) .login-button:hover {background:#1e50c8;transform:translateY(-1px)}
body:has(.status-card) .auth-page-footer {padding:16px 12px 22px;text-align:center;color:#647797;font-size:.8rem}
body:has(.status-card) .auth-page-footer span {display:block;margin-top:3px}
@media(max-width:600px){body:has(.status-card) .page{padding:24px 12px}body:has(.status-card) .auth-brand-logo img{width:72px;height:72px}}