/*!
 * Travel API Form – design CSS bundle scoped to #msfw-container.
 * Formerly in travel-design-css.css; merged into global.css.
 */

/* ============================================================================
   VARIÁVEIS DE CORES - ORGANIZADO POR ETAPA
   ============================================================================ */

:root {
  /* ============================================
     CORES BASE / GLOBAIS
     ============================================ */

  /* Texto */
  --color-text-primary: #212529;
  --color-text-secondary: #6c757d;
  --color-text-light: #fff;
  --color-text-dark: #000;

  /* Backgrounds */
  --color-bg-white: #fff;
  --color-bg-light: #f8f9fa;
  --color-bg-gray: #e9ecef;
  --color-bg-dark: #212529;

  /* Bordas */
  --color-border-light: #ced4da;
  --color-border-medium: #dee2e6;
  --color-border-blue: #cfe4ff;
  --color-border-dotted: #d7d7d7;

  /* Sombras */
  --color-shadow-light: rgba(0, 0, 0, 0.04);
  --color-shadow-medium: rgba(0, 0, 0, 0.08);
  --color-shadow-dark: rgba(0, 0, 0, 0.25);
  --color-shadow-container: #0000001a;

  /* ============================================
     CONTAINER PRINCIPAL (#msfw-container)
     ============================================ */

  /* Background do container */
  --container-bg: #fff;
  --container-border: #acacac;
  --container-text: #212529;

  /* ============================================
     STEP 1 - FORMULÁRIO DE BUSCA
     ============================================ */

  /* Inputs do formulário */
  --step1-input-bg: #fff;
  --step1-input-text: #212529;
  --step1-input-border: #ced4da;
  --step1-input-focus-border: #5b66ff;
  --step1-input-focus-shadow: rgba(91, 102, 255, 0.1);

  /* Botão Cotar Agora */
  --step1-button-bg: #5b66ff;
  --step1-button-text: #fff;
  --step1-button-hover-bg: #4a54e6;
  --step1-button-hover-border: #4a54e6;

  /* Placeholder das datas */
  --step1-placeholder-text: #6c757d;

  /* ============================================
     STEP 1 - MODAL DE PASSAGEIROS
     ============================================ */

  /* Modal container */
  --modal-pax-bg: #fff;
  --modal-pax-title: #212529;
  --modal-pax-close: #6c757d;

  /* Faixa etária container */
  --modal-pax-range-bg: #fff;
  --modal-pax-range-border: #cfe4ff;
  --modal-pax-range-text: #212529;

  /* Botões +/- do modal */
  --modal-pax-btn-bg: #fff;
  --modal-pax-btn-text: #5b66ff;
  --modal-pax-btn-border: #5b66ff;
  --modal-pax-btn-disabled-text: #ced4da;
  --modal-pax-btn-disabled-bg: #f5f5f5;

  /* Botões de ação do modal (Limpar, Cancelar, Aplicar) */
  --modal-pax-action-bg: #5b66ff;
  --modal-pax-action-text: #fff;
  --modal-pax-action-hover-bg: #4a54e6;
  --modal-pax-action-hover-border: #4a54e6;

  /* Total do modal */
  --modal-pax-total-border: #e9ecef;
  --modal-pax-total-text: #212529;

  /* ============================================
     STEP 2 - CADASTRO (NOME/EMAIL/TELEFONE)
     ============================================ */

  /* Inputs de cadastro */
  --step2-input-bg: #fff;
  --step2-input-text: #212529;
  --step2-input-border: #ced4da;
  --step2-input-focus-border: #5b66ff;

  /* Botão continuar */
  --step2-button-bg: #003366;
  --step2-button-text: #fff;
  --step2-button-hover-bg: #002244;
  --step2-button-hover-border: #002244;

  /* ============================================
     STEP 3 - CARDS DE PACOTES
     ============================================ */

  /* Card container */
  --step3-card-bg: #fff;
  --step3-card-text: #333;
  --step3-card-border: #e6e6e6;
  --step3-card-hover-border: #cfe4ff;

  /* Card destacado/popular */
  --step3-card-featured-border: #3182cd;
  --step3-card-featured-ribbon-text: #3182cd;

  /* Preço no card */
  --step3-price-text: #212529;

  /* Botão Selecionar */
  --step3-btn-select-bg: #3182cd;
  --step3-btn-select-text: #fff;
  --step3-btn-select-hover-bg: #62b3ff;
  --step3-btn-select-hover-border: #62b3ff;

  /* Botão Mostrar Detalhes */
  --step3-btn-details-bg: transparent;
  --step3-btn-details-text: #3182cd;
  --step3-btn-details-border: #3182cd;
  --step3-btn-details-hover-bg: #003366;
  --step3-btn-details-hover-text: #fff;
  --step3-btn-details-hover-border: #003366;

  /* Botão WhatsApp */
  --step3-btn-whatsapp-text: #fff;
  --step3-btn-whatsapp-hover-bg: #1a7a00;

  /* Linha divisória no card */
  --step3-card-divider: #d7d7d7;

  /* ============================================
     STEP 3 - EDITAR COTAÇÃO
     ============================================ */

  /* Inputs do formulário de edição */
  --edit-quote-input-bg: #fff;
  --edit-quote-input-text: #212529;
  --edit-quote-input-border: #ced4da;
  --edit-quote-input-focus-border: #5b66ff;

  /* Botão Atualizar Cotação */
  --edit-quote-btn-bg: #5b66ff;
  --edit-quote-btn-text: #fff;
  --edit-quote-btn-hover-bg: #4a54e6;

  /* ============================================
     STEP 3 - MODAL DE COMPARAÇÃO (Detalhes dos Pacotes)
     ============================================ */

  /* Header da tabela */
  --modal-compare-header-bg: #003366;
  --modal-compare-header-text: #fff;
  --modal-compare-header-border: #0a2246;

  /* Header azul escuro alternativo */
  --modal-compare-header-alt-bg: #1e00a7;
  --modal-compare-header-alt-text: #fff;

  /* Coluna selecionada */
  --modal-compare-selected-bg: #e7f1ff;
  --modal-compare-selected-text: #0d2a54;

  /* Botão Fechar */
  --modal-compare-btn-close-bg: #003366;
  --modal-compare-btn-close-text: #fff;
  --modal-compare-btn-close-hover-bg: #002244;

  /* ============================================
     STEP 4 - DETALHES DO PASSAGEIRO
     ============================================ */

  /* Inputs de dados do passageiro */
  --step4-input-bg: #fff;
  --step4-input-text: #212529;
  --step4-input-border: #ced4da;

  /* Botão Continuar */
  --step4-btn-submit-bg: #003366;
  --step4-btn-submit-text: #fff;
  --step4-btn-submit-hover-bg: #002244;
  --step4-btn-submit-hover-border: #002244;

  /* ============================================
     STEP 5 - PAGAMENTO
     ============================================ */

  /* Header do pagamento */
  --step5-header-bg: #003366;
  --step5-header-text: #fff;

  /* Botão de pagamento */
  --step5-btn-pay-bg: #003366;
  --step5-btn-pay-text: #fff;
  --step5-btn-pay-hover-bg: #00264d;
  --step5-btn-pay-hover-border: #00264d;

  /* Checkbox "Não estou em viagem" */
  --step5-checkbox-label: #003366;

  /* ============================================
     STEP 6 - CONFIRMAÇÃO DE PAGAMENTO
     ============================================ */

  /* Header do accordion */
  --step6-accordion-header-bg: #145da0;
  --step6-accordion-header-text: #fff;

  /* Links */
  --step6-link-text: #fff;
  --step6-link-collapsed-opacity: 0.9;

  /* ============================================
     ELEMENTOS COMUNS
     ============================================ */

  /* Tooltip */
  --tooltip-bg: #0d2a54;
  --tooltip-text: #fff;
  --tooltip-border: #000;

  /* Help icon */
  --help-icon-bg: transparent;
  --help-icon-text: #000;
  --help-icon-border: #000;

  /* Botões de incremento/decremento (verde) */
  --btn-increment-bg: #28a745;
  --btn-increment-text: #fff;
  --btn-increment-border: #28a745;
  --btn-increment-hover-bg: #218838;
  --btn-increment-hover-border: #1e7e34;

  /* Glider arrows */
  --glider-arrow-active: #145da0;
  --glider-arrow-disabled: #ccc;

  /* Spinner overlay */
  --spinner-overlay-bg: rgba(255, 255, 255, 0.6);

  /* Flatpickr */
  --flatpickr-selected-bg: #e8eaff;
  --flatpickr-selected-text: #5b66ff;
  --flatpickr-hover-bg: #e9ecef;
  --flatpickr-arrow-text: #5b66ff;
}

/* ================================
   Container-scoped overrides
   ================================ */

#msfw-container {
  background-color: var(--container-bg) !important;
  border: 0px solid var(--container-border) !important;
  border-radius: 10px !important;
  color: var(--container-text) !important;
  padding: 40px !important;
  box-shadow: 0px 0px 40px var(--color-shadow-container);
  margin-top: 20px;
}

