/* Halaman login — glassmorphism + gradasi hijau bergerak */
:root{--g1:#0b7a2b;--g2:#08591f;--g3:#18a03c;--y:#f6c90e}
html{background:#052e16}
body.login{
	font-family:"Plus Jakarta Sans","Segoe UI",system-ui,sans-serif;
	min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;
	background:linear-gradient(130deg,#03240f,#08591f 35%,#0b7a2b 60%,#18a03c 85%,#5fc43a);
	background-size:300% 300%;animation:mtsnbg 16s ease infinite;overflow-x:hidden;position:relative}
@keyframes mtsnbg{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
body.login::before,body.login::after{content:"";position:fixed;border-radius:50%;filter:blur(70px);opacity:.55;z-index:0;pointer-events:none}
body.login::before{width:380px;height:380px;background:#f6c90e;top:-110px;left:-90px;animation:mtsnfloat 12s ease-in-out infinite}
body.login::after{width:460px;height:460px;background:#7ed321;bottom:-160px;right:-120px;animation:mtsnfloat 15s ease-in-out infinite reverse}
@keyframes mtsnfloat{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(40px,30px) scale(1.12)}}

body.login #login{position:relative;z-index:1;width:min(410px,92vw)!important;padding:24px 0!important;margin:0 auto}
.login h1{text-align:center}
.login h1 a{
	width:104px;height:116px;margin:0 auto 6px;
	background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 112'><path d='M50 4 L92 18 V58 C92 84 70 100 50 108 C30 100 8 84 8 58 V18 Z' fill='%2308591f' stroke='%23f6c90e' stroke-width='5'/><text x='50' y='64' text-anchor='middle' font-family='Arial' font-weight='700' font-size='22' fill='%23f6c90e'>MTsN</text></svg>");
	background-size:contain;background-repeat:no-repeat;background-position:center;
	filter:drop-shadow(0 8px 14px rgba(0,0,0,.35));transition:transform .3s}
.login h1 a:hover{transform:translateY(-3px) scale(1.05)}
.mtsn-login-title{text-align:center;color:#fff;margin:0 0 18px}
.mtsn-login-title strong{display:block;font-family:Poppins,sans-serif;font-weight:800;font-size:1.55rem;letter-spacing:-.01em;text-shadow:0 3px 12px rgba(0,0,0,.3)}
.mtsn-login-title span{display:block;margin-top:4px;font-size:.9rem;opacity:.92}

/* Kartu kaca */
.login form{
	margin-top:0;padding:26px 26px 22px;border-radius:26px;color:#fff;
	background:rgba(255,255,255,.14);
	-webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%);
	border:1px solid rgba(255,255,255,.38);box-shadow:0 24px 60px rgba(0,0,0,.35)}
.login label{color:#fff;font-weight:600;font-size:.9rem}
.login form .input,.login input[type=text],.login input[type=password],.login input[type=email]{
	background:rgba(255,255,255,.94);color:#12311d;border:2px solid transparent;border-radius:14px;
	padding:10px 14px;font-size:1rem;min-height:46px;box-shadow:none;margin:4px 0 14px;transition:border-color .2s,box-shadow .2s}
.login input[type=text]:focus,.login input[type=password]:focus,.login input[type=email]:focus{
	border-color:var(--y);box-shadow:0 0 0 4px rgba(246,201,14,.38);outline:0}
.login .wp-pwd .input{padding-right:48px}
.login .button.wp-hide-pw{color:var(--g1);min-height:46px;top:4px}
.login .button.wp-hide-pw:hover,.login .button.wp-hide-pw:focus{color:var(--g2);background:transparent;border-color:transparent;box-shadow:none}
.login .forgetmenot{float:none;margin:2px 0 0;display:flex;align-items:center;gap:8px}
.login input[type=checkbox]{accent-color:var(--y);border-radius:6px;width:18px;height:18px;margin:0}
.login input[type=checkbox]:checked::before{filter:none}
.login form .forgetmenot label{font-weight:500}
.login form .submit{float:none;margin-top:18px}
body.login .button-primary{
	width:100%;float:none;height:48px;border:0;border-radius:14px;
	background:linear-gradient(135deg,#f6c90e,#ffb300);color:#3b2f00;font-family:Poppins,sans-serif;font-weight:700;font-size:1rem;letter-spacing:.02em;
	text-shadow:none;box-shadow:0 10px 22px rgba(246,201,14,.42);transition:transform .2s,box-shadow .2s,filter .2s}
body.login .button-primary:hover,body.login .button-primary:focus{
	background:linear-gradient(135deg,#ffd84d,#ffb300);color:#3b2f00;transform:translateY(-2px);box-shadow:0 14px 28px rgba(246,201,14,.55);filter:saturate(1.1)}
body.login .button-primary:active{transform:translateY(0)}

/* Tautan & pesan */
.login #nav,.login #backtoblog,.login .privacy-policy-page-link{text-align:center;margin:14px 0 0;padding:0}
.login #nav a,.login #backtoblog a,.login .privacy-policy-page-link a{color:rgba(255,255,255,.92);text-shadow:0 1px 6px rgba(0,0,0,.25);transition:color .2s}
.login #nav a:hover,.login #backtoblog a:hover,.login .privacy-policy-page-link a:hover{color:var(--y)}
.login .message,.login .success,.login #login_error,.login .notice{
	border:0;border-left:5px solid var(--y);border-radius:14px;background:rgba(255,255,255,.95);color:#12311d;box-shadow:0 8px 22px rgba(0,0,0,.2);margin:0 0 16px}
.login #login_error{border-left-color:#ef4444}
.login .language-switcher{position:relative;z-index:1;margin:10px auto}
.login .language-switcher select,.login .language-switcher .button{border-radius:10px}
@media (prefers-reduced-motion:reduce){body.login,body.login::before,body.login::after{animation:none}}
