/* 모바일 웹 앱 유도 상단 바 — Stay chrome, 페이지 플로우 상단 (고정 아님) */
.wh-app-banner {
  box-sizing: border-box;
  background: var(--wh-card, #fff);
  border-bottom: 1px solid var(--wh-bd-hairline, #E5E5E5);
  font-family: var(--wh-ff, Pretendard, -apple-system, sans-serif);
}

.wh-app-banner[hidden] {
  display: none !important;
}

.wh-app-banner__inner {
  display: flex;
  align-items: center;
  gap: var(--wh-space-sm, 12px);
  min-height: 56px;
  padding: 8px 8px 8px 16px;
  max-width: var(--wh-max-mobile-shell, 720px);
  margin: 0 auto;
}

.wh-app-banner__icon {
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
  border-radius: var(--wh-radius-sharp, 10px);
  object-fit: cover;
  background: var(--wh-bg-stay, #F5F5F5);
}

.wh-app-banner__text {
  flex: 1 1 auto;
  min-width: 0;
}

.wh-app-banner__title {
  margin: 0;
  color: var(--wh-tx, #1A1A1A);
  font-size: var(--wh-text-sm, 0.875rem);
  font-weight: 700;
  line-height: var(--wh-lh-tight, 1.14);
  letter-spacing: var(--wh-tracking-title, -0.03em);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.wh-app-banner__sub {
  margin: 2px 0 0;
  color: var(--wh-tx3, #6B6B6B);
  font-size: var(--wh-text-xs, 0.75rem);
  font-weight: 500;
  line-height: var(--wh-lh-body, 1.5);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.wh-app-banner__cta {
  flex: 0 0 auto;
  min-height: var(--wh-touch-min, 44px);
  min-width: var(--wh-touch-min, 44px);
  padding: 8px 14px;
  font-size: var(--wh-text-sm, 0.875rem);
  text-decoration: none;
}

.wh-app-banner__close {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: var(--wh-touch-min, 44px);
  height: var(--wh-touch-min, 44px);
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: var(--wh-radius-sharp, 10px);
  background: transparent;
  color: var(--wh-tx3, #6B6B6B);
  cursor: pointer;
  appearance: none;
  -webkit-tap-highlight-color: transparent;
}

.wh-app-banner__close:focus-visible {
  outline: 2px solid var(--wh-focus-ring, #681DC7);
  outline-offset: 2px;
}

@media (min-width: 1024px) {
  .wh-app-banner {
    display: none !important;
  }
}

html.wh-wehome-app .wh-app-banner,
html.soffer-embed .wh-app-banner {
  display: none !important;
}
