/* Immersive auth layout: one continuous garden scene with a full-height form rail. */
html.fi body.s33-guest-body,
html.fi body.s33-guest-body .fi-simple-layout,
html.fi body.s33-guest-body .fi-simple-main-ctn,
html.fi body.s33-guest-body .fi-simple-main,
html.fi body.s33-guest-body .fi-simple-main > div[wire\:id] {
    width: 100% !important;
    max-width: none !important;
    min-height: 100svh !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    background: transparent !important;
    box-shadow: none !important;
}

html.fi body.s33-guest-body {
    color: var(--garden-ink) !important;
    background: #edf3dc !important;
}

html.fi body.s33-guest-body .fi-simple-main::before,
html.fi body.s33-guest-body .fi-simple-main::after {
    display: none !important;
}

html.fi body.s33-guest-body .s33-guest-shell {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    min-height: 100svh !important;
    padding: 0 !important;
    overflow: hidden !important;
    background:
        linear-gradient(90deg, rgba(255, 253, 244, .08) 0%, rgba(255, 253, 244, .02) 48%, rgba(255, 253, 244, .7) 77%, rgba(255, 253, 244, .96) 100%),
        url('/images/wdhysj/gardenbg2.png') center / cover no-repeat fixed !important;
}

html.fi body.s33-guest-body .s33-guest-shell::before {
    display: none !important;
}

html.fi body.s33-guest-body .s33-login-layout,
html.fi body.s33-guest-body .s33-login-layout--single {
    position: relative !important;
    z-index: 1 !important;
    display: grid !important;
    width: 100% !important;
    min-height: 100svh !important;
    grid-template-columns: minmax(0, 1fr) minmax(480px, clamp(480px, 32vw, 620px)) !important;
    align-items: stretch !important;
    gap: 0 !important;
    margin: 0 !important;
}