@media (max-width: 992px) {
  #msfw-container {
    padding: 30px !important;
  }
}

@media (max-width: 768px) {
  #msfw-container {
    padding: 20px !important;
    margin-top: 10px !important;
  }
}

@media (max-width: 576px) {
  #msfw-container {
    padding: 15px !important;
    margin-top: 10px !important;
    border-radius: 8px !important;
  }
}

#msfw-container .search-card,
#msfw-container .search-card .card-body {
  padding: 0px !important;
  margin: 0px !important;
  border: 0px !important;
}

/* Center the modal and limit its width */
#msfw-container .modal-dialog.modal-custom {
  max-width: 90vw;
  margin: auto;
}
@media (max-width: 576px) {
  #msfw-container .modal-dialog.modal-custom {
    max-width: 100vw;
    margin: 0;
  }
  #msfw-container .modal-content {
    overflow-y: auto;
  }
}

/* Comparison modal — dark-blue table header */
#msfw-container #dynamicModal .table-comparison thead,
#msfw-container #dynamicModal .table-comparison thead tr,
#msfw-container #dynamicModal .table-comparison thead th {
  background-color: var(--modal-compare-header-bg) !important;
  color: var(--modal-compare-header-text) !important;
}

/* Comparison modal - 90% width to show all content */
#msfw-container #dynamicModal .modal-dialog.modal-custom {
  max-width: 90vw !important;
  width: 90vw !important;
}

/* Desktop: content fits without horizontal scroll */
@media (min-width: 992px) {
  #msfw-container #dynamicModal .modal-body {
    overflow-x: visible !important;
    overflow-y: auto !important;
  }
  #msfw-container #dynamicModal .table-comparison {
    width: 100% !important;
    table-layout: fixed !important;
  }
  /* Cobertura column - larger width */
  #msfw-container #dynamicModal .table-comparison th:first-child,
  #msfw-container #dynamicModal .table-comparison td:first-child {
    width: 45% !important;
    white-space: normal !important;
    word-wrap: break-word !important;
    padding-right: 1rem !important;
  }
  /* Moeda column - smaller width */
  #msfw-container #dynamicModal .table-comparison th:nth-child(2),
  #msfw-container #dynamicModal .table-comparison td:nth-child(2) {
    width: 8% !important;
    white-space: normal !important;
    text-align: center !important;
  }
  /* Value columns - distribute remaining space equally */
  #msfw-container #dynamicModal .table-comparison th:nth-child(n + 3),
  #msfw-container #dynamicModal .table-comparison td:nth-child(n + 3) {
    width: auto !important;
    white-space: normal !important;
    word-wrap: break-word !important;
    text-align: center !important;
    padding: 0.5rem !important;
  }
}

/* Mobile/Tablet: allow horizontal scroll if needed */
@media (max-width: 991px) {
  #msfw-container #dynamicModal .modal-body {
    overflow-x: auto !important;
    overflow-y: auto !important;
  }
  #msfw-container #dynamicModal .table-comparison {
    min-width: 100%;
    white-space: nowrap;
  }
  #msfw-container #dynamicModal .table-comparison td,
  #msfw-container #dynamicModal .table-comparison th {
    white-space: nowrap;
  }
}

/* Center the footer and restyle the "Fechar" button */
#msfw-container #dynamicModal .modal-footer {
  justify-content: center !important;
}

#msfw-container #dynamicModal .modal-footer .btn-secondary {
  background-color: var(--modal-compare-btn-close-bg) !important;
  border-color: var(--modal-compare-btn-close-bg) !important;
  color: var(--modal-compare-btn-close-text) !important;
  font-weight: 600;
}

#msfw-container #dynamicModal .modal-footer .btn-secondary:hover,
#msfw-container #dynamicModal .modal-footer .btn-secondary:focus {
  background-color: var(--modal-compare-btn-close-hover-bg) !important;
  border-color: var(--modal-compare-btn-close-hover-bg) !important;
  color: var(--modal-compare-btn-close-text) !important;
}

/* ---------------------------------------
   Bootstrap custom props used by the wizard
   (localize variables to the container)
--------------------------------------- */
#msfw-container {
  --bs-blue: #1e00a7;
  --bs-indigo: #6574cd;
  --bs-purple: #8b00a3;
  --bs-pink: #ff0062;
  --bs-red: #e3342f;
  --bs-orange: #f6993f;
  --bs-yellow: #ffc700;
  --bs-green: #38c172;
  --bs-teal: #4dc0b5;
  --bs-cyan: #6cb2eb;
  --bs-black: #000;
  --bs-white: #fff;
  --bs-gray: #6c757d;
  --bs-gray-dark: #343a40;
  --bs-gray-100: #f8f9fa;
  --bs-gray-200: #e9ecef;
  --bs-gray-300: #dee2e6;
  --bs-gray-400: #ced4da;
  --bs-gray-500: #adb5bd;
  --bs-gray-600: #6c757d;
  --bs-gray-700: #495057;
  --bs-gray-800: #343a40;
  --bs-gray-900: #212529;
  --bs-primary: #8b00a3;
  --bs-secondary: #1e00a7;
  --bs-success: #38c172;
  --bs-info: #292929;
  --bs-warning: #ffc700;
  --bs-danger: #e3342f;
  --bs-light: #f8f9fa;
  --bs-dark: #212529;
}

/* Passenger-select & "Cotar agora" alignment */
#msfw-container #passenger-select,
#msfw-container .next-step {
  display: inline-block !important;
  width: auto !important;
  font-size: 0.875rem !important;
  line-height: 1.5 !important;
  padding: 0.375rem 0.75rem !important;
  margin: 0 !important;
  vertical-align: bottom !important;
}

/* PRICE & TITLE adjustments */
#msfw-container .price-table {
  font-size: 2rem !important;
  line-height: 1 !important;
}
#msfw-container .price-cents-table {
  font-size: 1.1rem !important;
  line-height: 1 !important;
  vertical-align: super;
}
#msfw-container .search-card .card-body .text-center h2 {
  font-size: 1.1rem !important;
  line-height: 1.2 !important;
  margin-bottom: 0.5rem !important;
}
#msfw-container .search-card .card-body .text-center h2 .text-secondary {
  font-size: 1.1rem !important;
  font-weight: 400 !important;
}

/* +/- buttons */
#msfw-container .btn-increment,
#msfw-container .btn-decrement {
  background-color: var(--btn-increment-bg) !important;
  border-color: var(--btn-increment-border) !important;
  color: var(--btn-increment-text) !important;
}
#msfw-container .btn-increment:hover,
#msfw-container .btn-increment:focus,
#msfw-container .btn-increment:active,
#msfw-container .btn-decrement:hover,
#msfw-container .btn-decrement:focus,
#msfw-container .btn-decrement:active {
  background-color: var(--btn-increment-hover-bg) !important;
  border-color: var(--btn-increment-hover-border) !important;
  box-shadow: none !important;
}

/* ---------------------------------------
   Theme overrides (container-local vars)
--------------------------------------- */
#msfw-container {
  --bs-primary: #145da0;
  --bs-secondary: #a3ff05;
  --bs-success: #3182cd;
  --bs-info: #3182cd;
  --bs-warning: #fc0000;
  --bs-danger: #fc0000;
  --bs-light: #faffc3;
  --bs-dark: #523407;
}
#msfw-container .card-header {
  background-color: var(--bs-primary) !important;
  color: var(--color-text-light) !important;
}

/* restore wizard‐form white background (search card only) - AFTER theme overrides */
#msfw-container .search-card,
#msfw-container .search-card .card-body {
  background-color: var(--color-bg-white) !important;
  border: 0px !important;
  border-radius: 10px !important;
  color: var(--color-text-primary) !important;
  padding: 0px !important;
  margin: 0px !important;
}

/* Ensure form controls are visible inside search-card */
#msfw-container .search-card .form-control,
#msfw-container .search-card .custom-select {
  background-color: var(--step1-input-bg) !important;
  color: var(--step1-input-text) !important;
  border: 1px solid var(--step1-input-border) !important;
}

/* Ensure labels are dark */
#msfw-container .search-card label {
  color: var(--color-text-primary) !important;
}

/* Tables */
#msfw-container .table thead th {
  background-color: var(--bs-dark) !important;
  color: var(--color-text-light) !important;
}

/* Glider arrows */
#msfw-container .glider-prev,
#msfw-container .glider-next {
  color: var(--bs-primary) !important;
  font-size: 1.5rem;
}
#msfw-container .glider-prev.disabled,
#msfw-container .glider-next.disabled {
  color: var(--glider-arrow-disabled) !important;
}

/* Primary buttons */
#msfw-container .btn-primary {
  background-color: var(--bs-success) !important;
  border-color: var(--bs-success) !important;
}
#msfw-container .btn-primary:hover,
#msfw-container .btn-primary:focus {
  background-color: var(--step3-btn-select-hover-bg) !important;
  border-color: var(--step3-btn-select-hover-border) !important;
  color: var(--step3-btn-select-text) !important;
}

