/* Gherson Login — REAL brand colours (from live gherson.com), layered on top of wfm.css. Scoped to Login.html only. */

:root {
	--gh-navy: #222831;
	--gh-navy-dark: #171B21;
	--gh-slate: #30475E;
	--gh-gold: #C1A57B;
	--gh-teal: #92C7CF;
	--gh-satin: #ECECEC;
	--gh-ink: #222831;
	--gh-ink-soft: #596B7E;
	--gh-white: #ffffff;
}

html, body {
	background: linear-gradient(160deg, var(--gh-navy) 0%, var(--gh-navy-dark) 100%) !important;
	background-attachment: fixed !important;
	min-height: 100%;
	font-family: 'Inter', Arial, sans-serif !important;
	font-weight: 400;
	color: var(--gh-ink);
}

body {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 32px 16px;
	box-sizing: border-box;
}

/* Hide the default Rumpus header/logo (globe icon + "Web File Manager" heading) — replaced by the real logo below */
#Header, #LoginHeader {
	display: none !important;
}

.gh-wordmark {
	position: fixed;
	top: 32px;
	left: 50%;
	transform: translateX(-50%);
	text-align: center;
}
.gh-wordmark img {
	height: 34px;
	width: auto;
	display: block;
}

/* Login card */
#StdLoginBox.DBox,
#BadPassword.DBox,
#PassLookupBox.DBox,
#PassResetBox.DBox {
	width: 100%;
	max-width: 380px;
	margin: 0 auto;
	background: var(--gh-white);
	border-radius: 5px;
	box-shadow: 0 20px 60px rgba(0,0,0,0.35), 0 2px 8px rgba(0,0,0,0.15);
	overflow: hidden;
	border: none;
}

.BoxHeader {
	background: var(--gh-navy);
	color: var(--gh-white);
	font-family: 'Inter', Arial, Helvetica, sans-serif;
	font-weight: 600;
	font-size: 18px;
	letter-spacing: 0.02em;
	padding: 22px 24px 20px 24px;
	text-align: center;
	border: none;
}

.BoxContent {
	padding: 28px 28px 24px 28px;
	background: var(--gh-white);
}

.loginFormBox {
	width: 100%;
}

.stdTextField {
	text-align: left;
	width: 100%;
	max-width: 280px;
	margin: 0 auto 14px auto;
	font-family: 'Inter', Arial, sans-serif;
	font-weight: 600;
	font-size: 11px;
	color: var(--gh-ink-soft);
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.stdTextFieldInput {
	width: 100%;
	max-width: 280px;
	padding: 10px 12px;
	margin-top: 6px;
	box-sizing: border-box;
	border-radius: 2px;
	border: 1px solid #D6DBE0;
	font-family: 'Inter', Arial, sans-serif;
	font-weight: 400;
	font-size: 14px;
	color: var(--gh-ink);
	background: #FBFBFB;
	transition: border-color 0.15s ease, background 0.15s ease;
}

.stdTextFieldInput:focus {
	border-color: var(--gh-teal);
	background: var(--gh-white);
	outline: none;
}

.stdDescText {
	font-family: 'Inter', Arial, sans-serif;
	font-weight: 400;
	font-size: 13px;
	color: var(--gh-ink-soft);
	line-height: 1.5;
}

/* Buttons — gold default, teal on hover, matching the real site's button pattern */
.stdAcceptButton,
#PinRequest input[type="button"],
input[type="submit"] {
	background: var(--gh-gold) !important;
	background-image: none !important;
	border: none !important;
	border-radius: 2px !important;
	color: var(--gh-navy) !important;
	font-family: 'Inter', Arial, sans-serif !important;
	font-weight: 600 !important;
	font-size: 13px !important;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	text-shadow: none !important;
	padding: 12px 20px !important;
	margin: 10px 0 0 0 !important;
	width: 100%;
	max-width: 280px;
	cursor: pointer;
	transition: background 0.15s ease, transform 0.05s ease;
}

.stdAcceptButton:hover,
input[type="submit"]:hover {
	background: var(--gh-teal) !important;
	border: none !important;
	margin: 10px 0 0 0 !important;
}

.stdAcceptButton:active,
input[type="submit"]:active {
	transform: translateY(1px);
}

.SmallLink {
	color: var(--gh-ink-soft);
	font-family: 'Inter', Arial, sans-serif;
	font-weight: 400;
	font-size: 12px;
	text-decoration: underline;
}

.SmallLink:hover {
	color: var(--gh-teal);
}

hr {
	border: none !important;
	border-top: 1px solid #D6DBE0 !important;
	margin: 20px 0 !important;
}

#Footer {
	position: fixed;
	bottom: 18px;
	left: 50%;
	transform: translateX(-50%);
	color: rgba(255,255,255,0.55);
	font-family: 'Inter', Arial, sans-serif;
	font-weight: 400;
	font-size: 11px;
	letter-spacing: 0.02em;
}

@media (max-width: 480px) {
	.gh-wordmark { top: 24px; }
	.gh-wordmark img { height: 26px; }
	#StdLoginBox.DBox, #BadPassword.DBox, #PassLookupBox.DBox, #PassResetBox.DBox {
		margin-top: 70px;
	}
}

/* NavBar carries no content on the login page (empty LoginNote) — just a stray colour bar, hide it */
#NavBar {
	display: none !important;
}