/* 
Theme Name: Storefront Child
Version: 1.0
Description: Storefront is the perfect theme for your next WooCommerce project. Designed and developed by WooCommerce Core developers, it features a bespoke integration with WooCommerce itself plus many of the most popular customer facing WooCommerce extensions. There are several layout & color options to personalise your shop, multiple widget regions, a responsive design and much more. Developers will love its lean and extensible codebase making it a joy to customize and extend. Looking for a WooCommerce theme? Look no further!
Template: storefront
*/


.home .site-header { margin-bottom: 0 !important; }
.elementor-widget-woolentor-product-tab .product-item .actions { display: none !important; }



@media (max-width: 921px) {

  .main-navigation .sub-menu { display: none; }

  /* ✅ 1단 메뉴 버튼 전체가 클릭 영역 + 정렬 수정 */
  .main-navigation.toggled ul > li > a {
    display: flex;
    align-items: center;
    justify-content: flex-start;      /* ← 더 이상 오른쪽으로 쭉 밀리지 않음 */
    position: relative;               /* 화살표를 a 태그 안쪽에 고정하기 위해 필요 */
    width: 100%;
    min-height: 48px;
    padding: 16px 20px !important;    /* 양쪽 균형 패딩 */
    box-sizing: border-box;
  }

  /* ✅ 화살표 위치 (오른쪽 끝에서 16px 안쪽으로 여유 있게) */
  .main-navigation.toggled li.menu-item-has-children > a::after {
    content: "▼";
    position: absolute;
    right: 16px;                     /* ← 화면에 짤리지 않도록 안쪽 */
    font-size: 0.85em;
    opacity: 0.5;
    pointer-events: none;
  }

  /* ✅ 하위 메뉴 노출 조건 (포커스/터치 시) */
  .main-navigation.toggled li.menu-item-has-children > a:focus + .sub-menu,
  .main-navigation.toggled li.menu-item-has-children:focus-within > .sub-menu {
    display: block;
  }

  /* ✅ 2단 메뉴 스타일 */
  .main-navigation.toggled .sub-menu > li > a {
    padding: 14px 30px !important;
    background: #fafafa;
    font-size: 0.95em;
    box-sizing: border-box;
  }

  /* ✅ 메뉴 전체 패널 스타일 (기존 유지) */
  .storefront-handheld-footer-bar,
  .main-navigation.toggled {
    position: fixed !important;
    top: 0;
    left: 0;
    width: 100vw !important;
    height: 92vh !important;
    background-color: #fff !important;
    z-index: 99999 !important;
    overflow-y: auto;
    border-top: 1px solid rgba(0, 0, 0, 0.05);
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
  }

  .menu-toggle {
    position: fixed !important;
    top: 15px !important;
    right: 15px !important;
    z-index: 100000 !important;
  }
}