@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@500;600;700&family=Pretendard:wght@400;500;600;700&display=swap");

:root {
  --ink: #1c1917;
  --ink2: #44403c;
  --ink3: #78716c;
  --ink4: #a8a29e;
  --ink15: #44403c;
  --act: #1c1917;
  --act-deep: #0c0a09;
  --act-tint: #f5f0e8;
  --act-soft: #e7dcc8;
  --star: #b45309;
  --band: #f5f0e8;
  --band2: #faf7f2;
  --line: #e7e0d6;
  --hair: #ebe4d9;
  --bg: #f4efe6;
  --r-2xl: 12px;
  --r-lg: 8px;
  --r-pill: 999px;
  --r-badge: 6px;
  --shadow-card: 0 1px 0 rgba(28,25,23,.06);
  --shadow-float: 0 10px 30px rgba(28,25,23,.06);
  --shadow-bar-up: 0 -8px 24px rgba(28,25,23,.06);
}

html, body {
  background: var(--bg) !important;
  color: var(--ink);
  font-family: Pretendard, "Apple SD Gothic Neo", "Noto Sans KR", sans-serif;
}

body:not(.venue-app) h1,
body:not(.venue-app) h2,
body:not(.venue-app) h3,
body:not(.venue-app) .font-extrabold.tracking-\[-.03em\],
body:not(.venue-app) h1 span.block {
  font-family: "Noto Serif KR", "Source Han Serif KR", serif;
  letter-spacing: -0.03em;
}

/* hide original left brand aside that screams clone */
aside[aria-label] {
  display: none !important;
}

.mx-auto.min-h-\[100dvh\].max-w-\[640px\] {
  max-width: 720px !important;
  background: #fffdf8 !important;
  box-shadow: 0 0 0 1px var(--line) !important;
  border-left: none !important;
  border-right: none !important;
}

body:not(.venue-app) header,
body:not(.venue-app) .sticky.top-0.z-30,
body:not(.venue-app) .sticky.top-0.z-40 {
  background: #1c1917 !important;
  border-bottom: 1px solid #292524 !important;
  color: #faf7f2 !important;
}
body:not(.venue-app) .sticky.top-0.z-30 a,
body:not(.venue-app) .sticky.top-0.z-40 a,
body:not(.venue-app) .sticky.top-0.z-30 span,
body:not(.venue-app) .sticky.top-0.z-40 span,
body:not(.venue-app) .sticky.top-0 button,
body:not(.venue-app) .sticky.top-0 svg {
  color: #faf7f2 !important;
}
body:not(.venue-app) .sticky.top-0 .text-\[var\(--ink\)\] {
  color: #faf7f2 !important;
  font-family: "Noto Serif KR", serif;
  font-weight: 650;
  letter-spacing: 0.08em;
  font-size: 13px !important;
}

nav[aria-label="카테고리 바로가기"] {
  background: #fffdf8 !important;
  border-color: var(--line) !important;
}

a.bg-\[var\(--act\)\],
button.bg-\[var\(--act\)\],
.bg-\[var\(--act\)\] {
  background: #1c1917 !important;
  color: #faf7f2 !important;
  border-radius: 8px !important;
}

.rounded-\[var\(--r-2xl\)\] {
  border-radius: 12px !important;
}
.shadow-\[var\(--shadow-card\)\] {
  box-shadow: none !important;
  border-color: var(--line) !important;
}

.fill-\[var\(--star\)\], .text-\[var\(--star\)\] {
  color: #b45309 !important;
  fill: #b45309 !important;
}

nav[aria-label="주요 메뉴"].fixed.inset-x-0.bottom-0 {
  background: #1c1917 !important;
  border-top-color: #292524 !important;
  color: #e7e5e4;
  max-width: 720px !important;
}
nav[aria-label="주요 메뉴"].fixed.inset-x-0.bottom-0 a,
nav[aria-label="주요 메뉴"].fixed.inset-x-0.bottom-0 span {
  color: #e7e5e4 !important;
}

/* AI box */
aside[data-ai] {
  background: #faf7f2 !important;
  border: 1px solid var(--line) !important;
  border-radius: 12px !important;
}

.bg-kakao { filter: saturate(0.8); }

