/* v1-gastos.css — estilos propios de Gastos, Entregas a cuenta, Ajustes de gastos y la subida de tickets (solo añade; no toca tokens).
   Móvil primero: sin scroll horizontal, objetivos ≥ 40 px, cifras tabulares, claro y oscuro por tokens, foco visible. */

.gx { min-width: 0; }
.gx .btn { min-height: 40px; }
.gx .btn--sm { min-height: 40px; }
.gx-back { margin: 0 0 var(--s-3); }
.gx-h3 { font-family: var(--font-display); font-size: var(--fs-md); font-weight: 600; margin: 0 0 var(--s-3); letter-spacing: -.01em; }
.gx-h4 { font-size: var(--fs-sm); font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--ink-3); margin: var(--s-4) 0 var(--s-2); }

/* Cabecera de hoja / entrega */
.gx-head { display: flex; flex-wrap: wrap; gap: var(--s-3) var(--s-4); align-items: flex-start; justify-content: space-between; margin-bottom: var(--s-4); }
.gx-head > div:first-child { min-width: 0; flex: 1 1 220px; }
.gx-head__t { font-family: var(--font-display); font-size: var(--fs-xl); font-weight: 500; letter-spacing: -.02em; line-height: 1.15; margin: 0; overflow-wrap: anywhere; }
.gx-head__r { display: flex; align-items: center; gap: var(--s-3); flex-wrap: wrap; }
.gx-head__tot { font-family: var(--font-display); font-size: var(--fs-xl); font-variant-numeric: tabular-nums; white-space: nowrap; }
.gx-head__tot .v1-money { font-weight: 500; }
.gx-banner { margin-bottom: var(--s-4); }
.gx-banner > div { min-width: 0; overflow-wrap: anywhere; }
.gx-meta { margin-bottom: var(--s-4); }
.gx-meta__g { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: var(--s-4); margin-bottom: var(--s-3); }

/* Líneas de la hoja */
.gx-lines { margin-bottom: var(--s-4); }
.gx-add { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-2); margin-bottom: var(--s-3); }
.gx-add .btn { min-height: 44px; padding-inline: var(--s-2); }
.gx-linelist { display: flex; flex-direction: column; gap: var(--s-2); }
.gx-noitems { padding: var(--s-5) var(--s-4); text-align: center; color: var(--ink-3); border: 1px dashed var(--line-strong); border-radius: var(--r-md); }
.gx-item { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md); padding: var(--s-3) var(--s-4); display: flex; flex-direction: column; gap: var(--s-2); min-width: 0; }
.gx-item.is-denied { opacity: .8; border-left: 3px solid var(--err); }
.gx-item__top { display: flex; justify-content: space-between; gap: var(--s-3); align-items: flex-start; }
.gx-item__t { min-width: 0; overflow-wrap: anywhere; }
.gx-item__a { display: flex; flex-direction: column; align-items: flex-end; flex: none; }
.gx-item__b { display: flex; gap: var(--s-2); flex-wrap: wrap; }
.gx-item .v1-note { margin: 0; }
.gx-miss { font-weight: 600; }
.gx-rv { margin: 0; font-weight: 600; }
.gx-rv--denied { color: var(--err); } .gx-rv--approved { color: var(--ok); }
.gx-tks { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--s-1); }
.gx-tk { display: flex; justify-content: space-between; gap: var(--s-2); align-items: center; flex-wrap: wrap; }
.gx-tk__n { display: inline-flex; gap: var(--s-2); align-items: center; min-width: 0; overflow-wrap: anywhere; }
.gx-tk__b { display: inline-flex; gap: var(--s-1); }

/* Totales */
.gx-sum { display: grid; grid-template-columns: 1fr auto; gap: var(--s-1) var(--s-4); margin: var(--s-4) 0 0; padding: var(--s-3) var(--s-4); background: var(--surface-2); border-radius: var(--r-md); font-variant-numeric: tabular-nums; }
.gx-sum dt { color: var(--ink-2); } .gx-sum dd { margin: 0; text-align: right; font-weight: 600; }
.gx-sum dt:last-of-type, .gx-sum dd:last-of-type { padding-top: var(--s-1); }

