/* === 찾아오는 길 (미라셀 레퍼런스 기반) === */

/* 지도 영역 */
.location__map-area {
  width: 100%;
  height: 280px;
  border-radius: var(--radius-lg);
  overflow: hidden;
  border: 1px solid var(--color-border-light);
}

.location__map-area .root_daum_roughmap {
  width: 100% !important;
  height: 100% !important;
}

.location__map-area .wrap_map {
  width: 100% !important;
  height: 100% !important;
}

/* 정보 영역 */
.location__info-wrap {
  margin-top: var(--space-3xl);
}

.location__info-box {
  display: flex;
  border-bottom: 1px solid var(--color-border-light);
  padding-bottom: var(--space-3xl);
}

.location__info-box:last-child {
  padding-top: var(--space-3xl);
  border-bottom: none;
  padding-bottom: 0;
}

.location__info-box:only-child {
  padding-bottom: 0;
}

/* 타이틀 영역 (왼쪽) */
.location__info-tit-area {
  display: none;
}

.location__info-tit {
  font-size: 1.5rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--color-text);
  margin: 0;
}

/* 상세 영역 (오른쪽) */
.location__info-detail {
  width: 100%;
}

.location__info-detail--flex {
  display: block;
}

.location__info-detail--flex .location__info-list {
  width: 100%;
  margin-bottom: var(--space-lg);
}

/* 정보 리스트 */
.location__info-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.location__info-item {
  display: flex;
  align-items: center;
  margin-bottom: 0.5rem;
}

.location__info-item:last-child {
  margin-bottom: 0;
}

.location__info-item--align-start {
  align-items: flex-start;
}

.location__info-item--mb-lg {
  margin-bottom: var(--space-2xl);
}

.location__info-label {
  width: 70px;
  margin-right: var(--space-md);
  font-family: 'Poppins', var(--font-primary);
  font-size: 0.9375rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  line-height: 1.5;
  color: var(--color-text);
  flex-shrink: 0;
}

.location__info-text {
  font-size: 0.9375rem;
  font-weight: 500;
  letter-spacing: -0.02em;
  line-height: 1.5;
  color: var(--color-text-light);
}

/* 지도 링크 버튼 */
.location__map-link {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100px;
  height: 100px;
  background-color: var(--color-accent);
  border-radius: var(--radius-lg);
  text-decoration: none;
  transition: opacity 0.3s;
  flex-shrink: 0;
}

.location__map-link:hover {
  opacity: 0.85;
}

.location__map-link svg {
  margin-bottom: 0.5rem;
  color: var(--color-text-white);
}

.location__map-link span {
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--color-text-white);
}

/* 대중교통 내부 리스트 */
.location__inner-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.location__inner-item {
  display: flex;
  align-items: flex-start;
  margin-bottom: 0.75rem;
}

.location__inner-item:last-child {
  margin-bottom: 0;
}

/* 역/버스 배지 */
.location__station-box {
  display: inline-flex;
  flex-wrap: nowrap;
  gap: 0.35rem;
  margin-right: var(--space-md);
  flex-shrink: 0;
}

.location__station {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 22px;
  padding: 2px 10px;
  border-radius: 11px;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: var(--color-text-white);
  line-height: 1.2;
  text-align: center;
  white-space: nowrap;
  flex-shrink: 0;
  margin-right: var(--space-md);
}

.location__station--sm {
  margin-right: 0;
  min-width: 36px;
}

.location__station-box .location__station {
  margin-right: 0;
}

.location__station--blue {
  background-color: #0f9df7;
}

.location__station--green {
  background-color: #3cb44a;
}

/* === 반응형 === */

/* 태블릿 이상 */
@media (min-width: 768px) {
  .location__map-area {
    height: 400px;
  }

  .location__info-box {
    display: flex;
  }

  .location__info-tit-area {
    display: block;
    width: 180px;
    margin-right: var(--space-2xl);
    flex-shrink: 0;
  }

  .location__info-detail {
    width: calc(100% - 180px - var(--space-2xl));
  }

  .location__info-detail--flex {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }

  .location__info-detail--flex .location__info-list {
    width: calc(100% - 130px);
    margin-bottom: 0;
  }

  .location__info-label {
    width: 80px;
  }

  .location__station {
    min-height: 24px;
    padding: 3px 12px;
    font-size: 0.8125rem;
  }

  .location__station-box {
    width: auto;
  }

  /* 대중교통: 세로 아이템 간격 */
  .location__info-item--align-start {
    align-items: flex-start;
  }
}

/* 데스크톱 */
@media (min-width: 1024px) {
  .location__map-area {
    height: 480px;
    border-radius: var(--radius-lg);
  }

  .location__info-wrap {
    margin-top: var(--space-4xl);
  }

  .location__info-tit {
    font-size: 1.75rem;
  }

  .location__info-label {
    font-size: 1rem;
    width: 90px;
  }

  .location__info-text {
    font-size: 1rem;
  }
}