/* Alergenos UI (mobile-first) */
.alergenos-toolbar{position:sticky;top:48px;z-index:900;background:#fff;border:1px solid #dfe7f2;border-radius:12px;padding:8px 10px;margin:10px 0;display:flex;align-items:center;gap:8px}
@media(min-width:900px){.alergenos-toolbar{top:8px}}
.alergenos-btn{border:2px solid #101010;background:#fff;color:#101010;border-radius:999px;padding:8px 12px;font-weight:700;font-size:12px;cursor:pointer;transition:.2s}
.alergenos-btn:hover{background:#97c6f0}
.alergenos-filter{margin-left:auto;position:relative}
.alergenos-filter-toggle{border:2px solid #101010;background:#fff;color:#101010;border-radius:999px;padding:8px 12px;font-weight:700;font-size:12px;cursor:pointer}
.alergenos-panel{position:absolute;right:0;top:40px;background:#fff;border:1px solid #dfe7f2;border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.12);padding:10px;min-width:260px;display:none}
.alergenos-panel.show{display:block}
.alergenos-panel h4{margin:0 0 6px 0;font-size:12px;letter-spacing:.3px;color:#101010}
.alergenos-checklist{display:flex;flex-wrap:wrap;gap:6px}
.alergenos-chip{display:inline-flex;align-items:center;gap:6px;border:1px solid #dfe7f2;border-radius:999px;padding:6px 10px;font-size:12px;background:#fff;cursor:pointer}
.alergenos-chip input{margin:0}
.alergenos-icons{display:none;gap:6px;align-items:center;flex-wrap:wrap}
.alergenos-icons.visible{display:inline-flex}
.alergenos-icons img{width:18px;height:18px;object-fit:contain;display:none}
.alergenos-icons .alerg-icon{width:18px;height:18px;display:inline-block;background: var(--alerg-color, #101010);
	-webkit-mask: var(--alerg-icon) no-repeat center / contain;
	mask: var(--alerg-icon) no-repeat center / contain;
	cursor:pointer;
	transition:.2s;
}
.alergenos-icons .alerg-icon:active{transform:scale(0.9)}
.alergenos-icons .alerg-icon.is-adaptable{box-shadow: inset 0 0 0 2px #97c6f0;border-radius:50%;background:#97c6f0}

/* Contenedor para mantener iconos y adaptables en línea */
.alergenos-wrapper{display:inline-flex;align-items:center;gap:0;margin-top:4px;flex-wrap:wrap}

/* Sección de adaptables */
.alergenos-adapt-section{display:none;align-items:center;gap:6px;margin-left:8px;font-size:12px;color:#666;flex-wrap:wrap}
.alergenos-adapt-section.visible{display:inline-flex}
.alergenos-adapt-label{font-weight:600;color:#101010;white-space:nowrap}
.alergenos-adapt-icons{display:inline-flex;gap:6px;align-items:center;flex-wrap:wrap}
.alergenos-adapt-icons .alerg-icon{width:16px;height:16px;display:inline-block;background:var(--alerg-color, #101010);-webkit-mask:var(--alerg-icon) no-repeat center / contain;mask:var(--alerg-icon) no-repeat center / contain;cursor:pointer;transition:.2s}
.alergenos-adapt-icons .alerg-icon:active{transform:scale(0.9)}

.alergenos-adaptable{display:none;margin-left:8px;font-size:11px;border:1px dashed #97c6f0;color:#101010;border-radius:999px;padding:3px 8px;align-self:center}
.alergenos-adaptable.show{display:inline-flex}
.alergenos-adaptable.match{border-style:solid;background:#e9f4ff}

/* Filtering states */
.alergenos-hidden{display:none !important}
.alergenos-highlight{outline:2px solid #ffd666;outline-offset:2px;border-radius:8px}
.alergenos-row.alergenos-adaptable-ok{outline:2px dashed #97c6f0;outline-offset:2px;border-radius:8px;background:#f5faff}

/* Small helper layout inside rows */
.alergenos-inline{display:flex;flex-direction:column}
@media(min-width:700px){.alergenos-inline{flex-direction:row;gap:8px;align-items:center}}

/* Tooltip para iconos */
.alerg-tooltip{position:absolute;background:#101010;color:#fff;padding:6px 12px;border-radius:8px;font-size:12px;font-weight:600;white-space:nowrap;z-index:10000;pointer-events:none;opacity:0;transform:translateY(-4px);transition:opacity .2s, transform .2s;box-shadow:0 4px 12px rgba(0,0,0,.2)}
.alerg-tooltip.show{opacity:1;transform:translateY(0)}
.alerg-tooltip::before{content:'';position:absolute;top:-4px;left:50%;transform:translateX(-50%);width:0;height:0;border-left:6px solid transparent;border-right:6px solid transparent;border-bottom:4px solid #101010}
