/**
 * PARIPURNANANDA SPIRITUAL PLATFORM - ENTERPRISE FLUID LAYOUT SYSTEM
 * Auto-generated responsive layout system converting all containers to true full-width 100% fluid layouts.
 */

:root {
    --portal-max-width: none !important;
}

html,
body {
    width: 100% !important;
    overflow-x: hidden !important;
}

body {
    min-height: 100vh;
}

/* Phase 1 & 2: Global Fluid Layout System */
.portal-fluid,
.page-fluid,
.content-fluid {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    box-sizing: border-box !important;
}

* {
    box-sizing: border-box;
}

main {
    width: 100% !important;
}

section {
    width: 100% !important;
}

/* Override all bootstrap standard container classes to fluid behavior globally */
.container,
.container-sm,
.container-md,
.container-lg,
.container-xl,
.container-xxl,
.container-fluid {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Phase 3 & 5: Fix Page Alignments, Dashboards, Header & Footer Full Width */
.top-ribbon,
.top-bar,
.site-header,
.navigation,
.mega-menu,
.sticky-menu,
.header-container,
.site-header-inner,
.navbar,
.footer,
.copyright-section,
.newsletter-area,
.footer-widgets,
.footer-menus,
footer,
.footer-container,
.bottom-footer,
.detail-layout,
.circles-section,
.section-header,
.scrolling-wrapper-outer,
.rashulu-grid,
.panchangam-box-layout,
.content,
.dashboard-wrapper,
.dash-wrapper,
.dashboard-content,
.dash-content {
    width: 100% !important;
    max-width: 100% !important;
    left: 0 !important;
    right: 0 !important;
}

/* Phase 4: Custom Grid System */
.grid {
    display: grid !important;
    gap: 20px !important;
}

.grid-2 {
    grid-template-columns: repeat(2, 1fr) !important;
}

.grid-3 {
    grid-template-columns: repeat(3, 1fr) !important;
}

.grid-4 {
    grid-template-columns: repeat(4, 1fr) !important;
}

.grid-auto {
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
}

@media (max-width: 992px) {
    .grid-3, .grid-4 {
        grid-template-columns: repeat(2, 1fr) !important;
    }
}

@media (max-width: 576px) {
    .grid-2, .grid-3, .grid-4 {
        grid-template-columns: 1fr !important;
    }
}

/* Phase 6: Responsive Tables */
.table-responsive {
    width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
}

table {
    width: 100% !important;
    min-width: 100% !important;
}

/* Phase 7: Responsive Forms */
form {
    width: 100% !important;
}

input,
select,
textarea,
.form-control,
.form-select {
    width: 100% !important;
}

/* Phase 9: Mobile Responsive Breaks */
@media (max-width: 1200px) {
    .premium-scroll-card {
        flex: 0 0 280px !important;
    }
}

@media (max-width: 992px) {
    .sidebar-right {
        margin-top: 30px !important;
    }
}

@media (max-width: 768px) {
    img {
        max-width: 100% !important;
        height: auto !important;
    }
    
    .video,
    iframe,
    embed {
        max-width: 100% !important;
    }
}

@media (max-width: 576px) {
    .row {
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}