/* fonts */
@font-face {
    font-family: 'DMSans-Medium';
    src: url('../fonts/DMSans-Medium.eot');
    src: url('../fonts/DMSans-Medium.eot?#iefix') format('embedded-opentype'),
        url('../fonts/DMSans-Medium.woff2') format('woff2'),
        url('../fonts/DMSans-Medium.woff') format('woff'),
        url('../fonts/DMSans-Medium.ttf') format('truetype'),
        url('../fonts/DMSans-Medium.svg#DMSans-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'DMSans-Light';
    src: url('../fonts/DMSans-Light.eot');
    src: url('../fonts/DMSans-Light.eot?#iefix') format('embedded-opentype'),
        url('../fonts/DMSans-Light.woff2') format('woff2'),
        url('../fonts/DMSans-Light.woff') format('woff'),
        url('../fonts/DMSans-Light.ttf') format('truetype'),
        url('../fonts/DMSans-Light.svg#DMSans-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'DMSans-Regular';
    src: url('../fonts/DMSans-Regular.eot');
    src: url('../fonts/DMSans-Regular.eot?#iefix') format('embedded-opentype'),
        url('../fonts/DMSans-Regular.woff2') format('woff2'),
        url('../fonts/DMSans-Regular.woff') format('woff'),
        url('../fonts/DMSans-Regular.ttf') format('truetype'),
        url('../fonts/DMSans-Regular.svg#DMSans-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'DMSans-Bold';
    src: url('../fonts/DMSans-Bold.eot');
    src: url('../fonts/DMSans-Bold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/DMSans-Bold.woff2') format('woff2'),
        url('../fonts/DMSans-Bold.woff') format('woff'),
        url('../fonts/DMSans-Bold.ttf') format('truetype'),
        url('../fonts/DMSans-Bold.svg#DMSans-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'DMSans-SemiBold';
    src: url('../fonts/DMSans-SemiBold.eot');
    src: url('../fonts/DMSans-SemiBold.eot?#iefix') format('embedded-opentype'),
        url('../fonts/DMSans-SemiBold.woff2') format('woff2'),
        url('../fonts/DMSans-SemiBold.woff') format('woff'),
        url('../fonts/DMSans-SemiBold.ttf') format('truetype'),
        url('../fonts/DMSans-SemiBold.svg#DMSans-SemiBold') format('svg');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}



/* fonts */

/* Registation Form Styling */

form#custom-registration-form {
    display: flex;
    flex-direction: column;
    width: 100%;
}

#custom-registration-form .form-group input, #custom-registration-form .form-group select {
    width: 100% !important;
    margin-bottom: 20px !important;
}
.terms-check{
    display: inline-flex;
    width: auto;
    white-space: nowrap;
    justify-content: center;
    align-items: baseline;
    gap: 5px;
}

/* Basic Modal Styling */

.greeting-card-group, .template-group {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    margin-top: 20px;
    margin-bottom: 10px;
}

.field-wrapper {
    width: 100%;
}

.error-message {
    color: red;
    font-size: 14px;
    margin-top: 5px;
  }

input.error {
	border: 1px solid red;
}

#cpc-digital-modal {
    display: none;
    position: fixed;
    z-index: 9999;
    left: 0; top: 0;
    width: 100%;
    height: 100%;
}

.cpc-modal-overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.6);
}

.cpc-modal-content {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
    max-height: 80vh;
    min-height: 40px;
    border-radius: 7px;
    background-color: #fff;
    overflow-y: auto;
    border: 2px solid #000;
}

.cpc-modal-close {
    background: transparent !important;
    border: none;
    font-size: 24px;
    cursor: pointer;
    padding: 0 !important;
}

.cpc-digital-grid {
    display: flex;
    gap: 20px;
}

.box-cpc{
    padding: 20px;
}

.cpc-digital-grid .cpc-preview {
    width: 60%;
}

.cpc-preview-note textarea {
    width: 90%;
    padding: 10px;
    font-size: 14px;
}

.cpc-preview-product-info {
    width: 50%;
    position: relative;
}

.cpc-preview-product-info img {
    width: 96.5%;
    height: auto;
    margin-left: 15px;
}

.cpc-digital-grid .cpc-preview span.woocommerce-Price-amount.amount {
    font-family: 'DMSans-Regular' !important;
    font-size: 12px !important;
}

.cpc-preview-product-info .product-meta {
    display: flex;
    align-items: center;
    padding-top: 10px;
    width: 100%;
    justify-content: space-between;
    flex-wrap: wrap;
}

.cpc-preview-product-info .product-meta p {
    margin: 0 !important;
}

div#selected-template-preview {
    width: 100%;
}

