.variant-categories{display:flex;gap:.5rem;margin-bottom:1.5rem;margin-top:1rem;flex-wrap:wrap;width:100%}.variant-category-btn{display:flex;align-items:center;gap:.5rem;padding:.75rem 1.5rem;border:2px solid rgb(var(--color-border));border-radius:.5rem;background-color:rgb(var(--color-background));color:rgb(var(--color-foreground));font-size:1.4rem;font-weight:500;cursor:pointer;transition:all .3s ease;text-align:center;flex:1}.variant-category-btn:hover{border-color:rgb(var(--color-foreground));background-color:rgba(var(--color-foreground),.05)}.category-icon{display:flex;align-items:center;justify-content:center;width:20px;height:20px}.category-icon svg{width:100%;height:100%}.category-name{white-space:nowrap}.size-variant-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-top:1rem}.size-variant-card{position:relative;cursor:pointer;text-align:center;transition:opacity .2s ease-in-out;opacity:0;height:0;overflow:hidden}.size-variant-card.visible{opacity:1;height:auto;overflow:visible}.size-variant-card input[type=radio]{position:absolute;opacity:0;width:0;height:0}.size-variant-card label{display:flex;flex-direction:column;align-items:center;padding:1rem;border:1px solid #d1d1d1;border-radius:.8rem;cursor:pointer;transition:all .3s ease;background-color:rgb(var(--color-background));text-align:center;position:relative;overflow:hidden;min-height:140px;width:100%;box-sizing:border-box}.size-variant-card label:hover{transform:translateY(-2px)}.size-variant-card input[type=radio]:checked+label{border:1px solid black;background-color:rgba(var(--color-button),.05)}.size-variant-card input[type=radio]:checked+label:before{content:"\2713";position:absolute;top:.5rem;right:.5rem;width:1.8rem;height:1.8rem;background-color:rgb(var(--color-button));border-radius:50%;color:rgb(var(--color-button-text));font-size:1rem;font-weight:700;display:flex;align-items:center;justify-content:center;z-index:1}.size-variant-card__image{width:80px;height:80px;margin-bottom:.5rem;border-radius:.5rem;overflow:hidden;background-color:rgb(var(--color-card-hover));display:flex;align-items:center;justify-content:center;border:1px solid rgba(var(--color-border),.3)}.size-variant-card__image img{width:100%;height:100%;object-fit:cover;border-radius:.5rem}.size-variant-card__placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,rgba(var(--color-button),.1),rgba(var(--color-foreground),.05));border-radius:.5rem}.size-variant-card__placeholder span{font-size:.9rem;font-weight:600;color:rgb(var(--color-foreground));opacity:.6;letter-spacing:.05em}.size-variant-card__title{font-size:1.4rem;font-weight:500;color:rgb(var(--color-foreground));margin-top:.25rem}.size-variant-card input[type=radio]:disabled+label{opacity:.5;cursor:not-allowed}.size-variant-card input[type=radio]:disabled+label:hover{transform:none;box-shadow:none;border-color:rgb(var(--color-border))}.size-variant-card input[type=radio]:disabled+label:after{content:"SOLD OUT";position:absolute;top:0;left:0;right:0;bottom:0;background-color:rgba(var(--color-background),.9);display:flex;align-items:center;justify-content:center;border-radius:.8rem;font-size:.8rem;font-weight:600;color:rgb(var(--color-foreground));opacity:.8}@media (max-width:1200px){.size-variant-cards{grid-template-columns:repeat(3,1fr)}}@media screen and (max-width: 749px){.variant-categories{flex-wrap:wrap;gap:.75rem}.variant-category-btn{padding:.6rem 1rem;font-size:1.2rem;min-width:auto;flex:1}.category-icon{width:16px;height:16px}.size-variant-cards{grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:.8rem}.size-variant-card label{padding:.8rem;min-height:180px}.size-variant-card__image{width:100%;height:180px}.size-variant-card__title{font-size:1.2rem}.size-variant-card__placeholder span{font-size:.7rem}}@media screen and (max-width: 479px){.variant-categories{gap:.5rem}.variant-category-btn{font-size:1.1rem;padding:.75rem 1rem;flex:1;justify-content:flex-start}.size-variant-cards{grid-template-columns:repeat(2,1fr)}}
/*# sourceMappingURL=/cdn/shop/t/22/assets/component-size-variant-cards.css.map */