/* Mostrar detalhes → outline in same blue as "Selecionar"; hover dark-blue w/ white text */
#msfw-container .btn-show-details {
  background-color: var(--step3-btn-details-bg) !important;
  color: var(--step3-btn-details-text) !important;
  border: 1.5px solid var(--step3-btn-details-border) !important;
  font-weight: 600;
  transition:
    background-color 0.15s ease,
    color 0.15s ease,
    border-color 0.15s ease;
}

#msfw-container .btn-show-details:hover,
#msfw-container .btn-show-details:focus {
  background-color: var(--step3-btn-details-hover-bg) !important;
  border-color: var(--step3-btn-details-hover-border) !important;
  color: var(--step3-btn-details-hover-text) !important;
  text-decoration: none;
}

/* Links in cards */
#msfw-container .card a {
  color: var(--bs-info) !important;
}
#msfw-container .card a:hover {
  color: var(--bs-info) !important;
  text-decoration: underline;
}

/* "featured/popular" card styling */
#msfw-container .package-card.popular,
#msfw-container .package-card.featured {
  border: 2px solid var(--step3-card-featured-border) !important;
}
#msfw-container .package-card.popular .ribbon,
#msfw-container .package-card.featured .ribbon {
  background: transparent !important;
  color: var(--step3-card-featured-ribbon-text) !important;
  border: 1px solid var(--step3-card-featured-border) !important;
}

/* Inputs width tweaks */
#msfw-container input[type='date'].form-control {
  width: 270px;
  max-width: 100%;
  box-sizing: border-box;
}
#msfw-container select#country-select.form-control.custom-select {
  width: 300px !important;
  max-width: 100%;
  box-sizing: border-box;
}

/* Site overrides (kept, but container-scoped) */
#msfw-container .e-n-carousel .elementor-heading-title,
#msfw-container .e-n-carousel .elementor-widget-text-editor p,
#msfw-container .e-n-carousel .elementor-widget-text-editor li,
#msfw-container .e-n-carousel .elementor-widget-text-editor span {
  color: var(--color-text-light) !important;
}
#msfw-container .e-n-carousel a {
  color: var(--color-text-light) !important;
  text-decoration: none;
}
#msfw-container .e-n-carousel .elementor-icon svg path {
  fill: var(--color-text-light) !important;
}

/* ==========================================================
   PHASE 1: CARD GRID FOR PACKAGES (replaces table layout)
   ========================================================== */
#msfw-container #package-grid {
  row-gap: 1rem;
}

/* Desktop: 3 cards per row (lg breakpoint) */
@media (min-width: 992px) {
  #msfw-container #package-grid .col-lg-4 {
    flex: 0 0 33.333333% !important;
    max-width: 33.333333% !important;
    width: 33.333333% !important;
  }
}

/* Card container */
#msfw-container .package-card {
  border: 1px solid var(--step3-card-border);
  border-radius: 0.75rem;
  background-color: var(--step3-card-bg);
  transition:
    transform 0.12s ease,
    box-shadow 0.12s ease,
    border-color 0.12s ease;
  box-shadow: 0 2px 10px var(--color-shadow-light);
}
#msfw-container .package-card:hover,
#msfw-container .package-card:focus-within {
  transform: translateY(-2px);
  box-shadow: 0 6px 18px var(--color-shadow-medium);
  border-color: var(--step3-card-hover-border);
}

/* Card content spacing (only package cards) */
#msfw-container .package-card .card-body {
  background-color: var(--step3-card-bg) !important;
  color: var(--step3-card-text) !important;
  padding: 1.25rem;
}

/* Price block */
#msfw-container .package-card .price-table {
  font-size: 2rem !important;
  font-weight: 700;
}
#msfw-container .package-card .price-cents-table {
  font-size: 1.1rem !important;
  vertical-align: super;
}

/* Installments line */
#msfw-container .package-card .targetjuros {
  font-size: 0.95rem;
}

/* Coverage summary block in the card */
#msfw-container .package-card .border-dotted-t-b {
  border-top: 1px dashed var(--step3-card-divider);
  border-bottom: 1px dashed var(--step3-card-divider);
}

/* Action buttons stack */
#msfw-container .package-card .btn + .btn {
  margin-top: 0.5rem;
}

/* Make buttons full-width inside cards */
#msfw-container .package-card .btn {
  display: block;
  width: 100%;
}

/* Placeholder "Mostrar detalhes" visual (Phase 1: inactive) */
#msfw-container .package-card .btn.btn-secondary[disabled],
#msfw-container .package-card .btn.btn-secondary:disabled {
  opacity: 0.65;
  cursor: not-allowed;
  pointer-events: none;
}

/* Helpful hooks (future sorting/filtering) */
#msfw-container .package-card[data-price] {
}
#msfw-container .package-card[data-coverage] {
}

/* Compare modal table — force blue header + right-align value columns */
#msfw-container #packageModalBody table thead,
#msfw-container #packageModalBody table thead tr,
#msfw-container #packageModalBody table thead th {
  --bs-table-bg: var(--modal-compare-header-alt-bg) !important;
  --bs-table-accent-bg: var(--modal-compare-header-alt-bg) !important;
  --bs-table-color: var(--modal-compare-header-alt-text) !important;
  background-color: var(--modal-compare-header-alt-bg) !important;
  color: var(--modal-compare-header-alt-text) !important;
}
#msfw-container #packageModalBody table thead .table-warning,
#msfw-container #packageModalBody table thead .bg-warning,
#msfw-container #packageModalBody table thead .text-bg-warning {
  background-color: var(--modal-compare-header-alt-bg) !important;
  color: var(--modal-compare-header-alt-text) !important;
}
/* Right-align from 3rd column onward; keep Cobertura & Currency left */
#msfw-container #packageModalBody table th:nth-child(n + 3),
#msfw-container #packageModalBody table td:nth-child(n + 3) {
  text-align: right !important;
}
#msfw-container #packageModalBody table th:nth-child(-n + 2),
#msfw-container #packageModalBody table td:nth-child(-n + 2) {
  text-align: left !important;
}

/* Step 1 - Mensagens de erro de validação */
#msfw-container .search-card .form-group {
  position: relative !important;
  padding-bottom: 25px !important;
}

#msfw-container .search-card .form-group .input-with-icon,
#msfw-container .search-card .form-group .select-wrapper {
  margin-bottom: 0 !important;
}

/* Step 2 - Mensagens de erro de validação */
#msfw-container #step2 .form-group {
  position: relative !important;
  padding-bottom: 25px !important;
}

#msfw-container #step2 .form-group .input-with-icon {
  margin-bottom: 0 !important;
}

#msfw-container #step2 .form-group label.d-inline-flex {
  padding-bottom: 20px !important;
}

#msfw-container #step2 .form-group:has(label.d-inline-flex) {
  padding-bottom: 20px !important;
}

#msfw-container #step2 .form-group:has(#consent) {
  padding-bottom: 0px !important;
}

#msfw-container #step2 .form-group:has(#consent) .field-error {
  bottom: 0 !important;
}

#msfw-container .field-error {
  position: absolute !important;
  bottom: 0 !important;
  left: 15px !important;
  right: 15px !important;
  color: #dc3545 !important;
  font-size: 0.875rem !important;
  margin: 0 !important;
  padding: 0 !important;
  display: none !important;
  line-height: 1.4 !important;
}

#msfw-container .field-error:not(:empty) {
  display: block !important;
}

#msfw-container .error-border,
#msfw-container .error-border.form-control,
#msfw-container .error-border.custom-select,
#msfw-container .error-border.btn,
#msfw-container input.error-border.date-input,
#msfw-container input.error-border.flatpickr-input {
  border-color: #dc3545 !important;
  box-shadow: 0 0 0 1px rgba(220, 53, 69, 1) !important;
}

#msfw-container input[type='checkbox'].error-border {
  outline: 2px solid #dc3545 !important;
  outline-offset: 2px !important;
}

#msfw-container .date-input-wrapper input.error-border.date-input:focus,
#msfw-container input.error-border.flatpickr-input:focus {
  border-color: #dc3545 !important;
  box-shadow: 0 0 0 1px rgba(220, 53, 69, 1) !important;
}

/* Step 2 - Espaçamento entre inputs */
#msfw-container #step2 .form-group + .form-group {
  padding-top: 10px !important;
}

/* Step 2 - Remover padding-left dos inputs (sem ícones) */
#msfw-container #step2 .input-with-icon .form-control,
#msfw-container #step2 .form-group .form-control,
#msfw-container #step2 .form-group select.form-control,
#msfw-container #step2 .form-group input.form-control {
  width: 100% !important;
  box-sizing: border-box !important;
  border-radius: 0.25rem !important;
  height: calc(1.5em + 0.75rem + 2px) !important;
  padding: 0.375rem 0.75rem !important;
  padding-left: 15px !important;
  font-size: 1rem !important;
  line-height: 1.5 !important;
}

