/* ============================================================
   UA Instructor — Password Panel Overrides
   ============================================================ */

.uaPwdPanel .ua-login-password-group {
    padding-top: 6%;
    padding-bottom: 6%;
}

.uaPwdPanel #uaUserLoginForm {
    padding-top: 8%;
}

.uaPwdPanel input[type=submit] {
    width: 24.4rem;
    margin-left: 0.2rem;
}

.uaPwdPanel .ua-header {
    margin: 4rem 0 0.5rem 0;
}

/* Zero-value percentages can be expressed as 0 */
.uaPwdPanel #ua-reset-username,
.uaPwdPanel .ua-reset-options {
    margin-top: 0;
}

.uaPwdPanel .ua-header.ua-reset-options.ua-reset-group.otp-desktop-view.mt-3 {
    margin-right: -3%;
}

.uaPwdPanel ua-ng-login-lib .ua-login-body {
    margin: 0 0 0 -3%;
}

.ua-reset-options.ua-reset-group.otp-desktop-view.mt-3 {
    margin-right: -2%;
}

.uaPwdPanel #uaAccountResetForm p {
    margin-left: 0 !important;
    margin-bottom: 4% !important;
}

/* ============================================================
   UA Account Reset — Submit Email Button
   Scoped variants: inside .uaPwdPanel and standalone
   ============================================================ */

.uaPwdPanel ua-account-reset .ua-submit-email.reset-option-btn,
ua-account-reset .ua-submit-email,
ua-account-reset .ua-submit.ua-submit-email {
    width: 48%;
    margin-left: 1%;
}


/* ============================================================
   Login Container — Base (mobile-first)
   ============================================================ */

ua-ng-login-lib .container.ua-login-container {
    width: 100%;
}

/* ============================================================
   Responsive Breakpoints
   ============================================================ */

/* Mobile — xs (<768px): full width, standard Bootstrap gutters */
@media (max-width: 767px) {
    .uaPwdPanel.container,
    ua-ng-login-lib .container {
        width: 100%;
        padding-left: 15px;
        padding-right: 15px;
    }

    .uaPwdPanel input[type=submit] {
        width: 100%;
        margin-left: 0% !important;
    }
}

/* Tablet — sm (768px–991px): comfortable mid width */
@media (min-width: 768px) and (max-width: 991px) {
    .uaPwdPanel.container,
    ua-ng-login-lib .container {
        width: 80%;
        max-width: 600px;
    }
}

/* Desktop — md/lg (992px+): constrained width */
@media (min-width: 992px) {
    .uaPwdPanel.container,
    ua-ng-login-lib .container {
        width: 50%;
        max-width: 480px;
    }
}

/* ============================================================
   TOS / POS Checkbox Visibility Fix
   ============================================================ */
 .ua-tos[role="alert"] {
    margin-top: -10% !important;
}