/* Portal del Fr8Partner. Sin fuentes externas: misma pila que el ERP. */
:root{
  /* MARKSMAN — Charcoal / Electric Orange / Industrial + Cloud Grey */
  --marksman-charcoal:#1e1e1e;
  --marksman-orange:#ea5e27;
  --marksman-industrial:#484848;
  --marksman-cloud:#efefef;
  --font-brand-primary:"New Black Typeface", Inter, ui-sans-serif, system-ui, sans-serif;
  --font-brand-secondary:"Lenia Mono", ui-monospace, SFMono-Regular, Consolas, monospace;
  --paper:var(--marksman-cloud); --panel:#F6F6F5; --panel2:#FFFFFF;
  --ink:var(--marksman-charcoal); --ink2:var(--marksman-industrial); --muted:#767674; --control-muted:#6A6A68;
  --line:#D6D6D3; --lineSoft:#E4E4E1; --accent:var(--marksman-orange); --accentSoft:#FBE4DA;
  --go:#2F7D4F; --warn:#7a5310; --stop:#C0392B;
  --goBg:#E3F0E8; --warnBg:#F5EAD2; --stopBg:#F6DDD8;
}
/* Oscuro solo por elección del usuario; por defecto claro. */
:root[data-theme="dark"]{
  --paper:#171717; --panel:var(--marksman-charcoal); --panel2:#262626;
  --ink:var(--marksman-cloud); --ink2:#C2C2C0; --muted:#8C8C8A; --control-muted:#91918F;
  --line:#343434; --lineSoft:#2A2A2A; --accent:var(--marksman-orange); --accentSoft:#3A2016;
  --go:#5FB884; --warn:#D0A24A; --stop:#E07A6E;
  --goBg:#16281D; --warnBg:#2A2114; --stopBg:#2C1A16; }
*{box-sizing:border-box}
body{margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--font-brand-primary);
  font-size:14px; line-height:1.55;}
.num{font-family:var(--font-brand-secondary); font-variant-numeric:tabular-nums;}
.top{border-bottom:1px solid var(--line); background:var(--panel);}
.ti{max-width:1080px; margin:0 auto; padding:14px 22px; display:flex; justify-content:space-between; align-items:center;}
.brand-logo{display:inline-flex; align-items:center; min-width:0; flex:1 1 420px; max-width:520px;}
.brand-logo img{flex:1 1 0; min-width:0; max-height:24px; height:auto; width:100%; object-fit:contain;
  object-position:left center; display:block;}
.brand-logo .logo-d{display:none;}
:root[data-theme="dark"] .brand-logo .logo-l{display:none;}
:root[data-theme="dark"] .brand-logo .logo-d{display:block;}
.brand-prog{margin-left:12px; padding-left:12px; border-left:1px solid var(--line);
  font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); font-weight:600;
  flex:0 0 auto; white-space:nowrap;}
.who{display:flex; gap:12px; align-items:center; min-width:0; flex:0 1 auto; flex-wrap:wrap;}
.quien{font-family:var(--font-brand-secondary); font-size:12.5px; color:var(--muted);
  min-width:0; overflow-wrap:anywhere;}
.wrap{max-width:1080px; margin:0 auto; padding:24px 22px 70px;}
h1{font-size:27px; letter-spacing:-.02em; margin:0 0 8px;}
h2{font-size:20px; letter-spacing:-.015em; margin:0;}
.lede{color:var(--ink2); max-width:60ch;}
.sub{color:var(--muted); max-width:70ch; font-size:13px; margin:6px 0 16px;}
.card{border:1px solid var(--line); background:var(--panel); padding:20px; border-radius:2px;}
.entrar{text-align:center; max-width:520px; margin:40px auto;}
.aviso{max-width:600px; margin:40px auto; border-left:3px solid var(--warn);}
.subject{display:block; font-family:var(--font-brand-secondary); font-size:15px; background:var(--panel2);
  border:1px solid var(--line); padding:12px 14px; margin:14px 0; word-break:break-all; color:var(--accent);}
.btn{font:inherit; font-size:13px; cursor:pointer; color:var(--ink); background:var(--panel2);
  border:1px solid var(--line); border-radius:2px; padding:7px 14px;}