html.fi body.s33-guest-body .zxr-login-scene {
    position: relative !important;
    min-width: 0 !important;
    min-height: 100svh !important;
    overflow: hidden !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

html.fi body.s33-guest-body .zxr-login-scene::before {
    display: none !important;
}

html.fi body.s33-guest-body .zxr-login-scene__logo {
    position: absolute !important;
    z-index: 4 !important;
    top: 42px !important;
    left: 54px !important;
    width: 230px !important;
    height: auto !important;
    object-fit: contain !important;
    filter: drop-shadow(0 9px 14px rgba(74, 70, 33, .24)) !important;
}

html.fi body.s33-guest-body .zxr-login-scene__hero {
    position: absolute !important;
    z-index: 2 !important;
    right: 3% !important;
    bottom: -2% !important;
    display: block !important;
    width: min(34vw, 470px) !important;
    height: min(72vh, 720px) !important;
    background-image: var(--garden-login-art) !important;
    background-repeat: no-repeat !important;
    background-position: right bottom !important;
    background-size: contain !important;
    filter: drop-shadow(0 22px 24px rgba(67, 75, 37, .2)) !important;
}

html.fi body.s33-guest-body .s33-guest-shell--agent .zxr-login-scene__hero {
    right: 1% !important;
    width: min(43vw, 640px) !important;
    height: min(68vh, 650px) !important;
}

html.fi body.s33-guest-body .zxr-login-scene__copy {
    position: absolute !important;
    z-index: 5 !important;
    bottom: 50px !important;
    left: 54px !important;
    display: grid !important;
    gap: 5px !important;
    max-width: 430px !important;
    padding: 0 0 0 17px !important;
    border: 0 !important;
    border-left: 4px solid var(--garden-coral) !important;
    color: var(--garden-ink) !important;
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none !important;
}

html.fi body.s33-guest-body .zxr-login-scene__copy span {
    color: var(--garden-coral) !important;
    font-size: 12px !important;
    font-weight: 800 !important;
}

html.fi body.s33-guest-body .zxr-login-scene__copy strong {
    color: var(--garden-ink) !important;
    font-family: "Noto Serif SC", "Songti SC", var(--garden-font) !important;
    font-size: 34px !important;
    line-height: 1.18 !important;
    text-shadow: 0 2px 12px rgba(255, 253, 244, .86) !important;
}

html.fi body.s33-guest-body .zxr-login-scene__copy small {
    color: #5f673d !important;
    font-size: 13px !important;
    line-height: 1.65 !important;
    text-shadow: 0 1px 8px rgba(255, 253, 244, .9) !important;
}

html.fi body.s33-guest-body .zxr-login-scene__seal,
html.fi body.s33-guest-body .zxr-auth-motion {
    display: none !important;
}

html.fi body.s33-guest-body .s33-login-card {
    position: relative !important;
    display: flex !important;
    width: 100% !important;
    min-height: 100svh !important;
    align-self: stretch !important;
    flex-direction: column !important;
    justify-content: center !important;
    padding: 54px clamp(42px, 4vw, 68px) !important;
    overflow-y: auto !important;
    border: 0 !important;
    border-left: 1px solid rgba(108, 120, 48, .24) !important;
    border-radius: 0 !important;
    color: var(--garden-ink) !important;
    background:
        linear-gradient(rgba(255, 253, 244, .94), rgba(255, 253, 244, .94)),
        url('/images/wdhysj/features-background.png') center / cover !important;
    box-shadow: -22px 0 58px rgba(52, 70, 35, .18) !important;
    backdrop-filter: blur(18px) !important;
    animation: none !important;
}

html.fi body.s33-guest-body .s33-login-card::before,
html.fi body.s33-guest-body .s33-login-card::after {
    display: none !important;
}

html.fi body.s33-guest-body .s33-login-card > :not(script) {
    width: 100% !important;
    max-width: 410px !important;
    margin-right: auto !important;
    margin-left: auto !important;
}

html.fi body.s33-guest-body .s33-login-card__head {
    display: block !important;
    margin-bottom: 30px !important;
}

html.fi body.s33-guest-body .s33-login-logo-frame {
    display: none !important;
}

html.fi body.s33-guest-body .s33-login-title-block {
    display: grid !important;
    gap: 8px !important;
}

html.fi body.s33-guest-body .s33-login-kicker {
    color: var(--garden-coral) !important;
    font-size: 11px !important;
    font-weight: 800 !important;
}

html.fi body.s33-guest-body .s33-login-title-block h2,
html.fi body.s33-guest-body .s33-login-card h2 {
    margin: 0 !important;
    color: var(--garden-ink) !important;
    font-family: "Noto Serif SC", "Songti SC", var(--garden-font) !important;
    font-size: 34px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
}

html.fi body.s33-guest-body .s33-login-card form#form,
html.fi body.s33-guest-body .s33-login-card .fi-sc-form,
html.fi body.s33-guest-body .s33-login-card .fi-form {
    display: grid !important;
    gap: 17px !important;
}

html.fi body.s33-guest-body .s33-login-card :where(label, .fi-fo-field-label, .fi-fo-field-label-content) {
    color: #4f5930 !important;
    font-size: 13px !important;
    font-weight: 750 !important;
}

html.fi body.s33-guest-body .s33-login-card :where(.fi-input-wrp, .fi-select-input) {
    min-height: 50px !important;
    border: 1px solid rgba(108, 120, 48, .28) !important;
    border-radius: 6px !important;
    color: var(--garden-ink) !important;
    background: rgba(255, 255, 252, .92) !important;
    box-shadow: 0 5px 16px rgba(77, 83, 38, .05) !important;
}

html.fi body.s33-guest-body .s33-login-card :where(.fi-input-wrp, .fi-select-input):focus-within {
    border-color: var(--garden-olive) !important;
    box-shadow: 0 0 0 3px rgba(108, 120, 48, .12) !important;
}

html.fi body.s33-guest-body .s33-login-card :where(input:not([type='checkbox']):not([type='radio']):not([type='hidden']), select) {
    min-height: 48px !important;
    color: var(--garden-ink) !important;
    caret-color: var(--garden-olive) !important;
    background: transparent !important;
    -webkit-text-fill-color: var(--garden-ink) !important;
}

html.fi body.s33-guest-body .s33-login-card input::placeholder {
    color: #89906b !important;
    -webkit-text-fill-color: #89906b !important;
}

html.fi body.s33-guest-body .s33-login-card .fi-icon-btn {
    color: #77804d !important;
}

html.fi body.s33-guest-body button.s33-captcha-code span {
    min-height: 50px !important;
    border: 1px solid rgba(229, 179, 79, .36) !important;
    border-radius: 6px !important;
    color: #b67822 !important;
    background: rgba(255, 248, 222, .9) !important;
    box-shadow: none !important;
}

html.fi body.s33-guest-body .s33-login-card input[type='checkbox'] {
    accent-color: var(--garden-olive) !important;
}

html.fi body.s33-guest-body .s33-login-card :where(button[type='submit'], .fi-btn-color-primary, .s33-login-button) {
    min-height: 50px !important;
    border: 0 !important;
    border-radius: 6px !important;
    color: #fffdf4 !important;
    background: var(--garden-olive) !important;
    box-shadow: 0 12px 24px rgba(88, 103, 39, .2) !important;
}

html.fi body.s33-guest-body .s33-login-card :where(button[type='submit'], .fi-btn-color-primary, .s33-login-button):hover {
    background: var(--garden-leaf-dark) !important;
}

html.fi body.s33-guest-body .s33-login-footer,
html.fi body.s33-guest-body .s33-login-footer--single {
    display: flex !important;
    justify-content: space-between !important;
    margin-top: 24px !important;
    padding-top: 18px !important;
    border-top: 1px solid rgba(108, 120, 48, .16) !important;
    color: #7b8259 !important;
    font-size: 11px !important;
}

html.fi body.s33-guest-body .s33-login-footer--single {
    justify-content: flex-end !important;
}

html.fi body.s33-guest-body .s33-login-footer a {
    color: var(--garden-olive) !important;
}

@media (max-width: 900px) {
    html.fi body.s33-guest-body .s33-guest-shell {
        overflow: visible !important;
        background:
            linear-gradient(180deg, rgba(255, 253, 244, .02) 0%, rgba(255, 253, 244, .08) 48%, #fffdf4 100%),
            url('/images/wdhysj/client/login-mobile-bg.png') center top / 100% auto no-repeat !important;
    }

    html.fi body.s33-guest-body .s33-login-layout,
    html.fi body.s33-guest-body .s33-login-layout--single {
        display: block !important;
        min-height: 100svh !important;
    }

    html.fi body.s33-guest-body .zxr-login-scene {
        min-height: 290px !important;
        height: 290px !important;
        border: 0 !important;
    }

    html.fi body.s33-guest-body .zxr-login-scene__logo {
        top: 20px !important;
        left: 22px !important;
        width: 176px !important;
    }

    html.fi body.s33-guest-body .zxr-login-scene__hero {
        display: none !important;
    }

    html.fi body.s33-guest-body .zxr-login-scene__copy {
        bottom: 24px !important;
        left: 22px !important;
        max-width: calc(100% - 44px) !important;
        padding-left: 13px !important;
    }

    html.fi body.s33-guest-body .zxr-login-scene__copy strong {
        font-size: 28px !important;
    }

    html.fi body.s33-guest-body .zxr-login-scene__copy small {
        color: #4f5930 !important;
    }

    html.fi body.s33-guest-body .s33-login-card {
        width: 100% !important;
        min-height: calc(100svh - 290px) !important;
        justify-content: flex-start !important;
        padding: 34px 24px 38px !important;
        overflow: visible !important;
        border: 0 !important;
        border-top: 1px solid rgba(108, 120, 48, .2) !important;
        border-radius: 0 !important;
        background: #fffdf4 !important;
        box-shadow: 0 -16px 36px rgba(68, 79, 36, .1) !important;
        backdrop-filter: none !important;
    }

    html.fi body.s33-guest-body .s33-login-card__head {
        margin-bottom: 26px !important;
    }

    html.fi body.s33-guest-body .s33-login-title-block h2,
    html.fi body.s33-guest-body .s33-login-card h2 {
        font-size: 29px !important;
    }
}

@media (max-width: 560px) {
    html.fi body.s33-guest-body .zxr-login-scene {
        min-height: 250px !important;
        height: 250px !important;
    }

    html.fi body.s33-guest-body .s33-login-card {
        min-height: calc(100svh - 250px) !important;
        padding: 30px 20px 34px !important;
    }

    html.fi body.s33-guest-body .zxr-login-scene__logo {
        width: 154px !important;
    }

    html.fi body.s33-guest-body .zxr-login-scene__copy {
        bottom: 18px !important;
    }

    html.fi body.s33-guest-body .zxr-login-scene__copy span,
    html.fi body.s33-guest-body .zxr-login-scene__copy small {
        font-size: 11px !important;
    }

    html.fi body.s33-guest-body .zxr-login-scene__copy strong {
        font-size: 24px !important;
    }
}

@media (min-width: 901px) and (max-height: 760px) {
    html.fi body.s33-guest-body .s33-login-card {
        justify-content: flex-start !important;
        padding-top: 28px !important;
        padding-bottom: 28px !important;
    }

    html.fi body.s33-guest-body .s33-login-card__head {
        margin-bottom: 22px !important;
    }

    html.fi body.s33-guest-body .zxr-login-scene__logo {
        top: 24px !important;
        width: 190px !important;
    }

    html.fi body.s33-guest-body .zxr-login-scene__copy {
        bottom: 28px !important;
    }
}

/* Filament adds a higher-specificity dark guest background; keep the garden scene visible. */
html.fi.dark body.fi-body.s33-guest-body,
html.fi.dark body.fi-body.s33-guest-body .fi-simple-layout,
html.fi.dark body.fi-body.s33-guest-body .fi-simple-main-ctn,
html.fi.dark body.fi-body.s33-guest-body .fi-simple-main {
    background: transparent !important;
}

html.fi.dark body.fi-body.s33-guest-body .s33-guest-shell {
    background-color: #edf3dc !important;
    background-image:
        linear-gradient(90deg, rgba(255, 253, 244, .08) 0%, rgba(255, 253, 244, .02) 48%, rgba(255, 253, 244, .7) 77%, rgba(255, 253, 244, .96) 100%),
        url('/images/wdhysj/gardenbg2.png') !important;
    background-position: center, center !important;
    background-size: cover, cover !important;
    background-repeat: no-repeat, no-repeat !important;
    background-attachment: fixed, fixed !important;
}

@media (max-width: 900px) {
    html.fi.dark body.fi-body.s33-guest-body .s33-guest-shell {
        background-color: #fffdf4 !important;
        background-image:
            linear-gradient(180deg, rgba(255, 253, 244, .02) 0%, rgba(255, 253, 244, .08) 48%, #fffdf4 100%),
            url('/images/wdhysj/client/login-mobile-bg.png') !important;
        background-position: center top, center top !important;
        background-size: 100% auto, 100% auto !important;
        background-repeat: no-repeat, no-repeat !important;
        background-attachment: scroll, scroll !important;
    }
}
