/* Samuday custom Elementor widgets. Values mirror the Figma design;
   colours are overridable from each widget's Style tab. */

/* ---------------------------------------------------- Announcement bar */

.sd-announce {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	background-color: #5c1414;
	padding: 10px 100px;
}

.sd-announce[hidden] {
	display: none;
}

.sd-announce__main {
	display: flex;
	flex: 1 0 0;
	min-width: 0;
	align-items: center;
	gap: 12px;
}

.sd-announce__badge {
	flex-shrink: 0;
	border-radius: 999px;
	background-color: #c9a24a;
	padding: 5px 12px;
	color: #2b1410;
	font-size: 13px;
	font-weight: 500;
	line-height: 1.4;
	letter-spacing: 0.3px;
	white-space: nowrap;
}

.sd-announce__message {
	margin: 0;
	flex: 1 0 0;
	min-width: 0;
	color: #fff8ec;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.5;
}

.sd-announce__link {
	display: inline-flex;
	flex-shrink: 0;
	align-items: center;
	gap: 6px;
	color: #c9a24a;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.5;
	white-space: nowrap;
}

.sd-announce__link svg,
.sd-announce__close svg {
	display: block;
	width: 16px;
	height: 16px;
	stroke: currentColor;
}

.sd-announce__close {
	flex-shrink: 0;
	border: 0;
	background: none;
	padding: 0;
	color: #c9a24a;
	cursor: pointer;
	line-height: 0;
}

@media (max-width: 1024px) {
	.sd-announce {
		padding: 10px 32px;
	}
}

@media (max-width: 767px) {
	.sd-announce {
		flex-wrap: wrap;
		padding: 10px 20px;
	}

	.sd-announce__message {
		font-size: 14px;
	}
}

/* ------------------------------------------------------ Greetings ticker */

.sd-ticker {
	display: flex;
	position: relative;
	align-items: stretch;
	background-color: #f4ead6;
	overflow: hidden;
}

.sd-ticker__label {
	display: flex;
	flex-shrink: 0;
	align-items: center;
	gap: 8px;
	z-index: 2;
	background-color: #fbebd2;
	padding: 9px 24px 9px 100px;
	color: #7a1f1f;
	font-size: 15px;
	font-weight: 500;
	line-height: 1.5;
	white-space: nowrap;
}

.sd-ticker__label svg {
	display: block;
	width: 16px;
	height: 16px;
	stroke: currentColor;
}

.sd-ticker__viewport {
	flex: 1 0 0;
	min-width: 0;
	padding: 9px 0;
	overflow: hidden;
}

.sd-ticker__track {
	display: flex;
	width: max-content;
	animation-name: sd-ticker-scroll;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
}

.sd-ticker__group {
	display: flex;
	align-items: center;
	gap: 36px;
	padding-right: 36px;
}

.sd-ticker__item {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: #3b2416;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.5;
	white-space: nowrap;
}

.sd-ticker__dot {
	flex-shrink: 0;
	border-radius: 50%;
	background-color: #c9a24a;
	width: 6px;
	height: 6px;
}

.sd-ticker--pause:hover .sd-ticker__track {
	animation-play-state: paused;
}

@keyframes sd-ticker-scroll {
	from {
		transform: translateX(0);
	}

	to {
		/* One group is exactly half the duplicated track. */
		transform: translateX(-50%);
	}
}

/* Respect a reader who does not want motion. */
@media (prefers-reduced-motion: reduce) {
	.sd-ticker__track {
		animation: none;
	}

	.sd-ticker__viewport {
		overflow-x: auto;
	}
}

@media (max-width: 1024px) {
	.sd-ticker__label {
		padding-left: 32px;
	}
}

@media (max-width: 767px) {
	.sd-ticker__label {
		padding-right: 16px;
		padding-left: 20px;
		font-size: 14px;
	}

	.sd-ticker__item {
		font-size: 14px;
	}
}

/* Announcement bar — mobile per Figma 76:18343: badge + 2-line message + close. */
@media (max-width: 767px) {
	.sd-announce { flex-wrap: nowrap; }
	.sd-announce__main { flex: 1 1 auto; min-width: 0; }
	.sd-announce__message {
		flex: 1 1 auto;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
		overflow: hidden;
	}
	.sd-announce__link { display: none; }
}
@media (max-width: 767px) {
	/* Ticker label is icon-only on mobile (Figma). */
	.sd-ticker__label span { display: none; }
	.sd-ticker__label { padding: 9px 12px; }
	.sd-announce { padding: 10px 16px; gap: 10px; }
	.sd-announce__badge { padding: 4px 10px; font-size: 12px; }
	.sd-announce__message { font-size: 13px; line-height: 1.4; }
	.sd-announce button.sd-announce__close { width: auto; height: auto; padding: 0; background: none; border: 0; color: #c9a24a; }
}
