/* Banova Visual Search */

.dgwt-wcas-search-wrapp { position: relative; }

.bvs-cam-btn {
	position: absolute;
	top: 50%;
	right: 10px;
	transform: translateY(-50%);
	z-index: 30;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 8px;
	background: transparent;
	color: currentColor;          /* hereda del input: blanco en barra oscura, oscuro en clara */
	opacity: .55;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
	transition: opacity .15s ease, background-color .15s ease, transform .15s ease;
}
.bvs-cam-btn svg { display: block; width: 19px; height: 19px; }
.bvs-cam-btn:hover { opacity: 1; background: rgba(127, 127, 127, .18); }
.bvs-cam-btn:active { transform: translateY(-50%) scale(.92); }
.bvs-cam-btn:focus-visible {
	opacity: 1;
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

/* Hairline separador entre la cámara y los controles de FiboSearch a su derecha */
.bvs-cam-btn::after {
	content: "";
	position: absolute;
	right: -6px;
	top: 6px;
	bottom: 6px;
	width: 1px;
	background: currentColor;
	opacity: .25;
}
/* El JS decide la posición (btn.style.right) midiendo lupa/micrófono reales. */

.bvs-panel {
	position: absolute;
	top: calc(100% + 6px);
	left: 0;
	right: 0;
	z-index: 40;
	max-height: 70vh;
	overflow-y: auto;
	background: #fff;
	color: #1b2024;
	border: 1px solid #e1ded7;
	border-radius: 10px;
	box-shadow: 0 12px 32px rgba(20,24,28,.16);
	font-size: 14px;
	line-height: 1.4;
}

.bvs-head {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 12px 14px;
	border-bottom: 1px solid #eee7dd;
}
.bvs-thumb {
	width: 40px; height: 40px;
	object-fit: cover;
	border-radius: 6px;
	flex: 0 0 auto;
}
.bvs-status { flex: 1; color: #4a525a; }
.bvs-spinner {
	width: 16px; height: 16px;
	border: 2px solid #d8d4cb;
	border-top-color: #17548c;
	border-radius: 50%;
	animation: bvs-spin .7s linear infinite;
	flex: 0 0 auto;
}
@keyframes bvs-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .bvs-spinner { animation-duration: 2s; } }

.bvs-results-head {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 14px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #7c848c;
	border-bottom: 1px solid #eee7dd;
}
.bvs-count {
	background: #e7eef5;
	color: #17548c;
	border-radius: 999px;
	padding: 1px 7px;
	font-size: 11px;
}

.bvs-list { display: flex; flex-direction: column; }

.bvs-item {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 14px;
	text-decoration: none;
	color: inherit;
	border-bottom: 1px solid #f2ede4;
}
.bvs-item:last-child { border-bottom: 0; }
.bvs-item:hover { background: #f7f6f3; }
.bvs-item-thumb {
	width: 48px; height: 48px;
	object-fit: cover;
	border-radius: 6px;
	background: #f0eee9;
	flex: 0 0 auto;
}
.bvs-item-body { flex: 1; min-width: 0; }
.bvs-item-title {
	display: block;
	font-weight: 600;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.bvs-item-price { display: block; color: #4a525a; font-size: 13px; }
.bvs-item-price del { opacity: .6; }
.bvs-oos { color: #ac3838; font-style: normal; font-size: 12px; }
.bvs-item-score {
	flex: 0 0 auto;
	font-size: 12px;
	font-variant-numeric: tabular-nums;
	color: #9aa1a9;
}

.bvs-msg { padding: 18px 16px; color: #4a525a; text-align: center; }
.bvs-msg--error { color: #ac3838; }

.bvs-dropzone {
	position: absolute;
	inset: 0;
	z-index: 45;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(23,84,140,.10);
	border: 2px dashed #17548c;
	border-radius: 10px;
	pointer-events: none;
}
.bvs-dropzone span {
	background: #17548c;
	color: #fff;
	font-size: 12px;
	font-weight: 600;
	padding: 4px 10px;
	border-radius: 6px;
}

@media (prefers-color-scheme: dark) {
	.bvs-panel { background: #1a1e22; color: #e7e5e0; border-color: #2c3238; }
	.bvs-head, .bvs-results-head, .bvs-item { border-color: #262b30; }
	.bvs-item:hover { background: #202529; }
	.bvs-cam-btn { color: #9aa1a9; }
	.bvs-cam-btn:hover { background: rgba(255,255,255,.08); color: #e7e5e0; }
	.bvs-status, .bvs-item-price { color: #aeb4ba; }
	.bvs-count { background: #1b2937; color: #5e9bd1; }
	.bvs-item-thumb { background: #202529; }
}
