/* Planet-Brick — recherche live (autocomplete) style avenuedelabrique. */

/* XStore désactivé en permanence : aucun dropdown natif ne doit s'afficher. */
.etheme-search-form .etheme-search-ajax-results,
.etheme-search-form .etheme-search-trending-searches-wrapper {
	display: none !important;
}

.pb-lss-panel {
	box-sizing: border-box;
	max-height: 78vh;
	overflow-y: auto;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 8px;
	box-shadow: 0 12px 40px rgba(15, 23, 42, .18);
	z-index: 99990;
	font-family: inherit;
	-webkit-overflow-scrolling: touch;
}
.pb-lss-panel * { box-sizing: border-box; }

.pb-lss-band + .pb-lss-band { border-top: 1px solid #e8eef5; }

.pb-lss-band__title {
	padding: 9px 14px;
	font: 700 11px/1 Arial, sans-serif;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #64748b;
	background: #f8fafc;
}
/* Bandeau Thèmes & Gammes : fond plus visible (bleu clair) */
.pb-lss-band--tg { background: #e8f1fb; }
.pb-lss-band--tg .pb-lss-band__title { background: #d3e4f7; color: #16335f; }

/* ── Bandeau Articles (lignes) ───────────────────────────── */
.pb-lss-row {
	display: flex;
	align-items: center;
	gap: 20px;                                  /* 20px entre la photo et le texte */
	padding: 3px 14px;                          /* lignes compactes ≈ hauteur image */
	text-decoration: none;
	color: #1e293b;
	border-left: 3px solid transparent;
	border-bottom: 1px solid #eef2f7;          /* liseret de séparation */
}
.pb-lss-band--products .pb-lss-row:nth-of-type(odd)  { background: #ffffff; }
.pb-lss-band--products .pb-lss-row:nth-of-type(even) { background: #f3f7fc; } /* gris-bleu très clair */
/* hover/sélection (scopé pour passer au-dessus de l'alternance) */
.pb-lss-band--products .pb-lss-row:hover,
.pb-lss-band--products .pb-lss-row.is-active {
	background: #fff7e6;
	border-left-color: #f97316;
}

.pb-lss-logos {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	gap: 8px;
	width: 122px;
	justify-content: flex-start;
}
/* Images +33% et encadrées */
.pb-lss-brand {
	width: 56px; height: 52px;
	object-fit: contain;
	flex: 0 0 auto;
	border: 1px solid #e2e8f0;
	border-radius: 5px;
	background: #fff;
	padding: 2px;
}
.pb-lss-thumb {
	width: 53px; height: 53px;
	object-fit: contain;
	border: 1px solid #e2e8f0;
	border-radius: 5px;
	background: #f8fafc;
	flex: 0 0 auto;
	padding: 2px;
}

.pb-lss-text {
	display: flex;
	flex-direction: column;
	min-width: 0;
	line-height: 1.25;
}
.pb-lss-label {
	font: 700 14px/1.25 Arial, sans-serif;
	color: #0f172a;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.pb-lss-sub {
	font: 400 12px/1.3 Arial, sans-serif;
	color: #64748b;
	margin-top: 2px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* ── Bandeau fusionné Thèmes & Gammes (tuiles carrées) ───── */
.pb-lss-tiles {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	padding: 12px 14px;
}
.pb-lss-tile {
	position: relative;                /* ancre l'étiquette marque */
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 7px;
	flex: 0 0 120px;                   /* toutes les tuiles strictement même largeur */
	width: 120px;
	padding: 22px 8px 10px;            /* marge haute pour l'étiquette */
	text-decoration: none;
	color: #1e293b;
	background: #fff;
	border: 1px solid #64748b;         /* liseret gris foncé autour du thème/gamme */
	border-radius: 8px;
}
.pb-lss-tile:hover,
.pb-lss-tile.is-active {
	border-color: #f97316;
	background: #fff7e6;
}
.pb-lss-tile__media {
	position: relative;
	width: 100%; height: 70px;         /* pleine largeur de la tuile */
	display: flex;
	align-items: center;
	justify-content: center;
}
.pb-lss-tile__img {
	width: 100%; height: 70px;
	object-fit: contain;
}
/* Logo marque = étiquette en haut à gauche de la tuile */
.pb-lss-tile__brand {
	position: absolute;
	top: 6px; left: 6px;
	z-index: 2;
	width: auto; max-width: 50px; height: 20px;
	object-fit: contain;
	background: #fff;
	border: 1px solid #e2e8f0;
	border-radius: 4px;
	padding: 2px 4px;
	box-shadow: 0 1px 2px rgba(15, 23, 42, .12);
}
.pb-lss-tile__label {
	font: 600 12px/1.25 Arial, sans-serif;
	color: #0f172a;
	text-align: center;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	max-width: 100%;
}

.pb-lss-empty {
	padding: 18px 14px;
	text-align: center;
	font: 400 13px/1.4 Arial, sans-serif;
	color: #64748b;
}

/* ── Mobile ──────────────────────────────────────────────── */
@media (max-width: 768px) {
	.pb-lss-panel { max-height: 66vh; }
	.pb-lss-row { padding: 3px 14px; }
	.pb-lss-logos { width: 108px; }
	.pb-lss-brand { width: 50px; height: 46px; }
	.pb-lss-thumb { width: 46px; height: 46px; }
	.pb-lss-tiles { gap: 8px; }
	.pb-lss-tile { flex: 0 0 calc(33.333% - 6px); width: calc(33.333% - 6px); }
	.pb-lss-tile__media { width: 100%; height: 56px; }
	.pb-lss-tile__img { width: 100%; height: 56px; }
}
