/* === v3.4.28: 데스크탑 헤더에 "✕ 닫기" 누락 버튼 노출 fix ===
 * 원인: v3.4.3 에서 추가한 .dmbs-mobile-bottom-close 의 desktop 숨김 규칙이
 *      @media (max-width:1023px) 안의 중첩 @media (min-width:782px) 에 갇혀
 *      1024px+ 에선 매칭 안 됨 → WordPress responsive-container 가 데스크탑에서도
 *      DOM 에 살아있어서 인라인 버튼으로 노출됨.
 * 수정: 기본값 display:none 으로 두고, .is-menu-open 상태에서만 flex 로 보여주는
 *      기존 규칙(247~ line)에 맡김. 데스크탑/모바일 무관하게 한 번에 차단.
 */
.dmbs-mobile-bottom-close { display: none !important; }

/* === v3.4.9: 사이트 전체 가로 드래그/패닝 차단 ===
 * 모바일에서 헤더/푸터/후원박스 등을 손가락으로 좌우로 드래그하면 화면이 흘러가는 문제.
 * touch-action: pan-y → 세로 스크롤만 허용, 가로 패닝 차단.
 * overflow-x: clip → 가로 overflow 발생 시 잘라냄 (사용자 드래그 무관).
 * 라이트박스/이미지뷰어는 자체 핀치줌/팬 사용하므로 예외.
 */
html, body {
  overflow-x: clip !important;
  /* clip 미지원 브라우저 (구형) 폴백 */
  overflow-x: hidden;
}
@media (max-width: 1024px) {
  body {
    touch-action: pan-y !important;
  }
  /* WordPress 블록 테마의 주요 컨테이너에도 적용 */
  body > .wp-site-blocks,
  body > div.wp-site-blocks,
  header.wp-block-template-part,
  footer.wp-block-template-part,
  main {
    touch-action: pan-y !important;
    overflow-x: clip !important;
    overflow-x: hidden;
    max-width: 100vw !important;
    box-sizing: border-box !important;
  }
}
/* 라이트박스/이미지뷰어 영역은 가로 제스처 허용 — 핀치줌·팬 사용 */
.dmbs-lightbox,
.dmbs-lightbox *,
.dmbs-public-lightbox,
.dmbs-public-lightbox * {
  touch-action: auto !important;
}

/* === v3.1.158: PWA (홈 화면 앱) 모드에서 iOS 상태바 겹침 처리 ===
 * Safari 일반 모드에선 주소창이 있어 문제 없지만, PWA 로 설치하면 상태바(시간/배터리)
 * 영역이 콘텐츠 위에 덮이므로 헤더 상단에 safe-area-inset 만큼 padding 추가.
 * display-mode: standalone 은 홈 화면에서 앱처럼 실행된 경우만 true.
 */
@media (display-mode: standalone) {
  header.wp-block-template-part {
    padding-top: env(safe-area-inset-top, 0px) !important;
    box-sizing: content-box !important;
    background-color: #171822 !important;  /* 헤더 배경색 연장 — 상태바 영역 가리기 */
  }
  /* 임시 비번 배너도 safe-area 위로 밀어줌 */
  #dmbs-temp-pwd-banner {
    padding-top: calc(10px + env(safe-area-inset-top, 0px)) !important;
  }
}

/* === v3.1.133: 데스크탑 헤더 nowrap 강제 ===
 * v3.1.123 에서 NAV 에 "오늘도숲" + YouTube 아이콘 추가하면서
 * 데스크탑 일부 viewport (1366 등) 에서 헤더 wrap 발생.
 * 항목 padding/gap 줄여서 한 줄에 fit.
 */
