/**
 * SDM - Buscador Avanzado · Front (responsive)
 *
 * @author    SEO DIGITAL MEDIA SAS
 * @copyright 2026 SEO DIGITAL MEDIA SAS. Todos los derechos reservados.
 * @license   Licencia propietaria. Ver archivo LICENSE incluido en el módulo.
 */
.sdm-as {
  --sdm-font: inherit; --sdm-fs: 15px; --sdm-h: 44px; --sdm-maxw: 100%; --sdm-radius: 6px; --sdm-bw: 1px;
  --sdm-in-bg: #fff; --sdm-in-tx: #222; --sdm-ph: #8a8a8a; --sdm-bd: #ccc; --sdm-bd-f: #005a8f;
  --sdm-btn-bg: #005a8f; --sdm-btn-tx: #fff; --sdm-btn-hv: #003a5c; --sdm-icon: #005a8f; --sdm-shadow: none;
  --sdm-r-bg: #fff; --sdm-r-tx: #333; --sdm-r-mu: #777; --sdm-r-hv: #f1f6fa; --sdm-r-bd: #e3e3e3; --sdm-r-radius: 6px;
  --sdm-r-title: #005a8f; --sdm-r-price: #c0392b; --sdm-r-hl-bg: #fff1a8; --sdm-r-hl-tx: #000; --sdm-r-maxh: 520px;
  --sdm-r-img: 56px; --sdm-r-shadow: 0 10px 30px rgba(0,0,0,.15); --sdm-overlay: rgba(0,0,0,.45); --sdm-cols: 2;
  position: relative;
  width: 100%;
  max-width: var(--sdm-maxw);
  font-family: var(--sdm-font);
  font-size: var(--sdm-fs);
  line-height: 1.35;
  box-sizing: border-box;
}
.sdm-as *, .sdm-as *::before, .sdm-as *::after { box-sizing: border-box; }
.sdm-as--off { display: none !important; }
.sdm-as:not(.sdm-as--off):not(.sdm-as--layer) { visibility: visible; opacity: 1; }
.sdm-as__panel, .sdm-as__form { visibility: visible; opacity: 1; }
.sdm-as__sr { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }

/* ---------- Botón ícono (modo "ícono") ---------- */
.sdm-as__toggle {
  display: none; align-items: center; justify-content: center;
  width: 42px; height: 42px; padding: 0; border: 0; border-radius: 50%;
  background: transparent; color: var(--sdm-icon); cursor: pointer;
}
.sdm-as__toggle:hover, .sdm-as__toggle:focus-visible { background: rgba(0,0,0,.06); outline: none; }
.sdm-as--icon { width: auto; display: inline-block; }
.sdm-as--icon .sdm-as__toggle { display: inline-flex; }
.sdm-as--icon .sdm-as__panel { display: none; }
.sdm-as--icon.sdm-as--expanded .sdm-as__panel {
  display: block; position: absolute; top: calc(100% + 6px); right: 0; z-index: 1060;
  width: min(92vw, 440px); padding: 8px; background: var(--sdm-r-bg);
  border: 1px solid var(--sdm-r-bd); border-radius: var(--sdm-r-radius); box-shadow: var(--sdm-r-shadow);
}