.cpc-cart-model .cpc-preview {
    width: 100%;
}
.cpc-cart-model .product-meta {
    flex-direction: column;
    padding: 0 !important;
}
.cpc-cart-model .product-meta p{
    position: absolute;
    top: 50%;
}
.cpc-cart-model .cpc-preview-product-info .product-meta .productPrice {
    top: 60%;
    padding: 0;
}
.preview-pdf-button {
    font-weight: 700 !important;
    background: #26d5ac;
    padding: 5px;
    color: #000 !important;
    border-radius: 12px;
    margin-left: 8px;
}
.cpc-cart-model .cpc-preview-note.preview-main-wrap {
    justify-content: flex-start;
    align-items: flex-start;
}
/* div#selected-template-preview img {
    height: 126px;
    width: 100% !important;
    object-fit: cover;
} */

/* .cpc-bottom-image img{
    height: 126px !important;
} */

button.cpc-next-step {
    width: 100% !important;
    text-align: center;
    background-color: rgb(38, 213, 172) !important;
    color: rgb(0, 0, 0) !important;
    padding: 16px;
    font-weight: 600 !important;
    border-radius: 30px !important;
    border: 3px solid #000 !important;
    font-family: 'DMSans-SemiBold' !important;
    letter-spacing: 0px !important;
    margin-top: 0px !important;
    margin-bottom: 0 !important;
}
.TabMeta{
    padding-top: 50px;
}


.buttonPrevWrap button {
    width: 50% !important;
    text-align: center;
    background-color: rgb(38, 213, 172) !important;
    color: rgb(0, 0, 0) !important;
    padding: 16px;
    font-weight: 600 !important;
    border-radius: 30px !important;
    border: 3px solid #000 !important;
    font-family: 'DMSans-SemiBold' !important;
    letter-spacing: 0px;
    margin-bottom: 0 !important;
}

.buttonPrevWrap {
    display: flex;
    gap: 10px;
    padding-top: 10px;
}

button.cpc-prev-step.button {
    background-color: #000 !important;
    color: #fff !important;
}

.cpc-digital-grid .cpc-step {
    padding: 0 !important;
}

.product-meta span.price {
    margin: 0 !important;
    font-size: 15px !important;
    display: block !important;
}

.cpc-preview-product-info {
    flex-direction: column;
}

.cpc-digital-grid .cpc-templates {
    width: 40%;
}

.template-options {
    display: flex;
    justify-content: flex-start;
    width: 100%;
    gap: 50px 10px;
    flex-wrap: wrap;
    overflow-y: scroll;
    padding-top: 10px;
}

.template-option {
    cursor: pointer;
    text-align: center;
    border-radius: 5px;
    transition: 0.2s;
    width: 23.33%;
}

.digitalTitle{
    font-size: 16px;
    text-align: center !important;
    font-family: 'DMSans-Regular';
    font-weight: 400;
}

.template-option:hover {
    border-color: #000;
    background: #f9f9f9;
}

.templateActive {
    border-color: #000;
}

.template-option img {
    width: 100%;
    height: auto;
    display: block;
    margin: auto;
}

body.cpc-modal-open {
    overflow: hidden;
}

/* Modal content scrollable */

.preview-left-columns {
    display: flex;
    align-items: center;
    justify-content: space-between;
    align-items: stretch;
}

.preview-right-columns {
    display: flex;
    align-items: center;
    justify-content: space-between;
    align-items: stretch;
}

