.atc-related-products {
	width:fit-content;
  margin: 1rem auto;
}

.atc-related-heading {
  margin: 0 0 1.5rem;
  font-size: 1.5rem;
  font-weight: 500;
  text-align: center;
  color: #000;
}

/* 3-column grid: base | separator | related */
.atc-related-grid {
  display: grid;
  grid-template-columns: auto auto 1fr;
  gap: 2rem;
  align-items: top;
}

/* ---- Base product (col 1) ---- */
.atc-base-column {
	background:#ffffff;
	padding: 1rem 1.3rem;
  text-align: center;
  height:fit-content;
}

.atc-bundle-product__image img {
  display: block;
  width: 250px;
  height: 250px;
  object-fit: cover;
  margin: 0 auto;
}

.atc-bundle-product__info {
  margin-top: 0.25rem;
}

.atc-bundle-product__name {
  display: block;
  font-weight: 600;
  color: #000000;
  text-decoration: none;
  line-height: 1.2;
  text-align:left;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-top: 1rem;
  font-size: 0.9rem;
}

.atc-bundle-product__name:hover {
  color: #f79731;
}

.atc-bundle-product__price {
  font-size: 0.9rem;
  font-weight: 700;
  color: #f79731;
  margin-top: 0.0625rem;
  text-align: left;
}

/* ---- Separator (col 2) ---- */
.atc-bundle-separator {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 30px;
  height: 30px;
  background: #333;
  color: #fff;
  border-radius: 50%;
  flex-shrink: 0;
  margin: auto 0;
}

/* ---- Related products (col 3) ---- */
.atc-related-header {
  margin-bottom: 0.375rem;
  display: flex;
  align-items: center;
  gap: 0.4rem;
}

.atc-related-header__title {
  font-weight: 600;
  font-size: 0.9rem;
  color: #000000;
}

.atc-related-counter {
  font-size: 0.8rem;
  color: #999;
}

.atc-related-list {
  display: flex;
  
  flex-direction: column;
  gap: 0.3125rem;
}

/* card item: gray when unchecked, white when checked */
.atc-related-item {
  display: flex;
  align-items: top;
  gap: 1rem;
  padding: 0.75rem 1rem;
  background: #ffffff;
  transition: background 0.12s, border-color 0.12s, opacity 0.12s;
}

.atc-related-item--checked {
  background: #fff;
  border-color: #c8c8c8;
  opacity: 1;
}

.atc-related-item:not(.atc-related-item--checked) {
  background: #e4e4e4;
  border-color: #d0d0d0;
  opacity: 0.8;
}

.atc-related-item:hover {
  border-color: #aaa;
}

/* checkbox */
.atc-related-checkbox-wrapper {
  flex: 0 0 auto;
}

.atc-related-checkbox-wrapper input[type="checkbox"] {
  display: none;
}

.atc-related-checkbox-wrapper label {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.2rem;
  height: 1.2rem;
  border: 1.5px solid #999;
  border-radius: 0.15625rem;
  cursor: pointer;
  transition: all 0.1s;
  position: relative;
}

.atc-related-checkbox-wrapper label::after {
  content: "";
  display: none;
  width: 0.4rem;
  height: 0.6rem;
  border: solid #fff;
  border-width: 0 1.5px 1.5px 0;
  transform: rotate(45deg);
  position: absolute;
  top: 2px;
}

.atc-related-checkbox-wrapper input:checked + label {
  background: #2fb5d2;
  border-color: #2fb5d2;
}

.atc-related-checkbox-wrapper input:checked + label::after {
  display: block;
}

.atc-related-item__image {
  flex: 0 0 auto;
}

.atc-related-item__image img {
  display: block;
  width: 150px;
  height: 150px;
  object-fit: cover;
}

.atc-related-item__info {
  flex: 1 1 auto;
  min-width: 0;
}

.atc-related-item__name {
	width:200px;
  display: block;
  font-weight: 500;
  font-size: 0.9rem;
  color: #000000;
  text-decoration: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  line-height: 1.2;
}

.atc-related-item__name:hover {
  color: #f79731;
}

.atc-related-item__price {
  font-size: 0.9rem;
  font-weight: 600;
  color: #f79731;
  margin-top: 0.0625rem;
}

/* ---- Footer ---- */
.atc-related-footer {
width:100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 1rem;
  padding-top: 0.6rem;
  border-top: 1px solid #ddd;
}

.atc-related-total {
  font-size: 0.9rem;
}

.atc-related-total-label {
  color: #000000;
}

.atc-related-total-price {
  font-weight: 700;
  font-size: 0.9rem;
  color: #f79731;
  margin-left: 0.125rem;
}

.atc-add-set {
	
}

/*
.atc-add-set {
  background: #000000;
  border: none;
  color: #fff;
  padding: 0.375rem 1rem;
  font-size: 0.9rem;
  border-radius: 20px;
  cursor: pointer;
  transition: background 0.12s;
}

.atc-add-set:hover {
  background: #444;
}

.atc-add-set:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}
*/

/* ---- Responsive ---- */
@media (max-width: 767px) {
  .atc-related-grid {
    grid-template-columns: 1fr;
    justify-items: center;
  }

  .atc-bundle-product {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    text-align: left;
  }

  .atc-bundle-product__image img {
    width: 200px;
    height: 200px;
  }

  .atc-bundle-product__info {
    margin-top: 0;
  }

  .atc-bundle-product__name {
    max-width: none;
  }

  .atc-related-column {
    width: 100%;
  }

  .atc-related-footer {
    flex-direction: column;
    text-align: center;
  }

  .atc-add-set {
    width: 100%;
  }
}


.atc-jump-wrapper:hover{
	background-color:#f9f9f6;
}