/* Goa VAT e-Services — ported verbatim from the design mockups so the app matches pixel-for-pixel. */
:root{
  --navy:#0B3554;--navy-deep:#072338;--azulejo:#1E6FA8;--azulejo-light:#EAF3FA;
  --laterite:#C1553B;--sand:#F4F5F7;--ink:#1C2833;--muted:#5C6B78;--line:#DDE4E9;
  --white:#fff;--gold:#E8B23A;--green:#1E7A4C;--green-bg:#E6F4EC;--red:#B3261E;--red-bg:#FBEAE9;
  --amber:#9A6B00;--amber-bg:#FBF3DC;--radius:10px;--shadow:0 2px 8px rgba(11,53,84,.07);
}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:"Segoe UI",Arial,sans-serif;background:var(--sand);color:var(--ink);font-size:14px;line-height:1.5}
a{color:var(--azulejo);text-decoration:none}a:hover{text-decoration:underline}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.app{display:flex;min-height:100vh}
.sidebar{width:236px;background:var(--navy-deep);color:#c8d9e6;flex:none;display:flex;flex-direction:column;position:sticky;top:0;height:100vh}
.sb-brand{display:flex;gap:10px;align-items:center;padding:16px 16px 14px;border-bottom:1px solid rgba(255,255,255,.1)}
.sb-brand svg{width:36px;height:36px;flex:none}
.sb-brand .t1{font-weight:700;color:#fff;font-size:14px;line-height:1.2}
.sb-brand .t2{font-size:10.5px;color:#8fb0c7}
.sb-role{margin:12px 14px 4px;font-size:10.5px;letter-spacing:1px;color:#7d9cb5;text-transform:uppercase}
.sb-nav{list-style:none;padding:4px 8px;flex:1;overflow-y:auto}
.sb-nav a{display:flex;gap:10px;align-items:center;color:#c8d9e6;padding:10px 12px;border-radius:8px;font-size:13.5px;margin-bottom:2px}
.sb-nav a:hover{background:rgba(255,255,255,.08);text-decoration:none}
.sb-nav a.on{background:var(--azulejo);color:#fff;font-weight:600}
.sb-nav .ico{width:18px;text-align:center;flex:none}
.sb-foot{padding:12px 16px;border-top:1px solid rgba(255,255,255,.1);font-size:11.5px;color:#7d9cb5}
.main{flex:1;display:flex;flex-direction:column;min-width:0}
.topbar{background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:16px;padding:10px 22px;position:sticky;top:0;z-index:50}
.topbar h1{font-size:17px;color:var(--navy)}
.topbar .crumb{font-size:12px;color:var(--muted)}
.topbar .spacer{flex:1}
.user{display:flex;gap:10px;align-items:center}
.avatar{width:36px;height:36px;border-radius:50%;background:var(--azulejo);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px}
.user .un{font-size:13px;font-weight:600;line-height:1.2}
.user .ur{font-size:11px;color:var(--muted)}
.content{padding:22px;max-width:1280px;width:100%}
.grid{display:grid;gap:16px}
.g4{grid-template-columns:repeat(4,1fr)}.g3{grid-template-columns:repeat(3,1fr)}
.g2{grid-template-columns:repeat(2,1fr)}.g21{grid-template-columns:2fr 1fr}.g12{grid-template-columns:1fr 2fr}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.card .chead{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid var(--line);gap:10px;flex-wrap:wrap}
.card .chead h2{font-size:14.5px;color:var(--navy)}
.card .cbody{padding:18px}
.card .cfoot{padding:10px 18px;border-top:1px solid var(--line);font-size:12.5px;text-align:right;background:#FAFBFC;border-radius:0 0 var(--radius) var(--radius)}
.kpi{padding:16px 18px;cursor:default}
.kpi .kl{font-size:12px;color:var(--muted)}
.kpi .kv{font-size:24px;font-weight:700;color:var(--navy);margin:4px 0 2px}
.kpi .kd{font-size:11.5px}
.kpi .up{color:var(--green)}.kpi .down{color:var(--red)}
.kpi.accent{border-top:3px solid var(--azulejo)}.kpi.warn{border-top:3px solid var(--laterite)}
.kpi.ok{border-top:3px solid var(--green)}.kpi.gold{border-top:3px solid var(--gold)}
.badge{display:inline-block;font-size:11px;font-weight:700;border-radius:20px;padding:3px 10px;white-space:nowrap}
.b-ok{background:var(--green-bg);color:var(--green)}.b-warn{background:var(--amber-bg);color:var(--amber)}
.b-due{background:var(--red-bg);color:var(--red)}.b-info{background:var(--azulejo-light);color:var(--azulejo)}
.b-mut{background:#EDEFF2;color:var(--muted)}
table{width:100%;border-collapse:collapse;font-size:13px}
th{background:#F4F7FA;color:var(--navy);text-align:left;padding:10px 14px;font-size:11.5px;text-transform:uppercase;letter-spacing:.4px;border-bottom:1px solid var(--line);white-space:nowrap;user-select:none}
th.sortable{cursor:pointer}
th.sortable:hover{background:#E8EFF5}
th .arr{font-size:10px;color:var(--azulejo);margin-left:4px}
td{padding:11px 14px;border-bottom:1px solid #EEF1F4;vertical-align:middle}
tr:hover td{background:#FAFCFE}
td .sub{display:block;font-size:11.5px;color:var(--muted)}
.tnum{text-align:right;font-variant-numeric:tabular-nums}
th.tnum{text-align:right}
mark{background:#FDEFB8;border-radius:3px;padding:0 1px}
.btn{display:inline-block;border-radius:8px;padding:8px 16px;font-weight:600;font-size:13px;cursor:pointer;border:none;font-family:inherit}
.btn-p{background:var(--navy);color:#fff}.btn-p:hover{background:var(--azulejo);text-decoration:none}
.btn-a{background:var(--laterite);color:#fff}.btn-a:hover{background:#A8462F;text-decoration:none}
.btn-o{background:#fff;color:var(--navy);border:1.5px solid var(--line)}.btn-o:hover{border-color:var(--azulejo);text-decoration:none}
.btn-s{padding:5px 12px;font-size:12px}
.btn:disabled{opacity:.55;cursor:not-allowed}
.field label{display:block;font-size:12.5px;font-weight:600;margin-bottom:5px;color:var(--navy)}
.field input,.field select,.field textarea{width:100%;padding:9px 12px;border:1.5px solid var(--line);border-radius:8px;font-size:13.5px;background:#fff;font-family:inherit}
.field input:focus,.field select:focus{border-color:var(--azulejo)}
.field{margin-bottom:14px}
.filters{display:flex;gap:10px;flex-wrap:wrap;padding:14px 18px;border-bottom:1px solid var(--line);align-items:end}
.filters .field{margin:0}
.count-pill{font-size:12px;color:var(--muted);align-self:center}
.tlist{list-style:none}
.tlist li{display:flex;gap:12px;padding:10px 0;border-bottom:1px dashed var(--line);font-size:13px;align-items:baseline}
.tlist li:last-child{border:none}
.tlist .d{flex:none;font-size:11px;font-weight:700;color:var(--laterite);background:#FBEFEA;border-radius:6px;padding:2px 8px}
.prog{height:8px;background:#EDEFF2;border-radius:6px;overflow:hidden}
.prog i{display:block;height:100%;background:var(--green);border-radius:6px}
.mt{margin-top:16px}.mb{margin-bottom:16px}
.muted{color:var(--muted)}.small{font-size:12px}
.alertbar{background:var(--amber-bg);border:1px solid #EAD9A8;color:#6b4c00;border-radius:var(--radius);padding:12px 16px;font-size:13px;display:flex;gap:10px;align-items:center;margin-bottom:16px}
.seg{display:inline-flex;border:1.5px solid var(--line);border-radius:9px;overflow:hidden}
.seg button{border:none;background:#fff;padding:8px 16px;font-size:12.5px;font-weight:600;color:var(--muted);cursor:pointer;font-family:inherit}
.seg button.on{background:var(--navy);color:#fff}
.chart-wrap{position:relative}
.chart-wrap svg{display:block;width:100%;height:auto}
#tip{position:fixed;pointer-events:none;background:var(--navy-deep);color:#fff;font-size:12px;padding:6px 10px;border-radius:6px;z-index:999;box-shadow:0 4px 14px rgba(0,0,0,.3);white-space:nowrap}
#tip b{color:var(--gold)}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;margin-top:10px}
.legend span{display:flex;gap:6px;align-items:center}
.legend i{width:11px;height:11px;border-radius:3px;display:inline-block}
.drillnote{font-size:12px;color:var(--azulejo);margin-top:8px}
.crumb-drill{font-size:12.5px;margin-bottom:10px}
.crumb-drill a{cursor:pointer}
@media(max-width:1000px){.g4{grid-template-columns:repeat(2,1fr)}.g3,.g2,.g21,.g12{grid-template-columns:1fr}.sidebar{width:200px}}
@media(max-width:640px){.app{flex-direction:column}.sidebar{width:100%;height:auto;position:static}.g4{grid-template-columns:1fr}}

.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--navy) 0%,var(--azulejo) 100%);padding:24px}
.login-box{background:#fff;border-radius:16px;box-shadow:0 12px 40px rgba(0,0,0,.25);width:420px;max-width:100%;overflow:hidden}
.login-hd{padding:22px 26px 0;text-align:center}
.login-hd svg{width:56px;height:56px}
.login-hd h1{font-size:18px;color:var(--navy);margin-top:8px}
.login-hd p{font-size:12.5px;color:var(--muted)}
.roletabs{display:flex;margin:18px 26px 0;border:1.5px solid var(--line);border-radius:10px;overflow:hidden}
.roletabs button{flex:1;border:none;background:#fff;padding:10px;font-size:13px;font-weight:600;color:var(--muted);cursor:pointer;font-family:inherit}
.roletabs button.on{background:var(--navy);color:#fff}
.login-bd{padding:20px 26px 26px}
.cap{display:flex;gap:10px;align-items:center}
.cap .code{flex:none;background:var(--azulejo-light);border:1px dashed var(--azulejo);border-radius:8px;padding:8px 14px;font-weight:700;letter-spacing:4px;color:var(--navy);font-style:italic}
.login-err{background:var(--red-bg);color:var(--red);border-radius:8px;padding:10px 14px;font-size:12.5px;margin-bottom:14px}
.login-hint{background:var(--azulejo-light);color:var(--navy);border-radius:8px;padding:10px 14px;font-size:12px;margin-top:14px}

/* App-loading splash */
.app-loading{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:linear-gradient(135deg,var(--navy) 0%,var(--azulejo) 100%);color:#fff}
.app-loading-spinner{width:42px;height:42px;border:4px solid rgba(255,255,255,.3);border-top-color:var(--gold);border-radius:50%;animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* Toasts */
.toast-host{position:fixed;right:20px;bottom:20px;z-index:1000;display:flex;flex-direction:column;gap:8px}
.toast{background:var(--navy-deep);color:#fff;border-radius:8px;padding:12px 18px;font-size:13px;box-shadow:0 6px 20px rgba(0,0,0,.3);max-width:380px}
.toast.ok{border-left:4px solid var(--green)}
.toast.err{border-left:4px solid var(--red)}

/* Modal */
.modal-back{position:fixed;inset:0;background:rgba(7,35,56,.55);z-index:200;display:flex;align-items:flex-start;justify-content:center;padding:40px 16px;overflow-y:auto}
.modal{background:#fff;border-radius:12px;width:560px;max-width:100%;box-shadow:0 16px 48px rgba(0,0,0,.35)}

#blazor-error-ui{display:none;position:fixed;bottom:0;left:0;right:0;background:var(--amber-bg);color:#6b4c00;padding:10px 20px;font-size:13px;z-index:2000}