/* ── Buscador global — estilo "Idea Repuestos" (navy + bone) ────────────────
   Paleta y tipografías según GUIA-ESTILO.md. Todo va scopeado a .cr-bs-* para
   no pisar estilos del tema. Las variables se declaran en :root con prefijo
   propio porque el disparador y el panel viven en ramas distintas del DOM
   (header del tema / final del body). */
:root {
	--crbs-navy:    #15233f;
	--crbs-navy-700:#1d3052;
	--crbs-navy-500:#33486b;
	--crbs-navy-900:#0f1a2e;
	--crbs-bone:    #f2eee5;
	--crbs-bone-2:  #ece7db;
	--crbs-surface: #faf7f0;
	--crbs-surface-2:#fdfbf6;
	--crbs-ink:     #26313f;
	--crbs-muted:   #6c6a63;
	--crbs-line:    #ddd6c7;
	--crbs-line-2:  #e7e1d4;
	--crbs-r:       5px;
	--crbs-r-sm:    3px;
	--crbs-shadow:  0 1px 2px rgba(21,35,63,.05), 0 12px 32px -18px rgba(21,35,63,.22);
	--crbs-shadow-lg: 0 24px 60px -28px rgba(21,35,63,.34);
	--crbs-ease:    cubic-bezier(.22,.61,.36,1);
}

/* ── Disparador ─────────────────────────────────────────────────────────── */
.cr-bs-trigger {
	display:inline-flex; align-items:center; gap:.55em;
	box-sizing:border-box;
	font-family:'Sora', sans-serif; font-weight:500; font-size:15px; line-height:1;
	padding:11px 18px;
	border-radius:var(--crbs-r);
	cursor:pointer;
	text-decoration:none;
	transition:transform .35s var(--crbs-ease), box-shadow .35s var(--crbs-ease),
		background .35s var(--crbs-ease), color .35s var(--crbs-ease), border-color .35s var(--crbs-ease);
}
.cr-bs-trigger:hover { transform:translateY(-2px); box-shadow:0 14px 28px -16px rgba(21,35,63,.55); }
.cr-bs-trigger:focus-visible { outline:2px solid var(--crbs-navy-500); outline-offset:3px; }
.cr-bs-ico { width:18px; height:18px; flex:none; }