.preview-main-wrap {
    width: 50% !important;
    border: 1px dotted #e7e7e7;
    padding: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.preview-main-wrap img {
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    border-radius: 10px;
}

.cpc-preview-note textarea {
    width: 100% !important;
    height: 100% !important;
    resize: none;
    padding: 0 !important;
    border: none !important;
}


/* Physical CSS */

.card-options {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.card-option {
    overflow: hidden;
    cursor: pointer;
    width: 32.44%;
    position: relative;
    padding: 16px 8px;
    border: 2px solid transparent;
    border-radius: 6px;
}

.card-option img{
    width: 100% !important;
    border-radius: 5px !important;
}

.addon-option img{
    width: 100% !important;
    border-radius: 5px !important;
}

img {
    border-radius: 12px;
}

.activeCardOption {
    border-color: #000 !important;
}

.addon-options {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.addon-option {
    overflow: hidden;
    cursor: pointer;
    width: 32.44%;
    position: relative;
    padding: 16px 8px;
    border: 2px solid transparent;
    border-radius: 6px;
}

img {
    border-radius: 12px;
}

.activeAddonOption {
    border-color: #000 !important;
}

div#selected-item-preview {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
}

.extraThing {
    /* min-width: 400px; */
    display: flex;
    gap: 10px;
    width: 100% !important;
}



.imageWrapper img {
    height: 64px !important;
    width: 64px;
    border-radius: 5px !important;
    object-fit: cover;
}

.itemDesc {
    display: flex;
    justify-content: space-between;
    width: 85%;
    gap: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.metaWrapper p {
    margin: 0 !important;
}
.metaWrapper {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.metaWrapper .name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 16px;
    line-height: 20px;
    margin: 0;
    display: block;
    font-family: 'DMSans-SemiBold' !important;
    font-weight: 600;
    color: #1d1d1d !important;
}

.metaWrapper .prcie {
    font-size: 16px;
    line-height: 20px;
    margin: 0;
    display: block;
    font-family: 'DMSans-SemiBold' !important;
    font-weight: 600;
    color: #1d1d1d !important;
}

.activeCardOption .note {
    display: block !important;
}

.error {
    color: red;
}

/* #digital_product_templates, #physical_product_fields {
    width: 0px !important;
    height: 0px !important;
    opacity: 0 !important;
} */


/** css **/
.woocommerce-variation-add-to-cart{
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
    width: 100%;
}
.customize-btn{
    width: 50% !important;
    border-color: #1d1d1d !important;
    height: 64px !important;
    font-size: 14px !important;
    transition: .5s ease-in-out;
    background-color: transparent !important;
    color: #1d1d1d !important;
    font-family: 'DMSans-Regular' !important;
    text-transform: capitalize !important;
    box-shadow: 0 0 0 1px #000 !important;
    border-width: 1px !important;
    letter-spacing: 0px !important;
}
.customize-btn.active{
    background-color: #1d1d1d !important;
    color: #fff !important;
    font-family: 'DMSans-Medium' !important;
}

.customize-btn.active span{
    color: #fff !important;

}

.customize-btn:hover{
    background-color: #1d1d1d !important;
    color: #fff !important;
    font-family: 'DMSans-Medium' !important;
}
.customize-btn:hover span{
    color: #fff !important;
}

.customize-btn span{
    transition: .5s ease-in-out;
}
button#physical-customize-btn {
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
}

button#digital-customize-btn {
    border-bottom-right-radius: 10px;
    border-top-right-radius: 10px;
}
.template-select-button label.label {
    width: 100%;
    display: block;
    color: #1d1d1d;
    font-size: 16px;
    font-family: 'DMSans-Medium' !important;
}
.physical-button-metas {
    width: 100% !important;
    padding-bottom: 20px;
}
.gift_buttons {
    display: flex;
    gap: 20px;
    margin-top: 10px;
    padding-bottom: 20px;
}
.deleteItem {
    cursor: pointer;
}

.cardsBox {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 10px 32px;
    border: 2px solid #000 !important;
    border-radius: 10px;
    cursor: pointer;
    width: 100%;
    height: 90px;
    background-color: transparent !important;

}
.cardsBox:hover {
    background-color: #ededed !important;
}
.cardIcon {
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bolder;
    line-height: 0 !important;
    color: #1d1d1d !important;
}
.cardText p {
    margin: 0 !important;
    font-size: 12px;
    padding-top: 5px;
    color: #1d1d1d !important;
    font-family: 'DMSans-Medium';
    text-transform: capitalize;

}
.cardIcon svg {
    display: inline-block;
    height: 50px;
    overflow: hidden;
    vertical-align: middle;
    width: 50px;
}
.deleteItem svg {
    width: 20px;
    height: 14px;
}
.typeCart{
    display: block;
    width: 100%;
    margin-bottom: .625rem;
    font-family: 'DMSans-Medium' !important;
    color: #1d1d1d;
    font-size: 16px !important;
    font-weight: 500 !important;
}
.woocommerce-js div.product form.cart .variations label {
    display: block;
    width: 100%;
    margin-bottom: .625rem;
    font-family: 'DMSans-Medium' !important;
    color: #1d1d1d;
    font-size: 16px !important;
    font-weight: 500 !important;
}
select#choose-your-value {
    background-image: url(data:image/svg+xml;charset=utf-8;base64,PHN2ZyB3aWR0aD0iMTMiIGhlaWdodD0iOCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cGF0aCBkPSJNMS40MTQuMDg2IDcuOSA2LjU3IDYuNDg1IDcuOTg1IDAgMS41IDEuNDE0LjA4NloiIGZpbGw9IiMxZDFkMWQiLz48cGF0aCBkPSJNMTIuOTg1IDEuNTE1IDYuNSA4IDUuMDg1IDYuNTg2IDExLjU3MS4xMDFsMS40MTQgMS40MTRaIiBmaWxsPSIjMWQxZDFkIi8+PC9zdmc+);
    height: 64px !important;
    color: #1d1d1d;
    padding: .75rem !important;
    width: 100% !important;
    border: 1px solid rgba(29, 29, 29, 0.3) !important;
    border-radius: 5px !important;
    font-family: 'DMSans-Regular' !important;
    font-size: 16px !important;
    font-weight: 400 !important;
}
.woocommerce-js div.product form.cart .variations {
    border: none !important;
    margin: 0;
}
.description p {
    color: #1d1d1d;
    font-size: 16px;
    font-family: 'DMSans-Regular';
}
.digtalMap {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 10px 32px;
    border: 2px solid #000 !important;
    border-radius: 10px;
    cursor: pointer;
    width: 100%;
    height: 90px;
    background-color: transparent !important;
}

