.body-login-home {
    margin-top: 50px;
    background-color: #c90230;
    overflow: hidden
}

.bg-login-home {
    background: linear-gradient(#870007,#c90230);
}

.body-login-hhm {
    margin-top: 50px;
    background-color: #3d7eff;
    overflow: hidden
}

.bg-login-hhm {
    background: linear-gradient(#0050ef,#3d7eff);
}

.body-login {
    margin-top: 50px;
    background-color: rgb(27, 161, 226);
    overflow: hidden
}

.bg-login {
    background: linear-gradient(rgb(19, 112, 158), rgb(27, 161, 226));
}

.body-quen-mat-khau {
    margin-top: 50px;
    background-color: #CE352C;
    overflow: hidden
}

.bg-quen-mat-khau {
    background: linear-gradient(#8f251f, #CE352C);
}

.body-ma-xac-nhan {
    margin-top: 50px;
    background-color: #a20025;
    overflow: hidden
}

.bg-ma-xac-nhan {
    background: linear-gradient(#560014,#a20025);
}

.body-bao-tri {
    margin-top: 50px;
    background-color: #607d8b;
    overflow: hidden
}

.bg-bao-tri {
    background: linear-gradient(#41545e,#607d8b);
}

.body-login-style1 {
    margin-top: 50px;
    background-color: #008a00;
    overflow: hidden
}

.bg-login-style1 {
    background: linear-gradient(#003d00, #008a00 );
}

.login-title-big {
    font-size: 25px;
    font-weight: 700;
}

.login-bg {
    background: #1a1b1b url('/uploads/images/login/bg-2.jpg') center center no-repeat;
    background-size: cover;
    min-height: 100vh;
}

.login-logo {
    overflow: hidden;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    border: 2px solid #fff;
}

.body-login-bcorn {background-color: #a0f; /*màu nhạt*/overflow: hidden}
.bg-login-bcorn {background: linear-gradient(#7700b3,#a0f); /*đậm nhạt*/}
.bg-top-bcorn {background-color: #7700b3}/*đậm*/

@media (max-width: 767px) { /*mobile*/
}

/* ===== UI refresh for auth pages ===== */
body[class*="body-login"],
body.body-quen-mat-khau,
body.body-ma-xac-nhan,
body.body-bao-tri {
    margin: 0;
    min-height: 100vh;
    background:
        radial-gradient(1200px 420px at 12% -5%, rgba(45, 212, 191, 0.35), transparent 60%),
        radial-gradient(880px 420px at 100% 0%, rgba(56, 189, 248, 0.24), transparent 58%),
        linear-gradient(160deg, #0f5132 0%, #198754 42%, #22c55e 100%);
    font-family: "Be Vietnam Pro", "Segoe UI", Arial, sans-serif;
}

.bg-login-home,
.bg-login-hhm,
.bg-login,
.bg-quen-mat-khau,
.bg-ma-xac-nhan,
.bg-bao-tri,
.bg-login-style1,
.bg-login-bcorn,
.bg-login-bcorn1 {
    min-height: calc(var(--aha-vh, 1vh) * 100);
    background: transparent !important;
    padding: 26px 14px 34px;
}

.bg-login-home > div:first-child,
.bg-login-hhm > div:first-child,
.bg-login > div:first-child,
.bg-quen-mat-khau > div:first-child,
.bg-ma-xac-nhan > div:first-child,
.bg-bao-tri > div:first-child,
.bg-login-style1 > div:first-child,
.bg-login-bcorn > div:first-child,
.bg-login-bcorn1 > div:first-child {
    text-shadow: 0 8px 20px rgba(4, 26, 19, 0.28);
}

.bg-login-home > div:nth-child(2),
.bg-login-hhm > div:nth-child(2),
.bg-login > div:nth-child(2),
.bg-quen-mat-khau > div:nth-child(2),
.bg-ma-xac-nhan > div:nth-child(2),
.bg-bao-tri > div:nth-child(2),
.bg-login-style1 > div:nth-child(2),
.bg-login-bcorn > div:nth-child(2),
.bg-login-bcorn1 > div:nth-child(2) {
    max-width: 440px !important;
    margin-top: 8px;
    border-radius: 22px;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.24);
    box-shadow: 0 22px 46px rgba(5, 24, 18, 0.24);
    backdrop-filter: blur(10px);
    padding-top: 14px;
    padding-bottom: 16px;
}

.bg-login-home .input input,
.bg-login-hhm .input input,
.bg-login .input input,
.bg-quen-mat-khau .input input,
.bg-ma-xac-nhan .input input,
.bg-bao-tri .input input,
.bg-login-style1 .input input,
.bg-login-bcorn .input input,
.bg-login-bcorn1 .input input {
    border-radius: 12px !important;
    border: 1px solid rgba(11, 40, 29, 0.16) !important;
    min-height: 44px;
    background: rgba(255, 255, 255, 0.96) !important;
}

.bg-login-home .button,
.bg-login-hhm .button,
.bg-login .button,
.bg-quen-mat-khau .button,
.bg-ma-xac-nhan .button,
.bg-bao-tri .button,
.bg-login-style1 .button,
.bg-login-bcorn .button,
.bg-login-bcorn1 .button {
    border-radius: 11px !important;
    font-weight: 700;
}

.bg-login-home .button.dark,
.bg-login-hhm .button.dark,
.bg-login .button.dark,
.bg-login-style1 .button.dark,
.bg-login-bcorn .button.dark,
.bg-login-bcorn1 .button.dark {
    background: linear-gradient(135deg, #0f3f66, #175987);
    border-color: #0f3f66;
}

.bg-login-home .button.success,
.bg-login-hhm .button.success,
.bg-login .button.success,
.bg-quen-mat-khau .button.success,
.bg-ma-xac-nhan .button.success,
.bg-login-style1 .button.success,
.bg-login-bcorn .button.success,
.bg-login-bcorn1 .button.success {
    background: linear-gradient(135deg, #157f49, #1ea35f);
    border-color: #157f49;
}

.bg-login-home .fg-white a,
.bg-login-hhm .fg-white a,
.bg-login .fg-white a,
.bg-login-style1 .fg-white a,
.bg-login-bcorn .fg-white a,
.bg-login-bcorn1 .fg-white a {
    color: #f0fff5 !important;
    text-underline-offset: 2px;
}

.login-logo {
    border-color: rgba(255, 255, 255, 0.9);
    box-shadow: 0 10px 28px rgba(9, 22, 17, 0.32);
}

/* ===== Admin login form (stable layout, no Metro/input plugin conflicts) ===== */
body.admin-login-page .bg-login-bcorn1 {
    display: flex;
    flex-direction: column;
    align-items: center;
}

body.admin-login-page .admin-login-shell {
    margin: 0 auto;
    width: min(92vw, 460px);
    max-width: 460px !important;
    z-index: 0;
}

body.admin-login-page .admin-login-shell > div,
body.admin-login-page .admin-login-form-wrap {
    width: 100%;
}

body.admin-login-page .admin-login-input-group {
    display: flex;
    align-items: center;
    width: 100%;
    min-height: 56px;
    border-radius: 16px;
    border: 1px solid rgba(16, 42, 67, 0.2);
    background: rgba(255, 255, 255, 0.97);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65);
    overflow: hidden;
}

body.admin-login-page .admin-login-input-group:focus-within {
    border-color: #58b07f;
    box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.14);
}

body.admin-login-page .admin-login-input-icon {
    width: 56px;
    min-height: 56px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    color: #3f5970;
    background: #edf4f1;
    border-right: 1px solid #d9e6df;
    flex: 0 0 56px;
}

/* Neutralize any Metro runtime wrapper that may be injected around inputs */
body.admin-login-page .admin-login-input-group .input {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
}

body.admin-login-page .admin-login-input-group .input .button-group,
body.admin-login-page .admin-login-input-group .input .prepend,
body.admin-login-page .admin-login-input-group .input .append,
body.admin-login-page .admin-login-input-group .input .input-clear-button,
body.admin-login-page .admin-login-input-group .input .input-reveal-button {
    display: none !important;
}

body.admin-login-page .admin-login-input {
    flex: 1;
    width: 100%;
    min-height: 56px;
    margin: 0 !important;
    padding: 0 16px !important;
    border: 0 !important;
    border-radius: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    color: #1f3246;
    font-size: 17px;
    -webkit-appearance: none;
    appearance: none;
}

body.admin-login-page .admin-login-input::placeholder {
    color: #6a7d90;
}

body.admin-login-page .admin-login-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

body.admin-login-page .admin-login-forgot a {
    color: #effff6 !important;
    font-weight: 600;
    text-decoration: none;
}

body.admin-login-page .admin-login-forgot a:hover {
    color: #ffffff !important;
    text-decoration: underline;
}

body.admin-login-page .admin-login-submit-wrap {
    margin-left: auto;
}

body.admin-login-page .admin-login-submit {
    min-height: 52px;
    min-width: 186px;
    padding: 0 26px !important;
    border-radius: 14px !important;
    letter-spacing: 0.2px;
}

body.admin-login-page.admin-login-gianhang {
    background:
        radial-gradient(1200px 420px at 12% -5%, rgba(248, 113, 113, 0.28), transparent 60%),
        radial-gradient(880px 420px at 100% 0%, rgba(239, 68, 68, 0.22), transparent 58%),
        linear-gradient(160deg, #7f1d1d 0%, #b91c1c 45%, #ef4444 100%);
}

@media (max-width: 767px) {
    .bg-login-home,
    .bg-login-hhm,
    .bg-login,
    .bg-quen-mat-khau,
    .bg-ma-xac-nhan,
    .bg-bao-tri,
    .bg-login-style1,
    .bg-login-bcorn,
    .bg-login-bcorn1 {
        padding-top: 18px;
    }

    .bg-login-home > div:nth-child(2),
    .bg-login-hhm > div:nth-child(2),
    .bg-login > div:nth-child(2),
    .bg-quen-mat-khau > div:nth-child(2),
    .bg-ma-xac-nhan > div:nth-child(2),
    .bg-bao-tri > div:nth-child(2),
    .bg-login-style1 > div:nth-child(2),
    .bg-login-bcorn > div:nth-child(2),
    .bg-login-bcorn1 > div:nth-child(2) {
        max-width: 100% !important;
        border-radius: 16px;
        padding-top: 8px;
    }

    body.admin-login-page .admin-login-shell {
        max-width: 100%;
    }

    body.admin-login-page .admin-login-actions {
        flex-direction: column;
        align-items: stretch;
    }

    body.admin-login-page .admin-login-submit-wrap {
        width: 100%;
    }

    body.admin-login-page .admin-login-submit {
        width: 100%;
    }
}