/* Variantes */
.cr-bs-ghost  { background:transparent; color:var(--crbs-navy); border:1px solid var(--crbs-line); }
.cr-bs-ghost:hover { background:var(--crbs-navy); color:#fff; border-color:var(--crbs-navy); }
.cr-bs-boton  { background:var(--crbs-navy); color:#fff; border:1px solid var(--crbs-navy); }
.cr-bs-texto  { background:transparent; color:inherit; border:1px solid transparent; padding:8px 4px; }
.cr-bs-texto:hover { color:var(--crbs-navy); transform:none; box-shadow:none; }

/* Solo lupa: cuadrado */
.cr-bs-solo-icono { padding:11px; }

/* Burbuja fija (modo="flotante") */
.cr-bs-fab {
	position:fixed; bottom:24px; z-index:99990;
	width:56px; height:56px; padding:0;
	border-radius:50%;
	justify-content:center;
	box-shadow:var(--crbs-shadow-lg), 0 4px 12px rgba(21,35,63,.28);
}
.cr-bs-fab-der { right:24px; }
.cr-bs-fab-izq { left:24px; }
.cr-bs-fab .cr-bs-ico { width:22px; height:22px; }
.cr-bs-fab .cr-bs-trigger-txt { display:none; }

/* ── Overlay + panel ────────────────────────────────────────────────────── */
.cr-bs-overlay {
	position:fixed; inset:0; z-index:99998;
	background:rgba(15,26,46,.55);
	display:flex; align-items:flex-start; justify-content:center;
	padding:clamp(16px, 8vh, 96px) 16px 24px;
	animation:cr-bs-fade .18s var(--crbs-ease);
}
.cr-bs-overlay[hidden] { display:none; }
@keyframes cr-bs-fade { from { opacity:0; } to { opacity:1; } }

.cr-bs-panel {
	width:100%; max-width:640px;
	background:var(--crbs-surface);
	border:1px solid var(--crbs-line);
	border-radius:var(--crbs-r);
	box-shadow:var(--crbs-shadow-lg);
	overflow:hidden;
	display:flex; flex-direction:column;
	max-height:min(78vh, 720px);
	animation:cr-bs-in .22s var(--crbs-ease);
}
@keyframes cr-bs-in { from { opacity:0; transform:translateY(-10px); } to { opacity:1; transform:none; } }

/* Fila del formulario */
.cr-bs-form {
	position:relative;
	display:flex; align-items:center; gap:8px;
	padding:12px 12px 12px 44px;
	background:var(--crbs-surface-2);
	border-bottom:1px solid var(--crbs-line);
}
.cr-bs-form-ico {
	position:absolute; left:14px; top:50%; transform:translateY(-50%);
	width:20px; height:20px; color:var(--crbs-muted); pointer-events:none;
}
.cr-bs-overlay .cr-bs-input {
	flex:1 1 auto; min-width:0;
	box-sizing:border-box;
	padding:10px 4px;
	border:none; outline:none; background:transparent;
	font-family:'Hanken Grotesk', sans-serif;
	font-size:17px; line-height:1.4; color:var(--crbs-ink);
	-webkit-appearance:none; appearance:none;
}
.cr-bs-overlay .cr-bs-input::placeholder { color:var(--crbs-muted); }
/* La X nativa del type="search" pelea con nuestro botón de cerrar. */
.cr-bs-overlay .cr-bs-input::-webkit-search-cancel-button { display:none; }

.cr-bs-submit {
	flex:none;
	font-family:'Sora', sans-serif; font-weight:500; font-size:14px;
	padding:10px 18px;
	background:var(--crbs-navy); color:#fff; border:1px solid var(--crbs-navy);
	border-radius:var(--crbs-r); cursor:pointer;
	transition:transform .35s var(--crbs-ease), box-shadow .35s var(--crbs-ease);
}
.cr-bs-submit:hover { transform:translateY(-2px); box-shadow:0 14px 28px -16px rgba(21,35,63,.55); }

.cr-bs-close {
	flex:none;
	width:38px; height:38px;
	display:inline-flex; align-items:center; justify-content:center;
	background:transparent; color:var(--crbs-muted);
	border:1px solid transparent; border-radius:var(--crbs-r);
	font-size:24px; line-height:1; cursor:pointer;
	transition:background .35s var(--crbs-ease), color .35s var(--crbs-ease);
}
.cr-bs-close:hover { background:var(--crbs-bone-2); color:var(--crbs-navy); }

/* Cuerpo con resultados */
.cr-bs-body { overflow-y:auto; -webkit-overflow-scrolling:touch; }
.cr-bs-msg {
	margin:0; padding:26px 20px; text-align:center;
	font-family:'Hanken Grotesk', sans-serif; font-size:15px; color:var(--crbs-muted);
}
.cr-bs-msg[hidden] { display:none; }

.cr-bs-resultados { list-style:none; margin:0; padding:0; }
.cr-bs-resultados[hidden] { display:none; }

.cr-bs-item { margin:0; padding:0; border-bottom:1px solid var(--crbs-line-2); }
.cr-bs-item:last-child { border-bottom:none; }
.cr-bs-link {
	display:grid; grid-template-columns:56px 1fr; align-items:center; gap:14px;
	padding:10px 16px;
	text-decoration:none; color:inherit;
	transition:background .2s var(--crbs-ease);
	cursor:pointer;
}
.cr-bs-link:hover,
.cr-bs-item.is-activo .cr-bs-link { background:var(--crbs-bone-2); }

.cr-bs-figura {
	width:56px; height:56px;
	display:flex; align-items:center; justify-content:center;
	background:#fff;
	border:1px solid var(--crbs-line);
	border-radius:var(--crbs-r-sm);
	overflow:hidden;
}
.cr-bs-figura img { width:100%; height:100%; object-fit:contain; display:block; }
.cr-bs-figura .cr-bs-noimg { color:var(--crbs-muted); font-size:13px; }

.cr-bs-txt { min-width:0; display:flex; flex-direction:column; gap:2px; }
.cr-bs-cod {
	font-family:'Sora', sans-serif; font-weight:600; font-size:12.5px;
	letter-spacing:.06em; color:var(--crbs-navy-500);
	font-variant-numeric:tabular-nums;
}
.cr-bs-nom {
	font-family:'Hanken Grotesk', sans-serif; font-size:15.5px; line-height:1.35;
	color:var(--crbs-ink);
	overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.cr-bs-nom mark, .cr-bs-cod mark { background:rgba(51,72,107,.16); color:inherit; padding:0 1px; border-radius:2px; }
/* iOS autodetecta los códigos de ~7 dígitos como teléfonos y los vuelve enlaces:
   que no se vean ni actúen como tales (mismo criterio que en catalogo.css). */
.cr-bs-cod a { color:inherit; text-decoration:none; pointer-events:none; cursor:inherit; }
.cr-bs-marca {
	font-family:'Sora', sans-serif; font-size:11px; font-weight:600;
	letter-spacing:.14em; text-transform:uppercase; color:var(--crbs-muted);
}

/* Pie: "Ver los N resultados" */
.cr-bs-vertodos {
	display:flex; align-items:center; justify-content:center; gap:.5em;
	padding:14px 16px;
	background:var(--crbs-bone-2);
	border-top:1px solid var(--crbs-line);
	font-family:'Sora', sans-serif; font-weight:600; font-size:13px;
	letter-spacing:.06em; text-transform:uppercase;
	color:var(--crbs-navy); text-decoration:none;
	transition:background .35s var(--crbs-ease);
}
.cr-bs-vertodos:hover { background:var(--crbs-navy); color:#fff; }
.cr-bs-vertodos[hidden] { display:none; }

/* Spinner discreto mientras responde el AJAX */
.cr-bs-form.is-cargando .cr-bs-form-ico { animation:cr-bs-pulse 1s ease-in-out infinite; }
@keyframes cr-bs-pulse { 0%,100% { opacity:.35; } 50% { opacity:1; } }

/* Bloquea el scroll del fondo con el panel abierto */
body.cr-bs-abierto { overflow:hidden; }

/* ── Mobile ─────────────────────────────────────────────────────────────── */
@media (max-width:600px) {
	.cr-bs-overlay { padding:0; align-items:stretch; }
	.cr-bs-panel { max-width:none; max-height:100%; border:none; border-radius:0; }
	.cr-bs-submit { padding:10px 14px; }
	.cr-bs-fab { bottom:18px; }
	.cr-bs-fab-der { right:18px; }
	.cr-bs-fab-izq { left:18px; }
}

/* Respeta "reducir movimiento" del sistema */
@media (prefers-reduced-motion:reduce) {
	.cr-bs-overlay, .cr-bs-panel { animation:none; }
	.cr-bs-trigger:hover, .cr-bs-submit:hover { transform:none; }
}
