/* Trinity Global UI — mobile drawer + PC quick menu */
:root {
  --tg-green: #3e522d;
  --tg-green-dark: #2d3b1a;
  --tg-naver: #03c75a;
  --tg-kakao: #fee500;
  --tg-text: #1a1f16;
  --tg-muted: #6b7264;
  --tg-border: #e9e4db;
  --tg-bg: #ffffff;
  --tg-drawer-w: min(100%, 20rem);
}

/* Hide legacy UI when global UI is active */
body[data-tg-ui] #quick-menu,
body[data-tg-ui] #quick-menu-mobile,
body[data-tg-ui] .pc-quick-menu,
body[data-tg-ui] .mob-quick-menu,
body[data-tg-ui] #mobile-nav-panel,
body[data-tg-ui] #mobile-nav-backdrop,
body[data-tg-ui] #mobile-menu,
body[data-tg-ui] #mobile-menu-backdrop,
body[data-tg-ui] .member-wrapper > div:has(.lang-btn),
body[data-tg-ui] .member-wrapper > div:has(a[href*="trinityclinic.info"]),
body[data-tg-ui] header a[href*="pf.kakao.com"],
body[data-tg-ui] .naver-cnv-kakao,
body[data-tg-ui] div.fixed:has(.floating-item),
body[data-tg-ui] div.fixed:has(a[href*="talk.naver.com"]),
body[data-tg-ui] .lg\:hidden.fixed.bottom-0.left-0:not(.tg-mobile-bar),
body[data-tg-ui] .hidden.lg\:flex.fixed.bottom-10.right-10:not(.tg-pc-quick),
body[data-tg-ui] .tg-legacy-quick {
  display: none !important;
}

/* landing-2: React 자체 퀵메뉴 숨기고 통합 퀵버튼만 사용 (드로어 햄버거는 유지) */
body[data-tg-ui][data-tg-bar-only] div.fixed:has(a[href*="talk.naver.com"]),
body[data-tg-ui][data-tg-bar-only] div.fixed.bottom-10.right-10:not(.tg-pc-quick),
body[data-tg-ui][data-tg-bar-only] div.fixed.bottom-0.left-0.w-full:not(.tg-mobile-bar),
body[data-tg-ui][data-tg-bar-only] a[href*="talk.naver.com"] {
  display: none !important;
}

/* 트리니티 common.js가 주입하는 모바일 메뉴 버튼 — global-ui 햄버거와 중복 방지 */
body[data-tg-ui] .mobile-menu-btn {
  display: none !important;
}
body[data-tg-ui] .menu-wrapper.active {
  display: none !important;
}
body[data-tg-ui].menu-open {
  overflow: auto !important;
}

body[data-tg-ui] .tg-pc-quick a[href*="pf.kakao.com"] {
  display: flex !important;
}
body[data-tg-ui] .tg-mobile-bar a[href*="pf.kakao.com"] {
  display: flex !important;
}

body[data-tg-ui] #tg-mobile-drawer .tg-drawer-kakao,
body[data-tg-ui] #tg-mobile-drawer a.tg-drawer__lang--kakao {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}

body[data-tg-ui]:not([data-tg-native-menu]):not([data-react-mobile-menu]) #mobile-menu-btn,
body[data-tg-ui]:not([data-tg-native-menu]):not([data-react-mobile-menu]) .site-menu-btn {
  display: none !important;
}

/* React 헤더 버튼 — global-ui wire 실패 시에도 항상 표시 */
body[data-tg-ui][data-react-mobile-menu] #mobile-menu-btn,
body[data-tg-ui][data-react-mobile-menu] .site-menu-btn {
  display: flex !important;
}

body[data-tg-ui][data-react-mobile-menu] .tg-hamburger {
  display: none !important;
}

/* 네이티브 헤더 버튼을 쓰는 페이지는 고정 햄버거 숨김 */
body[data-tg-ui][data-tg-native-menu] .tg-hamburger {
  display: none !important;
}

