/* Tailwind Core */
@import 'tailwindcss';

/* ReUI Configs */
@import './config.reui.css';

/** Global Styles **/
@layer base {
  * {
    @apply border-border;
  }

  *:focus-visible {
    @apply outline-ring rounded-xs shadow-none outline-2 outline-offset-3 transition-none!;
  }
}

/* Custom Animations */
@keyframes typeIn {
  0%, 10% {
    opacity: 0;
  }
  15%, 85% {
    opacity: 1;
  }
  90%, 100% {
    opacity: 0;
  }
}

@keyframes blink {
  0%, 50% {
    opacity: 1;
  }
  51%, 100% {
    opacity: 0;
  }
}

/* Metronic Components  */
@import './components/image-input.css';
@import './components/apexcharts.css';
@import './components/leaflet.css';
@import './components/rating.css';
@import './components/image-input.css';
@import './components/scrollable.css';

/* Layout */
@import './layout.css';

/** Dark/Light Theme Variant **/
@custom-variant dark (&:is(.dark *));
@custom-variant light (&:not(.dark *));