/* Revisión por línea */
.gx-rev { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: var(--s-3); padding-top: var(--s-2); border-top: 1px solid var(--line); }
.gx-rev__f { display: flex; flex-direction: column; gap: var(--s-1); min-width: 0; }
.gx-rev__f--w { grid-column: 1 / -1; }
.gx-seg { display: inline-flex; border: 1px solid var(--control-line); border-radius: var(--r-md); overflow: hidden; align-self: end; }
.gx-seg__o { position: relative; display: flex; align-items: center; justify-content: center; min-height: 44px; min-width: 96px; flex: 1; cursor: pointer; font-weight: 600; background: var(--surface); }
.gx-seg__o + .gx-seg__o { border-left: 1px solid var(--control-line); }
.gx-seg__o input { position: absolute; inset: 0; opacity: 0; cursor: pointer; margin: 0; }
.gx-seg__o span { padding: 0 var(--s-3); pointer-events: none; }
.gx-seg__o:has(input:checked) { background: var(--ok); color: var(--ok-ink); }
.gx-seg__o--no:has(input:checked) { background: var(--err); color: var(--err-ink); }
.gx-seg__o:has(input:focus-visible) { outline: 2px solid var(--focus); outline-offset: -3px; }

/* Línea de tiempo */
.gx-time { margin-bottom: var(--s-4); }

/* Hoja inferior: añadir línea */
.gx-sheet { display: flex; flex-direction: column; gap: var(--s-4); }
.gx-kinds { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-2); }
.gx-kinds .btn { min-height: 44px; padding-inline: var(--s-2); }
.gx-kinds p { grid-column: 1 / -1; margin: 0; }
.gx-form .v1-form { gap: var(--s-4); }
.gx-form .form-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: var(--s-4); }
.gx-veh { display: flex; flex-wrap: wrap; gap: var(--s-2); align-items: end; }
.gx-veh .field { flex: 1 1 200px; }
.gx-vf { display: flex; flex-direction: column; gap: var(--s-3); }
.gx-vf__b { display: flex; gap: var(--s-2); justify-content: flex-end; }
.gx-prev:empty { display: none; }
.gx-prev .v1-note { margin: 0; }
.gx-tkbox { border-top: 1px solid var(--line); padding-top: var(--s-2); }

