/* Responsive helper utility classes */

/* Container spacing utilities */
.container {
    width: 100%;
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 15px;
    padding-right: 15px;
}

/* Section spacing */
.section-padding {
    padding-top: 80px;
    padding-bottom: 80px;
}

.section-padding-top {
    padding-top: 80px;
}

.section-padding-bottom {
    padding-bottom: 80px;
}

/* Hide/show based on screen size */
.hidden-desktop {
    display: none !important;
}

.hidden-tablet {
    display: block;
}

.hidden-mobile {
    display: block;
}

/* Spacing utilities */
.mb-1 { margin-bottom: 0.25rem !important; }
.mb-2 { margin-bottom: 0.5rem !important; }
.mb-3 { margin-bottom: 1rem !important; }
.mb-4 { margin-bottom: 1.5rem !important; }
.mb-5 { margin-bottom: 3rem !important; }

.mt-1 { margin-top: 0.25rem !important; }
.mt-2 { margin-top: 0.5rem !important; }
.mt-3 { margin-top: 1rem !important; }
.mt-4 { margin-top: 1.5rem !important; }
.mt-5 { margin-top: 3rem !important; }

.mx-auto { 
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Text alignment */
.text-center {
    text-align: center !important;
}

.text-right {
    text-align: right !important;
}

.text-left {
    text-align: left !important;
}

/* Flexbox utilities */
.d-flex {
    display: flex !important;
}

.flex-column {
    flex-direction: column !important;
}

.justify-content-between {
    justify-content: space-between !important;
}

.justify-content-center {
    justify-content: center !important;
}

.align-items-center {
    align-items: center !important;
}

.flex-wrap {
    flex-wrap: wrap !important;
}

/* Width utilities */
.w-100 {
    width: 100% !important;
}

.w-75 {
    width: 75% !important;
}

.w-50 {
    width: 50% !important;
}

.w-25 {
    width: 25% !important;
}

/* Border radius */
.rounded {
    border-radius: 8px !important;
}

.rounded-pill {
    border-radius: 50px !important;
}

.rounded-circle {
    border-radius: 50% !important;
}

/* Shadow utilities */
.shadow-sm {
    box-shadow: 0 .125rem .25rem rgba(0,0,0,.075) !important;
}

.shadow {
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.15) !important;
}

.shadow-lg {
    box-shadow: 0 1rem 3rem rgba(0,0,0,.175) !important;
}

/* Text size */
.text-small {
    font-size: 0.875rem !important;
}

.text-large {
    font-size: 1.25rem !important;
}

/* Responsive Styles - Tablet */
@media (max-width: 991.98px) {
    .hidden-desktop {
        display: block !important;
    }
    
    .hidden-tablet {
        display: none !important;
    }
    
    .section-padding {
        padding-top: 60px;
        padding-bottom: 60px;
    }
    
    .section-padding-top {
        padding-top: 60px;
    }
    
    .section-padding-bottom {
        padding-bottom: 60px;
    }
    
    /* Tablet specific column widths */
    .tablet-w-100 {
        width: 100% !important;
    }
    
    .tablet-w-75 {
        width: 75% !important;
    }
    
    .tablet-w-50 {
        width: 50% !important;
    }
    
    /* Tablet text alignment */
    .tablet-text-center {
        text-align: center !important;
    }
}

/* Responsive Styles - Mobile */
@media (max-width: 767.98px) {
    .hidden-mobile {
        display: none !important;
    }
    
    .section-padding {
        padding-top: 40px;
        padding-bottom: 40px;
    }
    
    .section-padding-top {
        padding-top: 40px;
    }
    
    .section-padding-bottom {
        padding-bottom: 40px;
    }
    
    /* Mobile specific column widths */
    .mobile-w-100 {
        width: 100% !important;
    }
    
    /* Mobile text alignment */
    .mobile-text-center {
        text-align: center !important;
    }
    
    /* Mobile flexbox */
    .mobile-flex-column {
        flex-direction: column !important;
    }
}

/* Responsive Styles - Small Mobile */
@media (max-width: 575.98px) {
    .section-padding {
        padding-top: 30px;
        padding-bottom: 30px;
    }
    
    .section-padding-top {
        padding-top: 30px;
    }
    
    .section-padding-bottom {
        padding-bottom: 30px;
    }
    
    /* Spacing adjustments for small mobile */
    .mb-5 { margin-bottom: 2rem !important; }
    .mt-5 { margin-top: 2rem !important; }
}