/* ============================================================
   style.css  v2
   ============================================================ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

:root{
  --brand:#1a6b4a; --brand-mid:#2d8a62; --brand-light:#e8f5ee;
  --gray-50:#f8f9fa; --gray-100:#f1f3f5; --gray-200:#e9ecef;
  --gray-300:#dee2e6; --gray-400:#ced4da; --gray-600:#6c757d; --gray-800:#343a40;
  --danger:#c0392b; --warn:#e67e22; --warn-bg:#fff8f0; --info:#2980b9;
  --r:8px; --sh:0 1px 3px rgba(0,0,0,.08);
}

body{font-family:system-ui,-apple-system,'Segoe UI',sans-serif;font-size:15px;
     color:var(--gray-800);background:var(--gray-100);min-height:100vh}

/* ── Header ── */
.hdr{background:var(--brand);color:#fff;padding:0 1.5rem;height:52px;
     display:flex;align-items:center;gap:1rem}
.hdr h1{font-size:15px;font-weight:600}
.hdr nav{margin-left:auto;display:flex;gap:.3rem}
.hdr nav a{color:rgba(255,255,255,.8);text-decoration:none;font-size:13px;
           padding:.3rem .8rem;border-radius:6px;cursor:pointer;transition:background .15s}
.hdr nav a:hover,.hdr nav a.active{background:rgba(255,255,255,.18);color:#fff}

/* ── Layout ── */
.wrap{max-width:1080px;margin:0 auto;padding:1.25rem}

/* ── Card ── */
.card{background:#fff;border-radius:var(--r);border:1px solid var(--gray-200);
      padding:1.1rem 1.4rem;margin-bottom:.9rem}
.card-title{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;
            color:var(--gray-600);margin-bottom:.9rem;padding-bottom:.5rem;
            border-bottom:1px solid var(--gray-200);display:flex;align-items:center;gap:.5rem}

/* ── Form ── */
.row{display:grid;gap:.65rem;grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.fg{display:flex;flex-direction:column;gap:.25rem}
.fg label{font-size:11px;font-weight:700;color:var(--gray-600);text-transform:uppercase;letter-spacing:.3px}
.fg input,.fg select,.fg textarea{
  border:1px solid var(--gray-300);border-radius:6px;padding:.4rem .6rem;
  font-size:13.5px;font-family:inherit;color:var(--gray-800);background:#fff;
  transition:border-color .15s;width:100%}
.fg input:focus,.fg select:focus,.fg textarea:focus{outline:none;border-color:var(--brand-mid)}
.fg textarea{resize:vertical;min-height:56px}
.span2{grid-column:span 2}

/* ── Autocomplete ── */
.ac-wrap{position:relative}
.ac-list{position:absolute;top:calc(100% + 2px);left:0;right:0;background:#fff;
         border:1px solid var(--gray-300);border-radius:6px;
         box-shadow:0 4px 14px rgba(0,0,0,.1);z-index:200;
         max-height:230px;overflow-y:auto;display:none}
.ac-list.open{display:block}
.ac-item{padding:.45rem .75rem;font-size:13px;cursor:pointer;
          border-bottom:1px solid var(--gray-100);display:flex;align-items:center;gap:.5rem}
.ac-item:last-child{border-bottom:none}
.ac-item:hover{background:var(--brand-light)}
.ac-item.new{color:var(--brand);font-style:italic}
.ac-badge{font-size:10px;background:var(--gray-100);color:var(--gray-600);
          padding:1px 6px;border-radius:10px;flex-shrink:0}

/* ── Buttons ── */
.btn{display:inline-flex;align-items:center;gap:.3rem;padding:.4rem .9rem;
     border:1px solid var(--gray-300);border-radius:6px;background:#fff;
     font-size:13px;font-family:inherit;cursor:pointer;transition:all .15s;
     text-decoration:none;color:var(--gray-800)}
.btn:hover{background:var(--gray-50);border-color:var(--gray-400)}
.btn-p{background:var(--brand);color:#fff;border-color:var(--brand)}
.btn-p:hover{background:var(--brand-mid);border-color:var(--brand-mid)}
.btn-d{color:var(--danger);border-color:#e9b4b0}
.btn-d:hover{background:#fdf0ef}
.btn-sm{padding:.22rem .55rem;font-size:12px}
.btn-icon{padding:.28rem .38rem}
.ml-a{margin-left:auto}

/* ── Tipo badge ── */
.tipo-badge{display:inline-block;padding:.15rem .55rem;border-radius:12px;
            font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.3px}
.tb-origen   {background:#d6eaf8;color:#1a5276}
.tb-destino  {background:#e8daef;color:#6c3483}
.tb-entrega  {background:var(--brand-light);color:var(--brand)}
.tb-recogida {background:#fef9e7;color:#9a7d0a}
.tb-pausa    {background:var(--warn-bg);color:var(--warn)}
.tb-descanso {background:#fdedec;color:#922b21}
.tb-otro     {background:var(--gray-100);color:var(--gray-600)}

/* ── Parada card ── */
.pcard{background:var(--gray-50);border:1px solid var(--gray-200);border-radius:var(--r);
       padding:.9rem 1.1rem;margin-bottom:.65rem}
.pcard-head{display:flex;align-items:center;gap:.65rem;margin-bottom:.75rem}
.pcard-num{width:26px;height:26px;border-radius:50%;background:var(--brand);color:#fff;
           display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;flex-shrink:0}

/* ── Tramo info (entre paradas) ── */
.tramo{background:#fff;border:1px solid var(--gray-200);border-radius:6px;
       padding:.5rem .9rem;margin-bottom:.65rem;display:flex;align-items:center;gap:1.25rem;
       font-size:13px}
.tf{display:flex;align-items:center;gap:.4rem}
.tf label{font-size:11px;color:var(--gray-600);font-weight:600}
.tf .val{font-weight:600}
.tf .val.ed{color:var(--warn)}
.tf input.ie{width:70px;padding:.18rem .38rem;font-size:13px;
             border:1px dashed var(--brand-mid);border-radius:4px;
             font-family:inherit;display:none}
.tf.editing .val{display:none}
.tf.editing input.ie{display:inline-block}

/* ── Parking chips ── */
.pk-list{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:.4rem}
.pk-chip{background:var(--gray-100);border:1px solid var(--gray-300);border-radius:20px;
         padding:.18rem .65rem;font-size:12px;cursor:pointer;transition:all .15s}
.pk-chip:hover{background:var(--brand-light);border-color:var(--brand)}
.pk-chip.sel{background:var(--brand);color:#fff;border-color:var(--brand)}

/* ── Summary cards ── */
.sum-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:.65rem;margin-bottom:1.25rem}
.sum-card{background:var(--brand-light);border:1px solid #c3e6d4;border-radius:var(--r);
          padding:.65rem .9rem;text-align:center}
.sum-card .sl{font-size:10px;color:var(--brand);font-weight:700;text-transform:uppercase}
.sum-card .sv{font-size:20px;font-weight:700;color:var(--brand);margin-top:1px}

/* ── Hoja imprimible ── */
.sheet{background:#fff;border-radius:var(--r);border:1px solid var(--gray-200);padding:2rem}
.sheet-hdr{display:flex;justify-content:space-between;align-items:flex-start;
           margin-bottom:1.4rem;padding-bottom:1rem;border-bottom:2px solid var(--brand)}
.sheet-logo{font-size:19px;font-weight:700;color:var(--brand)}
.sheet-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:.4rem 1.2rem;
            margin-bottom:1.25rem;font-size:13px}
.ml{font-size:10px;color:var(--gray-600);font-weight:700;text-transform:uppercase}
.mv{font-weight:600;margin-top:1px}

/* ── Paradas previas (antes de calcular) ── */
.pprevia{display:grid;grid-template-columns:1fr auto auto auto;gap:.5rem;align-items:center;
         padding:.5rem 0;border-bottom:1px solid var(--gray-200)}
.pprevia:last-child{border-bottom:none}
.pprevia-tipo{font-size:11px;font-weight:700;padding:2px 6px;border-radius:3px;
              white-space:nowrap;color:#fff}
.pprevia-tipo.carga    {background:#27ae60}
.pprevia-tipo.descarga {background:#e74c3c}
.pprevia-tipo.carga_descarga{background:#8e44ad}

/* ── Tiempos editables en hoja ── */
.tl-dur-edit{display:inline-flex;align-items:center;gap:.3rem;margin-top:.3rem}
.tl-dur-edit input{width:52px;padding:2px 4px;font-size:12px;border:1px solid var(--gray-300);
                   border-radius:3px;text-align:center}
.tl-dur-edit label{font-size:12px;color:var(--gray-600)}
.print-only{display:none}
.tl{position:relative;padding-left:72px}
.tl::before{content:'';position:absolute;left:66px;top:0;bottom:0;width:4px;background:#4a90d9}

.tl-stop{position:relative;margin-bottom:0;padding-bottom:1.5rem}
.tl-stop:last-child{padding-bottom:0}

/* hora a la izquierda */
.tl-hora{position:absolute;left:-72px;top:0;width:54px;text-align:center;
         font-size:12px;font-weight:700;color:#fff;padding:2px 4px;border-radius:3px;
         line-height:1.3;white-space:nowrap}
.tl-hora.verde  {background:#27ae60}
.tl-hora.rojo   {background:#e74c3c}

/* nodo círculo sobre la línea */
.tl-dot{position:absolute;left:-10px;top:3px;width:14px;height:14px;
        border-radius:50%;background:#fff;border:3px solid #4a90d9;z-index:1}

/* contenido a la derecha */
.tl-body{padding-left:.5rem;font-size:13px}

.tl-label{font-size:15px;font-weight:400;color:var(--gray-800);margin-bottom:.3rem}
.tl-label strong{font-weight:700}

.tl-section{margin-bottom:.5rem}
.tl-section-title{font-weight:700;font-size:13px;margin-bottom:.15rem}
.tl-section-addr{font-size:12px;color:var(--gray-800);margin-bottom:.1rem}
.tl-section-coords{font-size:11px;color:var(--gray-600);margin-bottom:.15rem}
.tl-section-contact{font-size:12px;color:var(--gray-800);display:grid;
                    grid-template-columns:1fr 1fr;gap:.1rem .5rem}

.tl-tramo-row{font-size:13px;color:var(--gray-800);margin-top:.5rem;display:grid;
              grid-template-columns:auto 1fr;gap:.1rem 1.5rem;max-width:340px;
              border-top:1px solid var(--gray-300);border-bottom:1px solid var(--gray-300);
              padding:.35rem 0;margin-bottom:.25rem}
.tl-tramo-row span:nth-child(odd){color:var(--gray-600)}

.tl-servicios{font-size:16px;letter-spacing:.15rem;margin:.3rem 0 .1rem}
.tl-spots{font-size:13px;color:var(--gray-800);margin-bottom:.1rem}
.tl-spots span{color:var(--gray-600)}
.tl-pausa{font-size:13px;color:var(--gray-800)}
.tl-pausa span{color:var(--gray-600)}
.tl-dia-sep{font-size:11px;font-weight:700;color:#4a90d9;letter-spacing:.12rem;
            text-transform:uppercase;text-align:center;
            padding:.4rem 0;margin:.5rem 0;
            background:var(--bg);
            position:relative;z-index:2;
            border-top:2px dashed #4a90d9;
            border-bottom:2px dashed #4a90d9}
.tl-aviso{font-size:12px;color:#e74c3c;font-weight:600;margin:.25rem 0}
.tl-resumen{background:var(--gray-50);border:1px solid var(--gray-200);border-radius:6px;
            padding:.5rem .75rem;margin:.75rem 0;font-size:13px;
            display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:.25rem}
.tl-resumen span{color:var(--gray-600)}

/* ── Firma ── */
.firmas{display:grid;grid-template-columns:1fr 1fr 1fr;gap:2.5rem;
        margin-top:3rem;border-top:1px solid var(--gray-300);padding-top:1.25rem}
.firma-box{text-align:center}
.firma-line{border-top:1px solid var(--gray-400);margin-top:3rem}
.firma-lbl{font-size:11px;color:var(--gray-600);margin-top:.25rem}

/* ── Historial table ── */
.htable{width:100%;font-size:13px;border-collapse:collapse}
.htable th{text-align:left;padding:.4rem .5rem;border-bottom:2px solid var(--gray-200);
           font-size:11px;text-transform:uppercase;color:var(--gray-600)}
.htable td{padding:.45rem .5rem;border-bottom:1px solid var(--gray-100)}
.htable tr:hover td{background:var(--gray-50)}

/* ── Tabs ── */
.tabs{display:flex;border-bottom:2px solid var(--gray-200);margin-bottom:1.25rem}
.tab{padding:.55rem 1.1rem;font-size:13px;cursor:pointer;color:var(--gray-600);
     border-bottom:2px solid transparent;margin-bottom:-2px;transition:all .15s}
.tab.active{color:var(--brand);border-bottom-color:var(--brand);font-weight:600}
.tab-p{display:none} .tab-p.active{display:block}

/* ── Toast ── */
.toasts{position:fixed;bottom:1.25rem;right:1.25rem;z-index:9999;display:flex;flex-direction:column;gap:.4rem}
.toast{background:var(--gray-800);color:#fff;padding:.55rem .9rem;border-radius:var(--r);
       font-size:13px;animation:sin .2s ease;max-width:280px}
.toast.ok{background:var(--brand)} .toast.err{background:var(--danger)}
@keyframes sin{from{transform:translateX(16px);opacity:0}to{transform:translateX(0);opacity:1}}

/* ── Utils ── */
.flex{display:flex} .gap1{gap:.5rem} .gap2{gap:.9rem} .mt1{margin-top:.5rem} .mt2{margin-top:1rem}
.muted{color:var(--gray-600);font-size:13px}
.badge{display:inline-block;padding:.12rem .5rem;border-radius:10px;font-size:11px;
       font-weight:600;background:var(--gray-200);color:var(--gray-600)}
.badge.verde{background:var(--brand-light);color:var(--brand)}
.badge.azul{background:#d6eaf8;color:#1a5276}
.badge.naranja{background:var(--warn-bg);color:var(--warn)}

/* ── Print ── */
@media print{
  body{background:#fff;font-size:11pt}
  .hdr,.no-print,.tabs,.btn,.toasts{display:none!important}
  .wrap{padding:0;max-width:100%}
  .card{border:none;padding:0;margin:0}
  .sheet{border:none;padding:0}
  .sheet-hdr{border-bottom:1.5pt solid #000}
  .tl::before{background:#4a90d9;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .tl-hora{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .tl-tramo-row{font-size:11pt}
  .tl-dur-edit{display:none}
  .print-only{display:block}
  .sum-grid{display:flex;flex-wrap:wrap;gap:.75rem}
  .sum-card{border:1pt solid #ccc;background:#f9f9f9;flex:1}
  .firmas{break-inside:avoid}
  .tl-stop{break-inside:avoid}
  @page{margin:1.5cm}
}