@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700&display=swap');

/* Login page only. Auth and other layouts are untouched. */
body.pagelayout-login {
    --eq-login-accent: #41b2d9;
    --eq-login-deep: #35495A;
    --eq-login-ink: #1A1F24;
    --eq-login-muted: #5A5A5C;
    --eq-login-line: #E4E8EC;
    --eq-login-paper: #eef3f6;
}

body.pagelayout-login,
body.pagelayout-login #page-wrapper,
body.pagelayout-login #page,
body.eq-install {
    min-height: 100vh;
    min-height: 100dvh;
    overflow-x: hidden;
    max-width: 100%;
    background-color: var(--eq-login-paper, #eef3f6);
    background-image:
        radial-gradient(ellipse 80% 48% at 50% -8%, rgba(65, 178, 217, 0.18), transparent 58%),
        radial-gradient(ellipse 55% 40% at 100% 108%, rgba(53, 73, 90, 0.08), transparent 52%);
    background-repeat: no-repeat;
}

#page-login-index,
#page-login-index #page-wrapper,
#page-login-index #page {
    min-height: 100vh;
}

#page-login-index {
    font-family: "Cairo", Tahoma, sans-serif;
}

#page-login-index #page {
    margin: 0;
}

#page-login-index #page-content {
    min-height: 100vh;
    width: 100%;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

#page-login-index .login-layout-left {
    display: none !important;
}

#page-login-index .login-layout-right,
#page-login-index #region-main,
#page-login-index #region-main-box {
    width: 100%;
    max-width: 100%;
    flex: 1 1 auto;
    min-height: 100vh;
    padding: 0;
    margin: 0;
    border: 0;
    background: transparent !important;
    display: flex;
    align-items: center;
    justify-content: center;
}

#page-login-index .login-layout-right-content {
    width: 100%;
    max-width: none;
    margin: 0;
    display: flex;
    justify-content: center;
    padding: 1rem 16px 1.5rem;
    box-sizing: border-box;
}

#page-login-index .login-container {
    width: calc(100% - 32px);
    max-width: 540px;
    margin: 0 auto;
    background: #fff;
    border: 1px solid #eef1f4;
    border-radius: 1rem;
    box-shadow: 0 8px 24px rgba(53, 73, 90, 0.06);
    padding: 22px 32px 20px;
    box-sizing: border-box;
}

#page-login-index .eq-login-form {
    text-align: center;
}

#page-login-index .eq-login-logo {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto 0.35rem;
    background: transparent;
    padding: 0;
    border: 0;
    box-shadow: none;
}

#page-login-index #logoimage {
    display: block;
    width: 160px;
    height: auto;
    max-width: 200px;
    object-fit: contain;
    background: transparent;
}

#page-login-index .eq-login-title {
    font-family: "Cairo", Tahoma, sans-serif;
    font-size: 1.28rem;
    font-weight: 700;
    line-height: 1.3;
    color: var(--eq-login-deep);
    margin: 0 0 0.15rem;
    text-align: center;
}

#page-login-index .eq-login-subtitle {
    color: var(--eq-login-muted);
    font-size: 0.84rem;
    line-height: 1.4;
    margin: 0 0 0.55rem;
    text-align: center;
    font-weight: 400;
}

#page-login-index .eq-login-alert,
#page-local-schoolhub-twofa .eq-login-alert {
    text-align: start;
    font-size: 0.86rem;
    border-radius: 0.65rem;
    border: 0;
    background: #fdecec;
    color: #8a1f1b;
    margin-bottom: 0.9rem;
}

#page-login-index .eq-login-alert.alert-info,
#page-local-schoolhub-twofa .eq-login-alert.alert-info {
    background: color-mix(in srgb, var(--eq-login-accent) 10%, #fff);
    color: var(--eq-login-deep);
}

#page-login-index .login-form {
    text-align: start;
}

#page-login-index .login-form-username,
#page-login-index .login-form-password {
    margin-bottom: 0.45rem !important;
}

#page-login-index .login-form .form-label {
    font-weight: 600;
    font-size: 0.84rem;
    color: var(--eq-login-deep);
    margin-bottom: 0.3rem;
}

#page-login-index .eq-login-field {
    position: relative;
}

#page-login-index .eq-login-field__ico {
    position: absolute;
    inset-inline-start: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    width: 1.15rem;
    height: 1.15rem;
    color: var(--eq-login-muted);
    display: grid;
    place-items: center;
    pointer-events: none;
    z-index: 1;
}

#page-login-index .eq-login-field__ico .sh-icon {
    width: 100%;
    height: 100%;
}

#page-login-index .login-form .form-control {
    min-height: 2.5rem;
    border-radius: 0.65rem;
    border: 1px solid #e6eaee;
    background: #fff;
    color: var(--eq-login-ink);
    font-size: 0.95rem;
    box-shadow: none;
    padding-inline-start: 2.55rem;
}

#page-login-index .login-form .form-control:hover {
    background: #fff;
    border-color: #d5dde3;
}

#page-login-index .login-form .form-control:focus {
    background: #fff;
    border-color: var(--eq-login-accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--eq-login-accent) 16%, transparent);
    outline: 0;
}

#page-login-index .eq-passfield {
    position: relative;
}

#page-login-index .eq-passfield .form-control {
    padding-inline-end: 2.75rem;
    padding-inline-start: 2.55rem;
}

#page-login-index .eq-pass-toggle {
    position: absolute;
    inset-inline-end: 0.28rem;
    top: 50%;
    transform: translateY(-50%);
    width: 2.15rem;
    height: 2.15rem;
    border: 0;
    background: transparent;
    color: var(--eq-login-muted);
    display: grid;
    place-items: center;
    cursor: pointer;
    border-radius: 0.5rem;
    padding: 0;
}

#page-login-index .eq-pass-toggle:hover,
#page-login-index .eq-pass-toggle:focus {
    color: var(--eq-login-deep);
    background: #f4f7f9;
    outline: 0;
}

#page-login-index .eq-pass-toggle:focus-visible {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--eq-login-accent) 16%, transparent);
}

#page-login-index .eq-pass-toggle svg {
    width: 1.2rem;
    height: 1.2rem;
    display: none;
}

#page-login-index .eq-pass-toggle .eq-pass-toggle__slash {
    display: block;
}

#page-login-index .eq-pass-toggle.is-on .eq-pass-toggle__slash {
    display: none;
}

#page-login-index .eq-pass-toggle.is-on .eq-pass-toggle__eye {
    display: block;
}

#page-login-index .eq-login-forgot {
    text-align: center;
    margin: 0 0 0.45rem;
}

#page-login-index .eq-login-forgot__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    color: var(--eq-login-accent);
    text-decoration: none;
    font-weight: 600;
    font-size: 0.84rem;
}

#page-login-index .eq-login-forgot__link .sh-icon {
    width: 1em;
    height: 1em;
}

#page-login-index .eq-login-forgot a {
    color: var(--eq-login-accent);
    text-decoration: none;
    font-weight: 600;
    font-size: 0.84rem;
}

#page-login-index .eq-login-signup a {
    color: var(--eq-login-accent);
    text-decoration: none;
    font-weight: 700;
}

#page-login-index .eq-login-forgot a:hover,
#page-login-index .eq-login-signup a:hover,
#page-login-index .eq-login-forgot a:focus,
#page-login-index .eq-login-signup a:focus,
#page-login-index .eq-login-forgot__link:hover,
#page-login-index .eq-login-forgot__link:focus {
    color: var(--eq-login-deep);
    text-decoration: underline;
}

#page-login-index .login-form-submit {
    margin-bottom: 0.45rem !important;
}

#page-login-index .eq-login-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    min-height: 2.5rem;
    border: 0;
    border-radius: 0.7rem;
    background: var(--eq-login-accent) !important;
    border-color: var(--eq-login-accent) !important;
    color: #fff !important;
    font-weight: 700;
    font-size: 0.98rem;
    box-shadow: none;
}

#page-login-index .eq-login-submit .sh-icon {
    width: 1.15em;
    height: 1.15em;
    flex: 0 0 auto;
}

#page-login-index .eq-login-submit:hover {
    filter: brightness(1.04);
    background: var(--eq-login-accent) !important;
}

#page-login-index .eq-login-submit:focus,
#page-login-index .eq-login-submit:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--eq-login-accent) 22%, transparent);
    background: var(--eq-login-accent) !important;
}

#page-login-index .eq-login-submit:disabled,
#page-login-index .eq-login-submit[aria-disabled="true"] {
    opacity: 0.65;
    pointer-events: none;
}

