.xoo-cp-modal {
  position: fixed;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0.6rem;
  opacity: 0;
  z-index: 800;
  background-color: rgb(var(--color-surface-dark-rgb) / 0.75);
  pointer-events: none;
  backdrop-filter: blur(0.6rem);
  transition: var(--duration-normal);
  visibility: hidden;
}
.xoo-cp-modal.xoo-cp-active {
  opacity: 1;
  pointer-events: auto;
  visibility: visible;
}

.xoo-cp-container {
  width: min(100%, 70rem);
  overflow: hidden;
  border-radius: 2.6rem;
  position: relative;
  padding: 2.8rem 0.6rem 0.6rem;
  transform: translateY(2.8rem);
  color: var(--color-text-light);
  border: 0.1rem solid rgb(var(--color-text-light-rgb) / 0.2);
}

.xoo-cp-container .xoo-cp-outer {
  position: fixed;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  z-index: 20;
  display: none;
}
.xoo-cp-container .xoo-cp-outer .xoo-cp-cont-opac {
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  background-color: rgb(var(--color-surface-rgb) / 0.2);
  backdrop-filter: blur(0.6rem);
  transition: var(--duration-normal);
}
@keyframes xoo-cp-preloader {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}
.xoo-cp-container .xoo-cp-outer .xoo-cp-preloader {
  animation: xoo-cp-preloader 2s linear infinite;
  display: flex;
  flex-shrink: 0;
}
.xoo-cp-container .xoo-cp-outer .xoo-cp-preloader .icon {
  width: 2.4rem;
  height: 2.4rem;
}

.xoo-cp-container .xoo-cp-content {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  width: 100%;
}
.xoo-cp-container .xoo-cp-content .xoo-cp-atcn {
  display: block;
  text-align: center;
  margin-bottom: 2.4rem;
  font-size: var(--font-size-md);
  line-height: var(--line-height-none);
  opacity: var(--opacity-70);
}

.xoo-cp-container .xoo-cp-content .xoo-cp-atcn.xoo-cp-success {
}

