/* Bella Moda — custom CSS (Tailwind via CDN) */

/* Hide scrollbar for category bar */
.scrollbar-hide::-webkit-scrollbar { display: none; }
.scrollbar-hide { -ms-overflow-style: none; scrollbar-width: none; }

/* Smooth animations */
@keyframes slide-in-from-right {
  from { transform: translateX(100%); }
  to { transform: translateX(0); }
}
.animate-in.slide-in-from-right { animation: slide-in-from-right .3s ease-out; }

/* Custom scrollbar for wishlist / panels */
.overflow-y-auto::-webkit-scrollbar { width: 4px; }
.overflow-y-auto::-webkit-scrollbar-track { background: transparent; }
.overflow-y-auto::-webkit-scrollbar-thumb { background: #e5e7eb; border-radius: 4px; }
.overflow-y-auto::-webkit-scrollbar-thumb:hover { background: #d1d5db; }

/* Line clamp */
.line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }

/* Pequenos refinamentos */
button:disabled { cursor: not-allowed; }

/* ---- UI helpers (importado do layout React original) ---- */
.scrollbar-hide::-webkit-scrollbar{display:none}
.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}
@keyframes slide-in-from-right{from{transform:translateX(100%)}to{transform:translateX(0)}}
.animate-in.slide-in-from-right{animation:slide-in-from-right .3s ease-out}
.overflow-y-auto::-webkit-scrollbar{width:4px}
.overflow-y-auto::-webkit-scrollbar-track{background:transparent}
.overflow-y-auto::-webkit-scrollbar-thumb{background:#e5e7eb;border-radius:4px}
.overflow-y-auto::-webkit-scrollbar-thumb:hover{background:#d1d5db}
.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
html{scroll-behavior:smooth}
body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}