#page-login-index .eq-login-signup {
    display: none !important;
}

#page-login-index .eq-login-forgot-help,
#page-local-schoolhub-twofa .eq-login-forgot-help {
    text-align: center;
    font-size: 0.78rem;
    color: var(--eq-login-muted);
    margin: 0.2rem 0 0.4rem;
    line-height: 1.35;
}

#page-login-index .eq-login-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 0.5rem;
    margin: 0.45rem 0 0;
}

#page-login-index .eq-login-actions .eq-login-register,
#page-login-index .eq-login-actions .eq-login-public {
    flex: 1 1 calc(50% - 0.25rem);
    margin: 0;
    min-width: 9.5rem;
    text-align: center;
}

#page-login-index .eq-login-public {
    margin: 0;
    text-align: center;
}
#page-login-index .eq-login-public__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    width: 100%;
    min-height: 2.55rem;
    padding: 0.45rem 0.85rem;
    border: 1px solid color-mix(in srgb, var(--eq-login-accent) 35%, #e6eaee);
    border-radius: 0.7rem;
    background: color-mix(in srgb, var(--eq-login-accent) 8%, #fff);
    color: var(--eq-login-deep);
    font-size: 0.88rem;
    font-weight: 800;
    text-decoration: none;
    box-sizing: border-box;
}
#page-login-index .eq-login-public__btn .sh-icon {
    width: 1.1em;
    height: 1.1em;
    flex: 0 0 auto;
    color: var(--eq-login-accent);
}
#page-login-index .eq-login-public__btn:hover,
#page-login-index .eq-login-public__btn:focus {
    border-color: var(--eq-login-accent);
    color: var(--eq-login-deep);
    background: color-mix(in srgb, var(--eq-login-accent) 14%, #fff);
    text-decoration: none;
}

#page-login-index .eq-login-register {
    margin: 0;
    text-align: center;
}

#page-login-index .eq-login-register__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.4rem;
    width: 100%;
    min-height: 2.55rem;
    padding: 0.45rem 1rem;
    border: 1.5px solid var(--eq-login-accent);
    border-radius: 0.7rem;
    background: #fff;
    color: var(--eq-login-accent);
    font-size: 0.88rem;
    font-weight: 800;
    text-decoration: none;
    transition: background 0.15s ease, color 0.15s ease;
}

#page-login-index .eq-login-register__btn:hover,
#page-login-index .eq-login-register__btn:focus {
    background: color-mix(in srgb, var(--eq-login-accent) 10%, #fff);
    color: var(--eq-login-deep);
    text-decoration: none;
}

#page-login-index .eq-login-accounts-note {
    text-align: center;
    font-size: 0.78rem;
    color: var(--eq-login-muted);
    margin: 0.25rem 0 0.45rem;
    line-height: 1.35;
}

#page-login-index .eq-login-install {
    margin: 0;
}

#page-login-index .eq-login-footer {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    gap: 0.55rem;
    margin: 0.7rem 0 0.35rem;
}

#page-login-index .eq-login-footer .eq-login-install {
    margin: 0;
    width: 100%;
    text-align: center;
}

#page-login-index .eq-login-footer .eq-login-lang {
    margin: 0;
    width: 100%;
}

#page-login-index .eq-login-install {
    text-align: center;
    margin: 0 0 0.85rem;
}

#page-login-index .eq-login-install a,
#page-login-index .eq-login-install__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--eq-login-deep);
    text-decoration: none;
    font-weight: 700;
    font-size: 0.86rem;
    border: 1px solid #e6eaee;
    border-radius: 999px;
    padding: 0.4rem 0.95rem;
    background: #fff;
    cursor: pointer;
    font-family: inherit;
}

#page-login-index .eq-login-install a:hover,
#page-login-index .eq-login-install a:focus,
#page-login-index .eq-login-install__btn:hover,
#page-login-index .eq-login-install__btn:focus {
    border-color: var(--eq-login-accent);
    color: var(--eq-login-deep);
    text-decoration: none;
}

/* Public PWA install page (embedded layout). */
body.eq-install {
    --eq-login-accent: #41b2d9;
    --eq-login-deep: #35495A;
    --eq-login-muted: #5A5A5C;
    --eq-login-paper: #F7F9FB;
    font-family: "Cairo", Tahoma, sans-serif;
    min-height: 100vh;
    background-color: var(--eq-login-paper);
}

body.eq-install #page,
body.eq-install #page-content,
body.eq-install #region-main {
    background: transparent !important;
    min-height: 100vh;
}

.eq-install-page {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.25rem 16px;
    box-sizing: border-box;
}

.eq-install-card {
    width: 100%;
    max-width: 420px;
    margin: 0 auto;
    background: #fff;
    border: 1px solid #eef1f4;
    border-radius: 1rem;
    box-shadow: 0 8px 24px rgba(53, 73, 90, 0.06);
    padding: 28px 28px 24px;
    text-align: center;
    box-sizing: border-box;
}

.eq-install-logo {
    display: block;
    width: 168px;
    height: 168px;
    margin: 0 auto 0.85rem;
    object-fit: contain;
    background: #fff;
    border-radius: 50%;
    padding: 0.45rem;
    box-sizing: border-box;
    box-shadow: 0 0 0 1px #eef1f4;
}

.eq-install-card h1 {
    font-size: 1.28rem;
    font-weight: 700;
    color: var(--eq-login-deep, #35495A);
    margin: 0 0 0.35rem;
}

.eq-install-lead {
    color: var(--eq-login-muted, #5A5A5C);
    margin: 0 0 1rem;
    font-size: 0.92rem;
}

.eq-install-steps {
    text-align: start;
    margin: 0 0 0.85rem;
    padding-inline-start: 1.2rem;
    color: var(--eq-login-deep, #35495A);
    font-size: 0.9rem;
    line-height: 1.55;
}

.eq-install-note {
    color: var(--eq-login-muted, #5A5A5C);
    font-size: 0.82rem;
    margin: 0 0 1.1rem;
    line-height: 1.45;
}

.eq-install-open {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2.5rem;
    padding: 0.45rem 1.15rem;
    margin: 0 0 1.15rem;
    border: 0;
    border-radius: 0.7rem;
    background: var(--eq-login-accent, #41b2d9) !important;
    color: #fff !important;
    font-weight: 700;
    text-decoration: none !important;
}

.eq-install-open[hidden] {
    display: none !important;
}

.eq-install-qr {
    margin: 0.35rem auto 1rem;
    padding: 0.85rem 0.85rem 0.7rem;
    max-width: 240px;
    background: #fff;
    border: 1px solid #e6eaee;
    border-radius: 1rem;
    box-shadow: 0 8px 20px rgba(53, 73, 90, 0.06);
}

.eq-install-qr img {
    display: block;
    width: 196px;
    height: 196px;
    margin: 0 auto;
    background: #fff;
}

.eq-install-qr p {
    margin: 0.55rem 0 0;
    color: var(--eq-login-deep, #35495A);
    font-size: 0.82rem;
    font-weight: 700;
    line-height: 1.4;
}

.eq-install-login {
    display: inline-block;
    color: var(--eq-login-accent, #41b2d9);
    font-weight: 700;
    text-decoration: none;
}

.eq-install-login:hover,
.eq-install-login:focus {
    color: var(--eq-login-deep, #35495A);
    text-decoration: underline;
}

#page-login-index .eq-login-lang {
    margin: 0 0 0.35rem;
}

#page-login-index .eq-login-lang .dropdown-toggle,
#page-login-index .eq-login-lang a.dropdown-toggle {
    color: var(--eq-login-muted) !important;
    font-weight: 600;
    font-size: 0.84rem;
    background: #fff !important;
    border: 1px solid #e6eaee !important;
    border-radius: 999px !important;
    box-shadow: none !important;
    padding: 0.45rem 1rem !important;
    min-height: 2.35rem;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
}

#page-login-index .eq-login-lang .dropdown-toggle:hover,
#page-login-index .eq-login-lang .dropdown-toggle:focus {
    border-color: var(--eq-login-accent) !important;
    color: var(--eq-login-deep) !important;
}

/* Core draws this caret with a Font Awesome glyph, so a font that fails to load
   leaves an empty box next to the language name. Borders always render. */
#page-login-index .eq-login-lang .dropdown-toggle::after {
    font: inherit;
    content: "";
    display: inline-block;
    width: 0;
    height: 0;
    margin-inline-start: 0.4rem;
    margin-inline-end: 0;
    vertical-align: 0.14em;
    border-top: 0.34em solid currentColor;
    border-inline-start: 0.29em solid transparent;
    border-inline-end: 0.29em solid transparent;
    border-bottom: 0;
}

#page-login-index .eq-login-lang .dropdown-toggle[aria-expanded="true"]::after {
    border-top: 0;
    border-bottom: 0.34em solid currentColor;
}

#page-login-index .eq-login-cookies .btn-link {
    font-size: 0.72rem;
    font-weight: 400;
    color: #9aa3aa !important;
    text-decoration: none;
}

#page-login-index .eq-login-cookies .btn-link:hover,
#page-login-index .eq-login-cookies .btn-link:focus {
    color: #7b848c !important;
    text-decoration: underline;
}

#page-login-index .navbar,
#page-login-index #page-footer .footer-content-popover,
#page-login-index .footer-content-popover {
    display: none;
}