/* Step 2 - Espaçamento entre checkbox e texto */
#msfw-container #step2 #consent {
  margin-right: 10px !important;
}

/* Step 2 button (scoped) */
#msfw-container #step2 button.step2.btn.btn-primary {
  background-color: var(--step2-button-bg) !important;
  border-color: var(--step2-button-bg) !important;
  color: var(--step2-button-text) !important;
  width: auto !important;
}

#msfw-container #step2 .form-group.text-right {
  display: flex !important;
  justify-content: flex-end !important;
  align-items: flex-end !important;
}
#msfw-container #step2 button.step2.btn.btn-primary:hover,
#msfw-container #step2 button.step2.btn.btn-primary:focus {
  background-color: var(--step2-button-hover-bg) !important;
  border-color: var(--step2-button-hover-border) !important;
}

.flatpickr-current-month {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
}

.flatpickr-current-month .flatpickr-monthDropdown-months {
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
  background: transparent !important;
  border: none !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: var(--color-text-primary) !important;
  cursor: pointer !important;
  padding: 2px 4px !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
}

.flatpickr-current-month .numInputWrapper {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: auto !important;
  min-width: 70px !important;
}

.flatpickr-current-month input.cur-year {
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 100% !important;
  min-width: 60px !important;
  padding: 2px 4px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  color: var(--color-text-primary) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  text-align: center !important;
}

.flatpickr-current-month input.cur-year:hover {
  border-color: var(--color-border-light) !important;
  background: var(--color-bg-light) !important;
  border-radius: 4px !important;
}

.flatpickr-current-month input.cur-year:focus {
  border-color: var(--step1-input-focus-border) !important;
  background: var(--color-bg-white) !important;
  outline: none !important;
  border-radius: 4px !important;
}

.flatpickr-current-month .numInputWrapper span.arrowUp,
.flatpickr-current-month .numInputWrapper span.arrowDown {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  cursor: pointer !important;
}

.flatpickr-current-month .numInputWrapper:hover span.arrowUp,
.flatpickr-current-month .numInputWrapper:hover span.arrowDown {
  opacity: 1 !important;
}

/* Narrower modal & a bit taller than before (~60vh) */
#msfw-container .modal-dialog.modal-custom {
  max-width: 28rem;
}

#msfw-container .modal-body {
  max-height: 60vh;
  overflow-y: auto;
}

@media (max-width: 576px) {
  #msfw-container .modal-dialog.modal-custom {
    max-width: 95vw;
  }
}

#msfw-container #passengerModal .modal-title {
  font-weight: 600;
  color: var(--modal-pax-title);
}

#msfw-container #pax-close-x {
  color: var(--modal-pax-close) !important;
}

#msfw-container #pax-close-x:hover,
#msfw-container #pax-close-x:focus,
#msfw-container #pax-close-x:active {
  background: var(--color-bg-white) !important;
  color: var(--modal-pax-close) !important;
  opacity: 1 !important;
}

#msfw-container #pax-close-x span {
  font-size: 40px !important;
  color: var(--modal-pax-close) !important;
  padding: 10px !important;
}

#msfw-container .age-range-container {
  border: 1px solid var(--modal-pax-range-border);
  border-radius: 10px;
  padding: 16px;
  margin-bottom: 12px;
  background-color: var(--modal-pax-range-bg);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

#msfw-container .age-range-label {
  font-weight: 700;
  color: var(--modal-pax-range-text);
  font-size: 1rem;
  margin-bottom: 0;
  flex: 1;
}

#msfw-container .age-range-controls {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex: 0 0 auto;
}

#msfw-container .age-range-controls .input-group {
  width: auto;
  display: flex;
  align-items: center;
}

#msfw-container .age-range-controls .pax-display {
  width: 50px;
  text-align: center !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  border: none !important;
  height: 40px !important;
  background-color: var(--color-bg-white) !important;
  color: var(--color-text-primary) !important;
  -webkit-text-fill-color: var(--color-text-primary) !important;
  opacity: 1 !important;
  -webkit-appearance: none !important;
  -moz-appearance: textfield !important;
}

#msfw-container .age-range-controls .pax-display::-webkit-outer-spin-button,
#msfw-container .age-range-controls .pax-display::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

#msfw-container .age-range-controls .pax-display[type='number'] {
  -moz-appearance: textfield;
}

#msfw-container .age-range-controls input.pax-display {
  color: var(--color-text-primary) !important;
}

#msfw-container .age-range-controls .pax-display::-webkit-input-placeholder {
  color: var(--color-text-primary) !important;
  opacity: 1 !important;
}

#msfw-container .age-range-controls .pax-display::-moz-placeholder {
  color: var(--color-text-primary) !important;
  opacity: 1 !important;
}

#msfw-container .age-range-controls .pax-display:-ms-input-placeholder {
  color: var(--color-text-primary) !important;
  opacity: 1 !important;
}

#msfw-container .age-range-controls .pax-display::placeholder {
  color: var(--color-text-primary) !important;
  opacity: 1 !important;
}

#msfw-container .age-range-controls .input-group-prepend,
#msfw-container .age-range-controls .input-group-append {
  margin: 0;
}

#msfw-container .btn-increment,
#msfw-container .btn-decrement {
  background: var(--modal-pax-btn-bg) !important;
  color: var(--modal-pax-btn-text) !important;
  font-weight: bold !important;
  font-size: 25px;
  border-radius: 5px !important;
  border: 2px solid var(--modal-pax-btn-border) !important;
  width: 40px;
  height: 40px;
  min-width: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  line-height: 1;
}

#msfw-container .btn-increment:hover,
#msfw-container .btn-increment:focus,
#msfw-container .btn-decrement:hover,
#msfw-container .btn-decrement:focus {
  background: var(--modal-pax-btn-bg) !important;
  border: 2px solid var(--modal-pax-btn-border) !important;
  color: var(--modal-pax-btn-text) !important;
}

#msfw-container .total-container {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 8px;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--modal-pax-total-border);
}

#msfw-container .total-label {
  font-weight: 700;
  color: var(--modal-pax-total-text);
  font-size: 1rem;
}

#msfw-container .total-value {
  font-weight: 700;
  color: var(--modal-pax-total-text);
  font-size: 1rem;
}

#msfw-container #pax-clear:hover,
#msfw-container #pax-cancel:hover,
#msfw-container #pax-apply:hover {
  background-color: var(--modal-pax-action-hover-bg) !important;
  border-color: var(--modal-pax-action-hover-border) !important;
  color: var(--modal-pax-action-text) !important;
}

#msfw-container #pax-clear:focus,
#msfw-container #pax-cancel:focus,
#msfw-container #pax-apply:focus {
  background-color: var(--modal-pax-action-hover-bg) !important;
  border-color: var(--modal-pax-action-hover-border) !important;
  color: var(--modal-pax-action-text) !important;
}

/* Input with icon styling */
#msfw-container .input-with-icon {
  position: relative;
  display: flex;
  align-items: center;
  overflow: visible;
}

#msfw-container .input-icon {
  position: absolute;
  left: 20px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  pointer-events: none;
  object-fit: contain;
}

#msfw-container .input-icon svg,
#msfw-container .input-icon img {
  display: block;
  width: auto;
  height: auto;
}

#msfw-container .input-icon-right {
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1000;
  pointer-events: none;
  object-fit: contain;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 14px !important;
  height: 14px !important;
}

#msfw-container .input-with-icon.select-wrapper {
  position: relative;
}

#msfw-container .input-with-icon.select-wrapper select.custom-select {
  position: relative;
  z-index: 1;
}

#msfw-container .input-with-icon .form-control,
#msfw-container .input-with-icon .custom-select {
  padding-left: 60px !important;
  padding-right: 50px !important;
  background-color: var(--step1-input-bg) !important;
  color: var(--step1-input-text) !important;
  border: 1px solid var(--step1-input-border) !important;
  border-radius: 10px !important;
  height: 65px !important;
  width: 100% !important;
  font-size: 1rem;
  line-height: 1.5;
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  -o-appearance: none !important;
  background-image: none !important;
  background: var(--step1-input-bg) !important;
  cursor: pointer;
}

#msfw-container .input-with-icon select.custom-select {
  background-image: none !important;
  background: var(--step1-input-bg) !important;
}

#msfw-container .input-with-icon select.custom-select::-webkit-appearance {
  -webkit-appearance: none !important;
}

#msfw-container .input-with-icon select.custom-select::-moz-appearance {
  -moz-appearance: none !important;
}

#msfw-container .input-with-icon input[type='date'].form-control {
  width: 100% !important;
  max-width: 100% !important;
}

#msfw-container .input-with-icon select#country-select.form-control.custom-select {
  width: 100% !important;
  max-width: 100% !important;
  background-image: none !important;
  background: var(--step1-input-bg) !important;
  background-repeat: no-repeat !important;
  background-position: right 20px center !important;
  padding-right: 50px !important;
  padding-left: 60px !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
}

