/* v6.10.17 — espaciado premium y responsive coherente en formularios/modales */

/* Ritmo vertical general: evita que título, explicación, campo, resumen y acciones se amontonen. */
body.ui68 .modalbox.v6117-fuel-modal{
  width:min(100%,760px)!important;
  max-width:760px!important;
  padding:26px!important;
  overflow-x:hidden!important;
}
body.ui68 .modalbox.v6117-fuel-modal>h2{
  margin:0 0 12px!important;
  font-size:25px!important;
  line-height:1.15!important;
}
body.ui68 .modalbox.v6117-fuel-modal>h2+.note{
  margin:0 0 22px!important;
  font-size:13.5px!important;
  line-height:1.55!important;
  color:#766970!important;
}
body.ui68 .modalbox.v6117-fuel-modal #sumFields{
  margin:0!important;
  gap:16px!important;
}
body.ui68 .modalbox.v6117-fuel-modal #sumFields .field label{
  margin:0 0 7px!important;
  min-height:0!important;
  line-height:1.25!important;
}
body.ui68 .modalbox.v6117-fuel-modal #sumFields .field input,
body.ui68 .modalbox.v6117-fuel-modal #sumFields .field select{
  height:48px!important;
  min-height:48px!important;
  border-radius:13px!important;
  padding:0 13px!important;
}
body.ui68 .modalbox.v6117-fuel-modal #sumFields + .calc,
body.ui68 .modalbox.v6117-fuel-modal .v6113-sum-total{
  margin-top:20px!important;
  padding:17px 18px!important;
  border-radius:16px!important;
}
body.ui68 .modalbox.v6117-fuel-modal #sumFields + .calc small,
body.ui68 .modalbox.v6117-fuel-modal .v6113-sum-total small{
  display:block!important;
  margin-bottom:5px!important;
  line-height:1.35!important;
}
body.ui68 .modalbox.v6117-fuel-modal #sumFields + .calc>b,
body.ui68 .modalbox.v6117-fuel-modal .v6113-sum-total b{
  margin-top:0!important;
}
body.ui68 .modalbox.v6117-fuel-modal>.actions{
  margin-top:22px!important;
  padding-top:18px!important;
  gap:10px!important;
}
body.ui68 .modalbox.v6117-fuel-modal>.actions .btn{
  min-height:48px!important;
  padding:0 18px!important;
  border-radius:12px!important;
}

/* Modal calibrado CM ↔ L: también respira como una pantalla de captura, no como una tabla apretada. */
body.ui68 .modalbox.v6117-calibration-modal{
  width:min(100%,820px)!important;
  max-width:820px!important;
}
body.ui68 .modalbox.v6117-calibration-modal .v6116-modal-head{margin-bottom:18px!important}
body.ui68 .modalbox.v6117-calibration-modal .v6116-current{margin-bottom:16px!important;padding:12px 14px!important}
body.ui68 .modalbox.v6117-calibration-modal .v6116-tank-list{gap:16px!important}
body.ui68 .modalbox.v6117-calibration-modal .v6116-tank{padding:16px!important;border-radius:17px!important}
body.ui68 .modalbox.v6117-calibration-modal .v6116-tank-head{margin-bottom:14px!important}
body.ui68 .modalbox.v6117-calibration-modal .v6116-convert-grid{gap:10px!important}
body.ui68 .modalbox.v6117-calibration-modal .v6116-total{margin-top:18px!important;padding:17px 18px!important}
body.ui68 .modalbox.v6117-calibration-modal .v6116-modal-note{margin-top:13px!important;line-height:1.55!important}

/* Espaciado consistente en bloques de captura de toda la interfaz. */
body.ui68 .stage>.formgrid,body.ui68 .card>.formgrid{row-gap:16px!important;column-gap:14px!important}
body.ui68 .field label{margin-bottom:7px!important;line-height:1.25!important}
body.ui68 .field input:not([type="checkbox"]):not([type="radio"]),
body.ui68 .field select{border-radius:12px!important}
body.ui68 .notice{line-height:1.5!important}
body.ui68 .stage .notice{margin-top:12px!important;margin-bottom:16px!important}
body.ui68 .stage>.note{margin-top:14px!important;margin-bottom:4px!important}

