body { font-family: 'Tajawal', Tahoma, sans-serif; background-color: #F8F9FA; color: #1B2A4A; }

/* شريط التمرير المخصص */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: #F8F9FA; }
::-webkit-scrollbar-thumb { background: #C9A84C; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #B0903B; }

/* تأثير الزجاج البلوري */
.glass-effect { background: rgba(255,255,255,0.75); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border: 1px solid rgba(255,255,255,0.25); }

/* Tab buttons */
.tab-btn { color: #d1d5db; background: transparent; text-align: right; }
.tab-btn:hover { background: rgba(255,255,255,0.05); color: #fff; }
.tab-btn.active { background: #C9A84C; color: #1B2A4A; box-shadow: 0 6px 12px rgba(201,168,76,0.15); }

.tab-content { display: block; }
.tab-content.hidden { display: none; }

/* Expiration buttons */
.exp-btn.active { background: #1B2A4A !important; color: #fff !important; border-color: #1B2A4A !important; }

/* Property card */
.prop-card { background: #fff; border: 1px solid #f1f5f9; border-radius: 1rem; overflow: hidden; transition: all .3s; display: flex; flex-direction: column; }
.prop-card:hover { box-shadow: 0 12px 30px rgba(0,0,0,0.1); }
.prop-card:hover .prop-img { transform: scale(1.05); }
.prop-card.selected { border-color: #C9A84C; box-shadow: 0 0 0 3px rgba(201,168,76,0.3); }
.prop-img { transition: transform .5s; }

/* Animations */
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
.fade-in { animation: fadeIn .3s ease-out; }

/* Image gallery */
.gallery-main img { width: 100%; height: 400px; object-fit: cover; border-radius: 1.5rem; }
.gallery-thumbs { display: flex; gap: 8px; margin-top: 8px; overflow-x: auto; }
.gallery-thumbs img { width: 80px; height: 60px; object-fit: cover; border-radius: 0.5rem; cursor: pointer; opacity: 0.7; }
.gallery-thumbs img.active { opacity: 1; outline: 2px solid #C9A84C; }

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