/* === Spensa: Top Bar === */

/*
 * Full-Width Breakout untuk Elementor Container Box.
 * Wrapper Elementor (.elementor-widget-container) diubah posisinya
 * agar topbar bisa keluar dari batas container dan melebar penuh viewport.
 */
.elementor-widget-spensa-topbar {
	width: 100%;
}

.spensa-topbar {
	background-color: #0A387E;
	color: #ffffff;
	font-size: 0.8125rem;
	padding: 0.5rem 1.25rem;
	width: 100%;
	box-sizing: border-box;
}

.spensa-topbar__inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 0.75rem;
	max-width: 1140px;
	margin-left: auto !important;
	margin-right: auto !important;
	width: 100%;
	box-sizing: border-box;
}

.spensa-topbar__left {
	display: flex;
	align-items: center;
	gap: 1.5rem;
	flex-wrap: wrap;
}

.spensa-topbar__item {
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	font-size: 0.8125rem;
}

.spensa-topbar__icon {
	color: #F59E0B;
	font-size: 0.9rem;
}

.spensa-topbar__right {
	display: flex;
	align-items: center;
	gap: 0.85rem;
}

.spensa-topbar__social {
	color: #ffffff !important;
	text-decoration: none !important;
	opacity: 0.85;
	font-size: 0.95rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: opacity 0.2s, color 0.2s, transform 0.2s;
}

.spensa-topbar__social:hover {
	opacity: 1;
	color: #F59E0B !important;
	transform: translateY(-1px);
}

@media (max-width: 575px) {
	.spensa-topbar__left {
		display: none;
	}
	.spensa-topbar__inner {
		justify-content: center;
	}
}