.xoo-cp-container .xoo-cp-content .xoo-cp-pdetails {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  width: 100%;
  background-color: rgb(var(--color-surface-light-rgb) / 0.12);
  border-radius: 2.6rem;
  padding: 2rem;
}
.xoo-cp-container .xoo-cp-content .xoo-cp-pdetails tbody {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  width: 100%;
}
.xoo-cp-container .xoo-cp-content .xoo-cp-pdetails tbody tr {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  width: 100%;
}
.xoo-cp-container .xoo-cp-content .xoo-cp-pdetails .xoo-cp-pdetails__heading {
  display: flex;
  justify-content: flex-start;
  flex-direction: row;
  align-items: flex-start;
  width: 100%;
  gap: 2rem;
}
.xoo-cp-container .xoo-cp-content .xoo-cp-pdetails .xoo-cp-pimg {
  border-radius: 50%;
  width: 25%;
  position: relative;
  overflow: hidden;
  flex-shrink: 0;
  aspect-ratio: 1/1;
}
.xoo-cp-container .xoo-cp-content .xoo-cp-pdetails .xoo-cp-pimg a {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.xoo-cp-container
  .xoo-cp-content
  .xoo-cp-pdetails
  .xoo-cp-pimg
  a
  .attachment-woocommerce_thumbnail,
.xoo-cp-container
  .xoo-cp-content
  .xoo-cp-pdetails
  .xoo-cp-pimg
  a
  .woocommerce-placeholder {
  position: absolute;
  left: 0%;
  top: 0%;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}
.xoo-cp-container .xoo-cp-content .xoo-cp-pdetails .xoo-cp-pdetails__info {
  flex-shrink: 1;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: stretch;
}
.xoo-cp-container .xoo-cp-content .xoo-cp-pdetails .xoo-cp-ptitle {
  display: block;
}
.xoo-cp-container .xoo-cp-content .xoo-cp-pdetails .xoo-cp-ptitle a {
  display: block;
  line-height: var(--line-height-dense);
  font-size: var(--font-size-sm);
}
.xoo-cp-container .xoo-cp-content .xoo-cp-pdetails .xoo-cp-variations {
  margin-top: 0.8rem;
  display: flex;
  flex-direction: column;
  width: 100%;
  gap: 0.6rem;
  align-items: stretch;
}
.xoo-cp-container
  .xoo-cp-content
  .xoo-cp-pdetails
  .xoo-cp-variations
  .variation {
  display: flex;
  flex-direction: row;
  gap: 0.6rem;
  font-size: var(--font-size-xs);
}
.xoo-cp-container
  .xoo-cp-content
  .xoo-cp-pdetails
  .xoo-cp-variations
  .variation
  dt {
}
.xoo-cp-container
  .xoo-cp-content
  .xoo-cp-pdetails
  .xoo-cp-variations
  .variation
  dd {
}
.xoo-cp-container .xoo-cp-content .xoo-cp-pdetails .xoo-cp-pprice {
  margin-top: 1.2rem;
}
.xoo-cp-container .xoo-cp-content .xoo-cp-pdetails .xoo-cp-pprice .amount {
  font-size: var(--font-size-md);
  display: block;
  line-height: var(--line-height-none);
}
.xoo-cp-container .xoo-cp-content .xoo-cp-pdetails .xoo-cp-pprice .amount bdi {
}

.xoo-cp-container .xoo-cp-content .xoo-cp-pdetails .xoo-cp-pdetails__info .gap {
  flex-grow: 1;
  display: flex;
}

.xoo-cp-container .xoo-cp-content .xoo-cp-pdetails .xoo-cp-pqty {
  margin-top: 2rem;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.6rem;
}
.xoo-cp-container .xoo-cp-content .xoo-cp-pdetails .xoo-cp-pqty .xoo-cp-qtybox {
  display: flex;
  flex-direction: row;
  align-items: center;
  border: 0.1rem solid rgb(var(--color-text-light-rgb) / 0.2);
  border-radius: 20rem;
  overflow: hidden;
  position: relative;
  height: 4.4rem;
  padding: 0.2rem;
}
.xoo-cp-container .xoo-cp-content .xoo-cp-pdetails .xoo-cp-pqty .xcp-chng {
  width: 4rem;
  height: 4rem;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  cursor: pointer;
  position: relative;
}
.xoo-cp-container
  .xoo-cp-content
  .xoo-cp-pdetails
  .xoo-cp-pqty
  .xcp-chng:before {
  content: '';
  position: absolute;
  top: 0.6rem;
  bottom: 0.6rem;
  width: 0.1rem;
  background-color: rgb(var(--color-text-light-rgb) / 0.12);
}
.xoo-cp-container
  .xoo-cp-content
  .xoo-cp-pdetails
  .xoo-cp-pqty
  .xcp-chng.xcp-minus:before {
  right: 0;
}
.xoo-cp-container
  .xoo-cp-content
  .xoo-cp-pdetails
  .xoo-cp-pqty
  .xcp-chng.xcp-plus:before {
  left: 0;
}
.xoo-cp-container
  .xoo-cp-content
  .xoo-cp-pdetails
  .xoo-cp-pqty
  .xcp-chng
  .icon {
  width: 1.2rem;
  height: 1.2rem;
}
.xoo-cp-container .xoo-cp-content .xoo-cp-pdetails .xoo-cp-pqty .xoo-cp-qty {
  width: 5.2rem;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  height: 4rem;
  font-size: var(--font-size-sm);
  -moz-appearance: textfield;
  position: relative;
}
.xoo-cp-container
  .xoo-cp-content
  .xoo-cp-pdetails
  .xoo-cp-pqty
  .xoo-cp-qty::-webkit-outer-spin-button,
.xoo-cp-container
  .xoo-cp-content
  .xoo-cp-pdetails
  .xoo-cp-pqty
  .xoo-cp-qty::-webkit-inner-spin-button {
  -webkit-appearance: none;
}
.xoo-cp-container
  .xoo-cp-content
  .xoo-cp-pdetails
  .xoo-cp-pqty
  .xoo-cp-remove-pd {
  background-color: var(--color-primary);
  position: relative;
  border-radius: 20rem;
  width: 4rem;
  height: 4rem;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  flex-shrink: 0;
}
.xoo-cp-container
  .xoo-cp-content
  .xoo-cp-pdetails
  .xoo-cp-pqty
  .xoo-cp-remove-pd
  .icon {
  color: var(--color-on-primary);
  width: 1.2rem;
  height: 1.2rem;
}
.xoo-cp-container .xoo-cp-content .xoo-cp-ptotal {
  display: none;
}

.xoo-cp-container .xoo-cp-btns {
  margin-top: 0.6rem;
  display: flex;
  width: 100%;
  align-items: stretch;
  justify-content: space-between;
  gap: 0.6rem;
}
.xoo-cp-container .xoo-cp-btns .xcp-btn {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 5.2rem;
  width: 100%;
  border-radius: 20rem;
  background-color: var(--color-primary);
  color: var(--color-on-primary);
  font-size: var(--font-size-xs);
  padding: 0 1.2rem;
  transition: var(--duration-normal);
  line-height: var(--line-height-none);
}
.xoo-cp-container .xoo-cp-btns .xcp-btn:hover {
  opacity: var(--opacity-70);
}
/*.xoo-cp-container .xoo-cp-btns .xcp-btn.xoo-cp-close {
    width: 4rem;
    font-size: 1.8rem;
}
.xoo-cp-container .xoo-cp-btns .xcp-btn.xoo-cp-close:before {
    content: '\E85C';
    font-family: 'Fontello';
}
.xoo-cp-container .xoo-cp-btns .xcp-btn.xoo-cp-btn-vc {
    font-size: 1.4rem;
    font-weight: 700;
    padding: 0 3.6rem;
}*/

.xoo-cp-notice-box {
}