/* ******************************************** */
/** COMPONENTS: PRODUCT
/* ******************************************** */

/* INFO */

.c-product-info__category {
  display: inline-block;
  font-size: clamp(1.6em, 1.1vw, 1.7em);
  color: var(--color-primary);
  text-transform: uppercase;
  font-weight: 700;
  margin-bottom: 0.6em;
}
@media (hover: hover) {
  .c-product-info__category:is(:hover, :focus) {
    color: var(--color-secondary);
  }
}

.c-product-info__heading {
  font-size: clamp(2.8em, 2.3vw, 4em);
  font-weight: 700;
}

.c-product-info-sku {
  font-size: 1.2rem;
  color: var(--color-grey-500);
  margin-top: 1rem;
  font-weight: bold;
}

.c-product-info-brand {
  font-size: 1.8rem;
  color: var(--color-grey-500);
  font-weight: bold;
  margin-top: 1rem;
}

.c-product-info__sku {
  font-size: 1.5em;
  text-transform: uppercase;
  margin-top: 0.6em;
  color: var(--color-grey-700);
}

.c-product-info__description {
  margin-top: 1.4em;
  font-size: clamp(1.6em, 1.3vw, 2em);
  font-weight: 700;
}

.c-product-info__price {
  display: flex;
  align-items: center;
  gap: 13px;
  margin-top: var(--space-x);
}

@media (max-width: 375px) {
  .c-product-info__price {
    flex-wrap: wrap;
  }
}

.c-product-info__num {
  font-weight: 900;
  font-size: clamp(1.8rem, 1.5vw, 2.2em);
}
.c-product-info__promo {
  padding: 0.3em 0.6em;
  background-color: var(--color-secondary);
  color: var(--color-white);
  font-size: 1.1em;
  text-transform: uppercase;
  font-weight: 900;
}

.c-product-info__actions {
  margin-top: calc(var(--space-x) * 1.5);
  font-size: clamp(1.6rem, 1.3vw, 1.8em);
}
.c-product-info__btn {
  width: 100%;
  font-weight: 600;
  padding-top: 10px;
  padding-bottom: 10px;
  background-color: var(--color-primary);
  color: var(--color-white);
}

@media (hover: hover) {
  .c-product-info__btn:is(:hover, :focus) {
    background-color: var(--color-secondary);
  }
}
.c-product-info:not(.c-products-item--nostock, .in-cart) .c-product-info__btn {
  border: 1px solid rgb(57 169 99 / 38%);
}
button.c-product-info__btn {
  padding-left: 14px;
  padding-right: 14px;
  transition: background-color 250ms ease-out, color 250ms ease-out;
}

.c-product-info__btn--added {
  opacity: 0.4;
}
.c-product-info__btn--nostock {
  color: var(--color-error);
}

/* Slider */

.c-product__slider {
  position: relative;
  background-color: var(--color-grey-200);
  border: 1px solid var(--color-grey-200);
  margin-bottom: calc(var(--space-x) * 2);

  box-shadow: 0 0 16px 11px #f8f8f8;
}
.c-product__pic {
  position: relative;
}
.c-product__pic:before {
  content: "";
  display: block;
  width: 100%;
  height: 0;
  padding-bottom: 100%;
}

/* Content */

.c-product__content {
  margin-top: calc(var(--space-x) * 1.5);
  padding: calc(var(--space-x) * 1.5);
  background-color: var(--color-grey-100);
}

/* Related */

.c-product-related__title {
  font-size: clamp(2.8rem, 2.3vw, 4rem);
}

.c-product-item__image {
  display: none !important;
}
.c-product-item__image.is-showing {
  display: block !important;
}

/* Btns */

.in-cart.c-product-info__btn,
.c-products-item__btn--added {
  display: none;
}

.in-cart ~ .c-products-item__btn--added {
  display: block;
}

/* Colors */

.c-products-item__colors {
  margin-top: 20px;
}
.c-products-item__color {
  display: inline-block;
  vertical-align: middle;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  margin-right: 5px;
  border: 1px solid var(--color-grey-200);
}
.c-products-item__color.is-disabled {
  opacity: 0.3;
}

/* ********************** TALL MOBILE PORTRAIT ********************** */

@media (max-width: 767px) and (min-height: 730px) {
}

/* ********************** MOBILE LANDSCAPE ********************** */

@media (orientation: landscape) and (min-width: 500px) and (max-width: 767px) {
}

/* ********************** de Mobile a TABLET ********************** */

@media (min-width: 768px) {
  .c-product__slider {
    margin-bottom: 0;
  }
  .c-product__holder {
    display: flex;
    flex-wrap: nowrap;
    gap: calc(var(--space-x) * 1.5);
    align-items: center;
  }
  .c-product__holder > * {
    width: 50%;
  }

  .c-product-info__btn {
    width: auto;
  }
}

/* ********************** de Tablet a DESKTOP ********************** */

@media (min-width: 980px) {
}

/* ********************** de Desktop a DESKTOP 2 ********************** */

@media (min-width: 1200px) {
}
@media (min-width: 1200px) and (min-height: 720px) {
}

/* ********************** de Desktop 2 a HD ********************** */

@media (min-width: 1400px) {
}
@media (min-width: 1400px) and (min-height: 790px) {
}

/* ********************** de Hd a FULL HD ********************** */

@media (min-width: 1600px) {
}
@media (min-width: 1600px) and (min-height: 790px) {
}
@media (min-width: 1600px) and (min-height: 900px) {
}

@media (min-width: 1800px) {
}

/* ********************** 4K ********************** */

@media (min-width: 2048px) {
}
