/* Shared controls retain native semantics, validation and keyboard behaviour. */
body input:is([type=checkbox],[type=radio]){--control-accent:var(--form-primary,#465b35);--control-on-accent:var(--form-button-text,#fff)}
body input:is([type=checkbox],[type=radio]){appearance:none;-webkit-appearance:none;box-sizing:border-box;display:inline-grid;place-content:center;vertical-align:middle;width:21px;height:21px;min-width:21px;min-height:21px;flex:0 0 21px;padding:0;margin:0 9px 0 0;border:1.5px solid #9aa78f;border-radius:6px;background:#fff;color:var(--control-on-accent);cursor:pointer;box-shadow:0 1px 2px #25331b0a;transition:background .15s,border-color .15s,box-shadow .15s}
body input[type=radio]{border-radius:50%}
body input:is([type=checkbox],[type=radio])::before{content:"";display:block;opacity:0;transition:opacity .1s}
body input[type=checkbox]::before{width:6px;height:11px;border:solid currentColor;border-width:0 2px 2px 0;transform:translateY(-1px) rotate(45deg)}
body input[type=radio]::before{width:9px;height:9px;border-radius:50%;background:currentColor}
body input:is([type=checkbox],[type=radio]):checked{background:var(--control-accent);border-color:var(--control-accent)}
body input:is([type=checkbox],[type=radio]):checked::before{opacity:1}
body input[type=checkbox]:indeterminate{background:var(--control-accent);border-color:var(--control-accent)}
body input[type=checkbox]:indeterminate::before{opacity:1;width:10px;height:0;border:0;border-top:2px solid currentColor;transform:none}
body input:is([type=checkbox],[type=radio]):hover:not(:disabled){border-color:var(--control-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--control-accent) 12%,transparent)}
body input:is([type=checkbox],[type=radio]):focus-visible{outline:3px solid var(--control-accent);outline-offset:4px}
body input:is([type=checkbox],[type=radio]):disabled{opacity:.45;cursor:not-allowed}
body input:is([type=checkbox],[type=radio])[aria-invalid=true]{border-color:#b34136}
body .answer-scale .answer-choice input{width:1px;height:1px;min-width:0;min-height:0;opacity:0;position:absolute;margin:0}
body .answer-choice input,body label.check>input{margin:0;flex-shrink:0}
@media(prefers-reduced-motion:reduce){body input:is([type=checkbox],[type=radio]),body input:is([type=checkbox],[type=radio])::before{transition:none}}
@media(forced-colors:active){body input:is([type=checkbox],[type=radio]){forced-color-adjust:none;background:Canvas;color:CanvasText;border-color:CanvasText}body input:is([type=checkbox],[type=radio]):checked,body input[type=checkbox]:indeterminate{background:Highlight;border-color:Highlight;color:HighlightText}body input:is([type=checkbox],[type=radio]):disabled{border-color:GrayText;color:GrayText;opacity:1}body input:is([type=checkbox],[type=radio]):focus-visible{outline-color:Highlight}}

/* Native select behaviour, with a consistent inset disclosure icon. */
body select:not([multiple]):is(:not([size]),[size="1"],[size="0"]){appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='m6 8 4 4 4-4' stroke='%23546249' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:20px 20px;padding-inline-end:48px;min-height:44px;line-height:1.5;text-overflow:ellipsis}
body select:not([multiple]):dir(rtl){background-position:left 14px center}
body select:focus-visible{outline:3px solid var(--form-primary,#465b35);outline-offset:3px}
body select:disabled{opacity:.55;cursor:not-allowed}
body .actions{column-gap:12px;row-gap:12px}
body .actions + p,body .actions + .actions{margin-block-start:20px}
@media(forced-colors:active){body select:not([multiple]){appearance:auto;-webkit-appearance:auto;background-image:none;padding-inline-end:14px}}

/* Keep action groups usable when controls wrap or live inside separate forms. */
body .actions>form{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin:0}
body .product-filter-row>p{flex:1 0 100%;margin:0}
body .product-filter-row>.actions{align-self:flex-end;margin:0}
body .product-filter-row>.actions+ p{margin-top:0}
body .actions>button,body .actions>.button,body .actions>form>button{max-width:100%;white-space:normal;text-align:center}