/* Estilos base portados del prototipo Galvaceros Control Tower v23.2 (bloques en su orden original). */

:root{
  --navy:#081522;--navy2:#10283d;--navy3:#173951;--lime:#c9db00;--lime2:#a8bd00;
  --bg:#eef2f5;--card:#fff;--line:#dbe2e8;--text:#142131;--muted:#6c7885;
  --green:#18996b;--amber:#e1a01b;--red:#db5050;--blue:#3b7fe8;--purple:#725dd8;
  --shadow:0 12px 30px rgba(10,26,42,.08);--shadow2:0 24px 65px rgba(9,23,37,.16);
}
*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,Segoe UI,Arial,sans-serif}
button,input,select,textarea{font:inherit}button{cursor:pointer}
.app{display:grid;grid-template-columns:260px minmax(0,1fr);min-height:100vh}
.sidebar{background:linear-gradient(180deg,#071420,#0b1c2b 58%,#0d2030);color:#fff;position:sticky;top:0;height:100vh;overflow:auto;padding:17px 13px;border-right:1px solid rgba(255,255,255,.05)}
.brand{padding:2px 8px 15px;border-bottom:1px solid rgba(255,255,255,.08)}.brand img{width:100%;height:56px;object-fit:contain;object-position:left center}.brand small{display:block;color:#8fa0b1;font-size:9px;letter-spacing:1.35px;margin-top:6px}
.userbox{margin:13px 4px;padding:10px;border-radius:13px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);display:flex;gap:9px;align-items:center}
.avatar{width:36px;height:36px;border-radius:10px;background:var(--lime);color:var(--navy);font-weight:900;display:grid;place-items:center}
.usertxt{flex:1;min-width:0}.usertxt b{display:block;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.usertxt small{font-size:9px;color:#95a4b3}
.navlabel{font-size:8.8px;text-transform:uppercase;letter-spacing:1.35px;color:#65788a;margin:16px 10px 6px}
.nav{width:100%;border:0;background:transparent;color:#d3dbe3;padding:9px 10px;border-radius:9px;display:flex;gap:9px;align-items:center;text-align:left;font-size:10.8px;margin:2px 0}
.nav:hover{background:rgba(255,255,255,.05)}.nav.active{background:linear-gradient(90deg,rgba(201,219,0,.21),rgba(201,219,0,.03));box-shadow:inset 3px 0 0 var(--lime);color:#fff}
.ico{width:26px;height:26px;border-radius:7px;background:#193049;display:grid;place-items:center;font-size:9px;font-weight:900}.nav.active .ico{background:var(--lime);color:var(--navy)}.nav.hidden{display:none}
.main{min-width:0}.topbar{height:68px;position:sticky;top:0;z-index:30;background:rgba(255,255,255,.93);backdrop-filter:blur(10px);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 22px}
.topbar h1{font-size:17px;margin:0}.topbar small{font-size:10px;color:var(--muted)}.topactions{display:flex;gap:7px;align-items:center;flex-wrap:wrap}
.chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:#fff;border-radius:999px;padding:7px 10px;font-size:9.8px}.dot{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px rgba(24,153,107,.12)}
.btn{border:1px solid var(--line);background:#fff;color:var(--text);border-radius:8px;padding:8px 11px;font-size:10.3px;font-weight:760}.btn:hover{box-shadow:0 7px 16px rgba(10,28,45,.10);transform:translateY(-1px)}.btn.dark{background:var(--navy2);color:#fff;border-color:var(--navy2)}.btn.lime{background:var(--lime);border-color:var(--lime2);color:var(--navy);font-weight:900}.btn.red{color:var(--red);border-color:#efc9c9;background:#fff8f8}.btn.blue{color:#fff;background:var(--blue);border-color:var(--blue)}
.content{padding:20px;max-width:1840px;margin:auto}.page{display:none}.page.active{display:block}
.hero{background:radial-gradient(circle at 84% 16%,rgba(201,219,0,.16),transparent 28%),linear-gradient(135deg,#0c1c2b,#173951);color:#fff;border-radius:19px;padding:23px 24px;box-shadow:var(--shadow2);margin-bottom:14px;position:relative;overflow:hidden}
.hero:after{content:"";position:absolute;width:270px;height:270px;border:1px solid rgba(255,255,255,.06);border-radius:50%;right:-100px;top:-110px}.hero-inner{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;position:relative;z-index:1}.hero h2{font-size:25px;letter-spacing:-.4px;margin:0 0 7px}.hero p{margin:0;color:#c6d0d9;max-width:950px;font-size:11.8px;line-height:1.55}.tag{background:var(--lime);color:var(--navy);font-size:8.8px;font-weight:900;letter-spacing:.8px;border-radius:999px;padding:8px 11px}
.grid{display:grid;gap:13px}.kpis{grid-template-columns:repeat(6,minmax(140px,1fr));margin-bottom:13px}.two{grid-template-columns:1.55fr 1fr}.equal{grid-template-columns:1fr 1fr}.three{grid-template-columns:repeat(3,1fr)}
.card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:15px;box-shadow:var(--shadow);min-width:0}.cardhead{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:11px}.card h3{font-size:13.7px;margin:0}.sub{font-size:9.5px;color:var(--muted);margin-top:3px}
.kpi-label{font-size:8.6px;text-transform:uppercase;letter-spacing:.7px;color:#7a8692}.kpi-value{font-size:25px;font-weight:900;color:var(--navy2);margin-top:5px;letter-spacing:-.5px}.kpi-meta{font-size:9px;color:var(--muted);margin-top:4px}.good{color:var(--green)!important}.warn{color:var(--amber)!important}.bad{color:var(--red)!important}
.modules{display:grid;grid-template-columns:repeat(6,1fr);gap:9px}.module{border:1px solid var(--line);border-radius:11px;padding:12px;position:relative;overflow:hidden;cursor:pointer;background:#fff;min-height:122px}.module:before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:var(--lime)}.module:hover{box-shadow:var(--shadow2);transform:translateY(-1px)}.module .n{font-size:8.7px;color:var(--lime2);font-weight:900}.module .name{font-size:10.7px;font-weight:900;margin-top:4px}.module .big{font-size:24px;font-weight:900;margin-top:8px}.module .desc{font-size:8.8px;color:var(--muted);margin-top:2px}.bar{height:6px;background:#edf1f4;border-radius:99px;overflow:hidden;margin-top:9px}.bar span{display:block;height:100%;background:linear-gradient(90deg,var(--lime2),var(--lime))}
.toolbar{display:flex;gap:7px;align-items:center;flex-wrap:wrap;margin-bottom:10px}.search{flex:1;min-width:220px;border:1px solid #ccd5de;border-radius:8px;padding:8px 9px;font-size:10px}input,select,textarea{border:1px solid #ccd5de;border-radius:8px;padding:8px 9px;background:#fff;color:var(--text);font-size:10px}textarea{resize:vertical}
.tablewrap{overflow:auto;border:1px solid var(--line);border-radius:10px}table{width:100%;border-collapse:separate;border-spacing:0;font-size:9.8px}th{background:#f4f7f9;color:#647180;text-align:left;padding:9px;font-size:8.2px;text-transform:uppercase;letter-spacing:.48px;border-bottom:1px solid var(--line);white-space:nowrap}td{padding:9px;border-bottom:1px solid var(--line);white-space:nowrap;vertical-align:middle}tbody tr:hover{background:#fbfcfd}
.badge{display:inline-flex;border-radius:999px;padding:4px 7px;font-size:8.5px;font-weight:850}.bg{background:#eef2f5;color:#566272}.bb{background:#e8f2ff;color:#2869b4}.bgr{background:#e6f6ef;color:#17734c}.ba{background:#fff3d8;color:#936000}.br{background:#fdeaea;color:#a22e2e}.bp{background:#efeaff;color:#6049bd}
.mini{border:0;background:#edf2f5;color:var(--navy2);border-radius:6px;padding:5px 7px;font-size:8.8px}.mini:hover{background:#e2e9ee}
.tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:11px}.tab{border:1px solid var(--line);background:#fff;border-radius:999px;padding:7px 10px;font-size:9.2px;cursor:pointer}.tab.active{background:var(--navy2);color:#fff}
.alerts{display:grid;gap:7px}.alert{border:1px solid var(--line);border-left:4px solid var(--amber);border-radius:9px;padding:9px;background:#fff}.alert.red{border-left-color:var(--red)}.alert.green{border-left-color:var(--green)}.alert.blue{border-left-color:var(--blue)}.alert b{font-size:10.2px}.alert small{display:block;font-size:8.9px;color:var(--muted);margin-top:2px;line-height:1.42}
.canvas{height:230px}canvas{width:100%;height:100%;display:block}
.photo-panel{display:grid;grid-template-columns:1.1fr 1fr;gap:12px}.photo-box{border:2px dashed #c9d2db;border-radius:12px;background:#fafbfc;min-height:260px;display:grid;place-items:center;overflow:hidden;position:relative}.photo-box img{width:100%;height:100%;object-fit:cover;display:none}.photo-placeholder{text-align:center;color:var(--muted);padding:30px}.photo-placeholder .cam{font-size:36px;margin-bottom:8px}.photo-actions{display:flex;gap:7px;justify-content:center;flex-wrap:wrap;margin-top:9px}
.ai-card{border:1px solid var(--line);border-radius:12px;background:linear-gradient(180deg,#fff,#fbfcfd);padding:13px}.ai-score{display:flex;align-items:center;justify-content:space-between;padding:9px;border-radius:9px;background:#f4f7f9;margin-bottom:10px}.score{font-size:24px;font-weight:900;color:var(--green)}.kv{display:grid;grid-template-columns:150px 1fr;gap:7px 10px;font-size:9.5px}.kv div:nth-child(odd){color:var(--muted)}.timer{font-variant-numeric:tabular-nums;font-size:27px;font-weight:900;color:var(--navy2)}
.auditcards{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.auditcard{border:1px solid var(--line);border-radius:11px;padding:11px;background:#fff}.auditcard b{font-size:10.5px}.auditcard .big{font-size:22px;font-weight:900;margin-top:4px}.auditcard small{font-size:8.8px;color:var(--muted)}
.mastercards{display:grid;grid-template-columns:repeat(6,1fr);gap:9px}.mastercard{border:1px solid var(--line);background:#fff;border-radius:11px;padding:12px;cursor:pointer}.mastercard.active{border-color:var(--lime2);box-shadow:inset 0 0 0 1px var(--lime2)}.mastercard b{font-size:10.3px;display:block;margin-top:5px}.mastercard small{font-size:8.7px;color:var(--muted)}
.usergrid{display:grid;gap:8px}.userrow{display:grid;grid-template-columns:40px 1.2fr .8fr .7fr auto;gap:9px;align-items:center;border:1px solid var(--line);border-radius:10px;padding:9px;background:#fff}.userrow b{font-size:10.3px}.permgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.perm{border:1px solid var(--line);border-radius:9px;padding:9px;background:#fff;font-size:9.3px;display:flex;gap:8px;align-items:center}
.settinggrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.setting{border:1px solid var(--line);border-radius:10px;padding:11px;background:#fff}.setting b{font-size:10px}.setting small{display:block;color:var(--muted);font-size:8.8px;margin-top:3px}.setting input{width:100%;margin-top:8px}
.auditrow{display:grid;grid-template-columns:145px 130px 110px 1fr;gap:8px;border-bottom:1px solid var(--line);padding:8px 0;font-size:9.3px}.auditrow small{color:var(--muted)}
.modalbg{display:none;position:fixed;inset:0;background:rgba(4,12,20,.56);backdrop-filter:blur(2px);z-index:100;align-items:center;justify-content:center;padding:20px}.modalbg.open{display:flex}.modal{width:min(920px,100%);max-height:92vh;overflow:auto;background:#fff;border-radius:16px;box-shadow:0 30px 90px rgba(0,0,0,.30)}.modalhead,.modalfoot{padding:14px 17px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}.modalbody{padding:17px}.modalfoot{border-top:1px solid var(--line);border-bottom:0;justify-content:flex-end;gap:7px}.form{display:grid;grid-template-columns:repeat(2,1fr);gap:11px}.field{display:flex;flex-direction:column;gap:5px}.field.full{grid-column:1/-1}.field label{font-size:8.9px;font-weight:850;color:#647080}
.toast{position:fixed;right:18px;bottom:18px;background:var(--navy2);color:#fff;padding:11px 13px;border-radius:9px;box-shadow:0 14px 35px rgba(0,0,0,.25);font-size:9.8px;opacity:0;transform:translateY(10px);transition:.2s;z-index:200}.toast.show{opacity:1;transform:translateY(0)}
.drop{border:2px dashed #c6d0d9;border-radius:12px;padding:24px;text-align:center;background:#fafbfc}.drop.drag{border-color:var(--lime2);background:#fbffe8}.ocr-result{border:1px solid var(--line);border-radius:11px;padding:12px;background:#fff}.confidence{display:inline-flex;gap:5px;align-items:center;font-size:8.8px;color:var(--green);font-weight:850}
.note{font-size:8.7px;color:var(--muted);line-height:1.45}

.smartbar{background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px 14px;box-shadow:var(--shadow);margin-bottom:13px}
.smartbar-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:9px}
.smartbar-title{font-size:10.5px;font-weight:900;color:var(--navy2)}
.smartfilters{display:grid;grid-template-columns:1.15fr 1fr 1fr 1fr auto;gap:8px}
.smartfilters select,.smartfilters input{width:100%}
.tracking{display:flex;align-items:center;gap:0;overflow:auto;padding:8px 2px 2px}
.trackstep{min-width:116px;position:relative;text-align:center}
.trackstep:before{content:"";height:4px;background:#dfe5e9;position:absolute;left:-50%;right:50%;top:13px}
.trackstep:first-child:before{display:none}.trackdot{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#dfe5e9;color:#687481;font-size:9px;font-weight:900;margin:auto;position:relative;z-index:2}
.trackstep.done .trackdot{background:var(--green);color:#fff}.trackstep.current .trackdot{background:var(--lime);color:var(--navy);box-shadow:0 0 0 5px rgba(201,219,0,.17)}
.trackstep.done:before,.trackstep.current:before{background:var(--green)}.trackstep b{display:block;font-size:8.5px;margin-top:6px}.trackstep small{font-size:7.8px;color:var(--muted)}
.metricring{width:92px;height:92px;border-radius:50%;display:grid;place-items:center;margin:auto;background:conic-gradient(var(--lime) calc(var(--pct)*1%),#e8edf0 0);position:relative}
.metricring:after{content:"";position:absolute;width:70px;height:70px;border-radius:50%;background:#fff}.metricring span{position:relative;z-index:1;font-size:20px;font-weight:900;color:var(--navy2)}
.personcard{border:1px solid var(--line);border-radius:10px;padding:10px;background:#fff}.personcard b{font-size:10px}.personcard small{font-size:8.5px;color:var(--muted);display:block;margin-top:3px}
@media(max-width:900px){.smartfilters{grid-template-columns:1fr 1fr}.smartfilters .btn{grid-column:1/-1}}

/* ===== Dashboard v6: estética de referencia ===== */
.dash-shell{display:grid;gap:12px}
.dash-banner{background:linear-gradient(90deg,#0a2237 0%,#0c2941 52%,#123852 100%);border-radius:14px;color:#fff;padding:18px 22px;position:relative;overflow:hidden;box-shadow:var(--shadow2)}
.dash-banner:before{content:"";position:absolute;inset:0;background:
 radial-gradient(circle at 72% 18%,rgba(255,255,255,.10),transparent 28%),
 linear-gradient(90deg,transparent 45%,rgba(201,219,0,.06) 100%);}
.dash-banner-inner{position:relative;z-index:1;display:flex;justify-content:space-between;align-items:center;gap:18px}
.dash-banner h2{margin:0;font-size:26px;letter-spacing:-.6px}.dash-banner p{margin:5px 0 0;color:#cbd6df;font-size:11.5px}
.dash-banner-claim{text-align:right;font-weight:900;line-height:1.15;font-size:13px;letter-spacing:.3px}
.dash-banner-claim span{display:block}.dash-banner-claim .lime{color:var(--lime)}

.dash-filterbar{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 12px;box-shadow:var(--shadow);display:grid;grid-template-columns:1.15fr .75fr .9fr 1.15fr .8fr auto auto;gap:8px;align-items:end}
.df label{display:block;font-size:8px;font-weight:900;color:#445364;margin:0 0 4px}.df input,.df select{width:100%;height:34px}
.dash-kpis{display:grid;grid-template-columns:repeat(6,minmax(135px,1fr));gap:9px}
.dkpi{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 13px;box-shadow:var(--shadow);min-height:101px}
.dkpi-top{display:flex;align-items:center;gap:9px}.dkpi-icon{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;font-size:18px;font-weight:900;background:#edf3f8;color:#0d4c82}
.dkpi-icon.green{background:#eaf8ef;color:#14944d}.dkpi-icon.red{background:#fff0f1;color:#e73b4c}.dkpi-icon.blue{background:#ecf4ff;color:#1768c5}.dkpi-icon.amber{background:#fff7df;color:#b67b00}
.dkpi .label{font-size:8.7px;font-weight:850;color:#526170}.dkpi .value{font-size:23px;font-weight:950;color:#09213a;line-height:1;margin-top:2px}.dkpi .delta{font-size:8.5px;margin-top:9px;font-weight:750}.dkpi .progress{height:6px;background:#e8edf1;border-radius:99px;overflow:hidden;margin-top:7px}.dkpi .progress i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#1ab15a,#3dc66d)}

.chain-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 14px;box-shadow:var(--shadow)}
.chain-title{font-size:10.8px;font-weight:900;margin-bottom:7px}.chain-row{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;align-items:start}
.chain-node{position:relative;text-align:center;padding:3px 2px}.chain-node:not(:last-child):after{content:"→";position:absolute;right:-8px;top:20px;color:#4380b4;font-size:18px}
.chain-ico{width:38px;height:38px;border-radius:50%;background:#eaf1f7;color:#0d568d;display:grid;place-items:center;margin:auto;font-weight:900}
.chain-name{font-size:9.6px;font-weight:900;margin-top:4px}.ring-mini{width:58px;height:58px;border-radius:50%;margin:7px auto 4px;background:conic-gradient(#13a34b calc(var(--pct)*1%),#dfe8ee 0);display:grid;place-items:center;position:relative}
.ring-mini:after{content:"";width:44px;height:44px;border-radius:50%;background:#fff;position:absolute}.ring-mini b{position:relative;z-index:1;font-size:11px}.chain-status{font-size:8px;color:#586676}.chain-status.bad{color:#dc3948}.chain-status.warn{color:#c88700}

.dash-grid-main{display:grid;grid-template-columns:1.45fr .9fr .82fr;gap:10px}
.dash-grid-mid{display:grid;grid-template-columns:1fr 1.05fr 1.15fr;gap:10px}
.dash-grid-bottom{display:grid;grid-template-columns:1fr 1fr 1.35fr;gap:10px}
.dash-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:11px 12px;box-shadow:var(--shadow);min-width:0}
.dc-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:8px}.dc-head h3{font-size:10.7px;margin:0}.dc-head .sub{font-size:8px}
.legend{display:flex;gap:12px;align-items:center;justify-content:center;font-size:8px;margin-bottom:3px}.legend span:before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:4px;vertical-align:-1px}
.legend .lg1:before{background:#1aac50}.legend .lg2:before{background:#1d78dc}.legend .lg3:before{background:#f0a900}
.chart-sm{height:185px}.chart-xs{height:155px}

.hbar-list{display:grid;gap:8px}.hbar-row{display:grid;grid-template-columns:110px 1fr 34px;gap:7px;align-items:center;font-size:8.5px}.hbar-bg{height:10px;border-radius:99px;background:#e7edf1;overflow:hidden}.hbar-fill{height:100%;border-radius:99px;background:#176bc5}.hbar-fill.red{background:#f44d59}.hbar-fill.amber{background:#f0aa13}.hbar-fill.green{background:#22b45a}
.gauge-row{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.gauge{text-align:center}.gauge-ring{width:72px;height:72px;border-radius:50%;margin:auto;background:conic-gradient(var(--gauge-color,#16ad4e) calc(var(--pct)*1%),#dfe7ed 0);display:grid;place-items:center;position:relative}.gauge-ring:after{content:"";width:54px;height:54px;background:#fff;border-radius:50%;position:absolute}.gauge-ring b{position:relative;z-index:1;font-size:13px}.gauge-name{font-size:8.3px;font-weight:850;margin-top:5px}.gauge-delta{font-size:8px;margin-top:3px}
.person-bars{display:grid;gap:7px}.person-row{display:grid;grid-template-columns:62px 1fr 34px;gap:7px;align-items:center;font-size:8.4px}.person-bg{height:11px;background:#e8edf1;border-radius:99px;overflow:hidden}.person-fill{height:100%;border-radius:99px;background:linear-gradient(90deg,#1ab05a,#62cc4f)}.person-fill.mid{background:linear-gradient(90deg,#2e78cb,#4d91df)}.person-fill.low{background:linear-gradient(90deg,#eda817,#ffc033)}

.track-panel .track-select{width:170px;margin-bottom:8px}.track-line{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;align-items:start}.tstep{text-align:center;position:relative}.tstep:not(:last-child):after{content:"";height:4px;background:#dbe4eb;position:absolute;left:56%;right:-52%;top:14px}.tstep.done:not(:last-child):after{background:#4bb950}.tstep.current:not(:last-child):after{background:linear-gradient(90deg,#2d73d0,#dbe4eb)}.tdot{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:#dfe7ed;color:#37536f;font-size:10px;font-weight:900;margin:auto;position:relative;z-index:2}.done .tdot{background:#4bb950;color:#fff}.current .tdot{background:#176ed0;color:#fff}.tstep b{display:block;font-size:7.8px;margin-top:5px}.tstep small{font-size:7.2px;color:#65727e}.track-note{border:1px solid #b7d5f4;background:#eef7ff;border-radius:8px;padding:8px 9px;font-size:8.3px;color:#174a7b;margin-top:9px}

.compact-table{width:100%;border-collapse:collapse;font-size:7.8px}.compact-table th{font-size:7px;padding:5px 4px;background:#eef3f7}.compact-table td{padding:5px 4px}.pill{display:inline-block;padding:3px 7px;border-radius:99px;font-size:7px;font-weight:800;background:#eef2f5}.pill.green{background:#e7f7ed;color:#147a42}.pill.red{background:#fde9eb;color:#b52b39}.pill.amber{background:#fff1d2;color:#9b6700}.pill.blue{background:#e8f1ff;color:#1d65b6}

@media(max-width:1450px){
 .dash-kpis{grid-template-columns:repeat(3,1fr)}
 .dash-filterbar{grid-template-columns:repeat(3,1fr)}
 .dash-grid-main,.dash-grid-mid,.dash-grid-bottom{grid-template-columns:1fr 1fr}
}
@media(max-width:920px){
 .dash-filterbar,.dash-kpis,.dash-grid-main,.dash-grid-mid,.dash-grid-bottom{grid-template-columns:1fr}
 .chain-row{grid-template-columns:repeat(2,1fr)}
 .chain-node:not(:last-child):after{display:none}
 .dash-banner-inner{flex-direction:column;align-items:flex-start}.dash-banner-claim{text-align:left}
}

@media(max-width:1280px){.app{grid-template-columns:225px minmax(0,1fr)}.kpis{grid-template-columns:repeat(3,1fr)}.modules{grid-template-columns:repeat(3,1fr)}.two,.equal,.three{grid-template-columns:1fr}.mastercards{grid-template-columns:repeat(3,1fr)}.auditcards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:820px){.app{display:block}.sidebar{position:relative;height:auto}.navlabel{display:none}.nav{display:inline-flex;width:auto}.topbar{position:relative}.content{padding:12px}.kpis{grid-template-columns:repeat(2,1fr)}.modules{grid-template-columns:repeat(2,1fr)}.mastercards{grid-template-columns:repeat(2,1fr)}.settinggrid,.permgrid,.photo-panel{grid-template-columns:1fr}.hero-inner{flex-direction:column}.form{grid-template-columns:1fr}.field.full{grid-column:auto}.userrow{grid-template-columns:40px 1fr auto}.userrow>*:nth-child(3),.userrow>*:nth-child(4){display:none}}

/* ---- next style block ---- */

/* ===== Compras + OCR v9 · SOLO #page-compras ===== */
#page-compras .buy-hero{
  border-radius:14px;
  padding:18px 20px;
  margin-bottom:12px;
  color:#fff;
  background:
    radial-gradient(circle at 77% 18%,rgba(201,219,0,.13),transparent 25%),
    linear-gradient(105deg,#081d31 0%,#0d3552 57%,#0a2339 100%);
  box-shadow:var(--shadow2);
  position:relative;overflow:hidden
}
#page-compras .buy-hero:after{content:"";position:absolute;right:-90px;top:-120px;width:360px;height:360px;border:1px solid rgba(255,255,255,.08);border-radius:50%}
#page-compras .buy-hero-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;position:relative;z-index:1}
#page-compras .buy-hero h2{font-size:24px;margin:0 0 5px;letter-spacing:-.45px}
#page-compras .buy-hero p{margin:0;color:#c8d5e0;font-size:11.5px}
#page-compras .buy-hero-claim{font-size:9px;font-weight:900;letter-spacing:.8px;background:rgba(255,255,255,.09);padding:8px 10px;border-radius:999px;border:1px solid rgba(255,255,255,.10)}

#page-compras .buy-kpis{display:grid;grid-template-columns:repeat(6,1fr);gap:9px;margin-bottom:12px}
#page-compras .buy-kpi{background:#fff;border:1px solid var(--line);border-radius:12px;padding:11px 12px;box-shadow:var(--shadow);min-height:94px}
#page-compras .buy-kpi-top{display:flex;align-items:center;gap:9px}
#page-compras .buy-kpi-icon{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;font-size:17px;font-weight:900;background:#edf4fb;color:#176abf}
#page-compras .buy-kpi-icon.green{background:#e8f8ef;color:#11944b}
#page-compras .buy-kpi-icon.red{background:#ffedef;color:#e03749}
#page-compras .buy-kpi .lab{font-size:8.4px;color:#536273;font-weight:850}
#page-compras .buy-kpi .val{font-size:23px;line-height:1;font-weight:950;color:#0b223a;margin-top:2px}
#page-compras .buy-kpi .meta{font-size:8.2px;margin-top:8px;color:#667585}
#page-compras .buy-kpi .meta.good{color:#11944b}
#page-compras .buy-kpi .meta.bad{color:#d63746}

#page-compras .buy-main-grid{display:grid;grid-template-columns:1.05fr 1.42fr .86fr;gap:10px;margin-bottom:12px}
#page-compras .buy-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px;box-shadow:var(--shadow);min-width:0}
#page-compras .buy-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:9px}
#page-compras .buy-card-head h3{margin:0;font-size:11.3px}
#page-compras .buy-step{color:#0c2a43;font-size:11.3px;font-weight:950}
#page-compras .buy-tabs{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);border-radius:8px;overflow:hidden;margin-bottom:9px}
#page-compras .buy-tabs button{border:0;border-right:1px solid var(--line);background:#f7f9fb;padding:8px;font-size:8.7px;color:#485868}
#page-compras .buy-tabs button:last-child{border-right:0}
#page-compras .buy-tabs button.active{background:#0b2a43;color:#fff;font-weight:850}
#page-compras .buy-drop{min-height:228px;border:1.5px dashed #b9c7d3;border-radius:11px;background:linear-gradient(180deg,#fbfcfd,#f7f9fb);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:18px}
#page-compras .buy-cloud{width:56px;height:56px;border-radius:18px;display:grid;place-items:center;background:#eaf2ff;color:#2172d0;font-size:27px;margin-bottom:8px}
#page-compras .buy-drop b{font-size:13px}
#page-compras .buy-drop .sub{max-width:270px}
#page-compras .buy-drop .formats{font-size:7.9px;color:#687786;margin:7px 0 10px}

#page-compras .ocr-layout{display:grid;grid-template-columns:.82fr 1.18fr;gap:10px}
#page-compras .doc-preview{border:1px solid var(--line);background:#f7f9fb;border-radius:10px;min-height:272px;padding:10px;display:flex;align-items:center;justify-content:center;position:relative}
#page-compras .doc-sheet{width:86%;height:235px;background:#fff;border:1px solid #ced8e1;box-shadow:0 8px 22px rgba(12,38,61,.10);padding:12px;font-size:6.5px;color:#29394a}
#page-compras .doc-sheet .doc-line{height:4px;background:#d9e1e7;border-radius:99px;margin:5px 0}
#page-compras .doc-sheet .doc-line.dark{background:#7d91a4;width:75%}
#page-compras .doc-sheet .doc-box{border:1px solid #cbd5de;height:66px;margin:9px 0;background:repeating-linear-gradient(0deg,#fff,#fff 11px,#e8edf1 12px)}
#page-compras .ocr-fields{display:grid;gap:5px}
#page-compras .ocr-field{display:grid;grid-template-columns:112px 1fr;gap:8px;align-items:center;border-bottom:1px solid #edf1f4;padding:5px 2px}
#page-compras .ocr-field span{font-size:8.3px;color:#637181}
#page-compras .ocr-field b{font-size:8.8px;color:#14324d}
#page-compras .ocr-actions{display:grid;grid-template-columns:1fr 1.25fr;gap:7px;margin-top:9px}
#page-compras .confidence-badge{font-size:8px;font-weight:850;color:#148346;background:#e8f7ed;border-radius:999px;padding:5px 8px}
#page-compras .confidence-big{font-size:17px;font-weight:950;color:#12a04e}

#page-compras .buy-side-stack{display:grid;grid-template-rows:1fr 1fr;gap:10px}
#page-compras .donut-wrap{display:flex;align-items:center;gap:11px}
#page-compras .donut{width:112px;height:112px;position:relative;flex:0 0 auto}
#page-compras .donut canvas{width:112px;height:112px}
#page-compras .donut-center{position:absolute;inset:0;display:grid;place-items:center;text-align:center;pointer-events:none}
#page-compras .donut-center b{font-size:22px;color:#102b44;line-height:1}
#page-compras .donut-center small{display:block;font-size:7.5px;color:#6e7c89;margin-top:2px}
#page-compras .donut-legend{display:grid;gap:8px;font-size:8.5px;flex:1}
#page-compras .donut-legend div{display:grid;grid-template-columns:10px 1fr auto;gap:5px;align-items:center}
#page-compras .legend-dot{width:8px;height:8px;border-radius:50%}
#page-compras .buy-chart{height:128px}

#page-compras .buy-table-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:11px 12px;box-shadow:var(--shadow)}
#page-compras .buy-filterbar{display:grid;grid-template-columns:1.4fr .85fr .72fr .85fr auto auto auto;gap:7px;align-items:end;margin-bottom:8px}
#page-compras .buy-filterbar .bf label{display:block;font-size:7.7px;font-weight:850;color:#526170;margin:0 0 4px}
#page-compras .buy-filterbar input,#page-compras .buy-filterbar select{width:100%;height:33px}
#page-compras .buy-table-title{font-size:11.5px;font-weight:900;margin:7px 0 8px}
#page-compras .buy-table table{font-size:8.3px}
#page-compras .buy-table th{font-size:7.1px;padding:7px}
#page-compras .buy-table td{padding:7px}
#page-compras .buy-eye{width:24px;height:24px;border:0;border-radius:50%;background:#eef3f7;color:#173c5c}

@media(max-width:1350px){
 #page-compras .buy-kpis{grid-template-columns:repeat(3,1fr)}
 #page-compras .buy-main-grid{grid-template-columns:1fr 1.25fr}
 #page-compras .buy-side-stack{grid-column:1/-1;grid-template-columns:1fr 1fr;grid-template-rows:auto}
 #page-compras .buy-filterbar{grid-template-columns:1fr 1fr 1fr}
}
@media(max-width:850px){
 #page-compras .buy-kpis,#page-compras .buy-main-grid,#page-compras .buy-side-stack,#page-compras .ocr-layout,#page-compras .buy-filterbar{grid-template-columns:1fr}
 #page-compras .buy-hero-inner{flex-direction:column;align-items:flex-start}
}

/* ---- next style block ---- */

/* ===== Sidebar v7: imagen de rollos + colapsable ===== */
.sidebar{
  display:flex;
  flex-direction:column;
  transition:width .28s ease,padding .28s ease;
  position:sticky;
  top:0;
}
.sidebar-scroll{flex:1;min-height:0;overflow:auto}
.sidebar-footer-visual{
  margin-top:auto;
  min-height:245px;
  border-radius:14px 14px 0 0;
  overflow:hidden;
  position:relative;
  background:
    linear-gradient(180deg,rgba(8,21,34,.05),rgba(8,21,34,.72) 72%,rgba(8,21,34,.96)),
    url("../img/sidebar-rolls.png") center center/cover no-repeat;
  border:1px solid rgba(255,255,255,.06);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}
.sidebar-footer-visual .claim{
  position:absolute;left:14px;bottom:18px;right:10px;
  font-size:12px;line-height:1.28;font-weight:800;letter-spacing:.8px;color:#fff;
}
.sidebar-footer-visual .claim span{display:block}
.sidebar-toggle{
  position:absolute;right:-15px;top:74px;z-index:60;width:30px;height:30px;border-radius:50%;
  border:1px solid #cbd5df;background:#fff;color:#10283d;box-shadow:0 6px 18px rgba(10,26,42,.18);
  display:grid;place-items:center;font-weight:900;
}
.sidebar-toggle:hover{background:var(--lime);border-color:var(--lime)}
.app.sidebar-collapsed{grid-template-columns:78px minmax(0,1fr)}
.app.sidebar-collapsed .sidebar{padding-left:8px;padding-right:8px}
.app.sidebar-collapsed .brand small,
.app.sidebar-collapsed .usertxt,
.app.sidebar-collapsed .navlabel,
.app.sidebar-collapsed .nav{font-size:0}
.app.sidebar-collapsed .brand{padding-left:2px;padding-right:2px}
.app.sidebar-collapsed .brand img{height:42px;object-fit:contain;object-position:center}
.app.sidebar-collapsed .userbox{justify-content:center;padding:8px 4px}
.app.sidebar-collapsed .userbox .mini{display:none}
.app.sidebar-collapsed .nav{justify-content:center;padding:8px 4px}
.app.sidebar-collapsed .nav .ico{width:34px;height:34px;font-size:10px}
.app.sidebar-collapsed .sidebar-footer-visual{min-height:185px}
.app.sidebar-collapsed .sidebar-footer-visual .claim{display:none}
.app.sidebar-collapsed .sidebar-toggle{right:-14px}
@media(max-width:820px){
  .sidebar-toggle{display:none}
  .sidebar-footer-visual{display:none}
}

/* ---- next style block ---- */

/* ===== v10 · Ajuste exclusivo del menú lateral ===== */

/* La imagen ocupa su propio bloque al final del menú: no se superpone al listado */
.sidebar{
  overflow:visible !important;
}
.sidebar-scroll{
  flex:1 1 auto !important;
  min-height:0 !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding-bottom:12px !important;
}
.sidebar-footer-visual{
  flex:0 0 235px !important;
  min-height:235px !important;
  margin:0 !important;
  border-radius:0 !important;
  border-left:0 !important;
  border-right:0 !important;
  border-bottom:0 !important;
  background-position:center center !important;
  position:relative !important;
  z-index:1 !important;
}
.sidebar-footer-visual .claim{
  left:18px !important;
  bottom:20px !important;
}

/* Botón colapsar: integrado visualmente al borde, más limpio */
.sidebar-toggle{
  width:34px !important;
  height:46px !important;
  right:-17px !important;
  top:92px !important;
  border-radius:0 12px 12px 0 !important;
  border:1px solid #d4dde5 !important;
  border-left:0 !important;
  background:#ffffff !important;
  color:#12324d !important;
  box-shadow:4px 4px 12px rgba(8,29,47,.13) !important;
  font-size:0 !important;
  cursor:pointer !important;
  transition:background .18s ease,color .18s ease,transform .18s ease !important;
}
.sidebar-toggle:before{
  content:"‹";
  font-size:25px;
  font-family:Arial,sans-serif;
  font-weight:700;
  line-height:1;
}
.sidebar-toggle:hover{
  background:var(--lime) !important;
  color:#071d30 !important;
  transform:translateX(1px);
}
.app.sidebar-collapsed .sidebar-toggle{
  right:-17px !important;
}
.app.sidebar-collapsed .sidebar-toggle:before{
  content:"›";
}
.app.sidebar-collapsed .sidebar-footer-visual{
  flex-basis:190px !important;
  min-height:190px !important;
  background-position:center center !important;
}

/* ---- next style block ---- */

/* ===== v11 · ÚNICO AJUSTE: encuadre estético imagen de rollos ===== */
.sidebar-footer-visual{
  flex:0 0 238px !important;
  min-height:238px !important;
  box-sizing:border-box !important;
  margin:10px 14px 14px 14px !important;
  width:calc(100% - 28px) !important;
  border-radius:14px !important;
  overflow:hidden !important;
  border:1px solid rgba(255,255,255,.10) !important;
  background-size:cover !important;
  background-position:center 48% !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.025),
    0 8px 20px rgba(0,0,0,.16) !important;
}
.sidebar-footer-visual:after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(5,20,32,0) 42%,rgba(5,20,32,.24) 68%,rgba(5,20,32,.72) 100%);
}
.sidebar-footer-visual .claim{
  z-index:2 !important;
  left:16px !important;
  right:14px !important;
  bottom:16px !important;
}
.app.sidebar-collapsed .sidebar-footer-visual{
  margin:10px 7px 14px 7px !important;
  width:calc(100% - 14px) !important;
  min-height:190px !important;
  flex-basis:190px !important;
  border-radius:11px !important;
  background-position:center center !important;
}

/* ---- next style block ---- */

/* ===== v13 · Filtros inteligentes dinámicos del Dashboard ===== */
#page-dashboard .dash-filterbar.filter-active{
  border-color:rgba(201,219,0,.75);
  box-shadow:0 0 0 2px rgba(201,219,0,.12),var(--shadow);
}
#page-dashboard .filter-chip{
  display:inline-flex;align-items:center;gap:5px;
  padding:4px 8px;border-radius:999px;background:#eef5d7;color:#3d4e00;
  font-size:8px;font-weight:850;margin-right:5px
}
#page-dashboard .empty-chart{
  height:100%;display:grid;place-items:center;text-align:center;color:var(--muted);font-size:9px
}

/* ---- next style block ---- */

/* ===== v14 · SOLO módulo Recepción + Portería IA ===== */
#page-recepcion .rec-hero{
  border-radius:14px;
  padding:18px 20px;
  margin-bottom:12px;
  color:#fff;
  background:
    radial-gradient(circle at 76% 18%,rgba(201,219,0,.10),transparent 28%),
    linear-gradient(105deg,#081d31 0%,#0d3552 58%,#0a253a 100%);
  box-shadow:var(--shadow2);
  position:relative;
  overflow:hidden;
}
#page-recepcion .rec-hero:after{
  content:"";
  position:absolute;
  right:-70px;top:-120px;
  width:350px;height:350px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.07);
}
#page-recepcion .rec-hero-inner{
  position:relative;z-index:1;
  display:flex;align-items:center;justify-content:space-between;gap:16px;
}
#page-recepcion .rec-hero h2{margin:0 0 5px;font-size:24px;letter-spacing:-.45px}
#page-recepcion .rec-hero p{margin:0;color:#c9d6e0;font-size:11.5px}
#page-recepcion .rec-hero-tag{
  background:var(--lime);color:#071c2e;
  padding:8px 11px;border-radius:999px;
  font-size:8.7px;font-weight:950;letter-spacing:.6px;
}

#page-recepcion .rec-kpis{
  display:grid;grid-template-columns:repeat(6,1fr);gap:9px;margin-bottom:12px;
}
#page-recepcion .rec-kpi{
  background:#fff;border:1px solid var(--line);border-radius:12px;
  padding:11px 12px;box-shadow:var(--shadow);min-height:94px;
}
#page-recepcion .rec-kpi-top{display:flex;align-items:center;gap:9px}
#page-recepcion .rec-kpi-icon{
  width:36px;height:36px;border-radius:10px;display:grid;place-items:center;
  font-size:17px;font-weight:900;background:#edf4fb;color:#176abf;
}
#page-recepcion .rec-kpi-icon.green{background:#e9f8ef;color:#11944b}
#page-recepcion .rec-kpi-icon.red{background:#ffedef;color:#e23b4a}
#page-recepcion .rec-kpi .lab{font-size:8.4px;color:#536273;font-weight:850}
#page-recepcion .rec-kpi .val{font-size:23px;line-height:1;font-weight:950;color:#0b223a;margin-top:2px}
#page-recepcion .rec-kpi .meta{font-size:8.2px;margin-top:8px;color:#667585}
#page-recepcion .rec-kpi .meta.good{color:#11944b}
#page-recepcion .rec-kpi .meta.bad{color:#d63746}
#page-recepcion .rec-progress{height:6px;background:#e8edf1;border-radius:99px;overflow:hidden;margin-top:7px}
#page-recepcion .rec-progress i{display:block;height:100%;background:linear-gradient(90deg,#1aae57,#61cb54);border-radius:99px}

#page-recepcion .rec-main-grid{
  display:grid;grid-template-columns:1.12fr 1fr 1.22fr;gap:10px;margin-bottom:12px;
}
#page-recepcion .rec-card{
  background:#fff;border:1px solid var(--line);border-radius:12px;
  padding:12px;box-shadow:var(--shadow);min-width:0;
}
#page-recepcion .rec-card-head{
  display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-bottom:9px;
}
#page-recepcion .rec-card-head h3{margin:0;font-size:11.3px}
#page-recepcion .rec-step{font-size:11.3px;font-weight:950;color:#0c2a43}
#page-recepcion .rec-tabs{
  display:grid;grid-template-columns:repeat(3,1fr);
  border:1px solid var(--line);border-radius:8px;overflow:hidden;margin-bottom:9px;
}
#page-recepcion .rec-tabs button{
  border:0;border-right:1px solid var(--line);background:#f7f9fb;
  padding:8px;font-size:8.7px;color:#485868;
}
#page-recepcion .rec-tabs button:last-child{border-right:0}
#page-recepcion .rec-tabs button.active{background:#0b2a43;color:#fff;font-weight:850}

#page-recepcion .camera-stage{
  min-height:286px;border-radius:10px;overflow:hidden;position:relative;
  background:linear-gradient(145deg,#dbe5ec,#edf2f5);
  border:1px solid #cbd6df;
}
#page-recepcion .camera-stage img{
  width:100%;height:286px;object-fit:cover;display:block;
}
#page-recepcion .camera-overlay{
  position:absolute;left:10px;top:10px;background:rgba(5,23,38,.82);
  color:#fff;padding:6px 8px;border-radius:7px;font-size:8.5px;
}
#page-recepcion .camera-empty{
  width:100%;height:286px;display:flex;flex-direction:column;align-items:center;justify-content:center;
  color:#6a7886;text-align:center;background:
    radial-gradient(circle at 50% 40%,rgba(29,104,183,.08),transparent 28%),
    linear-gradient(180deg,#f8fafc,#eef3f6);
}
#page-recepcion .camera-empty .cam-big{
  width:64px;height:64px;border-radius:18px;display:grid;place-items:center;
  background:#eaf2ff;color:#1e70cf;font-size:28px;margin-bottom:8px;
}
#page-recepcion .rec-actions{display:grid;grid-template-columns:1.25fr .9fr;gap:7px;margin-top:9px}
#page-recepcion .auto-box{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  border:1px solid var(--line);border-radius:8px;padding:8px 10px;font-size:8.5px;
}
#page-recepcion .switch{
  width:38px;height:20px;border-radius:99px;background:#16af50;position:relative;cursor:pointer;
}
#page-recepcion .switch:after{
  content:"";position:absolute;width:16px;height:16px;border-radius:50%;background:#fff;right:2px;top:2px;
  box-shadow:0 2px 6px rgba(0,0,0,.2)
}
#page-recepcion .switch.off{background:#b9c4cc}
#page-recepcion .switch.off:after{right:20px}

#page-recepcion .ai-banner{
  display:flex;align-items:center;gap:7px;font-size:8.2px;
}
#page-recepcion .ai-ok{
  background:#e8f8ed;color:#118644;border-radius:999px;padding:5px 8px;font-weight:850;
}
#page-recepcion .ai-conf{
  background:#e9f3fb;color:#174d79;border-radius:999px;padding:5px 8px;font-weight:850;
}
#page-recepcion .plate-box{
  display:grid;grid-template-columns:1fr .95fr;gap:9px;margin-bottom:7px;
}
#page-recepcion .plate{
  border:1px solid #cbd5dd;background:#e8edf0;border-radius:7px;
  height:58px;display:grid;place-items:center;font-size:28px;font-weight:950;letter-spacing:2px;color:#141f28;
}
#page-recepcion .truck-thumb{
  border-radius:7px;height:58px;background:linear-gradient(135deg,#d8e3ea,#bccbd5);
  display:grid;place-items:center;font-size:25px;color:#375b73;overflow:hidden;
}
#page-recepcion .ai-fields{display:grid}
#page-recepcion .ai-row{
  display:grid;grid-template-columns:112px 1fr;gap:8px;align-items:center;
  border-bottom:1px solid #edf1f4;padding:5px 2px;
}
#page-recepcion .ai-row span{font-size:8.1px;color:#637181}
#page-recepcion .ai-row b{font-size:8.7px;color:#14324d}
#page-recepcion .validation-note{
  margin-top:8px;border-radius:8px;padding:8px 9px;
  background:#e8f8ee;color:#176f43;font-size:8.2px;
}
#page-recepcion .ai-actions{display:grid;grid-template-columns:1fr 1.2fr;gap:7px;margin-top:9px}

#page-recepcion .process-flow{
  display:grid;grid-template-columns:repeat(5,1fr);gap:4px;align-items:start;margin:9px 0 12px;
}
#page-recepcion .pf-step{text-align:center;position:relative}
#page-recepcion .pf-step:not(:last-child):after{
  content:"";height:3px;background:#d9e3ea;position:absolute;left:58%;right:-42%;top:14px
}
#page-recepcion .pf-step.done:not(:last-child):after{background:#3fba5c}
#page-recepcion .pf-dot{
  width:28px;height:28px;border-radius:50%;display:grid;place-items:center;margin:auto;
  background:#dfe7ed;color:#5a6b7a;font-size:9px;font-weight:900;position:relative;z-index:2;
}
#page-recepcion .pf-step.done .pf-dot{background:#19aa50;color:#fff}
#page-recepcion .pf-step.current .pf-dot{background:#1c75d2;color:#fff}
#page-recepcion .pf-step b{display:block;font-size:7.9px;margin-top:4px}
#page-recepcion .pf-step small{display:block;font-size:7px;color:#687786;margin-top:2px}

#page-recepcion .rec-chart{height:145px}
#page-recepcion .rec-donuts{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:10px}
#page-recepcion .mini-donut-wrap{
  display:flex;align-items:center;gap:7px;
}
#page-recepcion .mini-donut{
  width:84px;height:84px;position:relative;flex:0 0 auto;
}
#page-recepcion .mini-donut canvas{width:84px;height:84px}
#page-recepcion .mini-donut-center{
  position:absolute;inset:0;display:grid;place-items:center;text-align:center;pointer-events:none
}
#page-recepcion .mini-donut-center b{font-size:16px;color:#112c45}
#page-recepcion .mini-donut-center small{display:block;font-size:6.8px;color:#6d7985}
#page-recepcion .mini-legend{display:grid;gap:5px;font-size:7.4px;flex:1}
#page-recepcion .mini-legend div{display:grid;grid-template-columns:9px 1fr auto;gap:5px;align-items:center}
#page-recepcion .legend-dot{width:7px;height:7px;border-radius:50%}

#page-recepcion .rec-table-card{
  background:#fff;border:1px solid var(--line);border-radius:12px;padding:11px 12px;box-shadow:var(--shadow);
}
#page-recepcion .rec-filterbar{
  display:grid;grid-template-columns:1.35fr .65fr .62fr .72fr auto auto auto;
  gap:7px;align-items:end;margin-bottom:8px;
}
#page-recepcion .rf label{display:block;font-size:7.7px;font-weight:850;color:#526170;margin-bottom:4px}
#page-recepcion .rec-filterbar input,#page-recepcion .rec-filterbar select{width:100%;height:33px}
#page-recepcion .rec-table-title{font-size:11.5px;font-weight:900;margin:5px 0 8px}
#page-recepcion .rec-table table{font-size:8.2px}
#page-recepcion .rec-table th{font-size:7px;padding:7px}
#page-recepcion .rec-table td{padding:7px}
#page-recepcion .rec-eye{width:24px;height:24px;border:0;border-radius:50%;background:#eef3f7;color:#173c5c}

@media(max-width:1400px){
 #page-recepcion .rec-kpis{grid-template-columns:repeat(3,1fr)}
 #page-recepcion .rec-main-grid{grid-template-columns:1fr 1fr}
 #page-recepcion .rec-main-grid > .rec-card:last-child{grid-column:1/-1}
 #page-recepcion .rec-filterbar{grid-template-columns:1fr 1fr 1fr}
}
@media(max-width:860px){
 #page-recepcion .rec-kpis,#page-recepcion .rec-main-grid,#page-recepcion .rec-filterbar,#page-recepcion .rec-donuts{grid-template-columns:1fr}
 #page-recepcion .rec-hero-inner{flex-direction:column;align-items:flex-start}
 #page-recepcion .process-flow{grid-template-columns:repeat(2,1fr)}
 #page-recepcion .pf-step:not(:last-child):after{display:none}
}

/* ---- next style block ---- */

/* ===== v15 · SOLO estética Recepción + Portería IA ===== */
#page-recepcion .camera-stage{
  background:#0b2134 !important;
  min-height:300px !important;
}
#page-recepcion .camera-stage .default-truck{
  width:100%;height:300px;object-fit:cover;display:block;
}
#page-recepcion .camera-overlay{
  background:rgba(6,25,40,.84) !important;
  font-size:9px !important;
  padding:6px 9px !important;
}
#page-recepcion .camera-corner{
  position:absolute;right:9px;top:9px;width:28px;height:28px;border-radius:7px;
  display:grid;place-items:center;background:rgba(6,25,40,.82);color:#fff;font-size:11px;
}
#page-recepcion .truck-thumb{
  background-image:url("../img/truck.png") !important;
  background-size:cover !important;
  background-position:center !important;
  color:transparent !important;
}
#page-recepcion .plate{
  font-family:Arial Black,Impact,sans-serif !important;
  letter-spacing:1.5px !important;
  border:2px solid #9daab4 !important;
  background:linear-gradient(180deg,#f2f3f4,#cfd4d8) !important;
  color:#111 !important;
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.45) !important;
}
#page-recepcion .rec-main-grid{
  align-items:start;
}
#page-recepcion .rec-card{
  overflow:hidden;
}
#page-recepcion .validation-note{
  border:1px solid #c8ecd5;
}

/* ---- next style block ---- */

/* ===== v16 · SOLO Dashboard · estética referencia ===== */
#page-dashboard .dash-shell{display:grid;gap:11px}
#page-dashboard .dash-banner{
  min-height:112px;
  padding:18px 24px;
  border-radius:14px;
  color:#fff;
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(90deg,rgba(5,25,42,.97) 0%,rgba(6,34,57,.88) 42%,rgba(6,30,50,.72) 100%),
    url("../img/hero-dashboard.png") center center/cover no-repeat;
  box-shadow:var(--shadow2);
}
#page-dashboard .dash-banner:before{content:none}
#page-dashboard .dash-banner-inner{min-height:76px;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:1}
#page-dashboard .dash-banner h2{font-size:28px;margin:0 0 6px;letter-spacing:-.6px}
#page-dashboard .dash-banner p{font-size:11.5px;color:#d6e0e7;margin:0}
#page-dashboard .dash-banner-claim{font-size:13px;text-align:right;font-weight:950;line-height:1.08}
#page-dashboard .dash-banner-claim .lime{color:#d8ec00}

#page-dashboard .dash-filterbar{
  display:grid;
  grid-template-columns:1.05fr .8fr .85fr 1.15fr .9fr auto auto;
  gap:8px;
  align-items:end;
  background:#fff;
  border:1px solid var(--line);
  border-radius:12px;
  padding:10px 11px;
  box-shadow:var(--shadow);
}
#page-dashboard .df label{font-size:8px;font-weight:900;color:#415264;margin-bottom:4px}
#page-dashboard .df input,#page-dashboard .df select{height:34px}
#page-dashboard .dash-filterbar .btn{height:34px;padding:0 14px}

#page-dashboard .dash-kpis{
  display:grid;
  grid-template-columns:repeat(6,minmax(145px,1fr));
  gap:9px
}
#page-dashboard .dkpi{
  min-height:116px;
  padding:12px 13px;
  border-radius:12px;
  box-shadow:var(--shadow);
  border:1px solid var(--line);
  background:#fff;
}
#page-dashboard .dkpi-top{gap:10px}
#page-dashboard .dkpi-icon{
  width:48px;height:48px;border-radius:12px;font-size:22px;color:#fff!important
}
#page-dashboard .dkpi-icon.green{background:linear-gradient(135deg,#0fa34a,#16bd62)}
#page-dashboard .dkpi-icon.blue{background:linear-gradient(135deg,#0967d7,#2588f2)}
#page-dashboard .dkpi-icon.purple{background:linear-gradient(135deg,#6432df,#9657f4)}
#page-dashboard .dkpi-icon.orange{background:linear-gradient(135deg,#ff6618,#ff8a26)}
#page-dashboard .dkpi-icon.teal{background:linear-gradient(135deg,#0ca9a0,#23c5bc)}
#page-dashboard .dkpi-icon.red{background:linear-gradient(135deg,#f1263d,#ff4e5f)}
#page-dashboard .dkpi .label{font-size:8.6px;font-weight:900;color:#32465a}
#page-dashboard .dkpi .value{font-size:25px;margin-top:3px}
#page-dashboard .dkpi .delta{font-size:8.4px;margin-top:9px}
#page-dashboard .dkpi .progress{height:7px}

