/* =========================================================
   TazaShop — Composants autonomes (recherche, newsletter)
   Aucun style de header ni de footer : ils sont gérés par
   Elementor / ElementsKit.
   ========================================================= */

.tz-search {
	display: flex;
	align-items: stretch;
	border: 1px solid var(--tz-border);
	border-radius: var(--tz-radius-sm);
	overflow: hidden;
	background: var(--tz-white);
}

.tz-search input[type="search"] {
	border: 0;
	border-radius: 0;
	flex: 1 1 auto;
	min-width: 0;
	padding: 11px 14px;
}

.tz-search input[type="search"]:focus {
	outline: none;
}

.tz-search:focus-within {
	border-color: var(--tz-rose);
}

.tz-search button {
	flex: 0 0 auto;
	width: 46px;
	border: 0;
	background: var(--tz-bordeaux);
	color: var(--tz-white);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
}

.tz-search button:hover {
	background: var(--tz-bordeaux-dark);
}

.tz-newsletter {
	background: var(--tz-rose-light);
	border: 1px solid var(--tz-border);
	border-radius: var(--tz-radius-lg);
	padding-inline: clamp(20px, 4vw, 46px);
}

.tz-newsletter__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 32px;
	padding-block: 34px;
	flex-wrap: wrap;
}

.tz-newsletter__text {
	display: flex;
	align-items: center;
	gap: 18px;
}

.tz-newsletter__icon {
	display: inline-flex;
	color: var(--tz-rose);
}

.tz-newsletter__title {
	font-size: clamp(20px, 2.2vw, 26px);
	color: var(--tz-bordeaux);
	margin: 0 0 4px;
}

.tz-newsletter__text p {
	margin: 0;
	color: var(--tz-text-2);
	font-size: 14.5px;
}

.tz-newsletter__form {
	flex: 1 1 360px;
	max-width: 480px;
}

.tz-newsletter__placeholder,
.tz-newsletter__form form {
	display: flex;
	gap: 10px;
}

.tz-newsletter__placeholder input,
.tz-newsletter__form input[type="email"] {
	flex: 1 1 auto;
}

.tz-newsletter__placeholder button {
	padding: 12px 24px;
	border: 0;
	border-radius: var(--tz-radius-sm);
	background: var(--tz-bordeaux);
	color: var(--tz-white);
	font-weight: 600;
	font-size: 14px;
	opacity: .75;
}

.tz-newsletter__hint {
	margin: 10px 0 0;
	font-size: 12.5px;
	color: var(--tz-text-2);
}

@media (max-width: 767px) {
	.tz-newsletter__inner {
		flex-direction: column;
		align-items: flex-start;
	}

	.tz-newsletter__form {
		width: 100%;
		max-width: none;
	}
}