.btn:hover:not(:disabled),.btn:active:not(:disabled){
  background:var(--accentSoft); border-color:var(--accent); color:var(--ink);
}
.btn:active:not(:disabled){box-shadow:inset 0 0 0 1px var(--accent);}
.btn.primary{background:var(--accent); border-color:var(--accent); color:var(--marksman-charcoal);}
.btn.primary:hover:not(:disabled),.btn.primary:active:not(:disabled){
  background:var(--accent); border-color:var(--marksman-charcoal); color:var(--marksman-charcoal);
  box-shadow:inset 0 0 0 1px var(--marksman-charcoal);
}
.btn.danger:hover:not(:disabled),.btn.danger:active:not(:disabled){
  background:var(--panel2); border-color:var(--stop); color:var(--stop);
}
.btn:disabled{
  background:var(--panel); border-color:var(--line); color:var(--ink2);
  cursor:not-allowed; opacity:1;
}
.btn.grande{font-size:15px; padding:10px 22px; margin-top:8px;}
.btn:focus-visible{outline:2px solid var(--accent); outline-offset:2px;}
.tabs{display:flex; gap:0; border-bottom:1px solid var(--line); margin-bottom:22px;}
.tabs button{appearance:none; background:none; border:none; border-bottom:2px solid transparent;
  font:inherit; font-size:14px; color:var(--control-muted); cursor:pointer; padding:10px 16px;}
.tabs button:hover:not(:disabled),.tabs button:active:not(:disabled){color:var(--ink);}
.tabs button:focus-visible{outline:2px solid var(--accent); outline-offset:-2px; color:var(--ink);}
.tabs button[aria-selected="true"]{color:var(--ink); border-bottom-color:var(--accent); font-weight:600;}
.tabs button:disabled{background:var(--lineSoft); color:var(--ink2); cursor:not-allowed; opacity:1;}
.panel{display:none;} .panel.on{display:block;}
.barra{display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:4px;}
.barra.sub2{margin:18px 0 4px;} .barra.sub2 h4{margin:0; font-size:13px;}
.editor{margin-top:20px; border-left:3px solid var(--accent);}
.editorActions{position:sticky; top:0; z-index:2; margin:-8px -8px 8px; padding:8px;
  background:var(--panel); border-bottom:1px solid var(--lineSoft);}
.cols2{display:grid; grid-template-columns:1fr 1fr; gap:14px; margin:8px 0 4px;}
.f{display:flex; flex-direction:column; gap:4px; font-size:12.5px; color:var(--ink2);}
.f span{font-weight:500;}
input,select{font:inherit; font-size:13px; color:var(--ink); background:var(--panel2);
  border:1px solid var(--line); border-radius:2px; padding:6px 8px;}
input[type=number]{font-family:var(--font-brand-secondary); text-align:right;}
input:focus,select:focus{outline:2px solid var(--accent); outline-offset:-1px;}
.tscroll{overflow-x:auto;}
table{border-collapse:separate; border-spacing:0; width:100%; font-size:13px;}
.srOnly{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden;
  clip:rect(0,0,0,0); white-space:nowrap; border:0;}
th,td{padding:6px 9px; border-bottom:1px solid var(--lineSoft); white-space:nowrap; text-align:right;}
th.t,td.t{text-align:left;} th.num,td.num{text-align:right;}
th{font-size:9.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); font-weight:600;
  background:var(--panel2); border-bottom:1px solid var(--line);}
td.num,td input[type=number]{font-family:var(--font-brand-secondary);}
#tRutasEditor input[type=number]{width:64px;} #tRutasEditor input[type=text]{min-width:110px;}
.chip{display:inline-block; font-size:10px; letter-spacing:.08em; text-transform:uppercase; font-weight:600;
  padding:2px 7px; border:1px solid transparent; border-radius:2px;}
.chip.go{background:var(--goBg); color:var(--go);} .chip.warn{background:var(--warnBg); color:var(--warn);}
.chip.stop{background:var(--stopBg); color:var(--stop);}
.chip.mute{background:var(--panel2); color:var(--muted); border-color:var(--line);}
.tiles{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:1px;
  background:var(--line); border:1px solid var(--line); margin:16px 0 0;}
