/* Branded backend-connected interface — additive to V3's approved brand.css/styles.css */
:root{--ss-blue:#2378c5;--ss-blue-dark:#173d69;--ss-border:#e3ebf2;--ss-ink:#263a53;--ss-muted:#6a8095}
.portal-form{display:grid;gap:12px;max-width:480px}
.portal-form label,.portal-field label{font-size:13px;font-weight:800;color:var(--ss-blue-dark);display:block;margin-bottom:6px}
.portal-form input,.portal-form textarea,.portal-form select,.portal-field input,.portal-field select,.portal-field textarea{width:100%;box-sizing:border-box;border:1px solid #ccdae7;border-radius:11px;padding:11px 13px;background:white;color:#24394c;font-size:15px}
.portal-form input:focus,.portal-field input:focus{outline:2px solid #8dc8f3;outline-offset:1px}
.portal-help{color:var(--ss-muted);font-size:13px;line-height:1.5}
.portal-card{background:white;border:1px solid var(--ss-border);border-radius:15px;padding:20px;box-shadow:0 4px 22px rgba(20,57,87,.04);margin-bottom:14px}
.portal-card h2{font-size:21px;color:var(--ss-blue-dark);margin:0 0 8px}
.portal-card p{margin:0 0 14px;color:var(--ss-muted)}
.portal-button,.portal-button-muted,.portal-button-danger{display:inline-flex;justify-content:center;align-items:center;gap:8px;border:0;border-radius:10px;cursor:pointer;padding:10px 16px;font-size:14px;font-weight:800;line-height:1.3;min-height:42px}
.portal-button{background:var(--ss-blue);color:white}
.portal-button:hover{background:#155a9c}
.portal-button-muted{background:#ebf3fa;color:#27557b}
.portal-button-danger{background:#fff0ee;color:#9f3e31}
.portal-button:disabled,.portal-button-muted:disabled,.portal-button-danger:disabled{opacity:.45;cursor:not-allowed}
.portal-buttons{display:flex;gap:9px;flex-wrap:wrap;align-items:center}
.portal-notice{border-left:3px solid #52a6e9;background:#edf7ff;padding:12px 14px;border-radius:7px;color:#365977;margin:0 0 18px;line-height:1.5}
.portal-warning{border-left-color:#e8ae52;background:#fff7e9;color:#785e36}
.portal-success{border-left-color:#4cb59e;background:#edfaf4;color:#2c7461}
.portal-tabbar{display:flex;gap:6px;flex-wrap:wrap;margin:12px 0 18px}
.portal-tab{background:white;border:1px solid #d6e4ee;border-radius:10px;padding:9px 15px;color:#375a77;cursor:pointer;font-weight:700}
.portal-tab.is-active{background:#eaf5ff;border-color:#61b1e5;color:#1763a1}
.portal-layout2{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:16px;align-items:start}
.portal-cal{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;margin-top:16px}
.portal-weekday{font-size:11px;text-align:center;color:#6c8299;font-weight:800;padding:4px}
.portal-date{height:43px;background:white;border:1px solid #e1eaf2;border-radius:9px;cursor:pointer;font-size:13px;font-weight:800;color:#33516f;position:relative}
.portal-date:hover,.portal-date.selected{background:#dff0ff;border-color:#53a1d8}
.portal-date.included{background:#e9f8f4;border-color:#91d3c2}
.portal-date:disabled{opacity:.3;cursor:default}
.portal-slot{background:white;border:1px solid #ccdfed;padding:9px 14px;border-radius:9px;cursor:pointer;font-size:13px;color:#315775;font-weight:800}
.portal-slot.selected{background:#2478c5;color:white;border-color:#2478c5}
.portal-tags{display:flex;flex-wrap:wrap;gap:7px;margin:12px 0}
.portal-tag{background:#edf6fc;border:1px solid #d1e8f6;padding:6px 10px;border-radius:9px;font-size:12px;color:#345e7c;font-weight:700}
.portal-list{display:grid;gap:9px;margin-top:12px}
.portal-list-row{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;border:1px solid #e2ebf2;border-radius:11px;padding:12px 14px}
.portal-list-row strong{display:block;color:#254463;margin-bottom:3px}
.portal-list-row small{color:#748899}
.portal-item-actions{display:flex;gap:6px;flex-wrap:wrap}
.portal-badge{display:inline-block;background:#eaf3fa;border-radius:100px;padding:5px 10px;color:#356286;font-size:11px;font-weight:800}
.portal-badge.paid,.portal-badge.reviewed{background:#e5f8f0;color:#24795d}
.portal-badge.unpaid{background:#fff2df;color:#896122}
.portal-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:18px}
.portal-stat{background:white;border:1px solid var(--ss-border);padding:14px;border-radius:12px}
.portal-stat span{display:block;font-size:12px;color:#6c859a}
.portal-stat b{display:block;font-size:26px;margin-top:4px;color:#1b6097}
.portal-table{border-collapse:collapse;width:100%;font-size:13px}
.portal-table th,.portal-table td{border-bottom:1px solid #e8eef3;padding:10px 8px;text-align:left}
.portal-table th{color:#57728b;font-size:11px;text-transform:uppercase}
.portal-table-wrap{overflow-x:auto}
.portal-gap{height:12px}
.portal-inline-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.portal-links a{color:#176aac}
.portal-overlay{position:fixed;inset:0;background:#0b274275;display:grid;place-items:center;padding:16px;z-index:50}
.portal-modal{width:min(550px,100%);max-height:90vh;overflow-y:auto;background:white;padding:24px;border-radius:18px;box-shadow:0 16px 60px #102e4770}
.portal-modal h2{margin-top:0;color:#1c4c76}
.portal-steps{font-size:14px;color:#536c83;line-height:1.65}
.portal-auth-wrap{max-width:620px;margin:46px auto}
.portal-auth-wrap h1{font-size:32px;color:#153d68}
.portal-file{display:block;background:#f2f8fc;border:1px dashed #b5d4ea;padding:14px 16px;border-radius:10px;color:#315e80}
.portal-divider{border:0;border-top:1px solid #e3edf3;margin:18px 0}
.portal-secondary-note{font-size:12px;color:#7b8999;margin-top:10px}
@media(max-width:980px){.portal-layout2{grid-template-columns:1fr}}
@media(max-width:600px){.portal-cal{gap:3px}.portal-date{height:39px}.portal-stats{grid-template-columns:1fr 1fr}.portal-list-row{align-items:flex-start}.portal-item-actions{width:100%}}

/* V5 — password authentication, keeping the existing SolidStart branding */
.portal-auth-links{margin-top:12px;text-align:right}
.portal-text-button{border:0;background:none;color:#12639e;text-decoration:underline;font-weight:700;font-size:13px;cursor:pointer;padding:6px 0}
.portal-text-button:focus-visible{outline:2px solid #12639e;outline-offset:3px;border-radius:3px}
