/* Responsive Fixes for Dashboard and Components */

/* Dashboard Cards Responsive */
@media (max-width: 576px) {
  .card-responsive {
    margin-bottom: 1rem;
  }
  
  .card-responsive .card-body {
    padding: 1rem 0.75rem;
  }
  
  .card-responsive h3 {
    font-size: 1.5rem;
  }
  
  .card-responsive h4 {
    font-size: 1.25rem;
  }
  
  .card-responsive h6 {
    font-size: 0.875rem;
  }
  
  .btn-responsive {
    padding: 0.5rem 0.75rem;
    font-size: 0.875rem;
  }
}

@media (max-width: 768px) {
  .content-wrapper {
    padding: 1rem 0.5rem;
  }
  
  .container-xxl {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }
  
  .row.g-3 {
    --bs-gutter-x: 0.75rem;
    --bs-gutter-y: 0.75rem;
  }
  
  .h3-responsive {
    font-size: 1.5rem;
  }
  
  .fs-responsive-base {
    font-size: 0.9rem;
  }
  
  .fs-responsive-lg {
    font-size: 1.1rem;
  }
  
  .fs-responsive-sm {
    font-size: 0.85rem;
  }
  
  .fs-responsive-xs {
    font-size: 0.75rem;
  }
}

@media (min-width: 576px) and (max-width: 991px) {
  .col-sm-6:nth-child(odd) {
    padding-right: 0.375rem;
  }
  
  .col-sm-6:nth-child(even) {
    padding-left: 0.375rem;
  }
}

/* Card Height Fixes */
.h-100 {
  height: 100% !important;
}

/* Text Break for Long Content */
.text-break {
  word-wrap: break-word !important;
  word-break: break-word !important;
}

/* Flex Utilities */
.flex-fill {
  flex: 1 1 auto !important;
}

/* Gap Utilities */
.gap-2 {
  gap: 0.5rem !important;
}

/* Mobile First Approach */
@media (max-width: 480px) {
  .card-responsive .card-body {
    padding: 0.75rem 0.5rem;
  }
  
  .btn-responsive {
    padding: 0.375rem 0.5rem;
    font-size: 0.8rem;
  }
  
  .fs-responsive-xs {
    font-size: 0.7rem;
  }
  
  .container-xxl {
    padding-left: 0.5rem;
    padding-right: 0.5rem;
  }
}