/* ⛓️ CURSOR_ANCHOR:ui:navbar_mobile_nav */
/* Mobile offcanvas - nav items and links */
@media (max-width: 991.98px) {
  /* Navbar nav в offcanvas - КРИТИЧНО для отображения элементов */
  /* Максимальная специфичность для переопределения всех Bootstrap стилей */
  .offcanvas.offcanvas-lg.show .offcanvas-body .navbar-nav,
  .offcanvas-lg.show .offcanvas-body .navbar-nav,
  .offcanvas.show .offcanvas-body .navbar-nav,
  .offcanvas.offcanvas-lg .offcanvas-body .navbar-nav,
  .offcanvas-lg .offcanvas-body .navbar-nav,
  .offcanvas-body .navbar-nav,
  .offcanvas .navbar-nav,
  .offcanvas-body .navbar-nav.ms-auto,
  .offcanvas .navbar-nav.ms-auto {
    gap: 0 !important;
    margin: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    display: block !important;
    flex-direction: column !important;
    width: 100% !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    position: relative !important;
    overflow: visible !important;
  }

  /* Nav items - минималистичный стиль с разделителями */
  .offcanvas.show .offcanvas-body .navbar-nav .nav-item:not(#auth-login-item),
  .offcanvas.offcanvas-lg.show .offcanvas-body .navbar-nav .nav-item:not(#auth-login-item),
  .offcanvas-lg.show .offcanvas-body .navbar-nav .nav-item:not(#auth-login-item),
  .offcanvas.offcanvas-lg .offcanvas-body .navbar-nav .nav-item:not(#auth-login-item),
  .offcanvas-lg .offcanvas-body .navbar-nav .nav-item:not(#auth-login-item),
  .offcanvas-body .navbar-nav .nav-item:not(#auth-login-item),
  .offcanvas .navbar-nav .nav-item:not(#auth-login-item) {
    margin: 0 !important;
    display: block !important;
    width: 100% !important;
    visibility: visible !important;
    opacity: 1 !important;
    list-style: none !important;
    height: auto !important;
    min-height: 0 !important;
    position: relative !important;
    border-bottom: 1px solid rgb(var(--grey-200));
    clip: auto !important;
    clip-path: none !important;
  }

  /* Auth login item - скрываем по умолчанию, JavaScript управляет видимостью */
  .offcanvas.show .offcanvas-body .navbar-nav .nav-item#auth-login-item,
  .offcanvas.offcanvas-lg.show .offcanvas-body .navbar-nav .nav-item#auth-login-item,
  .offcanvas-lg.show .offcanvas-body .navbar-nav .nav-item#auth-login-item,
  .offcanvas.offcanvas-lg .offcanvas-body .navbar-nav .nav-item#auth-login-item,
  .offcanvas-lg .offcanvas-body .navbar-nav .nav-item#auth-login-item,
  .offcanvas-body .navbar-nav .nav-item#auth-login-item,
  .offcanvas .navbar-nav .nav-item#auth-login-item,
  #auth-login-item {
    display: none !important;
    border-bottom: 1px solid rgb(var(--grey-200));
  }

  .offcanvas-body .navbar-nav .nav-item#auth-login-item[style*="display: block"],
  .offcanvas .navbar-nav .nav-item#auth-login-item[style*="display: block"],
  .offcanvas.show .offcanvas-body .navbar-nav .nav-item#auth-login-item[style*="display: block"],
  .offcanvas.offcanvas-lg.show .offcanvas-body .navbar-nav .nav-item#auth-login-item[style*="display: block"] {
    display: block !important;
  }

  .offcanvas-body .navbar-nav .nav-item:last-child,
  .offcanvas .navbar-nav .nav-item:last-child {
    border-bottom: none;
  }

  /* Nav links - минималистичный стиль */
  .offcanvas.show .offcanvas-body .navbar-nav .nav-link,
  .offcanvas.offcanvas-lg.show .offcanvas-body .navbar-nav .nav-link,
  .offcanvas-lg.show .offcanvas-body .navbar-nav .nav-link,
  .offcanvas.offcanvas-lg .offcanvas-body .navbar-nav .nav-link,
  .offcanvas-lg .offcanvas-body .navbar-nav .nav-link,
  .offcanvas-body .navbar-nav .nav-link,
  .offcanvas .navbar-nav .nav-link {
    padding: 1rem 1.25rem !important;
    display: flex !important;
    align-items: center !important;
    gap: 0.875rem !important;
    border-radius: 0 !important;
    transition: background-color 0.15s ease;
    color: rgb(var(--color-text)) !important;
    font-weight: 400;
    font-size: 0.9375rem;
    width: 100% !important;
    visibility: visible !important;
    opacity: 1 !important;
    text-decoration: none !important;
    height: auto !important;
    min-height: 0 !important;
    position: relative !important;
    background: transparent;
  }

  /* Минималистичный hover - тонкий фон */
  .offcanvas-body .navbar-nav .nav-link:hover,
  .offcanvas-body .navbar-nav .nav-link:focus,
  .offcanvas .navbar-nav .nav-link:hover,
  .offcanvas .navbar-nav .nav-link:focus {
    background: rgb(var(--grey-100)) !important;
    color: rgb(var(--color-text)) !important;
  }

  /* Иконки - минималистичный стиль */
  .offcanvas-body .navbar-nav .nav-link i,
  .offcanvas .navbar-nav .nav-link i {
    font-size: 1rem !important;
    width: 20px !important;
    text-align: center !important;
    flex-shrink: 0 !important;
    display: inline-block !important;
    visibility: visible !important;
    opacity: 0.6 !important;
    height: auto !important;
    position: relative !important;
    color: rgb(var(--color-text-subtle));
  }

  /* Lectures link - контейнер для иконок */
  .offcanvas-body .navbar-nav .lectures-link,
  .offcanvas .navbar-nav .lectures-link {
    position: relative !important;
  }

  /* Lectures link icons - в мобильном меню показываем только кассету */
  .offcanvas-body .navbar-nav .lectures-link .lectures-icon-cassette,
  .offcanvas .navbar-nav .lectures-link .lectures-icon-cassette {
    position: absolute !important;
    left: 1.25rem !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    opacity: 0.6 !important;
    visibility: visible !important;
    display: inline-block !important;
    width: 20px !important;
    flex-shrink: 0 !important;
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease !important;
    pointer-events: none !important;
  }

  .offcanvas-body .navbar-nav .lectures-link .lectures-icon-speaker,
  .offcanvas .navbar-nav .lectures-link .lectures-icon-speaker {
    position: absolute !important;
    left: 1.25rem !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    visibility: hidden !important;
    opacity: 0 !important;
    width: 20px !important;
    flex-shrink: 0 !important;
    display: inline-block !important;
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease !important;
    pointer-events: none !important;
  }

  /* Lectures link hover - заменяем кассету на динамик с анимацией */
  .offcanvas-body .navbar-nav .lectures-link:hover .lectures-icon-cassette,
  .offcanvas .navbar-nav .lectures-link:hover .lectures-icon-cassette {
    opacity: 0 !important;
    visibility: hidden !important;
  }

  .offcanvas-body .navbar-nav .lectures-link:hover .lectures-icon-speaker,
  .offcanvas .navbar-nav .lectures-link:hover .lectures-icon-speaker {
    visibility: visible !important;
    opacity: 0.6 !important;
    transform: translateY(-50%) scale(1) !important;
    animation: speaker-pulse-mobile 1.2s ease-in-out infinite !important;
  }

  /* Анимация для мобильного меню - включает translateY для позиционирования */
  @keyframes speaker-pulse-mobile {
    0%, 100% {
      transform: translateY(-50%) scale(1);
      filter: drop-shadow(0 0 2px rgba(var(--color-primary-active), 0.3));
    }
    25% {
      transform: translateY(-50%) scale(1.08);
      filter: drop-shadow(0 0 4px rgba(var(--color-primary-active), 0.5));
    }
    50% {
      transform: translateY(-50%) scale(1.05);
      filter: drop-shadow(0 0 6px rgba(var(--color-primary-active), 0.4));
    }
    75% {
      transform: translateY(-50%) scale(1.08);
      filter: drop-shadow(0 0 4px rgba(var(--color-primary-active), 0.5));
    }
  }

  /* Feedback link hover - анимация в мобильном меню */
  .offcanvas-body .navbar-nav .feedback-link:hover .feedback-icon,
  .offcanvas .navbar-nav .feedback-link:hover .feedback-icon {
    animation: feedback-bounce 1s ease-in-out infinite !important;
  }

  /* RonsOrg link hover - анимация в мобильном меню */
  .offcanvas-body .navbar-nav .ronsorg-link:hover .ronsorg-icon,
  .offcanvas .navbar-nav .ronsorg-link:hover .ronsorg-icon {
    animation: globe-spin 2s linear infinite !important;
  }

  /* Lectures link span - добавляем отступ для иконок */
  .offcanvas-body .navbar-nav .lectures-link span,
  .offcanvas .navbar-nav .lectures-link span {
    margin-left: 2.15rem !important;
    flex: 1 !important;
    display: inline !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    position: relative !important;
  }

  .offcanvas-body .navbar-nav .nav-link span,
  .offcanvas .navbar-nav .nav-link span {
    flex: 1 !important;
    display: inline !important;
    visibility: visible !important;
    opacity: 1 !important;
    height: auto !important;
    position: relative !important;
  }

  /* User menu item fix - убеждаемся что виден */
  .offcanvas-body .navbar-nav .nav-item:has(#user-menu),
  .offcanvas .navbar-nav .nav-item:has(#user-menu) {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .offcanvas-body .navbar-nav .nav-item .user-menu,
  .offcanvas .navbar-nav .nav-item .user-menu {
    width: 100% !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  .offcanvas-body .navbar-nav .nav-item .user-menu .nav-link,
  .offcanvas .navbar-nav .nav-item .user-menu .nav-link {
    padding: 1rem 1.25rem !important;
    margin: 0 !important;
    gap: 0.875rem !important;
  }

  /* Текст user-menu виден в мобильном меню */
  .offcanvas-body .navbar-nav .nav-item .user-menu .nav-link span,
  .offcanvas .navbar-nav .nav-item .user-menu .nav-link span {
    display: inline !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  /* Dropdown toggle in offcanvas */
  .offcanvas-body .navbar-nav .nav-item.dropdown .nav-link,
  .offcanvas .navbar-nav .nav-item.dropdown .nav-link {
    padding: 0.875rem 1rem !important;
  }
}