/* Layout Fixes for Production Deployment */

/* Fix button stacking issues - ensure proper horizontal layout */
.btn-group {
  display: flex !important;
  flex-direction: row !important;
  align-items: center;
  gap: 0.5rem;
}

.btn-group .btn {
  margin-bottom: 0 !important;
  flex: none;
}

/* Form button containers should display horizontally by default */
.card-footer .btn-group,
.form-actions .btn-group,
.transfer-actions {
  display: flex !important;
  flex-direction: row !important;
  gap: 0.75rem;
  align-items: center;
  justify-content: flex-start;
}

/* Fix footer wrapping - ensure single line layout */
.main-footer {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  white-space: nowrap;
  flex-wrap: nowrap !important;
}

.main-footer .text-left,
.main-footer .text-right {
  flex-shrink: 0;
  min-width: 0;
}

/* Only apply mobile stacking on actual mobile devices */
@media (max-width: 575.98px) {
  .btn-group {
    flex-direction: column !important;
  }
  
  .main-footer {
    flex-direction: column !important;
    text-align: center !important;
    gap: 0.5rem;
  }
}

/* Ensure proper flex alignment for form buttons */
.d-flex .btn {
  margin-right: 0.5rem;
}

.d-flex .btn:last-child {
  margin-right: 0;
}

/* Fix transfer form buttons specifically */
.transfer-form .btn-group,
.transfer-form .form-actions {
  display: flex !important;
  flex-direction: row !important;
  gap: 0.5rem;
  margin-top: 1rem;
}

/* Override any conflicting mobile styles on larger screens */
@media (min-width: 768px) {
  .btn-group {
    flex-direction: row !important;
    width: auto !important;
  }
  
  .btn-group .btn {
    border-radius: 0.375rem !important;
    margin-bottom: 0 !important;
  }
  
  .btn-group .btn:not(:last-child) {
    margin-right: 0.5rem;
  }
}

/* Product List Table Action Buttons - Compact Layout */
.table .action-buttons {
  width: 120px !important;  /* Fixed width for Actions column */
  min-width: 120px;
  max-width: 120px;
  white-space: nowrap;
  padding: 0.3rem 0.5rem !important;
}

.table .action-buttons .btn {
  padding: 0.2rem 0.5rem !important;  /* More compact button padding */
  font-size: 0.75rem !important;      /* Smaller font size */
  margin-right: 0.3rem !important;    /* Tighter spacing */
  min-width: 36px;                    /* Consistent minimum width */
  line-height: 1.2;                   /* Tighter line height */
  border-radius: 0.25rem !important;  /* Smaller border radius */
}

.table .action-buttons .btn:last-child {
  margin-right: 0 !important;
}

.table .action-buttons .btn i {
  font-size: 0.75rem;  /* Smaller icons */
}

/* Ensure Actions column header is also constrained */
.table thead th:last-child {
  width: 120px !important;
  min-width: 120px;
  max-width: 120px;
  text-align: center;
}

/* Improve overall table layout for better proportions */
.table-compact th:nth-child(1) { width: 80px; }   /* Product ID */
.table-compact th:nth-child(2) { width: auto; }    /* Description - flexible */
.table-compact th:nth-child(3) { width: 100px; }   /* Retail Price */
.table-compact th:nth-child(4) { width: 150px; }   /* Vendor */
.table-compact th:nth-child(5) { width: 90px; }    /* Status */
.table-compact th:nth-child(6) { width: 120px; }   /* Actions */

/* Ensure table cells maintain the same proportions */
.table-compact td:nth-child(1) { width: 80px; text-align: center; }
.table-compact td:nth-child(2) { width: auto; }
.table-compact td:nth-child(3) { width: 100px; text-align: right; }
.table-compact td:nth-child(4) { width: 150px; }
.table-compact td:nth-child(5) { width: 90px; text-align: center; }
.table-compact td:nth-child(6) { width: 120px; text-align: center; }