/* style.gallery.scss
-------------------------------------------------------------------------------------------------------- */
#xet-simple-board .simple-board__gallery {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  grid-auto-rows: minmax(120px, auto);
  grid-gap: 16px;
}

/* Item */
#xet-simple-board .simple-board__gallery .item {
  overflow: hidden;
  border-radius: 0;
  z-index: 0;
  border: 0.5px solid var(--board-border-color);
  box-shadow: var(--board-box-shadow);
  transition: all 0.25s;
}

#xet-simple-board .simple-board__gallery .item.is-active {
  background-color: #f4f9f9;
}

#xet-simple-board .simple-board__gallery .item .item__thumbnail .thumbnail {
  display: block;
  overflow: hidden;
}

/* ✅ 이미지 아래 여백(베이스라인) 제거 */
#xet-simple-board .simple-board__gallery .item .item__thumbnail .thumbnail img {
  width: 100%;
  display: block;
  transition-duration: 0.3s;
}

#xet-simple-board .simple-board__gallery .item .item__contents {
  color: var(--board-text-base-color);
}

/* ✅ 기본 inner 리듬 통일 (모바일/PC 모두 10px) */
#xet-simple-board .simple-board__gallery .item .item__contents .item__inner {
  padding: 0 16px;
  margin-top: 10px;
}

#xet-simple-board .simple-board__gallery .item .item__contents .item__inner:last-child {
  margin-bottom: 10px;
}

#xet-simple-board .simple-board__gallery .item .item__contents .item__category {
  color: var(--board-primary-color);
}

/* 제목 영역 */
#xet-simple-board .simple-board__gallery .item .item__contents .item__subject {
  display: flex;
  align-items: center;
}

/* 제목 영역 위쪽 간격(B2B) */
#xet-simple-board .simple-board__gallery .item .item__contents .item__subject.item__inner {
  margin-top: 10px; /* ✅ 리듬 통일 */
}

/* 체크박스 */
#xet-simple-board .simple-board__gallery .item .item__contents .item__subject input[name=cart] {
  margin-right: 4px;
}

/* (사용 안 하면 영향 없음) 요약 */
#xet-simple-board .simple-board__gallery .item .item__contents .item__summary {
  color: var(--board-text-strong-color);
}

/* =========================
   B2B 카드 타이포 (톤 다운, 50+ 제품군용)
========================= */

/* 제목(설명 텍스트) */
#xet-simple-board .simple-board__gallery
.item .item__contents .item__subject a.subject{
  font-size: 14px;
  font-weight: 500;
  line-height: 1.35;
  letter-spacing: -0.01em;
  color: #6b7682;
  display: block;
}

/* 모델코드(extra_1) */
#xet-simple-board .simple-board__gallery .yh-model{
  font-weight: 600;
  letter-spacing: 0.01em;
  margin-right: 2px;
}

/* ✅ 부제목(extra_2) - PC/모바일 모두 절대 안 잘리게 */
#xet-simple-board .simple-board__gallery
.item .item__contents .item__ev-only{
  margin-top: 6px;
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1.35;
  color: #7c8794;
  letter-spacing: -0.01em;

  /* 줄바꿈 정책 (한글/영문 모두 안전) */
  white-space: normal;
  word-break: break-word;
  overflow-wrap: anywhere;

  /* ✅ 잘림/클램프 제거 */
  overflow: visible;
  max-height: none;
  height: auto;
}

/* 조회수 등 보조정보 */
#xet-simple-board .simple-board__gallery
.item .item__contents .item__etc-wrp {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-top: 8px;
  font-size: 12px;
  color: #b3bcc7;
}

#xet-simple-board .simple-board__gallery.style-b .item {
  border-radius: 1rem;
}

/* 반응형 */
@media (min-width: 768px) {
  #xet-simple-board .simple-board__gallery {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 992px) {
  #xet-simple-board .simple-board__gallery {
    grid-template-columns: repeat(4, 1fr);
  }

  #xet-simple-board .simple-board__gallery .item:hover {
    box-shadow: var(--board-box-shadow2);
  }

  #xet-simple-board .simple-board__gallery .item:hover .item__thumbnail img {
    transform: scale(1.2, 1.2);
  }
}

@media (min-width: 1200px) {
  #xet-simple-board .simple-board__gallery {
    grid-template-columns: repeat(5, 1fr);
  }
}

/* =========================================================
   Extra vars group background (ALL extra vars)
========================================================= */

/* 제목 다음 첫 확장변수 줄(그룹 시작) */
#xet-simple-board .simple-board__gallery
.item .item__contents .item__subject + .item__extra{
  margin-top: 10px; /* ✅ 리듬 통일(기존 14px → 10px) */
  padding: 10px 16px 3px 16px;

  background: #ffffff;
  border: 1px solid #e6ebf0;
  border-bottom: 0;

  border-radius: 8px 8px 0 0;
}

/* 두 번째 줄부터: 같은 박스로 이어붙이기 */
#xet-simple-board .simple-board__gallery
.item .item__contents .item__extra + .item__extra{
  margin-top: 0;
  padding: 3px 16px;

  background: #ffffff;
  border-left: 1px solid #eef2f6;
  border-right: 1px solid #eef2f6;
}

/* 마지막 줄 */
#xet-simple-board .simple-board__gallery
.item .item__contents .item__extra:last-of-type{
  padding-bottom: 10px;

  background: #ffffff;
  border-left: 1px solid #eef2f6;
  border-right: 1px solid #eef2f6;
  border-bottom: 1px solid #eef2f6;

  border-radius: 0 0 8px 8px;
}

/* 확장변수 글꼴 톤 */
#xet-simple-board .simple-board__gallery
.item .item__contents .item__extra{
  font-size: 12.5px;
  line-height: 1.3;
  color: #9aa6b2;
  font-weight: 500;
}

/* 값 안에 p/div 태그 margin 제거 */
#xet-simple-board .simple-board__gallery .item__extra p,
#xet-simple-board .simple-board__gallery .item__extra div{
  margin: 0;
  padding: 0;
}

/* 라벨(예: Model:, 물질종류:) */
#xet-simple-board .simple-board__gallery
.item__extra > span{
  color: #7f8b97;
  font-weight: 500;
}

/* br 줄바꿈 제거 */
#xet-simple-board .simple-board__gallery
.item__extra br{
  display: none;
}

/* board5(동영상)에서만 모델 색상 톤다운 */
body.mid-board5 #xet-simple-board .simple-board__gallery .yh-model{
  color: #55606c !important;
}

/* board5가 아닌 곳(기본 제품카드)은 원래 진한 색 유지 */
body:not(.mid-board5) #xet-simple-board .simple-board__gallery .yh-model{
  color: #2b2f34 !important;
}