/* 상품 상세 css 를 설정합니다. */

/* 설명 글씨 크기 */
/* .woocommerce-tabs .woocommerce-Tabs-panel {
} */
/* 탭 메뉴(설명 / 상품평) 글씨 크기
.woocommerce-tabs ul.tabs li a {
  font-size: 14px;
} */

/* 탭 메뉴(설명 / 상품평) 글씨 크기 */
.woocommerce-tabs .wc-tabs {
  font-size: var(--everythings-font-size);
}

/* 상품 하단 썸네일 갤러리 */
.woocommerce-product-gallery--columns-6 .flex-control-thumbs {
  --thumb-columns: 6; /* 몇 열인지 */
  --thumb-gap: 6px; /* 가로 간격 */
  --thumb-row-gap: 6px; /* 세로 간격 */

  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  column-gap: var(--thumb-gap);
  row-gap: var(--thumb-row-gap);
  margin-top: 12px !important;
  width: 100%;
  max-width: 512px;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}

/* 썸네일 li */
.woocommerce-product-gallery--columns-6 .flex-control-thumbs li {
  list-style: none;
  flex: 1 1 calc((100% - ((var(--thumb-columns) - 1) * var(--thumb-gap))) / var(--thumb-columns));
  max-width: calc((100% - ((var(--thumb-columns) - 1) * var(--thumb-gap))) / var(--thumb-columns));
  box-sizing: border-box;
}

/* 썸네일 이미지 */
.woocommerce-product-gallery--columns-6 .flex-control-thumbs img {
  width: 100%;
  height: auto;
  transition: opacity 0.7s ease;
  cursor: pointer;
}

/* hover 효과 */
.woocommerce-product-gallery--columns-6 .flex-control-thumbs img:hover {
  opacity: 1;
}

/* shop의 전체적인 정렬 버튼 관련 */
/* WooCommerce 정렬 셀렉트박스 – 미니멀 스타일 */
.woocommerce-ordering .orderby {
  border: none; /* ✅ 보더 제거 */
  font-size: 14px;
  padding-right: 2px; /* ▼ 아이콘 여유 공간 */
  cursor: pointer;

  background-image: url("data:image/svg+xml;charset=UTF-8,<svg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='%23222' stroke-width='2' viewBox='0 0 24 24'><path d='M6 9l6 6 6-6'/></svg>");
  background-repeat: no-repeat;
  background-position: right 0 center;
  background-size: 12px;

  outline: none; /* ✅ 브라우저 기본 포커스 제거 */
}

/* 상품 상세정보 테이블 전체 폰트 크기 */
.woocommerce-product-attributes.shop_attributes {
  font-size: var(--everythings-font-size); /* 전체 기본 크기 */
}
/* 상품 설명 이미지 중앙 정렬 고정 */
.single-product .woocommerce-Tabs-panel--description img.aligncenter {
  display: block !important;
  margin-left: auto !important;
  margin-right: auto !important;
  float: none !important;
}

/* 혹시 부모가 text-align: left인 경우에도 보정 */
/* .single-product .woocommerce-Tabs-panel--description {
  text-align: center !important;
} */