/* Consulta rápida: separación clara entre selección, tanque y total. */
body.ui68 .v6116-quick-card .section-title{margin-bottom:16px!important}
body.ui68 .v6116-quick-select{margin:0 0 18px!important}
body.ui68 .v6116-quick-tanks{gap:14px!important}
body.ui68 .v6116-quick-total{margin-top:16px!important;padding:17px 18px!important}

/* Móvil: distribuir por prioridad, no encoger todo. */
@media(max-width:640px){
  body.ui68 .modal{padding:8px!important;align-items:flex-start!important}
  body.ui68 .modalbox.v6117-fuel-modal,
  body.ui68 .modalbox.v6117-calibration-modal{
    width:100%!important;
    max-width:100%!important;
    max-height:calc(100dvh - 16px)!important;
    margin:0!important;
    padding:18px!important;
    border-radius:18px!important;
  }
  body.ui68 .modalbox.v6117-fuel-modal>h2{font-size:22px!important;margin-bottom:10px!important}
  body.ui68 .modalbox.v6117-fuel-modal>h2+.note{font-size:13px!important;margin-bottom:18px!important}
  body.ui68 .modalbox.v6117-fuel-modal #sumFields{grid-template-columns:1fr!important;gap:14px!important}
  body.ui68 .modalbox.v6117-fuel-modal #sumFields + .calc,
  body.ui68 .modalbox.v6117-fuel-modal .v6113-sum-total{margin-top:17px!important;padding:15px!important}
  body.ui68 .modalbox.v6117-fuel-modal>.actions{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:9px!important;
    margin-top:18px!important;
    padding-top:16px!important;
  }
  body.ui68 .modalbox.v6117-fuel-modal>.actions .btn{width:100%!important;min-width:0!important;padding:0 10px!important}

  /* En CM↔L apilamos las dos mediciones para que nunca se compriman en iPhone. */
  body.ui68 .v6116-convert-grid{grid-template-columns:1fr!important;gap:7px!important}
  body.ui68 .v6116-arrow{height:24px!important;transform:rotate(90deg)!important;align-self:center!important}
  body.ui68 .v6116-unit-input input{height:50px!important;font-size:17px!important}
  body.ui68 .v6116-tank{padding:14px!important}
  body.ui68 .v6116-tank-head{gap:10px!important;margin-bottom:13px!important}
  body.ui68 .v6116-profile{display:grid!important;grid-template-columns:auto minmax(0,1fr)!important;width:100%!important}
  body.ui68 .v6116-profile select{width:100%!important;min-width:0!important}
  body.ui68 .v6116-tank-foot{align-items:flex-start!important;gap:8px!important}
  body.ui68 .v6116-tank-foot span{min-width:0!important;line-height:1.35!important}
  body.ui68 .v6116-total,body.ui68 .v6116-quick-total{
    display:grid!important;
    grid-template-columns:1fr auto!important;
    align-items:end!important;
    gap:12px!important;
    padding:15px!important;
  }
  body.ui68 .v6116-total b,body.ui68 .v6116-quick-total b{font-size:22px!important}
  body.ui68 .v6116-total-pct{font-size:21px!important}

  /* Secciones y formularios normales: una columna donde los labels son largos. */
  body.ui68 .v610-transfer-stage .formgrid{grid-template-columns:1fr!important;gap:14px!important}
  body.ui68 .stage>.formgrid{grid-template-columns:1fr!important;gap:14px!important}
  body.ui68 .field input:not([type="checkbox"]):not([type="radio"]),body.ui68 .field select{width:100%!important;min-width:0!important}
  body.ui68 .fuel-entry{width:100%!important;display:grid!important;grid-template-columns:minmax(0,1fr) 46px!important;gap:8px!important}
  body.ui68 .fuel-entry .btn{width:46px!important;min-width:46px!important;padding:0!important}

  /* Tarjetas y resúmenes con un poco más de aire lateral, sin volverse enormes. */
  body.ui68 .card,body.ui68 .stage{padding:15px!important}
  body.ui68 .section-title{gap:8px!important;margin-bottom:12px!important}
  body.ui68 .calc{padding:14px!important}
  body.ui68 .calcgrid{gap:9px!important}
}

@media(max-width:390px){
  body.ui68 .modalbox.v6117-fuel-modal>.actions{grid-template-columns:1fr!important}
  body.ui68 .v6116-total,body.ui68 .v6116-quick-total{grid-template-columns:1fr!important;align-items:start!important}
  body.ui68 .v6116-quick-total>div:last-child{text-align:left!important}
}