/* QistWay customer portal + login (works with any theme; matches the QistWay theme) */
.qwc-login, .qwc-portal { --navy:#12357A; --teal:#087A6B; --teal-tint:#E3F5F1; --ink:#0B1A3A; --line:#E2E6EE; --muted:#4B5568; --bg:#F6F8FB; font-family:'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', sans-serif; color:var(--ink); }
.qwc-login *, .qwc-portal * { box-sizing:border-box; }
.qwc-muted { color:var(--muted); }
.qwc-small { font-size:13px; }
.qwc-center { text-align:center; }
.qwc-h1 { font-size:clamp(24px,3vw,30px); font-weight:800; letter-spacing:-.02em; margin:0 0 16px; line-height:1.2; }
.qwc-h2 { font-size:18px; font-weight:800; margin:24px 0 12px; }
.qwc-card .qwc-h2:first-child { margin-top:0; }

.qwc-btn { display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:11px 20px; border-radius:10px; font-weight:800; font-size:15px; text-decoration:none; border:1px solid transparent; cursor:pointer; }
.qwc-btn--primary { background:var(--teal); color:#fff !important; }
.qwc-btn--primary:hover { background:#066557; }
.qwc-btn--outline { background:#fff; color:var(--navy) !important; border-color:var(--navy); }

.qwc-alert { border-radius:10px; padding:12px 14px; font-weight:600; margin:0 0 16px; }
.qwc-alert--ok { background:var(--teal-tint); color:#0A5A50; }
.qwc-alert--error { background:#FDECEC; color:#8A1C1C; }

.qwc-form { display:flex; flex-direction:column; gap:14px; }
.qwc-form label { display:flex; flex-direction:column; gap:6px; font-size:14px; font-weight:600; }
.qwc-form input, .qwc-form select { padding:12px 14px; border:1px solid #C9D0DC; border-radius:10px; font-size:15px; background:#fff; color:var(--ink); font-family:inherit; width:100%; }
.qwc-form input[disabled] { background:var(--bg); color:var(--muted); }
.qwc-form .qwc-check { flex-direction:row; align-items:center; gap:8px; font-weight:500; }
.qwc-form .qwc-check input { width:18px; height:18px; }
.qwc-form__grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:14px; }
.qwc-full { grid-column:1 / -1; }
.qwc-otp { font-size:26px !important; letter-spacing:10px; text-align:center; font-weight:800; }

/* Login */
.qwc-login { display:flex; justify-content:center; padding:24px 0 48px; }
.qwc-login__card { width:100%; max-width:440px; background:#fff; border:1px solid var(--line); border-radius:20px; padding:clamp(22px,4vw,36px); box-shadow:0 20px 40px rgba(11,26,58,.06); }
.qwc-login__card h2 { margin:0 0 6px; font-size:26px; font-weight:800; letter-spacing:-.02em; }
.qwc-login__card > p { margin:12px 0 0; }
.qwc-login__card .qwc-form { margin-top:18px; }
.qwc-login__foot { border-top:1px solid var(--line); padding-top:18px; margin-top:20px; font-size:14px; color:var(--muted); display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:10px; }

/* Portal layout */
.qwc-portal { display:flex; flex-wrap:wrap; gap:24px; align-items:flex-start; padding:24px 0 48px; }
.qwc-portal__nav { flex:1 1 220px; max-width:100%; background:#fff; border:1px solid var(--line); border-radius:16px; padding:12px; }
.qwc-portal__nav ul { list-style:none; margin:8px 0 0; padding:0; display:flex; flex-direction:column; gap:2px; }
.qwc-portal__nav a { display:flex; min-height:44px; align-items:center; padding:10px 14px; border-radius:10px; text-decoration:none; color:var(--ink); font-weight:700; font-size:15px; }
.qwc-portal__nav a:hover { background:var(--bg); }
.qwc-portal__nav a[aria-current="page"] { background:var(--navy); color:#fff; }
.qwc-portal__me { display:flex; align-items:center; gap:10px; padding:6px 8px 12px; border-bottom:1px solid var(--line); }
.qwc-portal__me strong { display:block; font-size:15px; }
.qwc-portal__me small { display:block; color:var(--muted); font-size:12px; }
.qwc-avatar { width:40px; height:40px; border-radius:999px; background:var(--navy); color:#fff; font-weight:800; display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.qwc-portal__main { flex:999 1 600px; min-width:0; }
@media (max-width:700px) { .qwc-portal__nav ul { flex-direction:row; flex-wrap:wrap; } .qwc-portal__nav a { padding:8px 12px; font-size:14px; } }

.qwc-card { background:#fff; border:1px solid var(--line); border-radius:16px; padding:20px; margin-bottom:16px; display:block; }
.qwc-card--teal { background:var(--teal-tint); border-color:transparent; }
.qwc-head { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-start; gap:12px; margin-bottom:8px; }
.qwc-head .qwc-h1 { margin-bottom:4px; }
.qwc-head p { margin:0; }

.qwc-next { background:var(--navy); color:#fff; border-radius:18px; padding:24px; display:flex; flex-wrap:wrap; gap:18px; align-items:center; justify-content:space-between; margin-bottom:16px; }
.qwc-next > div { display:flex; flex-direction:column; gap:4px; }
.qwc-next--late { background:#7A1F1F; }
.qwc-eyebrow { font-size:12px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:#B9C8E6; }
.qwc-next__amount { font-size:40px; font-weight:800; letter-spacing:-.02em; color:#3FD4B8; line-height:1.1; }
.qwc-next--late .qwc-next__amount { color:#fff; }
.qwc-next__meta { color:#D3DDF0; font-size:15px; }
.qwc-next__meta strong { color:#fff; }

.qwc-stats { display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:14px; margin-bottom:16px; }
.qwc-stat { background:#fff; border:1px solid var(--line); border-radius:14px; padding:16px; display:flex; flex-direction:column; gap:6px; }
.qwc-stat span { font-size:13px; font-weight:700; color:var(--muted); }
.qwc-stat strong { font-size:22px; font-weight:800; }
.qwc-stat--teal { background:var(--teal-tint); border-color:transparent; }
.qwc-stat--teal strong { color:#0A5A50; }
.qwc-bar { height:10px; background:var(--line); border-radius:999px; overflow:hidden; }
.qwc-bar i { display:block; height:100%; background:var(--teal); border-radius:999px; }

.qwc-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:12px; }
.qwc-contract { display:flex; flex-direction:column; gap:6px; text-decoration:none; color:var(--ink); margin:0; }
.qwc-contract:hover { border-color:var(--navy); }
.qwc-contract__top { display:flex; justify-content:space-between; align-items:center; gap:8px; }
.qwc-contract small { color:var(--muted); font-weight:700; }

.qwc-actions { display:flex; flex-wrap:wrap; gap:10px; margin:0 0 16px; }
.qwc-table-wrap { overflow-x:auto; border:1px solid var(--line); border-radius:12px; background:#fff; }
.qwc-table { width:100%; border-collapse:collapse; font-size:14px; min-width:620px; margin:0; }
.qwc-table th { background:var(--bg); text-align:left; padding:12px 14px; font-weight:700; color:var(--muted); border:0; }
.qwc-table td { padding:12px 14px; border:0; border-top:1px solid var(--line); vertical-align:top; }
.qwc-table small { color:var(--muted); }

.qwc-badge { display:inline-block; white-space:nowrap; font-size:12px; font-weight:800; padding:3px 10px; border-radius:999px; background:#F0F3F8; color:var(--muted); }
.qwc-badge--paid, .qwc-badge--completed, .qwc-badge--verified, .qwc-badge--confirmed { background:var(--teal-tint); color:#0A5A50; }
.qwc-badge--active, .qwc-badge--due { background:#EEF2FA; color:var(--navy); }
.qwc-badge--overdue, .qwc-badge--rejected, .qwc-badge--defaulted { background:#FDECEC; color:#8A1C1C; }
.qwc-badge--pending, .qwc-badge--pending_advance, .qwc-badge--partial { background:#FFF4E0; color:#7A4B00; }

.qwc-pay { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:16px; align-items:start; }
.qwc-accounts { margin:0 0 12px; padding-left:18px; }
.qwc-accounts li { margin:6px 0; }
.qwc-big { font-size:24px; color:var(--navy); }
.qwc-list { list-style:none; margin:0; padding:0; }
.qwc-list li { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:10px 0; border-top:1px solid var(--line); }
.qwc-list li:first-child { border-top:0; }

/* Customer / Staff tabs */
.qwc-tabs { display:flex; gap:4px; padding:4px; background:#F0F3F8; border-radius:12px; margin:0 0 20px; }
.qwc-tab { flex:1; min-height:44px; display:flex; align-items:center; justify-content:center; border-radius:9px; font-weight:700; font-size:15px; text-decoration:none; color:#566074; }
.qwc-tab.is-on { background:#fff; color:var(--ink); box-shadow:0 1px 3px rgba(11,26,58,.12); }
.qwc-tab:focus-visible { outline:2px solid #3FD4B8; outline-offset:2px; }
.qwc-alert--info { background:#EEF2FA; color:var(--navy); }
.qwc-btn--navy { background:var(--navy); color:#fff !important; }
.qwc-btn--navy:hover { background:#0B1F4F; }
.qwc-hp { position:absolute; left:-9999px; }
/* Overview quick actions + empty states */
.qwc-quick { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:10px; margin:18px 0 8px; }
.qwc-quick__item { display:flex; flex-direction:column; gap:2px; padding:14px 16px; background:#fff; border:1px solid #E2E6EE; border-radius:12px; text-decoration:none; color:#0B1A3A; min-height:44px; }
.qwc-quick__item:hover, .qwc-quick__item:focus-visible { border-color:#12357A; color:#0B1A3A; }
.qwc-quick__item strong { font-size:15px; }
.qwc-quick__item small { color:#566074; font-size:13px; }
.qwc-empty { background:#F6F8FB; border-style:dashed; color:#4B5568; }
.qwc-empty p:last-child { margin-bottom:0; }
.qwc-next--calm { background:#EEF2FA; color:#0B1A3A; }
.qwc-next--calm .qwc-next__amount, .qwc-next--calm .qwc-eyebrow { color:#12357A; }
.qwc-next--calm .qwc-next__meta { color:#4B5568; }
.qwc-nav-cta { color:#087A6B !important; font-weight:800; }
/* Google + email sign-in */
.qwc-social { display:flex; flex-direction:column; align-items:stretch; gap:10px; margin:14px 0 6px; }
.qwc-google { display:flex; justify-content:center; min-height:44px; }
.qwc-btn--email { display:flex; align-items:center; justify-content:center; gap:10px; width:100%; min-height:44px; border-radius:999px; }
.qwc-or { display:flex; align-items:center; gap:12px; color:#566074; font-size:13px; margin:6px 0 2px; }
.qwc-or::before, .qwc-or::after { content:''; flex:1; height:1px; background:#E2E6EE; }
