/* ATLCOC global overflow / right-margin fix */

/* Prevent any element from extending the document width */
html,
body{
    width:100%;
    max-width:100%;
    margin:0;
    padding:0;
    overflow-x:hidden;
    box-sizing:border-box;
}

*,
*::before,
*::after{
    box-sizing:border-box;
}

/* Keep common site wrappers inside the viewport */
.container,
.atl-container,
.church-page,
.church-page-shell,
.submit-business-shell,
.update-shell,
.admin-main,
main,
section,
header,
footer,
nav{
    max-width:100%;
}

/* Images and media must never force horizontal overflow */
img,
svg,
video,
iframe{
    max-width:100%;
    height:auto;
}

/* Forms should not overflow due to padding + width */
input,
select,
textarea,
button{
    max-width:100%;
}

/* Long URLs, names, and labels should wrap instead of widening cards */
a,
p,
span,
strong,
td,
th,
dd{
    overflow-wrap:anywhere;
    word-break:normal;
}

/* Grid/flex children need min-width:0 or they can push the page wider */
.atl-header-inner > *,
.atl-main-nav > *,
.two-col > *,
.detail-grid > *,
.secondary-grid > *,
.split-section > *,
.bottom-grid > *,
.home-grid > *,
.business-grid > *,
.church-directory-grid > *,
.minister-grid > *,
.event-grid > *,
.form-grid > *,
.grid > *,
.grid3 > *{
    min-width:0;
}

/* Tables remain scrollable inside their own container instead of widening body */
.table-wrap{
    max-width:100%;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
}

/* Public header/mobile menu must stay within the viewport */
#atlPublicHeader,
#atlPublicHeader .atl-header-inner{
    max-width:100% !important;
}

@media(max-width:900px){
    #atlMainNav{
        width:100% !important;
        max-width:100% !important;
        left:0 !important;
        right:0 !important;
        box-sizing:border-box !important;
    }
}

/* Mobile gutters: never use viewport width + padding together */
@media(max-width:600px){
    .container,
    .atl-container,
    .church-page,
    .church-page-shell{
        width:100% !important;
        max-width:100% !important;
        padding-left:20px !important;
        padding-right:20px !important;
        margin-left:auto !important;
        margin-right:auto !important;
        box-sizing:border-box !important;
    }

    /* Full-bleed banner stays full width without creating overflow */
    .hero,
    .atl-home-banner,
    .atl-banner{
        width:100% !important;
        max-width:100% !important;
        padding-left:0 !important;
        padding-right:0 !important;
        margin-left:0 !important;
        margin-right:0 !important;
    }

    .hero img,
    .atl-home-banner img,
    .atl-banner img{
        width:100% !important;
        max-width:100% !important;
        display:block;
    }

    /* Action/button grids should not exceed available width */
    .actions,
    .profile-actions,
    .business-actions,
    .finder-actions,
    .home-involved-actions{
        width:100%;
        max-width:100%;
    }

    .button,
    .outline-button,
    .outline,
    .danger{
        max-width:100%;
        box-sizing:border-box;
    }
}
