.drawer {
  display: flex;
  min-height: 100vh;
}

.drawer-content {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-width: 0;
}

.drawer-toggle {
  display: none;
}

.drawer-side {
  display: none;
  flex: 0 0 280px;
  width: 280px;
}

.drawer-toggle:checked ~ .drawer-side {
  display: block;
}

@media (max-width: 1024px) {
  .drawer {
    flex-direction: column;
  }

  .drawer-side {
    width: 100%;
  }
}

.carousel {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
}

.carousel-item {
  flex: 0 0 100%;
  scroll-snap-align: start;
}

.dropdown {
  position: relative;
}

.dropdown .dropdown-content {
  display: none;
  position: absolute;
  left: 0;
  top: 100%;
  margin-top: 0.5rem;
}

.dropdown:focus-within .dropdown-content,
.dropdown.dropdown-open .dropdown-content {
  display: block;
}

.menu-horizontal {
  flex-direction: row;
}

.menu-horizontal > li > ul,
.menu-horizontal > li > details > ul {
  position: absolute;
}

.footer {
  display: grid;
  grid-auto-flow: row;
  row-gap: 2.5rem;
  column-gap: 1rem;
}

@media (min-width: 768px) {
  .footer {
    grid-auto-flow: column;
  }
}

.grid {
  display: grid;
}

.grid-cols-1 {
  grid-template-columns: repeat(1, minmax(0, 1fr));
}

.grid-cols-2 {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.gap-6 {
  gap: 1.5rem;
}

.gap-8 {
  gap: 2rem;
}

.px-4 {
  padding-left: 1rem;
  padding-right: 1rem;
}

.flex {
  display: flex;
}

.flex-wrap {
  flex-wrap: wrap;
}

.gap-1 {
  gap: 0.25rem;
}

.mt-2 {
  margin-top: 0.5rem;
}

.mt-4 {
  margin-top: 1rem;
}

.justify-between {
  justify-content: space-between;
}

.w-full {
  width: 100%;
}

@media (min-width: 768px) {
  .md\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  .lg\:grid-cols-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}