/* Venue detail chrome — same 390px phone as /css/app-shell.css.
   Loaded only on /danang/*/*/index.html (after masangmu-theme). */
@import url("https://fonts.googleapis.com/css2?family=Pretendard:wght@400;500;600;700&display=swap");

:root {
  --ink: #111;
  --sub: #6f6a64;
  --line: #ece8e1;
  --bg: #f3f0ea;
  --card: #fff;
  --accent: #111;
  --kakao: #fee500;
}

html, body {
  margin: 0;
  background: #111 !important;
  color: var(--ink) !important;
  font-family: Pretendard, system-ui, -apple-system, "Apple SD Gothic Neo", sans-serif !important;
}

h1, h2, h3, h4,
h1 span, h1 span.block,
.font-extrabold,
.font-extrabold.tracking-\[-.03em\] {
  font-family: Pretendard, system-ui, -apple-system, sans-serif !important;
  letter-spacing: -0.02em;
}

/* Kill the black Next/masangmu header on venue pages */
header,
.sticky.top-0,
.sticky.top-0.z-30,
.sticky.top-0.z-40 {
  background: rgba(243, 240, 234, 0.94) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--line) !important;
  color: var(--ink) !important;
  box-shadow: none !important;
}
.sticky.top-0 a,
.sticky.top-0 span,
.sticky.top-0 button,
.sticky.top-0 svg,
.sticky.top-0 .text-\[var\(--ink\)\],
.sticky.top-0.z-30 a,
.sticky.top-0.z-40 a,
.sticky.top-0.z-30 span,
.sticky.top-0.z-40 span {
  color: var(--ink) !important;
  font-family: Pretendard, system-ui, sans-serif !important;
  letter-spacing: -0.02em;
  font-size: inherit;
  font-weight: inherit;
}
.sticky.top-0 .opacity-0 {
  opacity: 1 !important;
}
.sticky.top-0 a.header-contact,
.sticky.top-0 a.header-contact svg {
  background: transparent !important;
  color: var(--ink) !important;
}

/* Hide unused header actions (share / heart / home icon) */
.sticky.top-0 a[aria-label="홈으로"],
.sticky.top-0 button[aria-label="공유"],
.sticky.top-0 [aria-label="저장"],
.sticky.top-0 .lucide-share,
.sticky.top-0 .lucide-heart {
  display: none !important;
}

/* back | venue name | 다낭 */
.sticky.top-0 .flex.h-14 {
  max-width: 390px;
  padding: 0 4px 0 2px;
}
.sticky.top-0 .flex.h-14::after {
  content: "다낭";
  flex: 0 0 auto;
  font-size: 12px;
  font-weight: 500;
  color: var(--sub);
  padding: 0 12px 0 8px;
}
.sticky.top-0 span.min-w-0.flex-1 {
  opacity: 1 !important;
  text-align: center;
  font-size: 16px !important;
  font-weight: 650 !important;
  color: var(--ink) !important;
}

/* 390px phone column, beige, centered on desktop */
.min-h-\[100dvh\].md\:bg-\[var\(--bg\)\] {
  background: transparent !important;
}
.mx-auto.min-h-\[100dvh\].max-w-\[640px\],
.mx-auto.min-h-\[100dvh\].w-full.max-w-\[640px\] {
  max-width: 390px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  background: var(--bg) !important;
  box-shadow: none !important;
  border-left: none !important;
  border-right: none !important;
  min-height: 100dvh;
  padding-bottom: calc(92px + 72px + env(safe-area-inset-bottom, 0px)) !important;
}

/* Hide clone chrome */
aside[aria-label],
footer,
nav[aria-label="주요 메뉴"],
nav[aria-label="카테고리 바로가기"] {
  display: none !important;
}

/* English leftovers (Reviews / Info / Location / Da Nang · … / romanized title) */
p.uppercase[class*="tracking-[.14em]"],
p.uppercase[class*="tracking-[0.06em]"],
p.uppercase[class*="tracking-[0.06em]"],
.pf-contactbar button[aria-label="저장"] {
  display: none !important;
}

/* Round photo gallery */
#sec-photos {
  margin: 8px 12px 0;
  border-radius: 16px;
  overflow: hidden;
  background: #ddd;
}
#sec-photos .relative,
#sec-photos .snap-x,
#sec-photos .snap-x > button {
  border-radius: 16px;
}
#sec-photos img {
  border-radius: 0;
}

/* Title card already overlaps gallery; keep it white + 16px */
.relative.z-\[5\].-mt-6,
[class*="-mt-6"][class*="rounded"][class*="bg-white"] {
  border-radius: 16px !important;
  border: 1px solid var(--line);
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.04) !important;
}

/* White cards for sections */
#sec-info,
#sec-reviews,
section.pt-7,
section.scroll-mt-\[120px\] {
  background: var(--card);
  margin: 10px 12px;
  border-radius: 16px;
  border: 1px solid var(--line);
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.04);
}
.ms-review-form,
#review-form > div,
#review-list article {
  background: var(--card);
}

/* Soften the full-bleed band dividers between sections */
.h-2.w-full.bg-\[var\(--band\)\] {
  background: transparent !important;
  height: 4px !important;
}

/* Date chips — match home chips */
button[aria-pressed].rounded-full,
button[aria-pressed][class*="rounded-full"] {
  border-color: var(--line) !important;
}

/* Maps stay as-is; just clip to the card */
iframe[src*="maps.google.com"],
iframe[src*="google.com/maps"] {
  border: 0;
  display: block;
  width: 100%;
}

/* Bottom tab — same as home */
nav.tab.app-tab {
  position: fixed !important;
  left: 50% !important;
  bottom: 0 !important;
  transform: translateX(-50%) !important;
  width: 100% !important;
  max-width: 390px !important;
  display: grid !important;
  grid-template-columns: repeat(4, 1fr) !important;
  background: #fff !important;
  border-top: 1px solid var(--line) !important;
  padding: 8px 6px calc(8px + env(safe-area-inset-bottom, 0px)) !important;
  z-index: 20 !important;
  color: inherit;
}
nav.tab.app-tab a {
  text-align: center;
  font-size: 10px;
  color: #8a847c !important;
  text-decoration: none;
  font-weight: 600;
}
nav.tab.app-tab a.on { color: #111 !important; }
nav.tab.app-tab svg { display: block; margin: 0 auto 4px; }

/* Kakao / Telegram booking bar sits ABOVE the tab */
.pf-contactbar,
body.has-app-tab .pf-contactbar,
body.venue-app .pf-contactbar {
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%);
  width: 100% !important;
  max-width: 390px !important;
  bottom: calc(56px + env(safe-area-inset-bottom, 0px)) !important;
  padding-bottom: 8px !important;
  z-index: 30 !important;
  box-sizing: border-box;
}

/* Ink / sub text closer to app-shell */
.text-\[var\(--ink3)\],
.text-\[var\(--ink4)\] {
  color: var(--sub);
}