#msfw-container .input-with-icon.select-wrapper select#country-select::-webkit-appearance {
  -webkit-appearance: none !important;
}

#msfw-container .input-with-icon.select-wrapper select#country-select::-moz-appearance {
  -moz-appearance: none !important;
}

#msfw-container .input-with-icon.select-wrapper select#country-select::after {
  display: none !important;
}

#msfw-container select#country-select option {
  padding-left: 0 !important;
  margin-left: 0 !important;
  text-indent: 0 !important;
}

#msfw-container .input-with-icon select#country-select.form-control.custom-select::-ms-expand {
  display: none !important;
}

#msfw-container .input-with-icon select.form-control.custom-select {
  background-image: none !important;
  background: var(--step1-input-bg) !important;
}

#msfw-container .input-with-icon select.form-control.custom-select option {
  background-color: var(--step1-input-bg) !important;
  color: var(--step1-input-text) !important;
}

#msfw-container .input-with-icon select.form-control.custom-select option:hover {
  background-color: var(--color-bg-light) !important;
}

#msfw-container .input-with-icon .form-control::placeholder {
  color: var(--step1-input-text) !important;
}

#msfw-container .input-with-icon select.form-control:focus {
  border-color: var(--step1-input-focus-border) !important;
  outline: none;
  box-shadow: 0 0 0 3px var(--step1-input-focus-shadow) !important;
}

#msfw-container select#country-select option {
  background-color: var(--step1-input-bg) !important;
  color: var(--step1-input-text) !important;
  padding: 12px 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  font-size: 1rem !important;
  line-height: 1.5 !important;
  border: none !important;
  text-align: left !important;
}

#msfw-container select#country-select option:hover {
  background-color: var(--color-bg-light) !important;
  color: var(--step1-input-text) !important;
}

#msfw-container select#country-select option:checked {
  background-color: var(--color-bg-light) !important;
  color: var(--step1-input-text) !important;
}

#msfw-container select#country-select option[value=''] {
  background-color: var(--step1-input-bg) !important;
  color: var(--step1-input-text) !important;
}

#msfw-container select#country-select option[value='']:hover {
  background-color: var(--color-bg-light) !important;
}

#msfw-container select#country-select option:not([value='']):hover {
  background-color: var(--color-bg-light) !important;
  color: var(--step1-input-text) !important;
}

#msfw-container select#country-select {
  border-radius: 10px !important;
}

#msfw-container .date-input-wrapper {
  position: relative;
}

#msfw-container .date-input-wrapper input.date-input {
  color: transparent !important;
  position: relative;
  z-index: 1;
  background-color: var(--step1-input-bg) !important;
  cursor: pointer;
  border-radius: 10px !important;
  box-shadow: 0 1px 3px var(--color-shadow-light) !important;
}

#msfw-container .date-input-wrapper.has-value input.date-input {
  color: var(--step1-input-text) !important;
}

#msfw-container .date-input-wrapper input.date-input:focus {
  color: var(--step1-input-text) !important;
}

#msfw-container .date-input-wrapper input.date-input:focus {
  border-color: var(--step1-input-focus-border) !important;
  outline: none;
  box-shadow: 0 0 0 3px var(--step1-input-focus-shadow);
}

#msfw-container .date-placeholder {
  position: absolute;
  left: 70px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--step1-placeholder-text);
  pointer-events: none;
  z-index: 0;
  font-size: 1rem;
  line-height: 1.5;
  white-space: nowrap;
  font-weight: normal;
}

#msfw-container .date-input-wrapper.has-value .date-placeholder {
  display: none;
}

.datepicker-dropdown {
  position: fixed !important;
  z-index: 10000 !important;
  background: var(--color-bg-white) !important;
  border: 1px solid var(--color-border-light) !important;
  border-radius: 10px !important;
  box-shadow: 0 4px 6px var(--color-shadow-medium) !important;
  margin-top: 4px;
  padding: 16px;
  min-width: 300px;
  display: none;
}

.datepicker-dropdown.show {
  display: block !important;
}

#msfw-container .datepicker-dropdown {
  position: fixed !important;
  z-index: 10000 !important;
  background: var(--color-bg-white) !important;
  border: 1px solid var(--color-border-light) !important;
  border-radius: 10px !important;
  box-shadow: 0 4px 6px var(--color-shadow-medium) !important;
  margin-top: 4px;
  padding: 16px;
  min-width: 300px;
  display: none;
}

#msfw-container .datepicker-dropdown.show {
  display: block !important;
}

#msfw-container .datepicker-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

#msfw-container .datepicker-nav-btn {
  background: none;
  border: none;
  cursor: pointer;
  padding: 4px 8px;
  color: var(--flatpickr-arrow-text);
  font-size: 18px;
  font-weight: bold;
}

#msfw-container .datepicker-nav-btn:hover {
  background-color: var(--flatpickr-hover-bg);
  border-radius: 4px;
}

#msfw-container .datepicker-month-year {
  font-weight: 600;
  color: var(--color-text-primary);
  font-size: 16px;
}

#msfw-container .datepicker-weekdays {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 4px;
  margin-bottom: 8px;
}

#msfw-container .datepicker-weekday {
  text-align: center;
  font-size: 12px;
  font-weight: 600;
  color: var(--color-text-secondary);
  padding: 8px 0;
  text-transform: lowercase;
}

#msfw-container .datepicker-days {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 4px;
}

#msfw-container .datepicker-day {
  text-align: center;
  padding: 8px;
  cursor: pointer;
  border-radius: 4px;
  font-size: 14px;
  color: var(--flatpickr-arrow-text);
  background: transparent;
  border: none;
  min-width: 36px;
  min-height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
}

#msfw-container .datepicker-day:hover {
  background-color: var(--flatpickr-hover-bg);
}

#msfw-container .datepicker-day.other-month {
  color: var(--modal-pax-btn-disabled-text);
}

#msfw-container .datepicker-day.today {
  color: var(--flatpickr-selected-text);
  background: transparent;
  font-weight: normal;
}

#msfw-container .datepicker-day.selected {
  background-color: var(--flatpickr-selected-bg);
  color: var(--flatpickr-selected-text);
  font-weight: 600;
  border-radius: 50%;
}

#msfw-container .datepicker-day.disabled {
  color: var(--modal-pax-btn-disabled-text);
  background-color: var(--modal-pax-btn-disabled-bg);
  cursor: not-allowed;
  border-radius: 4px;
}

#msfw-container .datepicker-day.disabled:hover {
  background-color: var(--modal-pax-btn-disabled-bg);
}

#msfw-container .flatpickr-calendar {
  border-radius: 10px !important;
  box-shadow: 0 4px 6px var(--color-shadow-medium) !important;
  border: 1px solid var(--color-border-light) !important;
  font-family: inherit !important;
}

#msfw-container .flatpickr-months {
  border-radius: 10px 10px 0 0 !important;
  padding: 16px !important;
}

#msfw-container .flatpickr-month {
  color: var(--color-text-primary) !important;
}

#msfw-container .flatpickr-prev-month,
#msfw-container .flatpickr-next-month {
  color: var(--flatpickr-arrow-text) !important;
  fill: var(--flatpickr-arrow-text) !important;
}

#msfw-container .flatpickr-prev-month:hover,
#msfw-container .flatpickr-next-month:hover {
  background-color: var(--color-bg-light) !important;
  border-radius: 4px !important;
}

#msfw-container .flatpickr-weekdays {
  background: transparent !important;
  padding: 8px 0 !important;
}

#msfw-container .flatpickr-weekday {
  color: var(--color-text-secondary) !important;
  font-weight: 600 !important;
  font-size: 12px !important;
  text-transform: lowercase !important;
}

#msfw-container .flatpickr-days {
  padding: 8px !important;
}

#msfw-container .flatpickr-day {
  color: var(--flatpickr-selected-text) !important;
  border-radius: 50% !important;
  border: none !important;
}

#msfw-container .flatpickr-day:hover {
  background-color: var(--flatpickr-hover-bg) !important;
}

#msfw-container .flatpickr-day.today {
  color: var(--flatpickr-selected-text) !important;
  background: transparent !important;
  border: none !important;
  font-weight: normal !important;
}

#msfw-container .flatpickr-day.selected {
  background-color: var(--flatpickr-selected-bg) !important;
  color: var(--flatpickr-selected-text) !important;
  font-weight: 600 !important;
  border-radius: 50% !important;
}

#msfw-container .flatpickr-day.flatpickr-disabled {
  color: var(--modal-pax-btn-disabled-text) !important;
  background-color: var(--modal-pax-btn-disabled-bg) !important;
  cursor: not-allowed !important;
}

#msfw-container .flatpickr-day.flatpickr-disabled:hover {
  background-color: var(--modal-pax-btn-disabled-bg) !important;
}

