/* =====================================================================
   Ladin Cloud ERP — Sistema de diseño (basado en el prototipo ERP_v2.html)
   ===================================================================== */
:root {
  --blue-900:#0D2137;--blue-700:#1A4A7A;--blue-500:#1E6FBF;--blue-400:#3B8FDF;
  --blue-100:#E8F2FB;--blue-50:#F4F9FE;--slate-800:#1E2A38;--slate-700:#2D3E50;--slate-600:#3D5166;
  --slate-500:#5A7189;--slate-400:#7A93AC;--slate-300:#A5B8CB;--slate-200:#C8D8E8;--slate-100:#EDF2F7;--white:#FFFFFF;
  --green-500:#1A9E6A;--green-100:#E6F7F1;--amber-500:#D97706;--amber-100:#FEF3C7;
  --red-500:#DC2626;--red-100:#FEE2E2;--purple-500:#7C3AED;--purple-100:#EDE9FE;
  --teal-500:#00838F;--teal-100:#E0F7FA;--orange-500:#E65100;--orange-100:#FFF3E0;
  --radius-sm:6px;--radius-md:10px;--shadow-sm:0 1px 3px rgba(13,33,55,.08);
  --shadow-md:0 4px 12px rgba(13,33,55,.10);--font-main:'Inter',sans-serif;
  --font-display:'DM Sans',sans-serif;
  --ease-out:cubic-bezier(0.23,1,0.32,1);--ease-drawer:cubic-bezier(0.32,0.72,0,1);
  --t-presion:scale 160ms var(--ease-out),background-color .15s ease,color .15s ease,border-color .15s ease,box-shadow .15s ease;
  --modal-escala:.96;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--font-main);background:var(--blue-50);color:var(--slate-800);font-size:14px;line-height:1.5}
button{cursor:pointer;border:none;font-family:inherit}
input,select,textarea{font-family:inherit}
a{color:var(--blue-500)}
:focus-visible{outline:2px solid var(--blue-400);outline-offset:2px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}

/* ---------------- LAYOUT ---------------- */
.app{display:flex;height:100vh;overflow:hidden}

.sidebar{width:224px;flex-shrink:0;background:var(--blue-900);display:flex;flex-direction:column;overflow-y:auto}
.sidebar-brand{padding:22px 20px 18px;border-bottom:1px solid rgba(255,255,255,.08)}
.brand-logo{display:flex;align-items:center;gap:10px}
.brand-icon{width:36px;height:36px;border-radius:var(--radius-sm);background:var(--blue-500);display:flex;align-items:center;justify-content:center;font-size:18px}
.brand-name{font-family:var(--font-display);font-weight:600;color:var(--white);font-size:15px;line-height:1.2}
.brand-sub{font-size:11px;color:var(--slate-400)}
.sidebar-section{padding:16px 12px 4px}
.sidebar-label{font-size:10.5px;font-weight:600;color:var(--slate-400);letter-spacing:.06em;padding:0 8px;margin-bottom:4px;text-transform:uppercase}
.nav-item{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:var(--radius-sm);color:var(--slate-400);font-size:13.5px;cursor:pointer;margin-bottom:2px;text-decoration:none}
.nav-item.active{background:var(--blue-500);color:var(--white);font-weight:500}
.nav-icon{width:18px;text-align:center;font-size:15px}
.nav-badge{margin-left:auto;background:var(--blue-400);color:var(--white);font-size:10px;padding:1px 6px;border-radius:20px}
.sidebar-footer{margin-top:auto;padding:16px 12px;border-top:1px solid rgba(255,255,255,.08)}
.user-pill{display:flex;align-items:center;gap:10px;padding:8px}
.user-avatar{width:30px;height:30px;border-radius:50%;background:var(--blue-500);color:var(--white);display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:600;flex-shrink:0}
.user-name{font-size:13px;color:var(--white);font-weight:500}
.user-role{font-size:11px;color:var(--slate-400)}
.btn-logout{width:100%;margin-top:6px;background:transparent;color:var(--slate-400);border:1px solid rgba(255,255,255,.12);border-radius:var(--radius-sm);padding:7px 10px;font-size:12.5px;display:flex;align-items:center;justify-content:center;gap:6px}

.main{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0}
.topbar{background:var(--white);border-bottom:1px solid var(--slate-200);padding:0 28px;height:58px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0;gap:12px}
.topbar-left{display:flex;align-items:center;gap:12px;min-width:0}
.page-title{font-family:var(--font-display);font-size:17px;font-weight:600;color:var(--slate-800)}
.page-crumb{font-size:12.5px;color:var(--slate-400)}
.topbar-right{display:flex;align-items:center;gap:10px}
.btn-menu{display:none;background:transparent;font-size:20px;color:var(--slate-600);padding:4px 6px;border-radius:var(--radius-sm)}
.content{flex:1;overflow-y:auto;padding:24px 28px}
.sidebar-backdrop{display:none}

/* ---------------- BOTONES ---------------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:8px 14px;border-radius:var(--radius-sm);font-size:13px;font-weight:500;text-decoration:none}
.btn-primary{background:var(--blue-500);color:var(--white)}
.btn-ghost{background:transparent;color:var(--slate-600);border:1px solid var(--slate-200)}
.btn-sm{padding:5px 10px;font-size:12px}
.btn-lg{padding:11px 18px;font-size:14px}
.btn-block{width:100%}
.btn-green{background:var(--green-500);color:var(--white)}
.btn[disabled]{opacity:.6;cursor:not-allowed}
.spinner{width:14px;height:14px;border:2px solid rgba(255,255,255,.4);border-top-color:var(--white);border-radius:50%;animation:girar .7s linear infinite}
@keyframes girar{to{transform:rotate(360deg)}}

/* ---------------- RESPUESTA AL TOQUE ---------------- */
.btn,.action-btn,.nav-item,.btn-logout,.client-type-btn,.add-envio-btn,.modal-cerrar,.btn-icono,.input-toggle,.tab,.segmented-btn,.btn-menu{transition:var(--t-presion);-webkit-tap-highlight-color:transparent}
:is(.btn,.action-btn,.nav-item,.btn-logout,.client-type-btn,.add-envio-btn,.modal-cerrar,.btn-icono,.input-toggle,.tab,.segmented-btn,.btn-menu):active:not(:disabled){scale:.97}

