/* =====================================================
   BOOKSHELF SEARCH & FILTERS — Frontend CSS v1.3
   ===================================================== */

:root {
  --bsf-primary:      #1a1a2e;
  --bsf-accent:       #e94560;
  --bsf-bg:           #ffffff;
  --bsf-bg2:          #f8f7f4;
  --bsf-border:       #e8e4de;
  --bsf-text:         #2c2c2c;
  --bsf-muted:        #8a8a8a;
  --bsf-radius:       10px;
  --bsf-shadow:       0 4px 24px rgba(0,0,0,.10);
  --bsf-shadow-lg:    0 8px 32px rgba(0,0,0,.18);
  --bsf-transition:   .2s cubic-bezier(.4,0,.2,1);
}

.bsf-search-wrapper *,
.bsf-filter-widget *,
.bsf-catalog-wrapper * { box-sizing: border-box; }

/* =====================================================
   BUSCADOR — BASE
   ===================================================== */
.bsf-search-wrapper { width: 100%; position: relative; }
.bsf-search-box     { position: relative; }

.bsf-search-inner {
  display: flex; align-items: center;
  background: var(--bsf-bg);
  border: 2px solid var(--bsf-border);
  border-radius: 50px;
  padding: 4px 6px 4px 18px;
  gap: 8px;
  transition: border-color var(--bsf-transition), box-shadow var(--bsf-transition);
}
.bsf-search-inner:focus-within {
  border-color: var(--bsf-accent);
  box-shadow: 0 0 0 3px rgba(233,69,96,.12);
}

.bsf-search-icon { width:18px;height:18px;color:var(--bsf-muted);flex-shrink:0;transition:color var(--bsf-transition); }
.bsf-search-inner:focus-within .bsf-search-icon { color:var(--bsf-accent); }

.bsf-search-input {
  flex:1; border:none!important; outline:none!important;
  background:transparent!important; font-size:15px;
  color:var(--bsf-text); padding:8px 0; min-width:0;
  box-shadow:none!important;
}
.bsf-search-input::placeholder { color:var(--bsf-muted); }

.bsf-search-actions { display:flex;align-items:center;gap:4px; }

.bsf-search-clear {
  background:none;border:none;cursor:pointer;padding:6px;border-radius:50%;
  color:var(--bsf-muted);display:flex;align-items:center;justify-content:center;
  transition:background var(--bsf-transition),color var(--bsf-transition);
}
.bsf-search-clear:hover { background:var(--bsf-bg2);color:var(--bsf-accent); }
.bsf-search-clear[hidden] { display:none; }

