/* =====================================================================
   ESTA – Solicitud grupal · mismo lenguaje visual que el formulario
   ===================================================================== */
.tvg{--g-navy:#0F2440;--g-navy2:#1B3356;--g-ink:#1D2733;--g-muted:#5B6878;--g-line:#C9D2DD;--g-soft:#F2F5F8;
  --g-orange:#F58E02;--g-orange-d:#B56901;--g-ok:#1E7B4D;--g-ok-bg:#E8F4EE;--g-err:#B42318;--g-r:4px;
  width:100%;font-family:"Inter",system-ui,sans-serif;color:var(--g-ink);scroll-margin-top:110px}
.tvg *,.tvg *::before,.tvg *::after{box-sizing:border-box}
.tvg p{margin:0}
.tvg-f{display:inline;margin:0}

/* ---------- Visibilidad según la vista (clase en <body>) ---------- */
body.tvg-vista-inicio .tvg-form-caja,
body.tvg-vista-panel .tvg-form-caja{display:none !important}
body.tvg-vista-form .tvg-panel,
body.tvg-vista-inicio .tvg-panel{display:none}
body:not(.tvg-vista-form) .tvg-barra,
body:not(.tvg-vista-form) .tvg-solo-form{display:none}

/* ---------- Tarjeta y cabecera ---------- */
.tvg-card{background:#fff;border:1px solid var(--g-line);border-radius:var(--g-r);overflow:hidden}
.tvg-head{display:flex;align-items:center;justify-content:space-between;gap:16px;background:var(--g-navy);color:#fff;padding:18px 22px;position:relative}
.tvg-head::after{content:"";position:absolute;left:0;right:0;bottom:-4px;height:4px;
  background:linear-gradient(90deg,var(--g-orange) 0 33%,#fff 33% 34%,var(--g-navy2) 34% 100%)}
.tvg-kicker{font:600 10.5px/1 "Inter",sans-serif;letter-spacing:2px;text-transform:uppercase;color:#9FB2C8;margin:0 0 7px;display:block}
.tvg-title{font:700 20px/1.25 "Outfit","Inter",sans-serif;color:#fff}
.tvg-sub{font:400 13px/1.45 "Inter",sans-serif;color:#C9D4E1;margin-top:6px !important}
.tvg-head__bar{flex:0 0 180px;height:6px;background:rgba(255,255,255,.18);border-radius:99px;overflow:hidden}
.tvg-head__bar span{display:block;height:100%;background:var(--g-orange);border-radius:99px;transition:width .4s ease}

/* ---------- Botones ---------- */
.tvg .tvg-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border:1px solid transparent;border-radius:8px;
  font:600 14.5px/1 "Inter",sans-serif;padding:14px 22px;cursor:pointer;text-decoration:none;transition:background .15s,border-color .15s,color .15s;white-space:nowrap}
.tvg .tvg-btn--pri{background:var(--g-orange);color:#fff}
.tvg .tvg-btn--pri:hover{background:var(--g-orange-d);color:#fff}
.tvg .tvg-btn--sec{background:#EEF2F6;color:var(--g-navy);border-color:#DCE2E8}
.tvg .tvg-btn--sec:hover{background:#DCE2E8;color:var(--g-navy)}
.tvg .tvg-btn--ghost{background:transparent;color:var(--g-navy2);border-color:var(--g-line)}
.tvg .tvg-btn--ghost:hover{background:var(--g-soft);color:var(--g-navy)}
.tvg .tvg-btn--peligro{color:var(--g-err)}
.tvg .tvg-btn--peligro:hover{color:var(--g-err);border-color:#E9B8B3;background:#FDF1F0}
.tvg .tvg-btn--sm{padding:9px 13px;font-size:13px}
.tvg .tvg-link{background:none;border:0;padding:0;color:var(--g-muted);font:500 12.5px/1.4 "Inter",sans-serif;text-decoration:underline;cursor:pointer}
.tvg .tvg-link:hover{color:var(--g-err);background:none}
.tvg .tvg-btn:focus-visible,.tvg .tvg-link:focus-visible,.tvg-stepper button:focus-visible{outline:3px solid rgba(245,142,2,.45);outline-offset:2px}

/* ---------- Avisos ---------- */
.tvg-aviso{border:1px solid;border-left-width:4px;border-radius:var(--g-r);padding:12px 15px;margin:0 0 14px;font:400 13.5px/1.55 "Inter",sans-serif}
.tvg-aviso--ok{background:var(--g-ok-bg);border-color:#BFDCCB;border-left-color:var(--g-ok);color:#174D33}
.tvg-aviso--info{background:#FFF8EC;border-color:#F6D9A8;border-left-color:var(--g-orange);color:#4A3A1F}
.tvg-aviso--error{background:#FDF1F0;border-color:#F1C5C0;border-left-color:var(--g-err);color:#7A1A12}
.tvg-aviso--in{margin:18px 20px 0}
.tvg-aviso--in .tvg-btn{margin:0 0 0 8px;vertical-align:middle}

/* ---------- Inicio ---------- */
.tvg-inicio__form{display:flex;align-items:flex-end;flex-wrap:wrap;gap:18px 24px;padding:26px 22px 22px;border-bottom:1px solid var(--g-line)}
.tvg-inicio__label{flex-basis:100%;font:600 13px/1 "Inter",sans-serif;color:var(--g-navy);margin:0 0 -8px}
.tvg-stepper{display:inline-flex;border:1px solid #DCE2E8;border-radius:8px;overflow:hidden;height:50px}
.tvg-stepper button{width:48px;border:0;background:#EEF2F6;color:var(--g-navy);font:600 22px/1 "Inter",sans-serif;cursor:pointer;padding:0}
.tvg-stepper button:hover{background:#DCE2E8}
.tvg-stepper input{width:64px;border:0 !important;border-left:1px solid #DCE2E8 !important;border-right:1px solid #DCE2E8 !important;border-radius:0 !important;
  text-align:center;font:700 20px/1 "Outfit","Inter",sans-serif;color:var(--g-navy);-moz-appearance:textfield;padding:0 !important;background:#fff;height:100%}
.tvg-stepper input::-webkit-outer-spin-button,.tvg-stepper input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.tvg-inicio__precio{display:flex;flex-direction:column;gap:3px;margin-right:auto;min-width:150px}
.tvg-inicio__precio span{font:600 10.5px/1 "Inter",sans-serif;letter-spacing:1.4px;text-transform:uppercase;color:var(--g-muted)}
.tvg-inicio__precio strong{font:700 24px/1.1 "Outfit","Inter",sans-serif;color:var(--g-navy);font-variant-numeric:tabular-nums}
.tvg-inicio__precio small{font:400 12.5px/1.2 "Inter",sans-serif;color:var(--g-muted)}
.tvg-como{list-style:none;margin:0;padding:8px 22px 6px;counter-reset:tvgc}
.tvg-como li{counter-increment:tvgc;position:relative;padding:12px 0 12px 40px;border-bottom:1px dashed #DCE2E8;font:400 13.5px/1.55 "Inter",sans-serif;color:var(--g-muted)}
.tvg-como li:last-child{border-bottom:0}
.tvg-como li strong{color:var(--g-navy)}
.tvg-como li::before{content:counter(tvgc);position:absolute;left:2px;top:12px;width:24px;height:24px;border-radius:3px;background:var(--g-navy2);
  color:#fff;font:700 12px/24px "Inter",sans-serif;text-align:center}
.tvg-alt{padding:0 22px 18px;font:400 13px/1.5 "Inter",sans-serif;color:var(--g-muted)}
.tvg-alt a{color:var(--g-orange-d);font-weight:600}

/* ---------- Panel: lista de viajeros ---------- */
.tvg-lista{list-style:none;margin:0;padding:10px 20px 4px}
.tvg-fila{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:6px 14px;padding:14px 0;border-bottom:1px solid #E6EBF0}
.tvg-fila:last-child{border-bottom:0}
.tvg-num{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font:700 13px/1 "Inter",sans-serif;border:2px solid var(--g-line);color:var(--g-muted);background:#fff}
.tvg-fila--ok .tvg-num{background:var(--g-navy2);border-color:var(--g-navy2);color:#fff}
.tvg-fila__info{min-width:0;display:flex;flex-direction:column;gap:3px}
.tvg-fila__info strong{font:700 15px/1.3 "Outfit","Inter",sans-serif;color:var(--g-navy);text-transform:uppercase;letter-spacing:.3px;overflow-wrap:anywhere}
.tvg-fila__info span{font:400 12.5px/1.35 "Inter",sans-serif;color:var(--g-muted);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.tvg-fila--pend .tvg-fila__info strong{color:var(--g-muted)}
.tvg-pill{font:600 10.5px/1 "Inter",sans-serif;letter-spacing:1px;text-transform:uppercase;padding:6px 9px;border-radius:99px;background:var(--g-soft);color:var(--g-muted);border:1px solid #E1E7ED}
.tvg-pill--ok{background:var(--g-ok-bg);color:var(--g-ok);border-color:#BFDCCB}
.tvg-fila__acc{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap}

.tvg-pie{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px 20px;background:var(--g-soft);border-top:1px solid var(--g-line);padding:18px 20px}
.tvg-pie__total{display:flex;flex-direction:column;gap:4px}
.tvg-pie__total span{font:600 10.5px/1 "Inter",sans-serif;letter-spacing:1.4px;text-transform:uppercase;color:var(--g-muted)}
.tvg-pie__total strong{font:700 18px/1.2 "Outfit","Inter",sans-serif;color:var(--g-navy);font-variant-numeric:tabular-nums}
.tvg-pie__acc{display:flex;gap:10px;flex-wrap:wrap}
.tvg-cancelar{padding:12px 20px 14px;text-align:right}

/* ---------- Barra sobre el formulario ---------- */
.tvg-barra{display:flex;align-items:center;gap:14px 22px;flex-wrap:wrap;background:#fff;border:1px solid var(--g-line);border-left:4px solid var(--g-orange);
  border-radius:var(--g-r);padding:14px 18px;margin:0 0 14px}
.tvg-barra__main{display:flex;flex-direction:column;margin-right:auto}
.tvg-barra__main .tvg-kicker{color:var(--g-muted);margin-bottom:5px}
.tvg-barra__main strong{font:700 17px/1.25 "Outfit","Inter",sans-serif;color:var(--g-navy)}
.tvg-dots{display:flex;gap:6px;list-style:none;margin:0;padding:0}
.tvg-dots li{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font:700 11.5px/1 "Inter",sans-serif;border:2px solid var(--g-line);color:var(--g-muted);background:#fff}
.tvg-dots li.is-ok{background:var(--g-navy2);border-color:var(--g-navy2);color:#fff}
.tvg-dots li.is-actual{background:var(--g-orange);border-color:var(--g-orange);color:#fff;box-shadow:0 0 0 4px rgba(245,142,2,.18)}

/* ---------- Móvil ---------- */
@media (max-width:767px){
  .tvg-head{flex-direction:column;align-items:stretch;padding:16px}
  .tvg-head__bar{flex-basis:auto}
  .tvg-title{font-size:18px}
  .tvg-inicio__form{padding:20px 16px;gap:16px}
  .tvg-inicio__form > .tvg-btn{width:100%}
  .tvg-como{padding:6px 16px 4px}
  .tvg-alt{padding:0 16px 16px}
  .tvg-lista{padding:6px 14px 2px}
  .tvg-fila{grid-template-columns:auto 1fr auto}
  .tvg-fila__acc{grid-column:2 / -1;justify-content:flex-start}
  .tvg-pie{padding:16px 14px}
  .tvg-pie__acc{width:100%}
  .tvg-pie__acc .tvg-f,.tvg-pie__acc > .tvg-btn{flex:1 1 100%}
  .tvg-pie__acc .tvg-btn{width:100%}
  .tvg-aviso--in{margin:14px 14px 0}
  .tvg-aviso--in .tvg-btn{margin:10px 0 0;display:flex;width:100%}
  .tvg-barra{padding:12px 14px}
  .tvg-barra__acc{width:100%}
  .tvg-barra__acc .tvg-btn{width:100%}
}
@media (prefers-reduced-motion:reduce){.tvg-head__bar span{transition:none}}