@import url('brands.css');
@import url('categories.css');
@import url('buyButton.css');
@import url('card.css');
@import url('carousel.css');
@import url('lang.css');
@import url('product.css');
@import url('stars.css');
@import url('style.css');
@import url('syle.css');
@import url('toast.css');
@import url('wow.css');
@import url('image-skeleton.css');
@import 'animate.css';

@tailwind base;
@tailwind components;
@tailwind utilities;
[dir="rtl"] {
    direction: rtl;
    text-align: right;
}

[dir="rtl"] .aside {
  float: right;
  margin-left: 0;
  margin-right: 20px; /* Adjust as needed */
}

/* Or use specific selectors */
[dir="rtl"] .navbar,
[dir="rtl"] .content {
    text-align: right;
}
.primary-bg {
    @apply bg-[#9e01a1];
}

.nav-bar {
   @apply shadow-xl antialiased font-serif;
}

.primary-btn {
    @apply bg-white text-black font-bold;
}