#page-dashboard .dash-grid-upper{
  display:grid;grid-template-columns:1.03fr 1.93fr;gap:10px
}
#page-dashboard .dash-grid-middle{
  display:grid;grid-template-columns:.88fr 1fr .72fr .72fr;gap:10px
}
#page-dashboard .dash-grid-lower{
  display:grid;grid-template-columns:1.12fr .92fr 1.02fr;gap:10px
}
#page-dashboard .dash-card{
  background:#fff;border:1px solid var(--line);border-radius:12px;padding:11px 12px;box-shadow:var(--shadow);min-width:0
}
#page-dashboard .dc-head{margin-bottom:7px}
#page-dashboard .dc-head h3{font-size:11px}
#page-dashboard .chart-impact{height:185px}
#page-dashboard .chart-mid{height:146px}

#page-dashboard .impact-bars{display:grid;gap:8px;margin-top:5px}
#page-dashboard .impact-row{display:grid;grid-template-columns:78px 1fr 26px;gap:8px;align-items:center;font-size:8px}
#page-dashboard .impact-bg{height:11px;border-radius:99px;background:#e5ebef;overflow:hidden}
#page-dashboard .impact-fill{height:100%;border-radius:99px}
#page-dashboard .impact-fill.b1{background:#2879d3}.impact-fill.b2{background:#18aa50}.impact-fill.b3{background:#7547e9}.impact-fill.b4{background:#ef991d}.impact-fill.b5{background:#edac21}.impact-fill.b6{background:#2ba7dc}