@media (max-width: 575.98px) {
    #page-login-index .login-layout-right-content,
    #page-login-forgot_password .login-layout-right-content {
        padding: max(0.75rem, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(1.25rem, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));
    }

    #page-login-index .login-container,
    #page-login-forgot_password .login-container {
        width: calc(100% - 24px);
        max-width: 100%;
        padding: 16px 16px 14px;
        border-radius: 0.85rem;
    }

    #page-login-index #logoimage {
        width: 148px;
        max-width: 70vw;
    }

    #page-login-index .eq-login-title,
    #page-login-forgot_password .eq-login-title {
        font-size: 1.22rem;
    }

    #page-login-forgot_password .eq-login-subtitle {
        font-size: 0.86rem;
    }

    #page-login-forgot_password .eq-login-steps li {
        font-size: 0.78rem;
        padding: 0.5rem 0.6rem;
        grid-template-columns: 1.9rem 1fr;
    }

    #page-login-forgot_password .eq-login-steps__ico {
        width: 1.9rem;
        height: 1.9rem;
    }

    #page-login-index input[type="text"],
    #page-login-index input[type="password"],
    #page-login-index input[type="email"],
    #page-login-forgot_password input[type="text"],
    #page-login-forgot_password input[type="email"] {
        font-size: 16px;
        min-height: 2.85rem;
    }

    #page-login-index .eq-login-submit,
    #page-login-forgot_password .btn-primary,
    #page-login-forgot_password .eq-login-submit {
        min-height: 2.9rem;
        width: 100%;
    }
}

@media (max-width: 379px) {
    #page-login-index .login-container {
        width: calc(100% - 16px);
        padding: 14px 12px 12px;
        border-radius: 0.75rem;
    }

    #page-login-index #logoimage {
        width: 128px;
    }

    #page-login-index .eq-login-title {
        font-size: 1.12rem;
    }
}

@media (min-width: 576px) and (max-width: 900px) {
    #page-login-index .login-container {
        width: min(480px, calc(100% - 40px));
        padding: 24px 28px 20px;
    }
}

@media (max-height: 480px) and (orientation: landscape) {
    #page-login-index #page-content,
    #page-login-index .login-layout-right,
    #page-login-forgot_password #page-content {
        align-items: flex-start;
        min-height: auto;
    }

    #page-login-index .login-layout-right-content {
        padding-top: 0.6rem;
        padding-bottom: 0.6rem;
    }

    #page-login-index #logoimage {
        width: 110px;
    }

    #page-login-index .eq-login-title {
        font-size: 1.15rem;
        margin-bottom: 0.15rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    #page-login-index .eq-login-submit:hover {
        filter: none;
    }
}

