@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&display=swap');

:root {
	--snhu-ink-blue: #00244E;
	--snhu-golden-yellow: #FDB913;
	--snhu-sky-blue: #009DEA;
	--snhu-heritage-blue: #0A3370;
	--snhu-muted-blue: #3A4D6A;
	--snhu-bright-blue: #2066A2;
	--snhu-dark-yellow: #DBA02B;
	--snhu-light-yellow: #FDCB54;
	--snhu-pale-yellow: #FEE097;
	--snhu-web-dark-grey: #727577;
	--snhu-light-cool-grey: #C3C6CA;
	--snhu-light-warm-grey: #EFEFEF;
    --snhu-footer-bg: #EFEFEF;
    --snhu-footer-copyright-color: #747678;

	--sty-primary-color: var(--snhu-ink-blue);
	--sty-danger-color: #e00000;
	--sty-success-color: #8EAF3E;
	--sty-info-color: #27BACE;
	--sty-bg: #ffffff;
	--sty-text-color: #071b39;
	--sty-link-color: #0c346b;
	--sty-link-decoration: underline;
	--sty-link-hover-color: #70ABDB;
	--sty-link-hover-decoration: none;
    --sty-strong-font-weight: 700;

	--sty-section-title-margin-bottom: 2rem;
	--sty-border-radius: .25rem;
    --sty-panel-max-width: minmax(360px, 500px);
    --sty-panel-container-padding: 0 2rem 2rem;
    --sty-panel-margin: -4rem 0 0;
	--sty-panel-box-shadow: 0 3px 5px 0 rgb(0 0 0 / 10%), 0 0 15px 0 rgb(0 0 0 / 10%);

	--sty-button-font-weight: 700;
	--sty-button-primary-border-color: transparent;
	--sty-button-primary-bg: var(--snhu-golden-yellow);
    --sty-button-primary-focus-color: var(--snhu-heritage-blue);
	--sty-button-primary-hover-bg: var(--snhu-light-yellow);
	--sty-button-primary-focus-bg: var(--snhu-light-yellow);
	--sty-button-primary-color: var(--snhu-heritage-blue);

	--sty-input-style: outer;
	--sty-input-focus-border-color: #1b96ff;
	--sty-input-focus-box-shadow: 0 0 3px #0176d3;
	--sty-input-disabled-bg: #f3f3f3;
	--sty-input-disabled-color: #a8b7c7;
	--sty-input-disabled-border-style: solid;

    --sty-font-family: "Open Sans", sans-serif;
}

/* COMMON */

a {
	position: relative;
	padding: 0;
}
a::after {
	position: absolute;
	inset-block-end: -2px;
	inset-inline-start: 0;
	width: 0;
	height: 2px;
	content: "";
	background: currentColor;
	transition: width 200ms ease-out;
}
a:hover::after {
	width: 100%;
}

.section-title {
    font-stretch: 75%;
}

.support-text.custom {
	margin-block-start: 1.5rem;
    font-weight: 600;
}

.extra-enroll-success-text {
    margin-top: 25px;
}

.validator-list {
	padding: 0;
	margin: 0.5rem 0 1rem;
	list-style: none;
	text-align: left;
}
.validator-item {
	position: relative;
	padding-inline-start: 1rem;
	color: var(--sty-text-color-secondary);
}
.validator-item::before {
    position: absolute;
    inset-block-start: 0.5em;
    inset-inline-start: 0;
    content: '';
    width: 0.5rem;
    height: 0.5rem;
    background: currentColor;
    border-radius: 50%;
}
.validator-item.valid {
    color: var(--sty-text-color);
}
.validator-item.valid::before {
    background: var(--sty-success-color);
}

[data-field='password']::part(validators) {
	display: none;
}

sty-input-date-picker[invalid]::part(container),
sty-input-date-picker-memorable[invalid]::part(input-month),
sty-input-date-picker-memorable[invalid]::part(input-day),
sty-input-date-picker-memorable[invalid]::part(input-year),
sty-input-file[invalid]::part(container),
sty-input-number[invalid]::part(container),
sty-input-passcode[invalid]::part(container),
sty-input-password[invalid]::part(container),
sty-input-phone[invalid]::part(container),
sty-input-text[invalid]::part(container),
sty-input-textarea[invalid]::part(container),
sty-select[invalid]::part(container) {
	--sty-input-border-width: 1px 1px 3px 1px;
}

#app.login [data-section="panelHeader"],
#app.login div.account-info,
#app.landing [data-section="panelHeader"],
#app.password [data-separator="login"],
#app.identifier [data-separator="registration"],
#app.registration [data-field="keepMeLoggedIn"],
#app.registration [data-separator="login"],
#app.registration [data-button="login"],
#app.mfaPasscode [data-separator="login"],
#app.magicLink [data-separator="login"],
#app.mfaMethod [data-button="login"],
#app.mfaMethod [data-separator="login"],
#app.mfaMethod [data-button="reset"],
#app.mfaEnrollTargetSelect [data-button="login"],
#app.mfaEnrollTargetSelect [data-separator="login"],
#app.mfaEnrollChallenge [data-button="login"],
#app.mfaEnrollChallenge [data-separator="login"],  
#app.mfaEnrollStart [data-button="login"],
#app.mfaEnrollStart [data-separator="login"],
#app.mfaEnrollStart sty-checkbox[data-field="rememberDevice"],
#app.mfaEnrollSoftToken [data-separator="login"],
#app.mfaEnrollSuccess [data-button="login"],
#app.mfaEnrollSuccess [data-text="identifier"],
#app.customerInput [data-button="login"],
#app.customerInput [data-separator="login"],
#app.customerInput [data-field="attribute-local.email"] label,
#app.genericResult[data-screen="mfaEnrollSuccess"] [data-button="login"],
#app.genericResult[data-screen="mfaEnrollSuccess"] [data-separator="login"],
#app.genericResult[data-screen="mfaEnrollSuccess"] .support-text,
#language-selector {
     display: none;
}

