/**
 * A conta no site (9 Out 2026): o «Guardar» do artigo (12a), o «Eu» e as
 * listas do painel no modelo do 12d, e o passo do email do «Entrar» (12c).
 *
 * Folha à mão (como paginas.css): só cores por token (var(--sp-…, #recurso)),
 * tipografia em passos inteiros, mobile-first, alvos de toque de 44 px.
 *
 * @package SuperPortistas
 */

/* ==========================================================================
   12a: Guardar
   ========================================================================== */

.sp-guardar[aria-pressed='true'],
.sp-guardar.is-guardado {
	border-color: var(--sp-porto, #004b9b);
	background: var(--sp-porto-light, #e8f0fa);
	color: var(--sp-porto, #004b9b);
}

.sp-guardar[aria-pressed='true'] svg path {
	fill: currentColor;
}

.sp-guardar[disabled] {
	opacity: 0.6;
	cursor: progress;
}

/* ==========================================================================
   12d: o painel da conta
   ========================================================================== */

.sp-conta .sp-instit__indice .sp-conta__sair {
	color: var(--sp-danger-ink, #b91c1c);
}

.sp-conta__painel {
	margin-top: 20px;
}

.sp-conta__faixa {
	margin-top: 16px;
}

/* O cartão do perfil (Eu): avatar 56, nome, email e «Google · desde Set 2026». */
.sp-conta-perfil {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 16px;
	border: 1px solid var(--sp-border, #dfe5ee);
	border-radius: 16px;
	background: var(--sp-surface, #fff);
	color: var(--sp-ink, #0f172a);
	text-decoration: none;
}

.sp-conta-perfil:hover {
	border-color: var(--sp-porto, #004b9b);
}

.sp-conta-perfil__foto {
	flex: none;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	object-fit: cover;
	font-size: 20px;
}

.sp-conta-perfil__texto {
	display: grid;
	flex: 1;
	min-width: 0;
	gap: 2px;
}

.sp-conta-perfil__nome {
	font: 700 18px/22px 'Libre Franklin', sans-serif;
}

.sp-conta-perfil__email,
.sp-conta-perfil__meta {
	overflow: hidden;
	font: 400 13px/18px 'Libre Franklin', sans-serif;
	color: var(--sp-ink-muted, #475569);
	text-overflow: ellipsis;
	white-space: nowrap;
}

.sp-conta-cartao {
	margin-top: 12px;
	padding: 14px 16px;
	border: 1px solid var(--sp-warn-border, #fcd34d);
	border-radius: 12px;
	background: var(--sp-warn-bg, #fffbeb);
}

.sp-conta-cartao__titulo {
	margin: 0;
	font: 700 15px/20px 'Libre Franklin', sans-serif;
	color: var(--sp-warn-ink, #92400e);
}

.sp-conta-cartao__texto {
	margin: 4px 0 0;
	font: 400 14px/20px 'Libre Franklin', sans-serif;
	color: var(--sp-ink-strong, #33415c);
}

/* Os grupos de linhas (As tuas equipas e alertas · Actividade · App e conta). */
.sp-conta-grupo {
	margin-top: 24px;
}

.sp-conta-grupo__titulo {
	margin: 0 0 8px;
}

.sp-conta-grupo__linhas {
	margin: 0;
	padding: 0;
	overflow: hidden;
	border: 1px solid var(--sp-border, #dfe5ee);
	border-radius: 16px;
	background: var(--sp-surface, #fff);
	list-style: none;
}

.sp-conta-grupo__linhas li + li {
	border-top: 1px solid var(--sp-border, #dfe5ee);
}

.sp-conta-linha {
	display: flex;
	align-items: center;
	gap: 10px;
	min-height: 52px;
	padding: 0 12px 0 16px;
	color: var(--sp-ink, #0f172a);
	text-decoration: none;
}

.sp-conta-linha:hover,
.sp-conta-linha:focus-visible {
	background: var(--sp-surface-raised, #f8fafc);
}

.sp-conta-linha__rotulo {
	flex: 1;
	min-width: 0;
	font: 500 15px/20px 'Libre Franklin', sans-serif;
}

.sp-conta-linha__valor {
	overflow: hidden;
	max-width: 50%;
	font: 400 14px/20px 'Libre Franklin', sans-serif;
	color: var(--sp-ink-muted, #475569);
	text-overflow: ellipsis;
	white-space: nowrap;
}

.sp-conta-linha .sp-pg-ico {
	color: var(--sp-ink-soft, #7c8aa5);
}

.sp-conta-eu__sair {
	margin: 24px 0 0;
}

.sp-conta-eu__sair a {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	font: 600 15px/1 'Libre Franklin', sans-serif;
	color: var(--sp-danger-ink, #b91c1c);
}

.sp-conta-eu__rodape {
	margin: 8px 0 0;
	font: 400 12px/16px 'Libre Franklin', sans-serif;
	color: var(--sp-ink-soft, #7c8aa5);
}

/* Listas: guardados, caixa, bloqueados. */
.sp-conta-lista {
	margin: 0;
	padding: 0;
	list-style: none;
}

.sp-conta-lista__item {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 12px;
	padding: 14px 0;
	border-bottom: 1px solid var(--sp-border, #dfe5ee);
}

.sp-conta-lista__item.is-indisponivel {
	opacity: 0.7;
}

.sp-conta-lista__item.is-nova .sp-conta-lista__titulo::before {
	content: '';
	display: inline-block;
	width: 8px;
	height: 8px;
	margin-right: 6px;
	border-radius: 50%;
	background: var(--sp-porto, #004b9b);
	vertical-align: middle;
}

.sp-conta-lista__texto {
	display: grid;
	flex: 1;
	min-width: 0;
	gap: 4px;
}

.sp-conta-lista__kicker {
	font: 700 11px/13px 'Libre Franklin', sans-serif;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--sp-ink-muted, #475569);
}

.sp-conta-lista__titulo {
	font: 600 17px/22px 'Source Serif 4', Georgia, serif;
	color: var(--sp-ink, #0f172a);
	text-decoration: none;
}

a.sp-conta-lista__titulo:hover {
	color: var(--sp-porto, #004b9b);
}

.sp-conta-lista__resumo {
	font: 400 14px/20px 'Libre Franklin', sans-serif;
	color: var(--sp-ink-strong, #33415c);
}

.sp-conta-lista__meta {
	font: 500 12px/16px 'Libre Franklin', sans-serif;
	color: var(--sp-ink-soft, #7c8aa5);
}

.sp-conta-lista__imagem {
	flex: none;
	width: 96px;
	height: 72px;
	border-radius: 8px;
	object-fit: cover;
}

.sp-conta-lista__accao {
	min-height: 44px;
	padding: 0 4px;
	border: 0;
	background: none;
	font: 600 13px/1 'Libre Franklin', sans-serif;
	color: var(--sp-porto, #004b9b);
	cursor: pointer;
}

.sp-conta-lista__accao[disabled] {
	opacity: 0.5;
}

.sp-conta-vazio {
	padding: 32px 16px;
	text-align: center;
}

.sp-conta-vazio__titulo {
	margin: 0;
	font: 700 24px/29px 'Source Serif 4', Georgia, serif;
	color: var(--sp-ink, #0f172a);
}

.sp-conta-vazio__texto {
	margin: 8px auto 0;
	max-width: 420px;
	font: 400 15px/22px 'Libre Franklin', sans-serif;
	color: var(--sp-ink-muted, #475569);
}

/* ==========================================================================
   12c: Entrar só pelo email
   ========================================================================== */

.sp-auth__passo {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 4px 12px;
	margin: 0 0 12px;
	font: 400 14px/20px 'Libre Franklin', sans-serif;
	color: var(--sp-ink-muted, #475569);
}

.sp-auth__ligacao {
	min-height: 44px;
	padding: 0;
	border: 0;
	background: none;
	font: 600 14px/1 'Libre Franklin', sans-serif;
	color: var(--sp-porto, #004b9b);
	cursor: pointer;
}

.sp-auth__aviso {
	margin: 0;
	padding: 10px 12px;
	border-radius: 10px;
	background: var(--sp-info-bg, #eff6ff);
	font: 500 14px/20px 'Libre Franklin', sans-serif;
	color: var(--sp-info-ink, #003d7a);
}

/* A foto do autor da Comunidade no cabeçalho do artigo. */
.sp-avatar--foto {
	object-fit: cover;
}
