@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
@import url("/assets/header-c3c232b0.css");
@import url("/assets/sidebar-eaf7778a.css");
@import url("/assets/links-9193bc68.css");
@import url("/assets/radio-c2a2a910.css");
@import url("/assets/trix-e02e9e19.css");
@import url("/assets/buttons-b34e65d8.css");
@import url("/assets/flash_cards-42e6926f.css");
@import url("/assets/quizzes-91a4d3b9.css");
@import url("/assets/recording-3a2690f0.css");
@import url("/assets/recording_preferences-b62baae7.css");
@import url("/assets/tour-3a14fed7.css");
@import url("/assets/scrollbar-a4a5074b.css");
@import url("/assets/ai_tutor-3169eca7.css");
@import url("/assets/brainrots-0733cbbe.css");

@tailwind base;
@tailwind components;
@tailwind utilities;

summary::-webkit-details-marker {
  display: none;
}

a.disabled {
  @apply cursor-not-allowed bg-gray-400 dark:bg-haiti-600 !important;
}

@layer base {
  .wrapper {
    @apply px-2;
  }
  .section {
    @apply rounded-[2rem] bg-white p-6 dark:bg-haiti-900;
  }

  .section-sm {
    @apply p-4;
  }
}

@keyframes fade-in {
  from {
    opacity: 0;
  }
}

@keyframes fade-out {
  to {
    opacity: 0;
  }
}

@keyframes slide-from-right {
  from {
    transform: translateX(60px);
  }
}

@keyframes slide-up {
  from {
    transform: translateY(130px);
  }
}

@keyframes slide-to-left {
  to {
    transform: translateX(-30px);
  }
}

/* main {
  view-transition-name: main;
} */

.vignette {
  mask-image: radial-gradient(rgb(255, 255, 255) 30%, transparent 70%);
}

.vignette-s {
  mask-image: radial-gradient(rgb(255, 255, 255) 30%, transparent 90%);
}

.vignette-l {
  mask-image: radial-gradient(rgb(255, 255, 255) 0%, transparent 70%);
}

/* ::view-transition-old(main) {
  animation: 90ms cubic-bezier(0.4, 0, 1, 1) both fade-out,
    300ms cubic-bezier(0.4, 0, 0.2, 1) both slide-to-left;
}

::view-transition-new(main) {
  animation: 210ms cubic-bezier(0, 0, 0.2, 1) 90ms both fade-in,
    300ms cubic-bezier(0.4, 0, 0.2, 1) both slide-from-right;
} */