body {
    font-family: "Tajawal", sans-serif;
    background: #f7f7f7;

}

html {
    font-family: "Tajawal", sans-serif;
}

.dark {
    color-scheme: dark;
}

.dark body {
    @apply bg-gray-900 text-gray-100;
}

.dark .bg-white {
    @apply bg-gray-800;
}

.dark .text-gray-900 {
    @apply text-gray-100;
}

.dark .text-gray-600 {
    @apply text-gray-400;
}

.dark .border-gray-300 {
    @apply border-gray-700;
}

.dark .bg-gray-50 {
    @apply bg-gray-700;
}

/* تخصيص الألوان */
:root {
    --color-primary: #059669;
    --color-secondary: #065f46;
}

.rtl {
    direction: rtl;
}

@layer components {
    .pagination-item {
        @apply relative inline-flex items-center px-3 py-1 text-sm font-medium rounded-full transition-colors;
    }

    .pagination-item-active {
        @apply text-white bg-emerald-600;
    }

    .pagination-item-inactive {
        @apply text-gray-700 dark:text-gray-300 bg-white dark:bg-gray-800 hover:bg-emerald-50 dark:hover:bg-gray-700;
    }

    .pagination-nav {
        @apply relative inline-flex items-center p-2 text-sm font-medium rounded-full transition-colors;
    }

    .pagination-nav-active {
        @apply text-gray-700 dark:text-gray-300 bg-white dark:bg-gray-800 hover:bg-emerald-50 dark:hover:bg-gray-700;
    }

    .pagination-nav-disabled {
        @apply text-gray-400 bg-white dark:bg-gray-800 cursor-not-allowed;
    }
}

.surah-card {
    transition: all 0.3s ease-in-out;
}

.surah-card[style*="display: none"] {
    opacity: 0;
    transform: translateY(10px);
}

.search-input:focus {
    @apply ring-2 ring-emerald-500 border-emerald-500;
}

.search-input::placeholder {
    @apply text-gray-400;
}


a.nav-item {
    margin-left: calc(2rem * var(--tw-space-x-reverse)) !important;
    margin-right: calc(2rem * calc(1 - var(--tw-space-x-reverse))) !important;
}

svg.w-5.h-5.ml-2 {
    margin-right: .5rem;
    margin-left: 0;
}

span.text-lg.font-medium.mr-2 {
    margin-left: .5rem;
    margin-right: 0;
}

button#prev-btn {
    rotate: 180deg;
}

button#next-btn {
    rotate: 180deg;
}

a.text-gray-600.hover\:text-emerald-600.text-sm {
    margin-left: calc(1.5rem * var(--tw-space-x-reverse));
    margin-right: calc(1.5rem * calc(1 - var(--tw-space-x-reverse)));
}

a.relative.inline-flex.items-center.p-2.text-sm.font-medium.text-gray-700.dark\:text-gray-300.bg-white.dark\:bg-gray-800.hover\:bg-emerald-50.dark\:hover\:bg-gray-700.rounded-full.transition-colors {
    margin-left: calc(1.5rem * var(--tw-space-x-reverse));
    margin-right: calc(1.5rem * calc(1 - var(--tw-space-x-reverse)));
}

.surah-number {
    margin-right: 0.75rem;
    margin-left: 0 !important;
}

.language-toggle-icon {
    margin-right: .5rem;
    margin-left: 0;
}

@media (max-width: 768px) {

    .account-menu,
    .language-menu {
        display: none;
    }

}