#page-login-forgot_password,
#page-login-forgot_password #page-wrapper,
#page-login-forgot_password #page,
#page-local-schoolhub-twofa,
#page-local-schoolhub-twofa #page-wrapper,
#page-local-schoolhub-twofa #page {
    min-height: 100vh;
    font-family: "Cairo", Tahoma, sans-serif;
}
#page-login-forgot_password #page,
#page-local-schoolhub-twofa #page {
    margin: 0;
}
#page-login-forgot_password .login-layout-left,
#page-local-schoolhub-twofa .login-layout-left {
    display: none !important;
}
#page-login-forgot_password #page-content,
#page-login-forgot_password .login-layout-right,
#page-login-forgot_password #region-main,
#page-login-forgot_password #region-main-box,
#page-local-schoolhub-twofa #page-content,
#page-local-schoolhub-twofa .login-layout-right,
#page-local-schoolhub-twofa #region-main,
#page-local-schoolhub-twofa #region-main-box {
    min-height: 100vh;
    width: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent !important;
    display: flex;
    align-items: center;
    justify-content: center;
}
#page-login-forgot_password .login-layout-right-content,
#page-local-schoolhub-twofa .login-layout-right-content {
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 1rem 16px 1.5rem;
    box-sizing: border-box;
}
#page-login-forgot_password .login-container,
#page-local-schoolhub-twofa .login-container {
    width: calc(100% - 32px);
    max-width: 480px;
    margin: 0 auto;
    background: #fff;
    border: 1px solid #eef1f4;
    border-radius: 1.1rem;
    box-shadow: 0 12px 32px rgba(53, 73, 90, 0.08);
    padding: 24px 28px 22px;
    box-sizing: border-box;
}
#page-login-forgot_password h2:not(.eq-login-title),
#page-login-forgot_password .login-heading,
#page-login-forgot_password .generalbox.boxwidthnormal.boxaligncenter,
#page-local-schoolhub-twofa .page-header-headings,
#page-local-schoolhub-twofa h1.h2 {
    display: none !important;
}
#page-login-forgot_password #notice.generalbox {
    display: block !important;
    margin: 0 0 1rem;
    padding: 1rem 1.1rem;
    background: color-mix(in srgb, var(--eq-login-accent) 8%, #fff);
    border: 1px solid color-mix(in srgb, var(--eq-login-accent) 20%, #e6eef2);
    border-radius: 0.75rem;
    color: var(--eq-login-deep);
    text-align: center;
    line-height: 1.55;
    font-size: 0.92rem;
}
#page-login-forgot_password #notice.generalbox.eq-login-notice--warn {
    background: color-mix(in srgb, #f0ad4e 12%, #fff);
    border-color: color-mix(in srgb, #f0ad4e 35%, #e6eef2);
}
#page-login-forgot_password .eq-login-done__note--lead {
    margin: 0 0 0.65rem;
    font-size: 0.84rem;
    text-align: center;
    color: var(--eq-login-deep);
}
#page-login-forgot_password .eq-login-done {
    margin: 0 0 1rem;
    text-align: start;
}
#page-login-forgot_password .eq-login-done--formwait {
    margin: 0 0 1rem;
    padding: 0.85rem 1rem;
    border-radius: 12px;
    border: 1px solid color-mix(in srgb, #f0ad4e 35%, #e6eef2);
    background: color-mix(in srgb, #f0ad4e 10%, #fff);
}
#page-login-forgot_password .eq-login-done--formwait.is-ready {
    opacity: 0.85;
    border-color: color-mix(in srgb, #5cb85c 35%, #e6eef2);
    background: color-mix(in srgb, #5cb85c 10%, #fff);
}
#page-login-forgot_password .eq-login-done__title {
    margin: 0 0 0.55rem;
    color: var(--eq-login-deep);
    font-size: 1rem;
    font-weight: 800;
    text-align: center;
}
#page-login-forgot_password .eq-login-done__steps {
    margin: 0 0 0.65rem;
    padding: 0;
    list-style: none;
    display: grid;
    gap: 0.4rem;
}
#page-login-forgot_password .eq-login-done__steps li {
    display: grid;
    grid-template-columns: 1.45rem 1fr;
    gap: 0.45rem;
    align-items: start;
    padding: 0.5rem 0.65rem;
    background: #f7f9fb;
    border: 1px solid #e6eef2;
    border-radius: 0.65rem;
    font-size: 0.84rem;
    line-height: 1.45;
    color: var(--eq-login-deep);
}
#page-login-forgot_password .eq-login-done__steps li::before {
    counter-increment: eq-forgot-step;
    content: counter(eq-forgot-step);
    width: 1.45rem;
    height: 1.45rem;
    border-radius: 999px;
    background: var(--eq-login-accent);
    color: #fff;
    font-size: 0.78rem;
    font-weight: 800;
    display: grid;
    place-items: center;
    margin-top: 0.05rem;
}
/* Chiffres marocains 1 2 3 (occidentaux) sur la page confirmation */
html[lang^="ar"] #page-login-forgot_password .eq-login-done__steps li:nth-child(1)::before { content: "1"; }
html[lang^="ar"] #page-login-forgot_password .eq-login-done__steps li:nth-child(2)::before { content: "2"; }
html[lang^="ar"] #page-login-forgot_password .eq-login-done__steps li:nth-child(3)::before { content: "3"; }
html[lang^="ar"] #page-login-forgot_password .eq-login-done__steps li:nth-child(4)::before { content: "4"; }
html[lang^="ar"] #page-login-forgot_password .eq-login-done__steps li:nth-child(5)::before { content: "5"; }
html[dir="rtl"] #page-login-forgot_password .eq-login-done__steps li:nth-child(1)::before { content: "1"; }
html[dir="rtl"] #page-login-forgot_password .eq-login-done__steps li:nth-child(2)::before { content: "2"; }
html[dir="rtl"] #page-login-forgot_password .eq-login-done__steps li:nth-child(3)::before { content: "3"; }
html[dir="rtl"] #page-login-forgot_password .eq-login-done__steps li:nth-child(4)::before { content: "4"; }
html[dir="rtl"] #page-login-forgot_password .eq-login-done__steps li:nth-child(5)::before { content: "5"; }
#page-login-forgot_password .eq-login-done__steps {
    counter-reset: eq-forgot-step;
}
#page-login-forgot_password .eq-login-done__note {
    margin: 0;
    font-size: 0.78rem;
    line-height: 1.4;
    color: var(--eq-login-muted);
    text-align: center;
}
#page-login-forgot_password .mform .form-control.is-invalid,
#page-login-forgot_password .mform .form-control.is-invalid:focus {
    border-color: #dc3545;
    box-shadow: 0 0 0 3px color-mix(in srgb, #dc3545 14%, transparent);
}
#page-login-forgot_password .eq-forgot-hidden {
    display: none !important;
}
#page-login-forgot_password .mform input[type="text"],
#page-login-forgot_password .mform input[type="email"],
#page-login-forgot_password .mform input.form-control:disabled,
#page-login-forgot_password .mform .felement.disabled input,
#page-login-forgot_password .mform .fitem.disabled input {
    background-color: #fff !important;
    opacity: 1 !important;
    color: var(--eq-login-deep) !important;
    -webkit-text-fill-color: var(--eq-login-deep) !important;
}
#page-login-forgot_password .fitem label,
#page-login-forgot_password .fitem .col-form-label {
    display: none !important;
}
#page-login-forgot_password .eq-login-howto,
#page-local-schoolhub-twofa .eq-login-howto {
    margin: 0 0 1.15rem;
    text-align: center;
}
#page-login-forgot_password .eq-login-back,
#page-local-schoolhub-twofa .eq-login-back {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    margin: 0 0 0.7rem;
    color: var(--eq-login-accent);
    font-size: 0.84rem;
    font-weight: 700;
    text-decoration: none;
}
#page-login-forgot_password .eq-login-back .sh-icon,
#page-local-schoolhub-twofa .eq-login-back .sh-icon {
    width: 1.05em;
    height: 1.05em;
    flex: 0 0 auto;
}
#page-login-forgot_password .eq-login-back:hover,
#page-login-forgot_password .eq-login-back:focus,
#page-local-schoolhub-twofa .eq-login-back:hover,
#page-local-schoolhub-twofa .eq-login-back:focus {
    color: var(--eq-login-deep);
    text-decoration: underline;
}
#page-login-forgot_password .eq-login-title,
#page-local-schoolhub-twofa .eq-login-title {
    display: block;
    margin: 0 0 0.4rem;
    color: var(--eq-login-deep);
    font-size: 1.38rem;
    font-weight: 800;
    text-align: center;
}
#page-login-forgot_password .eq-login-subtitle,
#page-local-schoolhub-twofa .eq-login-subtitle {
    margin: 0 0 0.9rem;
    color: var(--eq-login-muted);
    text-align: center;
    line-height: 1.55;
    font-size: 0.9rem;
}
#page-login-forgot_password .eq-login-steps,
#page-local-schoolhub-twofa .eq-login-steps {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    gap: 0.45rem;
    text-align: start;
}
#page-login-forgot_password .eq-login-steps li,
#page-local-schoolhub-twofa .eq-login-steps li {
    display: grid;
    grid-template-columns: 2.1rem 1fr;
    gap: 0.55rem;
    align-items: start;
    padding: 0.55rem 0.7rem;
    background: color-mix(in srgb, var(--eq-login-accent) 7%, #fff);
    border: 1px solid color-mix(in srgb, var(--eq-login-accent) 16%, #e6eef2);
    border-radius: 0.75rem;
    color: var(--eq-login-deep);
    font-size: 0.82rem;
    line-height: 1.45;
}
#page-login-forgot_password .eq-login-steps__ico,
#page-local-schoolhub-twofa .eq-login-steps__ico {
    width: 2.1rem;
    height: 2.1rem;
    border-radius: 999px;
    background: var(--eq-login-deep);
    color: #fff;
    display: grid;
    place-items: center;
    margin-top: 0;
}
#page-login-forgot_password .eq-login-steps__ico .sh-icon,
#page-local-schoolhub-twofa .eq-login-steps__ico .sh-icon {
    width: 1.1rem;
    height: 1.1rem;
}
#page-login-forgot_password .eq-login-steps__txt,
#page-local-schoolhub-twofa .eq-login-steps__txt {
    padding-top: 0.2rem;
}
/* Étapes : chiffres marocains 1 2 3 (occidentaux) */
html[lang^="ar"] #page-login-forgot_password .eq-login-steps li .eq-login-steps__ico .sh-icon,
html[lang^="ar"] #page-local-schoolhub-twofa .eq-login-steps li .eq-login-steps__ico .sh-icon,
html[dir="rtl"] #page-login-forgot_password .eq-login-steps li .eq-login-steps__ico .sh-icon,
html[dir="rtl"] #page-local-schoolhub-twofa .eq-login-steps li .eq-login-steps__ico .sh-icon {
    display: none;
}
html[lang^="ar"] #page-login-forgot_password .eq-login-steps li .eq-login-steps__ico::before,
html[lang^="ar"] #page-local-schoolhub-twofa .eq-login-steps li .eq-login-steps__ico::before,
html[dir="rtl"] #page-login-forgot_password .eq-login-steps li .eq-login-steps__ico::before,
html[dir="rtl"] #page-local-schoolhub-twofa .eq-login-steps li .eq-login-steps__ico::before {
    font-size: 0.95rem;
    font-weight: 800;
    line-height: 1;
    color: #fff;
}
html[lang^="ar"] #page-login-forgot_password .eq-login-steps li[data-eq-step="1"] .eq-login-steps__ico::before,
html[lang^="ar"] #page-local-schoolhub-twofa .eq-login-steps li[data-eq-step="1"] .eq-login-steps__ico::before,
html[dir="rtl"] #page-login-forgot_password .eq-login-steps li[data-eq-step="1"] .eq-login-steps__ico::before,
html[dir="rtl"] #page-local-schoolhub-twofa .eq-login-steps li[data-eq-step="1"] .eq-login-steps__ico::before { content: "1"; }
html[lang^="ar"] #page-login-forgot_password .eq-login-steps li[data-eq-step="2"] .eq-login-steps__ico::before,
html[lang^="ar"] #page-local-schoolhub-twofa .eq-login-steps li[data-eq-step="2"] .eq-login-steps__ico::before,
html[dir="rtl"] #page-login-forgot_password .eq-login-steps li[data-eq-step="2"] .eq-login-steps__ico::before,
html[dir="rtl"] #page-local-schoolhub-twofa .eq-login-steps li[data-eq-step="2"] .eq-login-steps__ico::before { content: "2"; }
html[lang^="ar"] #page-login-forgot_password .eq-login-steps li[data-eq-step="3"] .eq-login-steps__ico::before,
html[lang^="ar"] #page-local-schoolhub-twofa .eq-login-steps li[data-eq-step="3"] .eq-login-steps__ico::before,
html[dir="rtl"] #page-login-forgot_password .eq-login-steps li[data-eq-step="3"] .eq-login-steps__ico::before,
html[dir="rtl"] #page-local-schoolhub-twofa .eq-login-steps li[data-eq-step="3"] .eq-login-steps__ico::before { content: "3"; }
html[lang^="ar"] #page-login-forgot_password .eq-login-steps li[data-eq-step="4"] .eq-login-steps__ico::before,
html[lang^="ar"] #page-local-schoolhub-twofa .eq-login-steps li[data-eq-step="4"] .eq-login-steps__ico::before,
html[dir="rtl"] #page-login-forgot_password .eq-login-steps li[data-eq-step="4"] .eq-login-steps__ico::before,
html[dir="rtl"] #page-local-schoolhub-twofa .eq-login-steps li[data-eq-step="4"] .eq-login-steps__ico::before { content: "4"; }
#page-login-forgot_password .mform {
    margin: 0;
}
#page-login-forgot_password .mform > fieldset,
#page-login-forgot_password .mform fieldset {
    border: 0;
    margin: 0 0 0.85rem;
    padding: 0;
    min-width: 0;
    background: transparent;
}
#page-login-forgot_password .mform legend,
#page-login-forgot_password .mform .ftoggler,
#page-login-forgot_password .mform .fheader {
    display: none !important;
}
#page-login-forgot_password .mform .collapsible-actions,
#page-login-forgot_password .mform .fdescription,
#page-login-forgot_password .mform hr {
    display: none !important;
}
#page-login-forgot_password .mform .fitem {
    margin: 0;
    padding: 0;
}
#page-login-forgot_password .mform .fitem.row {
    display: flex;
    flex-direction: column;
    --bs-gutter-x: 0;
    --bs-gutter-y: 0;
}
#page-login-forgot_password .mform .col-form-label,
#page-login-forgot_password #fitem_id_username .col-form-label,
#page-login-forgot_password #fitem_id_email .col-form-label {
    display: none !important;
}
#page-login-forgot_password .mform .felement,
#page-login-forgot_password .mform .col-md-9,
#page-login-forgot_password .mform .col-md-3 {
    width: 100%;
    max-width: 100%;
    flex: 1 1 100%;
    padding: 0;
}
#page-login-forgot_password #id_searchbyusername {
    position: relative;
    margin-bottom: 1.55rem;
}
#page-login-forgot_password #id_searchbyusername.eq-forgot-single {
    margin-bottom: 0;
}
#page-login-forgot_password #id_searchbyusername.eq-forgot-single::after {
    content: none !important;
}
#page-login-forgot_password #id_searchbyusername::after {
    content: attr(data-eq-or);
    position: absolute;
    left: 50%;
    bottom: -1.15rem;
    transform: translateX(-50%);
    background: #fff;
    color: var(--eq-login-muted);
    font-size: 0.75rem;
    font-weight: 700;
    padding: 0 0.45rem;
}
#page-login-forgot_password #id_searchbyusername:not([data-eq-or])::after,
#page-login-forgot_password #id_searchbyusername[data-eq-or=""]::after {
    content: "أو";
}
html[lang^="fr"] #page-login-forgot_password #id_searchbyusername:not([data-eq-or])::after,
html[lang^="fr"] #page-login-forgot_password #id_searchbyusername[data-eq-or=""]::after {
    content: "ou";
}
html[lang^="en"] #page-login-forgot_password #id_searchbyusername:not([data-eq-or])::after,
html[lang^="en"] #page-login-forgot_password #id_searchbyusername[data-eq-or=""]::after {
    content: "or";
}
#page-login-forgot_password .mform .fitem .felement {
    position: relative;
}
#page-login-forgot_password .mform input[type="text"],
#page-login-forgot_password .mform input[type="email"] {
    width: 100%;
    min-height: 2.6rem;
    border: 1px solid #e6eaee;
    border-radius: 0.7rem;
    padding: 0.4rem 0.75rem;
    font: inherit;
    font-size: 0.92rem;
    letter-spacing: normal;
    background: #fff;
    box-shadow: none;
    text-align: start;
}
html[dir="rtl"] #page-login-forgot_password .mform input[type="text"],
html[dir="rtl"] #page-login-forgot_password .mform input[type="email"] {
    direction: rtl;
    text-align: right;
    padding-right: 2.35rem;
    padding-left: 0.75rem;
}
html[dir="ltr"] #page-login-forgot_password .mform input[type="text"],
html[dir="ltr"] #page-login-forgot_password .mform input[type="email"] {
    direction: ltr;
    text-align: left;
    padding-left: 2.35rem;
    padding-right: 0.75rem;
}
#page-login-forgot_password .mform input[type="text"]::placeholder,
#page-login-forgot_password .mform input[type="email"]::placeholder {
    color: #8a9199;
    opacity: 1;
    letter-spacing: normal;
    text-align: start;
}
html[dir="rtl"] #page-login-forgot_password .mform input::placeholder {
    text-align: right;
}
html[dir="ltr"] #page-login-forgot_password .mform input::placeholder {
    text-align: left;
}
#page-login-forgot_password #id_username + .form-control,
#page-login-forgot_password input#id_username,
#page-login-forgot_password input[name="username"] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235A5A5C' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9' cy='8' r='3'/%3E%3Ccircle cx='17' cy='9' r='2.5'/%3E%3Cpath d='M3 19c0-3 3-5 6-5s6 2 6 5'/%3E%3Cpath d='M16 19c0-2 1.5-3.5 3.5-3.5'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: 1.1rem 1.1rem;
}
html[dir="rtl"] #page-login-forgot_password input#id_username,
html[dir="rtl"] #page-login-forgot_password input[name="username"] {
    background-position: right 0.85rem center;
}
html[dir="ltr"] #page-login-forgot_password input#id_username,
html[dir="ltr"] #page-login-forgot_password input[name="username"] {
    background-position: left 0.85rem center;
}
#page-login-forgot_password input#id_email,
#page-login-forgot_password input[name="email"] {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235A5A5C' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Cpath d='M3 7l9 7 9-7'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: 1.1rem 1.1rem;
}
html[dir="rtl"] #page-login-forgot_password input#id_email,
html[dir="rtl"] #page-login-forgot_password input[name="email"] {
    background-position: right 0.85rem center;
}
html[dir="ltr"] #page-login-forgot_password input#id_email,
html[dir="ltr"] #page-login-forgot_password input[name="email"] {
    background-position: left 0.85rem center;
}
#page-login-forgot_password .mform input[type="text"]:focus,
#page-login-forgot_password .mform input[type="email"]:focus {
    border-color: var(--eq-login-accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--eq-login-accent) 16%, transparent);
    outline: 0;
}
#page-login-forgot_password .mform .btn-primary,
#page-login-forgot_password .mform input[type="submit"],
#page-login-forgot_password .mform .eq-login-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    width: 100%;
    min-height: 2.65rem;
    margin-top: 0.25rem;
    border: 0;
    border-radius: 0.7rem;
    background: var(--eq-login-accent);
    color: #fff;
    font-weight: 800;
}
#page-login-forgot_password .mform .eq-login-submit .sh-icon {
    width: 1.15em;
    height: 1.15em;
    flex: 0 0 auto;
}
#page-login-forgot_password .continuebutton,
#page-login-forgot_password .singlebutton {
    text-align: center;
    margin-top: 0.8rem;
}
#page-login-forgot_password .continuebutton .btn,
#page-login-forgot_password .singlebutton .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 8rem;
    min-height: 2.55rem;
    border-radius: 0.7rem;
    font-weight: 800;
}
#page-login-forgot_password .continuebutton .btn.disabled,
#page-login-forgot_password .continuebutton .btn[disabled] {
    opacity: 0.55;
    pointer-events: none;
}
#page-login-forgot_password .eq-login-countdown {
    display: grid;
    justify-items: center;
    gap: 0.35rem;
    margin: 0 0 0.85rem;
    padding: 0.85rem 1rem;
    background: color-mix(in srgb, var(--eq-login-accent) 10%, #fff);
    border: 1px solid color-mix(in srgb, var(--eq-login-accent) 28%, #e6eef2);
    border-radius: 0.85rem;
    text-align: center;
}
#page-login-forgot_password .eq-login-countdown__label {
    font-size: 0.78rem;
    font-weight: 700;
    color: var(--eq-login-muted);
}
#page-login-forgot_password .eq-login-countdown__time {
    font-family: "Cairo", Tahoma, sans-serif;
    font-size: 1.85rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    color: var(--eq-login-deep);
    line-height: 1.1;
}
#page-login-forgot_password .eq-login-countdown__time.is-ready {
    font-size: 0.95rem;
    letter-spacing: 0;
    color: #1a7a4c;
}
#page-login-forgot_password #notice.generalbox.eq-login-notice--wait {
    display: none !important;
}
#page-login-forgot_password .eq-login-userbadge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    margin: 0 auto 0.85rem;
    padding: 0.35rem 0.85rem;
    background: color-mix(in srgb, var(--eq-login-accent) 10%, #fff);
    border: 1px solid color-mix(in srgb, var(--eq-login-accent) 22%, #e6eef2);
    border-radius: 999px;
    font-size: 0.84rem;
    color: var(--eq-login-deep);
}
#page-login-forgot_password .eq-login-userbadge__lbl {
    color: var(--eq-login-muted);
    font-weight: 600;
}
#page-login-forgot_password .eq-login-userbadge__name {
    font-weight: 800;
}
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .mform input[type="password"],
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .mform input[type="text"].eq-setpass-revealed,
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .eq-setpass-inputwrap input {
    width: 100%;
    min-height: 2.85rem;
    border: 1px solid #e6eaee;
    border-radius: 0.75rem;
    padding: 0.5rem 0.95rem;
    padding-inline-start: 2.55rem;
    padding-inline-end: 4.2rem;
    font: inherit;
    font-size: 1rem;
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235A5A5C' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='11' width='14' height='10' rx='2'/%3E%3Cpath d='M8 11V8a4 4 0 0 1 8 0v3'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: 1.15rem 1.15rem;
    box-shadow: none;
    box-sizing: border-box;
}
html[dir="rtl"] :is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .mform input[type="password"],
html[dir="rtl"] :is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .eq-setpass-inputwrap input {
    background-position: right 0.9rem center;
    text-align: right;
}
html[dir="ltr"] :is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .mform input[type="password"],
html[dir="ltr"] :is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .eq-setpass-inputwrap input {
    background-position: left 0.9rem center;
    text-align: left;
}
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .mform input[type="password"]::placeholder,
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .eq-setpass-inputwrap input::placeholder {
    color: #8a9199;
    opacity: 1;
}
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .mform input[type="password"]:focus,
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .eq-setpass-inputwrap input:focus {
    border-color: var(--eq-login-accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--eq-login-accent) 16%, transparent);
    outline: 0;
}
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .eq-login-howto {
    margin: 0 0 1rem;
}
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .eq-login-userbadge {
    display: flex;
    width: fit-content;
    max-width: 100%;
}
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .eq-setpass-hide-core {
    display: none !important;
}
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .eq-setpass-fields {
    display: grid;
    gap: 0.85rem;
    margin: 0 0 0.85rem;
    padding: 1rem;
    background: linear-gradient(180deg, #fbfcfd 0%, #f5f8fa 100%);
    border: 1px solid #e6eef2;
    border-radius: 1rem;
}
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .eq-setpass-fields .fitem {
    margin: 0 !important;
    padding: 0 !important;
}
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .eq-setpass-fields .felement,
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .eq-setpass-fields .col-md-9,
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .eq-setpass-fields .col-md-3 {
    width: 100%;
    max-width: 100%;
    flex: 1 1 100%;
    padding: 0;
    display: block;
}
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .eq-setpass-lbl {
    display: block;
    margin: 0 0 0.35rem;
    font-size: 0.8rem;
    font-weight: 700;
    color: var(--eq-login-deep);
}
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .eq-setpass-inputwrap {
    position: relative;
    display: block;
    width: 100%;
}
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .eq-setpass-toggle {
    position: absolute;
    inset-inline-end: 0.35rem;
    top: 50%;
    transform: translateY(-50%);
    border: 0;
    background: color-mix(in srgb, var(--eq-login-accent) 8%, #fff);
    color: var(--eq-login-accent);
    font: inherit;
    font-size: 0.72rem;
    font-weight: 700;
    padding: 0.28rem 0.45rem;
    border-radius: 0.45rem;
    cursor: pointer;
    line-height: 1.1;
    max-width: 5.5rem;
    white-space: normal;
    text-align: center;
}
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .eq-setpass-toggle:hover,
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .eq-setpass-toggle:focus {
    text-decoration: underline;
    outline: 0;
}
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .eq-setpass-sessions {
    margin: 0.15rem 0 0;
    padding: 0.65rem 0.75rem;
    border-radius: 0.7rem;
    border: 1px solid color-mix(in srgb, var(--eq-login-accent) 18%, #e6eef2);
    background: color-mix(in srgb, var(--eq-login-accent) 7%, #fff);
    font-size: 0.78rem;
    line-height: 1.45;
    color: var(--eq-login-deep);
    text-align: start;
}
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) #fitem_id_passwordpolicyinfo,
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) #fitem_id_passwordpolicyinfo .felement {
    margin: 0 0 0.85rem;
}
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) #fitem_id_passwordpolicyinfo .felement,
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .eq-setpass-policy {
    padding: 0.7rem 0.85rem !important;
    background: color-mix(in srgb, var(--eq-login-accent) 8%, #fff) !important;
    border: 1px solid color-mix(in srgb, var(--eq-login-accent) 18%, #e6eef2);
    border-radius: 0.75rem;
    font-size: 0.82rem !important;
    line-height: 1.45;
    color: var(--eq-login-deep);
    text-align: center;
}
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) #fitem_id_password,
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) #fitem_id_password2 {
    margin-bottom: 0;
}
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) #fitem_id_password .col-form-label,
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) #fitem_id_password2 .col-form-label,
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .helptooltip,
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .iconhelp,
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .fa-question-circle,
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) a[data-action="showhelp"],
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .fdescription.required {
    display: none !important;
}
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) #fitem_id_logoutothersessions {
    display: block !important;
    margin: 0.35rem 0 0.75rem;
    padding: 0.7rem 0.85rem;
    border-radius: 0.75rem;
    border: 1px solid color-mix(in srgb, var(--eq-login-accent) 18%, #e6eef2);
    background: color-mix(in srgb, var(--eq-login-accent) 7%, #fff);
}
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) #fitem_id_logoutothersessions .col-form-label {
    display: none !important;
}
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) #fitem_id_logoutothersessions .felement,
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) #fitem_id_logoutothersessions .form-check {
    width: 100%;
    max-width: 100%;
    padding: 0;
    margin: 0;
    display: flex;
    align-items: flex-start;
    gap: 0.55rem;
}
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) #fitem_id_logoutothersessions .form-check-label,
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) #fitem_id_logoutothersessions label {
    display: inline !important;
    font-size: 0.84rem;
    font-weight: 600;
    color: var(--eq-login-deep);
    line-height: 1.4;
}
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) #id_logoutothersessions {
    width: 1.1rem;
    height: 1.1rem;
    margin-top: 0.15rem;
    flex: 0 0 auto;
    accent-color: var(--eq-login-accent);
}
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .fitem .form-control-feedback {
    font-size: 0.78rem;
    margin-top: 0.25rem;
}
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .mform .fitem_actionbuttons,
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .mform fieldset .fitem:has(.btn) {
    margin-top: 0.35rem;
}
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .eq-setpass-actions,
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .fitem_actionbuttons .felement {
    display: flex !important;
    flex-direction: column;
    gap: 0.5rem;
    width: 100%;
}
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .mform .btn-primary,
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .mform button[type="submit"] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 2.7rem;
    border: 0;
    border-radius: 0.7rem;
    background: var(--eq-login-accent) !important;
    color: #fff !important;
    font-weight: 800;
    padding: 0.5rem 1.1rem;
    order: 1;
}
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .mform .btn-secondary,
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .mform .btn-cancel {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 2.55rem;
    border: 1px solid color-mix(in srgb, var(--eq-login-accent) 35%, #e6eaee);
    border-radius: 0.7rem;
    background: #fff !important;
    color: var(--eq-login-deep) !important;
    font-weight: 700;
    padding: 0.45rem 1.1rem;
    order: 2;
}
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) #id_setpassword > legend,
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .mform legend,
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .mform .ftoggler,
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) .mform .fheader {
    display: none !important;
}
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) #id_setpassword,
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) #id_setpassword .fcontainer,
:is(#page-login-forgot_password:has(#id_password), #page-login-forgot_password:has(.eq-set-password-mark)) fieldset#id_setpassword {
    display: block !important;
    visibility: visible !important;
    height: auto !important;
    overflow: visible !important;
    border: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    min-width: 0;
}