@media (min-width: 1024px) {
  body { background: #ece6db !important; }
}

/* show desktop side rail (four Da Nang items) */
nav[aria-label="주요 메뉴"].lg\:flex {
  display: none !important;
}
@media (min-width: 1024px) {
  nav[aria-label="주요 메뉴"].lg\:flex {
    display: flex !important;
  }
}

/* even four-item mobile tab bar */
nav[aria-label="주요 메뉴"].fixed.inset-x-0.bottom-0 > div {
  display: flex;
  align-items: stretch;
  justify-content: stretch;
}
nav[aria-label="주요 메뉴"].fixed.inset-x-0.bottom-0 a {
  flex: 1 1 0%;
  min-width: 0;
}
nav[aria-label="주요 메뉴"] span.rounded-full {
  border-radius: 999px !important;
}
nav[aria-label="주요 메뉴"] span.rounded-full svg {
  color: #fff !important;
}

/* header Kakao + Telegram on dark bar (not venue-app) */
body:not(.venue-app) .sticky.top-0 a.header-contact {
  background: rgba(250, 247, 242, 0.12) !important;
  color: #faf7f2 !important;
}
body:not(.venue-app) .sticky.top-0 a.header-contact svg {
  color: #faf7f2 !important;
}
body:not(.venue-app) .sticky.top-0 a.header-contact:hover {
  background: rgba(250, 247, 242, 0.22) !important;
}

/* text-only review form */
.review-hp {
  position: absolute !important;
  left: -10000px !important;
  top: auto !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  opacity: 0 !important;
}
.ms-review-form label {
  display: block;
  font-size: 12px;
  font-weight: 700;
  color: var(--ink2);
  margin-top: 10px;
}
.ms-review-form input[type="text"],
.ms-review-form textarea {
  display: block;
  width: 100%;
  margin-top: 6px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  color: var(--ink);
  font-size: 14px;
  padding: 10px 12px;
  font-family: inherit;
}
.ms-review-form textarea {
  min-height: 96px;
  resize: vertical;
  line-height: 1.55;
}
.ms-review-stars {
  display: flex;
  gap: 4px;
  margin-top: 6px;
}
.ms-review-stars button {
  width: 40px;
  height: 40px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  color: var(--ink4);
  font-size: 18px;
  cursor: pointer;
  line-height: 1;
}
.ms-review-stars button[aria-checked="true"],
.ms-review-stars button.is-on {
  color: var(--star);
  border-color: var(--star);
  background: var(--band);
  font-weight: 800;
}
.ms-review-hint {
  margin-top: 8px;
  font-size: 11.5px;
  line-height: 1.5;
  color: var(--ink3);
}
.ms-review-error {
  margin-top: 8px;
  font-size: 13px;
  font-weight: 700;
  color: #b42318;
}
.ms-review-ok {
  margin-top: 8px;
  font-size: 13px;
  font-weight: 700;
  color: #176c37;
}
.ms-review-submit {
  margin-top: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 40px;
  padding: 0 16px;
  border: 0;
  border-radius: 10px;
  background: var(--ink);
  color: #fff;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
}
.ms-review-submit:disabled {
  opacity: .55;
  cursor: not-allowed;
}
#review-list article p {
  white-space: pre-wrap;
  word-break: break-word;
}


/* homepage hero — brand home, not a city subpage */
.ms-home-hero {
  padding-top: 1.35rem !important;
  padding-bottom: 1.15rem !important;
}
.ms-home-hero h1 {
  font-family: "Noto Serif KR", "Source Han Serif KR", serif;
  font-size: 28px !important;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.03em;
  color: var(--ink);
}
.ms-home-hero .ms-home-sub {
  margin-top: 0.5rem;
  font-size: 14.5px;
  line-height: 1.65;
  color: var(--ink2);
}
.ms-home-hero .ms-home-greet {
  margin-top: 0.35rem;
  font-size: 13px;
  line-height: 1.55;
  color: var(--ink3);
}

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

body.has-app-tab .pf-contactbar {
  bottom: calc(56px + env(safe-area-inset-bottom, 0px)) !important;
}
body.has-app-tab .mx-auto.min-h-\[100dvh\].max-w-\[640px\] {
  padding-bottom: calc(92px + 72px + env(safe-area-inset-bottom, 0px));
}

html, body {
  background: #f3f0ea !important;
}