/* Solo con mouse: en pantallas táctiles el :hover se queda pegado después de tocar */
@media (hover:hover) and (pointer:fine){
  .nav-item:not(.active):hover{background:rgba(255,255,255,.06);color:var(--white)}
  .btn-logout:hover{background:rgba(255,255,255,.06);color:var(--white)}
  .btn-primary:hover{background:var(--blue-700)}
  .btn-ghost:hover{background:var(--slate-100)}
  .btn-green:hover{background:#147a52}
  .btn-danger:hover{background:#b91c1c}
  .btn-icono:hover{background:var(--red-100)}
  .input-toggle:hover{background:var(--blue-100)}
  .action-btn:hover{background:var(--blue-100);color:var(--blue-500);border-color:var(--blue-400)}
  .modal-cerrar:hover{background:var(--slate-100)}
  .client-type-btn:not(.selected):hover{border-color:var(--blue-400);background:var(--blue-50)}
  .add-envio-btn:hover{border-color:var(--blue-400);color:var(--blue-500);background:var(--blue-50)}
  .tab:not(.active):hover{color:var(--slate-800)}
  .password-temporal .btn-ghost:hover{background:rgba(255,255,255,.1)}
}

/* ---------------- CARDS ---------------- */
.card{background:var(--white);border-radius:var(--radius-md);padding:20px;box-shadow:var(--shadow-sm);border:1px solid var(--slate-200)}
.card-title{font-family:var(--font-display);font-size:14px;font-weight:600;color:var(--slate-800);margin-bottom:14px;display:flex;align-items:center;justify-content:space-between}

/* ---------------- FORMULARIOS ---------------- */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form-full{grid-column:1/-1}
.form-group{display:flex;flex-direction:column;gap:5px}
.form-label{font-size:12px;font-weight:600;color:var(--slate-600)}
.form-label span{color:var(--red-500)}
.form-input,.form-select{border:1.5px solid var(--slate-200);border-radius:var(--radius-sm);padding:9px 12px;font-size:13.5px;color:var(--slate-800);outline:none;transition:border .15s;background:var(--white);width:100%}
.form-input:focus,.form-select:focus{border-color:var(--blue-400);box-shadow:0 0 0 3px rgba(30,111,191,.10)}
.form-input[readonly]{background:var(--slate-100);color:var(--slate-500)}
.form-input[aria-invalid="true"]{border-color:var(--red-500)}
.form-hint{font-size:11px;color:var(--slate-400)}
.form-error{font-size:11.5px;color:var(--red-500)}
.input-wrap{position:relative}
.input-wrap .form-input{padding-right:64px}
.input-toggle{position:absolute;right:6px;top:50%;transform:translateY(-50%);background:transparent;color:var(--blue-500);font-size:12px;font-weight:600;padding:4px 8px;border-radius:var(--radius-sm)}

/* ---------------- ALERTAS ---------------- */
.alert{display:block;padding:10px 12px;border-radius:var(--radius-sm);font-size:13px;line-height:1.4}
.alert-error{background:var(--red-100);color:var(--red-500)}
.alert-info{background:var(--blue-100);color:var(--blue-700)}
.alert-warn{background:var(--amber-100);color:var(--amber-500)}
.alert-success{background:var(--green-100);color:var(--green-500)}

/* ---------------- PILLS ---------------- */
.pill{display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:20px;font-size:11.5px;font-weight:500}
.pill-aprobado{background:var(--green-100);color:var(--green-500)}
.pill-logistica{background:var(--blue-100);color:var(--blue-500)}
.pill-transito{background:var(--purple-100);color:var(--purple-500)}
.pill-facturacion{background:var(--amber-100);color:var(--amber-500)}
.pill-pagado{background:var(--teal-100);color:var(--teal-500)}
.pill-entregado{background:var(--slate-100);color:var(--slate-600)}
.pill-compra{background:var(--orange-100);color:var(--orange-500)}

/* ---------------- ESTADOS DE PANTALLA ---------------- */
.empty-state{text-align:center;padding:48px 24px;color:var(--slate-500)}
.empty-state-icon{font-size:36px;margin-bottom:10px}
.empty-state-title{font-family:var(--font-display);font-size:17px;font-weight:600;color:var(--slate-800);margin-bottom:6px}
.empty-state p{max-width:460px;margin:0 auto}

[hidden]{display:none !important}
.text-muted{color:var(--slate-400)}
.text-blue{color:var(--blue-500)}
.text-warn{color:var(--amber-500);font-weight:500}
.text-error{color:var(--red-500)}
.num{text-align:right;font-variant-numeric:tabular-nums}
.strong{font-weight:600;color:var(--slate-800)}
.card-hint{font-family:var(--font-main);font-size:11.5px;font-weight:400;color:var(--slate-400)}
.card-link{font-family:var(--font-main);font-size:12px;font-weight:400;color:var(--blue-500);text-decoration:none}
.card-link:hover{text-decoration:underline}
.card-empty{font-size:13px;color:var(--slate-400);padding:12px 0}
.table-scroll{overflow-x:auto}

/* =====================================================================
   DASHBOARD
   ===================================================================== */
.kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:24px}
.kpi-card{background:var(--white);border-radius:var(--radius-md);padding:20px;box-shadow:var(--shadow-sm);border:1px solid var(--slate-200);min-width:0}
.kpi-label{font-size:12px;color:var(--slate-400);font-weight:500;margin-bottom:8px}
.kpi-value{font-family:var(--font-display);font-size:26px;font-weight:700;color:var(--slate-800);line-height:1}
.kpi-sub{font-size:11.5px;color:var(--slate-400);margin-top:8px}
.kpi-icon{width:36px;height:36px;border-radius:var(--radius-sm);display:flex;align-items:center;justify-content:center;font-size:18px;float:right}
.kpi-icon-blue{background:var(--blue-100)}.kpi-icon-green{background:var(--green-100)}
.kpi-icon-amber{background:var(--amber-100)}.kpi-icon-purple{background:var(--purple-100)}

.dash-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:16px;margin-bottom:16px}
.dash-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.dash-grid-single{grid-template-columns:1fr}

.mini-table{width:100%;border-collapse:collapse}
.mini-table th{font-size:11px;font-weight:600;color:var(--slate-400);text-align:left;padding:0 8px 8px 0;border-bottom:1px solid var(--slate-200);text-transform:uppercase;letter-spacing:.05em;white-space:nowrap}
.mini-table td{padding:10px 8px 10px 0;font-size:13px;border-bottom:1px solid var(--slate-100);color:var(--slate-600);vertical-align:middle}
.mini-table th.num,.mini-table td.num{text-align:right;padding-right:18px}
.mini-table tr:last-child td{border:none}
.mini-table-plain td:first-child{color:var(--slate-800);font-weight:500}
.ord-num{font-weight:600;color:var(--blue-500);text-decoration:none;white-space:nowrap}
.ord-num:hover{text-decoration:underline}

