/* ═══════════════════════════════════════════════════════════════
   GoldenBot — asistente de reservación

   Superficie de tarea, no de marca: el turista está reservando con
   una mano, apurado y con luz de día. Por eso tema claro, controles
   grandes y el verde de marca reservado a la acción principal y a
   lo que está seleccionado. Todo lo demás son neutros teñidos.
   ═══════════════════════════════════════════════════════════════ */

.gb-root{
  /* Neutros teñidos hacia el verde de marca: ni un solo gris puro */
  --gb-panel:      oklch(99.4% 0.003 190);
  --gb-sunken:     oklch(97.2% 0.008 190);
  --gb-raised:     oklch(100% 0 0 / .72);
  --gb-line:       oklch(92.5% 0.012 190);
  --gb-line-soft:  oklch(95.5% 0.008 190);
  --gb-line-firm:  oklch(86% 0.018 190);

  --gb-ink:        oklch(25% 0.028 190);
  --gb-ink-2:      oklch(46% 0.022 190);
  --gb-ink-3:      oklch(54% 0.018 190);

  /* Acento: solo acción principal, selección y estado.
     Este tono es el más claro que sostiene texto blanco a 4.5:1; el brillante
     queda para lo puramente decorativo, donde no hay texto encima. */
  --gb-accent:     oklch(54% 0.105 179);
  --gb-accent-h:   oklch(48% 0.098 180);
  --gb-accent-lite:oklch(66.5% 0.113 178);
  --gb-accent-ink: oklch(46% 0.088 181);
  --gb-accent-dim: oklch(52% 0.075 181);
  --gb-wash:       oklch(96.5% 0.027 180);
  --gb-edge:       oklch(88% 0.048 180);

  /* El robot de marca es azul: su placa lo puentea hacia la interfaz */
  --gb-plate:      oklch(97.6% 0.016 255);
  --gb-plate-edge: oklch(91% 0.028 255);

  --gb-danger:     oklch(57% 0.185 25);
  --gb-danger-bg:  oklch(96% 0.03 25);
  --gb-online:     oklch(70% 0.16 152);

  /* Tipografía: Josefin para interfaz, Lato para prosa y campos.
     Playfair queda solo para el precio y el folio, que son el premio. */
  --gb-ui:   'Josefin Sans', system-ui, sans-serif;
  --gb-text: 'Lato', system-ui, sans-serif;
  --gb-show: 'Playfair Display', Georgia, serif;

  --gb-r-sm: 10px;
  --gb-r:    14px;
  --gb-r-lg: 20px;
  --gb-r-xl: 26px;

  --gb-out: cubic-bezier(.22, 1, .36, 1);
  --gb-shadow: 0 1px 2px oklch(25% 0.03 190 / .04),
               0 12px 28px -8px oklch(25% 0.03 190 / .12),
               0 40px 80px -24px oklch(25% 0.03 190 / .22);
}

.gb-root *:focus-visible{
  outline: 2px solid var(--gb-accent);
  outline-offset: 2px;
  border-radius: 4px;
}

/* ── Lanzador ───────────────────────────────────────────────── */
/* Es la acción principal de la página: por eso lleva el acento */
.gb-launcher{
  position:fixed;
  right:clamp(14px,3vw,26px);
  bottom:calc(clamp(16px,3vw,26px) + env(safe-area-inset-bottom));
  z-index:8000;
  display:flex;align-items:center;gap:12px;
  padding:8px 22px 8px 8px;
  border:none;border-radius:99px;
  background:var(--gb-accent);
  cursor:pointer;
  box-shadow:0 2px 6px oklch(42% 0.08 180 / .22), 0 14px 32px -10px oklch(42% 0.08 180 / .42);
  transition:transform .22s var(--gb-out), box-shadow .22s var(--gb-out), opacity .18s linear;
  -webkit-tap-highlight-color:transparent;
}
.gb-launcher:hover{transform:translateY(-2px);box-shadow:0 2px 6px oklch(42% 0.08 180 / .24), 0 20px 42px -10px oklch(42% 0.08 180 / .5)}
.gb-launcher:active{transform:translateY(0)}
.gb-launcher.gb-hidden{opacity:0;pointer-events:none;transform:scale(.9)}

