/* --- ESTILOS PRINCIPALES --- */
.widget-item-control, .item-control, .quickedit, .home-link, .feed-links { display: none !important; }
#navbar-iframe { display: none !important; height: 0px; visibility: hidden; }
body { font-family: 'Inter', sans-serif; background-color: #f3f4f6; padding-top: 70px; }
header { height: 70px; }
.product-card { transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out; background: white; border-radius: 0.75rem; overflow: hidden; position: relative; display: flex; flex-direction: column; height: 100%; }
.product-card:hover { transform: translateY(-5px); box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1); }
.img-container { aspect-ratio: 1 / 1; width: 100%; overflow: hidden; background-color: #ffffff; display: flex; align-items: center; justify-content: center; padding: 10px; position: relative; }
.img-container img { width: 100%; height: 100%; object-fit: contain; transition: transform 0.3s ease; }
.product-card:hover .img-container img { transform: scale(1.05); }
.video-badge { position: absolute; bottom: 8px; left: 8px; background: rgba(220, 38, 38, 0.9); color: white; width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 10px; box-shadow: 0 2px 5px rgba(0,0,0,0.3); z-index: 5; pointer-events: none; }
.fav-btn { position: absolute; top: 8px; right: 8px; width: 32px; height: 32px; border-radius: 50%; background: white; box-shadow: 0 2px 5px rgba(0,0,0,0.1); display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 10; color: #d1d5db; transition: all 0.2s; }
.fav-btn:hover { transform: scale(1.1); } .fav-btn.active { color: #ef4444; }
.loader { border: 4px solid #f3f3f3; border-top: 4px solid #3b82f6; border-radius: 50%; width: 40px; height: 40px; animation: spin 1s linear infinite; margin: 20px auto; }
@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
@keyframes bump { 0% { transform: scale(1); } 50% { transform: scale(1.2); } 100% { transform: scale(1); } }
.bump { animation: bump 0.3s ease-out; }
.image-thumbnail { cursor: pointer; transition: transform 0.2s; border: 3px solid transparent; }
.image-thumbnail:hover { transform: translateY(-2px); }
.image-thumbnail.active { border: 3px solid #3b82f6; }
#modal-content { transform: scale(0.95); opacity: 0; transition: all 0.3s ease-out; }
#product-modal:not(.hidden) #modal-content { transform: scale(1); opacity: 1; }
.main-image-fade { transition: opacity 0.5s ease-in-out; opacity: 0.5; }
.main-image-fade.loaded { opacity: 1; }
#cartSidebar { transition: transform 0.3s ease-in-out; }
.description-pre-wrap { white-space: pre-wrap; }
#copyNotification { position: fixed; bottom: 20px; left: 50%; transform: translateX(-50%); padding: 12px 24px; background-color: #10b981; color: white; border-radius: 8px; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); opacity: 0; transition: opacity 0.3s, transform 0.3s; z-index: 100; }
#copyNotification.show { opacity: 1; transform: translate(-50%, -20px); }
.bottom-spinner { border: 3px solid #e5e7eb; border-top: 3px solid #3b82f6; border-radius: 50%; width: 24px; height: 24px; animation: spin 1s linear infinite; display: inline-block; }
.video-wrapper { position: relative; padding-bottom: 56.25%; height: 0; width: 100%; overflow: hidden; border-radius: 0.75rem; background: #000; margin-bottom: 1.5rem; box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1); }
.video-wrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; }
.fly-item { position: fixed; z-index: 10000; transition: all 0.8s cubic-bezier(0.19, 1, 0.22, 1); pointer-events: none; border-radius: 50%; box-shadow: 0 5px 15px rgba(0,0,0,0.3); object-fit: cover; }
.stars-input i { cursor: pointer; color: #d1d5db; transition: color 0.2s; }
.stars-input i.active, .stars-input i:hover { color: #fbbf24; }
.review-item { border-bottom: 1px solid #f3f4f6; padding-bottom: 1rem; margin-bottom: 1rem; }
.review-item:last-child { border-bottom: none; }
.star-display { color: #fbbf24; font-size: 0.8rem; }
.category-scroll { display: flex; gap: 0.5rem; overflow-x: auto; padding-bottom: 5px; -ms-overflow-style: none; scrollbar-width: none; }
.category-scroll::-webkit-scrollbar { display: none; }
.cat-pill { white-space: nowrap; padding: 0.5rem 1rem; border-radius: 9999px; font-size: 0.875rem; font-weight: 600; background-color: #e5e7eb; color: #374151; cursor: pointer; transition: all 0.2s; border: 1px solid transparent; }
.cat-pill:hover { background-color: #d1d5db; }
.cat-pill.active { background-color: #2563eb; color: white; box-shadow: 0 2px 5px rgba(37, 99, 235, 0.3); }
.btn-disabled { background-color: #9ca3af !important; cursor: not-allowed; }