.status-list{display:flex;flex-direction:column;gap:10px}
.status-row{display:flex;align-items:center;gap:10px}
.status-dot{display:inline-block;width:10px;height:10px;border-radius:50%;flex-shrink:0}
.status-name{flex:1;font-size:13px;color:var(--slate-600)}
.status-bar-wrap{width:100%;min-width:60px;height:6px;background:var(--slate-100);border-radius:4px;overflow:hidden}
.status-bar{height:100%;border-radius:4px}
.status-cnt{font-size:13px;font-weight:600;color:var(--slate-800);min-width:22px;text-align:right}

.donut-wrap{display:flex;flex-direction:column;gap:18px}
.donut{width:150px;height:150px;margin:0 auto;display:block}
.donut-fondo{fill:none;stroke:var(--slate-100);stroke-width:5}
.donut-arco{fill:none;stroke-width:5}
.donut-total{font-family:var(--font-display);font-size:8px;font-weight:700;fill:var(--slate-800);text-anchor:middle}
.donut-sub{font-size:3.2px;fill:var(--slate-400);text-anchor:middle}

.sucursales{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:16px}
.sucursal{background:var(--blue-50);border:1px solid var(--blue-100);border-radius:var(--radius-sm);padding:12px 14px}
.sucursal-nombre{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--slate-600);font-weight:500}
.sucursal-monto{font-family:var(--font-display);font-size:22px;font-weight:700;color:var(--slate-800);margin-top:4px}
.split-bar{display:flex;height:10px;border-radius:6px;overflow:hidden;background:var(--slate-100)}
.split-leyenda{display:flex;justify-content:space-between;font-size:11.5px;color:var(--slate-400);margin-top:6px}

.skeleton{background:linear-gradient(90deg,var(--slate-100),var(--blue-50),var(--slate-100));background-size:200% 100%;animation:brillo 1.2s ease-in-out infinite;border-radius:4px}
.skeleton-line{height:10px;width:60%;margin-bottom:14px}
.skeleton-big{height:26px;width:40%}
.skeleton-panel{height:260px}
@keyframes brillo{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* =====================================================================
   LISTA DE ÓRDENES
   ===================================================================== */
.toolbar{display:flex;align-items:center;gap:10px;margin-bottom:16px;flex-wrap:wrap}
.search-box{display:flex;align-items:center;gap:8px;background:var(--white);border:1px solid var(--slate-200);border-radius:var(--radius-sm);padding:7px 12px;flex:1 1 260px;max-width:340px;color:var(--slate-400)}
.search-box:focus-within{border-color:var(--blue-400);box-shadow:0 0 0 3px rgba(30,111,191,.10)}
.search-box input{border:none;outline:none;font-size:13px;color:var(--slate-800);width:100%;background:transparent}
.filter-select{background:var(--white);border:1px solid var(--slate-200);border-radius:var(--radius-sm);padding:7px 12px;font-size:13px;color:var(--slate-600);outline:none;cursor:pointer;font-family:inherit}
.filter-select:focus{border-color:var(--blue-400)}
.orders-table-wrap{background:var(--white);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);border:1px solid var(--slate-200);overflow:hidden}
.orders-table{width:100%;border-collapse:collapse}
.orders-table th{background:var(--slate-100);font-size:11.5px;font-weight:600;color:var(--slate-400);text-align:left;padding:11px 14px;border-bottom:1px solid var(--slate-200);letter-spacing:.04em;text-transform:uppercase;white-space:nowrap}
.orders-table th.num{text-align:right}
.orders-table td{padding:11px 14px;border-bottom:1px solid var(--slate-100);font-size:13px;color:var(--slate-700);vertical-align:middle}
.orders-table tr:hover td{background:var(--blue-50)}
.orders-table tr:last-child td{border:none}
.ord-cliente{font-weight:500;color:var(--slate-800)}
.cbm-val{font-size:11.5px;color:var(--slate-500)}
.total-val{font-weight:600;color:var(--slate-800);white-space:nowrap}
.action-btn{display:inline-block;background:transparent;border:1px solid var(--slate-200);border-radius:var(--radius-sm);padding:4px 10px;font-size:12px;color:var(--slate-600);text-decoration:none}
.table-footer{padding:12px 16px;border-top:1px solid var(--slate-200);display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:12.5px;color:var(--slate-400);background:var(--white)}
.table-footer:empty{display:none}
.table-loading{text-align:center;padding:32px 14px !important;color:var(--slate-400)}
.pagination{display:flex;align-items:center;gap:8px}
.pagination-info{color:var(--slate-600)}

/* =====================================================================
   COMPONENTES COMPARTIDOS (formularios, modales, avisos)
   ===================================================================== */
.text-green{color:var(--green-500)}
.btn-danger{background:var(--red-500);color:var(--white)}
.btn-texto-rojo{color:var(--red-500)}
.btn-icono{background:transparent;padding:4px 6px;border-radius:var(--radius-sm);font-size:13px}
.pill-lg{font-size:13px;padding:5px 12px}
.pill-mult{background:var(--blue-100);color:var(--blue-500)}
.pill-mult-warn{background:var(--amber-100);color:var(--amber-500)}
.pill-mult-danger{background:var(--red-100);color:var(--red-500)}
.section-title{grid-column:1/-1;font-family:var(--font-display);font-size:13px;font-weight:600;color:var(--blue-700);padding-bottom:2px}
.section-divider{grid-column:1/-1;border:none;border-top:1.5px solid var(--slate-200);margin:4px 0}
.form-grid-3{grid-template-columns:repeat(3,1fr)}
.form-static{background:var(--slate-100);color:var(--slate-600);border-color:var(--slate-100)}
.check{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--slate-700);cursor:pointer}
.check input{width:16px;height:16px;accent-color:var(--blue-500)}
.subtitulo{font-family:var(--font-display);font-size:13px;font-weight:600;color:var(--slate-600);margin:18px 0 8px}