#msfw-container .flatpickr-day.prev-month-day,
#msfw-container .flatpickr-day.next-month-day {
  color: var(--modal-pax-btn-disabled-text) !important;
}

@media (max-width: 768px) {
  #msfw-container .flatpickr-calendar {
    width: calc(100vw - 40px) !important;
    max-width: 400px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
  }

  #msfw-container .flatpickr-months {
    padding: 12px !important;
  }

  #msfw-container .flatpickr-days {
    padding: 6px !important;
  }

  #msfw-container .flatpickr-day {
    min-width: 32px !important;
    min-height: 32px !important;
    font-size: 13px !important;
  }
}

@media (max-width: 576px) {
  #msfw-container .flatpickr-calendar {
    width: calc(100vw - 30px) !important;
    max-width: 100% !important;
  }

  #msfw-container .flatpickr-months {
    padding: 10px !important;
  }

  #msfw-container .flatpickr-weekday {
    font-size: 11px !important;
    padding: 6px 0 !important;
  }

  #msfw-container .flatpickr-day {
    min-width: 28px !important;
    min-height: 28px !important;
    font-size: 12px !important;
    padding: 6px !important;
  }
}

#msfw-container .passenger-select-btn {
  background-color: var(--step1-input-bg) !important;
  border: 1px solid var(--step1-input-border) !important;
  color: var(--step1-input-text) !important;
  text-align: left;
  padding-left: 60px !important;
  padding-right: 50px !important;
  height: 65px !important;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  font-weight: normal;
  border-radius: 10px !important;
  cursor: pointer;
  box-shadow: 0 1px 3px var(--color-shadow-light) !important;
}

#msfw-container .passenger-select-btn:hover,
#msfw-container .passenger-select-btn:focus,
#msfw-container .passenger-select-btn:active,
#msfw-container .passenger-select-btn.active {
  background-color: var(--step1-input-bg) !important;
  border-color: var(--step1-input-border) !important;
  color: var(--step1-input-text) !important;
  outline: none !important;
}

#msfw-container .quote-button {
  background-color: var(--step1-button-bg) !important;
  border-color: var(--step1-button-bg) !important;
  color: var(--step1-button-text) !important;
  height: 65px !important;
  font-weight: 600;
  border-radius: 10px !important;
}

#msfw-container .quote-button:hover,
#msfw-container .quote-button:focus {
  background-color: var(--step1-button-hover-bg) !important;
  border-color: var(--step1-button-hover-border) !important;
  color: var(--step1-button-text) !important;
}

#msfw-container .form-row {
  display: flex !important;
  flex-wrap: wrap !important;
  margin-right: -25px !important;
  margin-left: -25px !important;
  align-items: flex-end !important;
}

#msfw-container .form-group {
  padding-right: 15px !important;
  padding-left: 15px !important;
  margin-bottom: 0 !important;
  display: flex !important;
  flex-direction: column !important;
}

#msfw-container .form-row.mb-3 {
  margin-bottom: 1rem !important;
}

/* col-md-6: 2 columns on medium screens (768px-991px), but not when col-lg-4 is present */
@media (min-width: 768px) and (max-width: 991px) {
  #msfw-container .col-md-6 {
    flex: 0 0 50% !important;
    max-width: 50% !important;
    width: 50% !important;
  }
}

#msfw-container .col-md-4 {
  flex: 0 0 33.333333% !important;
  max-width: 33.333333% !important;
  width: 33.333333% !important;
}

#msfw-container .form-group label {
  margin-bottom: 0.5rem !important;
}

#msfw-container .form-group.col-md-4:last-child {
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-end !important;
}

@media (max-width: 992px) {
  #msfw-container {
    padding: 30px !important;
  }

  #msfw-container .col-md-6,
  #msfw-container .col-md-4 {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  #msfw-container .form-group {
    margin-bottom: 1rem !important;
  }

  #msfw-container .form-row.mb-3 {
    margin-bottom: 1rem !important;
  }
}

@media (max-width: 768px) {
  #msfw-container {
    padding: 20px !important;
    margin-top: 10px !important;
  }

  #msfw-container .col-md-6,
  #msfw-container .col-md-4 {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  #msfw-container .form-group {
    margin-bottom: 1rem !important;
    padding-right: 10px !important;
    padding-left: 10px !important;
  }

  #msfw-container .form-row {
    margin-right: -10px !important;
    margin-left: -10px !important;
  }

  #msfw-container .form-group label {
    font-size: 0.9rem !important;
    margin-bottom: 0.4rem !important;
  }

  #msfw-container .input-with-icon .form-control,
  #msfw-container .input-with-icon .custom-select,
  #msfw-container .passenger-select-btn,
  #msfw-container .quote-button {
    height: 55px !important;
    font-size: 0.9rem !important;
    padding-left: 55px !important;
    padding-right: 45px !important;
  }

  #msfw-container .input-icon {
    left: 15px !important;
    width: 22px !important;
    height: 22px !important;
  }

  #msfw-container .input-icon-right {
    right: 15px !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    z-index: 1000 !important;
  }

  #msfw-container .input-with-icon.select-wrapper select#country-select {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    background-image: none !important;
  }

  #msfw-container .date-placeholder {
    left: 60px !important;
    font-size: 0.9rem !important;
  }

  #msfw-container .quote-button {
    margin-top: 0 !important;
  }
}

@media (max-width: 576px) {
  #msfw-container {
    padding: 15px !important;
    margin-top: 10px !important;
    border-radius: 8px !important;
  }

  #msfw-container .form-group {
    padding-right: 8px !important;
    padding-left: 8px !important;
    margin-bottom: 0.8rem !important;
  }

  #msfw-container .form-row {
    margin-right: -8px !important;
    margin-left: -8px !important;
  }

  #msfw-container .form-group label {
    font-size: 0.85rem !important;
    margin-bottom: 0.3rem !important;
  }

  #msfw-container .input-with-icon .form-control,
  #msfw-container .input-with-icon .custom-select,
  #msfw-container .passenger-select-btn,
  #msfw-container .quote-button {
    height: 50px !important;
    font-size: 0.85rem !important;
    padding-left: 50px !important;
    padding-right: 40px !important;
  }

  #msfw-container .input-icon {
    left: 12px !important;
    width: 20px !important;
    height: 20px !important;
  }

  #msfw-container .input-icon-right {
    right: 12px !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    z-index: 1000 !important;
  }

  #msfw-container .input-with-icon.select-wrapper select#country-select {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    background-image: none !important;
  }

  #msfw-container .date-placeholder {
    left: 55px !important;
    font-size: 0.85rem !important;
  }

  #msfw-container .flatpickr-calendar {
    width: 100% !important;
    max-width: 100% !important;
    left: 0 !important;
    right: 0 !important;
    margin: 0 auto !important;
  }
}

#msfw-container .input-with-icon {
  position: relative;
  display: flex;
  align-items: center;
}

/* fixed overlay covering the viewport */
#msfw-spinner-overlay {
  position: fixed !important;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100vw;
  height: 100vh;
  z-index: 2000 !important; /* > Bootstrap .modal (1050) and .modal-backdrop (1040) */
}
#msfw-spinner-overlay .msfw-spinner-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.6); /* light glass effect */
  pointer-events: all;
}
#msfw-spinner-overlay .msfw-spinner-box {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 120px;
  min-height: 120px;
  padding: 8px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0); /* transparent box; backdrop does the dimming */
}
/* big spinner */
#msfw-spinner-overlay #loading-spinner {
  display: block !important;
  width: 96px; /* larger, matches Step 1's spec */
  height: auto;
}

/* ============================================================================
   ESTILOS EXTRAÍDOS DOS TEMPLATES PHP - results-template-get-packages.php
   ============================================================================ */

/* Tooltip + help icon styling */
.msfw-help-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: var(--help-icon-bg);
  color: var(--help-icon-text);
  font-weight: 700;
  font-size: 12px;
  line-height: 1;
  margin-left: 6px;
  cursor: pointer;
  text-decoration: none;
  border: 1px solid var(--help-icon-border);
}
.msfw-help-icon:focus {
  outline: 2px solid rgba(13, 110, 253, 0.35);
  outline-offset: 2px;
}

.msfw-tip {
  position: absolute;
  z-index: 2000;
  max-width: 320px;
  padding: 10px 12px;
  background: var(--tooltip-bg);
  color: var(--tooltip-text);
  border-radius: 8px;
  box-shadow: 0 8px 24px var(--color-shadow-dark);
  font-size: 0.9rem;
}
.msfw-tip .msfw-tip-title {
  font-weight: 700;
  margin-bottom: 6px;
}
.msfw-tip:after {
  content: '';
  position: absolute;
  width: 0;
  height: 0;
  border: 8px solid transparent;
  border-top-color: var(--tooltip-bg);
  left: 16px;
  bottom: -16px;
}

