.wapu-archive__category-desc--top{padding:var(--ds-s-4) var(--ds-s-5) var(--ds-s-2);border-bottom:var(--ds-border-thin) solid var(--ds-separator-soft);max-width:100%}.wapu-archive__category-desc-eyebrow{font-family:var(--ds-font-display);font-size:var(--ds-fs-caption-2);font-weight:var(--ds-fw-semibold);letter-spacing:var(--ds-ls-wide);text-transform:uppercase;color:var(--ds-ink-3);margin:0 0 var(--ds-s-1)}.wapu-archive__category-desc--top p{font-family:var(--ds-font-text);font-size:var(--ds-fs-body);line-height:var(--ds-lh-relaxed);color:var(--ds-ink-2);margin:0 0 var(--ds-s-1);max-width:680px}.wapu-archive__category-desc--top p:last-child{margin-bottom:0}.wapu-archive__category-desc--top strong{color:var(--ds-ink);font-weight:var(--ds-fw-semibold)}.wapu-archive__sort-btn--plain{display:inline-flex;align-items:center;gap:var(--ds-s-1);padding:0 var(--ds-s-2);min-height:32px;background:transparent;border:0;border-radius:var(--ds-r-pill);font-family:var(--ds-font-text);font-size:var(--ds-fs-footnote);font-weight:var(--ds-fw-medium);color:var(--ds-ink);cursor:pointer;transition:background-color var(--ds-dur-fast) var(--ds-ease)}.wapu-archive__sort-btn--plain:hover{background:var(--ds-fill-4)}.wapu-archive__sort-btn--plain.is-active{background:var(--ds-fill-3);font-weight:var(--ds-fw-semibold)}.wapu-archive__sort-btn--plain .wapu-archive__sort-chevron{transition:transform var(--ds-dur-fast) var(--ds-ease)}.wapu-archive__sort-btn--plain[aria-expanded=true] .wapu-archive__sort-chevron{transform:rotate(180deg)}.wapu-archive__collections-btn{display:inline-flex;align-items:center;gap:var(--ds-s-1);padding:0 var(--ds-s-2);min-height:32px;background:var(--ds-ink);color:var(--ds-surface);border:0;border-radius:var(--ds-r-pill);font-family:var(--ds-font-text);font-size:var(--ds-fs-footnote);font-weight:var(--ds-fw-medium);cursor:pointer;transition:opacity var(--ds-dur-fast) var(--ds-ease)}.wapu-archive__collections-btn:hover{opacity:.85}.wapu-archive__collections-btn:active{transform:scale(.98)}.wapu-archive__collections-btn[disabled]{opacity:.4;cursor:not-allowed}.wapu-archive__collections-btn .wapu-archive__collections-icon{width:16px;height:16px;flex-shrink:0}.wapu-archive__filter-bar{position:sticky;top:0;z-index:20;background:#ffffffeb;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:flex-end;max-width:1400px;margin:0 auto var(--ds-s-2);padding:var(--ds-s-1) 0}.wapu-archive__empty{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:var(--ds-s-8) var(--ds-s-5);text-align:center;gap:var(--ds-s-2);min-height:320px}.wapu-archive__empty-icon{width:56px;height:56px;border-radius:var(--ds-r-pill);background:var(--ds-fill-3);display:flex;align-items:center;justify-content:center;color:var(--ds-ink-3);margin-bottom:var(--ds-s-1)}.wapu-archive__empty-icon svg{width:24px;height:24px}.wapu-archive__empty-title{font-family:var(--ds-font-display);font-size:var(--ds-fs-title-3);font-weight:var(--ds-fw-regular);font-style:normal;color:var(--ds-ink);margin:0;line-height:var(--ds-lh-snug)}.wapu-archive__empty-message{font-family:var(--ds-font-text);font-size:var(--ds-fs-footnote);color:var(--ds-ink-3);margin:0;max-width:400px;line-height:var(--ds-lh-relaxed)}.wapu-archive__empty-cta{margin-top:var(--ds-s-1);display:inline-flex;align-items:center;justify-content:center;padding:0 var(--ds-s-3);min-height:40px;background:var(--ds-ink);color:var(--ds-surface);border:0;border-radius:var(--ds-r-pill);font-family:var(--ds-font-text);font-size:var(--ds-fs-footnote);font-weight:var(--ds-fw-medium);text-decoration:none;cursor:pointer;transition:opacity var(--ds-dur-fast) var(--ds-ease)}.wapu-archive__empty-cta:hover{opacity:.85}.wapu-archive__empty-cta:active{transform:scale(.98)}.wapu-archive__filters-sheet{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;visibility:hidden;opacity:0;transition:opacity var(--ds-dur) var(--ds-ease),visibility var(--ds-dur) var(--ds-ease);pointer-events:none}.wapu-archive__filters-sheet.is-open{visibility:visible;opacity:1;pointer-events:auto}.wapu-archive__filters-sheet-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#0006;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);border:0;cursor:pointer;padding:0}.wapu-archive__filters-sheet-dialog{position:absolute;bottom:0;left:0;right:0;max-height:85vh;max-height:85svh;background:var(--ds-surface);border-radius:var(--ds-r-xl) var(--ds-r-xl) 0 0;display:flex;flex-direction:column;transform:translateY(100%);transition:transform var(--ds-dur) var(--ds-ease);overflow:hidden}.wapu-archive__filters-sheet.is-open .wapu-archive__filters-sheet-dialog{transform:translateY(0)}.wapu-archive__filters-sheet-handle{width:36px;height:4px;background:var(--ds-fill-2);border-radius:var(--ds-r-pill);margin:var(--ds-s-1) auto var(--ds-s-half);flex-shrink:0}.wapu-archive__filters-sheet-header{display:flex;align-items:center;justify-content:space-between;padding:var(--ds-s-1) var(--ds-s-2) var(--ds-s-2);border-bottom:var(--ds-border-thin) solid var(--ds-separator-soft);flex-shrink:0}.wapu-archive__filters-sheet-title{font-family:var(--ds-font-text);font-size:var(--ds-fs-callout);font-weight:var(--ds-fw-semibold);color:var(--ds-ink);margin:0}.wapu-archive__filters-sheet-close{background:transparent;border:0;font-family:var(--ds-font-text);font-size:var(--ds-fs-footnote);font-weight:var(--ds-fw-medium);color:var(--ds-ink-3);cursor:pointer;padding:var(--ds-s-half) var(--ds-s-1);border-radius:var(--ds-r-sm);transition:color var(--ds-dur-fast) var(--ds-ease)}.wapu-archive__filters-sheet-close:hover{color:var(--ds-ink)}.wapu-archive__filters-sheet-body{padding:var(--ds-s-1) var(--ds-s-2) 0;overflow-y:auto;flex:1;overscroll-behavior:contain}.wapu-archive__filters-sheet-section{padding:var(--ds-s-2) 0;border-bottom:var(--ds-border-thin) solid var(--ds-separator-soft)}.wapu-archive__filters-sheet-section:last-child{border-bottom:0}.wapu-archive__filters-sheet-section-head{display:flex;align-items:center;justify-content:space-between;width:100%;padding:var(--ds-s-1) 0;margin:0;background:transparent;border:0;cursor:pointer;font-family:inherit;text-align:left;transition:opacity var(--ds-dur-fast) var(--ds-ease)}.wapu-archive__filters-sheet-section-head:hover{opacity:.75}.wapu-archive__filters-sheet-section-title{font-family:var(--ds-font-text);font-size:var(--ds-fs-footnote);font-weight:var(--ds-fw-semibold);color:var(--ds-ink);margin:0}.wapu-archive__filters-sheet-section-meta{display:inline-flex;align-items:center;gap:var(--ds-s-1)}.wapu-archive__filters-sheet-section-count{font-family:var(--ds-font-text);font-size:var(--ds-fs-caption-2);color:var(--ds-ink-3)}.wapu-archive__filters-sheet-section-active{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 var(--ds-s-half);background:var(--ds-ink);color:var(--ds-surface);border-radius:var(--ds-r-pill);font-size:var(--ds-fs-caption-2);font-weight:var(--ds-fw-semibold)}.wapu-archive__filters-sheet-section-chevron{color:var(--ds-ink-3);transition:transform var(--ds-dur-fast) var(--ds-ease);flex-shrink:0}.wapu-archive__filters-sheet-section.is-expanded .wapu-archive__filters-sheet-section-chevron{transform:rotate(180deg)}.wapu-archive__filters-sheet-section:not(.is-expanded) .wapu-archive__filters-sheet-options{display:none}.wapu-archive__filters-sheet-section.is-expanded .wapu-archive__filters-sheet-options{margin-top:var(--ds-s-1)}.wapu-archive__filters-sheet-options{display:flex;flex-wrap:wrap;gap:var(--ds-s-1)}.wapu-archive__filters-sheet-opt{display:inline-flex;align-items:center;gap:var(--ds-s-half);padding:0 var(--ds-s-1);min-height:32px;background:var(--ds-fill-4);color:var(--ds-ink);border:0;border-radius:var(--ds-r-pill);font-family:var(--ds-font-text);font-size:var(--ds-fs-caption-1);font-weight:var(--ds-fw-medium);cursor:pointer;transition:background-color var(--ds-dur-fast) var(--ds-ease),color var(--ds-dur-fast) var(--ds-ease)}.wapu-archive__filters-sheet-opt:hover{background:var(--ds-fill-3)}.wapu-archive__filters-sheet-opt.is-selected{background:var(--ds-ink);color:var(--ds-surface)}.wapu-archive__filters-sheet-opt.is-selected:hover{opacity:.85}.wapu-archive__filters-sheet-opt svg{flex-shrink:0}.wapu-archive__filters-sheet-opt-label{white-space:nowrap}.wapu-archive__filters-sheet-opt-count{font-size:var(--ds-fs-caption-2);opacity:.55}.wapu-archive__filters-sheet-opt.is-selected .wapu-archive__filters-sheet-opt-count{opacity:.7}.wapu-archive__filters-sheet-footer{display:flex;gap:var(--ds-s-1);padding:var(--ds-s-2);padding-bottom:calc(var(--ds-s-2) + env(safe-area-inset-bottom,0px));border-top:var(--ds-border-thin) solid var(--ds-separator-soft);background:var(--ds-surface);flex-shrink:0}.wapu-archive__filters-sheet-reset{display:inline-flex;align-items:center;justify-content:center;padding:0 var(--ds-s-3);min-height:44px;background:transparent;border:var(--ds-border-thin) solid var(--ds-separator);border-radius:var(--ds-r-pill);font-family:var(--ds-font-text);font-size:var(--ds-fs-footnote);font-weight:var(--ds-fw-medium);color:var(--ds-ink);text-decoration:none;cursor:pointer;flex-shrink:0;transition:background-color var(--ds-dur-fast) var(--ds-ease)}.wapu-archive__filters-sheet-reset:hover{background:var(--ds-fill-4)}.wapu-archive__filters-sheet-apply{flex:1;min-height:44px;background:var(--ds-ink);color:var(--ds-surface);border:0;border-radius:var(--ds-r-pill);font-family:var(--ds-font-text);font-size:var(--ds-fs-footnote);font-weight:var(--ds-fw-semibold);cursor:pointer;transition:opacity var(--ds-dur-fast) var(--ds-ease)}.wapu-archive__filters-sheet-apply:hover{opacity:.88}.wapu-archive__filters-sheet-apply:active{transform:scale(.99)}.wapu-archive__filters-sheet-apply.is-loading{opacity:.6;cursor:wait}@media (min-width: 900px){.wapu-archive__filters-sheet-dialog{top:0;bottom:0;left:auto;right:0;width:min(480px,100%);max-height:100vh;max-height:100svh;border-radius:var(--ds-r-xl) 0 0 var(--ds-r-xl);transform:translate(100%)}.wapu-archive__filters-sheet.is-open .wapu-archive__filters-sheet-dialog{transform:translate(0)}.wapu-archive__filters-sheet-handle{display:none}.wapu-archive__filters-sheet-header{padding:var(--ds-s-3) var(--ds-s-3) var(--ds-s-2)}.wapu-archive__filters-sheet-body{padding:var(--ds-s-1) var(--ds-s-3) 0}.wapu-archive__filters-sheet-footer{padding:var(--ds-s-2) var(--ds-s-3)}}body.wapu-filters-sheet-open{overflow:hidden}.wapu-archive__mobile-nav{display:none}.wapu-archive{background:var(--ds-surface);min-height:100vh;padding:var(--ds-s-5) var(--ds-s-5) var(--ds-s-6);box-sizing:border-box}.wapu-archive__toolbar{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;max-width:1400px;margin:0 auto 24px;padding-bottom:20px;border-bottom:.5px solid rgba(0,0,0,.08)}.wapu-archive__toolbar-left{min-width:0;display:flex;flex-direction:column;gap:8px}.wapu-archive__eyebrow{font-family:var(--ds-font-text);font-size:var(--ds-fs-caption-2);letter-spacing:.3em;text-transform:uppercase;color:var(--ds-ink-4);font-weight:var(--ds-fw-medium);line-height:1}.wapu-archive__title{margin:0;font-family:var(--ds-font-display);font-size:var(--ds-fs-hero-display);font-weight:var(--ds-fw-regular);font-style:normal;line-height:1;letter-spacing:-.025em;color:var(--ds-ink)}.wapu-archive__section-title{margin:0;font-family:var(--ds-font-display);font-size:clamp(26px,2.5vw,36px);font-weight:var(--ds-fw-bold);line-height:1.05;letter-spacing:var(--ds-ls-tight);color:var(--ds-ink)}.wapu-archive__section-count{margin:6px 0 0;font-family:var(--ds-font-text);font-size:var(--ds-fs-footnote);font-weight:var(--ds-fw-medium);color:var(--ds-ink-3);letter-spacing:0}.wapu-archive__toolbar-right{display:flex;align-items:center;gap:10px;width:auto;margin-left:auto;padding-bottom:4px}.wapu-archive__count{font-family:var(--ds-font-text);font-size:var(--ds-fs-caption-1);color:var(--ds-ink-3);font-variant-numeric:tabular-nums;letter-spacing:0}.wapu-archive__category-desc{max-width:1400px;margin:0 auto var(--ds-s-3);padding:var(--ds-s-2) var(--ds-s-3);background:var(--ds-surface-2);border-radius:var(--ds-r-md);font-family:var(--ds-font-text);font-size:var(--ds-fs-subhead);line-height:1.65;color:var(--ds-ink-3)}.wapu-archive__category-desc p{margin:0 0 .75em}.wapu-archive__category-desc p:last-child{margin-bottom:0}.wapu-archive__sort-btn{min-width:154px;justify-content:space-between}.wapu-archive__sort-btn svg{flex-shrink:0;width:14px;height:14px;color:currentColor}.wapu-archive__collections-btn{min-width:172px}.wapu-archive__collections-icon{flex-shrink:0;width:16px;height:16px}.wapu-archive__collections-modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:var(--ds-z-modal);display:none;align-items:center;justify-content:center;padding:24px}.wapu-archive__collections-modal.is-open{display:flex}.wapu-archive__collections-overlay{position:absolute;top:0;right:0;bottom:0;left:0;border:0;margin:0;padding:0;background:#0006;-webkit-backdrop-filter:var(--ds-blur-sm);backdrop-filter:var(--ds-blur-sm)}.wapu-archive__collections-dialog{position:relative;z-index:1;width:min(923px,calc(100% - 48px));background:var(--ds-surface);border-radius:var(--ds-r-lg);box-shadow:var(--ds-shadow-lg);padding:var(--ds-s-3)}.wapu-archive__collections-head{display:flex;flex-direction:column;gap:var(--ds-s-1);padding:var(--ds-s-1) 48px var(--ds-s-1) var(--ds-s-1);margin-bottom:var(--ds-s-1)}.wapu-archive__collections-close{position:absolute;top:var(--ds-s-2);right:var(--ds-s-2);width:36px;min-height:36px;box-shadow:inset 0 0 0 var(--ds-border-thin) var(--ds-separator-soft);background:var(--ds-surface);color:var(--ds-ink);z-index:2}.wapu-archive__collections-close:hover:not(:disabled):not(.wapu-btn--loading){background:var(--ds-surface-2);box-shadow:inset 0 0 0 var(--ds-border-thin) var(--ds-separator);transform:scale(1.03)}.wapu-archive__collections-close:active{transform:scale(.97)}.wapu-archive__collections-title{margin:0;font-family:var(--ds-font-display);font-size:var(--ds-fs-title-3);font-weight:var(--ds-fw-bold);line-height:1.35;color:var(--ds-ink)}.wapu-archive__collections-subtitle{margin:0;font-family:var(--ds-font-display);font-size:var(--ds-fs-callout);font-weight:var(--ds-fw-semibold);line-height:1.4;color:var(--ds-ink)}.wapu-archive__collections-grid{display:grid;grid-template-columns:1fr;gap:var(--ds-s-1)}.wapu-archive__collection-card{display:flex;align-items:center;gap:var(--ds-s-2);padding:var(--ds-s-1) var(--ds-s-2);text-decoration:none;color:inherit;position:relative;transition:background var(--ds-dur-fast) var(--ds-ease)}.wapu-archive__collection-card:hover{background:var(--ds-fill-4)}.wapu-archive__collection-card:after{content:"";flex-shrink:0;width:8px;height:8px;border-top:1.5px solid var(--ds-ink-3);border-right:1.5px solid var(--ds-ink-3);transform:rotate(45deg);margin-left:auto;transition:border-color var(--ds-dur-fast) var(--ds-ease)}.wapu-archive__collection-card:hover:after{border-color:var(--ds-ink)}.wapu-archive__collection-card[hidden],.wapu-archive__collection-card.is-filtered-out{display:none}.wapu-archive__collection-thumb{width:56px;height:56px;border-radius:var(--ds-r-sm);overflow:hidden;flex-shrink:0;background:var(--ds-fill-3)}.wapu-archive__collection-thumb img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;display:block}.wapu-archive__collection-copy{min-width:0;flex:1;display:flex;flex-direction:column;gap:2px}.wapu-archive__collection-name{display:block;font-family:var(--ds-font-text);font-size:var(--ds-fs-subhead);font-weight:var(--ds-fw-semibold);line-height:1.3;color:var(--ds-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wapu-archive__collection-count{display:block;font-family:var(--ds-font-display);font-size:var(--ds-fs-subhead);font-weight:var(--ds-fw-semibold);line-height:1.35;color:var(--ds-ink-3)}body.wapu-archive-collections-open{overflow:hidden}.wapu-archive__grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:auto;grid-auto-flow:dense;gap:var(--ds-s-5) var(--ds-s-2);max-width:1400px;margin:0 auto;align-items:start}.wapu-archive__grid>li{display:flex;flex-direction:column}.wapu-archive__hero{grid-column:1;grid-row:1;width:100%;aspect-ratio:1 / 2;max-width:none;margin-inline:0;border-radius:var(--ds-r-xs);overflow:hidden;background:var(--ds-surface)}.wapu-archive__hero-img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:center;object-position:center;display:block}@media (min-width: 769px){.wapu-archive__hero{width:100%;margin-inline:0}}.wapu-archive .woocommerce-pagination{display:none!important}.wapu-archive__infinite-scroll{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:44px;margin:40px auto 0;padding-top:32px;border-top:.5px solid rgba(0,0,0,.08);max-width:1400px}.wapu-archive__infinite-loader{display:inline-flex;align-items:center;justify-content:center;gap:10px;font-family:var(--ds-font-text);font-size:var(--ds-fs-caption-1);font-weight:var(--ds-fw-medium);color:var(--ds-ink-3);letter-spacing:.02em}.wapu-archive__infinite-loader[hidden],.wapu-archive__infinite-manual[hidden],.wapu-archive__infinite-end[hidden]{display:none}.wapu-archive__infinite-spinner{width:14px;height:14px;border-radius:var(--ds-r-pill);border:1.5px solid rgba(0,0,0,.1);border-top-color:var(--ds-ink);animation:wapu-archive-spin .9s linear infinite}.wapu-archive__infinite-manual{display:flex;flex-direction:column;align-items:center;gap:12px}.wapu-archive__infinite-btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 36px;background:transparent;border:.5px solid rgba(0,0,0,.2);border-radius:var(--ds-r-pill);font-family:var(--ds-font-text);font-size:var(--ds-fs-caption-1);font-weight:var(--ds-fw-medium);letter-spacing:.12em;text-transform:uppercase;color:var(--ds-ink);cursor:pointer;transition:background var(--ds-dur-fast) var(--ds-ease),color var(--ds-dur-fast) var(--ds-ease),border-color var(--ds-dur-fast) var(--ds-ease)}.wapu-archive__infinite-btn:hover{background:var(--ds-ink);color:var(--ds-surface);border-color:var(--ds-ink)}.wapu-archive__infinite-btn:disabled{opacity:.4;cursor:not-allowed;pointer-events:none}.wapu-archive__infinite-counter{margin:0;font-family:var(--ds-font-text);font-size:var(--ds-fs-caption-2);color:var(--ds-ink-4);font-variant-numeric:tabular-nums;letter-spacing:.02em}.wapu-archive__infinite-end{margin:0;font-family:var(--ds-font-display);font-style:normal;font-size:var(--ds-fs-footnote);font-weight:var(--ds-fw-regular);color:var(--ds-ink-3);text-align:center;letter-spacing:-.005em}@keyframes wapu-archive-spin{to{transform:rotate(360deg)}}.wapu-archive .woocommerce-no-products-found{text-align:center;padding:var(--ds-s-8) var(--ds-s-3);font-family:var(--ds-font-text);font-size:var(--ds-fs-subhead);color:var(--ds-ink-3)}@media (max-width: 1200px){.wapu-archive__grid{grid-template-columns:repeat(4,1fr);grid-auto-rows:auto;gap:var(--ds-s-4) var(--ds-s-2)}}@media (max-width: 900px){.wapu-archive{padding:var(--ds-s-3) var(--ds-s-3) var(--ds-s-6)}.wapu-archive__collections-dialog{width:min(760px,calc(100% - 28px));padding:var(--ds-s-3)}.wapu-archive__collections-grid{gap:var(--ds-s-1)}.wapu-archive__collection-card{padding:var(--ds-s-1) var(--ds-s-2);gap:var(--ds-s-2)}.wapu-archive__collection-thumb{width:48px;height:48px}.wapu-archive__collection-name{font-size:var(--ds-fs-subhead)}.wapu-archive__collection-count{font-size:var(--ds-fs-footnote)}.wapu-archive__toolbar{margin-bottom:var(--ds-s-2);align-items:stretch;flex-wrap:wrap;gap:var(--ds-s-2)}.wapu-archive__section-title{font-size:clamp(22px,6.5vw,32px)}.wapu-archive__toolbar-right{width:100%;margin-left:0;padding-bottom:0}.wapu-archive__count{display:none}.wapu-archive__grid{grid-template-columns:repeat(3,1fr);grid-auto-rows:auto;gap:var(--ds-s-4) var(--ds-s-2)}}@media (max-width: 768px){body.woocommerce-shop .site-footer,body.tax-product_cat .site-footer,body.tax-product_brand .site-footer,body.tax-product_tag .site-footer{display:none}body.woocommerce-shop,body.tax-product_cat,body.tax-product_brand,body.tax-product_tag{background:var(--ds-surface);-webkit-font-smoothing:antialiased}.wapu-archive{background:var(--ds-surface);padding:var(--ds-s-3) var(--ds-s-2) var(--ds-s-5);min-height:100dvh}.wapu-archive__toolbar{max-width:100%;margin:var(--ds-s-1) 0 var(--ds-s-2);flex-direction:column;align-items:stretch;gap:10px}.wapu-archive__section-title{font-size:var(--ds-fs-title-3);letter-spacing:var(--ds-ls-tight)}.wapu-archive__section-count{margin-top:4px;font-size:var(--ds-fs-caption-1)}.wapu-archive__toolbar-right{width:100%;margin-left:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--ds-s-1)}.wapu-archive__sort-wrap{width:100%}.wapu-archive__sort-btn,.wapu-archive__collections-btn{min-height:48px;width:100%;padding:0 var(--ds-s-2);justify-content:center}.wapu-archive__sort-btn svg{width:16px;height:16px;flex-shrink:0}.wapu-archive__collections-icon{width:18px;height:18px}.wapu-archive__collections-modal{padding:var(--ds-s-2)}.wapu-archive__collections-dialog{width:100%;border-radius:var(--ds-r-md);padding:var(--ds-s-2);max-height:min(80vh,640px);overflow-y:auto}.wapu-archive__collections-close{top:10px;right:10px;width:34px;min-height:34px}.wapu-archive__collections-head{margin-bottom:10px;padding:4px 42px 4px 4px}.wapu-archive__collections-title{font-size:var(--ds-fs-callout)}.wapu-archive__collections-subtitle{font-size:var(--ds-fs-subhead);font-weight:var(--ds-fw-semibold)}.wapu-archive__collections-grid{grid-template-columns:1fr;gap:10px}.wapu-archive__collection-card{padding:10px}.wapu-archive__collection-thumb{width:64px;height:64px}.wapu-archive__collection-name{font-size:var(--ds-fs-subhead);font-weight:var(--ds-fw-semibold)}.wapu-archive__collection-count{font-size:var(--ds-fs-footnote)}.wapu-archive__grid{padding:0;max-width:100%;gap:var(--ds-s-4) var(--ds-s-2);grid-template-columns:repeat(2,1fr);grid-auto-rows:auto}.wapu-archive__infinite-scroll{margin-top:var(--ds-s-2);min-height:40px}.wapu-archive__infinite-loader,.wapu-archive__infinite-end{font-size:var(--ds-fs-caption-1)}.wapu-archive__sort-menu{right:auto;left:0;min-width:0;width:-moz-max-content;width:max-content;max-width:calc(100vw - 24px);z-index:var(--ds-z-dropdown)}}@media (max-width: 380px){.wapu-archive__grid{gap:var(--ds-s-3) var(--ds-s-2);grid-auto-rows:auto}}.wapu-archive__hero-video{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:center;object-position:center;display:block}.wapu-archive__hero-embed{position:relative;width:100%;height:100%;overflow:hidden}.wapu-archive__hero-embed iframe{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;border:none;pointer-events:none}@media (max-width: 380px){.wapu-archive__collections-modal{padding:10px}.wapu-archive__collections-dialog{width:calc(100% - 8px);padding:var(--ds-s-2);border-radius:var(--ds-r-md)}.wapu-archive__collections-grid{grid-template-columns:1fr;gap:var(--ds-s-1)}.wapu-archive__collections-head{gap:6px}.wapu-archive__collections-title{font-size:var(--ds-fs-subhead)}.wapu-archive__collections-subtitle{font-size:var(--ds-fs-footnote)}.wapu-archive__collection-card{padding:9px;gap:10px}.wapu-archive__collection-thumb{width:56px;height:56px}.wapu-archive__collection-name{font-size:var(--ds-fs-subhead)}.wapu-archive__collection-count{font-size:var(--ds-fs-caption-1)}}.wapu-archive__collections-dialog--large{max-height:min(82vh,760px)}.wapu-archive__collections-search{position:relative;width:100%;height:55px;border:var(--ds-border-thin) solid var(--ds-separator-soft);border-radius:var(--ds-r-md);background:var(--ds-surface);margin-bottom:var(--ds-s-3)}.wapu-archive__collections-search-input{width:100%;height:100%;border:0;border-radius:var(--ds-r-md);background:transparent;color:var(--ds-ink);font-family:var(--ds-font-display);font-size:var(--ds-fs-callout);font-weight:var(--ds-fw-regular);line-height:1.5;padding:0 46px 0 var(--ds-s-2);outline:none}.wapu-archive__collections-search-input::-moz-placeholder{color:var(--ds-ink-4);opacity:1}.wapu-archive__collections-search-input::placeholder{color:var(--ds-ink-4);opacity:1}.wapu-archive__collections-search-input::-webkit-search-cancel-button{-webkit-appearance:none;-moz-appearance:none;appearance:none}.wapu-archive__collections-search-input:focus-visible{box-shadow:var(--ds-shadow-focus)}.wapu-archive__collections-search-icon{position:absolute;right:var(--ds-s-2);top:50%;transform:translateY(-50%);display:inline-flex;align-items:center;justify-content:center;color:var(--ds-ink-3);pointer-events:none}.wapu-archive__collections-grid--large{gap:var(--ds-s-3);max-height:448px;overflow-y:auto;overflow-x:hidden;align-content:start;padding-right:4px}.wapu-archive__collections-grid--large::-webkit-scrollbar{width:5px}.wapu-archive__collections-grid--large::-webkit-scrollbar-thumb{border-radius:var(--ds-r-pill);background:var(--ds-separator)}.wapu-archive__collections-grid--large::-webkit-scrollbar-track{background:transparent}.wapu-archive__collections-empty{margin:var(--ds-s-1) 0 0;font-family:var(--ds-font-display);font-size:var(--ds-fs-subhead);font-weight:var(--ds-fw-semibold);color:var(--ds-ink-3);text-align:center;width:100%}@media (max-width: 900px){.wapu-archive__collections-search{height:50px;margin-bottom:var(--ds-s-2)}.wapu-archive__collections-search-input{font-size:var(--ds-fs-subhead);padding-right:40px}.wapu-archive__collections-grid--large{gap:var(--ds-s-2);max-height:420px}}@media (max-width: 768px){.wapu-archive__collections-search{height:46px;border-radius:var(--ds-r-sm);margin-bottom:10px}.wapu-archive__collections-search-input{border-radius:var(--ds-r-sm);font-family:var(--ds-font-text);font-size:var(--ds-fs-footnote);padding:0 36px 0 var(--ds-s-2)}.wapu-archive__collections-search-icon{right:var(--ds-s-2)}.wapu-archive__collections-grid--large{grid-template-columns:1fr;max-height:none;overflow:visible;padding-right:0;gap:10px}.wapu-archive__collections-empty{font-size:var(--ds-fs-footnote);text-align:left}}@media (max-width: 380px){.wapu-archive__collections-search{height:44px;margin-bottom:var(--ds-s-1)}.wapu-archive__collections-search-input{font-size:var(--ds-fs-footnote)}}.wapu-archive__sort-wrap{position:relative}.wapu-archive__sort-btn[aria-expanded=true] .wapu-archive__sort-chevron{transform:rotate(180deg)}.wapu-archive__sort-chevron{transition:transform var(--ds-dur-fast) var(--ds-ease)}.wapu-archive__sort-btn.is-active{background:var(--ds-action);color:var(--ds-action-ink);box-shadow:none}.wapu-archive__sort-btn.is-active svg{color:var(--ds-action-ink)}.wapu-archive__sort-menu{position:absolute;top:calc(100% + 6px);right:0;min-width:220px;background:var(--ds-surface);border:var(--ds-border-thin) solid var(--ds-separator-soft);border-radius:var(--ds-r-md);box-shadow:var(--ds-shadow-md);padding:6px;z-index:var(--ds-z-dropdown);opacity:0;transform:translateY(-6px);transition:opacity var(--ds-dur-fast) var(--ds-ease),transform var(--ds-dur-fast) var(--ds-ease);pointer-events:none}.wapu-archive__sort-menu:not([hidden]){opacity:1;transform:translateY(0);pointer-events:auto}.wapu-archive__sort-option{display:flex;align-items:center;gap:10px;padding:9px var(--ds-s-2);border-radius:var(--ds-r-xs);text-decoration:none;color:var(--ds-ink);font-size:var(--ds-fs-footnote);font-weight:var(--ds-fw-medium);transition:background var(--ds-dur-fast) var(--ds-ease);cursor:pointer}.wapu-archive__sort-option:hover{background:var(--ds-fill-4)}.wapu-archive__sort-option.is-active{background:var(--ds-action-soft);color:var(--ds-action);font-weight:var(--ds-fw-semibold)}.wapu-archive__sort-option.is-active:after{content:"";display:block;width:7px;height:7px;border-radius:50%;background:var(--ds-action);margin-left:auto;flex-shrink:0}.wapu-archive__sort-option svg{flex-shrink:0;opacity:.55}.wapu-archive__sort-option.is-active svg{opacity:1;color:var(--ds-action)}.wapu-archive__sort-option-label{flex:1}.wapu-archive__sort-option-count{display:inline-flex;align-items:center;padding:2px 7px;border-radius:var(--ds-r-pill);background:var(--ds-fill-3);color:var(--ds-ink-3);font-size:var(--ds-fs-caption-2);font-weight:var(--ds-fw-semibold)}.wapu-archive__sort-option.is-active .wapu-archive__sort-option-count{background:var(--ds-action-soft);color:var(--ds-action)}.wapu-sw{position:relative;width:100%;height:100%;overflow:hidden;display:block}.wapu-sw__link{display:block;width:100%;height:100%;text-decoration:none;color:inherit;background:transparent;position:relative}.wapu-sw__wrap{position:relative;width:100%;height:100%;padding:16px;box-sizing:border-box}.wapu-sw__img{position:absolute;top:16px;right:16px;bottom:16px;left:16px;width:auto;height:auto;max-width:calc(100% - 32px);max-height:calc(100% - 32px);-o-object-fit:contain;object-fit:contain;opacity:0;transition:opacity var(--ds-dur) var(--ds-ease)}.wapu-sw__img.is-active{opacity:1}.wapu-sw-row{display:flex;align-items:center;gap:10px;padding:0;margin:var(--ds-s-1) 0 0;flex-wrap:nowrap;position:relative;z-index:1}.wapu-sw-row .wapu-swatch{width:24px;height:24px;min-width:24px;min-height:24px;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;position:relative;border-radius:50%;overflow:visible;cursor:pointer;padding:0;border:0;background:transparent}.wapu-sw-row .wapu-swatch .wapu-swatch__media{display:block;width:100%;height:100%;background-color:var(--ds-fill-3);background-position:center;background-size:cover;background-repeat:no-repeat;border-radius:50%;box-shadow:inset 0 0 0 var(--ds-border-hairline) #0000001f;transition:transform var(--ds-dur-fast) var(--ds-ease)}.wapu-sw-row .wapu-swatch.is-active .wapu-swatch__media{box-shadow:0 0 0 1.5px var(--ds-surface, #fff),0 0 0 3px var(--ds-ink, #000)}.wapu-sw-row .wapu-swatch:hover:not(.is-active) .wapu-swatch__media{transform:scale(1.12)}.wapu-sw-row__more{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;font-family:var(--ds-font-text);font-size:var(--ds-fs-callout);font-weight:var(--ds-fw-regular);line-height:1;color:var(--ds-ink-3);background:transparent;border:0;text-decoration:none;cursor:pointer;padding:0;margin-left:2px;transition:color var(--ds-dur-fast) var(--ds-ease)}.wapu-sw-row__more:hover{color:var(--ds-ink)}@media (prefers-reduced-motion: reduce){.wapu-sw__img,.wapu-sw-row .wapu-swatch__media{transition:none}.wapu-sw-row .wapu-swatch:hover .wapu-swatch__media{transform:none}}@media (max-width: 900px){.wapu-archive__filter-bar{margin:0 -12px 10px;padding:0 12px}}.wapu-archive__active-filters{max-width:1400px;margin:0 auto 16px}@media (max-width: 900px){.wapu-archive__active-filters{margin:0 0 12px;padding:0 12px}}.wapu-product-card--skeleton{pointer-events:none}.wapu-product-card--skeleton .wapu-product-card__media{aspect-ratio:1 / 1;border-radius:var(--ds-r-xs);margin:0}.wapu-product-card--skeleton .wapu-product-card__info{gap:6px}

/* ──────────────────────────────────────────────────────────────
 * [v4.0.25] Mobile cards cleanup — feedback Velvet "muy sucio".
 *
 * En viewport ≤ 768px las cards se sentían cargadas:
 *   - "ELEGIR TONO/TAMAÑO →" CTA arriba duplica info (al tocar la
 *     card ya entras a la PDP). En desktop tiene sentido (hover)
 *     pero en mobile siempre visible = ruido.
 *   - Swatch single (1 solo orfano) abajo del precio se ve solo
 *     y poco editorial.
 *   - Spacing entre brand/título/precio apretado.
 *
 * Fix: minimal mobile-only rules. Sin tocar desktop.
 *
 * ── [v4.2.40 — PR-3.2 surgical cleanup] ──
 * Removí 15 `!important` de las reglas de spacing/typography mobile
 * de este bloque. archive.css se enqueue con `array('wapu-main')`
 * como dependency (ver inc/class-wapu-enqueue.php), así que SIEMPRE
 * carga después de main.css. Misma specificity en mobile · gana por
 * cascade order sin necesitar `!important`.
 *
 * `display: none !important` en las dos primeras reglas se MANTIENE
 * porque pelean contra `display: flex !important` que main.css canon
 * declara en `.wapu-product-card__cta` (contrato CTA). Sin esos
 * `!important`, el pill volvería a aparecer en mobile.
 * ────────────────────────────────────────────────────────────── */

@media (max-width: 768px) {
    /* 1. Hide CTA pill en mobile — la card completa es tap target.
       KEEP !important · pelea contra `display:flex !important` que
       main.css declara en el contrato CTA. */
    .wapu-product-card__cta {
        display: none !important;
    }

    /* 2. Hide swatch row si tiene 1 swatch o menos (orfana).
       KEEP !important · defensiva contra plugins/themes que
       puedan re-mostrar la fila via `display:flex` específico. */
    .wapu-sw-row:not(:has(.wapu-swatch:nth-child(2))) {
        display: none !important;
    }

    /* 3. Tighten spacing dentro de la card info.
       PR-3.2: removido `!important` · cascade order suficiente. */
    .wapu-product-card__info {
        gap: 4px;
        padding: 10px 0 0;
    }
    .wapu-product-card__brand {
        font-size: 10px;
        letter-spacing: 0.16em;
        margin: 0 0 2px;
    }
    .wapu-product-card__name {
        font-size: 13px;
        line-height: 1.3;
        margin: 0;
    }
    .wapu-product-card__price-wrap {
        margin-top: 4px;
    }


    /* 4. Si la swatch row sí se muestra (2+ swatches), tighten gap.
       PR-3.2: removido `!important` · cascade order suficiente. */
    .wapu-sw-row {
        margin-top: 4px;
        gap: 6px;
    }
    .wapu-sw-row .wapu-swatch {
        width: 18px;
        height: 18px;
        min-width: 18px;
        min-height: 18px;
    }
}

/* ──────────────────────────────────────────────────────────────
 * [v4.0.30] Archive swatches — visibility + degenerate hide.
 *
 * Bugs visibles en velvetbeauty.mx (Mayo 2026):
 *   - GISOU: 1 swatch blanco invisible contra card blanca.
 *   - NATASHA DENONA: 1 swatch que muestra la foto entera del
 *     producto comprimida en círculo (no era un swatch real,
 *     era el variation_image de fallback).
 *   - PATRICK STARRR: 2 swatches OK — caso correcto, no tocar.
 *
 * Fixes:
 *   1) Borde más visible para swatches claros (white/nude/cream).
 *      Reforzamos el inset shadow + agregamos un outer hairline.
 *   2) Ocultar swatch row degenerada (1 solo swatch) en TODOS los
 *      viewports — antes era solo mobile (línea ~24 arriba).
 *      Una variación única no aporta visual diferenciador.
 *   3) image-swatches mantienen background-size:cover + position:center
 *      (ya estaban). Cuando es fallback de variation-image, el problema
 *      real es que el merchant no subió un swatch dedicado: la solución
 *      product-side. Aquí dejamos cover para que al menos no se distorsione.
 * ────────────────────────────────────────────────────────────── */

/* Hide degenerate single-swatch row across all breakpoints (no solo mobile).
   :has() — soportado en todos los browsers modernos (>94% global Mayo 2026).
   Si el browser no soporta :has(), la row se sigue mostrando como antes
   (fallback gracioso, no rompe). */
.wapu-sw-row:not(:has(.wapu-swatch:nth-child(2))) {
    display: none;
}

/* Swatch media — borde más visible + outer hairline.
   Selector más específico que la regla base para overridear el inset
   débil (#0000001f = 12% black) sin tocar la regla original. */
.wapu-sw-row .wapu-swatch .wapu-swatch__media {
    box-shadow:
        inset 0 0 0 1px rgba(0, 0, 0, 0.22),
        0 0 0 1px rgba(0, 0, 0, 0.04);
    /* Refuerzo de aspect-ratio (defensivo — el width/height del padre ya
       lo garantiza, pero aspect-ratio:1 evita degradaciones si algún
       contenedor pierde altura por flex-shrink). */
    aspect-ratio: 1 / 1;
    /* image swatches: cover + center ya en regla base (línea principal),
       reforzamos object-position por si algún consumer lo overrideó. */
    background-position: center center;
    background-size: cover;
}

/* is-active mantiene su ring marcado (regla base lo cubre, no override). */

/* ═══════════════════════════════════════════════════════════════════
 * [v4.0.37] BADGES PREMIUM — overrides al inline-style legacy
 *
 * `Wapu_Playground_Badges::render_for_product()` emite spans con styles
 * INLINE hardcoded (font Poppins, padding 8px 16px, font-size 10px,
 * border-radius 4px, etc.). Eso da un look genérico y no respeta el
 * Design System del theme.
 *
 * Acá sobrescribimos esos inline styles con specificity alta + tokens
 * del DS. Resultado: badges se ven premium, alineadas con el drop activo,
 * tipografía consistente con el resto de la card.
 *
 * Sobrescribir inline styles requiere `!important` (única forma).
 * ═══════════════════════════════════════════════════════════════════ */

/* Container de badges (kit-badge wrapper) — top-left apilable */
.wapu-product-card .wapu-kit-badge,
.wapu-kit-badge {
    position: absolute !important;
    top: var(--ds-s-1, 12px) !important;
    left: var(--ds-s-1, 12px) !important;
    z-index: 2 !important;
    pointer-events: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1 !important;
}

/* Badge pill — el shape más común. Override de inline styles. */
.wapu-kit-badge__pill,
.wapu-product-card .wapu-kit-badge__pill {
    /* tipografía DS */
    font-family: var(--ds-font-text) !important;
    font-size: var(--ds-fs-caption-2, 10px) !important;
    font-weight: var(--ds-fw-bold, 700) !important;
    line-height: 1 !important;
    letter-spacing: 0.12em !important;
    text-transform: uppercase !important;
    /* spacing premium */
    padding: 6px 10px !important;
    border-radius: var(--ds-r-pill, 999px) !important;
    /* shadow sutil para flotar */
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08) !important;
    /* Smooth animation entrada */
    animation: wapu-kit-badge-fade-in 0.4s var(--ds-ease, ease) backwards;
    /* Defensive: si emite color: white pero el bg es muy claro, forzar contraste */
    text-shadow: none !important;
}

