/*
 * Bloco de balancetes.
 *
 * Nenhum seletor .eael-* aqui: a marcacao e nossa. A restilizacao da barra de
 * abas do Essential Addons e assunto separado, e la vale a lista de seletores
 * seguros do CLAUDE.md -- local roda 6.8.3 e producao 5.9.26.
 *
 * As cores sao custom properties para o cliente conseguir ajustar pelo "CSS
 * adicional" do Customizer sem tocar no plugin.
 */

.akdw-bal {
	--akdw-verde: #127340;
	--akdw-verde-claro: #f3f7f6;
	--akdw-vermelho: #b31c25;
	--akdw-texto: #16181a;
	--akdw-suave: #8e9298;
	--akdw-borda: #e3e5e7;
	--akdw-borda-interna: #f0f1f2;
	--akdw-fundo: #ffffff;
	--akdw-info: #f6f6f6;
	--akdw-raio: 10px;

	max-width: 880px;
	margin: 0 auto;
	color: var(--akdw-texto);
	text-align: left;
}

.akdw-bal svg {
	width: 100%;
	height: 100%;
	display: block;
}

/* ---------------------------------------------------------------- cabecalho */

.akdw-bal__cab {
	text-align: center;
	margin-bottom: 26px;
}

.akdw-bal__cab-titulo {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 14px;
}

.akdw-bal__cab-icone {
	width: 44px;
	height: 44px;
	flex: 0 0 44px;
	padding: 9px;
	border: 2px solid var(--akdw-verde);
	border-radius: 50%;
	color: var(--akdw-verde);
	box-sizing: border-box;
}

.akdw-bal .akdw-bal__titulo {
	margin: 0;
	font-size: 2rem;
	line-height: 1.1;
	font-weight: 700;
	letter-spacing: 0.02em;
	text-transform: uppercase;
	color: var(--akdw-texto);
}

.akdw-bal__sub {
	margin: 12px 0 0;
	color: #5b5f63;
	font-size: 0.95rem;
}

.akdw-bal__divisor {
	display: flex;
	align-items: center;
	max-width: 260px;
	margin: 18px auto 0;
}

.akdw-bal__divisor::before,
.akdw-bal__divisor::after {
	content: "";
	flex: 1;
	height: 1px;
	background: var(--akdw-borda);
}

.akdw-bal__divisor span {
	width: 56px;
	height: 3px;
	border-radius: 2px;
	background: var(--akdw-verde);
}

/* -------------------------------------------------------------- ano (cartao) */

.akdw-bal__ano {
	background: var(--akdw-fundo);
	border: 1px solid var(--akdw-borda);
	border-radius: var(--akdw-raio);
	margin-bottom: 12px;
	overflow: hidden;
}

.akdw-bal__ano-cab {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 16px 20px;
	cursor: pointer;
	font-weight: 700;
	font-size: 1.25rem;
	color: var(--akdw-verde);
	list-style: none;
	user-select: none;
}

/* O marcador nativo do <summary> em cada navegador. */
.akdw-bal__ano-cab::-webkit-details-marker {
	display: none;
}

.akdw-bal__ano-cab::marker {
	content: "";
}

.akdw-bal__ano-icone {
	width: 24px;
	height: 24px;
	flex: 0 0 24px;
}

.akdw-bal__ano-num {
	flex: 1;
}

.akdw-bal__chevron {
	width: 20px;
	height: 20px;
	flex: 0 0 20px;
	color: var(--akdw-suave);
	transition: transform 0.18s ease;
}

.akdw-bal__ano[open] .akdw-bal__chevron {
	transform: rotate(180deg);
}

/* --------------------------------------------------------------------- linha */

.akdw-bal__linha,
.akdw-bal__zip {
	display: grid;
	grid-template-columns: 22px 1fr auto auto;
	align-items: center;
	gap: 14px;
	padding: 12px 20px;
	border-top: 1px solid var(--akdw-borda-interna);
	text-decoration: none;
	color: var(--akdw-texto);
}