/* Table header color (dark blue) and "Selecionar" text always white */
.table-comparison thead th {
  background: var(--tooltip-bg);
  color: var(--color-text-light) !important;
  border-color: var(--modal-compare-header-border);
  white-space: normal;
  word-break: break-word;
  line-height: 1.2;
  font-size: 0.9rem;
}
.btn-select {
  color: var(--color-text-light) !important;
}

/* FIX: manter a coluna do plano selecionado com o mesmo fundo azulado em todas as linhas */
.table-comparison th.table-primary,
.table-comparison td.table-primary {
  background-color: var(--modal-compare-selected-bg) !important;
  color: var(--modal-compare-selected-text) !important;
}
.table-comparison.table-striped tbody tr:nth-of-type(odd) td.table-primary,
.table-comparison.table-striped tbody tr:nth-of-type(odd) th.table-primary {
  background-color: var(--modal-compare-selected-bg) !important;
  color: var(--modal-compare-selected-text) !important;
}

/* NOVO: alinhar colunas de pacotes (3ª em diante) à direita com padding */
.table-comparison th:nth-child(n + 3),
.table-comparison td:nth-child(n + 3) {
  text-align: right !important;
  padding-right: 12px !important;
}

/* WhatsApp button style */
.msfw-whatsapp-btn {
  color: var(--step3-btn-whatsapp-text) !important;
}
.msfw-whatsapp-btn:hover {
  background-color: var(--step3-btn-whatsapp-hover-bg) !important;
  color: var(--step3-btn-whatsapp-text) !important;
}

/* Edit Quote Form - results-template-get-packages.php */
#edit-quote-form .input-with-icon {
  position: relative;
  display: flex;
  align-items: center;
  overflow: visible;
}

#edit-quote-form .input-icon {
  position: absolute;
  left: 20px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  pointer-events: none;
  object-fit: contain;
}

#edit-quote-form .input-icon-right {
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1000;
  pointer-events: none;
  object-fit: contain;
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 14px !important;
  height: 14px !important;
}

#edit-quote-form .input-with-icon .form-control,
#edit-quote-form .input-with-icon .custom-select {
  padding-left: 60px !important;
  padding-right: 50px !important;
  background-color: var(--edit-quote-input-bg) !important;
  color: var(--edit-quote-input-text) !important;
  border: 1px solid var(--edit-quote-input-border) !important;
  border-radius: 10px !important;
  height: 65px !important;
  width: 100% !important;
  font-size: 1rem;
  line-height: 1.5;
  appearance: none !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  -o-appearance: none !important;
  background-image: none !important;
  background: var(--edit-quote-input-bg) !important;
  cursor: pointer;
}

#edit-quote-form .input-with-icon.select-wrapper select.custom-select {
  background-image: none !important;
  background: var(--edit-quote-input-bg) !important;
}

#edit-quote-form .input-with-icon.select-wrapper select.custom-select::-ms-expand {
  display: none !important;
}

#edit-quote-form .date-input-wrapper {
  position: relative;
}

#edit-quote-form .date-input-wrapper input.date-input {
  color: transparent !important;
  position: relative;
  z-index: 1;
  background-color: var(--edit-quote-input-bg) !important;
  cursor: pointer;
  border-radius: 10px !important;
  box-shadow: 0 1px 3px var(--color-shadow-light) !important;
}

#edit-quote-form .date-input-wrapper.has-value input.date-input {
  color: var(--edit-quote-input-text) !important;
}

#edit-quote-form .date-input-wrapper input.date-input:focus {
  color: var(--edit-quote-input-text) !important;
  border-color: var(--edit-quote-input-focus-border) !important;
  outline: none;
  box-shadow: 0 0 0 3px var(--step1-input-focus-shadow);
}

#edit-quote-form .date-placeholder {
  position: absolute;
  left: 70px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--step1-placeholder-text);
  pointer-events: none;
  z-index: 0;
  font-size: 1rem;
  line-height: 1.5;
  white-space: nowrap;
  font-weight: normal;
}

#edit-quote-form .date-input-wrapper.has-value .date-placeholder {
  display: none;
}

#edit-quote-form .flatpickr-calendar {
  border-radius: 10px !important;
  box-shadow: 0 4px 6px var(--color-shadow-medium) !important;
  border: 1px solid var(--color-border-light) !important;
}

#edit-quote-form .flatpickr-months {
  padding: 16px !important;
}

#edit-quote-form .flatpickr-month {
  color: var(--color-text-primary) !important;
}

#edit-quote-form .flatpickr-current-month .flatpickr-monthDropdown-months,
#edit-quote-form .flatpickr-current-month input.cur-year {
  display: inline-block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

#edit-quote-form .flatpickr-current-month input.cur-year {
  width: auto !important;
  min-width: 60px !important;
  padding: 2px 4px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  color: var(--color-text-primary) !important;
  font-size: inherit !important;
  font-weight: 600 !important;
  cursor: pointer !important;
}

#edit-quote-form .flatpickr-current-month input.cur-year:hover {
  border-color: var(--color-border-light) !important;
  background: var(--color-bg-light) !important;
}

#edit-quote-form .flatpickr-current-month input.cur-year:focus {
  border-color: var(--edit-quote-input-focus-border) !important;
  background: var(--color-bg-white) !important;
  outline: none !important;
}

#edit-quote-form .flatpickr-prev-month,
#edit-quote-form .flatpickr-next-month {
  color: var(--flatpickr-arrow-text) !important;
  fill: var(--flatpickr-arrow-text) !important;
}

#edit-quote-form .flatpickr-prev-month:hover,
#edit-quote-form .flatpickr-next-month:hover {
  background-color: var(--color-bg-light) !important;
  border-radius: 4px !important;
}

#edit-quote-form .passenger-select-btn {
  background-color: var(--edit-quote-input-bg) !important;
  border: 1px solid var(--edit-quote-input-border) !important;
  color: var(--edit-quote-input-text) !important;
  text-align: left;
  padding-left: 60px !important;
  padding-right: 50px !important;
  height: 65px !important;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  font-weight: normal;
  border-radius: 10px !important;
  cursor: pointer;
  box-shadow: 0 1px 3px var(--color-shadow-light) !important;
}

#edit-quote-form .passenger-select-btn:hover,
#edit-quote-form .passenger-select-btn:focus,
#edit-quote-form .passenger-select-btn:active,
#edit-quote-form .passenger-select-btn.active {
  background-color: var(--edit-quote-input-bg) !important;
  border-color: var(--edit-quote-input-border) !important;
  color: var(--edit-quote-input-text) !important;
  outline: none !important;
}

#edit-quote-form .btn-update-quote {
  background-color: var(--edit-quote-btn-bg) !important;
  border-color: var(--edit-quote-btn-bg) !important;
  color: var(--edit-quote-btn-text) !important;
  height: 65px !important;
  font-weight: 600;
  border-radius: 10px !important;
}

#edit-quote-form .btn-update-quote:hover,
#edit-quote-form .btn-update-quote:focus {
  background-color: var(--edit-quote-btn-hover-bg) !important;
  border-color: var(--edit-quote-btn-hover-bg) !important;
  color: var(--edit-quote-btn-text) !important;
}

#edit-quote-form .form-group {
  position: relative !important;
  padding-bottom: 25px !important;
}

#edit-quote-form .form-group .field-error {
  position: absolute !important;
  bottom: 0 !important;
  left: 15px !important;
  right: 15px !important;
  color: #dc3545 !important;
  font-size: 0.875rem !important;
  margin: 0 !important;
  padding: 0 !important;
  display: none !important;
  line-height: 1.4 !important;
}

#edit-quote-form .form-group .field-error:not(:empty) {
  display: block !important;
}

/* Edit Passenger Modal - results-template-get-packages.php */
#edit-passengerModal .modal-dialog.modal-custom {
  max-width: 28rem;
}
#edit-passengerModal .modal-body {
  max-height: 60vh;
  overflow-y: auto;
}
@media (max-width: 576px) {
  #edit-passengerModal .modal-dialog.modal-custom {
    max-width: 95vw;
  }
}

#edit-passengerModal .modal-title {
  font-weight: 600;
  color: var(--modal-pax-title);
}

#edit-pax-close-x {
  color: var(--modal-pax-close) !important;
}

#edit-pax-close-x:hover,
#edit-pax-close-x:focus,
#edit-pax-close-x:active {
  background: var(--color-bg-white) !important;
  color: var(--modal-pax-close) !important;
  opacity: 1 !important;
}

#edit-pax-close-x span {
  font-size: 40px !important;
  color: var(--modal-pax-close) !important;
  padding: 10px !important;
}

#edit-passengerModal .age-range-container {
  border: 1px solid var(--modal-pax-range-border);
  border-radius: 10px;
  padding: 16px;
  margin-bottom: 12px;
  background-color: var(--modal-pax-range-bg);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}

#edit-passengerModal .age-range-label {
  font-weight: 700;
  color: var(--modal-pax-range-text);
  font-size: 1rem;
  margin-bottom: 0;
  flex: 1;
}