dialog.modal{margin:auto;border:none;border-radius:var(--radius-md);padding:0;width:min(580px,calc(100vw - 32px));max-height:88vh;box-shadow:var(--shadow-md);color:var(--slate-800);transition:opacity 200ms var(--ease-out),scale 200ms var(--ease-out)}
dialog.modal-grande{width:min(820px,calc(100vw - 32px))}
dialog.modal::backdrop{background:rgba(13,33,55,.5);transition:opacity 200ms var(--ease-out)}
@starting-style{
  dialog.modal[open]{opacity:0;scale:var(--modal-escala)}
  dialog.modal[open]::backdrop{opacity:0}
}
dialog.modal.cerrando{opacity:0;scale:var(--modal-escala);pointer-events:none;transition-duration:150ms}
dialog.modal.cerrando::backdrop{opacity:0;transition-duration:150ms}
.modal-form{display:flex;flex-direction:column;max-height:88vh}
.modal-header{display:flex;align-items:center;justify-content:space-between;padding:18px 24px 0}
.modal-title{font-family:var(--font-display);font-size:16px;font-weight:600}
.modal-cerrar{background:transparent;font-size:22px;line-height:1;color:var(--slate-400);padding:2px 8px;border-radius:var(--radius-sm)}
.modal-alerta{padding:0 24px}
.modal-alerta:not(:empty){margin-top:12px}
.modal-body{padding:16px 24px;overflow-y:auto}
.modal-footer{display:flex;justify-content:flex-end;gap:10px;padding:14px 24px;border-top:1px solid var(--slate-200)}
.modal-texto{font-size:13.5px;color:var(--slate-600);margin-bottom:12px}
.modal-intro{margin-bottom:12px;display:block}
.opciones-estado{border:none;display:flex;flex-direction:column;gap:10px;margin-bottom:14px}

.avisos{position:fixed;right:20px;bottom:20px;z-index:200;display:flex;flex-direction:column;gap:8px;max-width:min(380px,calc(100vw - 40px))}
.aviso{padding:11px 16px;border-radius:var(--radius-sm);font-size:13px;box-shadow:var(--shadow-md);background:var(--slate-800);color:var(--white);animation:entrar .2s ease-out;transition:opacity .3s,transform .3s}
.aviso-success{background:var(--green-500)}
.aviso-error{background:var(--red-500)}
.aviso-warning{background:var(--amber-500)}
.aviso.saliendo{opacity:0;transform:translateY(8px)}
@keyframes entrar{from{opacity:0;transform:translateY(8px)}}

/* =====================================================================
   NUEVA ORDEN
   ===================================================================== */
.paso-cliente{max-width:640px;margin:0 auto}
.card-title-lg{font-size:16px;margin-bottom:20px}
.client-selector{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:20px}
.client-type-btn{border:2px solid var(--slate-200);border-radius:var(--radius-md);padding:20px;cursor:pointer;background:var(--white);text-align:left}
.client-type-btn.selected{border-color:var(--blue-500);background:var(--blue-50)}
.client-type-icon{font-size:24px;margin-bottom:8px}
.client-type-title{font-weight:600;font-size:14px;color:var(--slate-800);margin-bottom:4px}
.client-type-desc{font-size:12px;color:var(--slate-400)}
.resultados-cliente{list-style:none;margin-top:8px;border:1px solid var(--slate-200);border-radius:var(--radius-sm);overflow:hidden}
.resultados-cliente:empty{display:none}
.resultado-cliente{width:100%;display:flex;justify-content:space-between;gap:12px;padding:10px 12px;background:var(--white);text-align:left;font-size:13px;border-bottom:1px solid var(--slate-100)}
.resultado-cliente span{color:var(--slate-400)}
.resultado-cliente:hover,.resultado-cliente:focus{background:var(--blue-50)}
.resultado-vacio{padding:10px 12px;font-size:13px;color:var(--slate-400)}
.cliente-preview{margin-top:12px}
.paso-acciones{margin-top:20px;display:flex;gap:10px}

