/* PLPBTN 3 Oct 2026 (Ashley): one full-width CTA per card, same place, pinned to the card bottom. Cuckooland green stays (cl-cro .cl-card-cta).
   simple = ADD TO BASKET, options = CHOOSE SIZE / COLOUR / OPTIONS (quick picker as a bottom sheet <dialog>), sold out = NOTIFY ME (grey). No floating + on the photo. */
html body#html-body .product-item .cl-ctarow { margin-top: auto; }
html body#html-body.cl-cro .product-item .el-plp-actions .cl-card-cta.cl-card-cta--oos,
html body#html-body.cl-cro .product-item .el-plp-actions .cl-card-cta.cl-card-cta--oos:visited,
html body#html-body.cl-cro .product-item .el-plp-actions .cl-card-cta.cl-card-cta--oos:hover { background: #ececec !important; border-color: #ececec !important; color: #5f6368 !important; }
html body#html-body .dn-qa.cl-qs { position: static; aspect-ratio: auto; z-index: auto; pointer-events: auto; width: 100%; }
html body#html-body .cl-qs .cl-qs__sheet { position: fixed; inset: auto 0 0 0; margin: 0 auto; width: 100%; max-width: min(32rem, 100%); max-height: 85vh; max-height: 85dvh; overflow-y: auto; padding: 1rem 1rem calc(1rem + env(safe-area-inset-bottom, 0px)); border: 0; border-radius: 12px 12px 0 0; background: #fff; color: #1f2937; box-shadow: 0 -8px 32px rgba(0,0,0,.18); text-align: left; }
html body#html-body .cl-qs .cl-qs__sheet:not([open]) { display: none; }
html body#html-body .cl-qs .cl-qs__sheet[open] { display: grid; gap: .75rem; animation: clQsUp .22s ease-out; }
html body#html-body .cl-qs__sheet::backdrop { background: rgba(17,24,39,.45); }
@keyframes clQsUp { from { transform: translateY(100%); } to { transform: none; } }
@media (prefers-reduced-motion: reduce) { html body#html-body .cl-qs .cl-qs__sheet[open] { animation: none; } }
html:has(.cl-qs__sheet[open]) { overflow: hidden; }
html body#html-body .cl-qs__hd { display: flex; align-items: flex-start; justify-content: space-between; gap: .75rem; }
html body#html-body .cl-qs__name { margin: 0; font-size: 1rem; line-height: 1.3; font-weight: 600; color: var(--cl-teal, #1f4e4f); }
html body#html-body .cl-qs__x { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 2.75rem; height: 2.75rem; margin: -.625rem -.625rem 0 0; border: 0; background: transparent; color: #1f2937; cursor: pointer; }
html body#html-body .cl-qs__sheet .dn-qa__h { margin: 0; font-size: .75rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #1f2937; }
html body#html-body .cl-qs__sheet .dn-qa__row { display: grid; grid-template-columns: repeat(auto-fill, minmax(7.5rem, 1fr)); gap: .5rem; }
html body#html-body .cl-qs__sheet .cl-qs__opt { display: inline-flex; align-items: center; justify-content: center; width: 100%; min-height: 3rem; height: auto; padding: .375rem .5rem; border: 1px solid #cfd4d9; border-radius: 3px; background: #fff; color: #1f2937; font-size: .875rem; line-height: 1.2; text-align: center; cursor: pointer; }
html body#html-body .cl-qs__sheet .cl-qs__opt:not(.is-disabled):hover, html body#html-body .cl-qs__sheet .cl-qs__opt:focus-visible { border-color: var(--cl-green, #0b7a43); box-shadow: inset 0 0 0 1px var(--cl-green, #0b7a43); }
html body#html-body .cl-qs__sheet .cl-qs__opt[aria-pressed="true"] { border-color: var(--cl-green, #0b7a43); box-shadow: inset 0 0 0 2px var(--cl-green, #0b7a43); font-weight: 700; }
html body#html-body .cl-qs__sheet .cl-qs__opt.is-disabled { color: #9aa0a6; text-decoration: line-through; border-color: #e5e7eb; cursor: not-allowed; }
html body#html-body .cl-qs__sheet .dn-qa__add { background: var(--cl-green, #0b7a43); border-color: var(--cl-green, #0b7a43); color: #fff; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
html body#html-body .cl-qs__pdp { justify-self: center; display: inline-flex; align-items: center; min-height: 2.75rem; font-size: .875rem; color: var(--cl-teal, #1f4e4f); text-decoration: underline; text-underline-offset: 3px; }