/* Hamburger trigger (헤더에 버튼 없는 페이지용) */
.tg-hamburger {
  display: none;
  position: fixed;
  top: 14px;
  right: 14px;
  z-index: 280;
  width: 42px;
  height: 42px;
  border: 1px solid var(--tg-border);
  border-radius: 9999px;
  background: rgba(255, 255, 255, 0.96);
  color: var(--tg-text);
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
  transition: border-color 0.2s, transform 0.2s;
}
.tg-hamburger:hover { border-color: var(--tg-green); }
.tg-hamburger svg { width: 20px; height: 20px; }

@media (max-width: 1279px) {
  body[data-tg-ui]:not([data-tg-native-menu]) .tg-hamburger { display: flex; }
}

/* Mobile bottom action bar */
.tg-mobile-bar {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 10001;
  grid-template-columns: repeat(4, 1fr);
  height: 60px;
  background: #fff;
  border-top: 1px solid var(--tg-border);
  box-shadow: 0 -5px 20px rgba(0, 0, 0, 0.05);
  padding-bottom: env(safe-area-inset-bottom, 0);
  font-family: "Pretendard", "Noto Sans KR", -apple-system, BlinkMacSystemFont, sans-serif;
}
@media (max-width: 1023px) {
  body[data-tg-ui] .tg-mobile-bar { display: grid; }
  body[data-tg-ui] { padding-bottom: calc(60px + env(safe-area-inset-bottom, 0)); }
}
.tg-mobile-bar a {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  text-decoration: none;
  font-size: 10px;
  font-weight: 700;
  color: var(--tg-text);
  border-right: 1px solid rgba(233, 228, 219, 0.5);
}
.tg-mobile-bar a:last-child { border-right: none; }
.tg-mobile-bar a:active { background: #f9f9f9; }
.tg-mobile-bar a.tg-mbar-phone {
  background: var(--tg-green);
  color: #fff;
}
.tg-mobile-bar a.tg-mbar-phone:active { background: var(--tg-green-dark); }
.tg-mobile-bar__icon {
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.tg-mobile-bar__naver {
  font-size: 18px;
  font-weight: 900;
  color: var(--tg-naver);
  line-height: 1;
}
.tg-mobile-bar__kakao {
  width: 20px;
  height: 20px;
  border-radius: 9999px;
  background: var(--tg-kakao);
  color: #3c1e1e;
  display: flex;
  align-items: center;
  justify-content: center;
}
.tg-mobile-bar__kakao svg {
  width: 14px;
  height: 14px;
}

.tg-drawer-overlay {
  position: fixed;
  inset: 0;
  z-index: 1090;
  background: rgba(0, 0, 0, 0.4);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s ease, visibility 0.25s;
}
.tg-drawer-overlay.is-open {
  opacity: 1;
  visibility: visible;
}

.tg-drawer {
  position: fixed;
  top: 0;
  right: 0;
  z-index: 1100;
  width: var(--tg-drawer-w);
  height: 100%;
  background: var(--tg-bg);
  box-shadow: -8px 0 24px rgba(0, 0, 0, 0.08);
  transform: translateX(100%);
  transition: transform 0.3s cubic-bezier(0.25, 1, 0.5, 1);
  display: flex;
  flex-direction: column;
  font-family: "Pretendard", "Noto Sans KR", -apple-system, BlinkMacSystemFont, sans-serif;
}
.tg-drawer.is-open { transform: translateX(0); }

.tg-drawer__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px;
  border-bottom: 1px solid #eee;
}
.tg-drawer__logo {
  height: 20px;
  max-width: 100px;
  width: auto;
  object-fit: contain;
}
.tg-drawer__close {
  width: 36px;
  height: 36px;
  border: none;
  background: transparent;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
}
.tg-drawer__close:hover { background: #f5f5f5; }

.tg-drawer__body {
  flex: 1;
  display: flex;
  overflow: hidden;
}

.tg-drawer__cats {
  width: 42%;
  background: #fafafa;
  border-right: 1px solid #eee;
  overflow-y: auto;
}
.tg-drawer__cat {
  display: block;
  width: 100%;
  padding: 14px 12px;
  border: none;
  border-bottom: 1px solid #eee;
  background: transparent;
  text-align: left;
  font-size: 13px;
  font-weight: 700;
  color: var(--tg-muted);
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}
.tg-drawer__cat.is-active {
  background: #fff;
  color: var(--tg-green);
  border-right: 2px solid var(--tg-green);
}

.tg-drawer__links {
  flex: 1;
  overflow-y: auto;
  padding: 8px 0;
}
.tg-drawer__group {
  margin-bottom: 4px;
}
.tg-drawer__group-label {
  margin: 0;
  padding: 10px 16px 4px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #a1a89a;
}
.tg-drawer__group + .tg-drawer__group {
  margin-top: 4px;
  border-top: 1px solid #f1eee7;
}
.tg-drawer__links a {
  display: block;
  padding: 11px 16px;
  font-size: 14px;
  color: var(--tg-text);
  text-decoration: none;
  transition: background 0.15s, color 0.15s;
}
.tg-drawer__links a:hover {
  background: #f1f4ed;
  color: var(--tg-green);
}

.tg-drawer__langs {
  display: flex;
  gap: 8px;
  justify-content: center;
  flex-wrap: wrap;
}
.tg-drawer__lang {
  width: 36px;
  height: 36px;
  border-radius: 9999px;
  border: 1px solid var(--tg-border);
  overflow: hidden;
  opacity: 0.85;
  transition: opacity 0.2s, border-color 0.2s;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.tg-drawer__lang:hover { opacity: 1; border-color: var(--tg-green); }
.tg-drawer__lang img { width: 100%; height: 100%; object-fit: cover; }

.tg-drawer__lang--kakao {
  background: var(--tg-kakao);
  border-color: #e6d200;
  color: #3c1e1e;
}
.tg-drawer__lang--kakao svg {
  width: 18px;
  height: 18px;
}

.tg-drawer__foot {
  border-top: 1px solid #eee;
  padding: 14px 16px;
}

/* PC Quick Menu */
.tg-pc-quick {
  display: none;
  position: fixed;
  bottom: 40px;
  right: 40px;
  z-index: 10001;
  flex-direction: column;
  gap: 12px;
  font-family: "Pretendard", "Noto Sans KR", -apple-system, BlinkMacSystemFont, sans-serif;
}
@media (min-width: 1280px) {
  body[data-tg-ui] .tg-pc-quick { display: flex; }
}

/* PC 다국어 스위처 — 기본 1아이콘, 클릭 시 국기 펼침 */
.tg-pc-lang {
  display: none;
  position: fixed;
  top: 16px;
  right: 20px;
  z-index: 10001;
  flex-direction: column;
  align-items: flex-end;
}
@media (min-width: 1280px) {
  body[data-tg-ui] .tg-pc-lang { display: flex; }
}

.tg-pc-lang__toggle {
  width: 42px;
  height: 42px;
  border-radius: 9999px;
  border: 1px solid var(--tg-border);
  background: rgba(255, 255, 255, 0.96);
  color: #1a1f16;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.08);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: transform 0.2s, border-color 0.2s, background 0.2s;
}
.tg-pc-lang__toggle:hover,
.tg-pc-lang.is-open .tg-pc-lang__toggle {
  border-color: var(--tg-green);
  color: var(--tg-green);
}
.tg-pc-lang__toggle svg {
  width: 20px;
  height: 20px;
}

.tg-pc-lang__panel {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 8px;
  padding: 6px 8px;
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid var(--tg-border);
  border-radius: 9999px;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.tg-pc-lang__panel[hidden] {
  display: none !important;
}

.tg-pc-lang__btn {
  width: 30px;
  height: 30px;
  border-radius: 9999px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid transparent;
  opacity: 0.75;
  transition: opacity 0.2s, border-color 0.2s, transform 0.2s;
}
.tg-pc-lang__btn:hover {
  opacity: 1;
  border-color: var(--tg-green);
  transform: translateY(-1px);
}
.tg-pc-lang__btn img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* 모바일: 헤더에 내장 메뉴가 없는 페이지(플로팅 햄버거)에서만
   언어 토글을 플로팅 햄버거 옆에 노출. 내장 헤더 페이지는 아래 인라인 규칙이 처리 */
@media (max-width: 1279px) {
  body[data-tg-ui]:not([data-tg-native-menu]) .tg-pc-lang {
    display: flex;
    top: 14px;
    right: 64px;
    z-index: 1080;
  }
  body[data-tg-ui]:not([data-tg-native-menu]) .tg-pc-lang__toggle {
    width: 42px;
    height: 42px;
  }
}

/* 헤더 클러스터 안으로 이동된 인라인 언어 토글 (PC·모바일 공통) */
.tg-pc-lang--inline {
  display: flex !important;
  position: relative !important;
  top: auto !important;
  right: auto !important;
  left: auto !important;
  bottom: auto !important;
  z-index: 1 !important;
  flex-direction: row;
  align-items: center;
}
body[data-tg-ui] .tg-pc-lang--inline .tg-pc-lang__toggle {
  width: 44px !important;
  height: 44px !important;
  border-radius: 0.5rem;
  box-shadow: none;
  background: transparent;
  border: 1px solid var(--tg-border);
}
body[data-tg-ui] .tg-pc-lang--inline .tg-pc-lang__toggle svg {
  width: 24px !important;
  height: 24px !important;
}
.tg-pc-lang--inline .tg-pc-lang__panel {
  position: absolute;
  top: 100%;
  right: 0;
  margin-top: 8px;
}

/* Google Translate UI / branding 숨김 (번역 기능은 유지) */
.tg-gt-hidden,
#google_translate_element {
  position: absolute !important;
  left: -9999px !important;
  top: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}
.goog-te-banner-frame,
.goog-te-balloon-frame,
iframe.skiptranslate,
.VIpgJd-ZVi9od-ORHb-OEVmcd,
.VIpgJd-ZVi9od-l4eHX-hSRGPd,
.goog-logo-link,
.goog-te-gadget span {
  display: none !important;
}
body {
  top: 0 !important;
}
.goog-te-gadget {
  font-size: 0 !important;
}
font {
  background-color: transparent !important;
  box-shadow: none !important;
}

.tg-quick-btn {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 4px 4px 4px 16px;
  width: 180px;
  border-radius: 9999px;
  background: #fff;
  border: 1px solid var(--tg-border);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  text-decoration: none;
  color: var(--tg-text);
  transition: width 0.3s cubic-bezier(0.25, 1, 0.5, 1), box-shadow 0.3s, transform 0.3s;
  overflow: hidden;
}
.tg-quick-btn:hover {
  width: 190px;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.12);
  transform: translateX(-4px);
}
.tg-quick-btn span {
  flex: 1;
  font-size: 14px;
  font-weight: 700;
  white-space: nowrap;
}
.tg-quick-btn__icon {
  width: 40px;
  height: 40px;
  border-radius: 9999px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.tg-quick-btn__icon svg { width: 20px; height: 20px; }

.tg-quick-btn--naver { border-color: rgba(3, 199, 90, 0.2); }
.tg-quick-btn--naver .tg-quick-btn__icon { background: var(--tg-naver); color: #fff; font-weight: 900; font-size: 14px; }

.tg-quick-btn--kakao .tg-quick-btn__icon { background: var(--tg-kakao); color: #3c1e1e; }

.tg-quick-btn--dark .tg-quick-btn__icon { background: var(--tg-text); color: #fff; }

/* Premium editorial quick actions */
.tg-quick-btn--reserve {
  border-color: rgba(62, 82, 45, 0.2);
}
.tg-quick-btn--reserve:hover {
  border-color: rgba(62, 82, 45, 0.4);
}
.tg-quick-btn--reserve .tg-quick-btn__icon {
  background: linear-gradient(145deg, #4f6a3c 0%, #3e522d 100%);
  color: #fff;
  box-shadow: 0 4px 14px rgba(62, 82, 45, 0.28);
}

.tg-quick-btn--consult {
  border-color: rgba(197, 168, 128, 0.35);
}
.tg-quick-btn--consult:hover {
  border-color: rgba(197, 168, 128, 0.55);
}
.tg-quick-btn--consult .tg-quick-btn__icon {
  background: linear-gradient(145deg, #d9c29a 0%, #c5a880 100%);
  color: #fff;
  box-shadow: 0 4px 14px rgba(197, 168, 128, 0.32);
}

.tg-quick-btn--reviews {
  border-color: rgba(176, 120, 108, 0.28);
}
.tg-quick-btn--reviews:hover {
  border-color: rgba(176, 120, 108, 0.48);
}
.tg-quick-btn--reviews .tg-quick-btn__icon {
  background: linear-gradient(145deg, #c99b8f 0%, #b0786c 100%);
  color: #fff;
  box-shadow: 0 4px 14px rgba(176, 120, 108, 0.28);
}

.tg-quick-btn--green {
  background: var(--tg-green);
  border-color: var(--tg-green);
  color: #fff;
  margin-top: 4px;
}
.tg-quick-btn--green .tg-quick-btn__icon { background: rgba(255, 255, 255, 0.2); color: #fff; }

/* PC Sticky Bottom Consult Bar (1024px+) */
.tg-sticky-consult {
  display: none;
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 10002;
  background: rgba(253, 251, 247, 0.97);
  border-top: 1px solid var(--tg-border);
  box-shadow: 0 -8px 32px rgba(26, 31, 22, 0.08);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  font-family: "Pretendard", "Noto Sans KR", -apple-system, BlinkMacSystemFont, sans-serif;
}

.tg-sticky-consult__form {
  margin: 0;
  width: 100%;
}

.tg-sticky-consult__inner {
  display: flex;
  align-items: center;
  gap: 10px;
  max-width: 1440px;
  margin: 0 auto;
  padding: 10px 20px;
  min-height: 64px;
}

.tg-sticky-consult__brand {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-shrink: 0;
  padding-right: 16px;
  margin-right: 4px;
  border-right: 1px solid var(--tg-border);
}

.tg-sticky-consult__logo {
  height: 30px;
  width: 30px;
  object-fit: contain;
  flex-shrink: 0;
  mix-blend-mode: multiply;
}

.tg-sticky-consult__fields {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1 1 auto;
  min-width: 0;
}

.tg-sticky-consult__privacy {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 11px;
  color: var(--tg-muted);
  cursor: pointer;
  user-select: none;
  white-space: nowrap;
}

.tg-sticky-consult__privacy input {
  flex-shrink: 0;
  accent-color: var(--tg-green);
}

.tg-sticky-consult__field {
  height: 40px;
  padding: 0 14px;
  border: 1px solid var(--tg-border);
  border-radius: 9999px;
  background: #fff;
  font-size: 13px;
  color: var(--tg-text);
  outline: none;
  transition: border-color 0.2s, box-shadow 0.2s;
  min-width: 0;
}

.tg-sticky-consult__field::placeholder {
  color: #a1a89a;
}

.tg-sticky-consult__field:focus {
  border-color: var(--tg-green);
  box-shadow: 0 0 0 3px rgba(62, 82, 45, 0.08);
}

.tg-sticky-consult__select {
  flex: 0 0 148px;
  max-width: 168px;
  padding-right: 28px;
  cursor: pointer;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236b7264' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
}

.tg-sticky-consult__inner input[name="boardInsideGuestName"] {
  flex: 0 0 108px;
  max-width: 120px;
}

.tg-sticky-consult__inner input[name="boardInsideExtraField1"] {
  flex: 0 0 132px;
  max-width: 148px;
}

.tg-sticky-consult__memo {
  flex: 1 1 auto;
  min-width: 120px;
}

.tg-sticky-consult__submit {
  flex: 0 0 auto;
  flex-shrink: 0;
  width: auto !important;
  max-width: none;
  height: 40px;
  padding: 0 22px;
  border: none;
  border-radius: 9999px;
  background: var(--tg-green);
  color: #fff;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.02em;
  cursor: pointer;
  white-space: nowrap;
  transition: background 0.2s, transform 0.15s, box-shadow 0.2s;
  box-shadow: 0 4px 14px rgba(62, 82, 45, 0.22);
}

.tg-sticky-consult__submit:hover {
  background: var(--tg-green-dark);
  transform: translateY(-1px);
}

.tg-sticky-consult__submit:active {
  transform: translateY(0);
}

@media (min-width: 1024px) {
  body[data-tg-ui] .tg-sticky-consult {
    display: block;
  }

  body[data-tg-ui] {
    padding-bottom: 76px;
  }

  body[data-tg-ui] .tg-pc-quick {
    bottom: 96px;
  }
}

@media (min-width: 1280px) {
  body[data-tg-ui] .tg-pc-quick {
    bottom: 96px;
  }
}