.gb-avatar{
  border-radius:50%;flex-shrink:0;position:relative;
  background:var(--gb-plate);
  box-shadow:inset 0 0 0 1px var(--gb-plate-edge);
  display:grid;place-items:center;overflow:hidden;
}
.gb-avatar img{width:78%;height:78%;object-fit:contain;display:block}
.gb-launcher .gb-avatar{width:42px;height:42px}

.gb-launcher-txt{display:flex;flex-direction:column;align-items:flex-start;gap:3px;text-align:left}
.gb-launcher-name{
  font-family:var(--gb-ui);font-size:.8125rem;font-weight:700;
  letter-spacing:.09em;text-transform:uppercase;color:#fff;line-height:1;
}
.gb-launcher-sub{
  font-family:var(--gb-text);font-size:.75rem;font-weight:400;line-height:1;
  color:oklch(100% 0 0 / .82);white-space:nowrap;
}

/* Globo de invitación: aparece por intención (al ver tarifas), no por reloj */
.gb-teaser{
  position:fixed;
  right:clamp(14px,3vw,26px);
  bottom:calc(clamp(16px,3vw,26px) + 68px + env(safe-area-inset-bottom));
  z-index:7999;max-width:min(262px,74vw);
  background:var(--gb-panel);color:var(--gb-ink);
  padding:14px 40px 14px 16px;
  border:1px solid var(--gb-line);border-radius:var(--gb-r) var(--gb-r) 4px var(--gb-r);
  font-family:var(--gb-text);font-size:.875rem;line-height:1.5;
  box-shadow:0 1px 2px oklch(25% 0.03 190 / .05), 0 16px 36px -12px oklch(25% 0.03 190 / .28);
  opacity:0;transform:translateY(8px) scale(.98);pointer-events:none;
  transition:opacity .25s linear, transform .25s var(--gb-out);
}
.gb-teaser.gb-on{opacity:1;transform:none;pointer-events:auto}
.gb-teaser strong{font-weight:700;color:var(--gb-accent-ink)}
.gb-teaser-x{
  position:absolute;top:8px;right:8px;width:26px;height:26px;
  border:none;border-radius:50%;background:transparent;color:var(--gb-ink-3);
  font-size:.8125rem;line-height:1;cursor:pointer;display:grid;place-items:center;
  transition:background .15s linear,color .15s linear;
}
.gb-teaser-x:hover{background:var(--gb-sunken);color:var(--gb-ink)}

/* ── Ventana ────────────────────────────────────────────────── */
.gb-scrim{
  position:fixed;inset:0;z-index:9700;
  background:oklch(25% 0.03 190 / .42);
  opacity:0;pointer-events:none;transition:opacity .2s linear;
}
.gb-scrim.gb-on{opacity:1;pointer-events:auto}

.gb-panel{
  position:fixed;z-index:9750;
  right:clamp(14px,3vw,26px);
  bottom:calc(clamp(16px,3vw,26px) + env(safe-area-inset-bottom));
  width:min(400px,calc(100vw - 28px));
  height:min(648px,calc(100vh - 88px));
  display:none;flex-direction:column;overflow:hidden;
  background:var(--gb-panel);
  border:1px solid var(--gb-line);border-radius:var(--gb-r-xl);
  box-shadow:var(--gb-shadow);
}
.gb-panel.gb-on{display:flex;animation:gbIn .26s var(--gb-out)}
@keyframes gbIn{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}