/* 2FA form — inside the same login-container card as forgot password */
#page-local-schoolhub-twofa .eq-twofa-verify {
    margin: 0;
}
#page-local-schoolhub-twofa .eq-twofa-verify .form-label {
    display: block;
    width: 100%;
    margin: 0 0 0.35rem;
    font-size: 0.84rem;
    font-weight: 700;
    color: var(--eq-login-deep);
}
#page-local-schoolhub-twofa .eq-login-field {
    position: relative;
}
#page-local-schoolhub-twofa .eq-login-field__ico {
    position: absolute;
    inset-inline-start: 0.72rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--eq-login-muted);
    pointer-events: none;
}
#page-local-schoolhub-twofa .eq-login-field__ico .sh-icon {
    width: 1.05em;
    height: 1.05em;
}
#page-local-schoolhub-twofa .eq-twofa-verify input[type="text"] {
    width: 100%;
    min-height: 2.65rem;
    padding-inline-start: 2.35rem;
    border: 1px solid #d8dee4;
    border-radius: 0.7rem;
    letter-spacing: 0.18em;
    text-align: center;
    font-weight: 700;
    color: var(--eq-login-ink, #1A1F24);
    box-sizing: border-box;
}
#page-local-schoolhub-twofa .eq-twofa-verify input[type="text"]:focus {
    border-color: var(--eq-login-accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--eq-login-accent) 16%, transparent);
    outline: 0;
}
#page-local-schoolhub-twofa .eq-login-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    min-height: 2.65rem;
    border-radius: 0.7rem;
    background: var(--eq-login-accent) !important;
    border-color: var(--eq-login-accent) !important;
    font-weight: 800;
}
#page-local-schoolhub-twofa .eq-login-submit .sh-icon {
    width: 1.15em;
    height: 1.15em;
}
#page-local-schoolhub-twofa .eq-twofa-trust {
    font-size: 0.84rem;
    color: var(--eq-login-muted);
}
#page-local-schoolhub-twofa .eq-twofa-resend {
    margin: 0.65rem 0 0;
    text-align: center;
}
#page-local-schoolhub-twofa .eq-twofa-resend__btn {
    border: 0;
    background: transparent;
    color: var(--eq-login-accent);
    font-weight: 700;
    text-decoration: underline;
    cursor: pointer;
    padding: 0.25rem 0.5rem;
    font-size: 0.84rem;
}
#page-local-schoolhub-twofa .eq-twofa-resend__btn:hover,
#page-local-schoolhub-twofa .eq-twofa-resend__btn:focus {
    color: var(--eq-login-deep);
}

