/**
 * attachment.css — página de anexo (attachment.php).
 *
 * Enfileirado apenas em is_attachment() (ver inc/enqueue.php). Camada sobre o
 * Bootstrap e os tokens --ee-*. Cobre: imagem, descrição, ações (WhatsApp,
 * imprimir), miniaturas das outras imagens da galeria e o botão "voltar à
 * postagem" (reaproveita o visual de .post-navigation do single).
 *
 * O "imprimir só a imagem" é tratado por print.css (media=print).
 */

/* ==========================================================================
   1. Imagem e descrição
   ========================================================================== */
.ee-attachment-figure {
	margin: 0;
	text-align: center;
}

.ee-attachment-img {
	max-width: 100%;
	height: auto;
}

.ee-attachment-caption {
	line-height: 1.4;
}

.ee-attachment-description {
	font-size: 1.05rem;
	line-height: 1.65;
	color: var(--ee-text);
}

.ee-attachment-description p:last-child {
	margin-bottom: 0;
}

/* ==========================================================================
   2. Ações (WhatsApp + imprimir)
   ========================================================================== */
.ee-attachment-btn {
	display: inline-flex;
	align-items: center;
	gap: var(--ee-space-2);
	font-weight: 600;
	border: 1px solid var(--ee-border);
	border-radius: var(--ee-radius-md);
	padding: 0.5rem 1rem;
	background: #fff;
	color: var(--ee-blue-dark);
	transition: border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease;
}

.ee-attachment-btn:hover,
.ee-attachment-btn:focus {
	border-color: var(--ee-blue);
	color: var(--ee-blue-dark);
}

.ee-attachment-btn svg {
	flex: 0 0 auto;
}

/* WhatsApp: verde da marca, ícone + texto em branco. */
.ee-attachment-btn--wa {
	background: #25d366;
	border-color: #25d366;
	color: #fff;
}

.ee-attachment-btn--wa:hover,
.ee-attachment-btn--wa:focus {
	background: #1ebe5d;
	border-color: #1ebe5d;
	color: #fff;
}

/* ==========================================================================
   3. Outras imagens da galeria (miniaturas)
   ========================================================================== */
.ee-attachment-siblings-title {
	letter-spacing: 0.04em;
	color: var(--ee-gray-500);
}

.ee-attachment-thumb a {
	display: block;
	line-height: 0;
	border-radius: var(--ee-radius-sm);
	overflow: hidden;
	border: 1px solid var(--ee-border);
	transition: border-color 0.15s ease, transform 0.15s ease;
}

.ee-attachment-thumb a:hover,
.ee-attachment-thumb a:focus {
	border-color: var(--ee-blue);
	transform: translateY(-2px);
}

.ee-attachment-thumb img {
	width: 92px;
	height: 92px;
	object-fit: cover;
	display: block;
}

@media (max-width: 575.98px) {
	.ee-attachment-thumb img {
		width: 72px;
		height: 72px;
	}
}

/* ==========================================================================
   4. Voltar para a postagem (box estilo botão, igual ao print)
   ==========================================================================
   O single.css (que estiliza .post-navigation) NÃO carrega na página de anexo,
   então definimos o box completo aqui: borda fina cinza-azulada, cantos bem
   arredondados, padding generoso, rótulo "ANTERIOR" laranja e título azul.
   Largura total da coluna de leitura.
   ========================================================================== */
.ee-attachment-nav {
	margin-block: var(--ee-space-5);
}

.ee-attachment-nav .nav-links {
	display: block;
}

.ee-attachment-nav .nav-previous a {
	display: block;
	padding: var(--ee-space-4) var(--ee-space-5);
	background: #fff;
	border: 1px solid #e6eaf1;
	border-radius: 16px;
	text-decoration: none;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.ee-attachment-nav .nav-previous a:hover,
.ee-attachment-nav .nav-previous a:focus {
	border-color: var(--ee-blue);
	box-shadow: 0 2px 10px rgba(13, 71, 161, 0.08);
}

.ee-attachment-nav .nav-subtitle {
	display: block;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	font-size: 0.72rem;
	font-weight: 700;
	color: var(--ee-orange);
	margin-bottom: 0.25rem;
}

.ee-attachment-nav .nav-title {
	display: block;
	color: var(--ee-blue-dark);
	font-size: 1.25rem;
	line-height: 1.35;
}
