/* Mobile Products Layout - Force 2 columns */
@media (max-width: 768px) {
  /* Force 2 columns on mobile for products */
  .row .col-sm-6 {
    flex: 0 0 50% !important;
    max-width: 50% !important;
  }
  
  /* Override Bootstrap defaults */
  .col-lg-4.col-md-6.col-sm-6 {
    flex: 0 0 50% !important;
    max-width: 50% !important;
  }
  
  /* Ensure proper spacing */
  .row {
    margin-left: -0.5rem;
    margin-right: -0.5rem;
  }
  
  .row > [class*="col-"] {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
  }
  
  /* Product card adjustments */
  .product-card {
    margin-bottom: 0.75rem;
  }
  
  .product-card-img {
    height: 180px !important;
  }
  
  .card-body {
    padding: 0.75rem;
  }
  
  .card-title {
    font-size: 0.9rem;
    line-height: 1.3;
    margin-bottom: 0.5rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  
  .card-text {
    font-size: 0.85rem !important;
    margin-bottom: 0.75rem !important;
  }
  
  .btn-sm {
    padding: 0.4rem 0.8rem;
    font-size: 0.8rem;
  }
  
  .badge {
    font-size: 0.65rem;
    padding: 0.25rem 0.5rem;
  }
}

@media (max-width: 576px) {
  /* Force 2 columns on small mobile */
  .row .col-sm-6 {
    flex: 0 0 50% !important;
    max-width: 50% !important;
  }
  
  .col-lg-4.col-md-6.col-sm-6 {
    flex: 0 0 50% !important;
    max-width: 50% !important;
  }
  
  .product-card-img {
    height: 160px !important;
  }
  
  .card-body {
    padding: 0.6rem;
  }
  
  .card-title {
    font-size: 0.85rem;
    margin-bottom: 0.4rem;
  }
  
  .card-text {
    font-size: 0.8rem !important;
    margin-bottom: 0.6rem !important;
  }
  
  .btn-sm {
    padding: 0.35rem 0.7rem;
    font-size: 0.75rem;
  }
  
  .badge {
    font-size: 0.6rem;
    padding: 0.2rem 0.4rem;
  }
}

@media (max-width: 480px) {
  /* Force 2 columns on very small mobile */
  .row .col-sm-6 {
    flex: 0 0 50% !important;
    max-width: 50% !important;
  }
  
  .col-lg-4.col-md-6.col-sm-6 {
    flex: 0 0 50% !important;
    max-width: 50% !important;
  }
  
  .product-card-img {
    height: 140px !important;
  }
  
  .card-body {
    padding: 0.5rem;
  }
  
  .card-title {
    font-size: 0.8rem;
    margin-bottom: 0.3rem;
  }
  
  .card-text {
    font-size: 0.75rem !important;
    margin-bottom: 0.5rem !important;
  }
  
  .btn-sm {
    padding: 0.3rem 0.6rem;
    font-size: 0.7rem;
  }
  
  .d-flex.gap-2 {
    gap: 0.3rem !important;
  }
}