@media (min-width: 1024px) {
  header .wp-block-group.is-content-justification-space-between {
    flex-wrap: nowrap !important;
    column-gap: 16px !important;
  }
  header .wp-block-navigation,
  header .wp-block-navigation__container {
    flex-wrap: nowrap !important;
    column-gap: 14px !important;
    row-gap: 0 !important;
  }
  header .wp-block-navigation .wp-block-navigation-item__content {
    padding: 4px 6px !important;
    white-space: nowrap !important;
  }
  /* v3.1.134: 데스크탑 헤더에선 social-links (instagram/youtube) 숨김
   * 모바일 햄버거 메뉴 (@media max-width: 1023px) 에선 그대로 표시됨
   * v3.1.138: social-links 를 감싼 빈 li 까지 제거해야 2번째 줄 밀림 방지 */
  header .wp-block-social-links {
    display: none !important;
  }
  header .wp-block-navigation__container > li:has(.wp-block-social-links) {
    display: none !important;
  }
  /* v3.1.144: 데스크탑 NAV 의 "오늘도숲" 항목 숨김 (좌측 mint pill 과 중복)
   * JS 측에서 라벨 텍스트 기반으로 2차 처리. */
  header .wp-block-navigation__container > li:has(a[href*="오늘도숲"]),
  header .wp-block-navigation__container > li:has(a[href*="%EC%98%A4%EB%8A%98%EB%8F%84%EC%88%B2"]) {
    display: none !important;
  }

  /* v3.1.135: 메인페이지 YouTube 세로 영상은 모바일 전용 → 데스크탑에서 숨김
   * Elementor YouTube widget (data-id="eeea238") */
  [data-id="eeea238"] {
    display: none !important;
  }
  /* auth widget (도마뱀숲 님 + 로그아웃) — 줄어들지 않게 */
  #dmbsAuthWidget,
  .dmbs-auth-widget {
    flex-shrink: 0 !important;
    white-space: nowrap !important;
  }
  #dmbsAuthWidget .dmbs-auth-name,
  .dmbs-auth-widget .dmbs-auth-name {
    white-space: nowrap !important;
  }
}

/* === Site-wide auth widget === */
.dmbs-auth-widget {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-left: 10px;
}
/* Logged-in greeting text: WHITE on the dark header */
.dmbs-auth-widget .dmbs-auth-name {
  font-size: 14px;
  color: #ffffff;
  font-weight: 600;
  margin-right: 2px;
  line-height: 1.1;
}
.dmbs-auth-widget .dmbs-auth-role {
  background: #3d5c3a;
  color: #fff;
  border-radius: 999px;
  padding: 3px 10px;
  font-size: 11px;
  font-weight: 700;
  margin-left: 2px;
  letter-spacing: 0.02em;
}
/* All auth buttons: same size as site 분양문의/오늘도숲 buttons (filled mint pill) */
.dmbs-auth-btn {
  background: #c8e85c;
  border: 1px solid #c8e85c;
  color: #1a2a1a;
  border-radius: 999px;
  padding: 11px 26px;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  letter-spacing: 0.01em;
  line-height: 1.1;
  font-family: inherit;
  transition: background .15s, color .15s, border-color .15s, transform .08s;
}
.dmbs-auth-btn:hover {
  background: #b5d04a;
  border-color: #b5d04a;
  color: #000;
}
.dmbs-auth-btn:active { transform: translateY(1px); }

/* Login tab styled same as signup — both mint */
.dmbs-auth-btn.dmbs-auth-signup {
  background: #c8e85c;
  border-color: #c8e85c;
  color: #1a2a1a;
}
.dmbs-auth-btn.dmbs-auth-signup:hover {
  background: #b5d04a;
  border-color: #b5d04a;
}

/* Logout = same size/pill as the others, neutral color for less emphasis */
.dmbs-auth-btn.dmbs-auth-logout {
  background: #f5f2ec;
  border-color: #d4cfc0;
  color: #333;
  font-weight: 700;
  padding: 11px 26px;
  font-size: 15px;
}
.dmbs-auth-btn.dmbs-auth-logout:hover {
  background: #e4dfd3;
  border-color: #bbb;
  color: #111;
}

