/*
 * WordPress iframe embed mode.
 * The parent page supplies the section heading and supporting copy.
 */

html,
body,
main {
  min-height: 100%;
}

body {
  background: #f4f1e8;
}

.site-header,
.intro,
.insight-strip,
footer {
  display: none !important;
}

.dashboard {
  width: 100%;
  margin: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.map-title {
  right: 20px;
  left: auto;
  transform: none;
}

/* 호스트 iframe 이 정한 높이를 그대로 채운다. 최적 높이는 지도 영역 폭의 절반
   (viewBox 1000×500 고정)이고 그 계산은 폭을 아는 food-security.css 가 소유한다.
   여기에 px 을 못 박으면 두 파일이 어긋나 빈 띠나 레터박스가 생긴다. */
html.is-compact-embed .dashboard {
  min-height: 100vh;
}

/* 그리드 행 높이에 맞춰 늘어나게 — map.css 의 650px 하한을 풀어 준다. */
html.is-compact-embed .map-shell {
  min-height: 0;
}

html.is-compact-embed .control-panel {
  padding: 14px 16px;
}

html.is-compact-embed .filter-buttons {
  gap: 6px;
  margin-top: 10px;
}

html.is-compact-embed .filter-buttons button {
  min-height: 36px;
}

html.is-compact-embed .total-card {
  margin: 12px 0 10px;
  padding: 12px 14px;
}

html.is-compact-embed .total-card strong {
  margin-block: 5px 3px;
  font-size: 26px;
}

html.is-compact-embed .grain-list {
  gap: 0;
}

html.is-compact-embed .grain-list button {
  min-height: 38px;
}

html.is-compact-embed .grain-swatch {
  height: 20px;
}

html.is-compact-embed .interaction-hint {
  margin-top: 10px;
}

@media (max-width: 980px) {
  html.is-compact-embed .dashboard {
    min-height: 650px;
  }

  html.is-compact-embed .map-shell {
    min-height: 610px;
  }
}

@media (max-width: 640px) {
  .dashboard {
    width: 100%;
    border-radius: 0;
  }

  .map-title {
    right: 12px;
    left: auto;
  }

}