/* Bootstrap Loop Builder Styles */

/* Auto-fit grid functionality for Bootstrap */
.auto-fit-grid {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
}

/* Custom hover effects for Bootstrap compatibility */
.c-loop-builder-item {
    transition: all 0.3s ease-in-out;
}

.hover-scale:hover {
    transform: scale(1.05);
}

.hover-shadow:hover {
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
}

/* Ensure proper spacing in Bootstrap grid */
.c-loop-builder-grid .col {
    margin-bottom: 1rem;
}

/* Remove default Bootstrap column padding when using gap classes */
.row.g-0 > .col,
.row.g-1 > .col,
.row.g-2 > .col,
.row.g-3 > .col,
.row.g-4 > .col,
.row.g-5 > .col {
    padding-left: 0;
    padding-right: 0;
}

/* Responsive adjustments */
@media (max-width: 575.98px) {
    .auto-fit-grid {
        grid-template-columns: 1fr;
    }
}

@media (min-width: 576px) and (max-width: 767.98px) {
    .auto-fit-grid {
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    }
}