/* === Mobile widget (inside hamburger menu) === */
.dmbs-auth-mobile {
  display: none; /* only shown on mobile via media query below */
  flex-direction: column;
  align-items: center;
  gap: 14px;
  margin-top: 28px;
  padding: 24px 20px 12px;
  border-top: 1px solid rgba(255,255,255,0.15);
  width: 100%;
  box-sizing: border-box;
}
.dmbs-auth-mobile .dmbs-auth-btn,
.dmbs-auth-mobile .dmbs-auth-btn.dmbs-auth-logout {
  width: min(260px, 80vw);
  padding: 14px 20px;
  font-size: 16px;
  text-align: center;
}
.dmbs-auth-mobile .dmbs-auth-name {
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  margin: 0 0 4px;
  text-align: center;
}
.dmbs-auth-mobile .dmbs-auth-role {
  background: #3d5c3a;
  color: #fff;
  border-radius: 999px;
  padding: 3px 10px;
  font-size: 11px;
  font-weight: 700;
  margin-left: 6px;
}

/* v3.1.121: Progressive compacting for intermediate widths (logged-in state) */
/* 1200px 이하: 이름 텍스트 숨김 — 관리자 뱃지 + 로그아웃은 유지 */
@media (max-width: 1199.98px) and (min-width: 600px) {
  .dmbs-auth-widget .dmbs-auth-name { display: none; }
  .dmbs-auth-widget { gap: 6px; margin-left: 6px; }
}
/* 900px 이하: 관리자 뱃지도 숨기고 로그아웃 버튼 컴팩트 */
@media (max-width: 899.98px) and (min-width: 600px) {
  .dmbs-auth-widget .dmbs-auth-role { display: none; }
  .dmbs-auth-widget .dmbs-auth-btn.dmbs-auth-logout {
    padding: 8px 14px;
    font-size: 13px;
  }
}

/* WP nav breakpoint is 600px — match that to decide desktop vs hamburger menu */
@media (max-width: 599.98px) {
  /* Hide the header (top-right) widget on mobile — moves to hamburger instead */
  #dmbsAuthWidget { display: none !important; }
  /* Show the mobile widget inside the hamburger menu */
  .wp-block-navigation__responsive-container.is-menu-open .dmbs-auth-mobile {
    display: flex !important;
  }
}

/* ============================================================
 * v3.1.122: 모바일 햄버거 메뉴 전체 디자인 리뉴얼 (사용자 목업 반영)
 * 섹션별 배경색으로 구분 — 다크그린/민트/라임/회색
 * (is-menu-open 클래스는 모바일에서만 붙으므로 미디어쿼리 범위를 넉넉히)
 * ============================================================ */
