/*
 * Vectron Global - login / register / password pages (admin + partner)
 * Small overrides on top of Metronic 7 (style.bundle.css).
 */

body.vga-auth {
    background-color: #f3f6f9;
    min-height: 100vh;
}

/* brand blue taken from the logo */
.vga-auth .btn.btn-primary {
    background-color: #1b4fc4;
    border-color: #1b4fc4;
}
.vga-auth .btn.btn-primary:hover,
.vga-auth .btn.btn-primary:focus,
.vga-auth .btn.btn-primary:not(:disabled):not(.disabled):active {
    background-color: #163f9e;
    border-color: #163f9e;
}
.vga-auth a.text-primary,
.vga-auth .text-primary { color: #1b4fc4 !important; }
.vga-auth a.text-hover-primary:hover { color: #1b4fc4 !important; }

/* ---------------------------------------------------------- Page wrappers */

.vga-page {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}
.vga-page-body {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 15px;
}

/* partner top bar */
.vga-topbar {
    background: #fff;
    border-bottom: 1px solid #ebedf3;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 30px;
}
.vga-topbar img { height: 40px; }
.vga-topbar .vga-topbar-title {
    border-left: 1px solid #e4e6ef;
    margin-left: 15px;
    padding-left: 15px;
    font-weight: 600;
    color: #3f4254;
}

.vga-footer {
    padding: 12px 30px;
    font-size: 12px;
    color: #b5b5c3;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}
.vga-footer a { color: #b5b5c3; }
.vga-footer a:hover { color: #1b4fc4; }

/* ---------------------------------------------------------- Card */

.vga-box {
    width: 100%;
    max-width: 450px;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 0 30px 0 rgba(82, 63, 105, .06);
    padding: 35px 40px;
}
.vga-box.vga-box-lg { max-width: 1000px; padding: 26px 35px; }

.vga-section-title {
    font-size: 13px;
    font-weight: 600;
    color: #1b4fc4;
    text-transform: uppercase;
    letter-spacing: .5px;
    border-bottom: 1px solid #ebedf3;
    padding-bottom: 6px;
    margin-bottom: 14px;
}

/* ---------------------------------------------------------- Form */

.vga-auth .form-group { margin-bottom: 18px; }
.vga-box-lg .form-group { margin-bottom: 14px; }
.vga-auth .form-group label {
    font-size: 13px;
    font-weight: 500;
    color: #3f4254;
    margin-bottom: 5px;
}
.vga-auth .form-control.form-control-solid {
    height: 44px;
    font-size: 13px;
}
.vga-auth select.form-control.form-control-solid { padding-top: 0; padding-bottom: 0; }
.vga-box-lg .form-control.form-control-solid { height: 40px; }
.vga-auth .form-control.is-invalid { border-color: #f64e60 !important; }
.vga-auth .invalid-feedback { display: block; font-size: 12px; }
.vga-uppercase { text-transform: uppercase; }
.vga-uppercase::placeholder { text-transform: none; }

/* show / hide password */
.vga-pass { position: relative; }
.vga-pass .form-control { padding-right: 42px; }
.vga-pass .vga-pass-toggle {
    position: absolute;
    right: 4px;
    top: 50%;
    transform: translateY(-50%);
    border: 0;
    background: transparent;
    color: #b5b5c3;
    width: 34px;
    height: 34px;
    cursor: pointer;
}
.vga-pass .vga-pass-toggle:hover,
.vga-pass .vga-pass-toggle:focus { color: #1b4fc4; outline: 0; }

/* ---------------------------------------------------------- Admin login background */

body.vga-auth-admin {
    background: linear-gradient(rgba(17, 45, 105, .55), rgba(17, 45, 105, .55)),
        url('../../../media/bg/admin-login-bg.jpg') center center / cover no-repeat fixed;
}
.vga-auth-admin .vga-box { box-shadow: 0 10px 40px rgba(0, 0, 0, .25); }
.vga-auth-admin .vga-footer,
.vga-auth-admin .vga-footer a { color: rgba(255, 255, 255, .85); }
.vga-auth-admin .vga-footer a:hover { color: #fff; }

/* ---------------------------------------------------------- Partner login / register background */

body.vga-auth-partner {
    background: linear-gradient(rgba(17, 45, 105, .50), rgba(17, 45, 105, .50)),
        url('../../../media/bg/partner-login-bg.jpg') center center / cover no-repeat fixed;
}
.vga-auth-partner .vga-box { box-shadow: 0 10px 40px rgba(0, 0, 0, .25); }
.vga-auth-partner .vga-footer,
.vga-auth-partner .vga-footer a { color: rgba(255, 255, 255, .85); }
.vga-auth-partner .vga-footer a:hover { color: #fff; }

/* ---------------------------------------------------------- Short laptop screens (keep registration on one screen) */

@media (min-width: 992px) and (max-height: 720px) {
    .vga-topbar { height: 54px; }
    .vga-topbar img { height: 34px; }
    .vga-page-body { padding: 10px 15px; }
    .vga-box.vga-box-lg { padding: 18px 30px; }
    .vga-box-lg > .mb-6 { margin-bottom: 12px !important; }
    .vga-box-lg .form-group { margin-bottom: 10px; }
    .vga-box-lg .vga-section-title { margin-bottom: 10px; }
    .vga-box-lg .border-top.pt-5 { padding-top: 12px !important; }
    .vga-footer { padding: 8px 30px; }
}

/* ---------------------------------------------------------- Responsive */

@media (max-width: 767.98px) {
    .vga-topbar { padding: 0 15px; }
    .vga-topbar .vga-topbar-title { display: none; }
    .vga-box, .vga-box.vga-box-lg { padding: 25px 20px; }
    .vga-footer { justify-content: center; text-align: center; padding: 12px 15px; }
}
