/* WordPress adaptation of the v10 quiz (design-system/quiz.css stays the source).
   Choices are native radio/checkbox inputs inside labels so the form also works
   without JavaScript; the input is visually hidden and the label gets the focus ring. */
.quiz .choice,.quiz .chip-option{position:relative;cursor:pointer}
.quiz .choice__input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
.quiz .choice:has(.choice__input:checked){border-color:var(--primary);background:var(--accent-soft);box-shadow:inset 0 0 0 1px var(--primary)}
.quiz .chip-option:has(.choice__input:checked){color:var(--primary-ink);border-color:var(--primary);background:var(--primary)}
.quiz .choice:has(.choice__input:focus-visible),.quiz .chip-option:has(.choice__input:focus-visible),.quiz-summary__tag:focus-visible{outline:3px solid var(--outline,var(--focus));outline-offset:3px}
.quiz-summary__tag{display:inline-flex;align-items:center;min-height:32px;padding:5px 9px;color:var(--ink);border:1px solid var(--line);border-radius:999px;background:var(--surface-2);font-size:.78rem;text-decoration:none}
.quiz-summary__tag:hover{border-color:var(--primary)}
.quiz-results__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s4,16px)}
.quiz-navigation{display:flex}
.quiz-navigation [data-back]{order:-1;margin-right:auto}
.quiz-navigation [data-next]{margin-left:auto}
[data-results-slot][aria-busy=true]{opacity:.55}
.quiz .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* Онлайн-подбор (#341): 3 шага без ввода текста, каждый экран целиком в 1440×900 и 390×844. */
.quiz.quiz--picker{padding-block:clamp(16px,3vh,32px)}
.quiz--picker .quiz__intro h1{margin:4px 0 0;font-size:clamp(1.5rem,2.4vw,2rem)}
.quiz--picker .quiz__layout{display:block;margin-top:16px;max-width:none!important}
.quiz--picker .quiz__aside{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:12px;padding:0;border:0;background:none;box-shadow:none;backdrop-filter:none}
.quiz--picker .quiz-progress{display:flex;gap:8px;flex:1}
.quiz--picker .quiz-progress li{display:block;flex:1;height:4px;padding:0;border-radius:999px;background:var(--line);font-size:0}
.quiz--picker .quiz-progress li::before{display:none}
.quiz--picker .quiz-progress li.is-current,.quiz--picker .quiz-progress li.is-complete{background:var(--primary)}
.quiz--picker .quiz-progress__status{margin:0;white-space:nowrap}
.quiz--picker .quiz__card{padding:clamp(16px,2.4vw,28px)}
.quiz--picker .quiz-step h2{font-size:clamp(1.4rem,2.2vw,1.9rem)}
.quiz--picker .quiz-step__lead{margin-top:6px}
.quiz--picker .choice-grid--product{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(190px,1fr))!important;gap:8px!important;margin-top:16px}
.quiz--picker .choice-grid--product .choice{flex-direction:row;align-items:center;gap:12px;min-height:60px!important;padding:6px 12px 6px 6px;border-radius:var(--r)}
.quiz--picker .choice-grid--product .choice img{width:48px;height:48px;aspect-ratio:1;margin:0;border-radius:var(--r-sm)}
.quiz--picker .choice-grid--product .choice b{padding:0;font-size:.9375rem}
.quiz--picker .chip-fieldset{margin:16px 0 0;padding:0;border:0;background:none;display:flex;flex-wrap:wrap;gap:10px}
.quiz--picker .chip-option{min-height:52px;margin:0;padding:12px 22px;font-size:1rem}
.quiz--picker .quiz-navigation{margin-top:16px;padding-top:16px}
.quiz--picker .quiz-results{margin-top:12px}
.quiz--picker .quiz-results__grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.quiz--picker .quiz-results .product-card__meta,.quiz--picker .quiz-results .product-quantity,.quiz--picker .quiz-results .product-card__actions,.quiz--picker .quiz-results .product-card__body>small{display:none}
.quiz--picker .quiz-results .product-card__image img{aspect-ratio:16/10;height:auto;object-fit:cover}
.quiz--picker .quiz-results__actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin-top:16px}
@media(max-width:580px){
.quiz--picker .quiz__intro .eyebrow,.quiz--picker .quiz-step:not(.quiz-step--results) .quiz-step__lead{display:none}
.quiz.quiz--picker{padding-top:12px!important}
.quiz--picker .quiz__intro h1{font-size:1.5rem!important;line-height:1.15!important}
.quiz--picker .quiz__layout{margin-top:8px!important}
.quiz--picker .quiz-step h2{font-size:1.35rem!important}
.quiz--picker .choice-grid--product{gap:6px!important;margin-top:10px}
.quiz--picker .choice-grid--product{grid-template-columns:repeat(2,minmax(0,1fr))!important}
.quiz--picker .choice-grid--product .choice{gap:8px;padding:4px 6px 4px 4px;min-height:48px!important}
.quiz--picker .choice-grid--product .choice img{width:40px;height:40px}
.quiz--picker .quiz-navigation{margin-top:10px;padding-top:10px}
.quiz--picker .choice-grid--product .choice b{font-size:.8125rem}
.quiz--picker .quiz-results__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.quiz--picker .quiz-results .product-card__tags{display:none}
.quiz--picker .quiz-results__actions .button{flex:1 1 100%}
}
.quiz--picker .choice-grid--product .choice:not(:has(img)){padding-left:14px}

/* Результат: сводка ответов, «Показать ещё», кнопки действий (#341). */
.quiz-summary{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.quiz-summary__tag{gap:8px;min-height:36px;padding:6px 12px;font-size:.875rem}
.quiz-summary__edit{color:var(--primary);text-decoration:underline;text-underline-offset:3px}
.quiz-results__more{display:flex;justify-content:center;margin:20px 0 0}
.quiz-results__actions .button{display:inline-flex;align-items:center;gap:8px}
.quiz-results__actions .shell-icon{width:20px;height:20px;flex:0 0 20px}

/* Чипы подбора (#674): различимые состояния на токенах дизайн-системы. */
.quiz--picker .chip-option{display:inline-flex;align-items:center;gap:8px;transition:border-color var(--motion-fast) var(--ease),background-color var(--motion-fast) var(--ease),box-shadow var(--motion-fast) var(--ease)}
.quiz--picker .chip-option .shell-icon{width:0;height:1.25rem;flex:0 0 0;opacity:0;transition:width var(--motion-fast) var(--ease),flex-basis var(--motion-fast) var(--ease),opacity var(--motion-fast) var(--ease)}
.quiz--picker .chip-option.is-selected .shell-icon{width:1.25rem;flex-basis:1.25rem;opacity:1}
.quiz--picker .chip-option:hover{border-color:var(--accent);background:var(--accent-soft)}
.quiz--picker .chip-option.is-selected,.quiz--picker .chip-option.is-selected:hover{color:var(--primary-ink);border-color:var(--primary);background:var(--primary);box-shadow:0 0 0 2px var(--accent)}
.quiz--picker .chip-option--any:not(.is-selected){border-style:dashed;color:var(--muted)}
.quiz--picker .choice:hover{border-color:var(--accent)}
.quiz--picker .choice:has(.choice__input:checked){border-color:var(--accent);box-shadow:inset 0 0 0 2px var(--accent)}
.quiz-note{flex-basis:100%;margin:4px 0 0;padding:12px 16px;border-left:3px solid var(--accent);border-radius:var(--r-sm);background:var(--accent-soft);color:var(--ink);font-size:.9375rem}