@media (max-width: 1023px) {
  /* 메뉴 오버레이 전체 — 연한 회색 배경 */
  .wp-block-navigation__responsive-container.is-menu-open {
    background: #e8e6de !important;
    padding: 0 !important;
  }

  /* dialog/close/content: 테마의 max-width:320/width 제한 해제 + padding 제거 */
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close,
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog,
  /* v3.4.6: 메뉴 컨테이너 가로 드래그 차단 + viewport 폭으로 강제 */
  /* padding 사용 X — position:absolute 의 top 기준점이 padding edge 라서 위 공간 낭비 발생함. */
  /* 대신 auth-mobile 위젯에 margin-top 으로 X 아래 공간 확보. */
  .wp-block-navigation__responsive-container.is-menu-open {
    width: 100vw !important;
    max-width: 100vw !important;
    overflow-x: hidden !important;
    touch-action: pan-y !important;
    position: fixed !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
    padding: 0 !important;
    max-width: 100vw !important;
    width: 100vw !important;
    overflow-x: hidden !important;
    touch-action: pan-y !important;
    box-sizing: border-box !important;
  }

  /* v3.4.5: 닫기(X) 버튼 — viewport 기준 절대 좌표로 정중앙 강제 */
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close {
    /* viewport 의 정확한 가로 중앙. 콘텐츠 폭 무관. */
    position: absolute !important;
    top: calc(env(safe-area-inset-top, 0px) + 16px) !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    margin: 0 !important;
    /* 콘텐츠 위에 표시 */
    z-index: 10 !important;
    /* 56x56 큰 탭 타겟 */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 56px !important;
    height: 56px !important;
    padding: 0 !important;
    background: transparent !important;
    border: none !important;
    border-radius: 50% !important;
    box-sizing: border-box !important;
  }
  /* 누를 때 시각 피드백 */
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close:active {
    background: rgba(93, 186, 160, 0.15) !important;
  }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-close svg {
    fill: #5dbaa0 !important;
    width: 32px !important;
    height: 32px !important;
    display: block !important;
    margin: 0 !important;
  }

  /* v3.4.3: 메뉴 하단 보조 닫기 버튼 — 엄지 도달 영역 (iOS 한손조작) */
  .wp-block-navigation__responsive-container.is-menu-open .dmbs-mobile-bottom-close {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    align-self: center !important;
    flex: 0 0 auto !important;
    margin: 24px auto calc(env(safe-area-inset-bottom, 0px) + 24px) !important;
    padding: 16px 32px !important;
    min-width: 200px !important;
    min-height: 56px !important;
    background: #5dbaa0 !important;
    color: #fff !important;
    border: none !important;
    border-radius: 999px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    font-family: inherit !important;
    cursor: pointer !important;
    box-shadow: 0 4px 12px rgba(93, 186, 160, 0.3) !important;
    transition: transform 0.12s, box-shadow 0.12s !important;
    -webkit-tap-highlight-color: transparent !important;
    box-sizing: border-box !important;
  }
  .wp-block-navigation__responsive-container.is-menu-open .dmbs-mobile-bottom-close:active {
    transform: translateY(1px) !important;
    box-shadow: 0 2px 6px rgba(93, 186, 160, 0.3) !important;
    background: #4a9d85 !important;
  }
  /* 데스크탑에선 숨김 (모바일 메뉴는 모바일에서만) */
  @media (min-width: 782px) {
    .dmbs-mobile-bottom-close { display: none !important; }
  }

  /* 로그인/회원가입 위젯을 상단으로 (auth.js에서 insertBefore로 이미 이동) */
  /* v3.4.6: 컨테이너 padding 제거되어 widget 자체에 상단 여유 추가 (X 버튼 자리 확보) */
  /* X 위치: top = safe-area + 16, 높이 56 → 끝점 = safe-area + 72.
     widget margin-top = safe-area + 88 (16px 여유) */
  .wp-block-navigation__responsive-container.is-menu-open .dmbs-auth-mobile {
    background: transparent !important;
    border: none !important;
    margin: calc(env(safe-area-inset-top, 0px) + 88px) 0 0 0 !important;
    padding: 8px 16px 16px !important;
    display: flex !important;
    flex-direction: row !important;
    /* v3.4.5: 좁은 화면에선 줄바꿈 (영어/일본어로 길어질 때 viewport 초과 방지) */
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 8px !important;
    order: 0 !important;
    box-sizing: border-box !important;
    /* viewport 보다 절대 넓어지지 않도록 */
    width: 100% !important;
    max-width: 100vw !important;
  }
  .wp-block-navigation__responsive-container.is-menu-open .dmbs-auth-mobile .dmbs-auth-btn {
    background: #5dbaa0 !important;
    border: none !important;
    color: #ffffff !important;
    padding: 8px 22px !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    border-radius: 999px !important;
    width: auto !important;
    min-width: 0 !important;
  }
  .wp-block-navigation__responsive-container.is-menu-open .dmbs-auth-mobile .dmbs-auth-btn.dmbs-auth-logout {
    background: #888 !important;
    color: #fff !important;
  }
  .wp-block-navigation__responsive-container.is-menu-open .dmbs-auth-mobile .dmbs-auth-name,
  .wp-block-navigation__responsive-container.is-menu-open .dmbs-auth-mobile .dmbs-auth-role {
    color: #2d3b36 !important;
    text-align: center !important;
  }

  /* 메인 UL: block 레이아웃, 풀 너비, 여백 제거 */
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
    display: block !important;
    padding: 0 !important;
    margin: 0 !important;
    gap: 0 !important;
    list-style: none !important;
    max-width: none !important;
    width: 100% !important;
  }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > li {
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
    background: none !important;
    display: block !important;
  }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > li > .wp-block-navigation-item__content,
  .wp-block-navigation__responsive-container.is-menu-open .dmbs-submenu li a {
    /* 테마의 max-width:240px 해제 — 풀 너비로 확장 */
    max-width: none !important;
    min-width: 0 !important;
    width: 100% !important;
  }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > li > .wp-block-navigation-item__content {
    padding: 18px 28px !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    display: block !important;
    text-align: left !important;
    box-sizing: border-box !important;
    text-decoration: none !important;
    border-radius: 0 !important;
    color: #fff !important;
  }

  /* === Section 1: About US (1번째) — 다크 그린 === */
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > li:nth-child(1) > .wp-block-navigation-item__content {
    background: #2d3b36 !important;
    color: #ffffff !important;
  }

  /* === Section 2: 도마뱀정보 (2번째) — 민트 + ▼ === */
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > li:nth-child(2) > .wp-block-navigation-item__content {
    background: #5dbaa0 !important;
    color: #ffffff !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
  }

  /* === v3.1.123: 오늘도숲 (끝에서 3번째 = Shop과 social 앞) — 민트 === */
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > li:nth-last-child(3) > .wp-block-navigation-item__content {
    background: #5dbaa0 !important;
    color: #ffffff !important;
  }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > li:nth-child(2) .dmbs-caret {
    color: #c8e85c !important;
    font-size: 14px !important;
    margin-left: auto !important;
    transition: transform 0.3s !important;
    display: inline-block !important;
  }
  .wp-block-navigation__responsive-container.is-menu-open .dmbs-caret.open {
    transform: rotate(180deg) !important;
  }

  /* === Section 3: 서브메뉴 (종 목록) — 다크 그린 ===
   * v3.1.123: 아코디언 포기, 항상 펼친 상태 (사용자 요청) */
  .wp-block-navigation__responsive-container.is-menu-open .dmbs-submenu {
    background: #2d3b36 !important;
    padding: 6px 0 !important;
    margin: 0 !important;
    list-style: none !important;
    display: block !important;
  }
  /* 도마뱀정보 ▼ 아이콘 숨김 (드롭다운 아니므로 불필요) */
  .wp-block-navigation__responsive-container.is-menu-open .dmbs-caret {
    display: none !important;
  }
  .wp-block-navigation__responsive-container.is-menu-open .dmbs-submenu li {
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
    display: block !important;
  }
  .wp-block-navigation__responsive-container.is-menu-open .dmbs-submenu li a {
    display: block !important;
    padding: 10px 44px !important;
    color: #ffffff !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    text-align: left !important;
    border-radius: 0 !important;
    border: none !important;
    background: transparent !important;
    justify-content: flex-start !important;
    max-width: none !important;
    width: 100% !important;
    box-sizing: border-box !important;
    text-decoration: none !important;
    background: none !important;
  }

  /* === Section 4: Shop (끝에서 2번째 = social links 바로 앞) — 라임 === */
  /* v3.1.123: 오늘도숲 추가로 순서 밀림 → nth-last-child(2)로 변경 */
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > li:nth-last-child(2) > .wp-block-navigation-item__content {
    background: #c8e85c !important;
    color: #1a2a1a !important;
    font-weight: 800 !important;
  }

  /* === Section 5: SNS 아이콘 (맨 뒤 li) — 메뉴 하단 sticky 고정 ===
   * v3.1.124: 메뉴가 viewport보다 길면 SNS 아이콘이 화면 밖으로 밀려서 안 보이는 문제 해결.
   * position: sticky + bottom: 0 으로 메뉴 컨테이너 하단에 항상 노출. */
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > li:last-child {
    background: #e8e6de !important;       /* 컨테이너 배경(베이지)과 동일 */
    padding: 20px 0 !important;
    text-align: center !important;
    position: sticky !important;
    bottom: 0 !important;
    z-index: 10 !important;
    border-top: 1px solid rgba(45, 59, 54, 0.12) !important;  /* 메뉴 콘텐츠와 시각적 구분 */
  }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container > li:last-child > .wp-block-navigation-item__content {
    display: none !important;
  }
  /* v3.1.126: 정렬 강제 — ul/li/a 모두 flex center, line-height 0 으로 잔여 baseline 영향 제거 */
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-social-links {
    justify-content: center !important;
    align-items: center !important;
    gap: 24px !important;
    display: flex !important;
    flex-direction: row !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    line-height: 0 !important;
  }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-social-link {
    background: transparent !important;
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    min-height: 32px !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 0 !important;
    vertical-align: middle !important;
    flex: 0 0 32px !important;
  }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-social-link a {
    display: flex !important;
    width: 32px !important;
    height: 32px !important;
    padding: 0 !important;
    margin: 0 !important;
    align-items: center !important;
    justify-content: center !important;
    color: #2d3b36 !important;
    line-height: 0 !important;
    box-sizing: border-box !important;
  }
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-social-link svg {
    fill: #2d3b36 !important;
    color: #2d3b36 !important;
    width: 28px !important;
    height: 28px !important;
    min-width: 28px !important;
    min-height: 28px !important;
    max-width: 28px !important;
    max-height: 28px !important;
    display: block !important;
    vertical-align: middle !important;
    flex-shrink: 0 !important;
  }
  /* v3.1.125: iOS Safari에서 path에도 명시적 fill 강제 (인스타그램이 path별 fill 우선시 가능) */
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-social-link svg path {
    fill: #2d3b36 !important;
    stroke: none !important;
  }
  /* v3.1.126: screen-reader-text 라벨이 flex item으로 잡혀 정렬 깨는 것 방지 */
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-social-link .wp-block-social-link-label,
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-social-link .screen-reader-text {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    border: 0 !important;
    padding: 0 !important;
    margin: -1px !important;
    white-space: nowrap !important;
  }

  /* v3.1.122: 오늘도숲 소제목 (description) 스타일링 */
  .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__description {
    display: inline-block !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    opacity: 0.85 !important;
    margin-left: 8px !important;
    vertical-align: middle !important;
  }
}
@media (min-width: 600px) {
  /* On desktop the mobile widget is never visible (container is rendered inline) */
  .dmbs-auth-mobile { display: none !important; }
}

