/* ===== 全局响应式修复 ===== */
/* 配合 index.css 使用，修复各页面通用响应式问题 */

/* 平板设备 */
@media (max-width: 1024px) and (min-width: 769px) {
  .layui-col-md3 {
    width: 33.33%;
  }
}

/* 移动设备 */
@media (max-width: 768px) {
  body {
    padding-top: 0 !important;
  }

  header {
    position: relative !important;
    top: auto !important;
  }

  #desktopNav {
    display: none !important;
  }

  #mobileNav.active {
    display: block !important;
  }

  #mobileNav ul {
    flex-direction: column;
    width: 100%;
  }

  #mobileNav li {
    margin: 5px 0;
    width: 100%;
    text-align: center;
  }

  #mobileNav a {
    display: block;
    padding: 12px 16px;
    font-size: 1rem;
  }

  .mobile-menu-toggle {
    display: block !important;
  }

  .layui-col-md3 {
    width: 50% !important;
  }

  .layui-col-md6 {
    width: 100% !important;
  }

  .layui-col-md12 {
    width: 100% !important;
  }

  /* 响应式图片 */
  img {
    max-width: 100%;
    height: auto;
  }

  /* 修复表格和容器溢出 */
  table, pre, code {
    max-width: 100%;
    overflow-x: auto;
    word-wrap: break-word;
  }

  /* 修复 flex 布局溢出 */
  .layui-row, .flex-row {
    flex-wrap: wrap;
  }
}

/* 小屏手机 */
@media (max-width: 480px) {
  .layui-col-md3 {
    width: 100% !important;
  }

  .login-nickname {
    font-size: 10px !important;
    padding: 4px 8px !important;
  }

  .logo-text {
    font-size: 1rem !important;
  }
}

/* Course layout responsive */
@media (max-width: 900px) {
  body {
    overflow: auto !important;
    height: auto !important;
  }
  .course-layout {
    flex-direction: column;
    padding: 0 10px;
    height: auto;
  }
  .course-sidebar {
    width: 100%;
    position: static;
    max-height: none;
    margin-bottom: 16px;
  }
  .sidebar-list {
    max-height: none;
  }
  .course-main {
    padding: 0;
    height: auto;
  }
}

/* 触摸设备禁用悬停效果 */
@media (hover: none) {
  .feature-card:hover,
  .course-card:hover,
  .course-card-small:hover,
  .project-card:hover,
  .work-item:hover,
  .box-work-course:hover,
  .box-work-course2:hover {
    transform: none !important;
  }
}