.wcls,.wcls-ov{color:var(--wcls-text,#222)}
.wcls{position:relative;width:100%}
.wcls *,.wcls-ov *{box-sizing:border-box}

/* Campo */
.wcls__form{display:flex;align-items:stretch;height:var(--wcls-h,46px);border:1px solid var(--wcls-border,#ddd);border-radius:var(--wcls-radius,8px);background:var(--wcls-bg,#fff);overflow:hidden}
.wcls__form:focus-within{border-color:var(--wcls-accent,#111);box-shadow:0 0 0 1px var(--wcls-accent,#111)}
.wcls__input{flex:1;min-width:0;border:0!important;box-shadow:none!important;background:transparent!important;padding:0 14px;height:100%;color:inherit;font-size:15px;outline:0;-webkit-appearance:none}
.wcls__cat{border:0;border-right:1px solid var(--wcls-border,#ddd);background:transparent;padding:0 10px;max-width:160px;color:inherit;height:100%}
.wcls__submit{display:flex;align-items:center;justify-content:center;width:var(--wcls-h,46px);border:0;background:var(--wcls-accent,#111);color:#fff;cursor:pointer;padding:0}
.wcls__submit:hover{opacity:.88}

/* Panel (dropdown / inline) */
.wcls__panel{background:var(--wcls-bg,#fff);border:1px solid var(--wcls-border,#ddd);border-radius:var(--wcls-radius,8px);margin-top:6px;padding:14px;overflow:auto;max-height:var(--wcls-mh,75vh)}
.wcls__panel[hidden]{display:none}
.wcls[data-layout="dropdown"] .wcls__panel{position:absolute;top:100%;left:0;z-index:9999;width:var(--wcls-pw,900px);max-width:calc(100vw - 24px);box-shadow:0 12px 32px rgba(0,0,0,.14)}
.wcls[data-layout="inline"] .wcls__panel{position:static}

/* Resultados */
.wcls__status{font-size:14px;opacity:.75;padding:2px 0 8px}
.wcls__status:empty{display:none}
.wcls.is-loading .wcls__results,.wcls-ov.is-loading .wcls__results{opacity:.45;transition:opacity .15s}
.wcls__results{display:grid;grid-template-columns:repeat(var(--wcls-cols,4),minmax(0,1fr));gap:16px}
.wcls-item{min-width:0}
.wcls-item .products{margin:0;padding:0;list-style:none}
.wcls[data-card-border="1"] .wcls-item,.wcls-ov[data-card-border="1"] .wcls-item{border:1px solid var(--wcls-border,#ddd);border-radius:var(--wcls-cr,6px);padding:12px;background:var(--wcls-bg,#fff)}
.wcls__all{display:table;margin:28px auto 0;padding:14px 32px;text-align:center;text-decoration:none;border-radius:var(--wcls-radius,8px);background:var(--wcls-accent,#111);color:#fff!important;font-weight:600}
.wcls__all[hidden]{display:none}

/* Pantalla completa bajo el header */
.wcls[data-layout="overlay"]{width:auto;display:inline-block}
.wcls__trigger{display:inline-flex;align-items:center;justify-content:center;background:none;border:0;padding:8px;margin:0;cursor:pointer;color:inherit;line-height:1;box-shadow:none}
.wcls-ov{position:fixed;inset:0;z-index:100000;pointer-events:none}
.wcls-ov[hidden]{display:none}
.wcls__backdrop,.wcls__sheet{pointer-events:auto}
.wcls__backdrop{position:absolute;left:0;right:0;bottom:0;top:var(--wcls-top,0px);background:rgba(0,0,0,.45)}
.wcls__sheet{position:absolute;left:0;right:0;top:var(--wcls-top,0px);max-height:calc(100vh - var(--wcls-top,0px));overflow:auto;background:var(--wcls-bg,#fff);box-shadow:0 12px 32px rgba(0,0,0,.12)}
.wcls__inner{max-width:var(--wcls-cw,1280px);margin:0 auto;padding:0 24px 44px}
.wcls-ov .wcls__form{height:auto;min-height:calc(var(--wcls-h,46px) + 40px);border:0;border-radius:0;background:transparent;padding:22px 0;align-items:center;gap:16px;overflow:visible}
.wcls-ov .wcls__form:focus-within{border:0;box-shadow:none}
.wcls-ov .wcls__input{font-size:var(--wcls-fs,28px);font-weight:500;padding:0;height:auto;line-height:1.3}
.wcls__icon{display:inline-flex;flex:none}
.wcls__close{display:inline-flex;flex:none;align-items:center;justify-content:center;background:none;border:0;padding:8px;cursor:pointer;color:inherit;box-shadow:none}
.wcls-ov .wcls__panel{position:static;border:0;border-radius:0;background:transparent;padding:0;margin:0;max-height:none;overflow:visible;box-shadow:none;width:auto}
.wcls__tab{border-bottom:1px solid var(--wcls-border,#ddd);margin:14px 0 28px}
.wcls__tab span{display:inline-block;padding-bottom:14px;border-bottom:2px solid var(--wcls-text,#222);margin-bottom:-1px;font-weight:600;font-size:16px}
html.wcls-lock{overflow:hidden}

@media (max-width:767px){
  .wcls__results{grid-template-columns:repeat(var(--wcls-cols-m,2),minmax(0,1fr));gap:10px}
  .wcls__cat{max-width:110px}
  .wcls[data-layout="dropdown"] .wcls__panel{position:fixed;left:12px;right:12px;top:auto;width:auto;max-width:none}
  .wcls__inner{padding:0 14px 28px}
  .wcls-ov .wcls__input{font-size:20px}
  .wcls-ov .wcls__form{padding:14px 0}
}