/* ============================================
   PRICING BUTTONS COLUMN FIX
   Force buttons to always display in one column
   ============================================ */

/* Force pricing actions to be column layout - highest priority */
.pricing-actions,
.pricing-card-modern .pricing-actions,
.pricing-card .pricing-actions,
.pricing-card-body .pricing-actions {
  display: flex !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  align-items: stretch !important;
  width: 100% !important;
  gap: 0.875rem !important;
}

/* Ensure all buttons are block-level and full width */
.pricing-actions .btn-view-details,
.pricing-actions .btn-pay,
.pricing-actions button,
.pricing-actions a,
.pricing-actions .btn {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  flex-shrink: 0 !important;
}

/* Override any inline-block or inline-flex */
.pricing-actions .btn-view-details,
.pricing-actions .btn-pay {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
}

/* Mobile - ensure column layout maintained */
@media (max-width: 768px) {
  .pricing-actions {
    flex-direction: column !important;
    flex-wrap: nowrap !important;
  }
  
  .pricing-actions .btn-view-details,
  .pricing-actions .btn-pay,
  .pricing-actions button,
  .pricing-actions a {
    width: 100% !important;
    display: flex !important;
  }
}