#page-dashboard .supply-chain{
  display:grid;grid-template-columns:repeat(7,1fr);gap:6px;align-items:start;padding-top:2px
}
#page-dashboard .sc-node{text-align:center;position:relative}
#page-dashboard .sc-node:not(:last-child):after{content:"→";position:absolute;right:-8px;top:20px;color:#2f7ed5;font-size:18px}
#page-dashboard .sc-icon{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:#ebf2f8;color:#144f7c;font-size:12px;font-weight:950;margin:auto}
#page-dashboard .sc-name{font-size:8.6px;font-weight:900;margin-top:4px}
#page-dashboard .sc-ring{width:58px;height:58px;border-radius:50%;margin:7px auto 3px;display:grid;place-items:center;background:conic-gradient(#18aa50 calc(var(--pct)*1%),#dfe8ed 0);position:relative}
#page-dashboard .sc-ring:after{content:"";position:absolute;width:43px;height:43px;border-radius:50%;background:#fff}
#page-dashboard .sc-ring b{position:relative;z-index:1;font-size:10px}
#page-dashboard .sc-status{font-size:7.2px;color:#5c6a77}
#page-dashboard .sc-status.red{color:#e33f4c}

#page-dashboard .donut-card-body{display:flex;align-items:center;gap:10px;padding-top:4px}
#page-dashboard .dash-donut{width:118px;height:118px;position:relative;flex:0 0 auto}
#page-dashboard .dash-donut canvas{width:118px;height:118px}
#page-dashboard .dash-donut-center{position:absolute;inset:0;display:grid;place-items:center;text-align:center;pointer-events:none}
#page-dashboard .dash-donut-center b{font-size:22px;line-height:1;color:#112b44}
#page-dashboard .dash-donut-center small{display:block;font-size:7px;color:#6c7985}
#page-dashboard .dash-legend{display:grid;gap:6px;flex:1;font-size:7.8px}
#page-dashboard .dash-legend div{display:grid;grid-template-columns:8px 1fr auto;gap:5px;align-items:center}
#page-dashboard .dash-legend .dot{width:7px;height:7px;box-shadow:none}