/* Guest invite pages — same centered card as login (#page-login-index) */
body.eq-guest-login-card .login-layout-left {
    display: none !important;
}
body.eq-guest-login-card #page-content.row {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 100vh;
    min-height: 100dvh;
    width: 100%;
    margin: 0;
}
body.eq-guest-login-card .login-layout-right,
body.eq-guest-login-card .login-layout-right.col-lg-6,
body.eq-guest-login-card #region-main {
    flex: 0 0 100% !important;
    max-width: 100% !important;
    width: 100% !important;
    min-height: 100vh;
    min-height: 100dvh;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    background: transparent !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}
body.eq-guest-login-card .login-layout-right-content {
    width: 100%;
    max-width: none;
    margin: 0;
    display: flex;
    justify-content: center;
    padding: 1rem 16px 1.5rem;
    box-sizing: border-box;
}
body.eq-guest-login-card .login-container {
    width: calc(100% - 32px);
    max-width: 540px;
    margin: 0 auto;
    background: #fff;
    border: 1px solid #eef1f4;
    border-radius: 1rem;
    box-shadow: 0 8px 24px rgba(53, 73, 90, 0.06);
    padding: 22px 32px 20px;
    box-sizing: border-box;
}
body.eq-guest-login-card .navbar,
body.eq-guest-login-card #page-footer {
    display: none !important;
}