/* === Modal === */
.dmbs-auth-modal {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: flex;
  align-items: center;
  justify-content: center;
}
.dmbs-auth-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.45);
  backdrop-filter: blur(2px);
}
.dmbs-auth-dialog {
  position: relative;
  background: #fff;
  border-radius: 14px;
  width: min(420px, 92vw);
  padding: 24px 28px 20px;
  box-shadow: 0 20px 60px rgba(0,0,0,0.3);
  font-family: 'Malgun Gothic', -apple-system, sans-serif;
  color: #222;
}
.dmbs-auth-close {
  position: absolute;
  top: 10px;
  right: 12px;
  background: transparent;
  border: none;
  font-size: 26px;
  color: #888;
  cursor: pointer;
  line-height: 1;
}
.dmbs-auth-close:hover { color: #222; }
.dmbs-auth-tabs {
  display: flex;
  gap: 8px;
  margin-bottom: 18px;
  border-bottom: 1px solid #eee;
}
.dmbs-auth-tabs button {
  flex: 1;
  background: transparent;
  border: none;
  padding: 10px 8px;
  font-size: 14px;
  font-weight: 600;
  color: #888;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  margin-bottom: -1px;
}
.dmbs-auth-tabs button.active {
  color: #3d5c3a;
  border-bottom-color: #3d5c3a;
}
.dmbs-auth-body h3 {
  margin: 0 0 8px;
  font-size: 20px;
  color: #2d2a24;
}
.dmbs-auth-lead {
  color: #666;
  font-size: 13px;
  line-height: 1.5;
  margin: 0 0 16px;
}
.dmbs-auth-body form label {
  display: block;
  margin-bottom: 12px;
  font-size: 12px;
  color: #555;
  font-weight: 600;
}
.dmbs-auth-body form input {
  display: block;
  width: 100%;
  padding: 10px 12px;
  font-size: 14px;
  border: 1px solid #d0cdc6;
  border-radius: 8px;
  margin-top: 4px;
  font-family: inherit;
  box-sizing: border-box;
}
.dmbs-auth-body form input:focus {
  outline: none;
  border-color: #3d5c3a;
  box-shadow: 0 0 0 2px rgba(61,92,58,.15);
}
.dmbs-auth-submit {
  width: 100%;
  background: #3d5c3a;
  color: #fff;
  border: none;
  border-radius: 8px;
  padding: 12px;
  font-size: 15px;
  font-weight: 700;
  cursor: pointer;
  margin-top: 4px;
}
.dmbs-auth-submit:hover { background: #2f4a2d; }
.dmbs-auth-submit:disabled { background: #aaa; cursor: wait; }
.dmbs-auth-msg {
  margin-top: 14px;
  padding: 10px 12px;
  border-radius: 8px;
  font-size: 13px;
  line-height: 1.5;
  display: none;
}
.dmbs-auth-msg.success { display:block; background:#edf7e8; color:#2f5a1f; border:1px solid #c8e85c; }
.dmbs-auth-msg.error { display:block; background:#fde8e8; color:#8a1f1f; border:1px solid #e8b5b5; }
.dmbs-auth-alt {
  margin: 14px 0 0;
  text-align: center;
  font-size: 12px;
  color: #888;
}
.dmbs-auth-alt a {
  color: #3d5c3a;
  font-weight: 600;
  text-decoration: none;
}
.dmbs-auth-alt a:hover { text-decoration: underline; }

/* === Toast for verify status === */
.dmbs-auth-toast {
  position: fixed;
  top: 140px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 100001;
  background: #3d5c3a;
  color: #fff;
  padding: 12px 20px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  box-shadow: 0 6px 20px rgba(0,0,0,0.2);
  font-family: 'Malgun Gothic', -apple-system, sans-serif;
  transition: opacity .4s, transform .4s;
}
.dmbs-auth-toast.error { background: #a8324e; }
.dmbs-auth-toast.hide { opacity: 0; transform: translate(-50%, -20px); }

/* ============================================================
 * v3.1.121: About US 페이지 (Elementor) 상단 정렬 수정
 * 본문 H2가 사이드바 Categories 박스 상단과 일치하도록
 * - wp-block-post-content 기본 margin-top 32px 제거
 * - Elementor e-con-inner 기본 padding-top 10px 제거
 * - 첫 H2 기본 브라우저 margin-top 26.56px 제거
 * (main.wp-block-group padding-top:16px는 사이드바와 매칭되므로 유지)
 * ============================================================ */
.dbs-about-wrapper main .wp-block-post-content {
  margin-top: 0 !important;
}
.dbs-about-wrapper main .elementor .e-con-inner {
  padding-top: 0 !important;
}
.dbs-about-wrapper main .elementor h2:first-of-type,
.dbs-about-wrapper main .elementor-widget-heading:first-child h2 {
  margin-top: 0 !important;
}

/* ============================================================
 * v3.1.121: About US 페이지 배너 반응형 처리
 * 원본 aboutbanner2.jpg (2542×205, 12.4:1)이 모바일에서 너무 얇아짐
 * → 1023px 이하에서 aboutbanner-mobile.jpg (3:1 비율)로 교체
 * 또한 margin-top 93px가 로그아웃 상태 모바일에서 빈 공간 만들어서 제거
 * ============================================================ */
/* 태블릿 이하: 모바일 배너로 교체
 * (wp-site-blocks padding 등 레이아웃은 테마 기본 동작에 맡김
 *  — 실제 모바일 디바이스별로 정확한 값이 달라서 억지로 덮어쓰면
 *  오히려 큰 여백이 생김) */
@media (max-width: 1023px) {
  .dbs-about-banner {
    background-image: url('https://domabemsoop.com/wp-content/uploads/2026/04/aboutbanner-mobile.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    width: 100%;
    height: 180px;
  }
  .dbs-about-banner img {
    display: none !important;
  }
}
/* 모바일 (<600px): 배너 높이 축소 + 헤더와 배너 사이 여백을 헤더 색으로 */
@media (max-width: 599px) {
  .dbs-about-banner {
    height: 140px !important;
    position: relative !important;
  }
  /* 배너 바로 위 영역(헤더~배너 사이 흰 여백)을 헤더 배경색으로 덮기
   * → 헤더 연장선처럼 보여서 흰 여백 시각적으로 사라짐 */
  .dbs-about-banner::before {
    content: '';
    position: absolute;
    bottom: 100%;
    left: 0;
    right: 0;
    height: 300px;
    background-color: #171822;
    pointer-events: none;
  }
}