#page-dashboard .mini-table{width:100%;border-collapse:collapse;font-size:7.8px}
#page-dashboard .mini-table th{font-size:6.9px;padding:5px 4px;background:#eef3f7}
#page-dashboard .mini-table td{padding:5px 4px;border-bottom:1px solid #e7ecef}
#page-dashboard .activity-list{display:grid;gap:0}
#page-dashboard .activity-item{display:grid;grid-template-columns:42px 10px 1fr auto;gap:6px;align-items:start;padding:6px 0;border-bottom:1px solid #edf1f4;font-size:7.7px}
#page-dashboard .activity-line{width:8px;height:8px;border-radius:50%;background:#2879d3;margin-top:2px}
#page-dashboard .activity-module{color:#71808d}
#page-dashboard .view-link{border:0;background:transparent;color:#0868ce;font-size:7.8px;font-weight:850;padding:0}

@media(max-width:1450px){
 #page-dashboard .dash-kpis{grid-template-columns:repeat(3,1fr)}
 #page-dashboard .dash-grid-upper,#page-dashboard .dash-grid-middle,#page-dashboard .dash-grid-lower{grid-template-columns:1fr 1fr}
 #page-dashboard .dash-filterbar{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:900px){
 #page-dashboard .dash-kpis,#page-dashboard .dash-grid-upper,#page-dashboard .dash-grid-middle,#page-dashboard .dash-grid-lower,#page-dashboard .dash-filterbar{grid-template-columns:1fr}
 #page-dashboard .supply-chain{grid-template-columns:repeat(2,1fr)}
 #page-dashboard .sc-node:not(:last-child):after{display:none}
}

