body.customer-door {
    position: relative;
    min-height: 100vh;
    background:
        linear-gradient(140deg, rgba(12, 24, 17, 0.58), rgba(18, 46, 28, 0.4)),
        var(--customer-door-bg-image, url("../../../bgimage.jpg")) center center / cover no-repeat fixed;
}

body.customer-door::before {
    content: "";
    position: fixed;
    inset: 0;
    background:
        radial-gradient(circle at 18% 20%, rgba(244, 228, 182, 0.16), transparent 28%),
        linear-gradient(180deg, rgba(10, 22, 16, 0.08), rgba(10, 22, 16, 0.18));
    pointer-events: none;
    z-index: 0;
}

body.customer-door .page {
    position: relative;
    z-index: 1;
    width: min(560px, 92vw);
    margin: 0 auto;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 0;
}

body.customer-door .auth-shell {
    width: 100%;
    grid-template-columns: 1fr !important;
    gap: 0 !important;
}

body.customer-door .auth-intro,
body.customer-door .brand,
body.customer-door .social-auth,
body.customer-door .divider,
body.customer-door .auth-tag,
body.customer-door .auth-copy,
body.customer-door .auth-points,
body.customer-door .auth-contact,
body.customer-door .auth-shop-link,
body.customer-door .role-badges,
body.customer-door .subtitle {
    display: none !important;
}

body.customer-door .auth-card,
body.customer-door .card,
body.customer-door .signup-card,
body.customer-door .login-card,
body.customer-door .reset-box,
body.customer-door .forgot-box {
    width: 100%;
    max-width: 560px;
    margin: 0 auto;
    background: rgba(8, 19, 13, 0.26) !important;
    border: 1px solid rgba(255, 255, 255, 0.28) !important;
    box-shadow: 0 24px 54px rgba(7, 16, 12, 0.34);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

body.customer-door .signup-header,
body.customer-door .login-header,
body.customer-door .reset-header,
body.customer-door .forgot-header {
    background: transparent !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
}

body.customer-door .signup-header h3,
body.customer-door .login-header h1,
body.customer-door .reset-header h3,
body.customer-door .forgot-header h3,
body.customer-door .card h2,
body.customer-door .card h3,
body.customer-door .card h4,
body.customer-door .card p,
body.customer-door .card label,
body.customer-door .card .text-muted,
body.customer-door .card small,
body.customer-door .card strong,
body.customer-door .login-links a,
body.customer-door .btn-ghost,
body.customer-door a,
body.customer-door .alert,
body.customer-door .steps,
body.customer-door .step {
    color: #ffffff !important;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.45);
}

body.customer-door .form-control,
body.customer-door input[type="text"],
body.customer-door input[type="email"],
body.customer-door input[type="password"],
body.customer-door input[type="tel"],
body.customer-door select,
body.customer-door textarea {
    background: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(255, 255, 255, 0.42) !important;
    color: #ffffff !important;
    box-shadow: none !important;
}

body.customer-door .form-control::placeholder,
body.customer-door input::placeholder,
body.customer-door textarea::placeholder {
    color: rgba(255, 255, 255, 0.82) !important;
}

body.customer-door .form-control:focus,
body.customer-door input:focus,
body.customer-door select:focus,
body.customer-door textarea:focus {
    border-color: rgba(255, 255, 255, 0.72) !important;
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.12) !important;
}

body.customer-door .btn-primary,
body.customer-door .btn-success,
body.customer-door .btn-login,
body.customer-door .btn-signup {
    box-shadow: 0 16px 28px rgba(5, 14, 10, 0.34);
}

body.customer-door .btn-ghost,
body.customer-door .btn-outline-secondary,
body.customer-door .btn-outline-danger,
body.customer-door .login-links a {
    background: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(255, 255, 255, 0.28) !important;
}

body.customer-door .alert-danger,
body.customer-door .alert-error {
    background: rgba(143, 36, 23, 0.42) !important;
    border-color: rgba(255, 170, 160, 0.32) !important;
}

body.customer-door .alert-success {
    background: rgba(26, 94, 52, 0.42) !important;
    border-color: rgba(188, 255, 213, 0.28) !important;
}

body.customer-door .alert-info {
    background: rgba(22, 86, 109, 0.38) !important;
    border-color: rgba(179, 234, 255, 0.26) !important;
}

body.customer-door .alert-warning {
    background: rgba(126, 88, 25, 0.42) !important;
    border-color: rgba(255, 224, 164, 0.26) !important;
}

body.customer-door .steps {
    padding-top: 0;
}

body.customer-door .step {
    background: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(255, 255, 255, 0.18);
}

body.customer-door .step.active {
    background: rgba(57, 146, 83, 0.72) !important;
}

body.customer-door .step.done {
    background: rgba(255, 255, 255, 0.18) !important;
}

body.customer-door .toggle-pw,
body.customer-door .toggle-password,
body.customer-door .show-password,
body.customer-door .input-group > .btn {
    color: #ffffff !important;
}

@media (max-width: 900px) {
    body.customer-door {
        background-attachment: scroll;
    }
}

/* March 2026 no-blur customer override */
body.customer-door .auth-card,
body.customer-door .card,
body.customer-door .signup-card,
body.customer-door .login-card,
body.customer-door .reset-box,
body.customer-door .forgot-box {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}