:root { --primary: #2C4A3B; --accent: #D4B982; --bg-light: #F9F7F2; --text-dark: #1a2e25; }
body { font-family: 'Cairo', sans-serif; background-color: var(--bg-light); color: var(--text-dark); }
body.font-latin, body.font-latin .nav-link, body.font-latin button { font-family: 'Outfit', sans-serif; }
.font-serif { font-family: 'Playfair Display', serif; }
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: var(--bg-light); }
::-webkit-scrollbar-thumb { background: var(--primary); border-radius: 3px; }
.snap-x { scroll-snap-type: x mandatory; }
.snap-center { scroll-snap-align: center; }
.hide-scrollbar::-webkit-scrollbar { display: none; }
.hide-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }
.glass { background: rgba(249, 247, 242, 0.95); backdrop-filter: blur(8px); border-bottom: 1px solid rgba(212, 185, 130, 0.2); }
.fade-in-up { opacity: 0; transform: translateY(20px); transition: opacity 0.6s ease-out, transform 0.6s ease-out; }
.fade-in-up.visible { opacity: 1; transform: translateY(0); }
.filter-btn { padding: 0.4rem 1rem; border-radius: 9999px; font-size: 0.75rem; font-weight: 600; white-space: nowrap; transition: all 0.2s ease; border: 1px solid #e5e7eb; color: #4b5563; background: white; }
.filter-btn.active { background-color: var(--primary); color: var(--accent); border-color: var(--primary); }
.slider-btn { position: absolute; top: 50%; transform: translateY(-50%); width: 30px; height: 30px; background-color: rgba(255, 255, 255, 0.8); border-radius: 50%; display: flex; align-items: center; justify-content: center; cursor: pointer; z-index: 30; transition: all 0.2s; opacity: 0; box-shadow: 0 2px 4px rgba(0,0,0,0.1); color: #2C4A3B; border: none; }
.group:hover .slider-btn { opacity: 1; }
.slider-btn:hover { background-color: #2C4A3B; color: #D4B982; scale: 1.1; }
html[dir="rtl"] .slider-btn-left { left: 10px; right: auto; }
html[dir="rtl"] .slider-btn-right { right: 10px; left: auto; }
html[dir="ltr"] .slider-btn-left { left: 10px; right: auto; }
html[dir="ltr"] .slider-btn-right { right: 10px; left: auto; }
.lang-btn.active { background-color: #2C4A3B; color: white; }
.badge-new { background-color: #2C4A3B; color: #D4B982; }
.badge-promo { background-color: #ef4444; color: white; }
.badge-rare { background-color: #D4B982; color: #2C4A3B; }
.badge-vintage { background-color: #4b5563; color: white; }
.badge-unique { background-color: #7c3aed; color: white; }
.badge-luxe { background-color: #000; color: #D4B982; }
@media (max-width: 640px) { .slider-btn { opacity: 0.8; width: 25px; height: 25px; } }

/* Animations for Modal */
@keyframes fadeIn {
    from { opacity: 0; transform: translate(-50%, -45%); }
    to { opacity: 1; transform: translate(-50%, -50%); }
}