/* ---- next style block ---- */

/* ===== v17 · SOLO Inventarios + Auditorías ===== */
#page-inventarios .inv-hero{
  min-height:112px;padding:18px 22px;border-radius:14px;color:#fff;position:relative;overflow:hidden;
  background:
    linear-gradient(90deg,rgba(6,25,42,.96),rgba(8,38,62,.80) 48%,rgba(5,27,47,.58)),
    url("../img/hero-inventarios.png") center center/cover no-repeat;
  box-shadow:var(--shadow2);margin-bottom:12px;
}
#page-inventarios .inv-hero-inner{display:flex;justify-content:space-between;align-items:center;gap:16px;position:relative;z-index:1}
#page-inventarios .inv-hero h2{margin:0 0 6px;font-size:26px;letter-spacing:-.45px}
#page-inventarios .inv-hero p{margin:0;color:#d2dce4;font-size:11.5px}
#page-inventarios .inv-tag{background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.12);padding:8px 10px;border-radius:999px;font-size:8.5px;font-weight:900}

#page-inventarios .inv-kpis{display:grid;grid-template-columns:repeat(6,1fr);gap:9px;margin-bottom:12px}
#page-inventarios .inv-kpi{background:#fff;border:1px solid var(--line);border-radius:12px;padding:11px 12px;box-shadow:var(--shadow);min-height:96px}
#page-inventarios .inv-kpi-top{display:flex;align-items:center;gap:9px}
#page-inventarios .inv-kpi-icon{width:40px;height:40px;border-radius:11px;display:grid;place-items:center;color:#fff;font-size:18px;font-weight:900}
#page-inventarios .inv-kpi-icon.blue{background:linear-gradient(135deg,#0a69da,#278cff)}
#page-inventarios .inv-kpi-icon.green{background:linear-gradient(135deg,#0ba54c,#26c16b)}
#page-inventarios .inv-kpi-icon.orange{background:linear-gradient(135deg,#ff851a,#ffad2f)}
#page-inventarios .inv-kpi-icon.purple{background:linear-gradient(135deg,#6d43db,#9873f2)}
#page-inventarios .inv-kpi-icon.teal{background:linear-gradient(135deg,#05a6a4,#2bc8c4)}
#page-inventarios .inv-kpi .lab{font-size:8.3px;color:#536273;font-weight:850}
#page-inventarios .inv-kpi .val{font-size:23px;font-weight:950;color:#0b223a;line-height:1;margin-top:3px}
#page-inventarios .inv-kpi .meta{font-size:8.1px;margin-top:8px;color:#697786}
#page-inventarios .inv-kpi .meta.good{color:#15934c}.inv-kpi .meta.bad{color:#d63746}

#page-inventarios .inv-layout-top{display:grid;grid-template-columns:1.08fr .88fr .92fr;gap:10px;margin-bottom:10px}
#page-inventarios .inv-layout-mid{display:grid;grid-template-columns:1.08fr .88fr .92fr;gap:10px;margin-bottom:10px}
#page-inventarios .inv-layout-bottom{display:grid;grid-template-columns:1.45fr .95fr;gap:10px}
#page-inventarios .inv-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px;box-shadow:var(--shadow);min-width:0}
#page-inventarios .inv-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:8px}
#page-inventarios .inv-card-head h3{font-size:11.2px;margin:0}
#page-inventarios .inv-tabs{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:8px;overflow:hidden;margin-bottom:10px}
#page-inventarios .inv-tabs button{border:0;border-right:1px solid var(--line);background:#f7f9fb;padding:8px;font-size:8.3px}
#page-inventarios .inv-tabs button:last-child{border-right:0}
#page-inventarios .inv-tabs button.active{background:#0a2942;color:#fff;font-weight:850}