#edit-passengerModal .age-range-controls {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex: 0 0 auto;
}

#edit-passengerModal .age-range-controls .input-group {
  width: auto;
  display: flex;
  align-items: center;
}

#edit-passengerModal .age-range-controls .pax-display {
  width: 50px;
  text-align: center !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  border: none !important;
  height: 40px !important;
  background-color: var(--color-bg-white) !important;
  color: var(--color-text-primary) !important;
  -webkit-text-fill-color: var(--color-text-primary) !important;
  opacity: 1 !important;
  -webkit-appearance: none !important;
  -moz-appearance: textfield !important;
}

#edit-passengerModal .age-range-controls .pax-display::-webkit-outer-spin-button,
#edit-passengerModal .age-range-controls .pax-display::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

#edit-passengerModal .age-range-controls .pax-display[type='number'] {
  -moz-appearance: textfield;
}

#edit-passengerModal .btn-increment,
#edit-passengerModal .btn-decrement {
  background: var(--modal-pax-btn-bg) !important;
  color: var(--modal-pax-btn-text) !important;
  font-weight: bold !important;
  font-size: 25px;
  border-radius: 5px !important;
  border: 2px solid var(--modal-pax-btn-border) !important;
  width: 40px;
  height: 40px;
  min-width: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
  line-height: 1;
}

#edit-passengerModal .btn-increment:hover,
#edit-passengerModal .btn-increment:focus,
#edit-passengerModal .btn-decrement:hover,
#edit-passengerModal .btn-decrement:focus {
  background: var(--modal-pax-btn-bg) !important;
  border: 2px solid var(--modal-pax-btn-border) !important;
  color: var(--modal-pax-btn-text) !important;
}

#edit-passengerModal .total-container {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 8px;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--modal-pax-total-border);
}

#edit-passengerModal .total-label {
  font-weight: 700;
  color: var(--modal-pax-total-text);
  font-size: 1rem;
}

#edit-passengerModal .total-value {
  font-weight: 700;
  color: var(--modal-pax-total-text);
  font-size: 1rem;
}

#edit-pax-clear:hover,
#edit-pax-cancel:hover,
#edit-pax-apply:hover {
  background-color: var(--modal-pax-action-hover-bg) !important;
  border-color: var(--modal-pax-action-hover-border) !important;
  color: var(--modal-pax-action-text) !important;
}

#edit-pax-clear:focus,
#edit-pax-cancel:focus,
#edit-pax-apply:focus {
  background-color: var(--modal-pax-action-hover-bg) !important;
  border-color: var(--modal-pax-action-hover-border) !important;
  color: var(--modal-pax-action-text) !important;
}

@media (max-width: 768px) {
  #edit-quote-form .input-with-icon .form-control,
  #edit-quote-form .input-with-icon .custom-select,
  #edit-quote-form .passenger-select-btn,
  #edit-quote-form .btn-update-quote {
    height: 55px !important;
    font-size: 0.9rem !important;
    padding-left: 55px !important;
    padding-right: 45px !important;
  }

  #edit-quote-form .input-icon {
    left: 15px !important;
    width: 22px !important;
    height: 22px !important;
  }

  #edit-quote-form .input-icon-right {
    right: 15px !important;
  }

  #edit-quote-form .date-placeholder {
    left: 60px !important;
    font-size: 0.9rem !important;
  }
}

@media (max-width: 576px) {
  #edit-quote-form .input-with-icon .form-control,
  #edit-quote-form .input-with-icon .custom-select,
  #edit-quote-form .passenger-select-btn,
  #edit-quote-form .btn-update-quote {
    height: 50px !important;
    font-size: 0.85rem !important;
    padding-left: 50px !important;
    padding-right: 40px !important;
  }

  #edit-quote-form .input-icon {
    left: 12px !important;
    width: 20px !important;
    height: 20px !important;
  }

  #edit-quote-form .input-icon-right {
    right: 12px !important;
  }

  #edit-quote-form .date-placeholder {
    left: 55px !important;
    font-size: 0.85rem !important;
  }
}

/* ============================================================================
   ESTILOS EXTRAÍDOS DOS TEMPLATES PHP - results-template-payment-details.php
   ============================================================================ */

/* tiny spinner in button */
#spinner {
  display: none;
  margin-right: 0.5rem;
}
#payment-button.loading #spinner {
  display: inline-block;
}
#payment-button.loading #button-text {
  display: none;
}

/* overlay spinner (center of viewport) */
#loading-spinner {
  display: none;
  position: fixed;
  inset: 0;
  margin: auto;
  z-index: 2000;
  width: 96px;
  height: auto;
  pointer-events: none;
}

/* dark-blue header + white text for the purchase title */
.payment-header {
  background-color: var(--step5-header-bg) !important;
  color: var(--step5-header-text) !important;
}

/* dark-blue primary action button */
.btn-darkblue {
  background-color: var(--step5-btn-pay-bg) !important;
  border-color: var(--step5-btn-pay-bg) !important;
  color: var(--step5-btn-pay-text) !important;
}
.btn-darkblue:hover,
.btn-darkblue:focus {
  background-color: var(--step5-btn-pay-hover-bg) !important;
  border-color: var(--step5-btn-pay-hover-border) !important;
  color: var(--step5-btn-pay-text) !important;
}

/* Checkbox não estou em viagem */
#not_traveling {
  width: 18px;
  height: 18px;
  cursor: pointer;
}
.form-check-label strong {
  color: var(--step5-checkbox-label);
}
.form-check {
  padding-left: 1.75rem;
}

/* ============================================================================
   ESTILOS EXTRAÍDOS DOS TEMPLATES PHP - results-template-payment-confirmation.php
   ============================================================================ */

#msfw-container .payment-confirmation .noline {
  text-decoration: none;
}
#msfw-container .payment-confirmation .card-header {
  background-color: var(--step6-accordion-header-bg);
  color: var(--step6-accordion-header-text);
}
#msfw-container .payment-confirmation .btn-link {
  color: var(--step6-link-text);
  text-decoration: none;
}
#msfw-container .payment-confirmation .btn-link.collapsed {
  color: var(--step6-link-text);
  opacity: var(--step6-link-collapsed-opacity);
}
#msfw-container .payment-confirmation .btn-link:hover {
  text-decoration: underline;
}

/* ============================================================================
   ESTILOS EXTRAÍDOS DOS TEMPLATES PHP - results-template-enter-passenger-details.php
   ============================================================================ */

/* Centered overlay spinner (same pattern used in other steps) */
#loading-spinner {
  display: none;
  position: fixed;
  inset: 0;
  margin: auto;
  z-index: 2000;
  width: 96px;
  height: auto;
  pointer-events: none;
}

/* Ensure the main submit button is always white text */
#passengers-data-forms button[type='submit'] {
  background-color: var(--step4-btn-submit-bg) !important;
  border-color: var(--step4-btn-submit-bg) !important;
  color: var(--step4-btn-submit-text) !important;
}
#passengers-data-forms button[type='submit']:hover,
#passengers-data-forms button[type='submit']:focus,
#passengers-data-forms button[type='submit']:active {
  background-color: var(--step4-btn-submit-hover-bg) !important;
  border-color: var(--step4-btn-submit-hover-border) !important;
  color: var(--step4-btn-submit-text) !important;
}

/* ========================================
   STEP 4/5/6 - Espaçamento entre campos
   ======================================== */

/* Step 4 - Formulário de passageiros */
#passengers-data-forms .form-group {
  margin-bottom: 15px !important;
}

#passengers-data-forms .form-group {
  position: relative !important;
  padding-bottom: 25px !important;
}

#passengers-data-forms .form-group .form-control,
#passengers-data-forms .form-group select.form-control,
#passengers-data-forms .form-group input.form-control {
  width: 100% !important;
  box-sizing: border-box !important;
}

#passengers-data-forms .form-group .input-group {
  width: 100% !important;
}

#passengers-data-forms .form-group .input-group .form-control {
  width: 100% !important;
  flex: 1 1 auto !important;
}

#passengers-data-forms .form-group .field-error {
  position: absolute !important;
  bottom: 0 !important;
  left: 15px !important;
  right: 15px !important;
  color: #dc3545 !important;
  font-size: 0.875rem !important;
  margin: 0 !important;
  padding: 0 !important;
  display: none !important;
  line-height: 1.4 !important;
}

#passengers-data-forms .form-group .field-error:not(:empty) {
  display: block !important;
}

/* Step 5 - Formulário de pagamento */
#payment-form .form-group {
  margin-bottom: 15px !important;
}

/* Step 6 - Confirmação de pagamento */
.payment-confirmation .form-group {
  margin-bottom: 15px !important;
}

/* Espaçamento geral para cards nas etapas 4/5/6 */
#msfw-container .card-body .form-group {
  margin-bottom: 15px !important;
}

/* Garantir espaçamento em containers fora do step-1 */
#msfw-container .container .form-group:not(.input-with-icon .form-group) {
  margin-bottom: 15px !important;
}