.digital-button-metas {
    width: 100%;
    padding-bottom: 20px;
}
.single_add_to_cart_button {
    width: 100% !important;
    border-radius: 30px !important;
    height: 60px !important;
    font-family: 'DMSans-Medium' !important;
    font-weight: 500 !important;
    font-size: 16px !important;
    background-color: #1d1d1d !important;
    border-color: #1d1d1d !important;
    margin: 0 auto !important;
}
.giftSelection {
    font-size: 16px;
    display: block;
    width: 100%;
    font-family: 'DMSans-Medium' !important;
    color: #1d1d1d !important;
}
.woocommerce-Price-amount.amount {
    color: #1d1d1d;
    font-family: 'DMSans-Medium';
    margin: 0 !important;
}
.woocommerce-variation.single_variation {
    margin-bottom: 0 !important;
}
.customPopupHeading {
    font-size: 24px;
    font-weight: 600;
    margin: 0 !important;
    font-family: 'DMSans-SemiBold';
}
.upperTabs {
    background-color: transparent !important;
    margin-right: 14px;
    align-items: center;
    border: 3px dashed #f6f6f6 !important;
    border-radius: 30px;
    display: inline-flex;
    gap: 8px;
    padding: 8px 6px;
    cursor: pointer;
    width: 20%;
}
.upperTabs svg{
    width: 27px !important;
    height: 27px !important;
}
.upperTabs.active {
    background-color: #000 !important;
    color: #fff;
    fill: #fff !important;
    border-style: solid;
    border-color: #000 !important;
}
.upperTabs.active .cardIcon{
    color: #fff !important;
}