#app.genericResult[data-screen="mfaEnrollSuccess"] [data-button="actionButton"]::part(focus-ring) {
    display: none;
}

#app.genericResult[data-screen="mfaEnrollSuccess"] [data-button="actionButton"] {
    --sty-button-primary-focus-bg: var(--snhu-golden-yellow);
}

#app.login:not(.genericResult):not(.genericAction) [data-block-title] {
	padding: 1rem 2rem .813rem 2rem;
	margin-left: -2rem;
	margin-right: -2rem;
	background-color: var(--snhu-footer-bg);
	color: var(--snhu-heritage-blue);
	text-align: center;
	font-family: "Oswald", sans-serif;
    font-size: 1.5rem;
}

#app.mfaEnrollChallenge .back-button{
    width: 100%;
    text-align: center;
    display: block;
}

#app.login:not(.genericResult):not(.genericAction) [data-block-title]+sty-form {
    margin-block-start: 4rem;
}
#app.mfaEnrollTargetSelect .text.custom {
    margin-block-end: 1rem;
    text-align: center;
}
#app.forgottenPasswordEmail .state-icon,
#app.forgottenPasswordPhone .state-icon {
	color: var(--snhu-golden-yellow) !important;
}

#app.mfaEnrollSoftToken .qrcode {
    display: block;
    margin: 1rem auto;
}

/*
#app.login.registration sty-form,
#app.login.proofingData sty-form { margin-block-start: 4rem; }
#app.login.progressiveProfiling sty-form { margin-block-start: 0; }
#app.login.password [data-section="accountInfo"] { margin-block-end: 3rem; }

div[data-section="accountInfo"] span {
	margin-inline-end: 5px;
}

#app.landing.magicLinkExpired section[data-block="magicLinkExpired"] svg {
	margin-block-start: 2rem;
}
*/

/* HEADER */

[data-content="header"] {
    display: flex;
	flex-direction: column-reverse;
	align-items: center;
	justify-content: space-evenly;
	width: 100%;
	height: 16.8125rem;
    padding-block-end: 3.25rem;
	color: #ffffff;
	background-image: url('https://admission.snhu.edu/resource/1666256366000/SNHU_AP_Assets/desktop/HeaderImage.png');
	background-size: cover;
	background-position: center;
}
[data-content="header"] > div {
	width: 33.333%;
}
[data-content="header"] .placeholder {
    display: none;
}
[data-content="header"] .logo {
	width: 15.625rem;
}
[data-content="header"] .logo img {
	position: relative;
	inset-block-end: 2rem;
}
[data-content="header"] .support {
	--sty-link-color: #ffffff;
	width: 100%;
	align-self: stretch;
	text-align: right;
	padding-inline-end: 1rem;
    padding-block-end: 30px;
}
[data-content="header"] .support #support-heading {
	margin: 0;
    font-size: 1rem;
    font-weight: 600;
    line-height: 1.2;
}

/* FOOTER */

[data-content="footer"] {
    --sty-link-decoration: none;
	background: var(--snhu-footer-bg);
	text-align: center;
    padding-block-end: 3.25rem;
}
[data-content="footer"] ul {
    list-style: none;
    margin: 0 auto;
    padding: 0;
    display: flex;
    align-items: center;
	justify-content: center;
    flex-wrap: wrap;
    text-align: center;
}
[data-content="footer"] .links {
    --sty-link-color: var(--snhu-bright-blue);
    flex-direction: column;
    padding-block: 2rem 1.5rem;
	padding-inline: 2rem;
}
[data-content="footer"] .links a {
    margin-inline: 1.75rem;
	font-weight: bold;
}
[data-content="footer"] .social li {
    padding-inline: 1rem;
}
[data-content="footer"] .social a {
    padding: 0.125rem;
}
[data-content="footer"] .social img {
    height: 2.5rem;
    width: 2.5rem;
}
[data-content="footer"] .copyright {
	color: var(--snhu-footer-copyright-color);
	line-height: 2;
}
[data-content="footer"] .copyright strong {
    font-weight: 700;
}
[data-content="footer"] address {
	color: var(--snhu-footer-copyright-color);
    font-style: normal;
}

@media (min-width: 1024px) {
    [data-content="header"] .logo img {
        inset-block-end: 1rem;
    }
    [data-content="header"] {
        flex-direction: row;
    }
    [data-content="header"] .support {
        padding-block-end: 0;
    }
	[data-content="header"] .placeholder {
        display: block;
    }
	[data-content="header"] .support {
        width: 33.333%;
        padding: 2.8125rem 2.25rem 0;
    }
    [data-content="footer"] .links {
        flex-direction: row;
    }
}
