/* ==========================================================================
   Shared Ad Placeholder Styles
   Used across all pages as fallback when ads can't load
   ========================================================================== */

.ad-placeholder {
	background-color: var(--color-accent-blue-bg);
	border: 1px solid var(--color-border-light);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 24px 20px;
	cursor: pointer;
	gap: 6px;
	text-align: center;
}

.ad-placeholder:hover {
	background-color: var(--color-bg-hover);
}

.ad-placeholder--horizontal {
	flex-direction: row;
	gap: 12px;
}

.ad-placeholder-icon {
	font-size: 24px;
}

.ad-placeholder-text {
	font-size: 16px;
	font-weight: 600;
	color: var(--color-text-primary);
}

.ad-placeholder-subtext {
	font-size: 14px;
	color: var(--color-text-secondary);
}

/* Sidebar variant: smaller text */
.sidebar-ad-container .ad-placeholder {
	padding: 20px 10px;
}

.sidebar-ad-container .ad-placeholder-text {
	font-size: 14px;
}

.sidebar-ad-container .ad-placeholder-subtext {
	font-size: 12px;
}