/* Custom CSS for authentication pages to prevent edge-to-edge layout */

/* Target the main containers */
.fi-simple-layout .fi-simple-main-ctn .fi-simple-main,
[data-filament-page="simple"] .fi-simple-main,
.fi-simple-main {
    max-width: 450px !important;
    margin: 0 auto !important;
    padding-left: 2rem !important;
    padding-right: 2rem !important;
}

/* Target any auth page containers */
.fi-simple-layout,
[data-filament-page="simple"] {
    max-width: 100vw !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
}

/* Also target form elements directly */
.fi-simple-main form,
.fi-simple-main .fi-form,
.fi-simple-page form {
    max-width: 400px !important;
    margin: 0 auto !important;
}

/* Mobile responsive */
@media (max-width: 640px) {
    .fi-simple-layout .fi-simple-main-ctn .fi-simple-main,
    [data-filament-page="simple"] .fi-simple-main,
    .fi-simple-main {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
        max-width: 350px !important;
    }
}

/* Extra specificity for stubborn layouts */
body .fi-simple-layout .fi-simple-main-ctn .fi-simple-main,
body [data-filament-page="simple"] .fi-simple-main,
body .fi-simple-main {
    max-width: 450px !important;
    margin: 0 auto !important;
    padding-left: 2rem !important;
    padding-right: 2rem !important;
}

@media (max-width: 640px) {
    body .fi-simple-layout .fi-simple-main-ctn .fi-simple-main,
    body [data-filament-page="simple"] .fi-simple-main,
    body .fi-simple-main {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
        max-width: 350px !important;
    }
}