/* Custom Arabesque & Islamic Geometric Textures */
.arabesque-pattern {
  background-image: radial-gradient(#DEC6A6 1px, transparent 1px), radial-gradient(#DEC6A6 1px, #1A4331 1px);
  background-size: 24px 24px;
  background-position: 0 0, 12px 12px;
}

/* Hide scrollbars while allowing touch scrolling */
.no-scrollbar::-webkit-scrollbar {
  display: none;
}
.no-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

/* Smooth Tab Styling */
.nav-tab.active {
  color: #1A4331;
  background-color: #F7F3EA;
}
.nav-tab.active svg {
  color: #1A4331;
  transform: translateY(-1px);
}

/* Quranic verse styling */
.font-quran {
  font-family: 'Amiri', serif;
}

/* Haptic touch tap feedback on beads */
@keyframes beadRipple {
  0% { transform: scale(0.96); }
  50% { transform: scale(1.03); }
  100% { transform: scale(1); }
}

.bead-tap-active {
  animation: beadRipple 0.18s ease-out;
}

/* Custom smooth transitions */
button, a {
  -webkit-tap-highlight-color: transparent;
}