/* Badge line — variant editorial */
.wapu-kit-badge__line,
.wapu-product-card .wapu-kit-badge__line {
    font-family: var(--ds-font-text) !important;
    font-size: var(--ds-fs-caption-1, 11px) !important;
    font-weight: var(--ds-fw-semibold, 600) !important;
    line-height: 1 !important;
    letter-spacing: 0.08em !important;
    text-transform: uppercase !important;
    padding: 6px 0 6px 10px !important;
    border-left: 2px solid currentColor !important;
}

/* Animation entrada suave */
@keyframes wapu-kit-badge-fade-in {
    from { opacity: 0; transform: translateY(-4px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* Múltiples badges apilados — gap consistente */
.wapu-product-card__media .wapu-kit-badge + .wapu-kit-badge,
.wapu-product-card__media .wapu-kit-badge ~ .wapu-product-card__wholesale-badge {
    top: calc(var(--ds-s-1, 12px) + 28px) !important;
}

/* Mobile — badges un poco más chicas para no saturar */
@media (max-width: 600px) {
    .wapu-kit-badge__pill,
    .wapu-product-card .wapu-kit-badge__pill {
        font-size: 9px !important;
        padding: 5px 8px !important;
        letter-spacing: 0.1em !important;
    }
}

/* Wholesale badge — alinear visual con kit-badges */
.wapu-product-card__wholesale-badge {
    position: absolute;
    top: var(--ds-s-1, 12px);
    left: var(--ds-s-1, 12px);
    z-index: 2;
    pointer-events: none;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 6px 10px;
    border-radius: var(--ds-r-pill, 999px);
    background: var(--ds-ink, #111);
    color: var(--ds-surface, #fff);
    font-family: var(--ds-font-text);
    font-size: var(--ds-fs-caption-2, 10px);
    font-weight: var(--ds-fw-bold, 700);
    line-height: 1;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
}

.wapu-product-card__wholesale-badge-icon {
    font-size: 12px;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.wapu-product-card__wholesale-badge-icon svg {
    width: 12px;
    height: 12px;
    display: block;
}

/* ═══════════════════════════════════════════════════════════════════════
 * [v4.2.40] WAPUOS-VAS · Day 3 PR-3.2 · archive.css Surgical Cleanup
 * ───────────────────────────────────────────────────────────────────────
 * NO añade reglas nuevas. Solo registra qué se limpió, qué se preservó
 * y por qué. Este bloque vive al final del archivo como ancla documental
 * (rollback se hace via git diff · ver checkpoint).
 *
 * Removido en esta PR (`!important` count en archive.css):
 *   50 → 35 (−15 · −30 %)
 *
 * Las 15 removals son TODAS en el bloque `[v4.0.25] Mobile cards
 * cleanup` (líneas ~30-56 del archivo original). Son reglas de
 * spacing y typography mobile. Razón segura:
 *
 *   archive.css load order:
 *     `wp_enqueue_style('wapu-archive', …, array('wapu-main'), …)`
 *     ─ inc/class-wapu-enqueue.php
 *
 *   → archive.css carga DESPUÉS de main.css siempre.
 *   → Misma specificity dentro del mismo media query (≤768px)
 *     gana el que carga después. `!important` era overkill.
 *
 * Preservado intencionalmente:
 *
 *   1. `.wapu-product-card__cta { display: none !important }` @ ≤768px
 *      └─ Pelea contra `display: flex !important` que main.css canon
 *         declara en el contrato CTA. Sin esto el pill reaparece.
 *
 *   2. `.wapu-sw-row:not(:has(.wapu-swatch:nth-child(2)))
 *         { display: none !important }` @ ≤768px
 *      └─ Defensiva contra plugins terceros que puedan setear
 *         `display: flex !important` en `.wapu-sw-row`.
 *
 *   3. `.wapu-archive .woocommerce-pagination { display: none !important }`
 *      └─ Defensiva contra WooCommerce base styles. WC override.
 *
 *   4. Bloque `[v4.0.37] BADGES PREMIUM` (32 `!important`) — INTACTO.
 *      └─ Sobrescribe inline-styles emitidos por
 *         `Wapu_Playground_Badges::render_for_product()`. Inline
 *         styles SOLO se pueden vencer con `!important`. Tocarlos
 *         rompe los badges. Cleanup real requiere extraer el render
 *         del badge a CSS clases puras vía PHP (deferred wave).
 *
 * Debt remanente clasificada para próximas waves:
 *
 *   🟡 Med  · `.woocommerce-pagination` hide               (1)  — WC override
 *   🔴 High · CTA `display:none` mobile + swatch row hide  (2)  — contracts
 *   🔴 High · `.wapu-kit-badge` family vs inline-style    (32)  — render-side cleanup
 *                                                      ─────
 *                                                       35  total
 *
 * @since 4.2.40
 * ═══════════════════════════════════════════════════════════════════════ */


/* ═══════════════════════════════════════════════════════════════════════
 * [v4.2.41] WAPUOS-VAS · Day 3 PR-3.3 · Archive Grid Rhythm Alignment
 * ───────────────────────────────────────────────────────────────────────
 * Refinement de cadencia visual. Establece tokens scoped de rhythm,
 * suaviza el jump de gap 32→40px en el rango desktop, y tokeniza
 * valores off-grid heredados.
 *
 * Charter (igual que PR-3.2):
 *   - 0 `!important` nuevos
 *   - 0 reglas CSS nuevas en bloques existentes (solo este block)
 *   - 0 hex hardcoded · todo tokens DS o derived
 *   - 0 cambios PHP / JS / markup / templates
 *   - Append-only · rollback trivial (eliminar este bloque)
 *   - archive.css carga después de main.css (dependency en
 *     class-wapu-enqueue.php) · cascade order resuelve sin
 *     necesidad de `!important`
 */

/* ═══════════════════════════════════════════════════════════════════════
 * [v4.2.53] Archive quick view + variable CTA cleanup
 * ───────────────────────────────────────────────────────────────────────
 * Consulta usada:
 *   - Wapucommerce Design System v2.0
 *   - Wapu DS · Button System v2
 *   - Escala jerárquica tipográfica
 *   - Changelog local v2.2.23/24 quick-shop phase B
 *
 * Objetivo:
 *   - esconder swatches inline en variable cards (se reemplazan por quick view)
 *   - mantener CTA selectivo visible en mobile
 *   - quick view modal compacto, centrado y responsive
 *   - bridge de enlace para media de cards simples
 * ═══════════════════════════════════════════════════════════════════════ */

.wapu-product-card__media-link{
	display:block;
	width:100%;
	height:100%;
	color:inherit;
	text-decoration:none;
	/* Reset para cuando es <button> */
	background:transparent;
	border:0;
	padding:0;
	margin:0;
	cursor:pointer;
	-webkit-appearance:none;
	appearance:none;
}

.wapu-product-card__media-link img,
.wapu-product-card__media-link picture{
	display:block;
	width:100%;
	height:100%;
}

/* Overlay invisible sobre la imagen del producto variable */
.wapu-product-card__media-overlay{
	position:absolute;
	inset:0;
	z-index:2;
	background:transparent;
}

.wapu-archive-qv{
	position:fixed;
	inset:0;
	z-index:1200;
	visibility:hidden;
	opacity:0;
	pointer-events:none;
	transition:opacity var(--ds-dur) var(--ds-ease),visibility var(--ds-dur) var(--ds-ease);
	/* Centrado real vertical + horizontal */
	display:flex;
	align-items:center;
	justify-content:center;
	padding:24px;
}

.wapu-archive-qv.is-open{
	visibility:visible;
	opacity:1;
	pointer-events:auto;
}

.wapu-archive-qv__overlay{
	position:fixed;
	inset:0;
	border:0;
	padding:0;
	background:rgba(17,23,42,.55);
	cursor:pointer;
	z-index:0;
}

.wapu-archive-qv__dialog{
	position:relative;
	z-index:1;
	width:min(960px,calc(100vw - 48px));
	max-height:min(88vh,800px);
	margin:0;
	background:var(--ds-surface);
	border-radius:var(--ds-r-xl);
	box-shadow:0 24px 80px rgba(15,23,42,.18);
	overflow:hidden;
}

.wapu-archive-qv__content{
	position:relative;
	min-height:320px;
	overflow-x:hidden;
}

.wapu-archive-qv__loading,
.wapu-archive-qv__error{
	min-height:320px;
	display:flex;
	align-items:center;
	justify-content:center;
	flex-direction:column;
	gap:var(--ds-s-1);
	font-family:var(--ds-font-text);
	font-size:var(--ds-fs-footnote);
	color:var(--ds-ink-3);
	padding:var(--ds-s-4);
	text-align:center;
}

.wapu-archive-qv__loading-dot{
	width:18px;
	height:18px;
	border-radius:50%;
	background:var(--ds-action);
	animation:wapu-archive-qv-pulse 1s ease-in-out infinite;
}

@keyframes wapu-archive-qv-pulse{
	0%,100%{transform:scale(.82);opacity:.55}
	50%{transform:scale(1);opacity:1}
}

.wapu-archive-qv__close{
	position:absolute;
	top:var(--ds-s-2);
	right:var(--ds-s-2);
	z-index:2;
	width:40px;
	height:40px;
	border-radius:var(--ds-r-pill);
	border:0;
	background:transparent;
	color:var(--ds-ink);
	display:inline-flex;
	align-items:center;
	justify-content:center;
	cursor:pointer;
	transition:background-color var(--ds-dur-fast) var(--ds-ease),transform var(--ds-dur-fast) var(--ds-ease);
}

.wapu-archive-qv__close:hover{
	background:var(--ds-fill-3);
}

.wapu-archive-qv__close:active{
	transform:scale(.96);
}

.wapu-archive-qv__grid{
	display:grid;
	grid-template-columns:minmax(0,1.06fr) minmax(320px,.94fr);
	align-items:stretch;
}

.wapu-archive-qv__media{
	background:linear-gradient(180deg,var(--ds-fill-5),var(--ds-surface));
	min-height:560px;
	padding:var(--ds-s-3);
	display:flex;
	align-items:center;
	justify-content:center;
}

.wapu-archive-qv__media img{
	display:block;
	width:100%;
	height:100%;
	max-width:100%;
	max-height:100%;
	object-fit:contain;
}

.wapu-archive-qv__body{
	display:flex;
	flex-direction:column;
	padding:var(--ds-s-5);
	gap:var(--ds-s-2);
}

.wapu-archive-qv__eyebrow{
	margin:0;
	font-family:var(--ds-font-text);
	font-size:var(--ds-fs-caption-1);
	font-weight:var(--ds-fw-semibold);
	letter-spacing:var(--ds-ls-wide);
	text-transform:uppercase;
	color:var(--ds-ink-3);
}

.wapu-archive-qv__title{
	margin:0;
	font-family:var(--ds-font-display);
	font-size:clamp(22px,2vw,32px);
	font-weight:var(--ds-fw-regular);
	line-height:var(--ds-lh-tight);
	color:var(--ds-ink);
	overflow-wrap:break-word;
	min-width:0;
}

.wapu-archive-qv__price{
	font-family:var(--ds-font-display);
	font-size:clamp(18px,1.6vw,24px);
	font-weight:var(--ds-fw-medium);
	color:var(--ds-ink);
}

.wapu-archive-qv__price .amount{
	color:inherit;
}

.wapu-archive-qv__desc{
	margin:0;
	font-family:var(--ds-font-text);
	font-size:var(--ds-fs-footnote);
	line-height:var(--ds-lh-relaxed);
	color:var(--ds-ink-2);
}

.wapu-archive-qv__options{
	display:flex;
	flex-direction:column;
	gap:var(--ds-s-1);
	padding-top:var(--ds-s-1);
}

.wapu-archive-qv__group{
	display:flex;
	flex-direction:column;
	gap:var(--ds-s-1);
}

.wapu-archive-qv__group + .wapu-archive-qv__group{
	padding-top:var(--ds-s-1);
}

.wapu-archive-qv__group-head{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:var(--ds-s-1);
}

.wapu-archive-qv__options-label{
	margin:0;
	font-family:var(--ds-font-text);
	font-size:var(--ds-fs-caption-1);
	font-weight:var(--ds-fw-semibold);
	letter-spacing:var(--ds-ls-wide);
	text-transform:uppercase;
	color:var(--ds-ink);
}

.wapu-archive-qv__group-label{
	margin:0;
	font-family:var(--ds-font-text);
	font-size:var(--ds-fs-caption-1);
	font-weight:var(--ds-fw-semibold);
	letter-spacing:var(--ds-ls-wide);
	text-transform:uppercase;
	color:var(--ds-ink);
}

.wapu-archive-qv__options-grid{
	display:flex;
	flex-wrap:wrap;
	gap:var(--ds-s-1);
	padding:8px 0;
}

.wapu-archive-qv__pills{
	display:flex;
	flex-wrap:wrap;
	gap:var(--ds-s-1);
}

/* Fila slider: [←] [viewport] [→] */
.wapu-archive-qv__slider-row{
	display:flex;
	align-items:center;
	gap:var(--ds-s-1);
	min-width:0;
	width:100%;
	overflow:hidden;
}

/* Viewport — clip local sin afectar al dialog */
.wapu-archive-qv__slider-viewport{
	overflow:hidden;
	flex:1;
	min-width:0;
	padding:8px 0;
	margin:-8px 0;
}

/* Flechas a los lados */
.wapu-archive-qv__slider-btn{
	flex-shrink:0;
	width:30px;
	height:30px;
	border-radius:50%;
	border:.5px solid var(--ds-separator-soft);
	background:var(--ds-surface);
	color:var(--ds-ink);
	display:inline-flex;
	align-items:center;
	justify-content:center;
	cursor:pointer;
	transition:background .15s,opacity .15s;
	box-shadow:0 1px 4px rgba(0,0,0,.08);
}
.wapu-archive-qv__slider-btn:hover{background:var(--ds-fill-3);}
.wapu-archive-qv__slider-btn:disabled{opacity:.25;cursor:default;box-shadow:none;}

.wapu-archive-qv__option{
	position:relative;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	padding:4px;
	box-sizing:border-box; /* JS asigna width incluyendo este padding */
	border:0;
	background:transparent;
	border-radius:50%;
	cursor:pointer;
	transition:transform var(--ds-dur-fast) var(--ds-ease);
}

.wapu-archive-qv__option:hover{
	transform:scale(1.08);
}

.wapu-archive-qv__option.is-disabled{
	opacity:.28;
	cursor:not-allowed;
	transform:none;
}

.wapu-archive-qv__option.is-active .wapu-archive-qv__option-swatch{
	box-shadow:0 0 0 2px var(--ds-surface),0 0 0 3.5px var(--ds-ink);
}

.wapu-archive-qv__option-swatch{
	width:48px;
	height:48px;
	border-radius:50%;
	display:block;
	background:var(--ds-fill-3);
	background-size:cover;
	background-position:center;
	box-shadow:inset 0 0 0 1px rgba(0,0,0,.1);
}

.wapu-archive-qv__pill{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-height:34px !important;
	padding:0 14px !important;
	border:var(--ds-border-thin) solid var(--ds-separator) !important;
	border-radius:var(--ds-r-pill) !important;
	background:var(--ds-surface) !important;
	color:var(--ds-ink) !important;
	cursor:pointer;
	box-shadow:none !important;
	width:auto !important;
	min-width:0 !important;
	font-family:var(--ds-font-text) !important;
	font-size:var(--ds-fs-footnote) !important;
	font-weight:var(--ds-fw-medium) !important;
	letter-spacing:0 !important;
	line-height:1 !important;
	text-transform:none !important;
	text-decoration:none !important;
	transition:border-color var(--ds-dur-fast) var(--ds-ease),background var(--ds-dur-fast) var(--ds-ease),color var(--ds-dur-fast) var(--ds-ease),opacity var(--ds-dur-fast) var(--ds-ease),transform var(--ds-dur-fast) var(--ds-ease);
}

.wapu-archive-qv__pill:hover{
	background:var(--ds-fill-4) !important;
	border-color:var(--ds-ink-4) !important;
}

.wapu-archive-qv__pill.is-active{
	border-color:var(--ds-ink) !important;
	background:var(--ds-fill-3) !important;
	color:var(--ds-ink) !important;
	box-shadow:0 0 0 1px var(--ds-ink) !important;
}

.wapu-archive-qv__pill:focus-visible{
	outline:none;
	box-shadow:var(--ds-shadow-focus) !important;
}

.wapu-archive-qv__pill.is-disabled{
	opacity:.35;
	cursor:not-allowed;
}

.wapu-archive-qv__pill-text{
	font-family:inherit;
	font-size:inherit;
	font-weight:inherit;
	letter-spacing:inherit;
	text-transform:inherit;
	color:inherit;
	white-space:nowrap;
}

/* Tooltip — manejado por JS (append al body para escapar overflow:hidden) */
#wapu-qv-swatch-tip{
	position:fixed;
	z-index:2147483647;
	background:var(--ds-ink);
	color:var(--ds-surface);
	font-family:var(--ds-font-text);
	font-size:11px;
	font-weight:var(--ds-fw-medium);
	line-height:1.3;
	padding:5px 8px;
	border-radius:var(--ds-r-sm);
	pointer-events:none;
	opacity:0;
	transition:opacity .15s ease;
	max-width:140px;
	text-align:center;
	transform:translateX(-50%);
	white-space:normal;
}

.wapu-archive-qv__actions{
	display:flex;
	flex-direction:column;
	gap:var(--ds-s-1);
	margin-top:auto;
	padding-top:var(--ds-s-2);
}

.wapu-archive-qv__primary{
	min-height:44px;
	background:var(--ws-primary, var(--wp-primary, var(--ds-action))) !important;
	color:var(--ds-action-ink, var(--ds-surface)) !important;
	border-color:var(--ws-primary, var(--wp-primary, var(--ds-action))) !important;
	border-radius:var(--ds-r-pill) !important;
	font-size:var(--ds-fs-footnote) !important;
	font-weight:var(--ds-fw-semibold) !important;
	letter-spacing:.04em !important;
}

.wapu-archive-qv__primary:hover{
	opacity:.88;
}

.wapu-archive-qv__more{
	align-self:center;
	font-family:var(--ds-font-text);
	font-size:var(--ds-fs-footnote);
	font-weight:var(--ds-fw-medium);
	color:var(--ds-ink);
	text-decoration:underline;
	text-underline-offset:4px;
}

/* ── Tablet: dialog centrado, columna única ──────────────────────────── */
@media (max-width: 768px){
	.wapu-product-card__cta[data-cta-type^="select_"]{
		display:inline-flex !important;
	}

	/* Bottom sheet: se ancla al borde inferior */
	.wapu-archive-qv{
		align-items:flex-end;
		padding:0;
	}

	body.wapu-has-mobile-bottom-nav .wapu-archive-qv{
		padding-bottom:calc(var(--wapu-mobile-appbar-height, 0px) - 24px);
	}

	.wapu-archive-qv__dialog{
		width:100%;
		max-height:min(88vh,88svh);
		margin:0;
		border-radius:var(--ds-r-xl) var(--ds-r-xl) 0 0;
	}

	body.wapu-has-mobile-bottom-nav .wapu-archive-qv__dialog{
		max-height:min(
			calc(88vh - var(--wapu-mobile-appbar-height, 0px) + 24px),
			calc(88svh - var(--wapu-mobile-appbar-height, 0px) + 24px)
		);
	}

	/* Permitir scroll vertical dentro del diálogo; bloquear horizontal (slider) */
	.wapu-archive-qv__content{
		overflow-y:auto;
		overflow-x:hidden;
		max-height:inherit;
	}

	.wapu-archive-qv__grid{
		grid-template-columns:minmax(0,1fr);
	}

	.wapu-archive-qv__media{
		min-height:220px;
		padding:var(--ds-s-2);
	}

	.wapu-archive-qv__body{
		padding:var(--ds-s-3);
		gap:var(--ds-s-2);
	}

	.wapu-archive-qv__title{
		font-size:clamp(20px,5vw,26px);
	}

	.wapu-archive-qv__price{
		font-size:clamp(17px,4.5vw,22px);
	}

	.wapu-archive-qv__option-swatch{
		width:44px;
		height:44px;
	}

	/* Acciones pegadas al fondo, respetan safe-area (notch) */
	.wapu-archive-qv__actions{
		position:sticky;
		bottom:0;
		background:var(--ds-surface);
		padding:var(--ds-s-2) var(--ds-s-3) max(var(--ds-s-2), env(safe-area-inset-bottom));
		margin:0 calc(var(--ds-s-3) * -1);
		border-top:.5px solid var(--ds-separator-soft);
	}

	/* Lista grande: altura más compacta en tablet */
	.wapu-archive-qv__options-grid.is-large-catalog{
		max-height:160px;
	}
}

/* ── Mobile pequeño: imagen oculta, layout ultracompacto ─────────────── */
@media (max-width: 480px){
	.wapu-archive-qv__dialog{
		max-height:min(92vh,92svh);
	}

	body.wapu-has-mobile-bottom-nav .wapu-archive-qv__dialog{
		max-height:min(
			calc(92vh - var(--wapu-mobile-appbar-height, 0px) + 24px),
			calc(92svh - var(--wapu-mobile-appbar-height, 0px) + 24px)
		);
	}

	/* Ocultar imagen para ganar espacio en la pantalla */
	.wapu-archive-qv__media{
		display:none;
	}

	.wapu-archive-qv__body{
		padding:var(--ds-s-2);
	}

	.wapu-archive-qv__actions{
		padding-left:var(--ds-s-2);
		padding-right:var(--ds-s-2);
		margin-left:calc(var(--ds-s-2) * -1);
		margin-right:calc(var(--ds-s-2) * -1);
	}

	.wapu-archive-qv__option-swatch{
		width:40px;
		height:40px;
	}

	/* Lista grande: altura aún más compacta en móvil */
	.wapu-archive-qv__options-grid.is-large-catalog{
		max-height:130px;
	}
}

/* ── Options head: label + count en la misma línea ──────────────────── */
.wapu-archive-qv__options-head{
	display:flex;
	align-items:baseline;
	justify-content:space-between;
	gap:var(--ds-s-1);
}

.wapu-archive-qv__options-count{
	font-family:var(--ds-font-text);
	font-size:var(--ds-fs-caption-2);
	color:var(--ds-ink-3);
	white-space:nowrap;
	flex-shrink:0;
}

/* ── Option name: oculto en modo swatches, visible en lista ─────────── */
.wapu-archive-qv__option-name{
	display:none;
}

/* ── Large catalog (≥12): lista vertical con scroll ──────────────────── */
.wapu-archive-qv__options-grid.is-large-catalog{
	flex-direction:column;
	flex-wrap:nowrap;
	gap:2px;
	padding:0;
	max-height:216px;
	overflow-y:auto;
	scrollbar-width:thin;
	scrollbar-color:var(--ds-separator) transparent;
}

.wapu-archive-qv__options-grid.is-large-catalog::-webkit-scrollbar{
	width:4px;
}

.wapu-archive-qv__options-grid.is-large-catalog::-webkit-scrollbar-thumb{
	background:var(--ds-separator);
	border-radius:2px;
}

.is-large-catalog .wapu-archive-qv__option{
	width:100%;
	border-radius:var(--ds-r-sm);
	justify-content:flex-start;
	gap:var(--ds-s-1);
	padding:6px 8px;
	text-align:left;
}

.is-large-catalog .wapu-archive-qv__option:hover{
	background:var(--ds-fill-3);
	transform:none;
}

.is-large-catalog .wapu-archive-qv__option.is-active{
	background:var(--ds-fill-2);
}

.is-large-catalog .wapu-archive-qv__option-swatch{
	width:28px;
	height:28px;
	flex-shrink:0;
}

.is-large-catalog .wapu-archive-qv__option-name{
	display:block;
	font-family:var(--ds-font-text);
	font-size:var(--ds-fs-footnote);
	font-weight:var(--ds-fw-medium);
	color:var(--ds-ink);
	white-space:nowrap;
	overflow:hidden;
	text-overflow:ellipsis;
}


/*
 * Capas (8):
 *   R1  Rhythm tokens scoped a .wapu-archive
 *   R2  Grid row-gap suavizado vía clamp() · ≥769px
 *   R3  Toolbar tokenization (gap/margin/padding 18px/24px/20px → tokens)
 *   R4  Toolbar-left gap tokenizado
 *   R5  Section-count margin-top off-grid → --ds-s-1
 *   R6  Category-desc bottom margin aligned con grid rhythm
 *   R7  Infinite scroll tokenization
 *   R8  Active filters margin tokenization
 *
 * @since 4.2.41
 * ═══════════════════════════════════════════════════════════════════════ */

/* ─── R1 · Rhythm tokens scoped a .wapu-archive ─────────────────────
   Custom properties locales que sirven como single source of truth
   para el ritmo del archive. Scoped al `.wapu-archive` para no
   contaminar otros surfaces del DS. */
.wapu-archive {
	--wapu-grid-row-gap: clamp(var(--ds-s-4), 1.6vw + 1rem, var(--ds-s-5));
	--wapu-grid-col-gap: var(--ds-s-2);
	--wapu-toolbar-gap: clamp(var(--ds-s-2), 1.5vw, var(--ds-s-3));
}

/* ─── R2 · Grid row-gap suavizado vía clamp · ≥769px ────────────────
   Reemplaza el jump discreto 32→40px (en 1201px breakpoint) por
   una interpolación suave entre viewports 769-1500. Resultado:
   en pantallas intermedias (~1280-1440) el grid respira más sin
   esperar al breakpoint duro de 1201px. Mobile (≤768) y small
   mobile (≤380) NO se tocan · esas reglas base mantienen sus
   valores explícitos. Solo column-gap se tokeniza vía la var
   (que apunta al mismo --ds-s-2 actual · no cambia visualmente). */
@media (min-width: 769px) {
	.wapu-archive__grid {
		row-gap: var(--wapu-grid-row-gap);
		column-gap: var(--wapu-grid-col-gap);
	}
}

/* ─── R3 · Toolbar tokenization ─────────────────────────────────────
   Removidos los valores off-grid del .wapu-archive__toolbar:
   - gap: 18px       → var(--wapu-toolbar-gap)  · clamp 16-24px
   - margin: 24px    → var(--ds-s-3)            · no visual change
   - padding-bottom: 20px → var(--ds-s-3)       · +4px breath antes
                                                  del border-bottom */
.wapu-archive__toolbar {
	gap: var(--wapu-toolbar-gap);
	margin: 0 auto var(--ds-s-3);
	padding-bottom: var(--ds-s-3);
}

/* ─── R4 · Toolbar-left gap tokenizado ──────────────────────────────
   Era `gap: 8px` hardcoded · idéntico a --ds-s-1. Cero cambio
   visual, solo alineación al canon. */
.wapu-archive__toolbar-left {
	gap: var(--ds-s-1);
}

/* ─── R5 · Section-count margin-top off-grid corregido ──────────────
   Era `margin: 6px 0 0` (off 8px-grid). Ajustamos a --ds-s-1
   (8px). +2px barely visible · alinea con cadencia. */
.wapu-archive__section-count {
	margin-top: var(--ds-s-1);
}

/* ─── R6 · Category-desc bottom margin aligned con grid rhythm ──────
   Antes: margin-bottom var(--ds-s-3) fijo (24px).
   Después: usa la misma var de row-gap · al ensanchar el viewport
   el espacio entre la category description y el grid crece con
   la misma cadencia que el ritmo entre filas de productos.
   En mobile (≤768px) cae al fallback --ds-s-3 porque la var
   de R1 sigue válida pero R2 no aplica · @≤768 archive.css base
   no override esta prop, así que el valor de R1 se usa
   directamente. Cero regresión mobile. */
.wapu-archive__category-desc {
	margin-bottom: var(--wapu-grid-row-gap, var(--ds-s-3));
}

/* ─── R7 · Infinite scroll tokenization ─────────────────────────────
   - margin: 40px auto 0    → var(--ds-s-5) · same value tokenized
   - padding-top: 32px      → var(--ds-s-4) · same value tokenized
   - gap: 10px (off-grid)   → var(--ds-s-1) (8px) · -2px subtle
   - .wapu-archive__infinite-manual gap: 12px → var(--ds-s-1) +
     subtle vertical breath via parent gap inherit · NO cambio
     visual notable */
.wapu-archive__infinite-scroll {
	margin-top: var(--ds-s-5);
	padding-top: var(--ds-s-4);
	gap: var(--ds-s-1);
}
.wapu-archive__infinite-manual {
	gap: var(--ds-s-2);
}

/* ─── R8 · Active filters margin tokenization ───────────────────────
   Era `margin: 0 auto 16px`. Tokenizamos a --ds-s-2 · cero cambio
   visual. */
.wapu-archive__active-filters {
	margin: 0 auto var(--ds-s-2);
}

/* end · WAPUOS-VAS Day 3 PR-3.3 Archive Grid Rhythm Alignment
 * ═══════════════════════════════════════════════════════════════════════ */

/* Shared containment fix for collections modal:
 * keep scroll inside the list and clip any card overflow to the dialog radius. */
.wapu-archive__collections-dialog {
	display: flex;
	flex-direction: column;
	overflow: hidden;
}

.wapu-archive__collections-dialog--large {
	overflow: hidden;
}

.wapu-archive__collections-grid--large {
	min-height: 0;
	padding-bottom: var(--ds-s-1);
	overscroll-behavior: contain;
}

/* ── Toast para quick view (espejo de single-product) ───────────────── */
.wapu-single__toast{
	position:fixed;
	top:calc(var(--ds-header-full-h, 72px) + 12px);
	right:14px;
	left:auto;
	bottom:auto;
	transform:translateY(-10px);
	width:min(420px,calc(100vw - 28px));
	display:grid;
	grid-template-columns:20px minmax(0,1fr);
	align-items:center;
	column-gap:10px;
	padding:12px 14px;
	z-index:99999;
	border-radius:var(--ds-r-md);
	font-family:var(--ds-font-display);
	font-size:var(--ds-fs-footnote);
	font-weight:var(--ds-fw-semibold);
	line-height:1.35;
	box-shadow:0 14px 34px #0003;
	z-index:1300;
	opacity:0;
	pointer-events:none;
	transition:opacity .2s ease,transform .2s ease;
}
.wapu-single__toast.is-visible{
	opacity:1;
	transform:translateY(0);
	pointer-events:auto;
}
.wapu-single__toast-icon{
	width:20px;height:20px;
	display:inline-flex;align-items:center;justify-content:center;
}
.wapu-single__toast-icon svg{width:20px;height:20px;display:block;}
.wapu-single__toast-message{
	display:block;line-height:1.35;white-space:normal;
}
.wapu-single__toast.is-success{
	background:var(--ds-success-soft);
	color:var(--ds-success-pressed);
	border:1px solid rgba(16,185,129,.46);
}
.wapu-single__toast.is-error{
	background:var(--ds-danger-soft);
	color:var(--ds-danger-pressed);
	border:1px solid rgba(239,68,68,.5);
}
body.admin-bar .wapu-single__toast{top:48px;}

/* ── Botón inline "Elegir tamaño / tono" en la product card ─────────── */
.wapu-product-card__cta-inline {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	margin-top: 8px;
	padding: 6px 12px;
	background: transparent;
	border: .5px solid var(--ds-separator-soft);
	border-radius: var(--ds-r-pill);
	font-family: var(--ds-font-text);
	font-size: var(--ds-fs-caption-1);
	font-weight: var(--ds-fw-medium);
	color: var(--ds-ink);
	cursor: pointer;
	transition: background .15s ease, border-color .15s ease;
	line-height: 1;
}

.wapu-product-card__cta-inline:hover {
	background: var(--ds-fill-3);
	border-color: var(--ds-separator);
}

/* position:relative necesario para el overlay del producto variable */
.wapu-product-card__media {
	position: relative;
}
