/* Smart Cubes — Phase 1 styles. Brand colors come from CSS vars set per-operator. */
*{box-sizing:border-box}
body{margin:0;font-family:-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;background:#f4f6fa;color:#16233c}
a{color:var(--brand);text-decoration:none}
a:hover{text-decoration:underline}
.topbar{display:flex;align-items:center;gap:18px;flex-wrap:wrap;background:var(--brand);color:#fff;padding:10px 18px}
.brandmark{font-weight:700;font-size:19px}
.brandmark .cube{color:var(--accent);background:#fff;border-radius:4px;padding:0 5px;margin-right:4px}
.brandmark .opname{font-weight:400;font-size:12px;opacity:.85;margin-left:8px}
.mainnav{display:flex;gap:6px;flex-wrap:wrap}
.mainnav a{color:#dbe4f5;padding:6px 10px;border-radius:6px;font-size:14px}
.mainnav a.on,.mainnav a:hover{background:rgba(255,255,255,.16);color:#fff;text-decoration:none}
.userbox{margin-left:auto;display:flex;align-items:center;gap:12px;font-size:13px;flex-wrap:wrap}
.userbox .logout{color:#fff;border:1px solid rgba(255,255,255,.5);padding:4px 9px;border-radius:6px}
.facswitch select{padding:5px;border-radius:6px;border:0;font-size:13px;max-width:280px}
.wrap{max-width:1220px;margin:0 auto;padding:18px}
.foot{max-width:1220px;margin:0 auto;padding:8px 18px 26px;color:#7a8699;font-size:12px}
h1{font-size:22px;margin:4px 0 12px}
h2{font-size:17px;margin:22px 0 8px}
h3{font-size:15px;margin:14px 0 6px}
.muted{color:#66738a}
.small{font-size:12.5px}
.card{background:#fff;border:1px solid #dde3ec;border-radius:10px;padding:14px 16px;margin:0 0 14px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin:0 0 14px}
.kpi{background:#fff;border:1px solid #dde3ec;border-radius:10px;padding:12px 14px}
.kpi .v{font-size:24px;font-weight:700;color:var(--brand)}
.kpi .l{font-size:12px;color:#66738a;text-transform:uppercase;letter-spacing:.04em}
table{border-collapse:collapse;width:100%;background:#fff}
th,td{border:1px solid #dde3ec;padding:7px 9px;font-size:13.5px;text-align:left;vertical-align:top}
th{background:#eef2f8;color:#33415c}
tr:hover td{background:#f8fafd}
.num{text-align:right;font-variant-numeric:tabular-nums}
.alert{border-radius:8px;padding:10px 14px;margin:0 0 14px;font-size:14px}
.alert.err{background:#fdecec;border:1px solid #f0b8b8;color:#8c1f1f}
.alert.ok{background:#e8f7ec;border:1px solid #a9dcb6;color:#14532d}
.btn{display:inline-block;background:#fff;border:1px solid #b9c4d6;color:#16233c;border-radius:7px;padding:7px 13px;font-size:14px;cursor:pointer}
.btn:hover{text-decoration:none;border-color:var(--brand)}
.btn.primary{background:var(--brand);border-color:var(--brand);color:#fff;font-weight:600}
.btn.accent{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}
.btn.danger{border-color:#c0392b;color:#c0392b}
.btn.small{padding:4px 9px;font-size:12.5px}
form .row{display:flex;gap:12px;flex-wrap:wrap}
label{display:block;font-size:13px;color:#44506a;margin:0 0 10px}
label input,label select,label textarea{display:block;width:100%;margin-top:4px;padding:8px;border:1px solid #b9c4d6;border-radius:7px;font-size:14px;background:#fff;color:#16233c}
label.inline{display:flex;align-items:center;gap:7px}
label.inline input{width:auto;margin:0}
input[type=checkbox],input[type=radio]{width:auto}
.toolbar{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:0 0 12px}
.toolbar input[type=search],.toolbar input[type=text],.toolbar select{padding:8px;border:1px solid #b9c4d6;border-radius:7px;font-size:14px}
.board{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:8px}
.tile{border-radius:9px;padding:9px 10px;font-size:12.5px;border:1px solid #ccd5e3;background:#fff;min-height:74px}
.tile .un{font-weight:700;font-size:15px}
.tile.vacant{background:#e9f7ee;border-color:#a9dcb6}
.tile.occupied{background:#eef2f8}
.tile.delinquent{background:#fdecec;border-color:#f0b8b8}
.tile.overlocked{background:#fff3e0;border-color:#f2c48d}
.tile a{color:inherit}
.badge{display:inline-block;font-size:11px;padding:1px 7px;border-radius:20px;background:#eef2f8;border:1px solid #ccd5e3;color:#44506a}
.badge.red{background:#fdecec;border-color:#f0b8b8;color:#8c1f1f}
.badge.green{background:#e9f7ee;border-color:#a9dcb6;color:#14532d}
.badge.amber{background:#fff3e0;border-color:#f2c48d;color:#7a4a12}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:12.5px;color:#44506a;margin:0 0 10px}
.legend span::before{content:"";display:inline-block;width:11px;height:11px;border-radius:3px;margin-right:5px;border:1px solid #ccd5e3;vertical-align:-1px}
.legend .lg-vacant::before{background:#e9f7ee}
.legend .lg-occupied::before{background:#eef2f8}
.legend .lg-delinq::before{background:#fdecec}
.legend .lg-over::before{background:#fff3e0}
.ledger-neg{color:#8c1f1f}
.ledger-credit{color:#14532d}
.quicknav{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 14px}
.quicknav a{background:#fff;border:1px solid #b9c4d6;border-radius:20px;padding:5px 12px;font-size:13px}
.switchrow{display:flex;gap:8px;align-items:flex-start;padding:6px 0;border-bottom:1px solid #eef2f8;font-size:13.5px}
.switchrow input{margin-top:2px}
.sigline{margin-top:26px;border-top:1px solid #999;padding-top:6px;font-size:12.5px;color:#44506a}
.receipt{max-width:640px;margin:0 auto;background:#fff;border:1px solid #dde3ec;border-radius:10px;padding:22px}
@media print{.topbar,.foot,.noprint{display:none!important}body{background:#fff}.wrap{padding:0}}