/* HansCNC - iPad/tablet menu fix (Vertex) v4
   변경점(v4):
   - iPad 가로(landscape)에서 '데스크톱 가로 메뉴'와 '모바일 메뉴(드롭다운)'가 겹쳐 보이는 현상 해결
   - 원인: 테마에 따라 가로 메뉴 DOM이 #et-top-navigation 밖(또는 다른 nav 래퍼)에도 출력될 수 있어
          숨김 셀렉터를 더 넓게 적용

   적용 파일(업로드): /wp-content/themes/Vertex-child/assets/css/hanscnc-tablet-menu-fix.css
*/

@supports (-webkit-touch-callout: none) {
  @media (max-width: 1366px) {

    /* ==========================================================
       1) 데스크톱/가로형 메뉴 "전부" 숨김 (헤더 전체는 유지)
       ========================================================== */

    /* Vertex/Divi 표준 */
    #et-top-navigation nav,
    #et-top-navigation #top-menu-nav,
    #et-top-navigation ul#top-menu,
    #top-menu-nav,
    ul#top-menu,
    nav#top-menu-nav,
    nav#top-menu-nav + ul,
    #main-header #top-menu-nav,
    #main-header ul#top-menu,
    #main-header nav,
    header#main-header nav {
      display: none !important;
    }

    /* 일부 환경에서 고정헤더(.et-fixed)로 별도 렌더링될 때 대비 */
    .et-fixed-header #main-header nav,
    .et-fixed-header #top-menu-nav,
    .et-fixed-header ul#top-menu {
      display: none !important;
    }

    /* ==========================================================
       2) 모바일(햄버거) 메뉴 강제 노출
       ========================================================== */
    #et_mobile_nav_menu,
    #et-top-navigation #et_mobile_nav_menu {
      display: block !important;
      visibility: visible !important;
      opacity: 1 !important;
    }

    #et_mobile_nav_menu .mobile_menu_bar,
    #et-top-navigation #et_mobile_nav_menu .mobile_menu_bar {
      display: block !important;
      visibility: visible !important;
      opacity: 1 !important;
    }

    /* 모바일 메뉴 레이어가 가로모드에서 오른쪽으로 밀리거나 겹치는 경우 방지 */
    #et_mobile_nav_menu {
      float: right !important;
    }

    /* ==========================================================
       3) 모바일 메뉴 펼침 높이/스크롤 + 서브메뉴 항상 펼침
       ========================================================== */
    #et_mobile_nav_menu .et_mobile_menu,
    #et-top-navigation #et_mobile_nav_menu .et_mobile_menu {
      max-height: 70vh !important;
      overflow-y: auto !important;
      -webkit-overflow-scrolling: touch;
      position: absolute !important;   /* 가로모드에서 레이아웃 흔들림 방지 */
      right: 0 !important;
      left: auto !important;
      top: 100% !important;
      z-index: 9999 !important;
      min-width: 260px;
    }

    #et_mobile_nav_menu .et_mobile_menu .sub-menu,
    #et-top-navigation #et_mobile_nav_menu .et_mobile_menu .sub-menu {
      display: block !important;
      visibility: visible !important;
      opacity: 1 !important;
      height: auto !important;
      max-height: none !important;
      position: static !important;
      overflow: visible !important;
    }

    #et_mobile_nav_menu .et_mobile_menu .sub-menu a,
    #et-top-navigation #et_mobile_nav_menu .et_mobile_menu .sub-menu a {
      padding-left: 22px !important;
    }
  }
}
