/* =====================================================================
   GS Viagem 2 – Estilo baseado no CSS original (gsv.css), adaptado
   para os seletores do gs-viagem-2 (prefixo .gsv2- e #gs-viagem-2).
   ===================================================================== */

.gsv2-container { --pri:#A70932; --muted:rgba(97, 93, 94, 0.1); --ink:#312D2E; --bg:#fff; }
.gsv2-container * { box-sizing: border-box; /* font-family: "Geist", Sans-serif; */ }
.gsv2-container [hidden] { display: none !important; }
.gsv2-container .required { color: var(--pri); }
.gsv2-container hr { background:transparent !important; border:1px solid #F2F2F2 !important; margin:2.3rem 0 !important; }

.gsv2-form { background:var(--bg); }

/* ===== Animações dos steps (isoladas) ===== */
.gsv2-step-panel{ display:none; }
.gsv2-step-panel.is-pre{ display:block; opacity:0; transform:translateY(10px); }
.gsv2-step-panel.active{
  display:block;
  opacity:1;
  transform:translateY(0);
  transition: opacity .28s ease, transform .28s ease;
  display: flex;
  flex-direction: column;
}
.gsv2-step-panel.leaving-left,
.gsv2-step-panel.leaving-right{
  display:block; opacity:0; transform:translateY(-8px);
  transition: opacity .26s ease, transform .26s ease;
}
/* compat extra: se o JS usar gsv2-step-in */
.gsv2-step-panel.gsv2-step-in{ animation:gsv2-enter-y .28s ease both; }
@keyframes gsv2-enter-y{ from{opacity:0; transform:translateY(10px);} to{opacity:1; transform:translateY(0);} }

.gsv2-step-panel.enter-right{ animation:gsv2-enter-right .28s ease both; }
.gsv2-step-panel.enter-left { animation:gsv2-enter-left  .28s ease both; }
@keyframes gsv2-enter-right{ from{opacity:0; transform:translateX(12px);} to{opacity:1; transform:translateX(0);} }
@keyframes gsv2-enter-left { from{opacity:0; transform:translateX(-12px);} to{opacity:1; transform:translateX(0);} }

.gsv2-step-panel h3 { font-family: "Tomato Grotesk", sans-serif; margin:0 0 32px; color:var(--ink); font-weight:600 !important; }
.gsv2-step-panel h4 { font-family:"Tomato Grotesk", Sans-serif; margin:14px 0 32px; color:var(--ink); }
.gsv2-step-panel h3 img { width:60px; height:60px; position:relative; top:2px; }

/* ===== Grid/Form ===== */
.gsv2-row { display:flex; flex-wrap:wrap; gap:24px; margin: 15px 0;}
.gsv2-row label { display:flex; flex-direction:column; gap:6px; color:var(--ink); font-weight:600; font-size:15px; line-height:140%; }
.gsv2-row input,
.gsv2-row select,
.gsv2-row textarea {
  border-radius:6px !important;
  padding:16px 22px !important;
  font-size:15px;
  background:#F5F4F5;
  border:0 !important;
  transition: box-shadow .2s ease, transform .2s ease;
}
.gsv2-row input:focus,
.gsv2-row select:focus,
.gsv2-row textarea:focus {
  outline:none;
  box-shadow:0 0 0 3px rgba(167,9,50,.18);
}
.gsv2-row input[type="tel"]{
  border-radius:6px !important;
  padding: 16px 22px 14px 22px !important;
  font-size:14px;
  background:#F5F4F5;
  border:0 !important;
}

/* Larguras */
.w50{ flex:1 1 calc(50% - 24px); min-width:240px; }
.w40{ flex:1 1 calc(40% - 24px); min-width:220px; }
.w33{ flex:1 1 calc(33.33% - 24px); min-width:200px; }
.w25{ flex:1 1 calc(25% - 24px); min-width:180px; } /* (caso precise, mesma linguagem visual) */
.w20{ flex:1 1 calc(20% - 24px); min-width:160px; }
.w100{ flex:1 1 100%; }

/* ===== Ações ===== */
.gsv2-actions{ display:flex; gap:10px; margin-top:14px; flex-direction: row; justify-content: center; }
.gsv2-add-percurso { width: 100% !important; }

.gsv2-actions .gsv2-add-percurso {
  border: 1px solid #A70932;
  color: #A70932;
  padding: 15px;
  border-style: dashed;
  font-weight: 600;
  background: hsl(344.43deg 89.77% 34.51% / 11%);
}
.gsv2-actions .gsv2-add-percurso:hover {
  background: #A70932;
  color: white;
}

.gsv2-actions .gsv2-prev,
.gsv2-actions .gsv2-next,
.gsv2-actions .gsv2-submit,
.gsv2-popup-close{
  padding:14px 48px;
  border-radius:100px;
  border:0;
  cursor:pointer;
  font-weight:600;
  transition: transform .16s ease, box-shadow .16s ease, filter .16s ease, opacity .16s ease;
  will-change: transform;
}
.gsv2-actions .gsv2-prev{ background:#e5e7eb; color:#615D5E !important; }
.gsv2-actions .gsv2-prev:hover{ background:#d1d2d5; color:#615D5E !important; }

.gsv2-actions .gsv2-next,
.gsv2-actions .gsv2-submit{
  background: linear-gradient(180deg, rgba(167, 9, 50, 1) 0%, rgba(215, 61, 101, 1) 100%);
  color:#fff;
  font-family:"Tomato Grotesk", sans-serif;
  border:1px solid #900025;
  box-shadow: inset -2px 3px 0px rgba(255,255,255,.43), 0 6px 14px rgba(167,9,50,.18);
}
.gsv2-actions .gsv2-next:hover,
.gsv2-actions .gsv2-submit:hover{
  filter:brightness(1.03);
  box-shadow: inset -2px 3px 0px rgba(255,255,255,.43), 0 8px 18px rgba(167,9,50,.24);
}
.gsv2-actions .is-press{ transform:scale(.98); }
.gsv2-actions button[disabled]{ opacity:.6; cursor:not-allowed; }
.gsv2-note{ /* flex:1; */ font-size:12px; color:#969696; display:flex; align-items:center; gap:5px; }

/* ===== Erros e Loading ===== */
.gsv2-error{ font-size:12px; color:#b91c1c; margin-top:4px; }
.gsv2-loading{ position:relative; }
.gsv2-loading::after{
  content:"";
  position:absolute; right:10px; top:50%; width:14px; height:14px; margin-top:-7px;
  border:2px solid #999; border-top-color:transparent; border-radius:50%;
  animation:gsv2-spin 1s linear infinite;
}
@keyframes gsv2-spin{ to{ transform:rotate(360deg) } }

/* ===== Resumo ===== */
/* ===== Review (Step 2) – NOVO ===== */

/* container geral do resumo */
.gsv2-resumo{
  display:flex;
  flex-direction:column;
  gap:16px;
}

/* cada “cartão” (dados do passageiro, percurso 1, percurso 2, etc.) */
.gsv2-review-card{
  border:1px solid #eee;
  border-radius:12px;
  padding:18px;
  background:#fff;
  box-shadow:0 2px 8px rgba(0,0,0,.03);
}

/* título do cartão */
.gsv2-review-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:12px;
  color:var(--ink);
  font-weight:700;
  font-size:16px;
}

/* grid dos campos (label/valor) — duas colunas limpas no desktop */
.gsv2-review-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(260px, 1fr));
  gap:14px;
}

/* bloco de cada campo */
.gsv2-review-grid > div{
  background:#F5F4F5;
  border:1px solid #F0EFF0;
  border-radius:10px;
  padding:10px 12px;
  min-height:58px;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
}

/* label */
.gsv2-review-grid > div > span{
  display:block;
  font-size:12px;
  line-height:1.15;
  color:#6b7280;
  letter-spacing:.2px;
  text-transform:none;
  margin-bottom:6px;
  font-weight:600;
}

/* valor */
.gsv2-review-grid > div > p{
  margin:0;
  color:#111827;
  font-size:15px;
  line-height:1.35;
  word-wrap:break-word;
  overflow-wrap:anywhere;
}

/* texto livre (observações) */
.gsv2-review-text{
  color:#111827;
  font-size:15px;
  line-height:1.5;
  background:#FDFDFD;
  border:1px dashed #e8e8e8;
  border-radius:10px;
  padding:12px;
}

/* separadores visuais suaves entre cartões */
.gsv2-review-card + .gsv2-review-card{
  margin-top:2px; /* cola visuamente os cartões sem criar “buraco” grande */
}

/* responsivo: 1 coluna no mobile */
@media (max-width: 860px){
  .gsv2-review-grid{
    grid-template-columns: 1fr;
  }
}

/* microajustes para contraste/“toque” GS */
.gsv2-review-card .gsv2-review-row{
  padding-bottom:6px;
  border-bottom:1px dashed #EFEFEF;
  margin-bottom:12px;
}
.gsv2-review-grid > div{
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.55);
}


/* ===== Popup ===== */
dialog#gsv2-popup { border:0; border-radius:12px; padding:0; }
#gsv2-popup::backdrop { background:#00000085; backdrop-filter:blur(5px); animation:gsv2-backdrop .28s ease both; }
@keyframes gsv2-backdrop{ from{opacity:0} to{opacity:1} }
.gsv2-popup-card{
  padding:32px;
  max-width:400px;
  display:flex;
  flex-direction:column;
  align-items:center;
  animation:gsv2-pop-in .28s cubic-bezier(.2,.7,.3,1) both;
}
.gsv2-popup-card.closing{ animation:gsv2-pop-out .22s ease forwards; }
@keyframes gsv2-pop-in{ from{opacity:0; transform:translateY(10px) scale(.96);} to{opacity:1; transform:translateY(0) scale(1);} }
@keyframes gsv2-pop-out{ from{opacity:1; transform:translateY(0) scale(1);} to{opacity:0; transform:translateY(8px) scale(.96);} }
.gsv2-popup-card p { text-align:center; color:#4c4c4c; font-size:15px; }
.gsv2-popup-card h4 { font-family:'Tomato Grotesk', Arial; color:var(--ink); font-size:28px; text-align:center; }
.gsv2-popup-card .gsv2-popup-close{
  background: linear-gradient(180deg, rgba(167, 9, 50, 1) 0%, rgba(215, 61, 101, 1) 100%);
  color:#fff; font-family:"Tomato Grotesk", sans-serif; border:1px solid #900025;
  box-shadow: inset -2px 3px 0px rgba(255,255,255,.43), 0 6px 14px rgba(167,9,50,.18);
}

/* ===== Bandeiras / Idiomas ===== */
.gsv2-lang-grid{
  display:flex; gap:12px; margin: 16px auto 6px auto;
  flex-direction: column; align-items: center; width: 600px;
}
.gsv2-lang-btn{
  display:flex; align-items:center; gap:12px; padding:12px;
  border:1px solid var(--muted); border-radius:12px; background:#fff; cursor:pointer; justify-content:center;
}
.gsv2-lang-btn[aria-pressed="true"]{ outline:2px solid var(--pri); }
.gsv2-lang-note{ color:#4b5563; font-size:14px; }

.gsv2-lang-btn{
  display:flex !important;
  flex-direction: row;
  padding: 20px !important;
  font-weight: 600 !important;
  color: #A70932 !important;
  border-color: #e7e7e7 !important;
  background: white;
  box-shadow: 0 2px 2px #0000000d;
}
.gsv2-lang-btn:hover {
  background-color: #A70932 !important;
  color: white !important;
}

.organiza-h3 h3 { font-family: "Tomato Grotesk", sans-serif !important; }
.organiza-h3 { display: flex; justify-content: center; }
.gsv2-lang-grid button { width: 100%; }

/* ===== Percursos ===== */
.gsv2-percurso{
  border: 1px dashed #d3d3d3;
  padding: 24px;
  border-radius:12px;
  margin: 2rem 0;
}
.gsv2-percurso-head{
  display:flex; align-items:center; justify-content:space-between; margin-bottom: 32px;
}
.gsv2-chip{
  display:inline-flex; align-items:center; gap:8px;
  background: #A70932; padding: 6px 18px; border-radius: 100px; color: white;
}
.gsv2-chip-title{ font-weight: 600; color: white; }
.gsv2-percurso-tools{ display:flex; gap:8px; }
.gsv2-percurso-tools button{
  border:0; cursor:pointer; padding: 10px; border-radius:8px; background:#F5F4F5;
  transition: filter .12s ease, transform .12s ease; display: flex;
}
.gsv2-percurso-tools button svg { width: 20px; height: 20px; }
.gsv2-percurso-tools button:hover{ filter:brightness(0.97); transform: translateY(-1px); }
.gsv2-percurso-tools .gsv2-percurso-remove{ background:#fee2e2; }
.gsv2-actions-percurso .big-plus{ font-size:24px; line-height:1; margin-right:8px }

/* ===== Switcher (toggle) ===== */
.gsv2-toggle{ align-items: flex-start; cursor:pointer; user-select:none; margin-top: 25px; }
.gsv2-toggle input{ display:none; }
.gsv2-toggle-track{
  width:54px; height:32px; background:#e5e7eb; border-radius:999px; position:relative; transition:background .2s ease;
}
.gsv2-toggle-thumb{
  position:absolute; top:3px; left:3px; width:26px; height:26px; border-radius:50%;
  background:#fff; box-shadow:0 1px 2px rgba(0,0,0,.15); transition:left .2s ease;
}
.gsv2-toggle input:checked + .gsv2-toggle-track{
  background:linear-gradient(180deg, rgba(167,9,50,1) 0%, rgba(215,61,101,1) 100%);
}
.gsv2-toggle input:checked + .gsv2-toggle-track .gsv2-toggle-thumb{ left:25px; }
.gsv2-toggle-label{ color:#1f2937; font-weight:600; }

/* ===== Responsivo ===== */
@media (max-width: 860px){
  .w50,.w40,.w33,.w25,.w20,.w100{ width:100%; flex:1 1 100%; min-width:unset; }
}
@media (max-width: 600px){
  .gsv2-actions{ flex-direction:column; }
  .gsv2-step-panel h3{ font-size:24px; }
  .gsv2-row input,
  .gsv2-row select,
  .gsv2-row textarea,
  .gsv2-row label{ font-size:14px; }
  .gsv2-actions .gsv2-next,
  .gsv2-actions .gsv2-submit,
  .gsv2-actions .gsv2-prev{ width:100%; }
  .gsv2-lang-grid { align-items: stretch; width: 100%; }
}

/* ===== Checkbox flex (estrutura já usada no HTML) ===== */
.checkbox-flex { display: flex; align-items: center; gap: 10px; }

label.gsv2-inline-check {
    display: flex;
    flex-direction: row;
    margin-top: 8px;
}