.upperTabs.active .cardText p{
    color: #fff !important;
}
span.custom-checkbox {
    content: "";
    position: absolute;
    background-color: #ffffff;
    top: 0;
    left: 0;
    width: 22px;
    height: 22px;
    border-radius: 4px;
    border: 2px solid #000000;
}
.activeCardOption .custom-checkbox::after {
    content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 28" data-v-54a32c9a=""><g transform="translate(-70.075 -702.29)" data-v-54a32c9a=""><path fill="%23313131" stroke="%23313131" d="M10041.3-2300.3a1.36,1.36,0,0,1-.623-.379l-.016-.018-.113-.051a2.634,2.634,0,0,1-.25-.141,2.172,2.172,0,0,1-.228-.158c-.277-.216-.558-.43-.835-.646s-.559-.428-.831-.646-.543-.44-.8-.668-.518-.464-.763-.709c-.371-.372-.725-.763-1.083-1.149s-.717-.767-1.1-1.125a8.315,8.315,0,0,0-1.26-.979,6.393,6.393,0,0,0-1.545-.712.518.518,0,0,1-.105-.048.823.823,0,0,1-.1-.068l-.1-.085c-.038-.029-.078-.061-.126-.092-.03-.114-.063-.231-.1-.35s-.071-.245-.106-.372-.068-.255-.1-.389-.061-.267-.086-.406a1,1,0,0,1,.027-.435,2.037,2.037,0,0,1,.212-.474,3.923,3.923,0,0,1,.361-.491,5.726,5.726,0,0,1,.478-.483,5.883,5.883,0,0,1,.648-.512,3.716,3.716,0,0,1,.634-.354,2.037,2.037,0,0,1,.578-.163.985.985,0,0,1,.489.053c.182.075.361.156.533.241s.34.175.5.272a5.171,5.171,0,0,1,.47.306c.148.107.295.219.432.338q.6.521,1.187,1.057c.391.354.777.714,1.166,1.071s.777.719,1.166,1.076.788.712,1.189,1.059l.095.083c.1-.167.191-.332.289-.5.182-.306.365-.607.553-.908s.381-.595.575-.891l2.045-3.1q1.022-1.548,2.05-3.094t2.072-3.077q1.042-1.534,2.1-3.055.359-.514.762-1c.266-.326.546-.641.836-.95s.588-.607.894-.9.618-.573.937-.845a1.89,1.89,0,0,1,.788-.4,2.428,2.428,0,0,1,.9-.039,3.063,3.063,0,0,1,.895.262,2.952,2.952,0,0,1,.762.508,2.835,2.835,0,0,1,.611.813,2.608,2.608,0,0,1,.265.935,2.61,2.61,0,0,1-.093.971,2.821,2.821,0,0,1-.473.928c-.255.338-.515.67-.777,1s-.527.661-.793.988-.532.656-.8.984-.535.656-.8.984l-.22-.17q-1.252,1.906-2.5,3.811t-2.5,3.808l-2.5,3.806q-1.25,1.906-2.5,3.808c-.076.117-.154.233-.232.352s-.156.233-.24.347-.166.226-.255.333a3.777,3.777,0,0,1-.282.309,2.022,2.022,0,0,1-.651.41,2.706,2.706,0,0,1-.8.182c-.061,0-.121.007-.181.007A2.2,2.2,0,0,1,10041.3-2300.3Z" transform="translate(-9960.031 3028.814)" stroke-miterlimit="10" stroke-width="1.8" data-v-54a32c9a=""></path></g></svg>');
    position: absolute;
    width: 25px;
    height: 25px;
    line-height: 0;
    top: -7px;
    left: 1px;
}
.templateActive .custom-checkbox::after {
    content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 28" data-v-54a32c9a=""><g transform="translate(-70.075 -702.29)" data-v-54a32c9a=""><path fill="%23313131" stroke="%23313131" d="M10041.3-2300.3a1.36,1.36,0,0,1-.623-.379l-.016-.018-.113-.051a2.634,2.634,0,0,1-.25-.141,2.172,2.172,0,0,1-.228-.158c-.277-.216-.558-.43-.835-.646s-.559-.428-.831-.646-.543-.44-.8-.668-.518-.464-.763-.709c-.371-.372-.725-.763-1.083-1.149s-.717-.767-1.1-1.125a8.315,8.315,0,0,0-1.26-.979,6.393,6.393,0,0,0-1.545-.712.518.518,0,0,1-.105-.048.823.823,0,0,1-.1-.068l-.1-.085c-.038-.029-.078-.061-.126-.092-.03-.114-.063-.231-.1-.35s-.071-.245-.106-.372-.068-.255-.1-.389-.061-.267-.086-.406a1,1,0,0,1,.027-.435,2.037,2.037,0,0,1,.212-.474,3.923,3.923,0,0,1,.361-.491,5.726,5.726,0,0,1,.478-.483,5.883,5.883,0,0,1,.648-.512,3.716,3.716,0,0,1,.634-.354,2.037,2.037,0,0,1,.578-.163.985.985,0,0,1,.489.053c.182.075.361.156.533.241s.34.175.5.272a5.171,5.171,0,0,1,.47.306c.148.107.295.219.432.338q.6.521,1.187,1.057c.391.354.777.714,1.166,1.071s.777.719,1.166,1.076.788.712,1.189,1.059l.095.083c.1-.167.191-.332.289-.5.182-.306.365-.607.553-.908s.381-.595.575-.891l2.045-3.1q1.022-1.548,2.05-3.094t2.072-3.077q1.042-1.534,2.1-3.055.359-.514.762-1c.266-.326.546-.641.836-.95s.588-.607.894-.9.618-.573.937-.845a1.89,1.89,0,0,1,.788-.4,2.428,2.428,0,0,1,.9-.039,3.063,3.063,0,0,1,.895.262,2.952,2.952,0,0,1,.762.508,2.835,2.835,0,0,1,.611.813,2.608,2.608,0,0,1,.265.935,2.61,2.61,0,0,1-.093.971,2.821,2.821,0,0,1-.473.928c-.255.338-.515.67-.777,1s-.527.661-.793.988-.532.656-.8.984-.535.656-.8.984l-.22-.17q-1.252,1.906-2.5,3.811t-2.5,3.808l-2.5,3.806q-1.25,1.906-2.5,3.808c-.076.117-.154.233-.232.352s-.156.233-.24.347-.166.226-.255.333a3.777,3.777,0,0,1-.282.309,2.022,2.022,0,0,1-.651.41,2.706,2.706,0,0,1-.8.182c-.061,0-.121.007-.181.007A2.2,2.2,0,0,1,10041.3-2300.3Z" transform="translate(-9960.031 3028.814)" stroke-miterlimit="10" stroke-width="1.8" data-v-54a32c9a=""></path></g></svg>');
    position: absolute;
    width: 25px;
    height: 25px;
    line-height: 0;
    top: -7px;
    left: 1px;
}
.activeAddonOption .custom-checkbox::after {
    content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 30 28" data-v-54a32c9a=""><g transform="translate(-70.075 -702.29)" data-v-54a32c9a=""><path fill="%23313131" stroke="%23313131" d="M10041.3-2300.3a1.36,1.36,0,0,1-.623-.379l-.016-.018-.113-.051a2.634,2.634,0,0,1-.25-.141,2.172,2.172,0,0,1-.228-.158c-.277-.216-.558-.43-.835-.646s-.559-.428-.831-.646-.543-.44-.8-.668-.518-.464-.763-.709c-.371-.372-.725-.763-1.083-1.149s-.717-.767-1.1-1.125a8.315,8.315,0,0,0-1.26-.979,6.393,6.393,0,0,0-1.545-.712.518.518,0,0,1-.105-.048.823.823,0,0,1-.1-.068l-.1-.085c-.038-.029-.078-.061-.126-.092-.03-.114-.063-.231-.1-.35s-.071-.245-.106-.372-.068-.255-.1-.389-.061-.267-.086-.406a1,1,0,0,1,.027-.435,2.037,2.037,0,0,1,.212-.474,3.923,3.923,0,0,1,.361-.491,5.726,5.726,0,0,1,.478-.483,5.883,5.883,0,0,1,.648-.512,3.716,3.716,0,0,1,.634-.354,2.037,2.037,0,0,1,.578-.163.985.985,0,0,1,.489.053c.182.075.361.156.533.241s.34.175.5.272a5.171,5.171,0,0,1,.47.306c.148.107.295.219.432.338q.6.521,1.187,1.057c.391.354.777.714,1.166,1.071s.777.719,1.166,1.076.788.712,1.189,1.059l.095.083c.1-.167.191-.332.289-.5.182-.306.365-.607.553-.908s.381-.595.575-.891l2.045-3.1q1.022-1.548,2.05-3.094t2.072-3.077q1.042-1.534,2.1-3.055.359-.514.762-1c.266-.326.546-.641.836-.95s.588-.607.894-.9.618-.573.937-.845a1.89,1.89,0,0,1,.788-.4,2.428,2.428,0,0,1,.9-.039,3.063,3.063,0,0,1,.895.262,2.952,2.952,0,0,1,.762.508,2.835,2.835,0,0,1,.611.813,2.608,2.608,0,0,1,.265.935,2.61,2.61,0,0,1-.093.971,2.821,2.821,0,0,1-.473.928c-.255.338-.515.67-.777,1s-.527.661-.793.988-.532.656-.8.984-.535.656-.8.984l-.22-.17q-1.252,1.906-2.5,3.811t-2.5,3.808l-2.5,3.806q-1.25,1.906-2.5,3.808c-.076.117-.154.233-.232.352s-.156.233-.24.347-.166.226-.255.333a3.777,3.777,0,0,1-.282.309,2.022,2.022,0,0,1-.651.41,2.706,2.706,0,0,1-.8.182c-.061,0-.121.007-.181.007A2.2,2.2,0,0,1,10041.3-2300.3Z" transform="translate(-9960.031 3028.814)" stroke-miterlimit="10" stroke-width="1.8" data-v-54a32c9a=""></path></g></svg>');
    position: absolute;
    width: 25px;
    height: 25px;
    line-height: 0;
    top: -7px;
    left: 1px;
}
.productImageBox{
    position: relative;
}
.productImage{
    position: relative;
}
.customPopupMeta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: sticky;
    top: 0;
    z-index: 9999;
    background-color: #fff !important;
    padding: 12px;
}
.button_wrap {
    display: flex;
    padding-left: 29px;
    position: sticky;
    top: 57px !important;
    background-color: #fff;
    z-index: 999;
    padding-bottom: 6px;
}
.cpc-step {
    padding: 20px;
}