#page-local-schoolhub-meet_guest_join,
#page-local-schoolhub-meet_guest_waiting,
#page-local-schoolhub-meet_guest_end,
#page-local-schoolhub-meet_guest_join #page-wrapper,
#page-local-schoolhub-meet_guest_waiting #page-wrapper,
#page-local-schoolhub-meet_guest_end #page-wrapper,
#page-local-schoolhub-meet_guest_join #page,
#page-local-schoolhub-meet_guest_waiting #page,
#page-local-schoolhub-meet_guest_end #page {
    min-height: 100vh;
    min-height: 100dvh;
    font-family: "Cairo", Tahoma, sans-serif;
}
#page-local-schoolhub-meet_guest_join #page,
#page-local-schoolhub-meet_guest_waiting #page,
#page-local-schoolhub-meet_guest_end #page {
    margin: 0;
}
#page-local-schoolhub-meet_guest_join #page-content,
#page-local-schoolhub-meet_guest_waiting #page-content,
#page-local-schoolhub-meet_guest_end #page-content {
    min-height: 100vh;
    min-height: 100dvh;
    width: 100%;
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
#page-local-schoolhub-meet_guest_join .login-layout-left,
#page-local-schoolhub-meet_guest_waiting .login-layout-left,
#page-local-schoolhub-meet_guest_end .login-layout-left {
    display: none !important;
}
#page-local-schoolhub-meet_guest_join .login-layout-right,
#page-local-schoolhub-meet_guest_waiting .login-layout-right,
#page-local-schoolhub-meet_guest_end .login-layout-right,
#page-local-schoolhub-meet_guest_join #region-main,
#page-local-schoolhub-meet_guest_waiting #region-main,
#page-local-schoolhub-meet_guest_end #region-main,
#page-local-schoolhub-meet_guest_join #region-main-box,
#page-local-schoolhub-meet_guest_waiting #region-main-box,
#page-local-schoolhub-meet_guest_end #region-main-box {
    width: 100%;
    max-width: 100%;
    flex: 1 1 auto;
    min-height: 100vh;
    min-height: 100dvh;
    padding: 0;
    margin: 0;
    border: 0;
    background: transparent !important;
    display: flex;
    align-items: center;
    justify-content: center;
}
#page-local-schoolhub-meet_guest_join .login-layout-right-content,
#page-local-schoolhub-meet_guest_waiting .login-layout-right-content,
#page-local-schoolhub-meet_guest_end .login-layout-right-content {
    width: 100%;
    max-width: none;
    margin: 0;
    display: flex;
    justify-content: center;
    padding: 1rem 16px 1.5rem;
    box-sizing: border-box;
}
#page-local-schoolhub-meet_guest_join .login-container,
#page-local-schoolhub-meet_guest_waiting .login-container,
#page-local-schoolhub-meet_guest_end .login-container {
    width: calc(100% - 32px);
    max-width: 540px;
    margin: 0 auto;
    background: #fff;
    border: 1px solid #eef1f4;
    border-radius: 1rem;
    box-shadow: 0 8px 24px rgba(53, 73, 90, 0.06);
    padding: 22px 32px 20px;
    box-sizing: border-box;
}
#page-local-schoolhub-meet_guest_join .page-header-headings,
#page-local-schoolhub-meet_guest_waiting .page-header-headings,
#page-local-schoolhub-meet_guest_end .page-header-headings,
#page-local-schoolhub-meet_guest_join h1.h2,
#page-local-schoolhub-meet_guest_waiting h1.h2,
#page-local-schoolhub-meet_guest_end h1.h2,
#page-local-schoolhub-meet_guest_join .navbar,
#page-local-schoolhub-meet_guest_waiting .navbar,
#page-local-schoolhub-meet_guest_end .navbar,
#page-local-schoolhub-meet_guest_join #page-footer,
#page-local-schoolhub-meet_guest_waiting #page-footer,
#page-local-schoolhub-meet_guest_end #page-footer {
    display: none !important;
}
#page-local-schoolhub-meet_guest_join .eq-guest-form,
#page-local-schoolhub-meet_guest_waiting .eq-guest-form,
#page-local-schoolhub-meet_guest_end .eq-guest-form {
    text-align: center;
}
#page-local-schoolhub-meet_guest_join .eq-login-logo,
#page-local-schoolhub-meet_guest_waiting .eq-login-logo,
#page-local-schoolhub-meet_guest_end .eq-login-logo {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 auto 0.35rem;
    background: transparent;
    padding: 0;
    border: 0;
    box-shadow: none;
}
#page-local-schoolhub-meet_guest_join #logoimage,
#page-local-schoolhub-meet_guest_waiting #logoimage,
#page-local-schoolhub-meet_guest_end #logoimage {
    display: block;
    width: 160px;
    height: auto;
    max-width: 200px;
    object-fit: contain;
    background: transparent;
}
#page-local-schoolhub-meet_guest_join .eq-login-title,
#page-local-schoolhub-meet_guest_waiting .eq-login-title,
#page-local-schoolhub-meet_guest_end .eq-login-title {
    font-family: "Cairo", Tahoma, sans-serif;
    font-size: 1.28rem;
    font-weight: 700;
    line-height: 1.3;
    color: var(--eq-login-deep);
    margin: 0 0 0.15rem;
    text-align: center;
}
#page-local-schoolhub-meet_guest_join .eq-login-subtitle,
#page-local-schoolhub-meet_guest_waiting .eq-login-subtitle,
#page-local-schoolhub-meet_guest_end .eq-login-subtitle {
    color: var(--eq-login-muted);
    font-size: 0.84rem;
    line-height: 1.4;
    margin: 0 0 0.55rem;
    text-align: center;
    font-weight: 400;
}
#page-local-schoolhub-meet_guest_join .eq-guest-session__course,
#page-local-schoolhub-meet_guest_waiting .eq-guest-session__course,
#page-local-schoolhub-meet_guest_end .eq-guest-session__course {
    margin: 0 0 0.55rem;
    color: var(--eq-login-muted);
    font-size: 0.78rem;
    text-align: center;
    line-height: 1.35;
}
#page-local-schoolhub-meet_guest_join .eq-guest-lobby-note,
#page-local-schoolhub-meet_guest_waiting .eq-guest-lobby-note {
    margin: 0 0 0.65rem;
    text-align: center;
    font-size: 0.78rem;
    color: var(--eq-login-muted);
    line-height: 1.35;
}
#page-local-schoolhub-meet_guest_join .eq-login-alert,
#page-local-schoolhub-meet_guest_waiting .eq-login-alert,
#page-local-schoolhub-meet_guest_end .eq-login-alert {
    text-align: start;
    font-size: 0.86rem;
    border-radius: 0.65rem;
    border: 0;
    background: #fdecec;
    color: #8a1f1b;
    margin-bottom: 0.9rem;
}
#page-local-schoolhub-meet_guest_join .eq-login-alert.alert-info,
#page-local-schoolhub-meet_guest_waiting .eq-login-alert.alert-info,
#page-local-schoolhub-meet_guest_end .eq-login-alert.alert-info {
    background: color-mix(in srgb, var(--eq-login-accent) 10%, #fff);
    color: var(--eq-login-deep);
}
#page-local-schoolhub-meet_guest_join .login-form,
#page-local-schoolhub-meet_guest_waiting .login-form {
    text-align: start;
}
#page-local-schoolhub-meet_guest_join .login-form .form-label,
#page-local-schoolhub-meet_guest_waiting .login-form .form-label {
    font-weight: 600;
    font-size: 0.84rem;
    color: var(--eq-login-deep);
    margin-bottom: 0.3rem;
}
#page-local-schoolhub-meet_guest_join .eq-login-field,
#page-local-schoolhub-meet_guest_waiting .eq-login-field {
    position: relative;
}
#page-local-schoolhub-meet_guest_join .eq-login-field__ico,
#page-local-schoolhub-meet_guest_waiting .eq-login-field__ico {
    position: absolute;
    inset-inline-start: 0.75rem;
    top: 50%;
    transform: translateY(-50%);
    width: 1.15rem;
    height: 1.15rem;
    color: var(--eq-login-muted);
    display: grid;
    place-items: center;
    pointer-events: none;
    z-index: 1;
}
#page-local-schoolhub-meet_guest_join .eq-login-field__ico .sh-icon,
#page-local-schoolhub-meet_guest_waiting .eq-login-field__ico .sh-icon {
    width: 100%;
    height: 100%;
}
#page-local-schoolhub-meet_guest_join .login-form .form-control,
#page-local-schoolhub-meet_guest_waiting .login-form .form-control {
    min-height: 2.5rem;
    border-radius: 0.65rem;
    border: 1px solid #e6eaee;
    background: #fff;
    color: var(--eq-login-ink);
    font-size: 0.95rem;
    box-shadow: none;
    padding-inline-start: 2.55rem;
}
#page-local-schoolhub-meet_guest_join .login-form .form-control:focus,
#page-local-schoolhub-meet_guest_waiting .login-form .form-control:focus {
    background: #fff;
    border-color: var(--eq-login-accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--eq-login-accent) 16%, transparent);
    outline: 0;
}
#page-local-schoolhub-meet_guest_join .login-form-submit,
#page-local-schoolhub-meet_guest_waiting .login-form-submit {
    margin-bottom: 0.45rem !important;
}
#page-local-schoolhub-meet_guest_join .eq-login-submit,
#page-local-schoolhub-meet_guest_waiting .eq-login-submit,
#page-local-schoolhub-meet_guest_end .eq-login-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    min-height: 2.5rem;
    border: 0;
    border-radius: 0.7rem;
    background: var(--eq-login-accent) !important;
    border-color: var(--eq-login-accent) !important;
    color: #fff !important;
    font-weight: 700;
    font-size: 0.98rem;
    box-shadow: none;
}
#page-local-schoolhub-meet_guest_join .eq-login-submit .sh-icon,
#page-local-schoolhub-meet_guest_waiting .eq-login-submit .sh-icon {
    width: 1.15em;
    height: 1.15em;
    flex: 0 0 auto;
}
#page-local-schoolhub-meet_guest_join .eq-login-submit:hover,
#page-local-schoolhub-meet_guest_waiting .eq-login-submit:hover {
    filter: brightness(1.04);
    background: var(--eq-login-accent) !important;
}
#page-local-schoolhub-meet_guest_join .eq-guest-displayname,
#page-local-schoolhub-meet_guest_waiting .eq-guest-displayname {
    margin: 0 0 0.85rem;
    text-align: center;
    font-size: 1rem;
    font-weight: 700;
    color: var(--eq-login-deep);
}
#page-local-schoolhub-meet_guest_waiting .eq-guest-waiting {
    text-align: center;
}
#page-local-schoolhub-meet_guest_waiting .eq-guest-waiting__spinner {
    width: 2.5rem;
    height: 2.5rem;
    margin: 0.15rem auto 0.85rem;
    border-radius: 999px;
    border: 3px solid color-mix(in srgb, var(--eq-login-accent) 22%, #e4e8ec);
    border-top-color: var(--eq-login-accent);
    animation: eq-guest-spin 0.9s linear infinite;
}
@keyframes eq-guest-spin {
    to { transform: rotate(360deg); }
}
#page-local-schoolhub-meet_guest_waiting .eq-guest-waiting__err[hidden] {
    display: none !important;
}
#page-local-schoolhub-meet_guest_end .eq-guest-end__icon {
    width: 2.75rem;
    height: 2.75rem;
    margin: 0.35rem auto 0;
    border-radius: 999px;
    display: grid;
    place-items: center;
    background: color-mix(in srgb, var(--eq-login-accent) 12%, #fff);
    color: var(--eq-login-accent);
}
#page-local-schoolhub-meet_guest_end .eq-guest-end__icon .sh-icon {
    width: 1.25rem;
    height: 1.25rem;
}

