@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap";
:root{--bg:#f5f7fb;--surface:#fff;--ink:#172033;--muted:#7b8497;--line:#e7eaf1;--accent:#315efb;--accent-soft:#edf1ff}*{box-sizing:border-box}body{background:var(--bg);color:var(--ink);margin:0;font-family:Inter,Arial,sans-serif}.shell{min-height:100vh;display:flex}.sidebar{color:#fff;background:#101828;flex-direction:column;width:250px;padding:28px 18px;display:flex}.brand{align-items:center;gap:11px;padding:0 10px 38px;display:flex}.brand-mark{background:#315efb;border-radius:12px;place-items:center;width:42px;height:42px;font-weight:800;display:grid}.brand strong{font-size:15px;display:block}.brand small{color:#9ca8bf;margin-top:4px;font-size:11px;display:block}nav{gap:7px;display:grid}nav a{color:#aeb8ca;border-radius:9px;padding:13px 14px;font-size:13px;font-weight:500;text-decoration:none}nav a.active,nav a:hover{color:#fff;background:#24324b}.sidebar-footer{color:#69768e;margin-top:auto;padding:12px 10px;font-size:11px}.content{flex:1;max-width:1500px;padding:42px 48px}.topbar{justify-content:space-between;align-items:flex-start;gap:20px;display:flex}.topbar-actions{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.eyebrow{letter-spacing:1.4px;color:#8b95a8;margin:0 0 10px;font-size:10px;font-weight:800}.topbar h1{letter-spacing:-1px;margin:0 0 9px;font-size:29px}.muted{color:var(--muted);font-size:13px;line-height:1.7}.primary,.secondary{cursor:pointer;border:0;border-radius:9px;align-items:center;gap:8px;padding:12px 16px;font-size:12px;font-weight:600;text-decoration:none;display:flex}.primary{background:var(--accent);color:#fff;box-shadow:0 5px 15px #315efb25}.secondary{background:var(--accent-soft);color:var(--accent);margin-top:20px}.topbar-actions .secondary{margin-top:0}.primary:disabled,.secondary:disabled{opacity:.6;cursor:wait}.metrics{grid-template-columns:repeat(4,1fr);gap:17px;margin:36px 0 24px;display:grid}.metric,.card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:22px;box-shadow:0 3px 15px #17203305}.metric-icon{background:var(--accent-soft);width:38px;height:38px;color:var(--accent);border-radius:10px;place-items:center;margin-bottom:18px;display:grid}.metric p{color:var(--muted);margin:0 0 10px;font-size:12px}.metric h2{letter-spacing:-.8px;margin:0 0 8px;font-size:26px}.metric small{color:#a0a8b7;font-size:11px}.grid-two{grid-template-columns:1fr 1fr;gap:24px;display:grid}.card-heading{justify-content:space-between;align-items:flex-start;gap:20px;display:flex}.card h3{letter-spacing:-.4px;margin:0 0 12px;font-size:17px}.empty{color:#9aa3b4;text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:8px;min-height:170px;display:flex}.empty strong{color:#59657a;font-size:13px}.empty span{font-size:12px}.notice{border-radius:10px;align-items:center;gap:10px;margin:24px 0;padding:13px 16px;font-size:13px;display:flex}.notice.success{color:#207442;background:#eaf8ef}.notice.error{color:#b42318;background:#fff0f0}.upload-zone{text-align:center;border:1px dashed #cbd4e5;margin:28px 0 24px;padding:42px 20px}.upload-zone h3{margin:16px 0 6px}.upload-zone .muted{margin:0}.document-type-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;max-width:1050px;margin:28px auto 4px;display:grid}.document-type-card{text-align:left;border:1px solid var(--line);min-height:190px;color:var(--ink);cursor:pointer;background:#fff;border-radius:13px;flex-direction:column;align-items:flex-start;gap:9px;padding:18px;transition:border-color .15s,box-shadow .15s,transform .15s;display:flex}.document-type-card:hover{border-color:#9db0ff;transform:translateY(-2px);box-shadow:0 6px 18px #315efb18}.document-type-card.selected{border:2px solid var(--accent);background:var(--accent-soft);padding:17px;box-shadow:0 6px 18px #315efb20}.document-type-card:disabled{opacity:.6;cursor:wait;transform:none}.document-type-icon{background:var(--accent-soft);width:46px;height:46px;color:var(--accent);border-radius:12px;place-items:center;display:grid}.document-type-card.selected .document-type-icon{background:var(--accent);color:#fff}.document-type-card strong{letter-spacing:-.2px;font-size:14px}.document-type-card>span:not(.document-type-icon):not(.document-type-check){color:var(--muted);font-size:11px;line-height:1.6}.document-type-check{color:var(--accent);margin-top:auto;font-size:11px;font-weight:700}.count{background:var(--accent-soft);color:var(--accent);border-radius:20px;justify-content:center;align-items:center;margin-left:5px;padding:4px 8px;font-size:11px;display:inline-flex}.search-box{border:1px solid var(--line);color:var(--muted);border-radius:8px;align-items:center;gap:8px;padding:9px 11px;display:flex}.search-box input{font:inherit;border:0;outline:0;width:160px;font-size:12px}.document-list{display:grid}.document-row{border-top:1px solid var(--line);color:inherit;cursor:pointer;align-items:center;gap:13px;padding:15px 0;text-decoration:none;display:flex}.document-icon{background:var(--accent-soft);width:42px;height:42px;color:var(--accent);border-radius:10px;place-items:center;display:grid}.document-info{flex-direction:column;flex:1;gap:5px;min-width:0;display:flex}.document-info strong{text-overflow:ellipsis;white-space:nowrap;font-size:13px;overflow:hidden}.document-info span{color:var(--muted);font-size:11px}.status{border-radius:20px;padding:6px 9px;font-size:11px;font-weight:600}.status.procesando{color:#315efb;background:#edf1ff}.status.revisar{color:#9a6700;background:#fff5df}.status.validado{color:#207442;background:#eaf8ef}.status.error,.status.rechazado{color:#b42318;background:#fff0f0}.spin{animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.back-link{color:var(--accent);align-items:center;gap:6px;margin-bottom:18px;font-size:13px;font-weight:600;display:inline-flex}.review-card{margin-top:24px}.field-label{color:var(--ink);flex-direction:column;gap:8px;margin-top:18px;font-size:13px;font-weight:600;display:flex}.review-input{border:1px solid var(--line);width:100%;color:var(--ink);font:inherit;background:#fff;border-radius:9px;outline:none;padding:12px 13px;font-size:13px}.review-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px #315efb18}.extraction-row{border-top:1px solid var(--line);grid-template-columns:minmax(220px,.8fr) minmax(0,1.5fr);align-items:center;gap:18px;padding:17px 0;display:grid}.extraction-row strong{font-size:13px;display:block}.extraction-row small{color:var(--muted);margin-top:6px;font-size:11px;display:block}.review-card>.eyebrow{margin-bottom:10px}@media (max-width:1100px){.document-type-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:900px){.sidebar{width:210px}.content{padding:28px}.metrics{grid-template-columns:repeat(2,1fr)}}@media (max-width:600px){.sidebar{display:none}.content{padding:22px}.topbar{display:block}.topbar-actions{margin-top:20px}.primary{margin-top:0}.metrics,.grid-two,.document-type-grid,.extraction-row{grid-template-columns:1fr}.card-heading{display:block}.search-box{margin-top:15px}.document-row{flex-wrap:wrap;align-items:flex-start}.status{margin-left:55px}}