/* Gold Sniper skin for LoginEx — keep GS input/button look, full LoginEx logic UI */

body.gsm-loginex-skin {
	--jh-primary: #ffba02;
	--jh-primary-dark: #e0a400;
	--jh-secondary: #ffd54a;
	--jh-secondary-dark: #ffba02;
	--jh-text: #e2e8f0;
	--jh-muted: #94a3b8;
	--jh-btn-text: #0b1220;
	--jh-surface: transparent;
	--jh-surface-alt: transparent;
	--jh-input-bg: transparent;
	--jh-border: rgba(148, 163, 184, 0.35);
}

/* ---------- manage-subscription panel ---------- */

.ms-card.gsm-ms-card,
.ms-card.gsm-loginex-panel {
	height: auto;
	min-height: 390px;
	padding-bottom: 24px;
}

.gsm-loginex-panel .loginex-login-main,
.gsm-loginex-panel .loginex-login-panel,
.gsm-loginex-panel .loginex-shell,
.gsm-loginex-panel .loginex-card {
	margin: 0;
	padding: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
	max-width: none;
	width: 100%;
}

.gsm-loginex-panel .loginex-brand,
.gsm-loginex-panel .loginex-footer {
	display: none !important;
}

.gsm-loginex-panel .loginex-form {
	display: flex;
	flex-direction: column;
	width: 100%;
}

.gsm-loginex-panel .loginex-field {
	display: flex;
	flex-direction: column;
	margin: 0;
}

.gsm-loginex-panel .loginex-field + .loginex-field,
.gsm-loginex-panel .loginex-login-secret-wrap {
	margin-top: 17px;
}

.gsm-loginex-panel .loginex-field label,
.gsm-loginex-panel .loginex-login-secret-label {
	font-size: 18px;
	font-weight: 500;
	line-height: 23px;
	color: #fff;
	margin: 0 0 0;
}