/* Encabezado sereno: el acento se guarda para la acción */
.gb-head{
  flex-shrink:0;display:flex;align-items:center;gap:12px;
  padding:14px 14px 14px 16px;
  border-bottom:1px solid var(--gb-line-soft);
  background:var(--gb-panel);
}
.gb-head .gb-avatar{width:40px;height:40px}
.gb-head .gb-avatar::after{
  content:'';position:absolute;right:1px;bottom:1px;
  width:11px;height:11px;border-radius:50%;
  background:var(--gb-online);box-shadow:0 0 0 2.5px var(--gb-panel);
}
.gb-head-meta{flex:1;min-width:0}
.gb-head-name{
  font-family:var(--gb-ui);font-size:1.0625rem;font-weight:700;
  letter-spacing:.005em;color:var(--gb-ink);line-height:1.15;
}
.gb-head-status{
  font-family:var(--gb-text);font-size:.75rem;color:var(--gb-ink-3);
  line-height:1.3;margin-top:2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.gb-icon-btn{
  width:36px;height:36px;flex-shrink:0;border:none;border-radius:10px;
  background:transparent;color:var(--gb-ink-2);cursor:pointer;
  display:grid;place-items:center;
  transition:background .15s linear,color .15s linear;
  -webkit-tap-highlight-color:transparent;
}
.gb-icon-btn:hover{background:var(--gb-sunken);color:var(--gb-ink)}
.gb-icon-btn[hidden]{display:none}
.gb-icon-btn svg{width:17px;height:17px}

/* ── Tira del viaje ─────────────────────────────────────────── */
/* Lo que el usuario va armando, siempre a la vista y editable de
   un toque. Sustituye a la barra de 12 segmentos, que no decía nada. */
.gb-trip{
  flex-shrink:0;position:relative;
  border-bottom:1px solid var(--gb-line-soft);
  background:var(--gb-sunken);
  display:none;
}
.gb-trip.gb-on{display:block}
.gb-trip::before,.gb-trip::after{
  content:'';position:absolute;top:0;bottom:2px;width:20px;z-index:1;pointer-events:none;
}
.gb-trip::before{left:0;background:linear-gradient(to right,var(--gb-sunken),transparent)}
.gb-trip::after{right:0;background:linear-gradient(to left,var(--gb-sunken),transparent)}
.gb-trip-scroll{
  display:flex;gap:6px;align-items:center;
  padding:9px 14px 10px;
  overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;
}
.gb-trip-scroll::-webkit-scrollbar{display:none}
.gb-fact{
  flex-shrink:0;display:inline-flex;align-items:center;gap:6px;
  padding:5px 11px;border:1px solid var(--gb-line);border-radius:99px;
  background:var(--gb-panel);cursor:pointer;
  font-family:var(--gb-text);font-size:.75rem;color:var(--gb-ink);
  white-space:nowrap;max-width:190px;
  transition:border-color .15s linear,background .15s linear;
  -webkit-tap-highlight-color:transparent;
}
.gb-fact:hover{border-color:var(--gb-edge);background:var(--gb-wash)}
.gb-fact b{
  font-family:var(--gb-ui);font-size:.625rem;font-weight:700;
  letter-spacing:.11em;text-transform:uppercase;color:var(--gb-ink-3);
}
.gb-fact span{min-width:0;overflow:hidden;text-overflow:ellipsis}
.gb-fact svg{width:11px;height:11px;flex-shrink:0;color:var(--gb-ink-3);opacity:0;transition:opacity .15s linear}
.gb-fact:hover svg{opacity:1}
/* Hilo de progreso: una sola línea, no doce marcas */
.gb-trip-bar{position:absolute;left:0;right:0;bottom:-1px;height:2px;background:transparent}
.gb-trip-bar i{
  display:block;height:100%;width:0;background:var(--gb-accent-lite);
  transition:width .32s var(--gb-out);
}

/* ── Hilo ───────────────────────────────────────────────────── */
.gb-thread{
  flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;
  padding:18px 16px 10px;display:flex;flex-direction:column;gap:3px;
}
.gb-thread::-webkit-scrollbar{width:3px}
.gb-thread::-webkit-scrollbar-thumb{background:var(--gb-line-firm);border-radius:3px}

.gb-msg{display:flex;gap:9px;max-width:100%;animation:gbMsg .22s var(--gb-out)}
@keyframes gbMsg{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
/* Los mensajes seguidos del bot se agrupan: el avatar solo en el último */
.gb-msg + .gb-msg{margin-top:3px}
.gb-msg.gb-turn{margin-top:14px}

.gb-msg .gb-avatar{width:26px;height:26px;align-self:flex-end;margin-bottom:1px}
.gb-msg .gb-avatar.gb-void{background:none;box-shadow:none}
.gb-msg .gb-avatar.gb-void img{display:none}

.gb-bubble{
  padding:10px 14px;max-width:calc(100% - 42px);
  font-family:var(--gb-text);font-size:.9375rem;line-height:1.55;
  color:var(--gb-ink);
  /* break-word y no anywhere: anywhere reduce el ancho mínimo del elemento y
     estrangula las burbujas cortas en una columna de una palabra */
  overflow-wrap:break-word;
}
.gb-msg.gb-bot .gb-bubble{
  background:var(--gb-sunken);
  border-radius:var(--gb-r) var(--gb-r) var(--gb-r) 5px;
}
.gb-msg.gb-bot.gb-cont .gb-bubble{border-bottom-left-radius:var(--gb-r)}
/* El tope va en el mensaje, no en la burbuja: dentro de un contenedor que se
   ajusta al contenido, un max-width porcentual en el hijo se realimenta y
   acaba dejando la burbuja en una columna de una palabra. */
.gb-msg.gb-user{flex-direction:row-reverse;align-self:flex-end;max-width:82%}
.gb-msg.gb-user .gb-bubble{max-width:100%}
/* La respuesta del usuario se distingue por forma y borde, no por color
   saturado: así el verde sigue significando "aquí se actúa" */
.gb-msg.gb-user .gb-bubble{
  background:var(--gb-wash);
  border:1px solid var(--gb-edge);
  color:var(--gb-accent-ink);font-weight:700;
  border-radius:var(--gb-r) var(--gb-r) 5px var(--gb-r);
}
.gb-bubble strong{font-weight:700}
.gb-bubble a{color:var(--gb-accent-ink);font-weight:700}

/* Listas dentro de una respuesta (tarifas, flota, contacto) */
.gb-a-list{list-style:none;margin:8px 0 2px;padding:0;display:flex;flex-direction:column;gap:5px}
.gb-a-list li{
  position:relative;padding-left:14px;font-size:.875rem;line-height:1.45;color:var(--gb-ink-2);
}
.gb-a-list li::before{
  content:"";position:absolute;left:2px;top:.62em;
  width:4px;height:4px;border-radius:50%;background:var(--gb-accent);
}
.gb-a-list li b{color:var(--gb-ink);font-weight:700}

.gb-typing{display:flex;gap:4px;padding:14px}
.gb-typing i{
  width:5px;height:5px;border-radius:50%;background:var(--gb-ink-3);
  animation:gbDot 1.2s infinite ease-in-out;
}
.gb-typing i:nth-child(2){animation-delay:.16s}
.gb-typing i:nth-child(3){animation-delay:.32s}
@keyframes gbDot{0%,65%,100%{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}

/* Recibo del viaje */
.gb-card{
  margin:12px 0 4px;padding:16px 18px;max-width:calc(100% - 42px);
  background:var(--gb-panel);border:1px solid var(--gb-line);border-radius:var(--gb-r-lg);
  animation:gbMsg .22s var(--gb-out);
}
.gb-card-title{
  font-family:var(--gb-ui);font-size:.625rem;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:var(--gb-ink-3);
  padding-bottom:11px;margin-bottom:4px;border-bottom:1px solid var(--gb-line-soft);
}
.gb-card-row{display:flex;justify-content:space-between;align-items:baseline;gap:14px;padding:7px 0}
.gb-card-k{
  font-family:var(--gb-ui);font-size:.6875rem;font-weight:700;
  letter-spacing:.07em;text-transform:uppercase;color:var(--gb-ink-3);flex-shrink:0;
}
.gb-card-v{font-family:var(--gb-text);font-size:.875rem;color:var(--gb-ink);text-align:right;line-height:1.45;min-width:0;overflow-wrap:anywhere}
.gb-card-row.gb-total{
  margin-top:6px;padding-top:13px;border-top:1px solid var(--gb-line-soft);align-items:center;
}
.gb-card-row.gb-total .gb-card-k{color:var(--gb-ink-2)}
.gb-card-row.gb-total .gb-card-v{
  font-family:var(--gb-show);font-size:1.5rem;font-weight:700;color:var(--gb-accent-ink);line-height:1;
}

/* El folio: único momento que se permite ser una pieza */
.gb-order{
  margin:12px 0 4px;padding:20px;max-width:calc(100% - 42px);text-align:center;
  background:var(--gb-wash);border:1px solid var(--gb-edge);border-radius:var(--gb-r-lg);
  animation:gbMsg .22s var(--gb-out);
}
.gb-order-l{
  font-family:var(--gb-ui);font-size:.625rem;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:var(--gb-accent-dim);
}
.gb-order-n{
  font-family:var(--gb-show);font-size:1.75rem;font-weight:700;line-height:1.15;
  color:var(--gb-accent-ink);margin-top:7px;word-break:break-all;
}

/* ── Zona de respuesta ──────────────────────────────────────── */
.gb-reply{
  flex-shrink:0;position:relative;background:var(--gb-panel);
  border-top:1px solid var(--gb-line-soft);
  padding:13px 14px calc(14px + env(safe-area-inset-bottom));
  max-height:54vh;overflow-y:auto;
  transition:box-shadow .18s linear;
}
.gb-reply:empty{display:none}
/* La sombra solo aparece cuando hay conversación pasando por debajo */
.gb-reply.gb-lifted{box-shadow:0 -10px 18px -14px oklch(25% 0.03 190 / .5)}
.gb-reply-hint{
  font-family:var(--gb-ui);font-size:.625rem;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:var(--gb-ink-3);
  margin-bottom:10px;
}

/* Respuestas rápidas */
.gb-chips{display:flex;flex-wrap:wrap;gap:8px}
.gb-chip{
  flex:1 1 128px;min-height:46px;padding:12px 16px;
  border:1px solid var(--gb-line-firm);border-radius:var(--gb-r);
  background:var(--gb-panel);color:var(--gb-ink);cursor:pointer;
  font-family:var(--gb-ui);font-size:.8125rem;font-weight:600;letter-spacing:.02em;
  display:inline-flex;align-items:center;justify-content:center;gap:8px;text-align:center;
  transition:border-color .15s linear,background .15s linear,color .15s linear;
  -webkit-tap-highlight-color:transparent;
}
.gb-chip:hover{border-color:var(--gb-accent);background:var(--gb-wash);color:var(--gb-accent-ink)}
.gb-chip:active{background:var(--gb-edge)}
.gb-chip.gb-primary{
  background:var(--gb-accent);border-color:transparent;color:#fff;
  font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:.75rem;
  box-shadow:0 1px 2px oklch(42% 0.08 180 / .2);
}
.gb-chip.gb-primary:hover{background:var(--gb-accent-h);color:#fff}
.gb-chip.gb-quiet{
  border-color:transparent;background:transparent;color:var(--gb-ink-2);
  font-weight:600;min-height:40px;
}
.gb-chip.gb-quiet:hover{background:var(--gb-sunken);color:var(--gb-ink)}
.gb-chip.gb-full{flex:1 1 100%}
.gb-chip svg{width:15px;height:15px;flex-shrink:0}
.gb-chip img{width:17px;height:17px;flex-shrink:0}
.gb-chip[disabled]{opacity:.5;pointer-events:none}
.gb-chip.gb-busy{pointer-events:none;color:oklch(100% 0 0 / .85)}
/* Una pregunta sugerida no cabe en una línea: se lee alineada a la izquierda */
.gb-chip.gb-wrap{
  justify-content:flex-start;text-align:left;white-space:normal;
  line-height:1.35;padding-top:10px;padding-bottom:10px;font-weight:600;
}

/* Campos apilados (datos para que un agente devuelva el contacto) */
.gb-input.gb-stack{width:100%;margin-bottom:8px}
.gb-topics-lbl{margin-top:12px}

/* Zonas */
.gb-zones{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.gb-zone{
  border:1px solid var(--gb-line-firm);border-radius:var(--gb-r);
  background:var(--gb-panel);padding:12px 13px;cursor:pointer;text-align:left;
  transition:border-color .15s linear,background .15s linear;
  -webkit-tap-highlight-color:transparent;
}
.gb-zone:hover{border-color:var(--gb-accent);background:var(--gb-wash)}
.gb-zone-n,.gb-zone-name,.gb-zone-p{display:block}
.gb-zone-n{
  font-family:var(--gb-ui);font-size:.5625rem;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:var(--gb-ink-3);
}
.gb-zone-name{
  font-family:var(--gb-ui);font-size:.8125rem;font-weight:700;color:var(--gb-ink);
  margin:4px 0 7px;line-height:1.25;
}
.gb-zone-p{font-family:var(--gb-text);font-size:.6875rem;color:var(--gb-ink-3);line-height:1.6}
.gb-zone-p b{font-weight:700;color:var(--gb-accent-ink)}

/* Campos */
.gb-field{display:flex;gap:8px;align-items:flex-end}
.gb-field + .gb-field{margin-top:8px}
.gb-input{
  flex:1;min-width:0;min-height:46px;padding:12px 14px;
  border:1px solid var(--gb-line-firm);border-radius:var(--gb-r);
  background:var(--gb-panel);color:var(--gb-ink);
  font-family:var(--gb-text);font-size:16px;font-weight:400;
  outline:none;transition:border-color .15s linear,box-shadow .15s linear;
}
.gb-input:focus{border-color:var(--gb-accent);box-shadow:0 0 0 3px var(--gb-wash)}
.gb-input:focus-visible{outline:none}
.gb-input.gb-err{border-color:var(--gb-danger);box-shadow:0 0 0 3px var(--gb-danger-bg)}
.gb-input::placeholder{color:var(--gb-ink-3)}
.gb-send{
  width:46px;height:46px;flex-shrink:0;border:none;border-radius:var(--gb-r);
  background:var(--gb-accent);color:#fff;cursor:pointer;display:grid;place-items:center;
  transition:background .15s linear;-webkit-tap-highlight-color:transparent;
}
.gb-send:hover{background:var(--gb-accent-h)}
.gb-send svg{width:17px;height:17px}
.gb-error{
  font-family:var(--gb-text);font-size:.8125rem;color:var(--gb-danger);
  margin-top:8px;display:none;align-items:center;gap:6px;
}
.gb-error.gb-on{display:flex;animation:gbMsg .2s var(--gb-out)}
.gb-error svg{width:14px;height:14px;flex-shrink:0}

/* Sugerencias de hotel */
.gb-suggest{
  margin-top:8px;max-height:184px;overflow-y:auto;
  border:1px solid var(--gb-line);border-radius:var(--gb-r);background:var(--gb-panel);
}
.gb-suggest:empty{display:none}
.gb-suggest-item{
  display:flex;align-items:center;gap:10px;width:100%;
  padding:11px 14px;border:none;background:none;cursor:pointer;text-align:left;
  font-family:var(--gb-text);font-size:.875rem;color:var(--gb-ink);
  transition:background .12s linear,color .12s linear;
}
.gb-suggest-item + .gb-suggest-item{box-shadow:inset 0 1px 0 var(--gb-line-soft)}
.gb-suggest-item:hover{background:var(--gb-wash);color:var(--gb-accent-ink)}
.gb-suggest-item img{width:15px;height:15px;flex-shrink:0;opacity:.55}
.gb-suggest-item mark{background:var(--gb-edge);color:inherit;border-radius:3px;padding:0 1px}
.gb-suggest-empty{
  padding:13px 14px;font-family:var(--gb-text);font-size:.8125rem;color:var(--gb-ink-3);
}
/* Salida a "otro hotel": cierra la lista y se lee como acción, no como opción */
.gb-suggest-other{
  position:sticky;bottom:0;background:var(--gb-panel);
  font-weight:600;color:var(--gb-accent-ink);
  box-shadow:inset 0 1px 0 var(--gb-line-soft);
}
.gb-suggest-other:hover{background:var(--gb-wash)}
.gb-suggest-other svg{width:14px;height:14px;flex-shrink:0;opacity:.75}

/* Contador de pasajeros */
.gb-stepper{
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  border:1px solid var(--gb-line-firm);border-radius:var(--gb-r);
  padding:10px 12px;margin-bottom:9px;
}
.gb-step-btn{
  width:44px;height:44px;flex-shrink:0;border:1px solid var(--gb-line-firm);border-radius:11px;
  background:var(--gb-panel);color:var(--gb-ink-2);cursor:pointer;display:grid;place-items:center;
  transition:border-color .15s linear,color .15s linear,background .15s linear;
  -webkit-tap-highlight-color:transparent;
}
.gb-step-btn:hover{border-color:var(--gb-accent);color:var(--gb-accent-ink);background:var(--gb-wash)}
.gb-step-btn[disabled]{opacity:.35;pointer-events:none}
.gb-step-btn svg{width:15px;height:15px}
.gb-step-read{text-align:center;line-height:1.1}
.gb-step-val{font-family:var(--gb-ui);font-size:1.75rem;font-weight:700;color:var(--gb-ink)}
.gb-step-lbl{
  font-family:var(--gb-ui);font-size:.625rem;font-weight:700;
  letter-spacing:.13em;text-transform:uppercase;color:var(--gb-ink-3);margin-top:3px;
}

/* Calendario */
.gb-cal{border:1px solid var(--gb-line-firm);border-radius:var(--gb-r);padding:11px 10px 9px;margin-bottom:9px}
.gb-cal-nav{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.gb-cal-nav b{font-family:var(--gb-ui);font-size:.8125rem;font-weight:700;color:var(--gb-ink);flex:1;text-align:center}
.gb-cal-arr{
  width:32px;height:32px;flex-shrink:0;border:none;border-radius:9px;
  background:transparent;color:var(--gb-ink-2);cursor:pointer;display:grid;place-items:center;
  transition:background .15s linear,color .15s linear;
}
.gb-cal-arr:hover{background:var(--gb-sunken);color:var(--gb-ink)}
.gb-cal-arr[disabled]{opacity:.25;pointer-events:none}
.gb-cal-arr svg{width:15px;height:15px}
.gb-cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.gb-cal-dh{
  text-align:center;font-family:var(--gb-ui);font-size:.5625rem;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;color:var(--gb-ink-3);padding:2px 0 5px;
}
.gb-cal-day{
  border:none;background:none;cursor:pointer;aspect-ratio:1;min-height:36px;border-radius:10px;
  font-family:var(--gb-text);font-size:.875rem;color:var(--gb-ink);line-height:1;
  display:grid;place-items:center;position:relative;
  transition:background .12s linear,color .12s linear;
  -webkit-tap-highlight-color:transparent;
}
.gb-cal-day:hover{background:var(--gb-sunken)}
.gb-cal-day.gb-today::after{
  content:'';position:absolute;bottom:6px;width:3px;height:3px;border-radius:50%;
  background:var(--gb-accent);
}
.gb-cal-day.gb-sel{background:var(--gb-accent);color:#fff;font-weight:700}
.gb-cal-day.gb-sel:hover{background:var(--gb-accent-h)}
.gb-cal-day.gb-sel.gb-today::after{background:oklch(100% 0 0 / .8)}
.gb-cal-day[disabled]{color:var(--gb-ink-3);opacity:.4;pointer-events:none}
.gb-cal-pad{aspect-ratio:1}

/* Hora */
.gb-clock{
  display:flex;align-items:center;justify-content:center;gap:8px;
  border:1px solid var(--gb-line-firm);border-radius:var(--gb-r);padding:10px;margin-bottom:9px;
}
.gb-clock-col{display:flex;flex-direction:column;align-items:center;gap:4px}
.gb-clock-btn{
  width:46px;height:28px;border:none;border-radius:8px;background:transparent;
  color:var(--gb-ink-3);cursor:pointer;display:grid;place-items:center;
  transition:background .15s linear,color .15s linear;
}
.gb-clock-btn:hover{background:var(--gb-sunken);color:var(--gb-ink)}
.gb-clock-btn svg{width:13px;height:13px}
.gb-clock-val{
  font-family:var(--gb-ui);font-size:1.625rem;font-weight:700;color:var(--gb-ink);
  min-width:58px;text-align:center;padding:4px 0;font-variant-numeric:tabular-nums;
}
.gb-clock-sep{font-family:var(--gb-ui);font-size:1.5rem;font-weight:700;color:var(--gb-ink-3);padding-bottom:2px}
.gb-clock-note{
  font-family:var(--gb-text);font-size:.75rem;color:var(--gb-ink-3);
  text-align:center;margin:-3px 0 9px;
}

/* Teléfono */
.gb-phone{
  display:flex;flex:1;min-width:0;
  border:1px solid var(--gb-line-firm);border-radius:var(--gb-r);
  background:var(--gb-panel);overflow:hidden;
  transition:border-color .15s linear,box-shadow .15s linear;
}
.gb-phone:focus-within{border-color:var(--gb-accent);box-shadow:0 0 0 3px var(--gb-wash)}
.gb-phone.gb-err{border-color:var(--gb-danger);box-shadow:0 0 0 3px var(--gb-danger-bg)}
.gb-phone select{
  border:none;border-right:1px solid var(--gb-line);background:transparent;
  padding:0 8px;min-width:76px;flex-shrink:0;color:var(--gb-ink);
  font-family:var(--gb-text);font-size:.8125rem;outline:none;cursor:pointer;
}
.gb-phone input{
  flex:1;min-width:0;border:none;background:transparent;padding:12px;
  font-family:var(--gb-text);font-size:16px;color:var(--gb-ink);outline:none;
}

/* Términos */
.gb-terms{
  display:flex;align-items:flex-start;gap:11px;cursor:pointer;
  border:1px solid var(--gb-line);border-radius:var(--gb-r);
  padding:13px 14px;margin-bottom:9px;
  font-family:var(--gb-text);font-size:.8125rem;color:var(--gb-ink-2);line-height:1.55;
  transition:border-color .15s linear;
}
.gb-terms:hover{border-color:var(--gb-line-firm)}
.gb-terms:has(input:checked){border-color:var(--gb-edge);background:var(--gb-wash)}
.gb-terms input{width:19px;height:19px;flex-shrink:0;margin-top:1px;accent-color:var(--gb-accent)}
.gb-terms a{color:var(--gb-accent-ink);font-weight:700;text-decoration:underline;text-underline-offset:2px}

/* Salida al formulario clásico */
.gb-alt{
  margin-top:11px;text-align:center;
  font-family:var(--gb-text);font-size:.75rem;color:var(--gb-ink-3);
}
.gb-alt button{
  border:none;background:none;color:var(--gb-accent-ink);font:inherit;font-weight:700;
  cursor:pointer;text-decoration:underline;text-underline-offset:2px;padding:4px 2px;
}

/* ── Responsive ─────────────────────────────────────────────── */
@media(max-width:600px){
  .gb-panel{
    inset:0;width:100%;height:100%;max-height:none;
    border:none;border-radius:0;box-shadow:none;
  }
  .gb-head{padding-top:calc(14px + env(safe-area-inset-top))}
  .gb-thread{padding:16px 13px 8px}
  .gb-reply{max-height:58vh;padding:12px 13px calc(13px + env(safe-area-inset-bottom))}
  .gb-launcher{padding:9px;border-radius:50%;gap:0}
  .gb-launcher-txt{display:none}
  .gb-teaser{bottom:calc(clamp(16px,3vw,26px) + 70px + env(safe-area-inset-bottom))}
}
@media(max-width:360px){
  .gb-zones{grid-template-columns:1fr}
  .gb-clock-val{font-size:1.375rem;min-width:50px}
  .gb-chip{flex:1 1 100%}
}
@media(prefers-reduced-motion:reduce){
  .gb-panel.gb-on,.gb-msg,.gb-card,.gb-order,.gb-error.gb-on{animation:none}
  .gb-typing i{animation:none;opacity:.5}
  .gb-launcher:hover{transform:none}
  .gb-trip-bar i{transition:none}
}