/* Animations */
@keyframes slideUp{from{transform:translateY(100%)}to{transform:translateY(0)}}
.slide-up{animation:slideUp .3s ease-out}
@keyframes slideUp{from{transform:translateY(100%)}to{transform:translateY(0)}}
@keyframes slideLeft{from{transform:translateX(-100%)}to{transform:translateX(0)}}
.slide-panel{animation:slideUp .3s ease-out forwards}
@media (min-width:768px){.slide-panel{animation:slideLeft .3s ease-out forwards}}

.backdrop-blur{backdrop-filter:blur(8px)}

/* Layout-specific font sizes */
.layout-1col .product-title{font-size:1.5rem!important;line-height:2rem!important;min-height:4rem!important}
.layout-1col .product-brand{font-size:1rem!important}
.layout-1col .product-seller{font-size:.875rem!important}
.layout-1col .product-price{font-size:2rem!important}
.layout-1col .product-old-price{font-size:1.25rem!important}
.layout-1col .product-badge{font-size:1rem!important;padding:.5rem 1rem!important}

/* Button styles */
.btn-nav{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:.5rem .75rem;background-color:rgb(243 244 246);border-radius:.5rem;transition:background-color .15s}
.btn-nav:hover{background-color:rgb(229 231 235)}
.btn-filter{padding:.625rem 1.25rem;font-size:1rem;line-height:1.5rem;border-width:1px;border-radius:.5rem;transition:all .15s}
.btn-filter-active{background-color:rgb(37 99 235);color:#fff}
.btn-filter-inactive{background-color:#fff;border-color:rgb(209 213 219);color:inherit}
.btn-filter-inactive:hover{background-color:rgb(249 250 251)}

/* Visual search button - visible on touch devices */
.visual-btn{position:absolute;bottom:.75rem;right:.75rem;display:flex;align-items:center;gap:.5rem;padding:.625rem .75rem;background:linear-gradient(to right,rgb(37 99 235),rgb(147 51 234));color:#fff;border-radius:9999px;box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1);opacity:1;transition:all .3s;z-index:10}
.visual-btn:hover{box-shadow:0 25px 50px -12px rgba(0,0,0,.25);transform:scale(1.05);background:linear-gradient(to right,rgb(29 78 216),rgb(126 34 206))}
/* Desktop only: hide by default, show on hover */
@media(hover:hover) and (pointer:fine){
.visual-btn{opacity:0}
.group:hover .visual-btn{opacity:1}
}

/* Star ratings */
.star{width:1.25rem;height:1.25rem;fill:currentColor}
.star-sm{width:1rem;height:1rem}
.star-lg{width:1.5rem;height:1.5rem}
.star-yellow{color:rgb(250 204 21)}
.star-gray{color:rgb(209 213 219)}

/* Icons */
.icon{width:1.5rem;height:1.5rem;flex-shrink:0}
.check-icon{color:rgb(34 197 94)}

/* Gallery */
.thumbnail-active{border-color:#2563eb;opacity:1}
.thumbnail{opacity:.6;transition:opacity .3s,border-color .3s}
.thumbnail:hover{opacity:1}
.gallery-scroll{scroll-behavior:smooth;-webkit-overflow-scrolling:touch;-ms-overflow-style:none;scrollbar-width:none}
.gallery-scroll::-webkit-scrollbar{display:none}

/* Image zoom - Desktop only */
@media(min-width:1024px){
.zoom-container{position:relative;overflow:hidden;cursor:zoom-in}
.zoom-container.zooming{cursor:zoom-out}
.zoom-lens{position:absolute;border:2px solid rgba(37,99,235,.5);background-color:rgba(37,99,235,.1);width:150px;height:150px;pointer-events:none;display:none;border-radius:50%}
.zoom-result{position:fixed;border:3px solid #2563eb;width:400px;height:400px;display:none;background:#fff;box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04);border-radius:1rem;z-index:1000}
.zoom-hint{position:absolute;bottom:1rem;left:50%;transform:translateX(-50%);background:rgba(0,0,0,.75);color:#fff;padding:.5rem 1rem;border-radius:9999px;font-size:.875rem;pointer-events:none;opacity:0;transition:opacity .3s}
.zoom-container:hover .zoom-hint{opacity:1}
}
@media(max-width:1023px){
.zoom-container{position:relative;overflow:hidden;cursor:default}
}