.gsm-loginex-panel .loginex-field input[type="text"],
.gsm-loginex-panel .loginex-field input[type="password"],
.gsm-loginex-panel .loginex-field input[type="tel"],
.gsm-loginex-panel .loginex-field input[type="email"],
.gsm-loginex-panel .loginex-login-secret-input,
.gsm-loginex-panel .loginex-reset-identifier,
.gsm-loginex-panel .loginex-field input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]) {
	height: 54px;
	margin-top: 17px;
	padding: 0 12px;
	border: 1px solid var(--c-border, rgba(148, 163, 184, 0.35));
	border-radius: 10px;
	background: transparent;
	color: var(--c-white, #fff);
	font: 400 13px/16px var(--font-fa, inherit);
	width: 100%;
	box-sizing: border-box;
}

.gsm-loginex-panel .loginex-field label + input,
.gsm-loginex-panel .loginex-login-secret-label + input {
	margin-top: 17px;
}

.gsm-loginex-panel .loginex-field input::placeholder,
.gsm-loginex-panel .loginex-login-secret-input::placeholder {
	color: var(--c-slate-500, #64748b);
	opacity: 1;
}

.gsm-loginex-panel .loginex-field input:focus,
.gsm-loginex-panel .loginex-login-secret-input:focus {
	outline: none;
	border-color: rgba(255, 186, 2, 0.4);
}

.gsm-loginex-panel .loginex-field-hint,
.gsm-loginex-panel .loginex-login-otp-hint,
.gsm-loginex-panel .loginex-forgot-hint {
	margin: 10px 0 0;
	color: var(--c-slate-400, #94a3b8);
	font-size: 12px;
	line-height: 20px;
}

.gsm-loginex-panel .loginex-login-otp-hint[hidden],
.gsm-loginex-panel .loginex-login-remember[hidden],
.gsm-loginex-panel .loginex-login-back-password[hidden],
.gsm-loginex-panel .loginex-login-panel[hidden],
.gsm-loginex-panel .loginex-forgot-toggle-wrap[hidden],
.gsm-loginex-panel .loginex-forgot-panel[hidden],
.gsm-loginex-panel .loginex-unified-step[hidden],
.gsm-loginex-panel .loginex-reset-step[hidden] {
	display: none !important;
}

.gsm-loginex-panel .loginex-remember {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 14px;
	color: var(--c-slate-400, #94a3b8);
	font-size: 13px;
	line-height: 20px;
	cursor: pointer;
}

.gsm-loginex-panel .loginex-remember input {
	width: 16px;
	height: 16px;
	margin: 0;
	accent-color: #ffba02;
}

.gsm-loginex-panel .loginex-login-otp-actions,
.gsm-loginex-panel .loginex-forgot-toggle-wrap {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 14px;
	margin-top: 12px;
}

.gsm-loginex-panel .loginex-link-btn {
	color: var(--c-gold, #ffba02);
	background: none;
	border: 0;
	padding: 0;
	cursor: pointer;
	font-size: 13px;
	font-weight: 500;
	line-height: 20px;
}

.gsm-loginex-panel .loginex-link-btn:hover {
	filter: brightness(1.08);
}

.gsm-loginex-panel .loginex-otp-cooldown {
	color: var(--c-slate-500, #64748b);
	font-size: 12px;
}

.gsm-loginex-panel .loginex-messages:empty {
	display: none;
}

.gsm-loginex-panel .loginex-messages:not(:empty) {
	margin-top: 12px;
	font-size: 13px;
	line-height: 22px;
}

.gsm-loginex-panel .loginex-message-error,
.gsm-loginex-panel .loginex-messages .loginex-message-error {
	color: #fca5a5;
}

.gsm-loginex-panel .loginex-message-success,
.gsm-loginex-panel .loginex-messages .loginex-message-success {
	color: #6ee7b7;
}

.gsm-loginex-panel .loginex-btn,
.gsm-loginex-panel button.loginex-submit,
.gsm-loginex-panel .loginex-unified-continue,
.gsm-loginex-panel .loginex-reset-form .loginex-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 54px;
	margin-top: 37px;
	border: 0;
	border-radius: 10px;
	background: linear-gradient(to left, var(--c-gold, #ffba02), var(--c-gold-light, #ffd54a));
	box-shadow: 0 4px 50px rgba(255, 186, 2, 0.4);
	color: var(--c-bg, #0b1220);
	font-size: 18px;
	font-weight: 700;
	line-height: 23px;
	cursor: pointer;
	transition: filter 0.2s;
}

.gsm-loginex-panel .loginex-btn:hover,
.gsm-loginex-panel button.loginex-submit:hover {
	filter: brightness(1.06);
}

.gsm-loginex-panel .loginex-btn .spinner,
.gsm-loginex-panel .loginex-submit .spinner {
	display: none;
}

.gsm-loginex-panel .loginex-forgot-panel {
	margin-top: 20px;
	padding-top: 18px;
	border-top: 1px solid var(--c-border, rgba(148, 163, 184, 0.35));
}

.gsm-loginex-panel .loginex-forgot-title {
	margin: 0 0 8px;
	font-size: 16px;
	font-weight: 700;
	color: #fff;
}

.gsm-loginex-panel .loginex-captcha,
.gsm-loginex-panel .loginex-field--captcha {
	margin-top: 14px;
}

.gsm-loginex-panel .ms-card__note {
	margin-top: 27px;
}

.gsm-loginex-panel .ms-card__note a {
	color: var(--c-gold, #ffba02);
	text-decoration: underline;
}

/* Unified phone-only flow inside panel */
.gsm-loginex-panel .loginex-unified-step {
	display: flex;
	flex-direction: column;
}

.gsm-loginex-panel .loginex-unified-step[hidden] {
	display: none !important;
}

/* ---------- standalone LoginEx pages (/login etc.) ---------- */

body.gsm-loginex-skin .loginex-shell {
	max-width: 500px;
	margin: 40px auto;
	padding: 0 16px;
}

body.gsm-loginex-skin .loginex-card {
	background: transparent;
	border: 1px solid rgba(148, 163, 184, 0.35);
	border-radius: 20px;
	box-shadow: none;
	padding: 30px 32px;
	color: #e2e8f0;
}

body.gsm-loginex-skin .loginex-ui .loginex-field input {
	height: 54px;
	border-radius: 10px;
	background: transparent;
	border: 1px solid rgba(148, 163, 184, 0.35);
	color: #fff;
}

body.gsm-loginex-skin .loginex-ui .loginex-btn {
	height: 54px;
	border-radius: 10px;
	background: linear-gradient(to left, #ffba02, #ffd54a);
	color: #0b1220;
	font-weight: 700;
	border: 0;
	box-shadow: 0 4px 50px rgba(255, 186, 2, 0.4);
}

/* Plan tabs with hidden radios */
.gsm-plan-tabs .plan-tabs__tab {
	position: relative;
	cursor: pointer;
}

.gsm-plan-tabs .plan-tabs__tab input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
	width: 0;
	height: 0;
}

/* Mobile */
@media (max-width: 767px) {
	body.m-ready .gsm-loginex-panel .loginex-field label,
	body.m-ready .gsm-loginex-panel .loginex-login-secret-label {
		font-size: 16px;
		line-height: 20px;
	}

	body.m-ready .gsm-loginex-panel .loginex-btn,
	body.m-ready .gsm-loginex-panel button.loginex-submit {
		margin-top: 28px;
		font-size: 16px;
		line-height: 20px;
	}
}