.fi-simple-layout {
    background-image: url('/images/login/backgrounds/1.jpg');;
    background-position: 50%;
    background-repeat: no-repeat;
    background-size: cover;
    position: relative;
    z-index:0
}

.fi-simple-layout:before {
    background: linear-gradient(0deg, rgba(0, 0, 0, .6), transparent 25%) no-repeat;
    background-size: cover;
    content: var(--filament-backgrounds-attribution-backdrop);
    height: 100%;
    left: 0;
    position: fixed;
    top: 0;
    width:100%
}

.fi-simple-layout:after {
    bottom: 2rem;
    color: #fff;
    content: var(--filament-backgrounds-attribution);
    left: 2rem;
    position: absolute;
    text-shadow:0 0 3px #000
}

.fi-simple-main {
    --tw-ring-color: transparent;
    background-color: hsla(0, 0%, 100%, .8);
    position:relative
}

@supports (color: color-mix(in lab, red, red)) {
    .fi-simple-main {
        background-color:color-mix(in oklab, var(--color-white) 80%, transparent)
    }
}

.fi-simple-main:where(.dark, .dark *) {
    background-color:rgba(24, 24, 27, .9)
}

@supports (color: color-mix(in lab, red, red)) {
    .fi-simple-main:where(.dark, .dark *) {
        background-color:color-mix(in oklab, var(--gray-900) 90%, transparent)
    }
}

.fi-simple-main:before {
    backdrop-filter: blur(3px);
    border-radius: inherit;
    content: "";
    inset: 0;
    position: absolute;
    z-index: -1
}