/* ============================================================
   kakao-map.css
   ------------------------------------------------------------
   카카오맵(Kakao Maps) 전용 스타일시트입니다.
   다른 회사 홈페이지에 재사용할 때도 이 파일은 수정 없이 그대로
   사용할 수 있습니다. (좌표·주소·API 키 등 회사별 설정 값은
   kakao-map.js 상단의 KAKAO_MAP_CONFIG 에서만 관리합니다.)
   ============================================================ */

/* 지도가 들어갈 컨테이너
   - 부모 요소(.map-embed-wrap)의 남은 공간을 모두 채우도록
     width:100%, flex:1 을 사용해 반응형으로 동작합니다. */
.kakao-map-container {
  width: 100%;
  flex: 1;
  min-height: 280px;
  background: #f4f6fa; /* SDK 로딩 전/실패 시 보이는 배경색 */
}

/* 모바일 화면에서는 지도 높이를 살짝 줄여 스크롤 부담을 줄임 */
@media (max-width: 600px) {
  .kakao-map-container {
    min-height: 220px;
  }
}

/* 카카오맵 인포윈도우(말풍선) 내부 콘텐츠 스타일
   - kakao-map.js 에서 InfoWindow content로 사용하는 HTML에 적용됩니다. */
.kakao-map-infowindow {
  padding: 10px 12px;
  font-size: 13px;
  line-height: 1.6;
  color: #1a1a1a;
  white-space: nowrap;
  font-family: 'Noto Sans KR', sans-serif;
}
.kakao-map-infowindow strong {
  display: block;
  color: #1a4fa0;
  font-size: 13.5px;
  margin-bottom: 2px;
}

/* 지도를 표시할 수 없을 때(=API 키 오류 등) 보여주는 대체 안내 문구 */
.kakao-map-fallback {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  min-height: 220px;
  background: #f4f6fa;
  color: #6b7280;
  font-size: 12.5px;
  line-height: 1.7;
  text-align: center;
  padding: 1.4rem;
  font-family: 'Noto Sans KR', sans-serif;
}