#page-inventarios .inv-form{display:grid;grid-template-columns:1fr 1fr;gap:9px}
#page-inventarios .if label{display:block;font-size:7.7px;font-weight:850;color:#566675;margin-bottom:4px}
#page-inventarios .if input,#page-inventarios .if select{width:100%;height:34px}
#page-inventarios .inv-form-actions{display:grid;grid-template-columns:1.15fr .6fr;gap:8px;margin-top:10px}

#page-inventarios .inv-donut-wrap{display:flex;align-items:center;gap:12px}
#page-inventarios .inv-donut{width:150px;height:150px;position:relative;flex:0 0 auto}
#page-inventarios .inv-donut canvas{width:150px;height:150px}
#page-inventarios .inv-donut-center{position:absolute;inset:0;display:grid;place-items:center;text-align:center;pointer-events:none}
#page-inventarios .inv-donut-center b{font-size:25px;line-height:1;color:#112b44}
#page-inventarios .inv-donut-center small{display:block;font-size:7.2px;color:#6c7985}
#page-inventarios .inv-legend{display:grid;gap:7px;font-size:8.1px;flex:1}
#page-inventarios .inv-legend div{display:grid;grid-template-columns:9px 1fr auto;gap:5px;align-items:center}
#page-inventarios .inv-dot{width:8px;height:8px;border-radius:50%}

#page-inventarios .loc-list{display:grid;gap:7px}
#page-inventarios .loc-row{display:grid;grid-template-columns:82px 1fr 64px;gap:8px;align-items:center;font-size:8.2px}
#page-inventarios .loc-bg{height:11px;border-radius:99px;background:#e6edf1;overflow:hidden}
#page-inventarios .loc-fill{height:100%;border-radius:99px}
#page-inventarios .loc-fill.red{background:#ef4451}.loc-fill.orange{background:#ff9d26}.loc-fill.yellow{background:#f1cb2f}.loc-fill.green{background:#1aad55}
#page-inventarios .state-pill{display:inline-flex;justify-content:center;border-radius:999px;padding:4px 7px;font-size:7px;font-weight:800}
#page-inventarios .state-pill.red{background:#fde9eb;color:#b42938}.state-pill.orange{background:#fff0dc;color:#a45c00}.state-pill.yellow{background:#fff7d9;color:#8b7000}.state-pill.green{background:#e6f7ec;color:#147c42}

#page-inventarios .inv-chart{height:190px}
#page-inventarios .value-bars{display:grid;gap:9px}
#page-inventarios .value-row{display:grid;grid-template-columns:95px 1fr 70px;gap:8px;align-items:center;font-size:8.2px}
#page-inventarios .value-bg{height:11px;background:#e6edf1;border-radius:99px;overflow:hidden}
#page-inventarios .value-fill{height:100%;border-radius:99px;background:linear-gradient(90deg,#176cca,#50a7f2)}
#page-inventarios .value-row b{text-align:right}

#page-inventarios .inv-table table{font-size:8px}
#page-inventarios .inv-table th{font-size:6.9px;padding:6px 5px}
#page-inventarios .inv-table td{padding:6px 5px}
#page-inventarios .alert-list{display:grid}
#page-inventarios .inv-alert{display:grid;grid-template-columns:18px 1fr auto 58px;gap:7px;align-items:center;padding:7px 0;border-bottom:1px solid #edf1f4;font-size:7.8px}
#page-inventarios .inv-alert .icoa{width:18px;height:18px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:8px;font-weight:900}
#page-inventarios .icoa.red{background:#e7404e}.icoa.orange{background:#f39a1f}.icoa.blue{background:#1e76d7}

@media(max-width:1400px){
 #page-inventarios .inv-kpis{grid-template-columns:repeat(3,1fr)}
 #page-inventarios .inv-layout-top,#page-inventarios .inv-layout-mid,#page-inventarios .inv-layout-bottom{grid-template-columns:1fr 1fr}
}
@media(max-width:860px){
 #page-inventarios .inv-kpis,#page-inventarios .inv-layout-top,#page-inventarios .inv-layout-mid,#page-inventarios .inv-layout-bottom,#page-inventarios .inv-form{grid-template-columns:1fr}
 #page-inventarios .inv-hero-inner{flex-direction:column;align-items:flex-start}
}

/* ---- next style block ---- */

/* ===== v18 · SOLO Inventarios + Auditorías: botones y acciones ===== */
#page-inventarios .view-link{
  border:1px solid #cdd9e3 !important;
  background:linear-gradient(180deg,#ffffff,#f5f8fa) !important;
  color:#0b5fae !important;
  padding:6px 10px !important;
  border-radius:8px !important;
  font-size:7.9px !important;
  font-weight:900 !important;
  display:inline-flex !important;
  align-items:center !important;
  gap:5px !important;
  box-shadow:0 3px 8px rgba(12,42,66,.06) !important;
  transition:.18s ease !important;
}
#page-inventarios .view-link:after{
  content:"→";
  font-size:11px;
  line-height:1;
}
#page-inventarios .view-link:hover{
  background:#0b2942 !important;
  color:#fff !important;
  border-color:#0b2942 !important;
  transform:translateY(-1px);
  box-shadow:0 7px 15px rgba(12,42,66,.14) !important;
}
#page-inventarios .inv-action-btn{
  border:1px solid var(--line);
  background:#fff;
  color:#173c5c;
  border-radius:7px;
  padding:5px 8px;
  font-size:7.7px;
  font-weight:850;
}
#page-inventarios .inv-action-btn:hover{background:#eef4f8}
#page-inventarios .inv-modal-summary{
  display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:12px
}
#page-inventarios .inv-modal-kpi{
  border:1px solid var(--line);border-radius:9px;padding:9px;background:#f8fafb
}
#page-inventarios .inv-modal-kpi span{display:block;font-size:7.6px;color:#6a7885}
#page-inventarios .inv-modal-kpi b{display:block;font-size:17px;color:#102b44;margin-top:3px}
@media(max-width:760px){
  #page-inventarios .inv-modal-summary{grid-template-columns:1fr 1fr}
}

/* ---- next style block ---- */

/* ===== v19 · SOLO módulo Servicios ===== */
#page-servicios .srv-hero{
  min-height:112px;padding:18px 22px;border-radius:14px;color:#fff;position:relative;overflow:hidden;
  background:
    linear-gradient(90deg,rgba(5,25,42,.97),rgba(7,34,57,.83) 48%,rgba(5,27,47,.58)),
    url("../img/hero-servicios.png") center center/cover no-repeat;
  box-shadow:var(--shadow2);margin-bottom:12px;
}
#page-servicios .srv-hero-inner{display:flex;justify-content:space-between;align-items:center;gap:18px;position:relative;z-index:1}
#page-servicios .srv-hero h2{margin:0 0 5px;font-size:26px;letter-spacing:-.45px}
#page-servicios .srv-hero p{margin:0;color:#d2dce4;font-size:11.5px}
#page-servicios .srv-new-btn{
  border:0;background:var(--lime);color:#071c2e;border-radius:8px;padding:11px 14px;
  font-size:9px;font-weight:950;box-shadow:0 8px 22px rgba(201,219,0,.18)
}
#page-servicios .srv-new-btn:hover{transform:translateY(-1px);filter:brightness(.98)}

#page-servicios .srv-kpis{display:grid;grid-template-columns:repeat(6,1fr);gap:9px;margin-bottom:12px}
#page-servicios .srv-kpi{background:#fff;border:1px solid var(--line);border-radius:12px;padding:11px 12px;box-shadow:var(--shadow);min-height:96px}
#page-servicios .srv-kpi-top{display:flex;align-items:center;gap:9px}
#page-servicios .srv-kpi-icon{width:40px;height:40px;border-radius:11px;display:grid;place-items:center;color:#fff;font-size:18px;font-weight:900}
#page-servicios .srv-kpi-icon.cyan{background:linear-gradient(135deg,#05a8ca,#26d0ec)}
#page-servicios .srv-kpi-icon.red{background:linear-gradient(135deg,#ef334b,#ff6372)}
#page-servicios .srv-kpi-icon.purple{background:linear-gradient(135deg,#4e46b8,#7066e8)}
#page-servicios .srv-kpi-icon.blue{background:linear-gradient(135deg,#176cca,#318ff1)}
#page-servicios .srv-kpi-icon.light{background:linear-gradient(135deg,#5b9ee7,#82bef4)}
#page-servicios .srv-kpi .lab{font-size:8.2px;color:#536273;font-weight:850}
#page-servicios .srv-kpi .val{font-size:23px;font-weight:950;color:#0b223a;line-height:1;margin-top:3px}
#page-servicios .srv-kpi .meta{font-size:8.1px;margin-top:8px;color:#697786}
#page-servicios .srv-kpi .meta.good{color:#15934c}.srv-kpi .meta.bad{color:#d63746}

#page-servicios .srv-top-grid{display:grid;grid-template-columns:.95fr .92fr 1.25fr;gap:10px;margin-bottom:10px}
#page-servicios .srv-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px;box-shadow:var(--shadow);min-width:0}
#page-servicios .srv-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:8px}
#page-servicios .srv-card-head h3{font-size:11.2px;margin:0}
#page-servicios .srv-donut-wrap{display:flex;align-items:center;gap:12px}
#page-servicios .srv-donut{width:160px;height:160px;position:relative;flex:0 0 auto}
#page-servicios .srv-donut canvas{width:160px;height:160px}
#page-servicios .srv-donut-center{position:absolute;inset:0;display:grid;place-items:center;text-align:center;pointer-events:none}
#page-servicios .srv-donut-center b{font-size:26px;line-height:1;color:#112b44}
#page-servicios .srv-donut-center small{display:block;font-size:7.3px;color:#6c7985}
#page-servicios .srv-legend{display:grid;gap:7px;font-size:8px;flex:1}
#page-servicios .srv-legend div{display:grid;grid-template-columns:9px 1fr auto;gap:5px;align-items:center}
#page-servicios .srv-dot{width:8px;height:8px;border-radius:50%}

#page-servicios .resource-list{display:grid;gap:8px}
#page-servicios .resource-row{display:grid;grid-template-columns:88px 1fr 34px;gap:8px;align-items:center;font-size:8.2px}
#page-servicios .resource-bg{height:11px;border-radius:99px;background:#e7edf1;overflow:hidden}
#page-servicios .resource-fill{height:100%;border-radius:99px;background:linear-gradient(90deg,#1c75d7,#4c9df0)}
#page-servicios .resource-fill.red{background:linear-gradient(90deg,#ef4050,#ff6672)}

#page-servicios .srv-chart{height:190px}
#page-servicios .srv-table-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 11px;box-shadow:var(--shadow);margin-bottom:10px}
#page-servicios .srv-toolbar{display:grid;grid-template-columns:auto 1fr auto auto auto;gap:8px;align-items:center;margin-bottom:8px}
#page-servicios .srv-tabs{display:flex;gap:5px;flex-wrap:wrap}
#page-servicios .srv-tabs button{
  border:1px solid var(--line);background:#f7f9fb;color:#455566;border-radius:8px;padding:7px 9px;font-size:7.9px;font-weight:800
}
#page-servicios .srv-tabs button.active{background:#0b2942;color:#fff;border-color:#0b2942}
#page-servicios .srv-search{display:flex;gap:7px;justify-content:flex-end}
#page-servicios .srv-search input{min-width:220px}
#page-servicios .srv-table table{font-size:7.9px}
#page-servicios .srv-table th{font-size:6.8px;padding:6px 5px}
#page-servicios .srv-table td{padding:6px 5px}
#page-servicios .progress-cell{display:flex;align-items:center;gap:6px;min-width:95px}
#page-servicios .pc-bg{height:9px;flex:1;border-radius:99px;background:#e5ebef;overflow:hidden}
#page-servicios .pc-fill{height:100%;border-radius:99px;background:#247edb}
#page-servicios .pc-fill.done{background:#18aa50}.pc-fill.warn{background:#f0a41c}
#page-servicios .srv-action{
  width:25px;height:25px;border:1px solid #d8e1e8;background:#fff;border-radius:7px;color:#173c5c;font-weight:900
}
#page-servicios .srv-action:hover{background:#edf4f8}

#page-servicios .srv-bottom-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}
#page-servicios .srv-mini-table table{font-size:7.7px}
#page-servicios .srv-mini-table th{font-size:6.7px;padding:5px 4px}
#page-servicios .srv-mini-table td{padding:5px 4px}
#page-servicios .srv-view{
  border:1px solid #cdd9e3;background:linear-gradient(180deg,#fff,#f5f8fa);color:#0b5fae;
  border-radius:8px;padding:6px 9px;font-size:7.7px;font-weight:900
}
#page-servicios .srv-view:hover{background:#0b2942;color:#fff;border-color:#0b2942}

