/* Tela de login dividida (wp-login.php): painel com imagem e card da campanha à esquerda, formulário à direita.
   Usa os tokens de tokens.css. Dados do card: content/login.json. */
body.pd-login {
	margin: 0; background: var(--pd-bg);
	display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: 1fr auto auto 1fr; min-height: 100vh; min-height: 100dvh;
	font-family: var(--pd-font); color: var(--pd-text);
}

/* ---------- Painel esquerdo ---------- */
.pd-login__aside {
	grid-column: 1; grid-row: 1 / span 4; position: relative;
	display: flex; align-items: center; justify-content: center; padding: 48px;
	color: #fff;
	background-color: #0a0f23;
	background-image: linear-gradient(160deg, rgba(10,15,35,.88) 0%, rgba(15,23,42,.96) 100%), var(--pd-login-bg, none);
	background-size: cover; background-position: center top;
}
.pd-login__aside-inner { width: 100%; max-width: 450px; }
.pd-login__promo {
	padding: 32px; border-radius: 16px;
	background: rgba(10, 18, 40, .72); border: 1px solid rgba(110, 193, 228, .35);
	backdrop-filter: blur(6px); box-shadow: 0 16px 48px rgba(0, 0, 0, .4);
}
.pd-login__badges { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 16px; }
.pd-login__badge { display: inline-block; padding: 4px 11px; border-radius: 999px; border: 1px solid; font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; }
.pd-login__badge--gold { color: #fbbf24; border-color: rgba(251, 191, 36, .5); background: rgba(251, 191, 36, .12); }
.pd-login__badge--blue { color: #7dd3fc; border-color: rgba(125, 211, 252, .45); background: rgba(125, 211, 252, .12); text-transform: none; letter-spacing: .02em; }
.pd-login__promo h2 { margin: 0 0 12px; color: #fff; font-size: 32px; line-height: 1.15; font-weight: 700; }
.pd-login__promo-text { margin: 0 0 24px; color: rgba(255, 255, 255, .86); font-size: 15px; line-height: 1.6; }
.pd-login__promo-text strong { color: #fff; font-size: 16px; }
body.pd-login a.pd-login__promo-btn {
	display: block; padding: 14px 18px; border-radius: 6px; text-align: center; text-decoration: none;
	background: #25D366; color: #0b2a17; font-size: 15px; font-weight: 800; text-transform: uppercase; letter-spacing: .01em;
}
body.pd-login a.pd-login__promo-btn:hover, body.pd-login a.pd-login__promo-btn:focus-visible { background: #1fb957; color: #0b2a17; }

/* ---------- Formulário ---------- */
body.pd-login #login { box-sizing: border-box; grid-column: 2; grid-row: 2; width: 100%; max-width: 482px; margin: 0 auto; padding: 0 16px; align-self: end; }
body.pd-login #login h1 { margin: 0; }
body.pd-login #login h1 a {
	display: block; width: 100%; height: 76px; margin: 0 0 32px; padding: 0; text-indent: -9999px; overflow: hidden;
	background: var(--pd-login-logo, none) no-repeat center / contain;
}
.login-heading .pd-heading-top-row { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.login-heading h2 { margin: 0; font-size: 26px; font-weight: 700; color: #1E293B; }
.login-heading .pd-heading-top-row a { font-size: 14px; font-weight: 700; text-decoration: none; }
.login-heading .pd-login-subtitle { margin: 6px 0 36px; color: #5b6b8c; font-size: 14px; }

body.pd-login form { margin: 0; padding: 0; border: 0; box-shadow: none; background: transparent; display: flex; flex-wrap: wrap; align-items: center; }
/* Rótulos só para leitores de tela: o texto aparece como placeholder. */
body.pd-login form label[for="user_login"], body.pd-login form label[for="user_pass"], body.pd-login form label[for="user_email"] {
	position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
body.pd-login #loginform > p:first-child, body.pd-login #loginform .user-pass-wrap, body.pd-login form > p:first-child, body.pd-login .user-pass-wrap { flex: 0 0 100%; margin: 0 0 18px; position: relative; }
body.pd-login input[type="text"], body.pd-login input[type="password"], body.pd-login input[type="email"] {
	box-sizing: border-box; width: 100%; height: 40px; margin: 0; padding: 0 14px 0 44px; border: 1px solid var(--pd-border); border-radius: 4px;
	background-color: #fff; background-repeat: no-repeat; background-position: 14px center; background-size: 16px;
	font-size: 16px; color: var(--pd-text); box-shadow: none;
}
body.pd-login #user_login, body.pd-login #user_email {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23334155' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c0-4.4 3.6-8 8-8s8 3.6 8 8'/%3E%3C/svg%3E");
}
body.pd-login #user_pass {
	padding-right: 44px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23334155' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='7.5' cy='15.5' r='4.5'/%3E%3Cpath d='M11 12l9-9M16 7l3 3M14 9l2 2'/%3E%3C/svg%3E");
}
body.pd-login input::placeholder { color: #94a3b8; opacity: 1; }
body.pd-login .wp-pwd { position: relative; }
body.pd-login .button.wp-hide-pw { position: absolute; top: 0; right: 0; width: 44px; height: 40px; min-height: 0; padding: 0; background: transparent; border: 0; color: var(--pd-muted-text); box-shadow: none; }

body.pd-login .forgetmenot { order: 3; align-self: baseline; flex: 0 1 auto; float: none; display: flex; align-items: center; gap: 8px; margin: 2px 0 28px; }
body.pd-login .forgetmenot label { margin: 0; font-size: 15px; color: var(--pd-text); }
body.pd-login input[type="checkbox"] { width: 22px; height: 22px; margin: 0; border: 1px solid #cbd5e1; border-radius: 4px; background: #fff; }
body.pd-login a.pd-login__forgot { order: 4; align-self: baseline; margin: 2px 0 28px auto; font-size: 14px; color: #475569; text-decoration: none; }
body.pd-login a.pd-login__forgot:hover { color: var(--pd-accent-text); }
body.pd-login .submit { order: 5; flex: 0 0 100%; margin: 0; }
body.pd-login #wp-submit { width: 100%; min-height: 51px; font-size: 15px; }

/* Na tela de login o "Cadastre-se | Esqueceu a senha?" de baixo é substituído pelos links do cabeçalho e da linha do "Lembrar-me". */
body.pd-login.pd-login-entry #nav, body.pd-login #backtoblog { display: none; }
body.pd-login #nav { margin: 18px 0 0; padding: 0; text-align: center; font-size: 14px; }

/* Como no legado, só "Termos de uso" aparece (o texto "e Política de privacidade" do BuddyBoss fica oculto; a política segue no modal dos termos). */
body.pd-login .privacy-policy-page-link { margin: 44px 0 0; text-align: center; font-size: 0; }
body.pd-login .privacy-policy-page-link .privacy-link { display: none; }
body.pd-login .privacy-policy-page-link a.terms-link { color: #5b6b8c; font-size: 13px; font-weight: 700; text-decoration: none; }
body.pd-login .privacy-policy-page-link a.terms-link:hover { color: var(--pd-accent-text); }

body.pd-login .message, body.pd-login .success, body.pd-login #login_error { margin: 0 0 18px; padding: 12px 16px; border-radius: 8px; background: var(--pd-surface); border: 1px solid var(--pd-border); border-left: 4px solid var(--pd-info); box-shadow: none; }
body.pd-login #login_error { border-left-color: var(--pd-error); }

body.pd-login .language-switcher { grid-column: 2; grid-row: 3; align-self: start; width: 100%; max-width: 482px; margin: 0 auto; padding: 36px 16px 24px; box-sizing: border-box; }
body.pd-login .language-switcher form { width: max-content; max-width: 100%; margin: 0 auto; gap: 6px 8px; flex-wrap: nowrap; flex-wrap: wrap; }
body.pd-login .language-switcher label { position: static; flex: 0 0 100%; width: auto; height: auto; margin: 0; clip: auto; color: var(--pd-heading); font-size: 14px; }
body.pd-login .language-switcher select {
	appearance: none; height: 40px; min-width: 0; flex: 1 1 150px; max-width: 220px; border: 1px solid var(--pd-border); border-radius: 4px; padding: 0 34px 0 12px; color: var(--pd-text);
	background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23334155' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 10px center / 14px;
}
body.pd-login .language-switcher .button, body.pd-login .language-switcher input[type="submit"] {
	min-height: 40px; padding: 0 18px; border: 0; border-radius: var(--pd-radius-btn); background: var(--pd-soft); color: var(--pd-text); font-size: 14px; box-shadow: none; cursor: pointer;
}

/* ---------- Etapa do código (2FA) ---------- */
body.pd-login .pd-2fa__text { max-width: 360px; margin: 0 auto 30px; text-align: center; font-size: 15px; line-height: 1.5; color: #1E293B; }
body.pd-login #pd2fa { max-width: 360px; margin: 0 auto; }
body.pd-login #pd2fa .pd-2fa__field { flex: 0 0 100%; margin: 0 0 28px; }
body.pd-login #pd2fa label[for="pd-code"] { position: static; width: auto; height: auto; margin: 0 0 8px; clip: auto; display: block; font-size: 16px; color: var(--pd-heading); }
body.pd-login input.pd-2fa__code { height: 44px; padding: 0 14px; text-align: center; font-size: 24px; letter-spacing: .35em; background-image: none; }
body.pd-login input.pd-2fa__code::placeholder { letter-spacing: .35em; color: #cbd5e1; }
body.pd-login #pd2fa .pd-2fa__links { flex: 0 0 100%; display: flex; flex-direction: column; align-items: center; gap: 12px; margin: 26px 0 0; order: 6; }
body.pd-login #pd2fa .submit .button { width: 100%; min-height: 51px; font-size: 15px; }
body.pd-login a.pd-2fa__cancel { color: #334155; font-size: 16px; text-decoration: none; }
body.pd-login a.pd-2fa__cancel:hover { color: var(--pd-accent-text); }
body.pd-login .pd-2fa__resend { border: 0; background: transparent; padding: 0; color: var(--pd-muted-text); font-size: 14px; text-decoration: underline; cursor: pointer; }
body.pd-login .pd-2fa__resend:hover { color: var(--pd-accent-text); }

/* ---------- Botão principal e foco ---------- */
body.pd-login .button-primary, body.pd-login #wp-submit {
	background: var(--pd-accent-bg); border: 1px solid var(--pd-accent-bg); color: #fff; border-radius: var(--pd-radius-btn);
	text-shadow: none; box-shadow: none; font-weight: 500; cursor: pointer;
}
body.pd-login .button-primary:hover, body.pd-login .button-primary:focus, body.pd-login #wp-submit:hover { background: var(--pd-accent-hover); border-color: var(--pd-accent-hover); color: #fff; }
body.pd-login a { color: var(--pd-accent-text); }
body.pd-login a:hover { color: var(--pd-highlight); }
body.pd-login input[type="checkbox"]:checked { accent-color: var(--pd-accent); }
body.pd-login input:focus { border-color: var(--pd-accent); box-shadow: 0 0 0 3px rgba(235, 93, 55, .12); outline: none; }

@media (max-width: 900px) {
	body.pd-login { display: block; }
	.pd-login__aside { display: none; }
	body.pd-login #login { padding: 32px 20px 0; }
	body.pd-login .language-switcher { padding: 28px 20px 32px; }
}