p.productTitle {
    font-family: 'DMSans-SemiBold';
    color: #1d1d1d !important;
    font-weight: 600;
    font-size: 16px;
    line-height: 20px;
    margin: 0 !important;
    padding: 6px 0;
}

.productPrice {
    font-family: 'DMSans-SemiBold';
    color: #1d1d1d !important;
    font-weight: 600;
    font-size: 16px;
    line-height: 20px;
    padding-bottom: 6px;
    margin: 0 !important;
}

.updateWrapper {
    padding: 16px 16px 16px 16px;
    position: sticky;
    z-index: 9;
    background-color: #ededed;
    bottom: 0;
    box-shadow: 0 -3px 6px rgba(0, 0, 0, .16);
    width: 100% !important;
}

.things-add-to-product{
    width: 100%;
    text-align: center;
    background-color: rgb(38, 213, 172) !important;
    color: #1d1d1d;
    padding: 16px;
    font-weight: 700;
    border-radius: 30px;
    border: 3px solid #000;
    font-family: 'DMSans-Bold';
    letter-spacing: 0px;
}

.things-add-to-product:hover{
    border-color: #000 !important;
    color: rgb(0, 0, 0) !important;
    
}

.things-add-to-product.disabled {
    background-color: #a8a8a8 !important;
    border: 1px solid #a8a8a8 !important;
    cursor: default !important;
    pointer-events: none !important;
}

.update-physical-card{
    width: 100%;
    text-align: center;
    background-color: rgb(38, 213, 172) !important;
    color: rgb(0, 0, 0);
    padding: 16px;
    font-weight: 600;
    border-radius: 6px;
    border: 3px solid #000 !important;
    font-family: 'DMSans-SemiBold';
    letter-spacing: 0px;
}

.update-physical-card:hover{
    border-color: #000 !important;
    color: rgb(0, 0, 0) !important;
    
}

.update-physical-card.disabled {
    background-color: #a8a8a8 !important;
    border: 1px solid #a8a8a8 !important;
    cursor: default !important;
    pointer-events: none !important;
}

.greeting-container {
    position: relative;
    margin-bottom: 15px;
    display: none;
    width: 100%;
    border: 2px solid #000;
    padding: 10px;
    border-radius: 8px;
    padding-top: 15px;
    margin: 0;
}
.greeting-container label {
    color: #a8a8a8;
    pointer-events: none;
    position: absolute;
    transform: translate3d(0, 0, 0) scale(1);
    transform-origin: left top;
    transition: transform ease 0.2s;
    font-size: 16px;
    font-family: 'DMSans-Regular';
}

