/* ============================================================
   C.H DU CORTE MOBILE R1.2 — UX MOBILE
   Escopo:
   - modais de horário mais compactos no celular
   - cabeçalho institucional oculto durante o fluxo após a etapa 1
   - espaçamento seguro entre Voltar e Confirmar na etapa final
   ============================================================ */

@media (max-width: 760px) {
  /* Fluxo iniciado: remove logo, atendimento e localização para focar no agendamento. */
  body.mobile-r12-booking-flow .v04-header {
    display: none !important;
  }

  body.mobile-r12-booking-flow .v04-main {
    padding-top: 10px !important;
  }

  /* Pop-ups de carregamento/seleção deixam margem lateral real. */
  .v0924-loading-modal,
  .v09246-selecting-modal {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  .v0924-loading-dialog,
  .v09246-selecting-dialog {
    width: min(330px, 86vw) !important;
    max-width: 330px !important;
    box-sizing: border-box !important;
    padding: 22px 18px 18px !important;
    border-radius: 18px !important;
  }

  /* Finalização: Voltar e Confirmar não ficam colados. */
  .v04-view[data-step="5"] .v04-actions.split {
    display: grid !important;
    grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr) !important;
    gap: 14px !important;
    align-items: stretch !important;
  }

  .v04-view[data-step="5"] .v04-actions.split > button {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
  }
}

@media (max-width: 430px) {
  .v0924-loading-dialog,
  .v09246-selecting-dialog {
    width: min(320px, 84vw) !important;
    max-width: 320px !important;
    padding: 20px 16px 17px !important;
    border-radius: 17px !important;
  }

  .v04-view[data-step="5"] .v04-actions.split {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  .v04-view[data-step="5"] .v04-actions.split .v04-primary {
    min-height: 52px !important;
  }
}