.single-product {
  overflow-x: hidden;
}

.single-product .docomo-product-contact-section > div {
  padding: 0;
  background: none;
}

/* Two-title approach: mobile title on image, desktop title in summary */
.single-product .woocommerce-product-gallery {
  position: relative;
  overflow: visible;
}

@media (max-width: 768px) {
  .single-product .docomo-title-desktop {
    display: none !important;
  }

  .single-product .woocommerce-product-gallery__trigger {
    top: 0.25rem !important;
  }
}

.docomo-title-mobile {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin: 0;
  padding: 1rem 1.25rem;
  z-index: 10;
}

@media (min-width: 769px) {
  .single-product .docomo-title-mobile {
    display: none !important;
  }

  .single-product .docomo-title-desktop {
    display: block !important;
  }
}

@media (min-width: 992px) {
  .single-product .woocommerce-product-gallery {
    position: static;
  }
}

.docomo-purchase-options {
  border-top: 1px solid #d3d3d3;
  padding-top: 1.5rem;
}

.single-product form.cart .single_add_to_cart_button {
  display: none !important;
}

.single-product form.cart .quantity {
  display: none !important;
}

.single-product .reset_variations {
  display: none !important;
}

.single-product .woocommerce-variation.single_variation {
  display: none !important;
}

/* Split decimal styling for large selected price */
.docomo-po-cents {
  font-size: 0.4em;
  vertical-align: super;
}

.docomo-color-swatch {
  border: 1px solid transparent;
}

.docomo-color-swatch[data-selected='true'] {
  border-color: #1f2937;
}

.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item).color-variable-item,
.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item).color-variable-item .variable-item-contents {
  width: 44px !important;
  height: 44px !important;
}

.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item).color-variable-item:not(.selected) {
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
}

.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item).color-variable-item .variable-item-span-color,
.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item).color-variable-item .variable-item-contents {
  border-radius: 100% !important;
  width: 20px !important;
  height: 20px !important;
  border: 1px solid #9ca3af !important;
}

/* Button swatches (Capacity, Service Type) */
.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item).button-variable-item {
  /* background-color: #dddddd !important; */
  background-color: rgb(238, 238, 238) !important;
  color: #000000 !important;
  border: 1px solid transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  font-size: 18px !important;
  height: auto !important;
}

.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item).button-variable-item .variable-item-contents {
  padding: 4px 16px !important;
}

.woo-variation-swatches
  .variable-items-wrapper
  .variable-item:not(.radio-variable-item).button-variable-item.disabled
  .variable-item-contents::before,
.woo-variation-swatches
  .variable-items-wrapper
  .variable-item:not(.radio-variable-item).button-variable-item.disabled:hover
  .variable-item-contents::before {
  display: none !important;
}

.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item).button-variable-item.selected,
.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item).button-variable-item.selected:hover {
  background-color: transparent !important;
  color: #d1223e !important;
  border: 1px solid #d1223e !important;
  box-shadow: none !important;
  border-radius: 0 !important;
}

.woo-variation-swatches
  .variable-items-wrapper
  .variable-item:not(.radio-variable-item).color-variable-item
  .variable-item-contents::before,
.woo-variation-swatches
  .variable-items-wrapper
  .variable-item:not(.radio-variable-item).color-variable-item
  .variable-item-contents::after {
  display: none !important;
}

.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item).color-variable-item.selected,
.woo-variation-swatches .variable-items-wrapper .variable-item:not(.radio-variable-item).color-variable-item.selected:hover {
  box-shadow: none !important;
  border: 1px solid #d1223e !important;
  border-radius: 0 !important;
}

.woocommerce-Price-currencySymbol {
  display: inline-block;
  width: 20px;
  text-align: center;
}