.akdw-bal a.akdw-bal__linha:hover,
.akdw-bal a.akdw-bal__zip:hover {
	background: #fafbfb;
	text-decoration: none;
}

.akdw-bal__icone {
	width: 22px;
	height: 22px;
	color: var(--akdw-suave);
}

.akdw-bal__icone--pdf {
	color: var(--akdw-vermelho);
}

.akdw-bal__icone--planilha,
.akdw-bal__icone--zip,
.akdw-bal__icone--info {
	color: var(--akdw-verde);
}

.akdw-bal__nome {
	min-width: 0;
	overflow-wrap: anywhere;
}

.akdw-bal__tam {
	color: var(--akdw-suave);
	font-size: 0.9rem;
	white-space: nowrap;
}

.akdw-bal__baixar {
	display: flex;
	align-items: center;
	gap: 8px;
	padding-left: 16px;
	border-left: 1px solid var(--akdw-borda);
	color: var(--akdw-verde);
	font-weight: 600;
	white-space: nowrap;
}

.akdw-bal__baixar svg {
	width: 17px;
	height: 17px;
}

.akdw-bal__linha--ausente .akdw-bal__nome {
	color: var(--akdw-suave);
}

.akdw-bal__aviso {
	grid-column: 3 / -1;
	color: var(--akdw-vermelho);
	font-size: 0.85rem;
	white-space: nowrap;
}

/* ----------------------------------------------------------------- faixa zip */

.akdw-bal__zip {
	background: var(--akdw-verde-claro);
	border-top: 1px solid var(--akdw-borda);
	font-weight: 600;
	color: var(--akdw-verde);
}

.akdw-bal a.akdw-bal__zip:hover {
	background: #eaf3ee;
}

.akdw-bal__botao {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 9px 16px;
	border: 1px solid var(--akdw-borda);
	border-radius: 7px;
	background: var(--akdw-fundo);
	color: var(--akdw-verde);
	font-weight: 600;
	font-size: 0.9rem;
	white-space: nowrap;
	text-decoration: none;
}

.akdw-bal__botao svg {
	width: 17px;
	height: 17px;
}

/* ---------------------------------------------------------------- rodape info */

.akdw-bal__info {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	margin-top: 22px;
	padding: 18px 20px;
	background: var(--akdw-info);
	border: 1px solid var(--akdw-borda);
	border-radius: var(--akdw-raio);
	font-size: 0.9rem;
	line-height: 1.6;
	color: #4c5155;
}

.akdw-bal__info-texto {
	display: flex;
	align-items: flex-start;
	gap: 14px;
}

.akdw-bal__info-texto .akdw-bal__icone {
	flex: 0 0 22px;
	margin-top: 2px;
}

.akdw-bal__info strong {
	color: var(--akdw-texto);
}

.akdw-bal__vazio {
	padding: 24px;
	text-align: center;
	color: var(--akdw-suave);
	border: 1px dashed var(--akdw-borda);
	border-radius: var(--akdw-raio);
}

/* ------------------------------------------------------------------ estreito */

@media (max-width: 640px) {
	/* Duas linhas por item: nome em cima, tamanho e acao lado a lado embaixo. */
	.akdw-bal__linha,
	.akdw-bal__zip {
		grid-template-columns: 22px 1fr auto;
		row-gap: 8px;
		padding: 14px 16px;
	}

	.akdw-bal__nome {
		grid-column: 2 / -1;
	}

	.akdw-bal__tam {
		grid-column: 2;
	}

	.akdw-bal__baixar,
	.akdw-bal__botao,
	.akdw-bal__aviso {
		grid-column: 3;
		justify-self: end;
	}

	.akdw-bal__baixar {
		padding-left: 0;
		border-left: 0;
	}

	.akdw-bal__ano-cab {
		padding: 14px 16px;
	}

	.akdw-bal__info {
		flex-direction: column;
		align-items: flex-start;
	}
}