textarea.greeting-message {
    width: 100%;
    /* border: 2px solid #000; */
    display: block;
    padding: 0 !important;
    border: none !important;
    outline: none !important;
    box-shadow: unset !important;
    background: none;
    resize: none;
    height: 10rem !important;
    font-family: 'DMSans-Regular';
}

.greeting-container.exceeded {
    border: 1px solid red;
}
p#counter.exceeded {
    color: red !important;
}
.greeting-container.is-focused label {
    transform: translateY(-13px) scale(0.65);
}

p.show_addon_details {
    text-decoration: underline !important;
    padding-bottom: 10px !important;
    margin-bottom: 0 !important;
    font-family: 'DMSans-Regular';
    color: #1d1d1d;
    font-size: 16px;
}

.addon-option .note {
    overflow-wrap: anywhere;
    overflow-x: hidden;
    overflow-y: scroll;
    max-height: 312px;
   
}
.addon-option .note p{
    font-family: 'DMSans-Regular';
    color: #1d1d1d;
    font-size: 16px;
}
p#counter {
    text-align: right;
    margin: 0;
    font-size: 14px;
    font-family: 'DMSans-Regular';
}

.product_meta {
    border: none !important;
}

.digital_modal .box-cpc {
    padding: 0px 20px 20px 20px;
}

.digital_modal .customPopupMeta{
    padding: 20px 12px 20px 12px;
}
.product-remove svg {
    width: 17px;
    height: 17px;
    opacity: 1;
}
.product-remove a{
    opacity: 1 !important;
}
.product-remove a::before{
    width: 0 !important;
    height: 0 !important;
}
.yourOrder {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.yourOrder h3 {
    margin: 0;
    font-size: 18px;
    font-family: 'DMSans-Medium';
    font-weight: 500;
}
.yourOrder svg {
    width: 20px;
    height: 26px;
}
.cartHolder {
    background-color: #fff;
    padding: 24px;
    position: relative;
    border-radius: 6px;
    border: 1px solid #1d1d1d26 !important;
}
.page-id-2201 .content-area{
    width: 100% !important;
}
.page-id-2201 #secondary{
    display: none !important;
}
.product-thumbnail .d-none{
    display: none !important;
}
.product-thumbnail dl.variation {
    display: none !important;
}
.shop_table.d-none{
    display: none !important;
}
.cart-form-item--layout {
    display: grid;
    align-items: center;
    gap: 20px;
    border: none !important;
    padding: 8px 0px !important;
    grid-template-columns: 6.25rem 18.75rem 1fr !important;
    grid-template-areas: "thumbnail price-title-variants quantity" !important;
}
.product-thumbnail{
    grid-area: thumbnail;
    display: block;
    width: 92px;
    height: 92px;
    flex-shrink: 0;
    overflow: hidden;
    align-self: flex-start;
    border: 1px solid #1d1d1d26;
    border-radius: 10px;
}
.product-name{
    grid-area: price-title-variants;
}
.product-remove{
    grid-area: quantity;
    display: flex;
    align-items: flex-start;
    justify-content: end;
}
/* .product-name dl.variation {
    display: flex;
    gap: 10px;
} */
.product-name dd{
    margin: 0 !important;
    font-family: 'DMSans-Medium';
    font-weight: 500;
}
.product-name dl.variation p{
    margin: 0 !important;
}
.product-name a {
    color: #1d1d1d !important;
    font-size: 16px;
    font-family: 'DMSans-Regular';
    font-weight: 400;
}
.showDetailstwo {
    text-decoration: underline !important;
    display: block !important;
    font-size: 12px !important;
    margin: 0;
    cursor: pointer;
    outline: none !important;
    border: none !important;
}
.greetingEdit{
    text-decoration: underline !important;
    display: block !important;
    font-size: 12px !important;
    margin: 0 !important;
    cursor: pointer;
}
.product-name span.woocommerce-Price-amount.amount {
    font-family: 'DMSans-Regular';
    font-weight: 400;
}
.cart-section {
    display: grid;
    grid-template-columns: 3fr 1.4fr;
    gap: 20px;
}
.cart_totals {
    width: 100% !important;
}
.single-product  .quantity {
    display: none !important;
}
.digital_product_step .greeting-container{
    display: block !important;
}
#step2_custom_note{
    border: none;
    resize: none;
    padding: 0; 
}
.preview-product-meta .product-title{
    position: absolute;
    margin: 0 !important;
    top: 51.5%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 12px;
    font-weight: 400 !important;
    font-family: 'DMSans-Regular' !important;
   
}
.preview-product-meta .product-price{
    position: absolute;
    margin: 0 !important;
    top: 60%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 12px !important;
    color: #000;
    font-weight: 400 !important;
    font-family: 'DMSans-Regular' !important;

}