#page-servicios .srv-filter-panel{
  display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:9px
}
#page-servicios .sf label{display:block;font-size:7.8px;font-weight:850;color:#526170;margin-bottom:4px}
#page-servicios .sf input,#page-servicios .sf select{width:100%;height:33px}
#page-servicios .srv-modal-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:10px}
#page-servicios .srv-modal-kpi{border:1px solid var(--line);background:#f8fafb;border-radius:9px;padding:9px}
#page-servicios .srv-modal-kpi span{display:block;font-size:7.5px;color:#6c7985}
#page-servicios .srv-modal-kpi b{display:block;font-size:17px;color:#112b44;margin-top:3px}

@media(max-width:1400px){
 #page-servicios .srv-kpis{grid-template-columns:repeat(3,1fr)}
 #page-servicios .srv-top-grid,#page-servicios .srv-bottom-grid{grid-template-columns:1fr 1fr}
 #page-servicios .srv-toolbar{grid-template-columns:1fr 1fr}
}
@media(max-width:860px){
 #page-servicios .srv-kpis,#page-servicios .srv-top-grid,#page-servicios .srv-bottom-grid,#page-servicios .srv-filter-panel{grid-template-columns:1fr}
 #page-servicios .srv-hero-inner{flex-direction:column;align-items:flex-start}
 #page-servicios .srv-toolbar{grid-template-columns:1fr}
}

/* ---- next style block ---- */

/* ===== v20 · SOLO módulo Subcontratación ===== */
#page-subcontratacion .sub-hero{
  min-height:112px;padding:18px 22px;border-radius:14px;color:#fff;position:relative;overflow:hidden;
  background:
    linear-gradient(90deg,rgba(5,25,42,.97),rgba(7,34,57,.83) 48%,rgba(5,27,47,.58)),
    url("../img/hero-subcontratacion.png") center center/cover no-repeat;
  box-shadow:var(--shadow2);margin-bottom:12px;
}
#page-subcontratacion .sub-hero-inner{display:flex;justify-content:space-between;align-items:center;gap:18px;position:relative;z-index:1}
#page-subcontratacion .sub-hero h2{margin:0 0 5px;font-size:26px;letter-spacing:-.45px}
#page-subcontratacion .sub-hero p{margin:0;color:#d2dce4;font-size:11.5px}
#page-subcontratacion .sub-new-btn{
  border:0;background:var(--lime);color:#071c2e;border-radius:8px;padding:11px 14px;
  font-size:9px;font-weight:950;box-shadow:0 8px 22px rgba(201,219,0,.18)
}
#page-subcontratacion .sub-new-btn:hover{transform:translateY(-1px);filter:brightness(.98)}

#page-subcontratacion .sub-kpis{display:grid;grid-template-columns:repeat(6,1fr);gap:9px;margin-bottom:12px}
#page-subcontratacion .sub-kpi{background:#fff;border:1px solid var(--line);border-radius:12px;padding:11px 12px;box-shadow:var(--shadow);min-height:96px}
#page-subcontratacion .sub-kpi-top{display:flex;align-items:center;gap:9px}
#page-subcontratacion .sub-kpi-icon{width:40px;height:40px;border-radius:11px;display:grid;place-items:center;color:#fff;font-size:18px;font-weight:900}
#page-subcontratacion .sub-kpi-icon.blue{background:linear-gradient(135deg,#176cca,#338ff0)}
#page-subcontratacion .sub-kpi-icon.green{background:linear-gradient(135deg,#0da64e,#27c16c)}
#page-subcontratacion .sub-kpi-icon.orange{background:linear-gradient(135deg,#ff7617,#ff9f2e)}
#page-subcontratacion .sub-kpi-icon.red{background:linear-gradient(135deg,#ee3449,#ff5b68)}
#page-subcontratacion .sub-kpi-icon.purple{background:linear-gradient(135deg,#7735df,#a659f1)}
#page-subcontratacion .sub-kpi .lab{font-size:8.2px;color:#536273;font-weight:850}
#page-subcontratacion .sub-kpi .val{font-size:23px;font-weight:950;color:#0b223a;line-height:1;margin-top:3px}
#page-subcontratacion .sub-kpi .meta{font-size:8.1px;margin-top:8px;color:#697786}
#page-subcontratacion .sub-kpi .meta.good{color:#15934c}.sub-kpi .meta.bad{color:#d63746}

#page-subcontratacion .sub-top-grid{display:grid;grid-template-columns:.95fr .96fr 1.22fr;gap:10px;margin-bottom:10px}
#page-subcontratacion .sub-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px;box-shadow:var(--shadow);min-width:0}
#page-subcontratacion .sub-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:8px}
#page-subcontratacion .sub-card-head h3{font-size:11.2px;margin:0}
#page-subcontratacion .sub-donut-wrap{display:flex;align-items:center;gap:12px}
#page-subcontratacion .sub-donut{width:160px;height:160px;position:relative;flex:0 0 auto}
#page-subcontratacion .sub-donut canvas{width:160px;height:160px}
#page-subcontratacion .sub-donut-center{position:absolute;inset:0;display:grid;place-items:center;text-align:center;pointer-events:none}
#page-subcontratacion .sub-donut-center b{font-size:26px;line-height:1;color:#112b44}
#page-subcontratacion .sub-donut-center small{display:block;font-size:7.3px;color:#6c7985}
#page-subcontratacion .sub-legend{display:grid;gap:7px;font-size:8px;flex:1}
#page-subcontratacion .sub-legend div{display:grid;grid-template-columns:9px 1fr auto;gap:5px;align-items:center}
#page-subcontratacion .sub-dot{width:8px;height:8px;border-radius:50%}

#page-subcontratacion .provider-list{display:grid;gap:8px}
#page-subcontratacion .provider-row{display:grid;grid-template-columns:105px 1fr 25px;gap:8px;align-items:center;font-size:8.2px}
#page-subcontratacion .provider-bg{height:11px;border-radius:99px;background:#e7edf1;overflow:hidden}
#page-subcontratacion .provider-fill{height:100%;border-radius:99px;background:linear-gradient(90deg,#176cca,#4e9ef1)}
#page-subcontratacion .provider-fill.warn{background:linear-gradient(90deg,#efae28,#ffc950)}
#page-subcontratacion .provider-fill.red{background:linear-gradient(90deg,#ef4050,#ff6672)}

#page-subcontratacion .sub-chart{height:190px}
#page-subcontratacion .sub-table-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 11px;box-shadow:var(--shadow);margin-bottom:10px}
#page-subcontratacion .sub-filterbar{display:grid;grid-template-columns:1.35fr .7fr .8fr .85fr .85fr auto auto auto;gap:7px;align-items:end;margin-bottom:8px}
#page-subcontratacion .sbf label{display:block;font-size:7.6px;font-weight:850;color:#536273;margin-bottom:4px}
#page-subcontratacion .sbf input,#page-subcontratacion .sbf select{width:100%;height:33px}
#page-subcontratacion .sub-table table{font-size:7.9px}
#page-subcontratacion .sub-table th{font-size:6.8px;padding:6px 5px}
#page-subcontratacion .sub-table td{padding:6px 5px}
#page-subcontratacion .sub-progress{display:flex;align-items:center;gap:6px;min-width:100px}
#page-subcontratacion .sp-bg{height:9px;flex:1;border-radius:99px;background:#e5ebef;overflow:hidden}
#page-subcontratacion .sp-fill{height:100%;border-radius:99px;background:#1c75d7}
#page-subcontratacion .sp-fill.good{background:#17a84f}.sp-fill.bad{background:#ef4050}
#page-subcontratacion .sub-action{
  width:25px;height:25px;border:1px solid #d8e1e8;background:#fff;border-radius:7px;color:#173c5c;font-weight:900
}
#page-subcontratacion .sub-action:hover{background:#edf4f8}

#page-subcontratacion .sub-bottom-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}
#page-subcontratacion .sub-mini-table table{font-size:7.7px}
#page-subcontratacion .sub-mini-table th{font-size:6.7px;padding:5px 4px}
#page-subcontratacion .sub-mini-table td{padding:5px 4px}
#page-subcontratacion .sub-view{
  border:1px solid #cdd9e3;background:linear-gradient(180deg,#fff,#f5f8fa);color:#0b5fae;
  border-radius:8px;padding:6px 9px;font-size:7.7px;font-weight:900
}
#page-subcontratacion .sub-view:hover{background:#0b2942;color:#fff;border-color:#0b2942}

#page-subcontratacion .sub-modal-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:10px}
#page-subcontratacion .sub-modal-kpi{border:1px solid var(--line);background:#f8fafb;border-radius:9px;padding:9px}
#page-subcontratacion .sub-modal-kpi span{display:block;font-size:7.5px;color:#6c7985}
#page-subcontratacion .sub-modal-kpi b{display:block;font-size:17px;color:#112b44;margin-top:3px}
#page-subcontratacion .sub-filter-panel{display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:9px}
#page-subcontratacion .sf label{display:block;font-size:7.8px;font-weight:850;color:#526170;margin-bottom:4px}
#page-subcontratacion .sf input,#page-subcontratacion .sf select{width:100%;height:33px}

@media(max-width:1400px){
 #page-subcontratacion .sub-kpis{grid-template-columns:repeat(3,1fr)}
 #page-subcontratacion .sub-top-grid,#page-subcontratacion .sub-bottom-grid{grid-template-columns:1fr 1fr}
 #page-subcontratacion .sub-filterbar{grid-template-columns:repeat(4,1fr)}
}
@media(max-width:860px){
 #page-subcontratacion .sub-kpis,#page-subcontratacion .sub-top-grid,#page-subcontratacion .sub-bottom-grid,#page-subcontratacion .sub-filterbar,#page-subcontratacion .sub-filter-panel{grid-template-columns:1fr}
 #page-subcontratacion .sub-hero-inner{flex-direction:column;align-items:flex-start}
}

/* ---- next style block ---- */

/* ===== v21 · SOLO módulo Despachos + POD OCR ===== */
#page-despachos .dsp-hero{
  min-height:112px;padding:18px 22px;border-radius:14px;color:#fff;position:relative;overflow:hidden;
  background:
    linear-gradient(90deg,rgba(5,25,42,.97),rgba(7,34,57,.83) 48%,rgba(5,27,47,.58)),
    url("../img/hero-despachos.png") center center/cover no-repeat;
  box-shadow:var(--shadow2);margin-bottom:12px;
}
#page-despachos .dsp-hero-inner{display:flex;justify-content:space-between;align-items:center;gap:18px;position:relative;z-index:1}
#page-despachos .dsp-hero h2{margin:0 0 5px;font-size:26px;letter-spacing:-.45px}
#page-despachos .dsp-hero p{margin:0;color:#d2dce4;font-size:11.5px}
#page-despachos .dsp-tag{background:var(--lime);color:#071c2e;border-radius:999px;padding:8px 11px;font-size:8.5px;font-weight:950}

#page-despachos .dsp-kpis{display:grid;grid-template-columns:repeat(6,1fr);gap:9px;margin-bottom:12px}
#page-despachos .dsp-kpi{background:#fff;border:1px solid var(--line);border-radius:12px;padding:11px 12px;box-shadow:var(--shadow);min-height:96px}
#page-despachos .dsp-kpi-top{display:flex;align-items:center;gap:9px}
#page-despachos .dsp-kpi-icon{width:40px;height:40px;border-radius:11px;display:grid;place-items:center;color:#fff;font-size:18px;font-weight:900}
#page-despachos .dsp-kpi-icon.blue{background:linear-gradient(135deg,#176cca,#338ff0)}
#page-despachos .dsp-kpi-icon.green{background:linear-gradient(135deg,#0da64e,#27c16c)}
#page-despachos .dsp-kpi-icon.purple{background:linear-gradient(135deg,#6536d8,#8a58ea)}
#page-despachos .dsp-kpi-icon.orange{background:linear-gradient(135deg,#ff7617,#ff9f2e)}
#page-despachos .dsp-kpi-icon.red{background:linear-gradient(135deg,#ee3449,#ff5b68)}
#page-despachos .dsp-kpi-icon.teal{background:linear-gradient(135deg,#05a7a4,#2ac9c5)}
#page-despachos .dsp-kpi .lab{font-size:8.2px;color:#536273;font-weight:850}
#page-despachos .dsp-kpi .val{font-size:23px;font-weight:950;color:#0b223a;line-height:1;margin-top:3px}
#page-despachos .dsp-kpi .meta{font-size:8.1px;margin-top:8px;color:#697786}
#page-despachos .dsp-kpi .meta.good{color:#15934c}.dsp-kpi .meta.bad{color:#d63746}

