/*
  Theme Name: ModnMedi Theme
  Template: twentytwentyfour
*/

/* PC 헤더 하단 보더 (메인페이지 제외) */
@media (min-width: 769px) {
  .site-header {
    border-bottom: 1px solid #ededed;
  }
  body.home .site-header,
  body.front-page .site-header {
    border-bottom: none;
  }
}

/* 로그인/회원가입 노출 제어 (헤더 HTML용)
   워드프레스가 body에 logged-in / logged-out 클래스를 자동으로 붙여줌 */
.logged-in .login-guest-only {
  display: none !important;
}

.logged-out .login-member-only {
  display: none !important;
}

/* GNB: Swiper 적용 전·후 동일 간격 유지 (슬라이드 margin으로 고정, Swiper spaceBetween은 0 사용) */
.header-gnb .gnb-swiper {
  overflow: hidden;
}
.header-gnb .gnb-swiper .swiper-wrapper {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
}
.header-gnb .gnb-swiper .swiper-slide {
  width: auto;
  flex-shrink: 0;
  margin-right: 34px;
}
.header-gnb .gnb-swiper .swiper-slide:last-child {
  margin-right: 0;
}
.header-gnb .gnb-swiper .swiper-slide .link {
  white-space: nowrap;
}

/* Health Article: 카드 이미지 영역 높이 및 비율 */
.health-article .health-article-card .img {
  height: 215px;
  overflow: hidden;
}
.health-article .health-article-card .img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
@media (max-width: 768px) {
  .health-article .health-article-card .img {
    height: 212px;
  }
  .health-article .health-article-mobile .mobile-list .health-article-card .img {
    width: 130px;
    height: 90px;
    flex-shrink: 0;
  }
}

/* 홈: 남성/여성 베스트, 건강 아티클, 이용 후기 — 타이틀은 항상 노출, Swiper 영역은 적용 후에만 노출 */
.recommend-banner.menbest .flex .right,
.recommend-banner.womenbest .flex .right,
.health-article .health-article-body,
.review-widget-wrapper .flex .right {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s ease, visibility 0.25s ease;
}
.recommend-banner.menbest .flex .right:has(.swiper-initialized),
.recommend-banner.womenbest .flex .right:has(.swiper-initialized),
.health-article .health-article-body:has(.swiper-initialized),
.health-article.is-mobile .health-article-body,
.review-widget-wrapper .flex .right:has(.swiper-initialized) {
  opacity: 1;
  visibility: visible;
}