.cart-item__product-info .product-price{
    position: unset;
    top: unset;
    left: unset;
    font-size: 14px !important;
}
.digital-modal .cpc-modal-content{
    height: 90vh;
    width: 90vw;
    max-height: 90vh; 
}
.productImageBox img{
    max-width: 100%;
    width: 100%;
    border-radius: 5px;
}
/** Responsive **/

@media (max-width:1577px){
    .cpc-modal-content{
        width: 60%;
    }
}

@media (max-width:1440px){
    .cpc-modal-content{
        width: 80%;
    }
}

@media (max-width:1316px){
    .template-option {
        width: 22.33%;
    }
    
}

@media (max-width:1024px){
    .template-options{
        gap: 10px !important;
    }
    .template-option{
        width: 24%;
    }
    .cpc-digital-grid .cpc-preview {
        width: 100% !important;
    }
    .cpc-digital-grid .cpc-templates {
        width: 100% !important;
    }
    .cpc-digital-grid{
        flex-wrap: wrap;
    }
    .digital-modal .cpc-modal-content{
        height: 93vh;
        width: 90vw;
        max-height: 100vh;
    }
    .TabMeta{
        display: flex;
        flex-direction: column;
        position: sticky;
        bottom: 0;
        z-index: 9999;
        background-color: #ffffff;
        padding: 10px 0;
    }
    .TabMeta .button{
        width: 100% !important;
    }
}

@media (max-width:879px){
    .template-option{
        width: 24%;
    }
}

@media (max-width:991px){
    .cpc-modal-content {
        width: 90%;
        max-height: 75vh;
        height: 100%;
    }
    .upperTabs {
        width: 30%;
    }
}

@media (max-width:871px){
    .card-option{
        width: 32%;
    }
    .addon-option {
        width: 32%;
    }
}

@media (max-width:827px){
    .template-option img {
        height: 100% !important;
        object-fit: cover;
    }
}

@media (max-width:767px){
    .preview-product-meta .product-price {
        font-size: 8px !important;
        top: 58%;
    }
    .preview-product-meta .product-title{
        font-size: 8px;
        left: 53%;
        top: 49%;
    }
    div#selected-template-preview img {
        height: 100% !important;
    }
    .cpc-bottom-image img {
        height: 100% !important;
    }
    .digital_modal .customPopupMeta {
        padding: 10px;
    }
    .digital_modal .box-cpc {
        padding: 0px 10px 10px 10px;
    }    
 
    .card-option {
        display: flex;
        gap: 12px;
        width: 100% !important;
        padding: 8px;
    }
    .addon-option{
        display: flex;
        gap: 12px;
        width: 100% !important;
        padding: 8px;
    }
    .card-option.activeCardOption {
        display: block !important;
    }
    .activeCardOption .productImage {
        width: 100% !important;
    }
    .activeCardOption .productDesc{
        width: 100% !important;
    }
    .addon-option.activeAddonOption {
        display: block !important;
    }
    .activeAddonOption .productImage {
        width: 100% !important;
    }
    .activeAddonOption .productDesc{
        width: 100% !important;
    }
    .addon-options{
        flex-direction: column;
        gap: 15px;
    }
    .card-options {
        flex-direction: column;
        gap: 15px;
    }
    .gift_buttons {
        gap: 15px;
    }
    .productImage {
        width: 30%;
    }
    .productDesc{
        width: 70%;
    }
    .button_wrap{
        padding-left: 12px;
    }
    .upperTabs{
        width: 50%;
    }
    .customize-btn {
        height: 55px !important;
        padding-left: 10px !important;
        padding-right: 10px !important;
    }
    .description p {
        font-size: 14px;
    }
    .template-select-button label.label {
        font-size: 14px;
    }
    .cardIcon svg {
        height: 30px;
        width: 30px;
    }
    .cardsBox {
        padding: 10px 20px;
        width: 100%;
        height: 70px;
    }
    .cpc-step {
        padding: 10px;
    }
    /* .customPopupHeading{
        font-size: 18px;
    } */
    .product-meta span.price{
        font-size: 13px !important;
    }
    .template-option{
        width: 31.66%;
    }
}

@media (max-width:467px){
    .template-option {
        width: 30%;
    }
}

@media(max-width: 440px){
    
    .cpc-preview-note textarea {
        padding-left: 10px !important;
        font-size: 10px !important;
    }
    .productImage {
        width: 35%;
    }
    .productDesc {
        width: 65%;
    }
    .cpc-modal-content {
      width: 96%;
    }
}

@media (max-width:400px){
    .cardText p{
        font-size: 10px;
    }
    .upperTabs {
        margin-right: 9px;
        gap: 4px;
        padding: 8px 1px;
    }
    .buttonPrevWrap button {
        padding: 10px !important;
        font-size: 13px !important;
    }
}