.ap-product-variants { margin: 24px 0; display: grid; gap: 20px; }
.ap-product-variants fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
.ap-product-variants legend { padding: 0; margin-bottom: 10px; color: #242424; font-size: 14px; font-weight: 600; line-height: 1.4; }
.ap-product-variants legend span { color: #777; font-weight: 500; }
.ap-product-variants__choices { display: flex; flex-wrap: wrap; gap: 8px; }
.ap-product-variants__choices button {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 40px; padding: 9px 13px; border: 1px solid transparent; border-radius: 10px;
  background: #f4f3ef; color: #242424; font: inherit; font-size: 14px; font-weight: 500;
  line-height: 1.35; cursor: pointer; transition: color 160ms ease, background 160ms ease, border-color 160ms ease;
}
.ap-product-variants__choices button.is-active { background: #fff1f1; color: #cd0000; border-color: #f3caca; }
.ap-product-variants__choices button:disabled { opacity: .38; cursor: default; }
.ap-product-variants__choices button:focus-visible { outline: 2px solid #cd0000; outline-offset: 3px; }
.ap-product-variants__status { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.ap-cart-price-notice { margin: 0 0 16px; padding: 14px; border-radius: 10px; background: #fff1f1; color: #a30000; font-size: 14px; }
@media (hover: hover) { .ap-product-variants__choices button:hover:not(:disabled) { border-color: #d6d4ce; } }
@media (max-width: 768px) { .ap-product-variants { margin: 20px 0; gap: 18px; } .ap-product-variants__choices button { min-height: 44px; } }
@media (prefers-reduced-motion: reduce) { .ap-product-variants__choices button { transition: none; } }

.ap-product-variants [data-variant-group="size"] .ap-product-variants__choices { display: grid; grid-template-columns: repeat(auto-fit, minmax(80px, 1fr)); }
.ap-product-variants [data-variant-group="size"] button { padding-inline: 8px; gap: 6px; white-space: nowrap; }

.ap-product-variants__swatches { gap: 10px; }
.ap-product-variants__swatches button { width: 54px; height: 54px; min-height: 54px; padding: 3px; border: 1px solid #e3e1dc; border-radius: 10px; background: transparent; }
.ap-product-variants__swatches button img { display: block; width: 46px; height: 46px; object-fit: cover; border-radius: 6px; pointer-events: none; }
.ap-product-variants__swatches button.is-active { border: 2px solid #cd0000; padding: 2px; background: #fff1f1; }
.ap-product-variants__note { margin: 0; color: #777; font-size: 12px; line-height: 1.45; }
.ap-product-variants__note[hidden] { display: none; }
@media (hover: hover) { .ap-product-variants__swatches button.is-active:hover { border-color: #cd0000; } }

.ap-fabric-control__label { display:block; margin-bottom:10px; font-size:14px; font-weight:600; }
.ap-fabric-trigger { display:flex; width:100%; align-items:center; gap:12px; padding:12px; border:1px solid #e3e1dc; border-radius:10px; background:#fff; font:inherit; font-size:14px; text-align:left; cursor:pointer; color:#242424; }
.ap-fabric-trigger > img { width:48px; height:48px; border-radius:7px; object-fit:cover; flex-shrink:0; }
.ap-fabric-trigger img[hidden] { display:none; }
.ap-fabric-trigger > span:not(.ap-fabric-trigger__action) { min-width:0; display:grid; gap:4px; }
.ap-fabric-trigger small { color:#888; font-size:12px; line-height:1.35; }
.ap-fabric-trigger__action { margin-left:auto; display:flex; align-items:center; gap:8px; white-space:nowrap; color:#777; font-size:12px; }
.ap-fabric-trigger__action > span { font-size:24px; font-weight:400; line-height:1; }
.ap-fabric-trigger:focus-visible,.ap-fabric-dialog button:focus-visible,.ap-fabric-dialog select:focus-visible,.ap-fabric-dialog summary:focus-visible { outline:2px solid #cd0000; outline-offset:3px; }
.ap-fabric-dialog { position:fixed; inset:18px 18px 18px auto; margin:0; width:min(440px,calc(100vw - 36px)); height:calc(100dvh - 36px); max-width:none; max-height:none; padding:0; border:0; border-radius:8px; background:#fff; color:#242424; font-family:inherit; font-size:14px; overflow:hidden; box-shadow:0 12px 50px #0002; opacity:0; transform:translateX(26px); transition:opacity 180ms ease,transform 260ms cubic-bezier(.2,.8,.2,1); }
.ap-fabric-dialog[open] { display:flex; flex-direction:column; }
.ap-fabric-dialog.is-open { opacity:1; transform:translateX(0); }
.ap-fabric-dialog::backdrop { background:rgba(0,0,0,.24); }
.ap-fabric-dialog__head { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:76px; padding:0 28px; flex-shrink:0; }
.ap-fabric-dialog__head h2 { margin:0; font:inherit; font-size:26px; line-height:1.2; font-weight:650; }
.ap-fabric-dialog__head button { display:grid; place-items:center; width:40px; height:40px; padding:0; border:0; border-radius:50%; background:transparent; color:#777; font:inherit; font-size:30px; cursor:pointer; }
.ap-fabric-dialog__sort { display:grid; grid-template-columns:1fr auto; align-items:center; gap:8px 12px; padding:0 28px 18px; border-bottom:1px solid #e9e9e6; }
.ap-fabric-dialog__sort label { font-weight:550; }
.ap-fabric-dialog__sort select { max-width:190px; font:inherit; color:#242424; padding:10px 12px; border:0; border-radius:10px; background:#f4f3ef; }
.ap-fabric-dialog__sort p { grid-column:1/-1; margin:0; font-size:12px; line-height:1.5; color:#888; }
.ap-fabric-dialog__body { padding:0 28px 24px; overflow-y:auto; min-height:0; flex:1; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:#b8b8b5 transparent; }
.ap-fabric-group { border-bottom:1px solid #e9e9e6; }
.ap-fabric-group summary { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:62px; list-style:none; cursor:pointer; font-size:14px; font-weight:600; }
.ap-fabric-group summary::-webkit-details-marker { display:none; }
.ap-fabric-group summary::after { content:'+'; font-size:24px; line-height:1; font-weight:400; color:#555; }
.ap-fabric-group[open] summary::after { content:'−'; }
.ap-fabric-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px 10px; padding-bottom:22px; }
.ap-fabric-swatch { display:flex; flex-direction:column; gap:4px; padding:4px; min-width:0; border:1px solid transparent; border-radius:10px; background:#fff; text-align:left; color:#242424; font:inherit; cursor:pointer; }
.ap-fabric-swatch img { display:block; width:100%; height:auto; aspect-ratio:1; object-fit:cover; border-radius:6px; }
.ap-fabric-swatch__name { font-size:11px; line-height:1.3; overflow-wrap:anywhere; }
.ap-fabric-swatch__price { font-size:12px; line-height:1.4; white-space:nowrap; color:#777; }
.ap-fabric-swatch.is-active { border-color:#cd0000; background:#fff1f1; color:#cd0000; }
.ap-fabric-swatch.is-active .ap-fabric-swatch__price { color:#cd0000; }
.ap-fabric-swatch:disabled { opacity:.45; cursor:default; }
.ap-fabric-swatch--text { padding:12px 8px; min-height:80px; background:#f4f3ef; justify-content:space-between; }
.ap-fabric-swatch--text .ap-fabric-swatch__name { font-size:13px; }
@media (hover:hover) { .ap-fabric-trigger:hover { border-color:#cd0000; } .ap-fabric-swatch:hover:not(:disabled):not(.is-active) { border-color:#d6d4ce; } .ap-fabric-dialog__head button:hover { background:#f4f3ef; } }
@media (max-width:768px) { .ap-fabric-dialog { inset:0; width:100%; height:100dvh; border-radius:8px 0 0 8px; } .ap-fabric-dialog__head { min-height:70px; padding:0 20px; } .ap-fabric-dialog__head h2 { font-size:24px; } .ap-fabric-dialog__sort { padding-inline:20px; } .ap-fabric-dialog__body { padding:0 20px max(24px,env(safe-area-inset-bottom)); } .ap-fabric-dialog__head button { width:44px; height:44px; } }
@media (prefers-reduced-motion:reduce) { .ap-fabric-dialog { transition:none; transform:none; } }

.ap-fabric-dialog:not([open]) { display:none; }