/* ---------- Formulario ---------- */
.sdm-as__panel { position: relative; }
.sdm-as__form {
  position: relative; display: flex; align-items: stretch; width: 100%; height: var(--sdm-h); margin: 0;
  background: var(--sdm-in-bg); border: var(--sdm-bw) solid var(--sdm-bd); border-radius: var(--sdm-radius);
  box-shadow: var(--sdm-shadow); overflow: hidden; transition: border-color .15s ease, box-shadow .15s ease;
}
.sdm-as__form:focus-within { border-color: var(--sdm-bd-f); box-shadow: 0 0 0 3px color-mix(in srgb, var(--sdm-bd-f) 20%, transparent); }
.sdm-as__input {
  flex: 1 1 auto; min-width: 0; height: 100%; margin: 0; padding: 0 14px; border: 0 !important; outline: none !important;
  background: transparent !important; color: var(--sdm-in-tx); font: inherit; font-size: var(--sdm-fs);
  -webkit-appearance: none; appearance: none; box-shadow: none !important;
}
.sdm-as__input::placeholder { color: var(--sdm-ph); opacity: 1; }
.sdm-as__input::-webkit-search-cancel-button, .sdm-as__input::-webkit-search-decoration { -webkit-appearance: none; }
.sdm-as__clear {
  flex: 0 0 auto; width: 34px; border: 0; background: transparent; color: var(--sdm-ph);
  font-size: 22px; line-height: 1; cursor: pointer;
}
.sdm-as__clear[hidden] { display: none; }
.sdm-as__btn {
  flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  min-width: var(--sdm-h); padding: 0 14px; margin: 0; border: 0; border-radius: 0;
  background: var(--sdm-btn-bg); color: var(--sdm-btn-tx); font: inherit; font-weight: 600; cursor: pointer;
  transition: background-color .15s ease;
}
.sdm-as__btn:hover, .sdm-as__btn:focus-visible { background: var(--sdm-btn-hv); outline: none; }
.sdm-as__close {
  display: none; flex: 0 0 auto; width: var(--sdm-h); border: 0; background: transparent; color: var(--sdm-in-tx); cursor: pointer;
}
.sdm-as--expanded .sdm-as__close { display: inline-flex; align-items: center; justify-content: center; }

/* ---------- Indicador de carga ---------- */
.sdm-as__spinner {
  display: none; align-self: center; width: 18px; height: 18px; margin-right: 6px; flex: 0 0 auto;
  border: 2px solid var(--sdm-bd); border-top-color: var(--sdm-bd-f); border-radius: 50%;
  animation: sdm-as-spin .7s linear infinite;
}
.sdm-as--loading .sdm-as__spinner { display: block; }
@keyframes sdm-as-spin { to { transform: rotate(360deg); } }

/* ---------- Ventana de resultados ---------- */
.sdm-as__results {
  position: absolute; top: calc(100% + 6px); left: 0; z-index: 1050;
  width: var(--sdm-r-w, 100%); min-width: min(320px, 92vw); max-width: 96vw; max-height: var(--sdm-r-maxh);
  overflow-y: auto; overscroll-behavior: contain; padding: 6px 0;
  background: var(--sdm-r-bg); color: var(--sdm-r-tx);
  border: 1px solid var(--sdm-r-bd); border-radius: var(--sdm-r-radius); box-shadow: var(--sdm-r-shadow);
  text-align: left; animation: sdm-as-in .16s ease-out;
}
.sdm-as__results[hidden] { display: none; }
@keyframes sdm-as-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: none; } }
.sdm-as--pos-panel .sdm-as__results { left: auto; right: 0; width: min(94vw, var(--sdm-r-w, 860px)); }
.sdm-as--icon .sdm-as__results { position: static; width: 100%; min-width: 0; margin-top: 8px; box-shadow: none; }

