/* Widget clubmed.quote: usa los componentes pf-* (css/package-funnel.css); acá solo lo propio. */
.cmq { margin-bottom: 0; }
.cmq__head { max-width: 720px; margin: 0 auto 22px; }
.cmq .pf-progress { position: static; background: none; backdrop-filter: none; }
.cmq .pf-step__actions { position: static; background: none; }
.cmq .pf-card { background: transparent; }
.cmq__title { font-size: clamp(1.4rem, 2.6vw, 1.9rem); }
.cmq__meal { display: inline-block; margin-left: 4px; padding: 2px 10px; border-radius: 999px; font-size: .8rem; font-weight: 800; vertical-align: middle;
             color: var(--pf-ok); background: #e7f6ec; }
.cmq__textarea { height: auto; min-height: 96px; padding: 12px 14px; resize: vertical; line-height: 1.5; }

.cmq__filters { display: flex; gap: 8px; margin: 0 0 16px; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; }
.cmq__filters::-webkit-scrollbar { display: none; }
.cmq__filter { flex: none; border: 1.5px solid #d0d5dd; background: #fff; border-radius: 999px; padding: 8px 16px; font-weight: 700; font-size: .9rem;
               color: var(--pf-ink); cursor: pointer; white-space: nowrap; }
.cmq__filter:hover { border-color: var(--pf-ink); }
.cmq__filter.is-on { border-color: var(--pf-ink); background: var(--pf-ink); color: #fff; }
.cmq__group + .cmq__group { margin-top: 18px; }
.cmq__gname { margin: 0 0 10px; font-size: .8rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: var(--pf-muted); }
.cmq__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 12px; }
.pf-option.cmq__card { display: flex; flex-direction: column; padding: 0; overflow: hidden; border-radius: 16px; min-height: 0; text-align: left; }
.cmq__img { position: relative; display: block; aspect-ratio: 16 / 10; background: var(--pf-soft); overflow: hidden; }
.cmq__img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .35s ease; }
.cmq__card:hover .cmq__img img { transform: scale(1.04); }
.cmq__badge { position: absolute; left: 10px; top: 10px; padding: 3px 9px; border-radius: 999px; font-size: .7rem; font-weight: 800; color: var(--pf-ink);
              background: rgba(255, 255, 255, .94); }
.cmq__check { position: absolute; right: 10px; top: 10px; width: 28px; height: 28px; border-radius: 50%; border: 2px solid #fff;
              background: rgba(16, 24, 40, .35); box-shadow: 0 2px 8px rgba(16, 24, 40, .25); }
.cmq__card.is-selected .cmq__check { background: var(--pf-accent); }
.cmq__card.is-selected .cmq__check::after { content: "\2713"; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
                                            color: #fff; font-size: .85rem; font-weight: 900; }
.cmq__body { display: flex; flex-direction: column; gap: 3px; padding: 12px 14px 14px; }
.cmq__name { font-weight: 800; font-size: .98rem; line-height: 1.25; color: var(--pf-ink); }
.cmq__card.is-selected .cmq__name { color: var(--pf-accent); }
.cmq__place { font-size: .8rem; font-weight: 600; color: var(--pf-muted); }
.cmq__note { font-size: .8rem; font-weight: 500; line-height: 1.4; color: var(--pf-muted); }
.pf-option.cmq__help { margin-top: 16px; }

@media (max-width: 575.98px) {
    .cmq__grid { grid-template-columns: 1fr 1fr; gap: 10px; }
    .cmq__body { padding: 10px 11px 12px; }
    .cmq__name { font-size: .9rem; }
    .cmq__note { display: none; }
}