.nueva-orden{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:20px;align-items:start}
.cliente-bar{background:var(--blue-50);border:1px solid var(--blue-100);border-radius:var(--radius-sm);padding:10px 14px;display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:20px;font-size:13px}
#orden-alerta:not(:empty){margin-bottom:16px}
.seccion-pa{display:flex;flex-direction:column;gap:10px;background:var(--purple-100);border-radius:var(--radius-sm);padding:12px 14px}
.flujos-pa{border:none;display:flex;flex-wrap:wrap;gap:8px 20px}
.flujos-pa legend{margin-bottom:6px}
.flujos-resumen{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.form-botones{display:flex;gap:10px;margin-top:8px}
.form-botones .btn-primary{flex:1}
.panel-calculo{position:sticky;top:0;display:flex;flex-direction:column;gap:12px}
.nota-calculo{font-size:12px}

.calc-box{background:var(--blue-900);border-radius:var(--radius-md);padding:20px;color:var(--white)}
.calc-title{font-size:12px;font-weight:600;color:var(--slate-400);text-transform:uppercase;letter-spacing:.06em;margin-bottom:14px}
.calc-row{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:6px 0;border-bottom:1px solid rgba(255,255,255,.08);font-size:13px}
.calc-lbl{color:var(--slate-400)}
.calc-val{font-weight:600;text-align:right}
.calc-total{margin-top:10px;background:var(--blue-500);border-radius:var(--radius-sm);padding:12px 16px;display:flex;justify-content:space-between;align-items:center}
.calc-total-lbl{font-size:13px;font-weight:600}
.calc-total-val{font-family:var(--font-display);font-size:22px;font-weight:700}
.calc-faltan,.calc-nota{margin-top:10px;font-size:12px;color:var(--slate-300)}
.calc-mini,.flete-preview{background:var(--blue-50);border:1px solid var(--blue-100);border-radius:var(--radius-sm);padding:10px 12px;font-size:13px}
.calc-mini:empty,.flete-preview:empty{display:none}

/* =====================================================================
   DETALLE DE ORDEN
   ===================================================================== */
.detail-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:20px;flex-wrap:wrap}
.detail-num{font-family:var(--font-display);font-size:22px;font-weight:700;color:var(--slate-800)}
.detail-sub{font-size:13px;color:var(--slate-400);margin-top:2px}
.detail-flujos{margin-top:8px;display:flex;gap:4px;flex-wrap:wrap}
.detail-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.detail-grid{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:16px;align-items:start}
.detail-main{display:flex;flex-direction:column;gap:16px;min-width:0}
.detail-aside{position:sticky;top:0;display:flex;flex-direction:column;gap:16px}
.info-cards{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.info-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.info-item{display:flex;flex-direction:column;gap:3px;min-width:0}
.info-lbl{font-size:11px;font-weight:600;color:var(--slate-400);text-transform:uppercase;letter-spacing:.05em}
.info-val{font-size:13.5px;color:var(--slate-800);font-weight:500;overflow-wrap:anywhere}
.info-nota{font-size:11px}

.cbm-resumen{background:var(--blue-50);border:1px solid var(--blue-100);border-radius:var(--radius-sm);padding:12px 16px;display:flex;gap:24px;align-items:center;flex-wrap:wrap;margin-bottom:16px}
.cbm-item{display:flex;flex-direction:column;gap:2px}
.cbm-item-lbl{font-size:11px;color:var(--slate-400);font-weight:500}
.cbm-item-val{font-size:15px;font-weight:700;color:var(--slate-800);display:flex;gap:6px;flex-wrap:wrap}
.cbm-arrow{color:var(--slate-300);font-size:18px}
.cbm-sep{width:1px;align-self:stretch;background:var(--blue-100)}

.envio-card{border:1px solid var(--slate-200);border-radius:var(--radius-md);overflow:hidden;margin-bottom:12px}
.envio-header{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px 16px;background:var(--slate-100);cursor:pointer;user-select:none;list-style:none}
.envio-header::-webkit-details-marker{display:none}
.envio-header:hover{background:var(--blue-50)}
.envio-header-izq{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.envio-num{font-weight:700;font-size:13px;color:var(--blue-700);font-family:var(--font-display)}
.envio-meta{font-size:12px;color:var(--slate-500);display:flex;gap:14px;align-items:center}
.envio-meta-flete{font-weight:600;color:var(--slate-600)}
.envio-chevron{color:var(--slate-400);transition:transform .15s}
.envio-card[open] .envio-chevron{transform:rotate(180deg)}
.envio-body{padding:16px;border-top:1px solid var(--slate-200);background:var(--white)}
.envio-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.envio-field{display:flex;flex-direction:column;gap:3px;min-width:0}
.envio-field-lbl{font-size:11px;font-weight:600;color:var(--slate-400);text-transform:uppercase;letter-spacing:.04em}
.envio-field-val{font-size:13px;color:var(--slate-800);font-weight:500;overflow-wrap:anywhere}
.envio-desc{margin-top:12px;font-size:13px;color:var(--slate-600)}
.envio-flete-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 14px;background:var(--blue-900);border-radius:var(--radius-sm);color:var(--white);margin-top:12px}
.envio-flete-pendiente{background:var(--slate-600)}
.envio-flete-lbl{font-size:12px;color:var(--slate-300)}
.envio-flete-formula{font-size:11px;color:var(--slate-400);margin-top:2px}
.envio-flete-val{font-family:var(--font-display);font-size:16px;font-weight:700;white-space:nowrap}
.envio-acciones{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:12px}
.add-envio-btn{border:2px dashed var(--slate-200);border-radius:var(--radius-md);padding:14px;width:100%;background:transparent;color:var(--slate-400);font-size:13px;font-weight:500;cursor:pointer}
.factura-badge{display:inline-flex;align-items:center;gap:6px;padding:3px 9px;border-radius:var(--radius-sm);font-size:11.5px;font-weight:500}
.factura-pendiente{background:var(--amber-100);color:var(--amber-500)}
.factura-recibida{background:var(--green-100);color:var(--green-500)}

.timeline{display:flex;flex-direction:column;list-style:none}
.tl-item{display:flex;gap:12px;padding-bottom:18px}
.tl-item:last-child{padding-bottom:0}
.tl-left{display:flex;flex-direction:column;align-items:center;width:20px;flex-shrink:0}
.tl-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0;margin-top:4px}
.tl-line{width:2px;flex:1;background:var(--slate-200);margin-top:4px}
.tl-item:last-child .tl-line{display:none}
.tl-dot-done{background:var(--green-500)}
.tl-dot-active{background:var(--blue-500);box-shadow:0 0 0 4px var(--blue-100)}
.tl-dot-pend{background:var(--slate-200)}
.tl-title{font-size:13px;font-weight:500;color:var(--slate-800)}
.tl-active .tl-title{color:var(--blue-500);font-weight:600}
.tl-pend .tl-title{color:var(--slate-400)}
.tl-aqui{font-size:11.5px;font-weight:500}
.tl-date{font-size:11.5px;color:var(--slate-400);margin-top:1px}
.tl-pend .tl-date{color:var(--slate-300)}
.historial{margin-top:18px;padding-top:12px;border-top:1px solid var(--slate-200);font-size:12.5px}
.historial summary{cursor:pointer;color:var(--blue-500);font-weight:500}
.historial-lista{list-style:none;margin-top:10px;display:flex;flex-direction:column;gap:10px;max-height:360px;overflow-y:auto}
.historial-lista li{border-left:2px solid var(--slate-200);padding-left:10px}
.historial-fecha{font-size:11px;color:var(--slate-400)}