.bsf-search-submit {
  background:var(--bsf-accent);color:#fff;border:none;cursor:pointer;
  border-radius:40px;padding:8px 20px;font-size:14px;font-weight:600;
  transition:background var(--bsf-transition),transform var(--bsf-transition);
  display:flex;align-items:center;gap:6px;white-space:nowrap;
}
.bsf-search-submit:hover { background:#d63851;transform:scale(1.03); }

/* Estilos alternativos */
.bsf-search-style-minimal .bsf-search-inner { border-radius:6px;background:var(--bsf-bg2);border-color:transparent; }
.bsf-search-style-minimal .bsf-search-inner:focus-within { background:var(--bsf-bg);border-color:var(--bsf-accent); }
.bsf-search-style-minimal .bsf-search-submit { background:transparent;color:var(--bsf-accent);padding:8px 12px; }
.bsf-search-style-minimal .bsf-search-submit:hover { background:rgba(233,69,96,.08);transform:none; }
.bsf-search-style-bold .bsf-search-inner { border-radius:4px;border:3px solid var(--bsf-primary); }
.bsf-search-style-bold .bsf-search-inner:focus-within { border-color:var(--bsf-accent);box-shadow:4px 4px 0 var(--bsf-primary); }
.bsf-search-style-bold .bsf-search-submit { background:var(--bsf-primary);border-radius:2px; }
.bsf-search-style-bold .bsf-search-submit:hover { background:var(--bsf-accent);transform:none; }

/* ── BUSCADOR MODO ÍCONO (header móvil) ─────────────
   El wrapper tiene la clase .bsf-icon-mode cuando
   el JS detecta viewport <= 768px                    */
.bsf-search-wrapper.bsf-icon-mode .bsf-search-box { display:none; }
.bsf-search-wrapper.bsf-icon-mode .bsf-search-icon-btn { display:flex; }

/* Botón ícono lupa */
.bsf-search-icon-btn {
  display:none; /* oculto por defecto, visible en icon-mode */
  align-items:center;justify-content:center;
  width:40px;height:40px;border-radius:50%;
  background:none;border:none;cursor:pointer;
  color:var(--bsf-text);
  transition:background var(--bsf-transition);
}
.bsf-search-icon-btn:hover { background:var(--bsf-bg2); }

/* Panel de búsqueda expandido (overlay en móvil) */
.bsf-search-overlay {
  display:none;
  position:fixed;top:0;left:0;right:0;
  background:var(--bsf-bg);
  padding:12px 16px;
  box-shadow:0 4px 20px rgba(0,0,0,.15);
  z-index:999999;
  align-items:center;gap:10px;
  animation:bsfSlideDown .2s ease;
}
.bsf-search-overlay.is-open { display:flex; }
@keyframes bsfSlideDown { from{opacity:0;transform:translateY(-12px)} to{opacity:1;transform:translateY(0)} }

.bsf-search-overlay .bsf-search-inner {
  flex:1; border-radius:10px;
}
.bsf-overlay-close {
  background:none;border:none;cursor:pointer;font-size:22px;
  color:var(--bsf-muted);padding:4px;flex-shrink:0;
  transition:color var(--bsf-transition);
}
.bsf-overlay-close:hover { color:var(--bsf-accent); }

/* Autocomplete */
.bsf-suggestions-dropdown {
  position:absolute;top:calc(100% + 8px);left:0;right:0;
  background:var(--bsf-bg);border-radius:var(--bsf-radius);
  box-shadow:var(--bsf-shadow-lg);border:1px solid var(--bsf-border);
  z-index:999999;overflow:hidden;
  animation:bsfFadeIn .15s ease;
}
.bsf-suggestions-dropdown[hidden] { display:none; }
@keyframes bsfFadeIn { from{opacity:0;transform:translateY(-6px)} to{opacity:1;transform:translateY(0)} }

.bsf-suggestion-item {
  display:flex;align-items:center;gap:12px;
  padding:10px 16px;cursor:pointer;
  border-bottom:1px solid var(--bsf-border);
  text-decoration:none;color:var(--bsf-text);
  transition:background var(--bsf-transition);
}
.bsf-suggestion-item:last-child { border-bottom:none; }
.bsf-suggestion-item:hover, .bsf-suggestion-item.is-selected { background:var(--bsf-bg2); }
.bsf-suggest-image { width:36px;height:48px;object-fit:cover;border-radius:4px;flex-shrink:0;background:var(--bsf-bg2); }
.bsf-suggest-text  { flex:1;min-width:0; }
.bsf-suggest-title { font-size:14px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
.bsf-suggest-badge { font-size:11px;font-weight:600;padding:2px 8px;border-radius:20px;background:var(--bsf-bg2);color:var(--bsf-muted);flex-shrink:0; }
.bsf-suggest-badge.tipo-libro     { background:#e8f4fd;color:#1a73e8; }
.bsf-suggest-badge.tipo-categoria { background:#e8fded;color:#2e7d32; }

/* Toolbar */
.bsf-search-toolbar { display:flex;align-items:center;justify-content:space-between;padding:12px 0;gap:12px;flex-wrap:wrap; }
.bsf-search-toolbar[hidden] { display:none; }
.bsf-sort-wrap  { display:flex;align-items:center;gap:8px;font-size:14px; }
.bsf-sort-select { border:1px solid var(--bsf-border);border-radius:6px;padding:6px 10px;font-size:14px;background:var(--bsf-bg);color:var(--bsf-text); }
.bsf-layout-toggle { display:flex;gap:4px; }
.bsf-layout-btn { padding:7px 9px;border:1px solid var(--bsf-border);background:var(--bsf-bg);border-radius:6px;cursor:pointer;display:flex;align-items:center;color:var(--bsf-muted);transition:all var(--bsf-transition); }
.bsf-layout-btn:hover { border-color:var(--bsf-accent);color:var(--bsf-accent); }
.bsf-layout-btn.is-active { background:var(--bsf-primary);border-color:var(--bsf-primary);color:#fff; }

/* Loading / no results */
.bsf-results-loading { display:flex;align-items:center;justify-content:center;gap:12px;padding:60px 20px;color:var(--bsf-muted);font-size:15px; }
.bsf-results-loading[hidden] { display:none; }
.bsf-spinner { width:28px;height:28px;border:3px solid var(--bsf-border);border-top-color:var(--bsf-accent);border-radius:50%;animation:bsfSpin .7s linear infinite; }
@keyframes bsfSpin { to{transform:rotate(360deg)} }
.bsf-results-header { display:flex;align-items:center;justify-content:space-between;padding:8px 0 12px;border-bottom:1px solid var(--bsf-border);margin-bottom:16px; }
.bsf-results-count { font-size:14px;color:var(--bsf-muted); }
.bsf-no-results { text-align:center;padding:60px 20px;color:var(--bsf-muted); }
.bsf-no-results-icon { font-size:52px;margin-bottom:16px;opacity:.4; }
.bsf-no-results h3 { font-size:18px;color:var(--bsf-text);margin:0 0 8px; }
.bsf-no-results p  { margin:0;font-size:14px; }

/* =====================================================
   PRODUCTOS
   ===================================================== */
.bsf-products-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(200px,1fr));
  gap:20px;
}
.bsf-products-grid.bsf-layout-list { grid-template-columns:1fr;gap:12px; }

.bsf-product-card {
  background:var(--bsf-bg);border:1px solid var(--bsf-border);
  border-radius:var(--bsf-radius);overflow:hidden;
  transition:transform var(--bsf-transition),box-shadow var(--bsf-transition);
  display:flex;flex-direction:column;
}
.bsf-product-card:hover { transform:translateY(-4px);box-shadow:var(--bsf-shadow-lg);border-color:rgba(233,69,96,.2); }
.bsf-card-image-wrap { position:relative;display:block;aspect-ratio:3/4;overflow:hidden;background:var(--bsf-bg2); }
.bsf-card-image-wrap img { width:100%;height:100%;object-fit:cover;transition:transform .4s ease; }
.bsf-product-card:hover .bsf-card-image-wrap img { transform:scale(1.05); }
.bsf-badge { position:absolute;top:10px;left:10px;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;padding:3px 9px;border-radius:20px;z-index:1; }
.bsf-badge-sale  { background:var(--bsf-accent);color:#fff; }
.bsf-badge-stock { background:#555;color:#fff; }
.bsf-card-body   { padding:14px;flex:1;display:flex;flex-direction:column;gap:4px; }
.bsf-card-cat    { font-size:11px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--bsf-accent);margin-bottom:2px; }
.bsf-card-title  { margin:0;font-size:14px;font-weight:600;line-height:1.35; }
.bsf-card-title a { color:var(--bsf-text);text-decoration:none; }
.bsf-card-title a:hover { color:var(--bsf-accent); }
.bsf-card-sku    { margin:0;font-size:11px;color:var(--bsf-muted); }
.bsf-card-footer { display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:10px;border-top:1px solid var(--bsf-border); }
.bsf-card-price  { font-size:16px;font-weight:700;color:var(--bsf-primary); }
.bsf-card-price del { font-size:12px;color:var(--bsf-muted);font-weight:400; }
.bsf-btn-cart    { width:34px;height:34px;background:var(--bsf-primary);color:#fff;border:none;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;text-decoration:none;transition:background var(--bsf-transition),transform var(--bsf-transition);flex-shrink:0; }
.bsf-btn-cart:hover { background:var(--bsf-accent);transform:scale(1.1); }
.bsf-layout-list .bsf-product-card   { flex-direction:row; }
.bsf-layout-list .bsf-card-image-wrap { width:100px;flex-shrink:0;aspect-ratio:auto;min-height:130px; }
.bsf-layout-list .bsf-card-body { padding:12px 16px; }

/* Paginación */
.bsf-pagination { display:flex;align-items:center;justify-content:center;gap:6px;padding:28px 0 8px;flex-wrap:wrap; }
.bsf-page-btn   { min-width:36px;height:36px;padding:0 10px;border:1px solid var(--bsf-border);background:var(--bsf-bg);border-radius:6px;cursor:pointer;font-size:14px;color:var(--bsf-text);transition:all var(--bsf-transition); }
.bsf-page-btn:hover { border-color:var(--bsf-accent);color:var(--bsf-accent); }
.bsf-page-btn.is-active { background:var(--bsf-primary);border-color:var(--bsf-primary);color:#fff;font-weight:600; }
.bsf-page-dots  { color:var(--bsf-muted);padding:0 4px; }

/* =====================================================
   FILTROS — VERTICAL
   ===================================================== */
.bsf-filter-widget { font-family:inherit;color:var(--bsf-text); }

.bsf-filter-header { display:flex;align-items:center;justify-content:space-between;margin-bottom:16px; }
.bsf-filter-title  { margin:0;font-size:16px;font-weight:700; }
.bsf-clear-all { display:flex;align-items:center;gap:4px;background:none;border:none;cursor:pointer;font-size:12px;color:var(--bsf-accent);font-weight:600;padding:4px 8px;border-radius:4px;transition:background var(--bsf-transition); }
.bsf-clear-all:hover { background:rgba(233,69,96,.08); }
.bsf-clear-all[hidden] { display:none; }

.bsf-active-filters { display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px; }
.bsf-active-filters[hidden] { display:none; }
.bsf-active-tag { display:flex;align-items:center;gap:4px;background:rgba(233,69,96,.1);color:var(--bsf-accent);border:1px solid rgba(233,69,96,.25);border-radius:20px;padding:3px 10px 3px 12px;font-size:12px;font-weight:500; }
.bsf-active-tag button { background:none;border:none;cursor:pointer;color:var(--bsf-accent);font-size:14px;line-height:1;padding:0 0 0 2px; }

.bsf-filter-group { border-bottom:1px solid var(--bsf-border);padding:4px 0; }
.bsf-filter-group:last-of-type { border-bottom:none; }
.bsf-group-toggle { width:100%;display:flex;align-items:center;gap:8px;background:none;border:none;cursor:pointer;padding:12px 0;font-size:14px;font-weight:600;color:var(--bsf-text);text-align:left; }
.bsf-group-toggle:hover { color:var(--bsf-accent); }
.bsf-group-icon  { font-size:16px;flex-shrink:0; }
.bsf-group-label { flex:1; }
.bsf-chevron { transition:transform var(--bsf-transition);flex-shrink:0;color:var(--bsf-muted); }
.bsf-filter-group.is-collapsed .bsf-chevron { transform:rotate(-90deg); }
.bsf-group-content { padding-bottom:12px; }
.bsf-filter-group.is-collapsed .bsf-group-content { display:none; }

.bsf-option-filter-input { width:100%;padding:6px 10px;font-size:13px;border:1px solid var(--bsf-border);border-radius:6px;background:var(--bsf-bg2);margin-bottom:8px; }
.bsf-checkbox-list  { display:flex;flex-direction:column;gap:2px; }
.bsf-checkbox-item  { display:flex;align-items:center;gap:10px;padding:6px 8px;border-radius:6px;cursor:pointer;transition:background var(--bsf-transition);user-select:none;font-size:14px; }
.bsf-checkbox-item:hover { background:var(--bsf-bg2); }
.bsf-checkbox-item.is-active { background:rgba(233,69,96,.07); }
.bsf-checkbox-item input[type="checkbox"] { display:none; }
.bsf-checkmark { width:18px;height:18px;flex-shrink:0;border:2px solid var(--bsf-border);border-radius:4px;background:var(--bsf-bg);transition:all var(--bsf-transition);position:relative; }
.bsf-checkbox-item input:checked ~ .bsf-checkmark { background:var(--bsf-accent);border-color:var(--bsf-accent); }
.bsf-checkbox-item input:checked ~ .bsf-checkmark::after { content:'';position:absolute;top:2px;left:5px;width:5px;height:9px;border:2px solid #fff;border-top:none;border-left:none;transform:rotate(45deg); }
.bsf-option-label { flex:1; }
.bsf-option-count { font-size:12px;color:var(--bsf-muted);background:var(--bsf-bg2);padding:1px 7px;border-radius:10px; }
.bsf-show-more-btn { background:none;border:none;cursor:pointer;font-size:13px;color:var(--bsf-accent);font-weight:500;padding:6px 8px;margin-top:4px; }
.bsf-more-options[hidden] { display:none; }

/* Precio */
.bsf-price-range { padding:8px 4px 4px; }
.bsf-range-track { position:relative;height:4px;background:var(--bsf-border);border-radius:4px;margin:20px 0 12px; }
.bsf-range-fill  { position:absolute;height:100%;background:var(--bsf-accent);border-radius:4px;pointer-events:none; }
.bsf-range-input { position:absolute;top:50%;transform:translateY(-50%);width:100%;pointer-events:none;-webkit-appearance:none;appearance:none;background:transparent;margin:0; }
.bsf-range-input::-webkit-slider-thumb { -webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:var(--bsf-bg);border:3px solid var(--bsf-accent);box-shadow:0 2px 6px rgba(0,0,0,.15);cursor:pointer;pointer-events:all;transition:transform var(--bsf-transition); }
.bsf-range-input::-webkit-slider-thumb:hover { transform:scale(1.2); }
.bsf-range-input::-moz-range-thumb { width:20px;height:20px;border-radius:50%;background:var(--bsf-bg);border:3px solid var(--bsf-accent);cursor:pointer;pointer-events:all; }
.bsf-range-inputs-row { display:flex;align-items:center;gap:8px;margin-top:10px; }
.bsf-range-input-wrap { flex:1;display:flex;align-items:center;border:1px solid var(--bsf-border);border-radius:7px;background:var(--bsf-bg);padding:0 8px;transition:border-color var(--bsf-transition); }
.bsf-range-input-wrap:focus-within { border-color:var(--bsf-accent); }
.bsf-range-sym { font-size:13px;color:var(--bsf-muted);flex-shrink:0; }
.bsf-range-text-input { width:100%;border:none!important;outline:none!important;background:transparent!important;padding:7px 4px;font-size:13px;font-weight:600;color:var(--bsf-text);box-shadow:none!important; }
.bsf-range-separator { font-size:13px;color:var(--bsf-muted);flex-shrink:0; }

/* Rating / toggle */
.bsf-rating-list { display:flex;flex-direction:column;gap:4px; }
.bsf-rating-item { display:flex;align-items:center;gap:10px;padding:7px 8px;border-radius:6px;cursor:pointer;transition:background var(--bsf-transition);font-size:14px; }
.bsf-rating-item:hover { background:var(--bsf-bg2); }
.bsf-rating-item.is-active { background:rgba(245,166,35,.1); }
.bsf-rating-item input { display:none; }
.bsf-stars { color:#f5a623;font-size:16px;letter-spacing:1px; }
.bsf-toggle-list { display:flex;flex-direction:column;gap:6px; }
.bsf-toggle-item { display:flex;align-items:center;gap:10px;padding:6px 4px;cursor:pointer;font-size:14px; }
.bsf-toggle-item input { display:none; }
.bsf-toggle-switch { width:40px;height:22px;border-radius:11px;background:var(--bsf-border);flex-shrink:0;position:relative;transition:background var(--bsf-transition); }
.bsf-toggle-switch::after { content:'';position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.2);transition:transform var(--bsf-transition); }
.bsf-toggle-item input:checked ~ .bsf-toggle-switch { background:var(--bsf-accent); }
.bsf-toggle-item input:checked ~ .bsf-toggle-switch::after { transform:translateX(18px); }

.bsf-filter-actions { padding-top:16px; }
.bsf-btn-apply { width:100%;padding:12px;background:var(--bsf-primary);color:#fff;border:none;border-radius:8px;cursor:pointer;font-size:15px;font-weight:600;display:flex;align-items:center;justify-content:center;gap:8px;transition:background var(--bsf-transition); }
.bsf-btn-apply:hover { background:var(--bsf-accent); }

/* =====================================================
   FILTROS — HORIZONTAL (dropdowns sobre la grilla)
   ===================================================== */
.bsf-layout-horizontal .bsf-filter-form {
  display:flex;flex-wrap:wrap;gap:8px;align-items:flex-start;
}
.bsf-layout-horizontal .bsf-filter-group {
  position:relative;flex-shrink:0;
  border:1px solid var(--bsf-border);border-radius:8px;
  background:var(--bsf-bg);
}
.bsf-layout-horizontal .bsf-group-toggle { padding:8px 14px;font-size:13px;white-space:nowrap;border-bottom:none; }
.bsf-layout-horizontal .bsf-group-content {
  position:absolute;top:calc(100% + 4px);left:0;
  min-width:220px;max-width:300px;
  background:var(--bsf-bg);border:1px solid var(--bsf-border);
  border-radius:var(--bsf-radius);
  box-shadow:0 8px 32px rgba(0,0,0,.18);
  z-index:99999;padding:14px;
  animation:bsfFadeIn .15s ease;
}
.bsf-layout-horizontal .bsf-filter-group.open-left .bsf-group-content { left:auto;right:0; }
.bsf-layout-horizontal .bsf-filter-group:not(.is-open) .bsf-group-content { display:none; }
.bsf-layout-horizontal .bsf-filter-group.is-open { border-color:var(--bsf-accent);z-index:100000; }
.bsf-layout-horizontal .bsf-filter-group.is-open .bsf-group-toggle { color:var(--bsf-accent); }
.bsf-layout-horizontal .bsf-filter-header,
.bsf-layout-horizontal .bsf-filter-actions,
.bsf-layout-horizontal .bsf-active-filters { display:none; }
/* La barra completa no debe cortar los dropdowns */
.bsf-filter-widget.bsf-layout-horizontal { overflow:visible; }

/* =====================================================
   FILTROS — RESPONSIVE
   Modo "Filtros" único: botón desplegable que agrupa TODO
   ===================================================== */
.bsf-layout-responsive .bsf-filter-form {
  position:relative;
}

/* Botón "Filtros ▾" */
.bsf-responsive-trigger {
  display:flex;align-items:center;gap:8px;
  padding:9px 18px;border:1px solid var(--bsf-border);
  border-radius:8px;background:var(--bsf-bg);
  cursor:pointer;font-size:14px;font-weight:600;
  color:var(--bsf-text);white-space:nowrap;
  transition:all var(--bsf-transition);
}
.bsf-responsive-trigger:hover,
.bsf-responsive-trigger.is-open { border-color:var(--bsf-accent);color:var(--bsf-accent); }
.bsf-responsive-trigger .bsf-chevron { transition:transform var(--bsf-transition); }
.bsf-responsive-trigger.is-open .bsf-chevron { transform:rotate(180deg); }
.bsf-responsive-badge { background:var(--bsf-accent);color:#fff;font-size:11px;font-weight:700;width:18px;height:18px;border-radius:50%;display:flex;align-items:center;justify-content:center; }
.bsf-responsive-badge[hidden] { display:none; }

/* Panel desplegable con todos los grupos */
.bsf-responsive-panel {
  position:absolute;top:calc(100% + 6px);left:0;
  min-width:280px;max-width:360px;
  background:var(--bsf-bg);border:1px solid var(--bsf-border);
  border-radius:var(--bsf-radius);box-shadow:var(--bsf-shadow-lg);
  z-index:99999;padding:16px;
  animation:bsfFadeIn .15s ease;
}
.bsf-responsive-panel[hidden] { display:none; }
/* Dentro del panel, los grupos se comportan como vertical */
.bsf-responsive-panel .bsf-filter-group { border-bottom:1px solid var(--bsf-border);padding:2px 0; }
.bsf-responsive-panel .bsf-filter-group:last-of-type { border-bottom:none; }
.bsf-responsive-panel .bsf-group-toggle { padding:10px 0; }
.bsf-responsive-panel .bsf-group-content { padding-bottom:8px; }
.bsf-responsive-panel .bsf-filter-group.is-collapsed .bsf-group-content { display:none; }
.bsf-responsive-panel .bsf-filter-group.is-collapsed .bsf-chevron { transform:rotate(-90deg); }
/* Botón aplicar dentro del panel */
.bsf-responsive-panel .bsf-responsive-apply {
  width:100%;margin-top:12px;padding:11px;
  background:var(--bsf-primary);color:#fff;border:none;
  border-radius:8px;cursor:pointer;font-size:14px;font-weight:600;
  transition:background var(--bsf-transition);
}
.bsf-responsive-panel .bsf-responsive-apply:hover { background:var(--bsf-accent); }

/* En modo responsive, ocultar el header original del widget */
.bsf-layout-responsive .bsf-filter-header { display:none; }

/* =====================================================
   CATÁLOGO COMPLETO
   ===================================================== */
.bsf-catalog-wrapper { width:100%; }
.bsf-catalog-search  { margin-bottom:20px; }

/* Barra de filtros: NUNCA ocultar con overflow */
.bsf-catalog-filters-bar {
  display:flex;align-items:flex-start;gap:10px;
  margin-bottom:20px;flex-wrap:wrap;
  overflow:visible;position:relative;z-index:500;
}
.bsf-filters-horizontal { flex:1;overflow:visible;position:relative;z-index:500; }

.bsf-mobile-filter-toggle {
  display:none;align-items:center;gap:6px;
  padding:9px 16px;font-size:14px;font-weight:600;
  border:1px solid var(--bsf-border);border-radius:8px;
  background:var(--bsf-bg);cursor:pointer;flex-shrink:0;
  transition:all var(--bsf-transition);
}
.bsf-mobile-filter-toggle:hover { border-color:var(--bsf-accent);color:var(--bsf-accent); }
.bsf-active-count { background:var(--bsf-accent);color:#fff;font-size:11px;font-weight:700;width:18px;height:18px;border-radius:50%;display:flex;align-items:center;justify-content:center; }
.bsf-active-count[hidden] { display:none; }

.bsf-catalog-body    { display:flex;gap:28px;align-items:flex-start; }
.bsf-catalog-sidebar {
  width:260px;flex-shrink:0;
  background:var(--bsf-bg);border:1px solid var(--bsf-border);
  border-radius:var(--bsf-radius);padding:20px;
  position:sticky;top:20px;
}
.bsf-catalog-main { flex:1;min-width:0; }

.bsf-catalog-toolbar { display:flex;align-items:center;justify-content:space-between;padding-bottom:12px;border-bottom:1px solid var(--bsf-border);margin-bottom:16px;gap:12px;flex-wrap:wrap; }
.bsf-total-count { font-size:14px;color:var(--bsf-muted); }
.bsf-toolbar-right { display:flex;align-items:center;gap:10px; }
.bsf-active-filters-bar { display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:10px 14px;background:var(--bsf-bg2);border-radius:8px;margin-bottom:16px; }
.bsf-active-filters-bar[hidden] { display:none; }

/* Panel móvil */
.bsf-mobile-filter-panel { position:fixed;inset:0;z-index:999999; }
.bsf-mobile-filter-panel[hidden] { display:none; }
.bsf-mobile-filter-overlay { position:absolute;inset:0;background:rgba(0,0,0,.5);backdrop-filter:blur(2px);animation:bsfOverlayIn .2s ease; }
@keyframes bsfOverlayIn { from{opacity:0} to{opacity:1} }
.bsf-mobile-filter-drawer { position:absolute;top:0;right:0;bottom:0;width:min(340px,90vw);background:var(--bsf-bg);display:flex;flex-direction:column;animation:bsfDrawerIn .25s cubic-bezier(.4,0,.2,1); }
@keyframes bsfDrawerIn { from{transform:translateX(100%)} to{transform:translateX(0)} }
.bsf-mobile-filter-header { display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--bsf-border);flex-shrink:0; }
.bsf-mobile-filter-header h3 { margin:0;font-size:18px; }
.bsf-close-mobile-filters { background:var(--bsf-bg2);border:none;cursor:pointer;width:32px;height:32px;border-radius:50%;font-size:16px;transition:background var(--bsf-transition); }
.bsf-mobile-filter-body { flex:1;overflow-y:auto;padding:16px 20px; }
.bsf-mobile-filter-footer { padding:16px 20px;border-top:1px solid var(--bsf-border);flex-shrink:0; }
.bsf-btn-apply-mobile { width:100%;padding:14px;background:var(--bsf-accent);color:#fff;border:none;border-radius:8px;cursor:pointer;font-size:16px;font-weight:700;transition:background var(--bsf-transition); }
.bsf-btn-apply-mobile:hover { background:#d63851; }

/* =====================================================
   RESPONSIVE
   ===================================================== */
@media (max-width: 1024px) {
  .bsf-catalog-sidebar { width:220px; }
  .bsf-products-grid   { grid-template-columns:repeat(auto-fill,minmax(170px,1fr)); }
}

@media (max-width: 768px) {
  /* Buscador header: activar modo ícono */
  .bsf-context-header .bsf-search-box   { display:none; }
  .bsf-context-header .bsf-search-icon-btn { display:flex; }

  /* Catálogo: sidebar off, botón filtros */
  .bsf-catalog-filters-bar .bsf-filters-horizontal { display:none; }
  .bsf-mobile-filter-toggle { display:flex!important; }
  .bsf-catalog-body { flex-direction:column; }
  .bsf-catalog-sidebar { display:none; }

  .bsf-products-grid { grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px; }
  .bsf-catalog-toolbar  { flex-direction:column;align-items:flex-start; }
  .bsf-toolbar-right    { width:100%;justify-content:space-between; }
  .bsf-sort-select      { flex:1; }

  .bsf-layout-list .bsf-product-card    { flex-direction:column; }
  .bsf-layout-list .bsf-card-image-wrap { width:100%;min-height:auto;max-height:180px; }

  /* Filtros horizontal en mobile: panel responsive con ancho full */
  .bsf-layout-horizontal .bsf-group-content { min-width:unset;max-width:unset;width:calc(100vw - 32px); }
}

@media (max-width: 480px) {
  .bsf-products-grid { grid-template-columns:repeat(2,1fr);gap:10px; }
  .bsf-card-body { padding:10px; }
  .bsf-card-title { font-size:13px; }
  .bsf-card-price { font-size:14px; }
  .bsf-btn-cart { width:30px;height:30px; }
}

.bsf-block-placeholder { padding:32px;text-align:center;border:2px dashed var(--bsf-border);border-radius:var(--bsf-radius);color:var(--bsf-muted);font-size:14px; }