#page-despachos .dsp-top-grid{display:grid;grid-template-columns:.92fr 1.05fr 1.05fr;gap:10px;margin-bottom:10px}
#page-despachos .dsp-mid-grid{display:grid;grid-template-columns:.9fr .9fr 1.2fr;gap:10px;margin-bottom:10px}
#page-despachos .dsp-bottom-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px}
#page-despachos .dsp-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px;box-shadow:var(--shadow);min-width:0}
#page-despachos .dsp-card-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:8px}
#page-despachos .dsp-card-head h3{font-size:11.2px;margin:0}
#page-despachos .dsp-donut-wrap{display:flex;align-items:center;gap:12px}
#page-despachos .dsp-donut{width:160px;height:160px;position:relative;flex:0 0 auto}
#page-despachos .dsp-donut canvas{width:160px;height:160px}
#page-despachos .dsp-donut-center{position:absolute;inset:0;display:grid;place-items:center;text-align:center;pointer-events:none}
#page-despachos .dsp-donut-center b{font-size:26px;line-height:1;color:#112b44}
#page-despachos .dsp-donut-center small{display:block;font-size:7.3px;color:#6c7985}
#page-despachos .dsp-legend{display:grid;gap:7px;font-size:8px;flex:1}
#page-despachos .dsp-legend div{display:grid;grid-template-columns:9px 1fr auto;gap:5px;align-items:center}
#page-despachos .dsp-dot{width:8px;height:8px;border-radius:50%}
#page-despachos .dsp-chart{height:190px}

#page-despachos .pod-panel{display:grid;grid-template-columns:.9fr 1.1fr;gap:10px}
#page-despachos .pod-preview{border:1px solid var(--line);border-radius:9px;background:#f7f9fb;min-height:205px;display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative}
#page-despachos .pod-sheet{width:78%;height:170px;background:#fff;border:1px solid #cfd8e0;box-shadow:0 8px 18px rgba(12,38,61,.10);padding:10px}
#page-despachos .pod-line{height:4px;border-radius:99px;background:#dbe3e9;margin:5px 0}
#page-despachos .pod-box{height:62px;border:1px solid #d6dfe6;background:repeating-linear-gradient(0deg,#fff,#fff 10px,#e8edf1 11px);margin:7px 0}
#page-despachos .pod-fields{display:grid;gap:5px}
#page-despachos .pod-row{display:grid;grid-template-columns:96px 1fr;gap:7px;padding:4px 0;border-bottom:1px solid #edf1f4;font-size:8px}
#page-despachos .pod-row span{color:#667582}.pod-row b{color:#14324d}
#page-despachos .ocr-ok{display:inline-flex;padding:5px 8px;border-radius:999px;background:#e8f8ed;color:#118644;font-size:7.7px;font-weight:850}

#page-despachos .upload-zone{min-height:190px;border:1.5px dashed #aebfce;border-radius:10px;background:linear-gradient(180deg,#fbfcfd,#f7f9fb);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:16px}
#page-despachos .upload-zone .up-icon{width:52px;height:52px;border-radius:17px;background:#eaf2ff;color:#176ccb;display:grid;place-items:center;font-size:25px;margin-bottom:8px}
#page-despachos .upload-zone b{font-size:11px}.upload-zone .sub{max-width:260px}
#page-despachos .dsp-filter-panel{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}
#page-despachos .dfx label{display:block;font-size:7.6px;font-weight:850;color:#536273;margin-bottom:4px}
#page-despachos .dfx input,#page-despachos .dfx select{width:100%;height:33px}
#page-despachos .dsp-filter-actions{display:flex;gap:7px;margin-top:10px}

#page-despachos .evidence-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
#page-despachos .evidence-card{border:1px solid var(--line);border-radius:8px;overflow:hidden;background:#fff}
#page-despachos .evidence-thumb{height:85px;background:linear-gradient(145deg,#dbe5ec,#eef3f6);display:grid;place-items:center;color:#43617a;font-size:22px;position:relative}
#page-despachos .evidence-card .cap{padding:6px;font-size:7.2px}
#page-despachos .evidence-card .cap b{display:block;font-size:7.8px;color:#17344f}

#page-despachos .dsp-table-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 11px;box-shadow:var(--shadow);margin-bottom:10px}
#page-despachos .dsp-table-toolbar{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px}
#page-despachos .dsp-table-toolbar h3{margin:0;font-size:11.2px}
#page-despachos .dsp-table-actions{display:flex;gap:7px;flex-wrap:wrap}
#page-despachos .dsp-table table{font-size:7.9px}
#page-despachos .dsp-table th{font-size:6.8px;padding:6px 5px}
#page-despachos .dsp-table td{padding:6px 5px}
#page-despachos .dsp-action{width:25px;height:25px;border:1px solid #d8e1e8;background:#fff;border-radius:7px;color:#173c5c;font-weight:900}
#page-despachos .dsp-action:hover{background:#edf4f8}
#page-despachos .dsp-view{border:1px solid #cdd9e3;background:linear-gradient(180deg,#fff,#f5f8fa);color:#0b5fae;border-radius:8px;padding:6px 9px;font-size:7.7px;font-weight:900}
#page-despachos .dsp-view:hover{background:#0b2942;color:#fff;border-color:#0b2942}

#page-despachos .dsp-modal-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:10px}
#page-despachos .dsp-modal-kpi{border:1px solid var(--line);background:#f8fafb;border-radius:9px;padding:9px}
#page-despachos .dsp-modal-kpi span{display:block;font-size:7.5px;color:#6c7985}
#page-despachos .dsp-modal-kpi b{display:block;font-size:17px;color:#112b44;margin-top:3px}
#page-despachos .dsp-mini-table table{font-size:7.7px}
#page-despachos .dsp-mini-table th{font-size:6.7px;padding:5px 4px}
#page-despachos .dsp-mini-table td{padding:5px 4px}

@media(max-width:1400px){
 #page-despachos .dsp-kpis{grid-template-columns:repeat(3,1fr)}
 #page-despachos .dsp-top-grid,#page-despachos .dsp-mid-grid,#page-despachos .dsp-bottom-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:860px){
 #page-despachos .dsp-kpis,#page-despachos .dsp-top-grid,#page-despachos .dsp-mid-grid,#page-despachos .dsp-bottom-grid,#page-despachos .dsp-filter-panel{grid-template-columns:1fr}
 #page-despachos .dsp-hero-inner{flex-direction:column;align-items:flex-start}
 #page-despachos .pod-panel{grid-template-columns:1fr}
 #page-despachos .evidence-grid{grid-template-columns:1fr 1fr}
}

/* ---- next style block ---- */

/* ===== v22 · SOLO ajuste visual de fotos/POD en Despachos ===== */
#page-despachos .pod-preview{
  background:#f5f8fa !important;
  padding:8px !important;
  min-height:205px !important;
}
#page-despachos .pod-preview .pod-ref-img{
  width:100% !important;
  height:205px !important;
  object-fit:contain !important;
  display:block !important;
  border-radius:7px !important;
  background:#fff !important;
  border:1px solid #d7e0e7 !important;
  box-shadow:0 6px 18px rgba(12,38,61,.08) !important;
}
#page-despachos .evidence-thumb{
  height:94px !important;
  background:#eef3f6 !important;
  overflow:hidden !important;
  position:relative !important;
}
#page-despachos .evidence-thumb img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  display:block !important;
  transition:transform .2s ease !important;
}
#page-despachos .evidence-card:hover .evidence-thumb img{transform:scale(1.035)}
#page-despachos .evidence-expand{
  position:absolute;right:5px;bottom:5px;
  width:22px;height:22px;border-radius:6px;
  display:grid;place-items:center;
  background:rgba(255,255,255,.92);
  color:#12334e;font-size:10px;font-weight:900;
  border:1px solid rgba(18,51,78,.12);
}
#page-despachos .evidence-card .cap{
  min-height:40px;
  background:#fff;
}

/* ---- next style block ---- */

#page-pendientes .p23-hero{min-height:112px;padding:18px 22px;border-radius:14px;color:#fff;overflow:hidden;background:linear-gradient(90deg,rgba(5,25,42,.97),rgba(7,34,57,.82) 48%,rgba(5,27,47,.58)),url("../img/hero-pendientes.png") center/cover no-repeat;box-shadow:var(--shadow2);margin-bottom:12px}
#page-pendientes .p23-hero-inner{display:flex;justify-content:space-between;align-items:center;gap:18px}
#page-pendientes .p23-hero h2{margin:0 0 5px;font-size:27px} #page-pendientes .p23-hero p{margin:0;color:#d2dce4;font-size:11.5px}
#page-pendientes .p23-tag{background:var(--lime);color:#071c2e;border-radius:999px;padding:8px 11px;font-size:8.5px;font-weight:950}
#page-pendientes .p23-kpis{display:grid;grid-template-columns:repeat(5,1fr);gap:9px;margin-bottom:12px}
#page-pendientes .p23-kpi{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 13px;box-shadow:var(--shadow);min-height:96px}
#page-pendientes .p23-kpi span{font-size:8.2px;color:#596a79;font-weight:850} #page-pendientes .p23-kpi b{display:block;font-size:24px;color:#0b223a;margin-top:5px}
#page-pendientes .p23-top{display:grid;grid-template-columns:.95fr 1fr 1fr;gap:10px;margin-bottom:10px}
#page-pendientes .p23-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px;box-shadow:var(--shadow);min-width:0}
#page-pendientes .p23-card h3{font-size:11.2px;margin:0 0 8px}
#page-pendientes .p23-donut-wrap{display:flex;align-items:center;gap:12px} #page-pendientes .p23-donut{width:150px;height:150px;position:relative;flex:0 0 auto}
#page-pendientes .p23-donut canvas{width:150px;height:150px} #page-pendientes .p23-center{position:absolute;inset:0;display:grid;place-items:center;text-align:center;pointer-events:none}
#page-pendientes .p23-center b{font-size:26px;color:#112b44} #page-pendientes .p23-center small{display:block;font-size:7px;color:#6c7985}
#page-pendientes .p23-legend{display:grid;gap:7px;font-size:8px;flex:1} #page-pendientes .p23-legend div{display:grid;grid-template-columns:9px 1fr auto;gap:5px;align-items:center} #page-pendientes .p23-dot{width:8px;height:8px;border-radius:50%}
#page-pendientes .p23-chart{height:180px}
#page-pendientes .p23-due-item{display:grid;grid-template-columns:44px 1fr auto;gap:8px;align-items:center;padding:7px 0;border-bottom:1px solid #edf1f4;font-size:8px}
#page-pendientes .p23-date{width:38px;height:38px;border-radius:8px;background:#f3f6f8;display:grid;place-items:center;text-align:center}
#page-pendientes .p23-filter{display:grid;grid-template-columns:1.3fr .8fr .8fr .7fr 1fr auto auto auto;gap:7px;align-items:end;background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px;box-shadow:var(--shadow);margin-bottom:8px}
#page-pendientes .p23-f label{display:block;font-size:7.6px;font-weight:850;color:#536273;margin-bottom:4px} #page-pendientes .p23-f input,#page-pendientes .p23-f select{width:100%;height:33px}
#page-pendientes .p23-tabs{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:8px} #page-pendientes .p23-tabs button{border:1px solid var(--line);background:#f7f9fb;border-radius:8px;padding:7px 10px;font-size:7.9px;font-weight:850}
#page-pendientes .p23-tabs button.active{background:#0b2942;color:#fff;border-color:#0b2942}
#page-pendientes .p23-main{display:grid;grid-template-columns:1fr .3fr;gap:10px} #page-pendientes .p23-table{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px;box-shadow:var(--shadow)}
#page-pendientes .p23-table table{font-size:7.9px} #page-pendientes .p23-work{display:grid;gap:8px} #page-pendientes .p23-work-row{display:grid;grid-template-columns:78px 1fr 20px;gap:8px;align-items:center;font-size:8px}
#page-pendientes .p23-barbg{height:10px;border-radius:99px;background:#e7edf1;overflow:hidden} #page-pendientes .p23-bar{height:100%;border-radius:99px;background:#438ee0}
#page-pendientes .p23-view{border:1px solid #cdd9e3;background:#fff;color:#0b5fae;border-radius:8px;padding:6px 9px;font-size:7.7px;font-weight:900}
@media(max-width:1400px){#page-pendientes .p23-kpis{grid-template-columns:repeat(3,1fr)}#page-pendientes .p23-top{grid-template-columns:1fr 1fr}#page-pendientes .p23-main{grid-template-columns:1fr}}
@media(max-width:860px){#page-pendientes .p23-kpis,#page-pendientes .p23-top,#page-pendientes .p23-filter{grid-template-columns:1fr}}

/* ---- next style block ---- */
body{font-family:Arial;padding:28px}table{border-collapse:collapse;width:100%;font-size:11px}th,td{border:1px solid #ddd;padding:7px}th{background:#eef3f7}