/* =========================================================
   ChapResto Management Auth Pages Fix
   Pages:
   - /login
   - /forgot-password
   - /reset-password
   - /register/restaurant
   Load LAST after all other CSS files.
   ========================================================= */

.mgmt-shell .cr-auth-page {
    width: 100% !important;
    min-height: calc(100vh - var(--cr-header-height, 76px)) !important;
    display: flex !important;
    justify-content: center !important;
    align-items: flex-start !important;
    padding: clamp(32px, 5vw, 72px) 18px 96px !important;
    background: var(--cr-bg, #fbf7f1) !important;
}

.mgmt-shell .cr-auth-card {
    width: min(100%, 520px) !important;
    max-width: 520px !important;
    margin: 0 auto !important;
    padding: clamp(22px, 3vw, 34px) !important;
    border-radius: 28px !important;
    background: #ffffff !important;
    border: 1px solid rgba(35, 31, 32, .08) !important;
    box-shadow: 0 24px 70px rgba(42, 30, 18, .10) !important;
}

.mgmt-shell .cr-auth-brand {
    display: inline-flex !important;
    align-items: center !important;
    gap: 10px !important;
    margin-bottom: 28px !important;
    color: #201b17 !important;
    text-decoration: none !important;
    font-weight: 950 !important;
}

    .mgmt-shell .cr-auth-brand span {
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        display: inline-grid !important;
        place-items: center !important;
        border-radius: 999px !important;
        background: #fff1e7 !important;
        color: #d85b1f !important;
    }

.mgmt-shell .cr-auth-head {
    margin-bottom: 22px !important;
}

    .mgmt-shell .cr-auth-head p {
        margin: 0 0 8px !important;
        color: #d85b1f !important;
        font-size: 12px !important;
        font-weight: 950 !important;
        letter-spacing: .16em !important;
        text-transform: uppercase !important;
    }

    .mgmt-shell .cr-auth-head h1 {
        margin: 0 0 10px !important;
        color: #201b17 !important;
        font-size: clamp(34px, 4.5vw, 52px) !important;
        line-height: 1.03 !important;
        letter-spacing: -.05em !important;
    }

    .mgmt-shell .cr-auth-head span {
        display: block !important;
        color: #766b61 !important;
        font-size: 15px !important;
        line-height: 1.55 !important;
        font-weight: 650 !important;
    }

.mgmt-shell .cr-auth-form {
    width: 100% !important;
    display: grid !important;
    gap: 16px !important;
}

    .mgmt-shell .cr-auth-form label {
        width: 100% !important;
        display: grid !important;
        gap: 7px !important;
        margin: 0 !important;
        color: #201b17 !important;
        font-size: 14px !important;
        font-weight: 900 !important;
    }

        .mgmt-shell .cr-auth-form label span {
            display: block !important;
        }

    .mgmt-shell .cr-auth-form input,
    .mgmt-shell .cr-auth-form .valid,
    .mgmt-shell .cr-auth-form .invalid {
        width: 100% !important;
        min-width: 0 !important;
        min-height: 52px !important;
        padding: 0 15px !important;
        border-radius: 16px !important;
        border: 1px solid #eee3d7 !important;
        background: #ffffff !important;
        color: #201b17 !important;
        font-size: 15px !important;
        font-weight: 750 !important;
        box-shadow: none !important;
        outline: none !important;
    }

        .mgmt-shell .cr-auth-form input:focus {
            border-color: #ef9b5b !important;
            box-shadow: 0 0 0 4px rgba(216, 91, 31, .12) !important;
        }

        .mgmt-shell .cr-auth-form input::placeholder {
            color: #9a9087 !important;
        }

.mgmt-shell .cr-auth-card .cr-btn,
.mgmt-shell .cr-auth-card .cr-btn-full {
    width: 100% !important;
    min-height: 52px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 16px !important;
    font-size: 15px !important;
    font-weight: 950 !important;
    text-align: center !important;
}

.mgmt-shell .cr-auth-card .cr-btn-primary {
    border: 0 !important;
    background: linear-gradient(135deg, #d85b1f, #f07b2e) !important;
    color: #ffffff !important;
    box-shadow: 0 16px 34px rgba(216, 91, 31, .22) !important;
}

    .mgmt-shell .cr-auth-card .cr-btn-primary:disabled {
        opacity: .58 !important;
        box-shadow: none !important;
    }

.mgmt-shell .cr-auth-link {
    display: inline-flex !important;
    justify-content: center !important;
    margin-top: 2px !important;
    color: #a74113 !important;
    font-size: 14px !important;
    font-weight: 850 !important;
    text-decoration: none !important;
}

    .mgmt-shell .cr-auth-link:hover {
        text-decoration: underline !important;
    }

.mgmt-shell .cr-auth-error,
.mgmt-shell .cr-auth-success {
    width: 100% !important;
    padding: 13px 15px !important;
    border-radius: 16px !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.45 !important;
}

.mgmt-shell .cr-auth-error {
    color: #b91c1c !important;
    background: #fff0f0 !important;
    border: 1px solid #ffd7d7 !important;
}

.mgmt-shell .cr-auth-success {
    margin-bottom: 16px !important;
    color: #147a39 !important;
    background: #e9f8ee !important;
    border: 1px solid #c9eed5 !important;
}

/* Desktop: do not let auth pages become full-width */
.mgmt-shell .cr-main > .cr-auth-page,
.mgmt-shell main > .cr-auth-page {
    max-width: none !important;
}

/* Mobile */
@media (max-width: 720px) {
    .mgmt-shell .cr-auth-page {
        min-height: calc(100vh - 64px) !important;
        padding: 26px 14px 96px !important;
    }

    .mgmt-shell .cr-auth-card {
        max-width: 100% !important;
        padding: 22px 18px !important;
        border-radius: 24px !important;
    }

    .mgmt-shell .cr-auth-head h1 {
        font-size: clamp(32px, 10vw, 42px) !important;
    }

    .mgmt-shell .cr-auth-form input,
    .mgmt-shell .cr-auth-card .cr-btn,
    .mgmt-shell .cr-auth-card .cr-btn-full {
        min-height: 50px !important;
    }
}