/*
 * InstaFluid Booking – Responsive Styles
 */

@media (max-width: 900px) {
  .ifb-layout {
    flex-direction: column;
    gap: 24px;
    padding: 0 20px;
  }
  
  .ifb-sidebar {
    position: static;
    flex-direction: column;
    width: 100%;
    flex: none !important;
  }
  
  .ifb-progress-card {
    display: none; /* Often hidden on mobile to save space, or transformed into a horizontal bar */
  }
  
  .ifb-summary-card {
    width: 100%;
  }
  
  .ifb-schedule-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .ifb-type-grid,
  .ifb-grid-2,
  .ifb-grid-3 {
    grid-template-columns: 1fr;
  }
  
  .ifb-col-2,
  .ifb-col-3 {
    grid-column: span 1;
  }
  
  .ifb-main {
    padding: 24px;
  }
  
  .ifb-step-title {
    font-size: 24px;
  }
  
  .ifb-nav-bar {
    flex-direction: column-reverse;
    gap: 16px;
  }
  
  .ifb-next-btn {
    width: 100%;
    justify-content: center;
  }
}