/* Custom styles */
:root {
    --primary-color: #1a365d;
    --secondary-color: #2d3748;
    --third-color: #4a5568;
    --fourth-color: #718096;
}

body {
    font-family: 'Tajawal', sans-serif;
}

.text-primary-color { color: var(--primary-color); }
.text-secondary-color { color: var(--secondary-color); }
.text-third-color { color: var(--third-color); }
.text-fourth-color { color: var(--fourth-color); }

.bg-primary-color { background-color: var(--primary-color); }
.bg-secondary-color { background-color: var(--secondary-color); }
.bg-third-color { background-color: var(--third-color); }
.bg-fourth-color { background-color: var(--fourth-color); }

/* Custom utility classes */
.rtl {
    direction: rtl;
    text-align: right;
}

/* Button styles */
.btn {
    @apply px-6 py-2 rounded-lg transition duration-300;
}

.btn-primary {
    @apply bg-primary-color hover:bg-secondary-color text-white;
}

.btn-outline {
    @apply border border-primary-color text-primary-color hover:bg-primary-color hover:text-white;
}

/* Card styles */
.card {
    @apply bg-white rounded-lg shadow-sm overflow-hidden;
}

.card-body {
    @apply p-6;
}

/* Form styles */
.form-input {
    @apply mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-primary-color focus:ring focus:ring-primary-color focus:ring-opacity-50;
}

.form-label {
    @apply block text-sm font-medium text-gray-700;
}