@media (max-width: 575.98px) {
    #page-local-schoolhub-meet_guest_join .login-layout-right-content,
    #page-local-schoolhub-meet_guest_waiting .login-layout-right-content,
    #page-local-schoolhub-meet_guest_end .login-layout-right-content {
        padding: max(0.75rem, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(1.25rem, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));
    }
    #page-local-schoolhub-meet_guest_join .login-container,
    #page-local-schoolhub-meet_guest_waiting .login-container,
    #page-local-schoolhub-meet_guest_end .login-container {
        width: calc(100% - 24px);
        max-width: 100%;
        padding: 16px 16px 14px;
        border-radius: 0.85rem;
    }
    #page-local-schoolhub-meet_guest_join #logoimage,
    #page-local-schoolhub-meet_guest_waiting #logoimage,
    #page-local-schoolhub-meet_guest_end #logoimage {
        width: 148px;
        max-width: 70vw;
    }
    #page-local-schoolhub-meet_guest_join .eq-login-title,
    #page-local-schoolhub-meet_guest_waiting .eq-login-title,
    #page-local-schoolhub-meet_guest_end .eq-login-title {
        font-size: 1.22rem;
    }
    #page-local-schoolhub-meet_guest_join .login-form .form-control,
    #page-local-schoolhub-meet_guest_waiting .login-form .form-control {
        font-size: 16px;
        min-height: 2.85rem;
    }
    #page-local-schoolhub-meet_guest_join .eq-login-submit,
    #page-local-schoolhub-meet_guest_waiting .eq-login-submit {
        min-height: 2.9rem;
        width: 100%;
    }
}

@media (min-width: 576px) and (max-width: 900px) {
    #page-local-schoolhub-meet_guest_join .login-container,
    #page-local-schoolhub-meet_guest_waiting .login-container,
    #page-local-schoolhub-meet_guest_end .login-container {
        width: min(480px, calc(100% - 40px));
        padding: 24px 28px 20px;
    }
}

@media (prefers-reduced-motion: reduce) {
    #page-local-schoolhub-meet_guest_waiting .eq-guest-waiting__spinner {
        animation: none;
        border-top-color: var(--eq-login-accent);
    }
    #page-local-schoolhub-meet_guest_join .eq-login-submit:hover,
    #page-local-schoolhub-meet_guest_waiting .eq-login-submit:hover {
        filter: none;
    }
}