/* Subida de tickets */
.gx-up { display: flex; flex-direction: column; gap: var(--s-2); }
.gx-up__file { position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; clip-path: inset(50%); }
.gx-up__btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--s-2); min-height: 48px; cursor: pointer; border-style: dashed; width: 100%; }
.gx-up__btn.is-disabled { opacity: .5; pointer-events: none; }
.gx-up__file:focus-visible + .gx-up__hint, .gx-up__btn:focus-within { outline: 2px solid var(--focus); outline-offset: 2px; }
.gx-up:has(.gx-up__file:focus-visible) .gx-up__btn { outline: 2px solid var(--focus); outline-offset: 2px; }
.gx-up__hint { margin: 0; }
.gx-up__list { display: flex; flex-direction: column; gap: var(--s-2); }
.gx-up__list:empty { display: none; }
.gx-up__row { display: flex; gap: var(--s-3); align-items: center; padding: var(--s-2); border: 1px solid var(--line); border-radius: var(--r-md); background: var(--surface); flex-wrap: wrap; }
.gx-up__img, .gx-up__pdf { width: 56px; height: 56px; border-radius: var(--r-sm); object-fit: cover; flex: none; background: var(--surface-2); border: 1px solid var(--line); }
.gx-up__pdf { display: grid; place-items: center; font-weight: 700; font-size: var(--fs-sm); color: var(--err); }
.gx-up__meta { flex: 1 1 140px; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.gx-up__name { font-weight: 600; overflow-wrap: anywhere; }
.gx-up__st { font-size: var(--fs-sm); color: var(--ink-2); display: inline-flex; gap: var(--s-2); align-items: center; }
.gx-up__st--ok { color: var(--ok); font-weight: 600; } .gx-up__st--err { color: var(--err); font-weight: 600; }
.gx-up__spin { width: 14px; height: 14px; border-radius: 50%; border: 2px solid var(--line-strong); border-top-color: var(--accent); animation: gx-spin .8s linear infinite; }
@keyframes gx-spin { to { transform: rotate(360deg); } }

/* Visor de tickets */
.gx-lb__tools { display: flex; gap: var(--s-2); margin-bottom: var(--s-3); }
.gx-lb__view { max-height: 65vh; overflow: auto; background: var(--surface-2); border-radius: var(--r-md); border: 1px solid var(--line); text-align: center; }
.gx-lb__img { display: block; margin: 0 auto; max-width: 100%; height: auto; cursor: zoom-in; }

/* Entregas a cuenta */
.gx-advs { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: var(--s-3); }
.gx-adv { display: flex; gap: var(--s-4); align-items: center; padding: var(--s-4); background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md); color: inherit; text-decoration: none; min-width: 0; min-height: 64px; }
.gx-adv:hover { border-color: var(--ink-2); }
.gx-adv.is-late { border-left: 3px solid var(--err); }
.gx-adv__ring { flex: none; }
.gx-adv__b { min-width: 0; display: flex; flex-direction: column; gap: var(--s-1); }
.gx-adv__t { display: flex; gap: var(--s-2); align-items: center; flex-wrap: wrap; }
.gx-adv__c { overflow-wrap: anywhere; }
.gx-adv__l { font-size: var(--fs-sm); color: var(--ink-2); font-variant-numeric: tabular-nums; }
.gx-late { color: var(--err); font-weight: 600; }
.gx-adv-sum { display: flex; gap: var(--s-5); align-items: center; flex-wrap: wrap; margin-bottom: var(--s-4); }
.gx-adv-sum__k { flex: 1 1 260px; min-width: 0; }
.gx-adv-sum__k .v1-kpis { margin-bottom: var(--s-2); }
.gx-ledger { margin-bottom: var(--s-4); }
.gx-led { list-style: none; margin: 0; padding: 0; }
.gx-led__r { display: flex; justify-content: space-between; gap: var(--s-3); padding: var(--s-3) 0; border-top: 1px solid var(--line); align-items: flex-start; }
.gx-led__r:first-child { border-top: 0; }
.gx-led__a.is-neg { color: var(--ink); } .gx-led__a.is-pos { color: var(--ok); }

/* Ajustes */
.gx-ref { margin-bottom: var(--s-4); }
.gx-sec { margin-bottom: var(--s-5); }
.gx-sec__h { display: flex; justify-content: space-between; align-items: center; gap: var(--s-3); margin-bottom: var(--s-2); flex-wrap: wrap; }
.gx-sec__h .gx-h3 { margin: 0; }
.gx-cfg { margin-top: var(--s-2); }
.gx-cfgrow { cursor: default; }
.gx-cfgrow.is-old .v1-item__t { color: var(--ink-3); }
.gx-set { max-width: 720px; }
.gx-set__b { display: flex; justify-content: flex-end; }
.gx .switch-row { gap: var(--s-4); }

.gx .gx-listbox, .gx .gx-filters { min-width: 0; }
.gx-filters[hidden] { display: none; }

@media (min-width: 720px) {
  .gx-add { grid-template-columns: repeat(3, max-content); }
  .gx-add .btn { padding-inline: var(--s-5); }
  .gx-up__btn { width: auto; }
}
@media (prefers-reduced-motion: reduce) { .gx-up__spin { animation: none; } }
@media print { .gx-add, .gx-item__b { display: none; } }