/* ART Elite authentication and confirmation surfaces */
:root {
	--art-ink: #070b11;
	--art-panel: #0e151e;
	--art-line: rgba(255, 255, 255, .14);
	--art-cyan: #7de8ff;
	--art-lime: #d5ff75;
	--art-muted: #9aa7b5;
}

/* WordPress core login, password-protected staging gate, lost password, and reset password */
body.art-elite-login {
	background: #05080d;
	color: #fff;
	font-family: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	min-height: 100vh;
}
body.art-elite-login:before {
	background: radial-gradient(circle at 72% 18%, rgba(125, 232, 255, .12), transparent 28%), linear-gradient(90deg, transparent, rgba(213, 255, 117, .035), transparent);
	content: '';
	inset: 0;
	pointer-events: none;
	position: fixed;
}
body.art-elite-login #login {
	margin: 0 auto;
	padding: 10vh 20px 50px;
	position: relative;
	width: min(100%, 460px);
}
body.art-elite-login #login:before {
	color: var(--art-cyan);
	content: 'ART ELITE  /  SECURE ACCESS';
	display: block;
	font-family: 'DM Mono', monospace;
	font-size: 9px;
	letter-spacing: .18em;
	margin: 0 0 24px 4px;
}
body.art-elite-login #login h1 { margin-bottom: 28px; }
body.art-elite-login #login h1 a,
body.art-elite-login #password-protected-logo a {
	background: none;
	color: #fff;
	display: block;
	font-family: 'Manrope', sans-serif;
	font-size: clamp(30px, 7vw, 48px);
	font-weight: 800;
	height: auto;
	letter-spacing: -.08em;
	line-height: .95;
	margin: 0;
	text-indent: 0;
	width: auto;
}
body.art-elite-login #login h1 a:after,
body.art-elite-login #password-protected-logo a:after {
	color: var(--art-cyan);
	content: 'AUDIO PERFORMANCE SYSTEMS';
	display: block;
	font-family: 'DM Mono', monospace;
	font-size: 9px;
	font-weight: 400;
	letter-spacing: .15em;
	margin-top: 12px;
}
body.art-elite-login #loginform,
body.art-elite-login #lostpasswordform,
body.art-elite-login #resetpassform,
body.art-elite-login form#loginform {
	background: rgba(14, 21, 30, .9);
	border: 1px solid var(--art-line);
	border-radius: 20px;
	box-shadow: 0 24px 80px rgba(0, 0, 0, .3);
	padding: 30px;
}
body.art-elite-login #login_error,
body.art-elite-login .message,
body.art-elite-login .success {
	background: rgba(125, 232, 255, .08);
	border: 1px solid rgba(125, 232, 255, .28);
	border-left: 3px solid var(--art-cyan);
	border-radius: 10px;
	box-shadow: none;
	color: rgba(255, 255, 255, .82);
	font-size: 13px;
	margin: 0 0 18px;
	padding: 14px 16px;
}
body.art-elite-login #login_error { border-left-color: #ed5966; }
body.art-elite-login label {
	color: rgba(255, 255, 255, .68);
	display: block;
	font-family: 'DM Mono', monospace;
	font-size: 9px;
	letter-spacing: .12em;
	margin-bottom: 8px;
	text-transform: uppercase;
}
body.art-elite-login input[type=text],
body.art-elite-login input[type=password],
body.art-elite-login input[type=email],
body.art-elite-login input[type=tel] {
	background: #080d14;
	border: 1px solid rgba(255, 255, 255, .16);
	border-radius: 10px;
	box-shadow: none;
	box-sizing: border-box;
	color: #fff;
	font-family: 'Manrope', sans-serif;
	font-size: 16px;
	margin: 0 0 18px;
	min-height: 50px;
	padding: 12px 14px;
	width: 100%;
}
body.art-elite-login input:focus {
	border-color: var(--art-cyan);
	box-shadow: 0 0 0 3px rgba(125, 232, 255, .12);
	outline: none;
}
body.art-elite-login .forgetmenot { color: var(--art-muted); }
body.art-elite-login input[type=checkbox] { accent-color: var(--art-lime); }
body.art-elite-login .button-primary,
body.art-elite-login input[type=submit] {
	background: var(--art-lime);
	border: 0;
	border-radius: 999px;
	box-shadow: none;
	color: var(--art-ink);
	cursor: pointer;
	font-weight: 800;
	min-height: 46px;
	padding: 0 22px;
	text-shadow: none;
}
body.art-elite-login .button-primary:hover,
body.art-elite-login input[type=submit]:hover { background: #e7ffaf; color: var(--art-ink); }
body.art-elite-login #nav,
body.art-elite-login #backtoblog,
body.art-elite-login .password-protected-text-below {
	color: rgba(255, 255, 255, .45);
	font-size: 12px;
	margin: 22px 0 0;
	text-align: center;
}
body.art-elite-login #nav a,
body.art-elite-login #backtoblog a,
body.art-elite-login .password-protected-text-below a { color: var(--art-cyan); }
body.art-elite-login .language-switcher { display: none; }

/* Front-end WooCommerce/customer-area login and registration */
body.art-auth-experience .page-wrapper,
body.art-confirmation-experience .page-wrapper { background: linear-gradient(180deg, #eef3f5 0, #f7f8f9 42%, #eef2f4 100%); }
body.art-auth-experience .content-area,
body.art-confirmation-experience .content-area { padding-bottom: clamp(60px, 8vw, 110px); padding-top: clamp(45px, 7vw, 90px); }
body.art-auth-experience .woocommerce,
body.art-auth-experience .customer-area,
body.art-auth-experience .user-registration,
body.art-confirmation-experience .woocommerce-order { margin: 0 auto; max-width: 1180px; }
body.art-auth-experience .woocommerce > h1,
body.art-auth-experience .woocommerce > h2,
body.art-auth-experience .user-registration h2,
body.art-confirmation-experience .woocommerce-order > h2 {
	color: var(--art-ink);
	font-size: clamp(34px, 5vw, 64px);
	letter-spacing: -.07em;
	line-height: .95;
	margin-bottom: 30px;
}
body.art-auth-experience .woocommerce form.login,
body.art-auth-experience .woocommerce form.register,
body.art-auth-experience .woocommerce form.lost_reset_password,
body.art-auth-experience .user-registration,
body.art-confirmation-experience .woocommerce-order-overview,
body.art-confirmation-experience .woocommerce-order-details,
body.art-confirmation-experience .woocommerce-customer-details {
	background: #fff;
	border: 1px solid rgba(7, 11, 17, .08);
	border-radius: 20px;
	box-shadow: 0 24px 70px rgba(7, 11, 17, .08);
	padding: clamp(24px, 5vw, 48px);
}
body.art-auth-experience .woocommerce form.login label,
body.art-auth-experience .woocommerce form.register label,
body.art-auth-experience .woocommerce form.lost_reset_password label,
body.art-auth-experience .user-registration label {
	color: #586775;
	font-family: 'DM Mono', monospace;
	font-size: 9px;
	letter-spacing: .12em;
	text-transform: uppercase;
}
body.art-auth-experience .woocommerce form input.input-text,
body.art-auth-experience .woocommerce form input[type=email],
body.art-auth-experience .woocommerce form input[type=password],
body.art-auth-experience .woocommerce form input[type=text],
body.art-auth-experience .user-registration input,
body.art-auth-experience .user-registration select,
body.art-auth-experience .user-registration textarea {
	background: #f7fafb;
	border: 1px solid rgba(7, 11, 17, .14);
	border-radius: 10px;
	box-shadow: none;
	min-height: 48px;
}
body.art-auth-experience .woocommerce form input:focus,
body.art-auth-experience .user-registration input:focus,
body.art-auth-experience .user-registration select:focus,
body.art-auth-experience .user-registration textarea:focus { border-color: #1d6473; box-shadow: 0 0 0 3px rgba(29,100,115,.1); }
body.art-auth-experience .woocommerce form .button,
body.art-auth-experience .user-registration button,
body.art-auth-experience .user-registration input[type=submit] { border-radius: 999px; font-weight: 800; }
body.art-confirmation-experience .woocommerce-notice--success { background: rgba(213,255,117,.18); border-left: 3px solid #6c941b; border-radius: 10px; color: #20300a; padding: 15px 18px; }
body.art-confirmation-experience .woocommerce-order-overview { display: grid; gap: 16px; grid-template-columns: repeat(4, minmax(0, 1fr)); list-style: none; }
body.art-confirmation-experience .woocommerce-order-overview li { border-right: 1px solid rgba(7,11,17,.1); color: #687681; font-family: 'DM Mono', monospace; font-size: 10px; letter-spacing: .08em; padding-right: 16px; text-transform: uppercase; }
body.art-confirmation-experience .woocommerce-order-overview li strong { color: var(--art-ink); display: block; font-family: 'Manrope', sans-serif; font-size: 16px; letter-spacing: -.02em; margin-top: 7px; text-transform: none; }

@media only screen and (max-width: 48em) {
	body.art-elite-login #login { padding-top: 7vh; }
	body.art-elite-login #loginform,
	body.art-elite-login #lostpasswordform,
	body.art-elite-login #resetpassform,
	body.art-elite-login form#loginform { padding: 22px; }
	body.art-confirmation-experience .woocommerce-order-overview { display: block; }
	body.art-confirmation-experience .woocommerce-order-overview li { border-bottom: 1px solid rgba(7,11,17,.1); border-right: 0; margin-bottom: 12px; padding: 0 0 12px; }
}