/* External Font Imports */
@import url('https://cdn.jsdelivr.net/gh/rastikerdar/vazirmatn@v33.003/Vazirmatn-font-face.css');
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css');

/* Tailwind Directives (These are mainly for build processes, but leaving them doesn't hurt) */
@tailwind base;
@tailwind components;
@tailwind utilities;

/* Custom Component Classes */
@layer components {
    /* Base style for all buttons in the app */
    .btn {
        @apply inline-flex justify-center items-center px-4 py-2 border border-transparent 
               text-sm font-medium rounded-md text-white transition-all duration-200 
               ease-in-out hover:scale-105 shadow-sm;
    }
    
    /* Button color variants */
    .btn-indigo {
        @apply btn bg-indigo-600 hover:bg-indigo-700;
    }
    
    .btn-green {
        @apply btn bg-green-600 hover:bg-green-700;
    }
    
    .btn-red {
        @apply btn bg-red-600 hover:bg-red-700;
    }
    
    .btn-blue {
        @apply btn bg-blue-600 hover:bg-blue-700;
    }
}

/* Custom styles for accordion animation */
.accordion-content {
    overflow: hidden;
    transition: max-height 0.3s ease-out, opacity 0.3s ease-out;
}

.accordion-icon i {
    transition: transform 0.3s ease-in-out;
}