/* Categories Component Styles */

/* Category Icon List */

.budi-category-list__item {
   width: 70px;
   gap: 4px;
   color: var(--neutral-black);
}

.budi-category-list__item-icon {
   width: 48px;
   height: 48px;
   background-color: var(--secondary);
   transition: all 0.3s;
}

.budi-category-list__item-icon img {
   width: 20px;
   aspect-ratio: 1 / 1;
}

.budi-category-list__item-title {
   font-size: 12px;
   line-height: 1.5;
   font-weight: 500;
   white-space: nowrap;
}

.budi-category-list__item:hover .budi-category-list__item-icon {
   background-color: #cc056f29;
}

/* Category Cards */

.budi-category__block-title {
   margin-bottom: 24px;
}

.budi-category__card-wrapper {
   display: grid;
   grid-template-columns: repeat(4, 1fr);
   gap: 24px;
}

.budi-category__card-thumb {
   height: 293px;
   border-radius: 12px;
}

.budi-category__card-thumb img {
   transition: all 1s ease-in-out;
}

.budi-category__card-content {
   padding-top: 24px;
}

.budi-category__card-desc {
   color: var(--neutral-800);
}

/* Categories Responsive Styles */

@media (max-width: 1399px) {
   .budi-category__card-thumb {
      height: 260px;
   }
}

@media (max-width: 1199px) {
   .budi-category__card-thumb {
      height: 215px;
   }
}

@media (max-width: 767px) {
   .budi-category-list {
      padding-block: 16px;
   }
   
   .budi-category__card-content {
      padding-top: 16px;
   }
   
   .budi-category__card-wrapper {
      gap: 16px;
   }
   
   .budi-category__card-thumb {
      height: auto;
      aspect-ratio: 1 / 1;
   }
   
   .budi-category__card-title {
      font-size: 14px;
   }
   
   .budi-category__card-desc {
      display: none;
   }
}