.sdm-as__group { padding: 4px 0; }
.sdm-as__group + .sdm-as__group { border-top: 1px solid var(--sdm-r-bd); }
.sdm-as__gtitle {
  margin: 6px 14px 4px; padding: 0; font-size: .78em; font-weight: 700; letter-spacing: .04em;
  text-transform: uppercase; color: var(--sdm-r-title);
}
.sdm-as__count { font-weight: 400; color: var(--sdm-r-mu); }
/* blindaje: algunos temas / el back-office aplican estilos globales a h3 */
.sdm-as .sdm-as__gtitle, .sdm-as--layer .sdm-as__gtitle {
  position: static; float: none; height: auto; min-height: 0; width: auto;
  padding: 0; border: 0; background: none; box-shadow: none; line-height: 1.3; font-family: inherit;
}
.sdm-as__list { list-style: none; margin: 0; padding: 0; }
.sdm-as__li { margin: 0; padding: 0; }
.sdm-as__item {
  display: flex; align-items: center; gap: 12px; padding: 8px 14px; color: var(--sdm-r-tx) !important;
  text-decoration: none !important; outline: none;
}
.sdm-as__item:hover, .sdm-as__item.is-active { background: var(--sdm-r-hv); }
.sdm-as__thumb {
  flex: 0 0 var(--sdm-r-img); width: var(--sdm-r-img); height: var(--sdm-r-img);
  display: flex; align-items: center; justify-content: center; overflow: hidden; border-radius: 4px; background: #f6f6f6;
}
.sdm-as__thumb img { max-width: 100%; max-height: 100%; object-fit: contain; display: block; }
.sdm-as__body { display: flex; flex-direction: column; min-width: 0; flex: 1 1 auto; }
.sdm-as__name { font-weight: 600; overflow-wrap: anywhere; }
.sdm-as__ref { font-size: .8em; color: var(--sdm-r-mu); }
.sdm-as__desc { font-size: .85em; color: var(--sdm-r-mu); margin-top: 2px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.sdm-as__price { margin-top: 3px; font-weight: 700; color: var(--sdm-r-price); }
.sdm-as__hl { background: var(--sdm-r-hl-bg); color: var(--sdm-r-hl-tx); padding: 0 1px; border-radius: 2px; }
.sdm-as__empty, .sdm-as__corrected { margin: 0; padding: 12px 14px; color: var(--sdm-r-mu); }
.sdm-as__corrected { padding-bottom: 2px; font-size: .9em; font-style: italic; }
.sdm-as__all {
  display: block; margin: 6px 10px 4px; padding: 10px 12px; text-align: center; font-weight: 600;
  color: var(--sdm-btn-tx) !important; background: var(--sdm-btn-bg); border-radius: var(--sdm-radius); text-decoration: none !important;
}
.sdm-as__all:hover, .sdm-as__all.is-active { background: var(--sdm-btn-hv); }

/* Cuadrícula */
.sdm-as__results--grid .sdm-as__list {
  display: grid; grid-template-columns: repeat(var(--sdm-cols), minmax(0, 1fr)); gap: 6px; padding: 4px 8px;
}
.sdm-as__results--grid .sdm-as__item { flex-direction: column; align-items: stretch; text-align: center; padding: 10px; border-radius: 6px; height: 100%; }
.sdm-as__results--grid .sdm-as__thumb { width: 100%; height: auto; aspect-ratio: 1 / 1; flex-basis: auto; }

/* ---------- Pantalla completa ---------- */
.sdm-as--pos-fullscreen.sdm-as--expanded .sdm-as__panel {
  position: fixed; inset: 0; z-index: 99999; display: flex; flex-direction: column; gap: 10px;
  width: auto; height: 100%; height: 100dvh; padding: 12px; margin: 0;
  background: var(--sdm-r-bg); border: 0; border-radius: 0; box-shadow: none;
}
.sdm-as--pos-fullscreen.sdm-as--expanded .sdm-as__form { flex: 0 0 auto; }
.sdm-as--pos-fullscreen.sdm-as--expanded .sdm-as__results {
  position: static; flex: 1 1 auto; width: 100%; min-width: 0; max-width: none; max-height: none;
  border: 0; box-shadow: none; border-radius: 0; animation: none;
}
html.sdm-as-lock, html.sdm-as-lock body { overflow: hidden !important; }

/* ---------- Capa superior (fuera de la cabecera del tema) ---------- */
.sdm-as.sdm-as--layer {
  position: absolute !important; top: 0 !important; left: 0 !important;
  width: 0 !important; height: 0 !important; max-width: none !important;
  margin: 0 !important; padding: 0 !important; border: 0 !important; overflow: visible !important;
  z-index: 2147483000 !important; display: block !important; visibility: visible !important; opacity: 1 !important;
  transform: none !important; float: none !important;
}
.sdm-as.sdm-as--layer.sdm-as--off { display: none !important; }
.sdm-as:not(.sdm-as--off):not(.sdm-as--layer) { visibility: visible; opacity: 1; }
.sdm-as__panel, .sdm-as__form { visibility: visible; opacity: 1; }
.sdm-as--layer > .sdm-as__results { position: fixed; z-index: 2147483000; min-width: 0; max-width: none; margin: 0; }
.sdm-as--layer > .sdm-as__results[hidden] { display: none !important; }
.sdm-as--layer > .sdm-as__panel { z-index: 2147483001; }
.sdm-as--layer.sdm-as--icon.sdm-as--expanded > .sdm-as__panel { display: block; }
.sdm-as--layer.sdm-as--icon:not(.sdm-as--pos-fullscreen) > .sdm-as__panel .sdm-as__results { margin-top: 8px; border: 0; box-shadow: none; border-radius: 0; }

/* ---------- Ajustes táctiles ---------- */
@media (max-width: 767px) {
  .sdm-as__item { padding: 10px 12px; }
  .sdm-as__input { font-size: max(16px, var(--sdm-fs)); } /* evita zoom automático en iOS */
  .sdm-as__results { width: 100%; }
  .sdm-as--pos-panel .sdm-as__results { width: 94vw; }
}
@media (prefers-reduced-motion: reduce) {
  .sdm-as__results, .sdm-as__spinner { animation: none !important; }
}

/* ---------- Página de resultados ---------- */
.sdm-asp__box { margin-bottom: 1.5rem; max-width: 760px; }
.sdm-asp__notice { padding: 1rem; background: #f7f7f7; border-radius: 6px; }
.sdm-asp__q { font-weight: 400; }
.sdm-asp__corrected { font-style: italic; }
.sdm-asp__group { margin-bottom: 2rem; }
.sdm-asp__title { font-size: 1.25rem; margin-bottom: 1rem; }
.sdm-asp__count { font-weight: 400; opacity: .7; }
.sdm-asp__grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); }
.sdm-asp__card { margin: 0; }
.sdm-asp__link { display: flex; flex-direction: column; gap: 6px; height: 100%; padding: 12px; border: 1px solid #e6e6e6; border-radius: 8px; color: inherit; text-decoration: none; transition: box-shadow .15s ease; }
.sdm-asp__link:hover { box-shadow: 0 6px 18px rgba(0,0,0,.08); text-decoration: none; }
.sdm-asp__img { width: 100%; aspect-ratio: 1 / 1; object-fit: contain; }
.sdm-asp__name { font-weight: 600; }
.sdm-asp__price { font-weight: 700; color: #c0392b; }
.sdm-asp__desc { font-size: .9em; opacity: .8; }
.sdm-asp__more { text-align: center; margin-top: 1rem; }
.sdm-asp__pagination { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; margin: 1.5rem 0; }
.sdm-asp__page { min-width: 38px; padding: 8px 10px; text-align: center; border: 1px solid #ddd; border-radius: 6px; text-decoration: none; }
.sdm-asp__page.is-current { background: #005a8f; color: #fff; border-color: #005a8f; }
/* Rejilla de miniaturas del tema: independiente de las columnas/flotantes del tema */
.sdm-asp .sdm-asp__wrap, .sdm-asp #js-product-list { width: 100%; margin: 0; padding: 0; float: none; }
.sdm-asp .sdm-asp__products { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 0 !important; padding: 0 !important; width: 100% !important; float: none !important; }
.sdm-asp .sdm-asp__products::before, .sdm-asp .sdm-asp__products::after { display: none !important; content: none !important; }
.sdm-asp .sdm-asp__cell { min-width: 0; display: flex; }
.sdm-asp .sdm-asp__cell > * { width: 100% !important; max-width: 100% !important; min-width: 0 !important; flex: 1 1 auto !important; float: none !important; margin: 0 !important; padding-left: 0 !important; padding-right: 0 !important; position: relative; }
.sdm-asp .sdm-asp__cell img { max-width: 100%; height: auto; }
.sdm-asp .sdm-asp__cell .thumbnail-container { width: 100% !important; max-width: 100% !important; margin: 0 !important; height: 100%; }
.sdm-asp .sdm-asp__cell .product-thumbnail, .sdm-asp .sdm-asp__cell .product-image { text-align: center; }
.sdm-asp .sdm-asp__cell form { max-width: 100%; }
.sdm-asp .sdm-asp__cell input[type="number"], .sdm-asp .sdm-asp__cell input[name="qty"] { width: 64px !important; max-width: 64px !important; flex: 0 0 auto !important; display: inline-block; }
.sdm-asp .sdm-asp__cell .bootstrap-touchspin { width: auto !important; max-width: 110px; display: inline-flex !important; }
.sdm-asp .sdm-asp__cell .product-title, .sdm-asp .sdm-asp__cell .product-title a { overflow-wrap: anywhere; }
@media (max-width: 991px) {
  .sdm-asp .sdm-asp__products, .sdm-asp__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 575px) {
  .sdm-asp .sdm-asp__products, .sdm-asp__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
}