/* Mobile menu improvements */
@media (max-width: 991px) {
  /* Menu chính (slide-menu) */
  .slide-menu {
    max-height: 0 !important;
    overflow: hidden !important;
    transition: max-height 0.3s ease-in-out, opacity 0.3s ease-in-out !important;
    opacity: 0 !important;
  }

  .slide.is-expanded .slide-menu {
    max-height: 1000px !important;
    opacity: 1 !important;
  }

  /* Menu con (sub-slide-menu) */
  .sub-slide-menu {
    max-height: 0 !important;
    overflow: hidden !important;
    transition: max-height 0.3s ease-in-out, opacity 0.3s ease-in-out !important;
    opacity: 0 !important;
    padding-left: 15px !important;
  }

  .sub-slide.is-expanded .sub-slide-menu {
    max-height: 500px !important;
    opacity: 1 !important;
  }

  /* Đảm bảo các item có thể click được */
  .side-menu__item,
  .slide-item {
    cursor: pointer !important;
    user-select: none !important;
  }

  /* Hiệu ứng xoay mũi tên */
  .angle,
  .sub-angle {
    transition: transform 0.3s ease-in-out !important;
    transform-origin: center !important;
  }

  .slide.is-expanded .angle {
    transform: rotate(180deg) !important;
  }

  .sub-slide.is-expanded .sub-angle {
    transform: rotate(180deg) !important;
  }

  /* Spacing cho mobile */
  .side-menu__item {
    padding: 12px 15px !important;
    font-size: 14px !important;
  }

  .slide-item {
    padding: 10px 15px !important;
    font-size: 13px !important;
  }

  .sub-side-menu__item {
    padding: 8px 15px !important;
    font-size: 12px !important;
  }
}

/* Đảm bảo hiệu ứng hoạt động trên tất cả thiết bị */
.slide-menu,
.sub-slide-menu {
  transition: max-height 0.3s ease-in-out, opacity 0.3s ease-in-out !important;
}

.angle,
.sub-angle {
  transition: transform 0.3s ease-in-out !important;
  transform-origin: center !important;
}