.tile{background:var(--panel2); padding:12px 14px;}
.tile .k{font-size:9.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted);}
.tile .v{font-family:var(--font-brand-secondary); font-size:19px; font-weight:500; margin-top:2px;}
.tile .n{font-size:11px; color:var(--muted); margin-top:1px;}
.pend{border-left:3px solid var(--warn); background:var(--warnBg); padding:10px 13px; margin-top:14px;
  font-size:13px; color:var(--ink2);}
.resumen{margin-top:4px;}
.captureSummary{border:1px solid var(--line); background:var(--panel2); color:var(--ink2);
  padding:10px 12px; margin-top:10px; font-size:12.5px; line-height:1.5;}
.captureSummary strong{color:var(--ink); font-weight:600;}
.captureSummaryState{display:block; margin-top:3px; color:var(--muted);}
.captureSummary[data-tone="success"]{border-left:3px solid var(--go); background:var(--goBg);}
.captureSummary[data-tone="success"] .captureSummaryState{color:var(--go);}
.captureSummary[data-tone="warning"]{border-left:3px solid var(--warn); background:var(--warnBg);}
.captureSummary[data-tone="warning"] .captureSummaryState{color:var(--warn);}
.acks{display:flex; gap:8px; align-items:center; margin-top:16px; flex-wrap:wrap;}
.msgBar{display:flex; align-items:center; gap:10px; flex-wrap:wrap;}
.msgBar .msg{flex:1 1 280px;}
.msg{font-size:12.5px; color:var(--accent); min-height:16px; margin:8px 0 0;}
.msg[data-tone="success"]{color:var(--go);}
.msg[data-tone="warning"]{color:var(--warn);}
.msg[data-tone="error"]{color:var(--stop);}
.loadState{display:flex; align-items:center; gap:10px; min-height:38px; flex-wrap:wrap;}
.loadState .msg{margin-top:0; flex:1 1 280px;}
[aria-busy="true"]{cursor:progress;}

/* Wizard de captura por plantilla */
.wizard{border:1px solid var(--line); background:var(--panel2); padding:16px; margin:16px 0 0; border-radius:2px;}
.wizStep{padding:12px 0; border-bottom:1px dotted var(--lineSoft);}
.wizStep:last-of-type{border-bottom:none;}
.wizStep h4{margin:0 0 8px; font-size:13px; color:var(--accent);}
.wizList{margin:0; padding-left:18px; font-size:13.5px; color:var(--ink2); line-height:1.7;}
.wizOk{display:inline-flex; gap:8px; align-items:center; margin-top:10px; font-size:13.5px; cursor:pointer;}
.wizOk input{width:auto;}
#wizManual{margin-top:12px; font-size:12px;}
.wizStep[data-step]:not(.on){opacity:.45;}
.wizStep.on{opacity:1;}

/* Controles y superficies alineados con la consola operativa. */
.ti{max-width:1160px; padding:18px 28px;}
.wrap{max-width:1160px; padding:32px 28px 84px;}
h1{font-size:30px;}
h2{font-size:22px;}
.sub{font-size:14px; line-height:1.55;}
.card{padding:24px;}
.btn{min-height:38px; padding:8px 15px; font-size:13.5px; font-weight:500;}
.tabs button{min-height:44px; padding:11px 17px;}
input,select{min-height:38px; padding:8px 10px; font-size:13.5px;}
th,td{padding:8px 10px;}
.tiles{grid-template-columns:repeat(auto-fit,minmax(170px,1fr));}
.tile{padding:16px 18px; min-height:100px;}
.tile .k{font-size:10.5px;}
.tile .v{font-size:20px; margin-top:5px;}
.tile .n{font-size:12px; margin-top:4px;}
.wizard{padding:20px;}

@media (max-width:640px){
  .ti,.wrap{padding-left:16px; padding-right:16px;}
  .ti{align-items:flex-start; gap:12px; flex-direction:column;}
  .brand-logo{width:100%; max-width:100%; flex:0 1 auto;}
  .who{width:100%; justify-content:space-between;}
  h1{font-size:25px;}
  .card{padding:18px;}
  .cols2{grid-template-columns:1fr;}
  .editorActions{margin:-6px -6px 8px; padding:6px;}
}