/* Historial de auditoría (ADMIN) */
.audit-lista{list-style:none;display:flex;flex-direction:column;gap:12px;max-height:520px;overflow-y:auto}
.audit-item{border-left:3px solid var(--blue-100);padding:2px 0 2px 12px;font-size:13px}
.audit-cabecera{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}
.audit-cambios{list-style:none;margin:6px 0 4px;display:flex;flex-direction:column;gap:2px;color:var(--slate-600)}
.audit-campo{color:var(--slate-400)}
.audit-antes{color:var(--slate-400);text-decoration:line-through}
.audit-origen{font-size:11px;color:var(--slate-400);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.fin-totales{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:12px}
.fin-totales > div,.fin-numeros > div{display:flex;flex-direction:column;gap:2px}
.fin-lbl{font-size:11px;font-weight:600;color:var(--slate-400);text-transform:uppercase;letter-spacing:.05em}
.fin-total{font-family:var(--font-display);font-size:20px;font-weight:700}
.fin-flujo{border:1px solid var(--slate-200);border-radius:var(--radius-md);padding:14px 16px;margin-top:12px}
.fin-flujo-header{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.fin-codigo{font-family:var(--font-display);font-weight:700;color:var(--blue-700)}
.fin-nombre{font-size:13px;color:var(--slate-600);margin-right:6px}
.fin-botones{display:flex;gap:6px;flex-wrap:wrap}
.fin-numeros{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.fin-val{font-size:15px;font-weight:700;color:var(--slate-800)}
.fin-detalle{margin-top:10px;font-size:12.5px;color:var(--slate-600)}
.fin-ganancias{margin-top:8px;font-size:12px;color:var(--slate-500)}
.fin-subs{list-style:none;margin-top:8px;font-size:12.5px}
.fin-subs li{display:grid;grid-template-columns:120px 100px 130px 1fr;gap:8px;padding:5px 0;border-bottom:1px solid var(--slate-100)}

/* =====================================================================
   CLIENTES
   ===================================================================== */
.fila-inactiva td{color:var(--slate-400)}
.acciones-fila{white-space:nowrap}
.acciones-fila > * + *{margin-left:6px}
.info-grid-1{grid-template-columns:1fr}

/* =====================================================================
   REPORTES
   ===================================================================== */
.tabs{display:flex;gap:4px;box-shadow:inset 0 -1.5px 0 var(--slate-200);margin-bottom:18px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none}
.tab{background:transparent;padding:10px 16px;font-size:13.5px;font-weight:500;color:var(--slate-500);border-bottom:2.5px solid transparent;white-space:nowrap}
.tab.active{color:var(--blue-500);border-bottom-color:var(--blue-500);font-weight:600}
.segmented{display:inline-flex;background:var(--slate-100);border-radius:var(--radius-sm);padding:3px;gap:2px;flex-wrap:wrap}
.segmented-btn{background:transparent;padding:6px 12px;border-radius:5px;font-size:12.5px;color:var(--slate-600);font-weight:500}
.segmented-btn.active{background:var(--white);color:var(--blue-500);box-shadow:var(--shadow-sm)}
.periodo{display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap}
.periodo-rango{display:inline-flex;align-items:center;gap:6px}
.toggle{padding:7px 4px}
.reporte-nota{font-size:12px;color:var(--slate-400);margin:-6px 0 12px}
#panel-reporte.cargando{opacity:.55;pointer-events:none;transition:opacity .15s}
.reporte-tabla td,.reporte-tabla th{white-space:nowrap}
.reporte-tabla .fila-grupo td{background:var(--blue-50);color:var(--blue-700);font-weight:700;font-family:var(--font-display);font-size:12.5px;letter-spacing:.03em}
.reporte-tabla .fila-subgrupo td{font-weight:600;color:var(--slate-600);font-size:12.5px;padding-left:24px}
.reporte-tabla .fila-subtotal td{background:var(--slate-100);font-weight:600;color:var(--slate-800)}
.reporte-tabla .fila-total td{background:var(--blue-900);color:var(--white);font-weight:700;border:none}
.reporte-tabla .fila-total .text-muted{color:var(--slate-400)}
.reporte-tabla tr.fila-grupo:hover td{background:var(--blue-50)}
.reporte-tabla tr.fila-subtotal:hover td{background:var(--slate-100)}
.reporte-tabla tr.fila-total:hover td{background:var(--blue-900)}
.kpis-grid{align-items:start}
.kpis-columna{display:flex;flex-direction:column;gap:16px}

/* =====================================================================
   USUARIOS Y CUENTA
   ===================================================================== */
a.btn-logout{text-decoration:none}
.usuario-celda{display:flex;align-items:center;gap:10px}
.user-avatar-sm{width:28px;height:28px;font-size:11px}
.password-temporal{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--blue-900);color:var(--white);border-radius:var(--radius-sm);padding:14px 16px;margin-bottom:12px}
.password-temporal code{font-family:ui-monospace,Consolas,monospace;font-size:20px;letter-spacing:.08em;user-select:all}
.password-temporal .btn-ghost{color:var(--white);border-color:rgba(255,255,255,.3)}
.roles-leyenda{margin-top:14px;line-height:2.2}
.cambio-aviso{margin-bottom:16px}
.cambio-nota{margin-top:16px}

/* =====================================================================
   LOGIN
   ===================================================================== */
.login-page{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}
.login-brand{background:var(--blue-900);color:var(--white);padding:44px 56px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden}
.login-brand::before,.login-brand::after{content:"";position:absolute;border-radius:50%;pointer-events:none}
.login-brand::before{width:520px;height:520px;right:-180px;bottom:-200px;background:radial-gradient(circle,rgba(30,111,191,.35),transparent 70%)}
.login-brand::after{width:260px;height:260px;left:-90px;top:-90px;border:1px solid rgba(255,255,255,.06)}
.login-brand > *{position:relative;z-index:1}
.login-hero{max-width:440px}
.login-hero-kicker{display:inline-block;font-size:11.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--blue-400);margin-bottom:14px}
.login-hero-title{font-family:var(--font-display);font-size:34px;font-weight:700;line-height:1.15;margin-bottom:14px}
.login-hero-text{color:var(--slate-300);font-size:14.5px;max-width:400px}
.login-route{display:flex;align-items:center;gap:12px;margin-top:28px;font-size:13px;color:var(--slate-300)}
.login-route-point{display:flex;flex-direction:column}
.login-route-point strong{color:var(--white);font-family:var(--font-display);font-size:15px}
.login-route-line{flex:0 0 72px;height:2px;background:repeating-linear-gradient(90deg,var(--blue-400) 0 6px,transparent 6px 11px)}
.login-features{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-width:520px}
.login-feature{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:var(--radius-md);padding:12px}
.login-feature-icon{font-size:18px;margin-bottom:6px}
.login-feature-title{font-size:12.5px;font-weight:600}
.login-feature-text{font-size:11.5px;color:var(--slate-400)}

.login-panel{display:flex;align-items:center;justify-content:center;padding:32px 24px}
.login-card{width:100%;max-width:400px;background:var(--white);border:1px solid var(--slate-200);border-radius:var(--radius-md);box-shadow:var(--shadow-md);padding:32px}
.login-card-title{font-family:var(--font-display);font-size:22px;font-weight:700;color:var(--slate-800)}
.login-card-sub{font-size:13px;color:var(--slate-400);margin:4px 0 22px}
.login-form{display:flex;flex-direction:column;gap:16px}
.login-help{margin-top:18px;padding-top:16px;border-top:1px solid var(--slate-100);font-size:12px;color:var(--slate-400);text-align:center}

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
@media (max-width: 1180px){
  .kpi-grid{grid-template-columns:repeat(2,1fr)}
  .dash-grid,.dash-grid-2{grid-template-columns:1fr}
  .nueva-orden,.detail-grid{grid-template-columns:1fr}
  .panel-calculo,.detail-aside{position:static}
  .info-cards{grid-template-columns:1fr}
  .envio-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width: 700px){
  .form-grid-3,.client-selector,.fin-totales,.fin-numeros{grid-template-columns:1fr}
  .fin-subs li{grid-template-columns:1fr 1fr}
}
@media (max-width: 560px){
  .kpi-grid{grid-template-columns:1fr}
  .search-box{max-width:none}
  .filter-select{flex:1 1 45%}
}
@media (max-width: 900px){
  .login-page{grid-template-columns:1fr}
  .login-brand{padding:28px 24px;gap:20px}
  .login-hero-title{font-size:24px}
  .login-features,.login-route{display:none}

  .sidebar{position:fixed;inset:0 auto 0 0;z-index:50;transform:translateX(-100%);transition:transform 300ms var(--ease-drawer);touch-action:pan-y}
  .app.menu-abierto .sidebar{transform:none}
  .sidebar-backdrop{display:block;position:fixed;inset:0;background:rgba(13,33,55,.45);z-index:40;opacity:0;pointer-events:none;transition:opacity 300ms var(--ease-drawer)}
  .app.menu-abierto .sidebar-backdrop{opacity:1;pointer-events:auto}
  .app.arrastrando .sidebar,.app.arrastrando .sidebar-backdrop{transition:none}
  .btn-menu{display:inline-flex}
  .topbar{padding:0 16px}
  .content{padding:16px}
  .form-grid{grid-template-columns:1fr}
}

/* Estado de cuenta del cliente y flujo de caja */
.estado-cuenta{margin-top:20px}
.ec-filtros{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;margin-bottom:14px}
.ec-filtros .form-group{min-width:160px}
.ec-filtros-botones{display:flex;gap:8px;padding-bottom:4px}
.flujo-caja{margin-top:16px}

/* Recepciones en China y pre-factura (solo Logística) */
.pill-prefactura{background:#fef3c7;color:#92400e;border:1px solid #fcd34d}
.pill-prefactura-ok{background:#dcfce7;color:#166534;border:1px solid #86efac}
.prefactura-resumen{margin-bottom:12px;padding:10px 12px;background:var(--blue-50);border:1px solid var(--blue-100);border-radius:var(--radius-sm);font-size:13px}
.conciliacion-sub{margin-top:8px;padding:8px 12px;background:#f0fdf4;border:1px solid #bbf7d0;border-radius:var(--radius-sm);font-size:12.5px;color:var(--slate-600)}
.recepciones-check{display:flex;flex-direction:column;gap:6px;margin-bottom:12px}

/* Liquidación MCA y reempaque */
.liquidacion-mca{margin-top:10px;padding:10px 12px;background:var(--blue-50);border:1px solid var(--blue-100);border-radius:var(--radius-sm);font-size:13px;color:var(--slate-600)}
.envio-total-cobro .envio-flete-val{color:#93c5fd}
.input-corto{width:80px;text-align:right;padding:4px 8px}
.abono-saldo{background:var(--blue-50);border-radius:var(--radius-sm);padding:8px 10px}

/* Ítems de la cotización MCA */
.items-mca{margin-top:14px;padding-top:12px;border-top:1px dashed var(--slate-200)}
.items-mca-header{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:8px}
.items-mca-titulo{font-size:12px;font-weight:600;color:var(--slate-600);text-transform:uppercase;letter-spacing:.04em}

/* =====================================================================
   MOVIMIENTO REDUCIDO: nada se desplaza; se conservan fundidos cortos
   ===================================================================== */
@media (prefers-reduced-motion: reduce){
  :root{--modal-escala:1}
  .aviso{animation-name:aparecer}
  .aviso.saliendo{transform:none}
  .skeleton{animation:none}
}
@keyframes aparecer{from{opacity:0}}
@media (prefers-reduced-motion: reduce) and (max-width: 900px){
  .sidebar{opacity:0;transition:opacity 200ms ease,transform 0s linear 200ms}
  .app.menu-abierto .sidebar{opacity:1;transition:opacity 200ms ease,transform 0s}
  .sidebar-backdrop{transition:opacity 200ms ease}
}

/* Órdenes anuladas */
.pill-anulada{background:var(--red-100);color:var(--red-500)}
.banner-anulada{display:flex;gap:14px;align-items:flex-start;background:var(--red-100);border:1px solid #FCA5A5;border-left:4px solid var(--red-500);
  border-radius:var(--radius-md);padding:14px 16px;margin-bottom:16px}
.banner-anulada-icono{font-size:22px;line-height:1}
.banner-anulada-cuerpo{flex:1;min-width:0}
.banner-anulada-titulo{font-family:var(--font-display);font-size:15px;font-weight:700;color:var(--red-500);margin:0 0 4px}
.banner-anulada-detalle{margin:0 0 6px;color:var(--slate-800);font-size:13.5px}
.banner-anulada-meta{margin:0;color:var(--slate-600);font-size:12px}
.banner-anulada .btn{flex-shrink:0;background:var(--white)}
.tl-dot-anulada{background:var(--red-500);border-color:var(--red-500)}
.tl-anulada .tl-title{color:var(--red-500)}
.boton-bloqueado{display:inline-flex;cursor:help}
.boton-bloqueado .btn{pointer-events:none}
.form-textarea{resize:vertical;min-height:70px;line-height:1.4}
@media (max-width:640px){.banner-anulada{flex-wrap:wrap}.banner-anulada .btn{width:100%}}

/* Recepciones sin asignar */
.huerfanas-buscar{max-width:420px;flex:1}
.destino-resultados{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:6px;max-height:240px;overflow:auto}
.destino-resultados button{width:100%;text-align:left;background:var(--white);border:1px solid var(--slate-200);border-radius:var(--radius-sm);padding:8px 10px;cursor:pointer;font:inherit}
.destino-resultados button:hover,.destino-resultados button[aria-selected="true"]{border-color:var(--blue-500);background:var(--blue-50)}
.destino-vacio{color:var(--slate-500);font-size:13px;padding:6px 2px}
.simulacion{margin-top:12px;padding:12px;border-radius:var(--radius-sm);background:var(--slate-50,#F8FAFC);border:1px solid var(--slate-200);font-size:13px;line-height:1.5}
.simulacion-montos{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:6px 0}
.simulacion-monto{font-family:var(--font-display);font-size:18px;font-weight:700;color:var(--slate-800)}

/* Reporte de CBM por vendedor */
.cbm-tarifas summary{cursor:pointer;color:var(--slate-600);white-space:nowrap}
.cbm-tarifas ul{margin:6px 0 0;padding-left:16px;white-space:normal;min-width:320px;font-size:12px;color:var(--slate-600)}
.cuota-barra{display:inline-block;height:8px;border-radius:4px;background:var(--blue-500);vertical-align:middle;margin-right:6px}
.reporte-cbm th{white-space:normal;vertical-align:bottom}
.item-especificaciones{font-size:11.5px;white-space:pre-line}

/* Cotizador Rápido */
.cotizador-principal{display:flex;flex-direction:column;gap:16px;min-width:0}
.cotizador .segmented{margin-bottom:16px}
.cotizador-proveedor{padding:12px 0;border-top:1px dashed var(--slate-200)}
.card-title + .cotizador-proveedor{border-top:none;padding-top:0}
.cotizador-resumen{position:sticky;top:0;display:flex;flex-direction:column;gap:12px}
.cotizador-resumen .card-title{margin-bottom:0}
.cotizador-tasa{margin-bottom:12px}
.cotizador-proveedor-header{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:8px;font-size:13px}
.cotizador-proveedor-acciones{display:flex;align-items:center;gap:4px;flex-shrink:0}
.cotizador-codigo{display:flex;flex-direction:column;gap:2px;font-size:12px}
.cotizador-codigo strong{font-family:var(--font-mono,monospace);font-size:13px;color:var(--slate-800);word-break:break-all}
.cotizador-filas{display:flex;flex-direction:column;gap:6px;font-size:13px}
.cotizador-filas > div{display:flex;justify-content:space-between;gap:12px}
.cotizador-total{display:flex;justify-content:space-between;align-items:center;background:var(--blue-500);color:var(--white);border-radius:var(--radius-sm);padding:10px 12px;font-size:13px}
.cotizador-total strong{font-size:18px}
.cotizador-faltan{font-size:12.5px;color:var(--slate-600);padding-left:18px;display:flex;flex-direction:column;gap:3px}
@media (max-width:900px){.cotizador-resumen{position:static}}

/* Reempaque independiente del flete */
.envio-concepto-nota{font-size:11px;color:var(--slate-400);font-weight:400}
.envio-concepto-der{display:flex;align-items:center;gap:10px;flex-shrink:0}
.envio-reempaque{background:var(--slate-800);margin-top:6px}
.pill-cobro-pendiente{background:var(--amber-100);color:var(--amber-500)}
.pill-cobro-espera{background:rgba(255,255,255,.12);color:var(--slate-300)}
.envio-reempaque-aviso{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:6px}
.envio-reempaque-aviso .btn{flex-shrink:0;background:var(--white)}
.fin-subs li.fin-sub-reempaque{border-bottom-style:dashed;color:var(--slate-600)}
.prefactura-reempaque{margin-top:8px;padding-top:8px;border-top:1px dashed var(--blue-100)}
@media (max-width:640px){
  .envio-concepto-der{flex-direction:column;align-items:flex-end;gap:4px}
  .envio-reempaque-aviso{flex-direction:column;align-items:flex-start}
}

/* Cotización MCA con una fórmula anterior */
.formula-mca-aviso{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:8px 0}
.formula-mca-aviso .btn{flex-shrink:0;background:var(--white)}
@media (max-width:640px){.formula-mca-aviso{flex-direction:column;align-items:flex-start}}

/* Ayuda debajo de una casilla de formulario */
.casilla-ayuda{margin-top:-10px}

/* Fotos de las cotizaciones MCA / LCA: miniatura por ítem, galería, anexo HD y visor ampliado */
.col-foto{width:52px}
.foto-celda{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;border-radius:var(--radius-sm);background:var(--slate-100);overflow:hidden;border:1px solid var(--slate-200)}
.foto-celda.foto-vacia{background:transparent;border-style:dashed;color:var(--slate-400);font-size:15px}
span.foto-celda.foto-vacia{border-color:transparent}
.foto-mini{width:100%;height:100%;object-fit:contain;background:var(--white)}
.foto-error{opacity:.3}
.fotos-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:10px}
.foto-card{display:flex;flex-direction:column;gap:4px;min-width:0}
.foto-card-img{aspect-ratio:4/3;width:100%;padding:0;border:1px solid var(--slate-200);border-radius:var(--radius-sm);background:var(--white);overflow:hidden}
.foto-card-img img{width:100%;height:100%;object-fit:contain;display:block}
.foto-card figcaption{font-size:12px;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fotos-subtitulo{font-size:12px;font-weight:600;color:var(--slate-600);margin:12px 0 8px}
dialog.visor-foto{display:flex;flex-direction:column}
dialog.visor-foto:not([open]){display:none}
.visor-cuerpo{flex:1;min-height:0;overflow:auto;padding:14px 24px;display:flex;align-items:center;justify-content:center;background:var(--slate-100);margin-top:14px}
.visor-img{max-width:100%;max-height:68vh;object-fit:contain;cursor:zoom-in;background:var(--white)}
.visor-zoom .visor-cuerpo{display:block}
.visor-zoom .visor-img{max-width:none;max-height:none;cursor:zoom-out}
.visor-pie{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:12px 24px;border-top:1px solid var(--slate-200);font-size:13px}
@media (max-width:640px){
  .fotos-grid{grid-template-columns:repeat(2,1fr)}
  .visor-cuerpo{padding:10px}
}
.foto-o-archivo{display:flex;align-items:center;gap:10px}
.enlace-producto{font-size:12px;white-space:nowrap}

/* Cierre de orden y gastos internos con fecha */
.banner-cerrada{background:var(--blue-100);border-color:var(--slate-200);border-left-color:var(--blue-500)}
.panel-cierre{margin-top:16px;padding:12px 14px;border:1px dashed var(--slate-300);border-radius:var(--radius-sm);background:var(--blue-50)}
.cierre-requisitos{list-style:none;display:flex;flex-direction:column;gap:4px;font-size:13px}
.reporte-detalle-gastos{padding:4px 16px 12px}
.reporte-detalle-gastos .subtitulo{margin-top:12px}

/* Cotizaciones guardadas */
.cotizador-estado{display:flex;flex-direction:column;gap:6px;font-size:13px}
.cotizador-historial{list-style:none;display:flex;flex-direction:column;gap:2px;font-size:12px;color:var(--slate-500)}
.cotizador-botones{display:flex;flex-direction:column;gap:8px}
.aviso-duplicados ul{margin:6px 0 0 18px;display:flex;flex-direction:column;gap:4px}
.aviso-duplicados li{display:flex;flex-wrap:wrap;align-items:center;gap:6px}