/* Global responsive helpers for small screens */
@media (max-width: 768px) {
  /* Stack grid columns on small screens */
  [class*="col-md-"],
  [class*="col-lg-"],
  [class*="col-sm-"] {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }

  /* Ensure rows wrap */
  .row,
  .d-flex {
    flex-wrap: wrap !important;
  }

  /* Common cards/boxes full width */
  .summary-card,
  .order-summary-card,
  .purchase-card,
  .vendor-section {
    width: 100% !important;
  }

  /* Buttons and form controls span full width when nested in blocks */
  .btn,
  .button,
  button,
  input[type="text"],
  input[type="email"],
  input[type="number"],
  select,
  textarea {
    width: 100%;
    max-width: 100%;
  }

  /* Images scale down gracefully */
  img {
    max-width: 100%;
    height: auto;
  }

  /* Reduce padding for dense mobile layouts */
  .container,
  .container-fluid,
  .main-cart-layout,
  .main-content {
    padding-left: 12px;
    padding-right: 12px;
  }
}