/*.backToListing {
    text-align: right;
    color: #ffb600;
    padding: 10px 25px;
    cursor: pointer;
    position: absolute;
    display:none;
}
    .backToListing:before {
        content: "\25c0";
    }*/
    /****/
	
	/* =========================================================
   Review Summary Placement
   Align summary left under product H1
   ========================================================= */

.listingTop {
  display: block;
}

.listingTop .breadcrumbs-wrap {
  display: block;
  width: 100%;
}

#reviewSummary {
  display: block !important;
  width: 100% !important;
  margin: 8px 0 0 0 !important;
  padding: 0 !important;
  text-align: left !important;
  clear: both;
}

/* Keep the inner Yotpo summary aligned left */
#reviewSummary .yotpo-widget-instance,
#reviewSummary .yotpo-reviews-star-ratings-widget,
#reviewSummary .yotpo-sr-bottom-line-summary,
#reviewSummary .yotpo-bottom-line {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 !important;
  text-align: left !important;
}

/* Prevent Yotpo from centering the summary content */
#reviewSummary * {
  text-align: left !important;
}
	
.backtolistingbtn {
    display: block;
    float: left;
    line-height: 2rem;
    border: 1px solid grey;
    background: grey;
    padding: 20px 10px 30px 10px;
    height: 100%;
    color: white;
    font-size: 1.5rem;
    cursor: pointer;
    position: relative;
}
    .backtolistingbtn:before {
        /* content: "\25c0";*/
        content: "❮";
        padding: 0 10px 0 0;
    }
    /******/

.borderShadow-whitebg {
    background-color: white;
    box-shadow: 0px 0px 4px 0px #c0c0c085;
    border-radius: 10px;
    margin-top: 20px;
    border-bottom: 1px solid silver;
}

.customizerWrap {
    display: block;
    background: rgba(239, 239, 239, 0.63);
}
.listingInfoContainer {
    overflow: hidden;
    max-width: 100%;
    margin: 15px auto;
    padding: 20px;
}

    .listingInfoContainer.listingContainer {
       /* background: white;
        border-radius: 10px;
        box-shadow: 0px 0px 4px 0px #c0c0c085;*/
    }

.listingInfoContainer.listingTop {
    border-bottom: none;
    padding-bottom: 0;
    /*height: 111px;*/
    display: block;
}
    .listingInfoContainer .breadcrumbs-wrap {
        width: 100%;
        display: block;
        text-align: left;
        cursor: default;
    }

    .listingInfoContainer .breadcrumbs {
        text-align: left;
        padding: initial;
        width: initial;
        float: none;
        cursor: pointer;
        font-size: .85rem;
        color: #0000ffd6;
    }
        .listingInfoContainer .breadcrumbs a {
            font-size: .85rem;
            color: #0000ffd6;
            text-decoration:underline;
        }

    .listingInfoContainer .listingLeftRight {
        display: inline-block;
        width: 99%;
    }
    .listingInfoContainer .rightBox {
        padding: 0 10px;
        text-align: left;
        display:block;
    }

    /**********sticky customize button ******/
.cc-customize-sticky {
    display: none;
    position: fixed;
    top: 0;
    background: #fff;
    width: 100%;
    z-index: 135;
    box-sizing: border-box;
    box-shadow: -1px -1px 8px 0 #c7c5c5;
    clear: both;
    padding: 8px 0;
}

.cc-customize-active .cc-customize-sticky {
    display: block;
}

.cc-header-sticky .cc-customize-sticky {
    top: 60px;
}

    .cc-customize-sticky .cc-top-bar-676 {
        max-width: 1300px;
        margin: 0 auto;
    }
        .cc-customize-sticky .cc-top-bar-676 .cc-first-section {
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 20px;
        }
            .cc-customize-sticky .cc-top-bar-676 .cc-first-section .cc-prd-name1 {
                font-size: 1.5rem;
                width: 550px;
                float: left;
            }
    .cc-customize-sticky .cc-listing-customizeCTA {
        width: 550px;
        float: right;
        padding: 0 10px;
    }
        .cc-customize-sticky .cc-listing-customizeCTA .nextcta.button {
            width: 530px;
            height: 73px;
            line-height: 46px;
            border-radius: 10px;
        }
        .cc-customize-sticky .cc-listing-customizeCTA .button span {
            font-size: 2rem;
        }
/*.cc-top-bar-676.sticky-button {
    position: fixed;
    top:0;
    z-index: 9999;
    padding: 12px 20px;
    border: none;
    border-radius: 6px;
    background: #0078d4;
    color: #fff;
    font-size: 16px;
    cursor: pointer;
    opacity: 0;
    visibility: hidden;
    transition: opacity .3s ease, visibility .3s ease, transform .3s ease;
    transform: translateY(20px);
}

    .cc-top-bar-676.sticky-button.show {
        opacity: 1;
        visibility: visible;
        transform: translateY(0);
    }

    .cc-top-bar-676.sticky-button:hover {
        background: #005ea6;
    }*/




    /****** tabs within listing info **********/
    .listingInfoContainer .rightBox .tabs .tab ul li {
        text-align: center;
    }

    .listingInfoContainer .tabs .tab-body .g-container-left, .listingInfoContainer .tabs .tab-body .g-container-right {
        float: initial;
        display: table-cell;
    }
        /****************/

.listingInfoContainer.listingTop .listing-customizeCTA {
    /*margin: 14px 0 16px;
    */float: right;
    height: 73px;
    width: 550px;
    margin:auto;
}

    .listingInfoContainer.listingTop .listing-customizeCTA .nextcta {
        min-height: 72px;
        max-height: none;
        border-radius: 10px;
        box-shadow: 0 6px 16px rgba(0, 183, 152, 0.18);
    }

    .listingInfoContainer.listingTop .listing-customizeCTA .nextcta {
        width: 100%;
        max-height: 73px;
        min-height: 73px;
    }
        .listingInfoContainer.listingTop .listing-customizeCTA .nextcta .nexttxt {
            font-size: 2rem; /*calc(1rem + 1vw);*/
        }

    .listingInfoContainer .rightBox h2, .listingInfoContainer .leftBox h2 {
        font-size: 1.5rem;
        text-align: left;
    }

       /* .listingInfoContainer .rightBox .trimPricing {
            padding: 10px;
        }
            .listingInfoContainer .rightBox .trimPricing table td{
                font-size:.8rem;
            }*/
        .listingInfoContainer .rightBox .trimPricing .priceBox {
            padding: 10px 0px;
            font-size: 1.5rem;
            display: block;
        }
            .listingInfoContainer .rightBox .trimPricing .perItemTxt {
                font-size: .75rem;
                font-style: italic;
                text-align:left;
            }
.listingInfoContainer .rightBox .trimPricing .priceBoxInclude {
    display: block;
    text-align: left;
}

        .listingInfoContainer .rightBox .bulkpricinglink {
            /*padding: 7% 0;
            text-decoration: underline;
            color: blue;
            text-align: center;*/
            display: block;
            color: #fff;
            font-size: 1.5rem;
            border-radius: 5px;
            cursor: pointer;
            margin: 15px;
            text-align: center;
            position: relative;
        }
    .listingInfoContainer .leftBox{
        display:block;
    }
    .listingInfoContainer .leftBox .selectedView, .listingInfoContainer .leftBox .selectedView-wait {
        width: 100%;
        overflow: hidden;
        height: auto;
        position: relative;
        min-height: 350px;
    }

    .listingInfoContainer .leftBox .selectedView-wait {
        background-color: #f5f3f3;
        position:relative;
		min-height:350px;
    }

        .listingInfoContainer .leftBox .selectedView img {
            width: 100%;
        }

    .listingInfoContainer .leftBox .zoom:after {
        content: '';
        display: block;
        width: 50px;
		min-height:50px;
        height: 50px;
        position: absolute;
        bottom: 0;
        right: 0;
        background-image: url(/Images/zoom.png);
        background-size: cover;
    }
    /* START - this class is used within the zoom feature - DO NOT remove*/
    .listingInfoContainer img.zoomImg{
        background-color:white;
    }
    /* END */

    .listingInfoContainer .mobile-scroll {
        margin: 10px 0 25px;
    }
    .listingInfoContainer .prev, .listingInfoContainer .next {
        position: absolute;
        left: -25px;
        top: 45%;
        z-index: 9;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        padding: 16px;
        /* cursor: pointer;
        position: absolute;
        top: 50%;
        width: auto;
        padding: 16px;
        margin-top: -10px;
        font-weight: bold;
        font-size: 18px;
        transition: 0.6s ease;
        border-radius: 0 3px 3px 0;
        user-select: none;*/
    }

        .listingInfoContainer .next {
            left: initial;
            right: -25px;
           /* position: absolute;
            top: 50%;
            z-index: 9;
            -webkit-transform: translateY(-50%);
            transform: translateY(-50%);*/
        }
            .listingInfoContainer .prev:hover, .listingInfoContainer .next:hover {
                background-color: rgba(0,0,0,0.5);
                color: white;
            }
    .listingInfoContainer a.next:active, .listingInfoContainer a.prev:active {
        color: initial;
    }

    .listingInfoContainer .listWrap {
        padding-left: 0;
        padding-right: 0;
        transition: all 500ms ease-out 0s;
    }
    .listingInfoContainer .pgNav {
        height: 110px;
		min-height:110px;
    }


        .listingInfoContainer .pgNav li {
            width: 100px;
            height: 100px;
            overflow: hidden;
            display: inline-block; /** needed here for saved design mockup gen*/
        }
    .listingInfoContainer .youtubeVideoIcon {
        position:relative;
    }
        .listingInfoContainer .youtubeVideoIcon::after {
            content: "\25B6";
            color: red;
            position: absolute;
            left: 50%;
            top: 40%;
        }
	/*	.garment-container{
		min-height:350px;
		}*/

           /* .g-container {
                min-height: 150px;
            }*/
                .g-container.materialOrig, .g-container.shippingfulfillment {
                    height:160px;
                }

.listingInfoContainer .garment-container .g-description, .listingInfoContainer .short-desc {
    font-size: 1rem;
    text-align: left;
    /*text-indent: 35px;*/
    font-weight: normal;
    line-height: 20px;
    /*padding: 0px 75px 0px 0px;*/
}


#product-description {
    max-height: 300px;
}

.listingInfoContainer .garment-container .product-description {
    overflow-x: hidden;
    overflow-y: auto;
    /*overflow: hidden !important;
    -webkit-mask-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 1)), to(rgba(0, 0, 0, 0)));
    transition: all 0.5s linear;*/
}

.product-description.expand {
    min-height: 500px !important;
    -webkit-mask-image: none !important;
}
        .listingInfoContainer .garment-container .g-description p {
            font-size: .9rem;
            text-align: left;
            font-weight: normal;
            line-height: 25px;
            max-width: 100% !important;
            margin-top: 0;
            margin-bottom: 1rem;
        }

    .listingInfoContainer .deliveryDateInfo {
        padding: 10px;
        /*background-color: #c0c0c085;*/
        line-height: 1.5rem;
    }
        .listingInfoContainer .deliveryDateInfo .d_firstclass, .listingInfoContainer .deliveryDateInfo .d_rush {
            font-weight: bold;
        }

.productBx.c-mens {
    height: 408px;
    overflow: hidden;
}
/*.g-container.pricing-services {
    height: 500px;
}*/
.bulkEstimateContainer {
    margin-top: 15px;
    border: 1px solid #c0c0c045;
    padding: 0 20px 20px;
    border-radius: 11px;
    background-color: #c0c0c045;
}
.bulkEstimateContainer .g-container-left, .bulkEstimateContainer .g-container-right {
    width: 50%;
}

    .bulkEstimateContainer .g-container-right {
        
    }

        .bulkEstimateContainer .g-container-right div {
            padding: 10px;
        }

        .bulkEstimateContainer label {
            display: inline-block;
            text-indent: 5px;
            font-style: italic;
        }
.bulkEstimateContainer span{
    font-size:1.5rem;
}
    .bulkEstimateContainer .estimateSaving {
        display: inline-block;
        width: 100%;
        height: 35px;
    }

/*.g-container{
    display:inline-block;
}*/
.dummy-text {
    background-color: #f5f3f3;
    width: 100%;
    position: relative;
    min-height: 750px;
}
.dummy-text1, .dummy-text2, .dummy-text3 {
    background-color: white;
    width: 80%;
    height: 11px;
    border-radius: 5px;
    margin: 25px 20px;
}

.dummy-text2 {
    width: 60%;
}

.dummy-text2 {
    width: 75%;
}

.cz-price-sample-container .service-scrolling {
    width: 100%;
    margin: auto;
    overflow-y: hidden;
    overflow-x: auto;
}
.cz-price-sample-container .viewOptionsContainer .servicePrev, .cz-price-sample-container .viewOptionsContainer .serviceNext{
    display:none;
}

#services-info {
    min-height: 770px;
}
#services-info .servicePrev {
    left: 0;
}
#services-info .servicePrev, #services-info .serviceNext {
    font-size: 3rem;
    position: absolute;
    top: 50%;
}
    #services-info .serviceNext{
        right:0;
    }


#benefits-features{
    display:block;
    margin-top: 20px;
}

    #benefits-features .g-listitems{
        padding: initial;
    }

        #benefits-features .g-listitems ul{
            list-style:none;
        }
        #benefits-features .g-listitems ul li{
            line-height:30px;
        }
#specialfeatures{
    overflow:hidden;
    margin-bottom:25px;
}

#supplier-apl-inv {
    min-height: 278px;
}
#artwork-placement-options {
    min-height: 575px;
}
#replacementHld {
    min-height: 774px;
    text-align: left;
}
#replacementHld0 {
    min-height: 130px;
    text-align: left;
}
    #replacementHld0 a{
        font-size: .8rem;
    }
.cz-price-sample-container .serviceOptionsWrap {
    min-height: 540px;
    width: max-content;
    transition: all 500ms ease-out 0s;
}
.cz-price-sample-container .srvContainer {
    width: 325px;
    background-color: #ebebeb7d;
    padding: 25px;
    float: left;
    margin: 2px 25px 25px 2px;
    min-height: 525px;
    outline: 1px lightgrey solid;
}
    .cz-price-sample-container .srvContainer h3 {
        font-size: 1.25rem;
        line-height: normal;
    }

    .cz-price-sample-container .srvContainer .srvDesc {
        font-size: .85rem;
        text-align: left;
        max-width: 100% !important;
        display: block;
    }
    .cz-price-sample-container .srvContainer .srvImage {
        width: 250px;
		margin:15px 0px;
    }

h2.baseName{
    font-size:1rem !important;
}
.srvLnk {
    font-size: .65rem;
    text-align: left;
}
.srvIcon{
	width: 20px;
    margin: 0px 0px 0px 3px;
    vertical-align: middle;
}

#listselectedView{
	min-height:350px;
}
/*.min550{
    min-height:550px !important;
	}*/
.listingInfoContainer .leftBox .selectedView img {
    width: 100%;
    min-height: 350px;
}

@media screen and (min-width:768px) {

    .listingInfoContainer .deliveryDateInfo {
       padding-right: 0;
    }
    #services-info {
        min-height: 700px;
    }
    #benefits-features {
        min-height:440px;
    }
    #artwork-placement-options {
        min-height: 475px;
    }
    
    .productBx.c-mens {
        height: 390px;
        overflow: hidden;
    }
    .listingInfoContainer.listingTop .listing-customizeCTA{
        float: none;
    }

}

@media screen and (min-width:1024px) {

	#listselectedView{
	min-height:550px;
	}

    

    #replacementHld {
        min-height: 426px;
    }

    /*.g-container.pricing-services {
        height: 390px;
    }*/

    .listingInfoContainer {
        overflow: hidden;
        max-width: 1300px;
    }
	
        .listingInfoContainer .rightBox {
            min-width: 465px;
            float: right;
            width: 465px;
			/*min-height: 550px;*/

        }

        .listingInfoContainer .leftBox {
            float: left;
            max-width: 475px;
            min-width: 475px; /**/
			/*min-height: 550px;*/

        }

            .listingInfoContainer .leftBox .selectedView {
                width: 100%;
                overflow: hidden;
                height: 100%;
				min-height:550px;
            }

            .listingInfoContainer .leftBox .selectedView-wait {
                min-height: 550px;
            }

            .listingInfoContainer .leftBox .selectedView img {
                width: 100%;
				min-height:550px;
            }

            .listingInfoContainer .leftBox .garment-container {
                padding: 15px 0 0 10px;
            }

    .listingInfoContainer .mobile-scroll {
        width: 94%;
        margin: auto;
        overflow: hidden;
        height: inherit;
    }
       
        /***listing info ends ***/
    .cz-price-sample-container .service-scrolling {
        overflow: hidden;
    }
    .cz-price-sample-container .viewOptionsContainer .servicePrev, .cz-price-sample-container .viewOptionsContainer .serviceNext {
        display: block;
    }
    .productBx.c-mens {
        height: 395px;
        overflow: hidden;
    }
    .listingInfoContainer.listingTop .listing-customizeCTA {
        float: right;
    }
}


@media screen and (min-width:1200px) {
    .listingInfoContainer .rightBox {
        min-width: 550px;
        width: 550px;
        float: right;
    }

    .listingInfoContainer .leftBox {
        float: left;
        max-width: 550px;
        min-width: 550px; /**/
    }

        .listingInfoContainer .leftBox .selectedView-wait {
            height: 650px;
        }
   /* .listingInfoContainer .leftBox .mediaOptions {
        width: auto;
    }*/
}

/* =========================================================
   Yotpo Reviews - Apliiq Scoped Overrides
   Scope: product listing page widgets only
   Containers: #reviewSummary and #productReviews
   ========================================================= */

/* Shared widget variables */
#reviewSummary,
#productReviews {
  --apq-review-text: #222222;
  --apq-review-muted: #5a5a5a;
  --apq-review-accent: #00b798;
  --apq-review-star: #ffb600;
  --apq-review-border: rgba(90, 90, 90, 0.22);
  --apq-review-border-strong: rgba(90, 90, 90, 0.34);
  --apq-review-bg: #ffffff;
  --apq-review-soft-bg: #f7f7f7;

  font-family: "Open Sans", Arial, sans-serif;
  color: var(--apq-review-text);
}

#reviewSummary *,
#productReviews * {
  font-family: "Open Sans", Arial, sans-serif !important;
  box-sizing: border-box;
}

#reviewSummary a,
#productReviews a {
  color: var(--apq-review-accent);
  text-decoration: none;
}

#reviewSummary a:hover,
#productReviews a:hover {
  text-decoration: underline;
}

/* =========================================================
   Review Summary Widget
   ========================================================= */

#reviewSummary {
  display: block;
  width: 100%;
  margin: 8px 0 0;
  line-height: 1;
  font-size: 0.95rem;
  font-weight: 400;
  color: var(--apq-review-muted);
}

#reviewSummary .yotpo-widget-instance,
#reviewSummary .yotpo-reviews-star-ratings-widget,
#reviewSummary .yotpo-sr-bottom-line-summary,
#reviewSummary .yotpo-bottom-line {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  line-height: 1;
  font-size: 0.95rem !important;
  font-weight: 400 !important;
  color: var(--apq-review-muted) !important;
}

#reviewSummary .yotpo-sr-bottom-line-text,
#reviewSummary .yotpo-bottom-line-text,
#reviewSummary .text-m {
  font-size: 0.9rem !important;
  font-weight: 400 !important;
  color: var(--apq-review-muted) !important;
  text-transform: lowercase;
}

/* =========================================================
   Full Product Reviews Widget
   ========================================================= */

#productReviews {
  margin-top: 24px;
  padding: 0 28px 28px;
  background: var(--apq-review-bg);
  color: var(--apq-review-text);
}

#productReviews .yotpo-widget-instance,
#productReviews .yotpo-reviews-main-widget {
  width: 100%;
  max-width: 100%;
  color: var(--apq-review-text) !important;
}

#productReviews .yotpo-widget-instance {
  padding-top: 24px !important;
}

#productReviews .yotpo-base-layout {
  width: 100% !important;
  max-width: 100% !important;
}

/* =========================================================
   Stars / Rating Icons
   ========================================================= */

#reviewSummary .yotpo-star,
#reviewSummary .yotpo-icon-star,
#reviewSummary .yotpo-icon-half-star,
#reviewSummary .yotpo-icon-empty-star,
#productReviews .yotpo-star,
#productReviews .yotpo-icon-star,
#productReviews .yotpo-icon-half-star,
#productReviews .yotpo-icon-empty-star {
  color: var(--apq-review-star) !important;
  fill: var(--apq-review-star) !important;
}

#reviewSummary svg {
  color: var(--apq-review-star) !important;
  fill: var(--apq-review-star) !important;
}

/* =========================================================
   Customer Reviews Title Only
   ========================================================= */

#productReviews .yotpo-headline,
#productReviews .yotpo-main-title,
#productReviews .yotpo-header-title,
#productReviews .yotpo-reviews-title,
#productReviews .yotpo-reviews-main-widget > .yotpo-head .yotpo-title,
#productReviews .yotpo-reviews-main-widget > .yotpo-head .yotpo-headline,
#productReviews .yotpo-main-layout > .yotpo-head .yotpo-title,
#productReviews .yotpo-main-layout > .yotpo-head .yotpo-headline,
#productReviews .yotpo-widget-header > .yotpo-title,
#productReviews .yotpo-widget-header > .yotpo-headline {
  display: block !important;
  width: 100% !important;
  margin: 0 0 18px 0 !important;
  padding: 0 !important;
  text-align: left !important;

  font-family: "Questrial", "Open Sans", Arial, sans-serif !important;
  font-size: 1.5rem !important;
  font-weight: 600 !important;
  line-height: 1.25 !important;
  color: var(--apq-review-text) !important;
  text-transform: lowercase;
  letter-spacing: 0.01em;
}

#productReviews .yotpo-head > .yotpo-headline,
#productReviews .yotpo-head > .yotpo-title,
#productReviews .yotpo-header-container > .yotpo-headline,
#productReviews .yotpo-header-container > .yotpo-title,
#productReviews .yotpo-widget-header > .yotpo-headline,
#productReviews .yotpo-widget-header > .yotpo-title {
  margin-left: 0 !important;
  margin-right: auto !important;
  align-self: flex-start !important;
}

/* =========================================================
   Ratings Distribution
   ========================================================= */

#productReviews .yotpo-star-distribution,
#productReviews .yotpo-distribution-rows,
#productReviews .yotpo-distribution-row {
  background-color: transparent !important;
}

/* Do not force child visibility here; Yotpo uses hidden duplicate labels */
#productReviews .yotpo-star-distribution span,
#productReviews .yotpo-star-distribution button {
  color: var(--apq-review-text) !important;
  background-color: transparent !important;
}

#productReviews .yotpo-star-distribution .yotpo-progress-bar,
#productReviews .yotpo-star-distribution [class*="progress-bar"] {
  background-color: #e9e9e9 !important;
  border-radius: 0 !important;
}

#productReviews .yotpo-star-distribution .yotpo-progress-bar-score,
#productReviews .yotpo-star-distribution [class*="progress-bar-score"],
#productReviews .yotpo-star-distribution [class*="filled"],
#productReviews .yotpo-star-distribution [class*="fill"] {
  background-color: var(--apq-review-star) !important;
  border-radius: 0 !important;
}

/* =========================================================
   Filters / Top Panel
   ========================================================= */

#productReviews .yotpo-filters-top-panel {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-wrap: nowrap !important;
  gap: 12px !important;

  width: 100% !important;
  max-width: 100% !important;
  min-height: 48px !important;

  padding: 10px 0 !important;
  margin: 0 !important;

  background: transparent !important;
  border-top: 1px solid var(--apq-review-border) !important;
  border-bottom: 1px solid var(--apq-review-border) !important;
  border-left: 0 !important;
  border-right: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

#productReviews .yotpo-filters-top-panel > * {
  flex: 0 0 auto !important;
  margin: 0 !important;
  min-height: 38px !important;
}

/* =========================================================
   Reviews Search Field
   ========================================================= */

#productReviews .yotpo-filters-top-panel .yotpo-search-filter,
#productReviews .yotpo-filters-top-panel .yotpo-search,
#productReviews .yotpo-filters-top-panel .yotpo-search-input-container,
#productReviews .yotpo-filters-top-panel .yotpo-search-filter-container,
#productReviews .yotpo-filters-top-panel .yotpo-review-search,
#productReviews .yotpo-filters-top-panel .yotpo-review-search-container,
#productReviews .yotpo-filters-top-panel [class*="search-input-container"],
#productReviews .yotpo-filters-top-panel [class*="search-filter"] {
  display: flex !important;
  align-items: center !important;

  flex: 0 0 320px !important;
  width: 320px !important;
  max-width: 320px !important;
  min-width: 320px !important;
  height: 38px !important;
  min-height: 38px !important;

  padding: 0 !important;
  margin: 0 !important;

  background: #ffffff !important;
  border: 1px solid var(--apq-review-border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
  overflow: hidden !important;
}

#productReviews .yotpo-filters-top-panel .yotpo-search-filter:hover,
#productReviews .yotpo-filters-top-panel .yotpo-search:hover,
#productReviews .yotpo-filters-top-panel .yotpo-search-input-container:hover,
#productReviews .yotpo-filters-top-panel .yotpo-search-filter-container:hover,
#productReviews .yotpo-filters-top-panel .yotpo-review-search:hover,
#productReviews .yotpo-filters-top-panel .yotpo-review-search-container:hover,
#productReviews .yotpo-filters-top-panel [class*="search-input-container"]:hover,
#productReviews .yotpo-filters-top-panel [class*="search-filter"]:hover,
#productReviews .yotpo-filters-top-panel .yotpo-search-filter:focus-within,
#productReviews .yotpo-filters-top-panel .yotpo-search:focus-within,
#productReviews .yotpo-filters-top-panel .yotpo-search-input-container:focus-within,
#productReviews .yotpo-filters-top-panel .yotpo-search-filter-container:focus-within,
#productReviews .yotpo-filters-top-panel .yotpo-review-search:focus-within,
#productReviews .yotpo-filters-top-panel .yotpo-review-search-container:focus-within,
#productReviews .yotpo-filters-top-panel [class*="search-input-container"]:focus-within,
#productReviews .yotpo-filters-top-panel [class*="search-filter"]:focus-within {
  background: #ffffff !important;
  border-color: var(--apq-review-border-strong) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

#productReviews .yotpo-filters-top-panel .yotpo-search-filter *,
#productReviews .yotpo-filters-top-panel .yotpo-search *,
#productReviews .yotpo-filters-top-panel .yotpo-search-input-container *,
#productReviews .yotpo-filters-top-panel .yotpo-search-filter-container *,
#productReviews .yotpo-filters-top-panel .yotpo-review-search *,
#productReviews .yotpo-filters-top-panel .yotpo-review-search-container *,
#productReviews .yotpo-filters-top-panel [class*="search-input-container"] *,
#productReviews .yotpo-filters-top-panel [class*="search-filter"] * {
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

#productReviews .yotpo-filters-top-panel .yotpo-search-filter::before,
#productReviews .yotpo-filters-top-panel .yotpo-search-filter::after,
#productReviews .yotpo-filters-top-panel .yotpo-search::before,
#productReviews .yotpo-filters-top-panel .yotpo-search::after,
#productReviews .yotpo-filters-top-panel .yotpo-search-input-container::before,
#productReviews .yotpo-filters-top-panel .yotpo-search-input-container::after,
#productReviews .yotpo-filters-top-panel .yotpo-search-filter-container::before,
#productReviews .yotpo-filters-top-panel .yotpo-search-filter-container::after,
#productReviews .yotpo-filters-top-panel .yotpo-review-search::before,
#productReviews .yotpo-filters-top-panel .yotpo-review-search::after,
#productReviews .yotpo-filters-top-panel .yotpo-review-search-container::before,
#productReviews .yotpo-filters-top-panel .yotpo-review-search-container::after {
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

#productReviews .yotpo-filters-top-panel .yotpo-search-filter input,
#productReviews .yotpo-filters-top-panel .yotpo-search input,
#productReviews .yotpo-filters-top-panel .yotpo-search-input-container input,
#productReviews .yotpo-filters-top-panel .yotpo-search-filter-container input,
#productReviews .yotpo-filters-top-panel .yotpo-review-search input,
#productReviews .yotpo-filters-top-panel .yotpo-review-search-container input,
#productReviews .yotpo-filters-top-panel input[type="search"],
#productReviews .yotpo-filters-top-panel input[placeholder*="Search"],
#productReviews .yotpo-filters-top-panel input[placeholder*="search"] {
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
  height: 36px !important;
  min-height: 36px !important;
  line-height: 36px !important;

  padding: 0 12px !important;
  margin: 0 !important;

  background: #ffffff !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;

  color: var(--apq-review-text) !important;
  font-size: 0.95rem !important;
}

#productReviews .yotpo-filters-top-panel input[type="search"]::placeholder,
#productReviews .yotpo-filters-top-panel input[placeholder*="Search"]::placeholder,
#productReviews .yotpo-filters-top-panel input[placeholder*="search"]::placeholder {
  color: var(--apq-review-muted) !important;
  opacity: 1 !important;
}

#productReviews .yotpo-filters-top-panel .yotpo-search-filter button,
#productReviews .yotpo-filters-top-panel .yotpo-search button,
#productReviews .yotpo-filters-top-panel .yotpo-search-input-container button,
#productReviews .yotpo-filters-top-panel .yotpo-search-filter-container button,
#productReviews .yotpo-filters-top-panel .yotpo-review-search button,
#productReviews .yotpo-filters-top-panel .yotpo-review-search-container button,
#productReviews .yotpo-filters-top-panel [class*="search"] button {
  flex: 0 0 40px !important;
  width: 40px !important;
  min-width: 40px !important;
  height: 36px !important;
  min-height: 36px !important;

  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  padding: 0 !important;
  margin: 0 !important;

  background: transparent !important;
  border: 0 !important;
  border-left: 1px solid var(--apq-review-border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;

  color: var(--apq-review-muted) !important;
}

#productReviews .yotpo-filters-top-panel .yotpo-search-filter button:hover,
#productReviews .yotpo-filters-top-panel .yotpo-search button:hover,
#productReviews .yotpo-filters-top-panel .yotpo-search-input-container button:hover,
#productReviews .yotpo-filters-top-panel .yotpo-search-filter-container button:hover,
#productReviews .yotpo-filters-top-panel .yotpo-review-search button:hover,
#productReviews .yotpo-filters-top-panel .yotpo-review-search-container button:hover,
#productReviews .yotpo-filters-top-panel [class*="search"] button:hover {
  background: transparent !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
  color: var(--apq-review-text) !important;
}

#productReviews .yotpo-filters-top-panel .yotpo-search-filter svg,
#productReviews .yotpo-filters-top-panel .yotpo-search svg,
#productReviews .yotpo-filters-top-panel .yotpo-search-input-container svg,
#productReviews .yotpo-filters-top-panel .yotpo-search-filter-container svg,
#productReviews .yotpo-filters-top-panel .yotpo-review-search svg,
#productReviews .yotpo-filters-top-panel .yotpo-review-search-container svg,
#productReviews .yotpo-filters-top-panel [class*="search"] svg {
  width: 16px !important;
  height: 16px !important;

  color: var(--apq-review-muted) !important;
  fill: var(--apq-review-muted) !important;

  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

/* =========================================================
   Dropdown Filters
   Do not force hidden child labels visible.
   ========================================================= */

#productReviews .yotpo-filters-top-panel .yotpo-dropdown,
#productReviews .yotpo-filters-top-panel .yotpo-dropdown-button,
#productReviews .yotpo-filters-top-panel .yotpo-dropdown-closable,
#productReviews .yotpo-filters-top-panel .yotpo-sorting-filter-container,
#productReviews .yotpo-filters-top-panel select {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 132px !important;
  height: 38px !important;
  min-height: 38px !important;

  padding: 0 12px !important;
  margin: 0 !important;

  background: #ffffff !important;
  border: 1px solid var(--apq-review-border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;

  color: var(--apq-review-text) !important;
  font-size: 0.95rem !important;
  line-height: 38px !important;
  vertical-align: middle !important;
}

#productReviews .yotpo-filters-top-panel .yotpo-dropdown-closable.yotpo-dropdown-closable--textual,
#productReviews .yotpo-filters-top-panel .yotpo-dropdown-closable.yotpo-dropdown-closable--focused,
#productReviews .yotpo-filters-top-panel .yotpo-dropdown-closable.yotpo-dropdown-closable--textual.yotpo-dropdown-closable--focused {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;

  height: 38px !important;
  min-height: 38px !important;
  padding: 0 12px !important;
  margin: 0 !important;

  background: #ffffff !important;
  border: 1px solid var(--apq-review-border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;

  color: var(--apq-review-text) !important;
  line-height: 38px !important;
  vertical-align: middle !important;
}

/* Target actual visible dropdown labels only */
#productReviews .yotpo-filters-top-panel .yotpo-dropdown-placeholder,
#productReviews .yotpo-filters-top-panel .yotpo-dropdown-label,
#productReviews .yotpo-filters-top-panel .yotpo-selected-value,
#productReviews .yotpo-filters-top-panel .yotpo-dropdown-closable--textual,
#productReviews .yotpo-filters-top-panel .yotpo-sorting-filter-container {
  color: var(--apq-review-text) !important;
}

/* Media filter text fix without exposing hidden duplicate rating labels */
#productReviews .yotpo-filters-top-panel .yotpo-media-filter,
#productReviews .yotpo-filters-top-panel .yotpo-media-filter .yotpo-dropdown-placeholder,
#productReviews .yotpo-filters-top-panel .yotpo-media-filter .yotpo-dropdown-label,
#productReviews .yotpo-filters-top-panel .yotpo-media-filter .yotpo-selected-value,
#productReviews .yotpo-filters-top-panel .yotpo-media-filter button {
  color: var(--apq-review-text) !important;
}

/* Hover/focus states: square, no extra rounded outline */
#productReviews .yotpo-filters-top-panel .yotpo-dropdown:hover,
#productReviews .yotpo-filters-top-panel .yotpo-dropdown-button:hover,
#productReviews .yotpo-filters-top-panel .yotpo-dropdown-closable:hover,
#productReviews .yotpo-filters-top-panel .yotpo-sorting-filter-container:hover,
#productReviews .yotpo-filters-top-panel select:hover,
#productReviews .yotpo-filters-top-panel .yotpo-dropdown:focus,
#productReviews .yotpo-filters-top-panel .yotpo-dropdown-button:focus,
#productReviews .yotpo-filters-top-panel .yotpo-dropdown-closable:focus,
#productReviews .yotpo-filters-top-panel .yotpo-sorting-filter-container:focus,
#productReviews .yotpo-filters-top-panel select:focus,
#productReviews .yotpo-filters-top-panel .yotpo-dropdown:focus-visible,
#productReviews .yotpo-filters-top-panel .yotpo-dropdown-button:focus-visible,
#productReviews .yotpo-filters-top-panel .yotpo-dropdown-closable:focus-visible,
#productReviews .yotpo-filters-top-panel .yotpo-sorting-filter-container:focus-visible,
#productReviews .yotpo-filters-top-panel select:focus-visible {
  background: var(--apq-review-soft-bg) !important;
  border: 1px solid var(--apq-review-border-strong) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
  border:none;
}

/* Kill Yotpo hover/focus pseudo-outline layers */
#productReviews .yotpo-filters-top-panel .yotpo-dropdown::before,
#productReviews .yotpo-filters-top-panel .yotpo-dropdown::after,
#productReviews .yotpo-filters-top-panel .yotpo-dropdown-button::before,
#productReviews .yotpo-filters-top-panel .yotpo-dropdown-button::after,
#productReviews .yotpo-filters-top-panel .yotpo-dropdown-closable::before,
#productReviews .yotpo-filters-top-panel .yotpo-dropdown-closable::after,
#productReviews .yotpo-filters-top-panel .yotpo-sorting-filter-container::before,
#productReviews .yotpo-filters-top-panel .yotpo-sorting-filter-container::after {
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

/* Children inherit color, but do not force visibility or opacity */
#productReviews .yotpo-filters-top-panel .yotpo-dropdown *,
#productReviews .yotpo-filters-top-panel .yotpo-dropdown-button *,
#productReviews .yotpo-filters-top-panel .yotpo-dropdown-closable *,
#productReviews .yotpo-filters-top-panel .yotpo-sorting-filter-container * {
  color: inherit !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

#productReviews .yotpo-dropdown-content,
#productReviews .yotpo-dropdown-menu,
#productReviews .yotpo-filter-dropdown {
  background: #ffffff !important;
  border: 1px solid var(--apq-review-border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

#productReviews .yotpo-dropdown-content *,
#productReviews .yotpo-dropdown-menu *,
#productReviews .yotpo-filter-dropdown * {
  color: var(--apq-review-text) !important;
}

/* =========================================================
   Review Votes / Helpful Icons
   ========================================================= */

#productReviews .yotpo-review-votes-icons,
#productReviews .yotpo-review-votes,
#productReviews .yotpo-helpful {
  background-color: transparent !important;
}

#productReviews .yotpo-review-votes-icons button,
#productReviews .yotpo-review-votes-icons .yotpo-icon-button,
#productReviews .yotpo-review-votes-icons [role="button"],
#productReviews .yotpo-review-votes button,
#productReviews .yotpo-helpful button {
  background-color: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: var(--apq-review-muted) !important;
  box-shadow: none !important;
  padding: 0 !important;
}

#productReviews .yotpo-review-votes-icons svg,
#productReviews .yotpo-review-votes svg,
#productReviews .yotpo-helpful svg,
#productReviews .yotpo-icon-thumbs-up,
#productReviews .yotpo-icon-thumbs-down {
  background-color: transparent !important;
  color: var(--apq-review-muted) !important;
  fill: var(--apq-review-muted) !important;
}

#productReviews .yotpo-review-votes-icons button:hover,
#productReviews .yotpo-review-votes button:hover,
#productReviews .yotpo-helpful button:hover {
  background-color: transparent !important;
  color: var(--apq-review-text) !important;
}

#productReviews .yotpo-review-votes-icons button:hover svg,
#productReviews .yotpo-review-votes button:hover svg,
#productReviews .yotpo-helpful button:hover svg {
  fill: var(--apq-review-text) !important;
}

/* =========================================================
   Typography
   ========================================================= */

#productReviews h1,
#productReviews h2,
#productReviews h3,
#productReviews h4 {
  font-family: "Questrial", "Open Sans", Arial, sans-serif !important;
  color: var(--apq-review-text) !important;
  font-weight: 600 !important;
  text-transform: lowercase;
  letter-spacing: 0.01em;
}

#productReviews p,
#productReviews span,
#productReviews div,
#productReviews label,
#productReviews button,
#productReviews input,
#productReviews textarea {
  color: inherit;
}

#productReviews .yotpo-review-date,
#productReviews .yotpo-date-format,
#productReviews .yotpo-reviewer-name,
#productReviews .yotpo-verified-text,
#productReviews .yotpo-reviewer-verified-buyer-text,
#productReviews .yotpo-empty-state,
#productReviews .yotpo-read-more,
#productReviews .yotpo-read-less {
  color: var(--apq-review-muted) !important;
  font-size: 0.9rem !important;
}

#productReviews .yotpo-review,
#productReviews .yotpo-review-border-smooth,
#productReviews .yotpo-reviewer,
#productReviews .yotpo-reviews-list .yotpo-review {
  border-color: var(--apq-review-border) !important;
}

#productReviews .yotpo-review-title,
#productReviews .yotpo-review-title-text {
  color: var(--apq-review-text) !important;
  font-family: "Questrial", "Open Sans", Arial, sans-serif !important;
  font-size: 1.1rem !important;
  font-weight: 600 !important;
  line-height: 1.35;
  text-transform: lowercase;
}

#productReviews .yotpo-review-content,
#productReviews .yotpo-review-content p,
#productReviews .yotpo-review-text,
#productReviews .content-review {
  color: var(--apq-review-text) !important;
  font-size: 0.98rem !important;
  line-height: 1.6;
}

/* =========================================================
   Primary Yotpo Actions
   ========================================================= */

#productReviews .yotpo-new-review-btn,
#productReviews .write-review-button,
#productReviews .yotpo-submit,
#productReviews input[type="submit"] {
  background: var(--apq-review-accent) !important;
  border: 1px solid var(--apq-review-accent) !important;
  border-radius: 0 !important;
  color: #ffffff !important;
  font-family: "Open Sans", Arial, sans-serif !important;
  font-size: 0.95rem !important;
  font-weight: 600 !important;
  line-height: 1.2;
  text-transform: lowercase;
  box-shadow: none !important;
  cursor: pointer;
}

#productReviews .yotpo-new-review-btn:hover,
#productReviews .write-review-button:hover,
#productReviews .yotpo-submit:hover,
#productReviews input[type="submit"]:hover {
  background: var(--apq-review-text) !important;
  border-color: var(--apq-review-text) !important;
  color: #ffffff !important;
}

/* =========================================================
   Inputs / Textareas
   ========================================================= */

#productReviews input,
#productReviews textarea,
#productReviews select {
  border: 1px solid var(--apq-review-border) !important;
  border-radius: 0 !important;
  color: var(--apq-review-text) !important;
  font-family: "Open Sans", Arial, sans-serif !important;
  font-size: 0.95rem !important;
  box-shadow: none !important;
}

#productReviews input:focus,
#productReviews textarea:focus,
#productReviews select:focus {
  border-color: var(--apq-review-border-strong) !important;
  outline: none !important;
}

#productReviews input[type="search"],
#productReviews input[placeholder*="Search"],
#productReviews input[placeholder*="search"] {
  border: 0 !important;
}

/* =========================================================
   Pagination
   ========================================================= */

#productReviews .yotpo-page-button,
#productReviews .yotpo-pagination-number {
  color: var(--apq-review-muted) !important;
  background-color: transparent !important;
}

#productReviews .yotpo-page-button:hover,
#productReviews .yotpo-pagination-number:hover,
#productReviews .yotpo-pagination-number.yotpo-active {
  color: var(--apq-review-accent) !important;
  background-color: transparent !important;
}

/* =========================================================
   Responsive
   ========================================================= */

@media (max-width: 767px) {
  #reviewSummary {
    display: block;
    width: 100%;
    margin: 8px 0 0;
  }

  #productReviews {
    margin-top: 18px;
    padding: 0 14px 20px;
  }

  #productReviews .yotpo-widget-instance {
    padding-top: 20px !important;
  }

  #productReviews .yotpo-base-layout {
    width: 100% !important;
    max-width: 100% !important;
  }

  #productReviews .yotpo-headline,
  #productReviews .yotpo-main-title,
  #productReviews .yotpo-header-title,
  #productReviews .yotpo-reviews-title,
  #productReviews .yotpo-reviews-main-widget > .yotpo-head .yotpo-title,
  #productReviews .yotpo-reviews-main-widget > .yotpo-head .yotpo-headline,
  #productReviews .yotpo-main-layout > .yotpo-head .yotpo-title,
  #productReviews .yotpo-main-layout > .yotpo-head .yotpo-headline,
  #productReviews .yotpo-widget-header > .yotpo-title,
  #productReviews .yotpo-widget-header > .yotpo-headline {
    font-size: 1.5rem !important;
    margin-bottom: 14px !important;
  }

  #productReviews .yotpo-filters-top-panel {
    flex-wrap: wrap !important;
    gap: 8px !important;
    min-height: 0 !important;
    padding: 10px 0 !important;
  }

  #productReviews .yotpo-filters-top-panel .yotpo-search-filter,
  #productReviews .yotpo-filters-top-panel .yotpo-search,
  #productReviews .yotpo-filters-top-panel .yotpo-search-input-container,
  #productReviews .yotpo-filters-top-panel .yotpo-search-filter-container,
  #productReviews .yotpo-filters-top-panel .yotpo-review-search,
  #productReviews .yotpo-filters-top-panel .yotpo-review-search-container,
  #productReviews .yotpo-filters-top-panel [class*="search-input-container"],
  #productReviews .yotpo-filters-top-panel [class*="search-filter"] {
    flex: 1 1 100% !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  #productReviews .yotpo-filters-top-panel .yotpo-dropdown,
  #productReviews .yotpo-filters-top-panel .yotpo-dropdown-button,
  #productReviews .yotpo-filters-top-panel .yotpo-dropdown-closable,
  #productReviews .yotpo-filters-top-panel .yotpo-sorting-filter-container,
  #productReviews .yotpo-filters-top-panel select {
    flex: 1 1 calc(50% - 8px) !important;
    min-width: 130px !important;
  }

  #productReviews .yotpo-review-title,
  #productReviews .yotpo-review-title-text {
    font-size: 1rem !important;
  }

  #productReviews .yotpo-review-content,
  #productReviews .yotpo-review-content p,
  #productReviews .yotpo-review-text,
  #productReviews .content-review {
    font-size: 0.95rem !important;
  }
}

/* =========================================================
   Seller Pricing Gate - Minimal Scoped Styles
   Keeps original pricing/service markup intact.
   ========================================================= */

#pricing-tab #tb-startSelling .sellerAppListing {
  display: block;
  width: 100%;
  padding: 18px;
  margin: 0;
  background: #f7f7f7;
  border: 1px solid rgba(90, 90, 90, 0.18);
  border-radius: 10px;
  text-align: left;
  box-sizing: border-box;
}

#pricing-tab #tb-startSelling .sellerAppListing h3 {
  margin: 0 0 8px;
  font-family: "Questrial", "Open Sans", Arial, sans-serif;
  font-size: 1.25rem;
  line-height: 1.25;
  color: #222222;
  text-transform: lowercase;
}

#pricing-tab #tb-startSelling .sellerAppListing p {
  margin: 0 0 14px;
  font-size: 0.95rem;
  line-height: 1.45;
  color: #5a5a5a;
}

#pricing-tab #tb-startSelling .sellerAppList {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
}

#pricing-tab #tb-startSelling .sellerAppLink {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 58px;
  padding: 10px 12px;
  background: #ffffff;
  border: 1px solid rgba(90, 90, 90, 0.18);
  border-radius: 8px;
  color: #222222;
  font-size: 0.95rem;
  font-weight: 600;
  text-decoration: none;
  box-sizing: border-box;
}

#pricing-tab #tb-startSelling .sellerAppLink:hover {
  border-color: #00b798;
  color: #00b798;
  text-decoration: none;
}

#pricing-tab #tb-startSelling .sellerAppLogoWrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 38px;
  width: 38px;
  height: 38px;
  padding: 6px;
  background: #ffffff;
  border: 1px solid rgba(90, 90, 90, 0.14);
  border-radius: 8px;
  box-sizing: border-box;
}

#pricing-tab #tb-startSelling .sellerAppLogo {
  display: block;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
}

#pricing-tab #tb-startSelling .sellerAppName {
  display: inline-block;
  line-height: 1.2;
}

@media screen and (max-width: 480px) {
  #pricing-tab #tb-startSelling .sellerAppList {
    grid-template-columns: 1fr;
  }
}
/* =========================================================
   Yotpo Targeted Button Visibility Fixes
   Scope: Product reviews widget only
   ========================================================= */

/* 1) Reviews summary button: fix white-on-white */
#productReviews .yotpo-reviews-summary-button--style-1,
#productReviews .yotpo-reviews-summary-button--style-1[data-v-7e4cf4fd] {
  background: #5a5a5a !important;
  border: 1px solid #5a5a5a !important;
  color: #ffffff !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

/* Ensure inner text/icons inherit visible contrast */
#productReviews .yotpo-reviews-summary-button--style-1 *,
#productReviews .yotpo-reviews-summary-button--style-1[data-v-7e4cf4fd] * {
  color: #ffffff !important;
  fill: #ffffff !important;
}

/* Hover/focus state */
#productReviews .yotpo-reviews-summary-button--style-1:hover,
#productReviews .yotpo-reviews-summary-button--style-1:focus,
#productReviews .yotpo-reviews-summary-button--style-1:focus-visible,
#productReviews .yotpo-reviews-summary-button--style-1[data-v-7e4cf4fd]:hover,
#productReviews .yotpo-reviews-summary-button--style-1[data-v-7e4cf4fd]:focus,
#productReviews .yotpo-reviews-summary-button--style-1[data-v-7e4cf4fd]:focus-visible {
  background: #222222 !important;
  border-color: #222222 !important;
  color: #ffffff !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

/* Remove any Yotpo pseudo-layer that may create a rounded hover outline */
#productReviews .yotpo-reviews-summary-button--style-1::before,
#productReviews .yotpo-reviews-summary-button--style-1::after,
#productReviews .yotpo-reviews-summary-button--style-1[data-v-7e4cf4fd]::before,
#productReviews .yotpo-reviews-summary-button--style-1[data-v-7e4cf4fd]::after {
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}


/* =========================================================
   Yotpo Vertical Pagination
   Fix white text on white/light backgrounds
   ========================================================= */

#productReviews .yotpo-reviews-pagination-item,
#productReviews .yotpo-vertical-pagination-item,
#productReviews .yotpo-reviews-pagination-item.yotpo-vertical-pagination-item {
  background: #ffffff !important;
  border: 1px solid var(--apq-review-border) !important;
  color: var(--apq-review-text) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

/* Pagination inner text/icons */
#productReviews .yotpo-reviews-pagination-item *,
#productReviews .yotpo-vertical-pagination-item *,
#productReviews .yotpo-reviews-pagination-item.yotpo-vertical-pagination-item * {
  color: var(--apq-review-text) !important;
  fill: var(--apq-review-text) !important;
}

/* Pagination hover/focus/active */
#productReviews .yotpo-reviews-pagination-item:hover,
#productReviews .yotpo-reviews-pagination-item:focus,
#productReviews .yotpo-reviews-pagination-item:focus-visible,
#productReviews .yotpo-vertical-pagination-item:hover,
#productReviews .yotpo-vertical-pagination-item:focus,
#productReviews .yotpo-vertical-pagination-item:focus-visible,
#productReviews .yotpo-reviews-pagination-item.yotpo-vertical-pagination-item:hover,
#productReviews .yotpo-reviews-pagination-item.yotpo-vertical-pagination-item:focus,
#productReviews .yotpo-reviews-pagination-item.yotpo-vertical-pagination-item:focus-visible {
  background: var(--apq-review-soft-bg) !important;
  border-color: var(--apq-review-border-strong) !important;
  color: var(--apq-review-text) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

/* If Yotpo marks current/selected pagination item */
#productReviews .yotpo-reviews-pagination-item.active,
#productReviews .yotpo-reviews-pagination-item.yotpo-active,
#productReviews .yotpo-vertical-pagination-item.active,
#productReviews .yotpo-vertical-pagination-item.yotpo-active {
  background: #5a5a5a !important;
  border-color: #5a5a5a !important;
  color: #ffffff !important;
}

#productReviews .yotpo-reviews-pagination-item.active *,
#productReviews .yotpo-reviews-pagination-item.yotpo-active *,
#productReviews .yotpo-vertical-pagination-item.active *,
#productReviews .yotpo-vertical-pagination-item.yotpo-active * {
  color: #ffffff !important;
  fill: #ffffff !important;
}


/* =========================================================
   Smart Topic Filters
   Fix white text on light grey
   ========================================================= */

#productReviews .yotpo-smart-topic-filter {
  background: #ffffff !important;
  border: 1px solid var(--apq-review-border) !important;
  color: var(--apq-review-text) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

/* Smart topic filter text/icons */
#productReviews .yotpo-smart-topic-filter *,
#productReviews .yotpo-smart-topic-filter span,
#productReviews .yotpo-smart-topic-filter div,
#productReviews .yotpo-smart-topic-filter button {
  color: var(--apq-review-text) !important;
  fill: var(--apq-review-text) !important;
}

/* Smart topic hover/focus */
#productReviews .yotpo-smart-topic-filter:hover,
#productReviews .yotpo-smart-topic-filter:focus,
#productReviews .yotpo-smart-topic-filter:focus-visible {
  background: var(--apq-review-soft-bg) !important;
  border-color: var(--apq-review-border-strong) !important;
  color: var(--apq-review-text) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

/* Smart topic selected/active state */
#productReviews .yotpo-smart-topic-filter.active,
#productReviews .yotpo-smart-topic-filter.yotpo-active,
#productReviews .yotpo-smart-topic-filter[aria-pressed="true"],
#productReviews .yotpo-smart-topic-filter[aria-selected="true"] {
  background: #5a5a5a !important;
  border-color: #5a5a5a !important;
  color: #ffffff !important;
}

#productReviews .yotpo-smart-topic-filter.active *,
#productReviews .yotpo-smart-topic-filter.yotpo-active *,
#productReviews .yotpo-smart-topic-filter[aria-pressed="true"] *,
#productReviews .yotpo-smart-topic-filter[aria-selected="true"] * {
  color: #ffffff !important;
  fill: #ffffff !important;
}

/* Remove possible rounded pseudo hover layers */
#productReviews .yotpo-smart-topic-filter::before,
#productReviews .yotpo-smart-topic-filter::after,
#productReviews .yotpo-reviews-pagination-item::before,
#productReviews .yotpo-reviews-pagination-item::after,
#productReviews .yotpo-vertical-pagination-item::before,
#productReviews .yotpo-vertical-pagination-item::after {
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}
/* =========================================================
   Order For Me - No Minimums Callout
   Scoped to product listing pricing tab only.
   ========================================================= */

#pricing-tab #tb-orderForMe .orderForMeNoMinimums {
  width: 42%;
  vertical-align: middle;
  padding: 0 0 0 16px;
  box-sizing: border-box;
}

#pricing-tab #tb-orderForMe .noMinimumCallout {
  display: block;
  width: 100%;
  padding: 16px;
  background: #f7f7f7;
  border: 1px solid rgba(0, 183, 152, 0.35);
  border-left: 5px solid #00b798;
  border-radius: 10px;
  box-sizing: border-box;
  text-align: left;
}

#pricing-tab #tb-orderForMe .noMinimumCallout strong {
  display: block;
  margin: 0;
  font-family: "Questrial", "Open Sans", Arial, sans-serif;
  font-size: 1.65rem;
  line-height: 1.1;
  color: #00b798;
  text-transform: lowercase;
}

#pricing-tab #tb-orderForMe .minimumSubtext {
  display: block;
  margin-top: 4px;
  font-size: 0.9rem;
  line-height: 1.25;
  color: #5a5a5a;
  text-transform: lowercase;
}

#pricing-tab #tb-orderForMe .bulkEstimateContainer {
  display: block;
  clear: both;
}

#pricing-tab #tb-orderForMe .orderForMePricingNote {
  display: block;
  width: 100%;
  margin: 8px 0 0;
  clear: both;
  color: #5a5a5a;
  font-size: 0.72rem;
  font-style: italic;
  line-height: 1.35;
}

@media screen and (max-width: 767px) {
  #pricing-tab #tb-orderForMe .orderForMeNoMinimums {
    display: block;
    width: 100%;
    padding: 12px 0 0;
  }

  #pricing-tab #tb-orderForMe .noMinimumCallout {
    padding: 14px;
  }

  #pricing-tab #tb-orderForMe .noMinimumCallout strong {
    font-size: 1.45rem;
  }
}


/* =========================================================
   Product Listing Conversion Reorganization
   Scope: top product listing section only
   Preserves pricing/service bindings; only changes layout and cards.
   ========================================================= */

#listing-priceServices {
  margin-bottom: 14px;
}

/*.listingInfoContainer .rightBox.conversionPanel .listing-customizeCTA {
  margin: 14px 0 16px;
  height: auto;
}

.listingInfoContainer .rightBox.conversionPanel .listing-customizeCTA .nextcta {
  min-height: 72px;
  max-height: none;
  border-radius: 10px;
  box-shadow: 0 6px 16px rgba(0, 183, 152, 0.18);
}*/

.listingConversionDetails {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin: 0 0 16px;
}

.listingInfoContainer .rightBox.conversionPanel .conversionInfoCard,
.listingInfoContainer .rightBox.conversionPanel .product-description {
  height: auto !important;
  min-height: 0 !important;
  padding: 16px !important;
  margin: 0 0 12px !important;
  background: #ffffff;
  border: 1px solid rgba(90, 90, 90, 0.16);
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(90, 90, 90, 0.06);
  box-sizing: border-box;
}

.listingInfoContainer .rightBox.conversionPanel .conversionInfoCard h2,
.listingInfoContainer .rightBox.conversionPanel .product-description h2 {
  margin: 0 0 8px;
  font-size: 1.15rem;
  line-height: 1.25;
}

.listingInfoContainer .rightBox.conversionPanel .deliveryDateInfo {
  padding: 0;
  margin: 0;
  line-height: 1.5rem;
}

.listingInfoContainer .rightBox.conversionPanel .fabricDetailInfo ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.listingInfoContainer .rightBox.conversionPanel .fabricDetailInfo li {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: 7px 0;
  border-bottom: 1px solid rgba(90, 90, 90, 0.12);
  font-size: 0.92rem;
}

.listingInfoContainer .rightBox.conversionPanel .fabricDetailInfo li:last-child {
  border-bottom: 0;
}

.listingInfoContainer .rightBox.conversionPanel .fabricDetailInfo li span:first-child {
  color: #5a5a5a;
  font-weight: 600;
  text-transform: lowercase;
}

.listingInfoContainer .rightBox.conversionPanel #product-description {
  max-height: 220px;
}

.listingInfoContainer .rightBox.conversionPanel .product-description {
  overflow-y: auto;
}

#benefits-features.productHighlights {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid rgba(90, 90, 90, 0.14);
}

#benefits-features.productHighlights .leftBox,
#benefits-features.productHighlights .rightBox {
  width: auto;
  min-width: 0;
  max-width: none;
  float: none;
  padding: 16px;
  background: #ffffff;
  border: 1px solid rgba(90, 90, 90, 0.14);
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(90, 90, 90, 0.05);
}

#benefits-features.productHighlights h2 {
  margin-top: 0;
  font-size: 1.2rem;
}

@media screen and (min-width: 768px) {
  .listingConversionDetails {
    grid-template-columns: 1fr 1fr;
  }

  #benefits-features.productHighlights {
    grid-template-columns: 1fr 1fr;
  }
}

@media screen and (min-width: 1024px) {
  .listingInfoContainer .rightBox.conversionPanel {
    min-width: 465px;
    width: 465px;
    float: right;
  }
}

@media screen and (min-width: 1200px) {
  .listingInfoContainer .rightBox.conversionPanel {
    min-width: 550px;
    width: 550px;
  }
}

/* =========================================================
   Product Listing Conversion Reorg - Pass 2
   Stronger shipping promise + left-column visual story
   ========================================================= */

.listingInfoContainer .rightBox.conversionPanel .conversionShippingCard {
  width: 100%;
  border-color: rgba(0, 183, 152, 0.28);
  border-left: 5px solid #00b798;
  background: linear-gradient(135deg, #ffffff 0%, #f4fffd 100%);
}

.listingInfoContainer .rightBox.conversionPanel .conversionShippingCard h2 {
  font-size: 1.35rem;
  color: #222222;
}

.listingInfoContainer .rightBox.conversionPanel .conversionCardIntro {
  margin: 0 0 10px;
  font-size: 0.92rem;
  line-height: 1.45;
  color: #5a5a5a;
}

.listingInfoContainer .rightBox.conversionPanel .conversionShippingCard .deliveryDateInfo {
  padding: 10px 12px;
  background: #ffffff;
  border: 1px solid rgba(0, 183, 152, 0.18);
  border-radius: 8px;
  font-size: 0.98rem;
}

.listingInfoContainer .rightBox.conversionPanel .conversionShippingCard .d_firstclass,
.listingInfoContainer .rightBox.conversionPanel .conversionShippingCard .d_rush {
  color: #00b798;
  font-weight: 700;
}

.listingInfoContainer .rightBox.conversionPanel .conversionProductDetails {
  margin-top: 0 !important;
}

@media screen and (min-width: 768px) {
  .listingConversionDetails {
    grid-template-columns: 1fr;
  }
}

/* =========================================================
   Product Details & Size Chart Refinements
   Scope: product listing conversion layout only
   ========================================================= */

.listingInfoContainer .rightBox.conversionPanel .conversionProductDetails {
  min-height: 200px !important;
  height: auto !important;
  overflow: hidden;
  clear: both;
}

.listingInfoContainer .rightBox.conversionPanel .conversionProductDetails .fabricDetailInfo {
  display: block;
  width: 100%;
  overflow: hidden;
}

.listingInfoContainer .rightBox.conversionPanel .conversionProductDetails .fabricDetailInfo ul {
  display: block;
  width: 100%;
}

.listingInfoContainer .rightBox.conversionPanel .conversionProductDetails .fabricDetailInfo li {
  align-items: flex-start;
}

.productSizeChartSection {
  margin-top: 20px;
}

.productSizeChartSection .productSizeChartIntro {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 8px 0;
}

.productSizeChartSection h2 {
  margin: 0 0 6px;
  font-family: "Questrial", "Open Sans", Arial, sans-serif;
  font-size: 1.5rem;
  line-height: 1.25;
  color: #222222;
  text-align: left;
  text-transform: lowercase;
}

.productSizeChartSection p {
  margin: 0;
  max-width: 760px;
  color: #5a5a5a;
  font-size: 0.98rem;
  line-height: 1.5;
  text-align: left;
}

.productSizeChartButton {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  flex: 0 0 auto;
  min-height: 48px;
  padding: 12px 18px;
  background: #00b798;
  border: 1px solid #00b798;
  border-radius: 8px;
  color: #ffffff;
  font-family: "Open Sans", Arial, sans-serif;
  font-size: 0.95rem;
  font-weight: 700;
  line-height: 1.2;
  text-transform: lowercase;
  cursor: pointer;
  box-shadow: 0 6px 16px rgba(0, 183, 152, 0.16);
}

.productSizeChartButton:hover,
.productSizeChartButton:focus {
  background: #222222;
  border-color: #2b3237;
  color: #ffffff;
  outline: 0;
}

.productSizeChartButton .sizeIcon {
  display: inline-block;
  width: 22px;
  height: 22px;
  object-fit: contain;
  filter: brightness(0) invert(1);
}

@media screen and (max-width: 767px) {
  .listingInfoContainer .rightBox.conversionPanel .conversionProductDetails {
    min-height: 0 !important;
  }

  .productSizeChartSection .productSizeChartIntro {
    display: block;
  }

  .productSizeChartButton {
    width: 100%;
    margin-top: 14px;
  }
}


/* =========================================================
   Order For Me - Minimum Callout Fix
   Avoids using .g-container-right so service pricing scripts do not
   accidentally target this content as a pricing column.
   ========================================================= */

#pricing-tab #tb-orderForMe .orderForMeMinimums {
  display: table-cell;
  width: 42%;
  vertical-align: middle;
  padding: 0 0 0 16px;
  box-sizing: border-box;
}

#pricing-tab #tb-orderForMe .minimumCallout {
  display: block;
  width: 100%;
  padding: 16px;
  background: #f7f7f7;
  border: 1px solid rgba(0, 183, 152, 0.35);
  border-left: 5px solid #00b798;
  border-radius: 10px;
  box-sizing: border-box;
  text-align: left;
}

#pricing-tab #tb-orderForMe .minimumCallout strong {
  display: block;
  margin: 0;
  font-family: "Questrial", "Open Sans", Arial, sans-serif;
  font-size: 1.65rem;
  line-height: 1.1;
  color: #00b798;
  text-transform: lowercase;
}

#pricing-tab #tb-orderForMe .minimumCallout.screenMinimumCallout {
  border-color: rgba(255, 182, 0, 0.45);
  border-left-color: #ffb600;
}

#pricing-tab #tb-orderForMe .minimumCallout.screenMinimumCallout strong {
  color: #222222;
}

#pricing-tab #tb-orderForMe .minimumSubtext {
  display: block;
  margin-top: 4px;
  font-size: 0.9rem;
  line-height: 1.25;
  color: #5a5a5a;
  text-transform: lowercase;
}

#pricing-tab #tb-orderForMe .minimumSubtext:empty {
  display: none;
}

@media screen and (max-width: 767px) {
  #pricing-tab #tb-orderForMe .orderForMeMinimums {
    display: block;
    width: 100%;
    padding: 12px 0 0;
  }

  #pricing-tab #tb-orderForMe .minimumCallout {
    padding: 14px;
  }

  #pricing-tab #tb-orderForMe .minimumCallout strong {
    font-size: 1.45rem;
  }
}


/* =========================================================
   Pricing Binding Safety Fixes
   Let viewable control seller app prompt visibility.
   Adds visible minimum callout text without computed text binding.
   ========================================================= */

#pricing-tab #tb-startSelling .sellerAppListing {
  display: block;
}

#pricing-tab #tb-orderForMe .orderForMeMinimums {
  display: table-cell;
  width: 42%;
  vertical-align: middle;
  padding: 0 0 0 16px;
  box-sizing: border-box;
}

#pricing-tab #tb-orderForMe .minimumCallout {
  display: block;
  width: 100%;
  padding: 16px;
  background: #f7f7f7;
  border: 1px solid rgba(0, 183, 152, 0.35);
  border-left: 5px solid #00b798;
  border-radius: 10px;
  box-sizing: border-box;
  text-align: left;
}

#pricing-tab #tb-orderForMe .minimumCallout strong,
#pricing-tab #tb-orderForMe .minimumNoMinimumText,
#pricing-tab #tb-orderForMe .minimumScreenText {
  display: block;
  margin: 0;
  font-family: "Questrial", "Open Sans", Arial, sans-serif;
  font-size: 1.65rem;
  line-height: 1.1;
  color: #00b798 !important;
  text-transform: lowercase;
}

#pricing-tab #tb-orderForMe .minimumSubtext {
  display: block;
  margin-top: 4px;
  font-size: 0.85rem;
  line-height: 1.2;
  color: #5a5a5a !important;
  font-style: italic;
  text-transform: lowercase;
}

@media screen and (max-width: 767px) {
  #pricing-tab #tb-orderForMe .orderForMeMinimums {
    display: block;
    width: 100%;
    padding: 10px 0 0;
  }

  #pricing-tab #tb-orderForMe .minimumCallout strong,
  #pricing-tab #tb-orderForMe .minimumNoMinimumText,
  #pricing-tab #tb-orderForMe .minimumScreenText {
    font-size: 1.35rem;
  }
}

/* =========================================================
   Product Listing Size Chart - Inline display
   ========================================================= */

.productSizeChartSection {
  padding: 24px;
}

.productSizeChartSection .productSizeChartIntro {
  display: block;
  margin: 0 0 16px;
}

.productSizeChartSection h2 {
  margin: 0 0 8px;
  font-family: "Questrial", "Open Sans", Arial, sans-serif;
  font-size: 1.5rem;
  line-height: 1.2;
  color: #222222;
  text-transform: lowercase;
}

.productSizeChartSection p {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.5;
  color: #5a5a5a;
}

.productSizeChartContent {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

.productSizeRecommendation {
  padding: 14px 16px;
  background: #f7f7f7;
  border-left: 5px solid #00b798;
  border-radius: 8px;
  box-sizing: border-box;
}

.productSizeChartImageWrap {
  width: 100%;
  overflow-x: auto;
  padding: 12px;
  background: #ffffff;
  border: 1px solid rgba(90, 90, 90, 0.16);
  border-radius: 10px;
  box-sizing: border-box;
}

.productInlineSizeChart {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 0 auto;
}

@media screen and (min-width: 768px) {
  .productSizeChartSection {
    padding: 28px;
  }

  .productSizeChartContent {
    grid-template-columns: minmax(220px, 0.35fr) minmax(0, 0.65fr);
    align-items: start;
  }
}

/* =========================================================
   Service Selector Safe Refinement
   Scope: product listing pricing/service selector only
   Notes: preserves existing service icon/background-image styling
   ========================================================= */

#listing-priceServices #serviceOptionsWrap {
  border-radius: 10px;
  overflow: hidden;
}

#listing-priceServices #serviceOptionsWrap .serviceOptionListItem {
  border-radius: 10px;
  overflow: hidden;
}

#listing-priceServices #serviceOptionsWrap .serviceOptions {
  border-radius: 10px;
  overflow: hidden;
  box-sizing: border-box;
  transition: box-shadow 0.16s ease, transform 0.16s ease, outline-color 0.16s ease;
}

#listing-priceServices #serviceOptionsWrap .serviceOptions:hover,
#listing-priceServices #serviceOptionsWrap .serviceOptions:focus {
  outline: 2px solid rgba(0, 183, 152, 0.35);
  outline-offset: -2px;
  box-shadow: 0 4px 12px rgba(90, 90, 90, 0.12);
  transform: translateY(-1px);
}

    #listing-priceServices #serviceOptionsWrap .serviceOptionListItem input[type="radio"]:checked + .serviceOptions,
    #listing-priceServices #serviceOptionsWrap .serviceOptionListItem.selected .serviceOptions,
    #listing-priceServices #serviceOptionsWrap .serviceOptionListItem.active .serviceOptions,
    #listing-priceServices #serviceOptionsWrap .serviceOptionListItem.current .serviceOptions,
    #listing-priceServices #serviceOptionsWrap .serviceOptionListItem.selectedService .serviceOptions,
    #listing-priceServices #serviceOptionsWrap .serviceOptions.selected,
    #listing-priceServices #serviceOptionsWrap .serviceOptions.active,
    .productArtworkUnitChoice.active{
        outline: 3px solid #00b798;
        outline-offset: -3px;
        box-shadow: 0 6px 16px rgba(0, 183, 152, 0.18);
    }

#listing-priceServices #serviceOptionsWrap .serviceOptionListItem input[type="radio"]:checked + .serviceOptions .label,
#listing-priceServices #serviceOptionsWrap .serviceOptionListItem.selected .serviceOptions .label,
#listing-priceServices #serviceOptionsWrap .serviceOptionListItem.active .serviceOptions .label,
#listing-priceServices #serviceOptionsWrap .serviceOptionListItem.current .serviceOptions .label,
#listing-priceServices #serviceOptionsWrap .serviceOptionListItem.selectedService .serviceOptions .label,
#listing-priceServices #serviceOptionsWrap .serviceOptions.selected .label,
#listing-priceServices #serviceOptionsWrap .serviceOptions.active .label {
  color: inherit;
}

/* =========================================================
   Yotpo filter dropdown border fix
   Removes the visible border from the dropdown placeholder input
   without changing the surrounding Yotpo filter layout.
   ========================================================= */

.yotpo-dropdown-placeholder-input[data-v-7aac675c],
.yotpo-dropdown-placeholder-input[data-v-7aac675c]:hover,
.yotpo-dropdown-placeholder-input[data-v-7aac675c]:focus,
.yotpo-dropdown-placeholder-input[data-v-7aac675c]:focus-visible {
  border: none !important;
  border-color: transparent !important;
  outline: none !important;
  box-shadow: none !important;
}


/* =========================================================
   Product Listing Standalone Stock Block
   Scope: #productStockAvailability only
   ========================================================= */

#productStockAvailability {
  padding: 24px;
}

#productStockAvailability #supplier-apl-inv {
  min-height: 0;
  margin: 0;
}

#productStockAvailability #supplier-apl-inv .g-container {
  display: block;
  width: 100%;
}

#productStockAvailability h2 {
  margin: 0 0 8px;
  font-family: "Questrial", "Open Sans", Arial, sans-serif;
  font-size: 1.5rem;
  line-height: 1.2;
  color: #222222;
  text-align: left;
  text-transform: lowercase;
}

#productStockAvailability .short-desc {
  display: block;
  margin: 0 0 16px;
  color: #5a5a5a;
  font-size: 0.95rem;
  line-height: 1.5;
  text-align: left;
}

#productStockAvailability .selected-stock-colors {
  display: block;
  margin: 0 0 10px;
}

#productStockAvailability .stock-colors {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 0 0 16px;
  padding: 0;
  list-style: none;
}

#productStockAvailability .stock-colors li {
  cursor: pointer;
}

#productStockAvailability .supplier-updated {
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
  color: #5a5a5a;
  font-size: 0.85rem;
}

#productStockAvailability .supplier-updated .icon.refresh {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

#productStockAvailability .stock-overview-container {
  width: 100%;
  overflow-x: auto;
  padding: 12px;
  background: #ffffff;
  border: 1px solid rgba(90, 90, 90, 0.16);
  border-radius: 10px;
  box-sizing: border-box;
}

#productStockAvailability .stock-overview {
  width: 100%;
  min-width: 520px;
  border-collapse: collapse;
}

#productStockAvailability .stock-overview td {
  padding: 10px;
  border-bottom: 1px solid rgba(90, 90, 90, 0.12);
  color: #222222;
  font-size: 0.92rem;
  text-align: center;
  vertical-align: middle;
}

#productStockAvailability .stock-overview tr:last-child td {
  border-bottom: 0;
}

/* =========================================================
   Product Listing Standalone Artwork Placement Block
   Service-tab version, using existing metric selector + getMaxSize()
   Scope: #productArtworkOptions only
   ========================================================= */

#productArtworkOptions {
  padding: 24px;
}

#productArtworkOptions #artwork-placement-options {
  min-height: 0;
  margin: 0;
}

#productArtworkOptions .productArtworkHeader {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin: 0 0 18px;
}

#productArtworkOptions .productArtworkHeaderCopy {
  min-width: 0;
}

#productArtworkOptions h2,
#productArtworkOptions h3 {
  margin: 0;
  font-family: "Questrial", "Open Sans", Arial, sans-serif;
  color: #222222;
  line-height: 1.2;
  text-align: left;
  text-transform: lowercase;
}

#productArtworkOptions h2 {
  font-size: 1.5rem;
}

#productArtworkOptions h3 {
  font-size: 1.15rem;
}

#productArtworkOptions .productArtworkIntro,
#productArtworkOptions .productArtworkMeasurementCopy p {
  margin: 8px 0 0;
  max-width: 780px;
  color: #5a5a5a;
  font-size: 0.95rem;
  line-height: 1.5;
  text-align: left;
}

/*#productArtworkOptions .productArtworkHelpLink {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-height: 42px;
  padding: 10px 14px;
  background: #00b798;
  border: 1px solid #00b798;
  border-radius: 8px;
  color: #ffffff;
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
  text-transform: lowercase;
  box-shadow: 0 6px 16px rgba(0, 183, 152, 0.16);
}

#productArtworkOptions .productArtworkHelpLink:hover,
#productArtworkOptions .productArtworkHelpLink:focus {
  background: #222222;
  border-color: #2b3237;
  color: #ffffff;
  outline: 0;
  text-decoration: none;
}*/

#productArtworkOptions .productArtworkGuidelines {
  display: grid;
  grid-template-columns: 1fr;
  gap: 12px;
  margin: 0 0 20px;
}

#productArtworkOptions .productArtworkGuidelineCard {
  padding: 14px 16px;
  background: #f7f7f7;
  border: 1px solid rgba(90, 90, 90, 0.14);
  border-left: 5px solid #00b798;
  border-radius: 8px;
  box-sizing: border-box;
  text-align: left;
}

#productArtworkOptions .productArtworkGuidelineCard strong {
  display: block;
  margin: 0 0 4px;
  color: #222222;
  font-size: 0.95rem;
  line-height: 1.25;
  text-transform: lowercase;
}

#productArtworkOptions .productArtworkGuidelineCard span {
  display: block;
  color: #5a5a5a;
  font-size: 0.9rem;
  line-height: 1.4;
}

#productArtworkOptions .productArtworkMeasurementBar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 16px;
  margin: 0 0 16px;
  background: #ffffff;
  border: 1px solid rgba(90, 90, 90, 0.16);
  border-radius: 10px;
  box-sizing: border-box;
}

#productArtworkOptions .productArtworkMeasurementCopy {
  min-width: 0;
}

#productArtworkOptions .productArtworkUnitChoices {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 8px;
  flex: 0 0 auto;
  margin: 0;
}

#productArtworkOptions .productArtworkUnitChoices .unit-choice {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 38px;
  padding: 8px 10px;
  background: #f7f7f7;
  border: 1px solid rgba(90, 90, 90, 0.16);
  border-radius: 8px;
  box-sizing: border-box;
  cursor: pointer;
}

#productArtworkOptions .productArtworkUnitChoices .unit-choice:hover {
  border-color: rgba(0, 183, 152, 0.45);
  background: #ffffff;
}

#productArtworkOptions .productArtworkUnitChoices .radio-btn {
  display: inline-block;
  width: 18px;
  height: 18px;
  margin: 0;
  cursor: pointer;
}

#productArtworkOptions .productArtworkUnitChoices .choicelbl {
  color: #222222;
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1;
  text-transform: lowercase;
  cursor: pointer;
}

#productArtworkOptions .productArtworkServiceTabs {
  display: grid;
  grid-template-columns: 1fr;
  gap: 10px;
}

#productArtworkOptions .productArtworkServiceTab {
  display: block;
  background: #ffffff;
  border: 1px solid rgba(90, 90, 90, 0.16);
  border-radius: 10px;
  overflow: hidden;
  box-sizing: border-box;
}

#productArtworkOptions .productArtworkServiceTab[open] {
  border-color: rgba(0, 183, 152, 0.42);
  box-shadow: 0 4px 14px rgba(0, 183, 152, 0.09);
}

#productArtworkOptions .productArtworkServiceTabSummary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: 54px;
  padding: 14px 16px;
  background: #f7f7f7;
  color: #222222;
  cursor: pointer;
  list-style: none;
  box-sizing: border-box;
}

#productArtworkOptions .productArtworkServiceTabSummary::-webkit-details-marker {
  display: none;
}
/*
#productArtworkOptions .productArtworkServiceTabSummary::after {
  content: "+";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #ffffff;
  border: 1px solid rgba(90, 90, 90, 0.16);
  color: #5a5a5a;
  font-size: 1.2rem;
  line-height: 1;
}*/

#productArtworkOptions .productArtworkServiceTab[open] .productArtworkServiceTabSummary {
  background: #f4fffd;
}

#productArtworkOptions .productArtworkServiceTab[open] .productArtworkServiceTabSummary::after {
  content: "-";
  color: #00b798;
}

#productArtworkOptions .productArtworkServiceTitleWrap {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px 12px;
  min-width: 0;
}

#productArtworkOptions .productArtworkServiceHelpLink {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-height: 34px;
  padding: 8px 12px;
  margin-left: auto;
  background: #ffffff;
  border: 1px solid rgba(0, 183, 152, 0.45);
  border-radius: 999px;
  color: #00b798;
  font-family: "Open Sans", Arial, sans-serif;
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  text-transform: lowercase;
  white-space: nowrap;
  box-shadow: none;
}

#productArtworkOptions .productArtworkServiceHelpLink:hover,
#productArtworkOptions .productArtworkServiceHelpLink:focus {
  background: #00b798;
  border-color: #00b798;
  color: #ffffff;
  text-decoration: none;
  outline: 0;
}

#productArtworkOptions .productArtworkServiceName {
  color: #222222;
  font-family: "Questrial", "Open Sans", Arial, sans-serif;
  font-size: 1.05rem;
  font-weight: 700;
  line-height: 1.2;
  text-transform: lowercase;
}

/*
#productArtworkOptions .productArtworkServiceHint {
  color: #5a5a5a;
  font-size: 0.85rem;
  font-style: italic;
  line-height: 1.2;
  text-transform: lowercase;
}*/

#productArtworkOptions .productArtworkServicePanel {
  background: #ffffff;
}

#productArtworkOptions .artworkplacement-container {
  width: 100%;
  overflow-x: auto;
  padding: 12px;
  background: #ffffff;
  box-sizing: border-box;
}

#productArtworkOptions .placement-overview {
  width: 100%;
  min-width: 520px;
  border-collapse: collapse;
  table-layout: auto;
}

#productArtworkOptions .placement-overview th,
#productArtworkOptions .placement-overview td {
  padding: 12px 10px;
  border-bottom: 1px solid rgba(90, 90, 90, 0.12);
  color: #222222;
  font-size: 0.92rem;
  line-height: 1.35;
  text-align: left;
  vertical-align: middle;
}

#productArtworkOptions .placement-overview thead th {
  background: #f7f7f7;
  color: #5a5a5a;
  font-weight: 700;
  text-transform: lowercase;
}

#productArtworkOptions .placement-overview .placementAreaHeader,
#productArtworkOptions .placement-overview .placementAreaName {
  width: 24%;
  min-width: 220px;
  text-align: left;
  font-weight: 700;
}

/*#productArtworkOptions .placement-overview .placementSizeHeader,
#productArtworkOptions .placement-overview .placementServiceSize {
  width: 50%;
  text-align: left;
}*/

#productArtworkOptions .placement-overview tbody tr:last-child td {
  border-bottom: 0;
}

#productArtworkOptions .placementServiceSize .placementSizeValue {
  display: inline-block;
  min-width: 72px;
  padding: 7px 9px;
  background: #f7f7f7;
  border-radius: 6px;
  color: #222222;
  font-weight: 700;
}

@media screen and (min-width: 768px) {
  #productStockAvailability,
  #productArtworkOptions {
    padding: 28px;
  }

  #productArtworkOptions .productArtworkGuidelines {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  #productArtworkOptions .productArtworkServiceTabs {
    gap: 12px;
  }
}

@media screen and (max-width: 767px) {
  #productArtworkOptions .productArtworkHeader {
    display: block;
  }

  #productArtworkOptions .productArtworkHelpLink {
    width: 100%;
    margin-top: 14px;
  }

  #productArtworkOptions .productArtworkMeasurementBar {
    display: block;
  }

  #productArtworkOptions .productArtworkUnitChoices {
    justify-content: flex-start;
    margin-top: 14px;
  }

  #productArtworkOptions .productArtworkUnitChoices .unit-choice {
    flex: 1 1 auto;
  }

  #productArtworkOptions .productArtworkServiceTabSummary {
    align-items: flex-start;
    gap: 10px;
  }

  #productArtworkOptions .productArtworkServiceTitleWrap {
    display: flex;
    flex: 1 1 auto;
    align-items: flex-start;
    flex-direction: column;
    gap: 4px;
  }

  #productArtworkOptions .productArtworkServiceHelpLink {
    margin-left: 0;
    padding: 8px 10px;
    font-size: 0.78rem;
  }

  #productArtworkOptions .productArtworkServiceHint {
    display: none;
  }
}

/* =========================================================
   Product Artwork Unit Selector - Expanded Click Target
   Scope: #productArtworkOptions only
   Purpose: make the full unit pill clickable while preserving the
   existing customizer.selectMetric handler and metric ids.
   ========================================================= */

#productArtworkOptions .productArtworkUnitChoices .productArtworkUnitChoice {
  /*appearance: none;
  -webkit-appearance: none;
  display: inline-flex !important;*/
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 120px;
  min-height: 42px;
  padding: 9px 14px;
  margin: 0;
  background: #f7f7f7 !important;
  border: 1px solid rgba(90, 90, 90, 0.18) !important;
  border-radius: 8px;
  box-shadow: none;
  color: #222222;
  font-family: "Open Sans", Arial, sans-serif;
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  text-transform: lowercase;
  cursor: pointer;
  box-sizing: border-box;
}

#productArtworkOptions .productArtworkUnitChoices .productArtworkUnitChoice:hover,
#productArtworkOptions .productArtworkUnitChoices .productArtworkUnitChoice:focus,
#productArtworkOptions .productArtworkUnitChoices .productArtworkUnitChoice:focus-visible {
  background: #ffffff !important;
  border-color: rgba(0, 183, 152, 0.5) !important;
  outline: 0;
  box-shadow: 0 3px 10px rgba(90, 90, 90, 0.1);
}

#productArtworkOptions .productArtworkUnitChoices .productArtworkUnitChoice.choice-sel {
  background: #ffffff !important;
  border-color: #00b798 !important;
  box-shadow: 0 4px 12px rgba(0, 183, 152, 0.14);
}

#productArtworkOptions .productArtworkUnitChoices .productArtworkUnitIndicator {
  display: inline-block;
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  border: 2px solid rgba(90, 90, 90, 0.36);
  border-radius: 50%;
  background: #ffffff;
  box-sizing: border-box;
  position: relative;
}

#productArtworkOptions .productArtworkUnitChoices .productArtworkUnitChoice.choice-sel .productArtworkUnitIndicator {
  border-color: #00b798;
}

#productArtworkOptions .productArtworkUnitChoices .productArtworkUnitChoice.choice-sel .productArtworkUnitIndicator::after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #00b798;
}

#productArtworkOptions .productArtworkUnitChoices .productArtworkUnitChoice .choicelbl {
  pointer-events: none;
}

@media screen and (max-width: 767px) {
  #productArtworkOptions .productArtworkUnitChoices .productArtworkUnitChoice {
    flex: 1 1 calc(33.333% - 8px);
    min-width: 0;
  }
}


/* =========================================================
   Replacement Products + Brand CTA
   Scope: replacement/brand merchandising area only
   Note: HTML merge requires the template that renders #replacementHld
   and #brandItemsHld. These styles make the CTA appear as a button
   when placed inside the replacement block.
   ========================================================= */

#replacementHld .replacementBrandCta,
#replacementHld0 .replacementBrandCta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
  margin: 18px 0 0;
  padding: 16px;
  background: #f7f7f7;
  border: 1px solid rgba(90, 90, 90, 0.16);
  border-left: 5px solid #00b798;
  border-radius: 10px;
  box-sizing: border-box;
  text-align: left;
}

#replacementHld .replacementBrandCtaText,
#replacementHld0 .replacementBrandCtaText {
  display: block;
  color: #5a5a5a;
  font-size: 0.95rem;
  line-height: 1.4;
}

#replacementHld .replacementBrandButton,
#replacementHld0 .replacementBrandButton,
#brandItemsHld a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 11px 16px;
  background: #00b798;
  border: 1px solid #00b798;
  border-radius: 8px;
  color: #ffffff !important;
  font-family: "Open Sans", Arial, sans-serif;
  font-size: 0.95rem !important;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  text-decoration: none !important;
  text-transform: lowercase;
  box-shadow: 0 6px 16px rgba(0, 183, 152, 0.16);
  cursor: pointer;
}

#replacementHld .replacementBrandButton:hover,
#replacementHld .replacementBrandButton:focus,
#replacementHld0 .replacementBrandButton:hover,
#replacementHld0 .replacementBrandButton:focus,
#brandItemsHld a:hover,
#brandItemsHld a:focus {
  background: #222222;
  border-color: #2b3237;
  color: #ffffff !important;
  text-decoration: none !important;
  outline: 0;
}

@media screen and (max-width: 767px) {
  #replacementHld .replacementBrandCta,
  #replacementHld0 .replacementBrandCta {
    display: block;
  }

  #replacementHld .replacementBrandButton,
  #replacementHld0 .replacementBrandButton,
  #brandItemsHld a {
    width: 100%;
    margin-top: 12px;
  }
}

/* =========================================================
   Review Summary Click Affordance
   Scope: top review summary only
   ========================================================= */

#reviewSummary .yotpo-sr-bottom-line-text,
#reviewSummary .yotpo-sr-bottom-line-text--right-panel {
  text-decoration: underline !important;
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
  cursor: pointer;
}

#reviewSummary .yotpo-sr-bottom-line-text:hover,
#reviewSummary .yotpo-sr-bottom-line-text--right-panel:hover {
  color: #00b798 !important;
  text-decoration-thickness: 2px;
}

/* =========================================================
   Pricing & Services Help Link
   Smooth scrolls user to service details
   ========================================================= */

html {
    scroll-behavior: smooth;
}

.pricingServicesTitle {
    display: flex;
    align-items: baseline;
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: 8px;
}

.pricingServicesTitle .pricingHelpLink {
    display: inline-block;
    color: #00b798;
    font-family: "Open Sans", Arial, sans-serif;
    font-size: 0.85rem;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: underline;
    text-transform: lowercase;
    white-space: nowrap;
}

.pricingServicesTitle .pricingHelpLink::before {
    content: "(";
    color: #5a5a5a;
    font-weight: 400;
    text-decoration: none;
}

.pricingServicesTitle .pricingHelpLink::after {
    content: ")";
    color: #5a5a5a;
    font-weight: 400;
    text-decoration: none;
}

.pricingServicesTitle .pricingHelpLink:hover {
    color: #222222;
}

/* Helps prevent the target section from landing underneath sticky headers */
#services-info {
    scroll-margin-top: 90px;
}

/* =========================================================
   Start Selling - Screen Print Warehouse Callout
   Replaces VIP promo area for logged-in screen print pricing.
   Scoped to product listing pricing tab only.
   ========================================================= */

#pricing-tab #tb-startSelling .screenWarehouseCallout {
  display: block;
  width: 100%;
  padding: 16px;
  background: #f7f7f7;
  border: 1px solid rgba(0, 183, 152, 0.35);
  border-left: 5px solid #00b798;
  border-radius: 10px;
  box-sizing: border-box;
  text-align: left;
}

#pricing-tab #tb-startSelling .screenWarehouseCallout strong {
  display: block;
  margin: 0;
  font-family: "Questrial", "Open Sans", Arial, sans-serif;
  font-size: 1.45rem;
  line-height: 1.12;
  color: #00b798;
  text-transform: lowercase;
}

#pricing-tab #tb-startSelling .screenWarehouseSubtext {
  display: block;
  margin-top: 6px;
  color: #5a5a5a;
  font-size: 0.9rem;
  line-height: 1.35;
  text-transform: lowercase;
}

#pricing-tab #tb-startSelling .screenWarehouseLink {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  margin-top: 12px;
  padding: 9px 13px;
  background: #00b798;
  border: 1px solid #00b798;
  border-radius: 8px;
  color: #ffffff;
  font-family: "Open Sans", Arial, sans-serif;
  font-size: 0.85rem;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
  text-transform: lowercase;
  box-shadow: 0 6px 16px rgba(0, 183, 152, 0.16);
}

#pricing-tab #tb-startSelling .screenWarehouseLink:hover,
#pricing-tab #tb-startSelling .screenWarehouseLink:focus {
  background: #222222;
  border-color: #2b3237;
  color: #ffffff;
  text-decoration: none;
  outline: 0;
}

@media screen and (max-width: 767px) {
  #pricing-tab #tb-startSelling .screenWarehouseCallout {
    padding: 14px;
    margin-top: 12px;
  }

  #pricing-tab #tb-startSelling .screenWarehouseCallout strong {
    font-size: 1.3rem;
  }

  #pricing-tab #tb-startSelling .screenWarehouseLink {
    width: 100%;
  }
}


/* =========================================================
   Bulk Savings Estimator
   Scope: product listing order-for-me pricing tab only
   Purpose: clearer quantity input, per-item price, total, and savings
   ========================================================= */

#pricing-tab #tb-orderForMe .bulkSavingsEstimator {
  display: block;
  clear: both;
  width: 100%;
  margin-top: 16px;
  padding: 18px;
  background: #ffffff;
  border: 1px solid rgba(90, 90, 90, 0.16);
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(90, 90, 90, 0.06);
  box-sizing: border-box;
}

#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateHeader {
  margin: 0 0 14px;
}

#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateHeader h2 {
  margin: 0 0 5px;
  font-family: "Questrial", "Open Sans", Arial, sans-serif;
  font-size: 1.35rem;
  line-height: 1.2;
  color: #222222;
  text-align: left;
  text-transform: lowercase;
}

#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateHeader p {
  margin: 0;
  color: #5a5a5a;
  font-size: 0.9rem;
  line-height: 1.4;
  text-align: left;
}

#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateGrid {
  display: grid;
  grid-template-columns: minmax(145px, 0.38fr) minmax(0, 0.62fr);
  gap: 16px;
  align-items: stretch;
}

#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateInputGroup {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
  padding: 14px;
  background: #f7f7f7;
  border: 1px solid rgba(90, 90, 90, 0.12);
  border-radius: 8px;
  box-sizing: border-box;
  text-align: left;
}

#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateLabel {
  display: block;
  margin: 0 0 7px;
  color: #222222;
  font-size: 0.88rem;
  font-weight: 700;
  line-height: 1.2;
  text-align: left;
  text-transform: lowercase;
}

#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateInput {
  display: block;
  width: 100%;
  min-height: 46px;
  padding: 8px 10px;
  background: #ffffff;
  border: 1px solid rgba(90, 90, 90, 0.28);
  border-radius: 8px;
  box-sizing: border-box;
  color: #222222;
  font-family: "Open Sans", Arial, sans-serif;
  font-size: 1.15rem;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
}

#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateInput:focus {
  border-color: #00b798;
  outline: 0;
  box-shadow: 0 0 0 3px rgba(0, 183, 152, 0.14);
}

#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateHint {
  display: block;
  margin-top: 8px;
  color: #5a5a5a;
  font-size: 0.78rem;
  font-style: italic;
  line-height: 1.3;
  text-align: left;
  text-transform: lowercase;
}

#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateResults {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  min-width: 0;
}

#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 82px;
  padding: 12px;
  background: #f7f7f7;
  border: 1px solid rgba(90, 90, 90, 0.12);
  border-radius: 8px;
  box-sizing: border-box;
  text-align: left;
}

#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric .bulkEstimateValue,
#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric span {
  display: block;
  margin: 0;
  color: #222222;
  font-family: "Questrial", "Open Sans", Arial, sans-serif;
  font-size: 1.45rem;
  font-weight: 700;
  line-height: 1.1;
  text-align: left;
}

#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric label {
  display: block;
  margin: 5px 0 0;
  color: #5a5a5a;
  font-size: 0.78rem;
  font-weight: 600;
  line-height: 1.2;
  text-align: left;
  text-transform: lowercase;
}

#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimatePrimary {
  grid-row: span 2;
  background: #ffffff;
  border-color: rgba(0, 183, 152, 0.35);
  border-left: 5px solid #00b798;
}

#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimatePrimary .bulkEstimateValue,
#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimatePrimary span {
  color: #00b798;
  font-size: 1.85rem;
}

#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateSavings {
  background: #f4fffd;
  border-color: rgba(0, 183, 152, 0.35);
}

#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateSavings .bulkEstimateValue,
#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateSavings span {
  color: #00b798;
}

@media screen and (max-width: 767px) {
  #pricing-tab #tb-orderForMe .bulkSavingsEstimator {
    padding: 14px;
  }

  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateGrid,
  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateResults {
    grid-template-columns: 1fr;
  }

  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimatePrimary {
    grid-row: auto;
  }

  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimatePrimary .bulkEstimateValue,
  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimatePrimary span {
    font-size: 1.65rem;
  }
}


/* =========================================================
   Listing Top Header - Preserve CTA Size + Wrap Dynamic H1
   Keeps the existing customize button dimensions intact while
   constraining long product names to the available left column.
   ========================================================= */

.listingInfoContainer.listingTop {
  display: block;
  overflow: hidden;
}

.listingInfoContainer.listingTop .listingHeaderCopy {
  display: block;
  box-sizing: border-box;
  min-width: 0;
}

.listingInfoContainer.listingTop .dyoHeadline {
  max-width: 100%;
  margin-bottom: 0;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: normal;
  line-height: 1.15;
}

.listingInfoContainer.listingTop #reviewSummary {
  clear: none;
}

@media screen and (min-width: 1024px) {
  .listingInfoContainer.listingTop .listingHeaderCopy {
    width: calc(100% - 590px);
    max-width: calc(100% - 590px);
    padding-right: 20px;
  }

  .listingInfoContainer.listingTop .listing-customizeCTA {
    width: 550px;
  }
}

@media screen and (max-width: 1023px) {
  .listingInfoContainer.listingTop .listingHeaderCopy {
    float: none !important;
    width: 100%;
    max-width: 100%;
  }
}

/* =========================================================
   Listing Top Header - Review Summary Under H1
   Keeps customize button sizing untouched and makes the Yotpo
   summary sit cleanly below dynamic product titles.
   ========================================================= */

.listingInfoContainer.listingTop .listingHeaderCopy .breadcrumbs-wrap {
  display: block;
  width: 100%;
  max-width: 100%;
}

.listingInfoContainer.listingTop #reviewSummary {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-wrap: wrap !important;
  width: 100% !important;
  max-width: 100% !important;
  min-height: 24px;
  margin: 7px 0 0 !important;
  padding: 0 !important;
  clear: none !important;
  text-align: left !important;
  line-height: 1.2;
}

.listingInfoContainer.listingTop #reviewSummary .yotpo-widget-instance,
.listingInfoContainer.listingTop #reviewSummary .yotpo-reviews-star-ratings-widget,
.listingInfoContainer.listingTop #reviewSummary .yotpo-sr-bottom-line-summary,
.listingInfoContainer.listingTop #reviewSummary .yotpo-bottom-line {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  width: auto !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  text-align: left !important;
  line-height: 1.2 !important;
}

.listingInfoContainer.listingTop #reviewSummary .yotpo-sr-bottom-line-text,
.listingInfoContainer.listingTop #reviewSummary .yotpo-sr-bottom-line-text--right-panel,
.listingInfoContainer.listingTop #reviewSummary .yotpo-bottom-line-text,
.listingInfoContainer.listingTop #reviewSummary .text-m {
  display: inline-flex !important;
  align-items: center !important;
  color: #5a5a5a !important;
  font-size: 0.9rem !important;
  line-height: 1.2 !important;
  white-space: normal !important;
}

@media screen and (max-width: 1023px) {
  .listingInfoContainer.listingTop #reviewSummary {
    margin-top: 8px !important;
  }
}

/* =========================================================
   Sticky Header Review Summary
   Adds compact Yotpo summary below sticky product title while
   preserving existing customize button size.
   ========================================================= */

.cc-customize-sticky .cc-top-bar-676 .cc-first-section .cc-sticky-copy, .cc-second-section .cc-sticky-copy {
    display: block;
    min-width: 0;
    width: calc(100% - 570px);
    max-width: 680px;
    float: left;
}

.cc-customize-sticky .cc-top-bar-676 .cc-first-section .cc-sticky-copy .cc-prd-name1 {
    float: none;
    width: 100%;
    max-width: 100%;
    line-height: 1.25;
    overflow-wrap: anywhere;
    word-break: normal;
}

#stickyReviewSummary {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 5px 0 0 !important;
    padding: 0 !important;
    clear: both;
    text-align: left !important;
    line-height: 1;
}

#stickyReviewSummary .yotpo-widget-instance,
#stickyReviewSummary .yotpo-reviews-star-ratings-widget,
#stickyReviewSummary .yotpo-sr-bottom-line-summary,
#stickyReviewSummary .yotpo-bottom-line {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex-wrap: wrap !important;
    gap: 5px !important;
    width: auto !important;
    max-width: 100% !important;
    margin: 0 !important;
    text-align: left !important;
    line-height: 1 !important;
}

#stickyReviewSummary .yotpo-sr-bottom-line-text,
#stickyReviewSummary .yotpo-sr-bottom-line-text--right-panel,
#stickyReviewSummary .yotpo-bottom-line-text,
#stickyReviewSummary .text-m {
    color: #5a5a5a !important;
    font-size: 0.82rem !important;
    font-weight: 400 !important;
    line-height: 1.15 !important;
    text-align: left !important;
    text-transform: lowercase;
    text-decoration: underline !important;
    text-underline-offset: 3px;
    cursor: pointer;
}

#stickyReviewSummary .yotpo-star,
#stickyReviewSummary .yotpo-icon-star,
#stickyReviewSummary .yotpo-icon-half-star,
#stickyReviewSummary .yotpo-icon-empty-star,
#stickyReviewSummary svg {
    color: #ffb600 !important;
    fill: #ffb600 !important;
}

@media screen and (max-width: 767px) {
    .cc-customize-sticky .cc-top-bar-676 .cc-first-section .cc-sticky-copy {
        width: 100%;
        max-width: 100%;
        float: none;
    }

    #stickyReviewSummary {
        margin-top: 4px !important;
    }
}

/* =========================================================
   Bulk Savings Estimator - Responsive Containment Fix
   Keeps calculator content inside the pricing container on
   narrow desktop, tablet, and mobile widths.
   ========================================================= */

#pricing-tab #tb-orderForMe .bulkSavingsEstimator,
#pricing-tab #tb-orderForMe .bulkSavingsEstimator * {
  max-width: 100%;
  box-sizing: border-box;
}

#pricing-tab #tb-orderForMe .bulkSavingsEstimator {
  overflow: hidden;
}

#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateGrid,
#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateResults,
#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateInputGroup,
#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric {
  min-width: 0;
}

#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateInput {
  width: 100%;
  min-width: 0;
}

#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric .bulkEstimateValue,
#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric span {
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: break-word;
}

/* The right product column is narrow before the mobile breakpoint,
   so stack input/results earlier than 767px. */
@media screen and (max-width: 1023px) {
  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateGrid {
    grid-template-columns: 1fr;
  }

  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateResults {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimatePrimary {
    grid-row: span 2;
  }
}

/* Very narrow screens: stack every result card vertically. */
@media screen and (max-width: 560px) {
  #pricing-tab #tb-orderForMe .bulkSavingsEstimator {
    padding: 12px;
  }

  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateHeader h2 {
    font-size: 1.2rem;
  }

  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateHeader p,
  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateHint {
    font-size: 0.78rem;
  }

  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateResults {
    grid-template-columns: 1fr;
  }

  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimatePrimary {
    grid-row: auto;
  }

  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric {
    min-height: 0;
    padding: 11px;
  }

  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimatePrimary .bulkEstimateValue,
  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimatePrimary span {
    font-size: 1.55rem;
  }

  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric .bulkEstimateValue,
  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric span {
    font-size: 1.3rem;
  }
}

/* =========================================================
   Bulk Savings Estimator - Currency No-Wrap Refinement
   Keeps dollar values on one line and scales text down before
   allowing overflow or awkward currency wrapping.
   ========================================================= */

#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric .bulkEstimateValue,
#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric span {
  display: block;
  width: 100%;
  max-width: 100%;
  white-space: nowrap !important;
  overflow-wrap: normal !important;
  word-break: normal !important;
  overflow: hidden;
  text-overflow: clip;
  line-height: 1.05;
}

#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimatePrimary .bulkEstimateValue,
#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimatePrimary span {
  font-size: clamp(1.35rem, 3.2vw, 1.85rem);
}

#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric .bulkEstimateValue,
#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric span {
  font-size: clamp(1.05rem, 2.45vw, 1.45rem);
}

#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric {
  overflow: hidden;
}

@media screen and (max-width: 1023px) {
  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimatePrimary .bulkEstimateValue,
  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimatePrimary span {
    font-size: clamp(1.25rem, 4vw, 1.65rem);
  }

  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric .bulkEstimateValue,
  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric span {
    font-size: clamp(1rem, 3.2vw, 1.32rem);
  }
}

@media screen and (max-width: 560px) {
  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimatePrimary .bulkEstimateValue,
  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimatePrimary span {
    font-size: clamp(1.15rem, 7vw, 1.55rem);
  }

  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric .bulkEstimateValue,
  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric span {
    font-size: clamp(0.98rem, 6vw, 1.22rem);
  }
}

@media screen and (max-width: 380px) {
  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric {
    padding-left: 9px;
    padding-right: 9px;
  }

  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimatePrimary .bulkEstimateValue,
  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimatePrimary span {
    font-size: 1.18rem;
  }

  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric .bulkEstimateValue,
  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric span {
    font-size: 1rem;
  }
}

/* =========================================================
   Bulk Savings Estimator - Stack Results Before Clipping
   Keeps dollar values readable by stacking the estimate cards
   instead of shrinking them into unusable narrow columns.
   ========================================================= */

#pricing-tab #tb-orderForMe .bulkSavingsEstimator {
  overflow: visible;
}

#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric {
  overflow: visible;
}

#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric .bulkEstimateValue,
#pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric span {
  overflow: visible;
  text-overflow: clip;
}

/* The pricing panel lives in a narrow right column on most layouts,
   so stack the value cards before dollar amounts get clipped. */
@media screen and (max-width: 1200px) {
  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateGrid {
    grid-template-columns: 1fr;
  }

  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateResults {
    grid-template-columns: 1fr;
  }

  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimatePrimary {
    grid-row: auto;
  }

  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric {
    min-height: 0;
    padding: 13px 14px;
  }

  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimatePrimary .bulkEstimateValue,
  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimatePrimary span {
    font-size: clamp(1.35rem, 3.8vw, 1.7rem);
  }

  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric .bulkEstimateValue,
  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric span {
    font-size: clamp(1.15rem, 3vw, 1.4rem);
  }
}

@media screen and (max-width: 480px) {
  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimatePrimary .bulkEstimateValue,
  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimatePrimary span {
    font-size: clamp(1.15rem, 6.4vw, 1.45rem);
  }

  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric .bulkEstimateValue,
  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric span {
    font-size: clamp(1rem, 5.4vw, 1.22rem);
  }
}

@media screen and (max-width: 340px) {
  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric {
    padding-left: 8px;
    padding-right: 8px;
  }

  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric .bulkEstimateValue,
  #pricing-tab #tb-orderForMe .bulkSavingsEstimator .bulkEstimateMetric span {
    font-size: 0.92rem;
  }
}
/* =========================================================
   Benefits & Features List Styling
   Adds subtle bullet treatment so list content scans clearly
   ========================================================= */

#benefits-features .g-listitems ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

#benefits-features .g-listitems ul li {
    position: relative;
    padding-left: 18px;
    margin: 0 0 8px;
    line-height: 1.45;
    color: #222222;
}

#benefits-features .g-listitems ul li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.68em;
    width: 5px;
    height: 5px;
    background: #00b798;
    border-radius: 50%;
    transform: translateY(-50%);
}

#benefits-features .g-listitems ul li:last-child {
    margin-bottom: 0;
}
/* =========================================================
   Service Card Use List
   Small bullets for quick service recommendations
   ========================================================= */

.cz-price-sample-container .srvContainer .srvUseList {
    margin: 12px 0 0;
    padding: 0;
    list-style: none;
    text-align: left;
}

.cz-price-sample-container .srvContainer .srvUseList li {
    position: relative;
    padding-left: 16px;
    margin: 0 0 7px;
    color: #222222;
    font-size: 0.85rem;
    line-height: 1.35;
}

.cz-price-sample-container .srvContainer .srvUseList li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0.62em;
    width: 5px;
    height: 5px;
    background: #00b798;
    border-radius: 50%;
    transform: translateY(-50%);
}

.cz-price-sample-container .srvContainer .srvUseList li:last-child {
    margin-bottom: 0;
}

/* =========================================================
   Service Card Use List Highlight
   Apply class="srvUseHighlight" to any service-card LI that
   should be emphasized as the key recommendation.
   ========================================================= */

.cz-price-sample-container .srvContainer .srvUseList li.srvUseHighlight {
    padding: 8px 10px 8px 16px;
    margin: 2px 0 9px;
    background: rgba(0, 183, 152, 0.10);
    border: 1px solid rgba(0, 183, 152, 0.28);
    border-left: 4px solid #00b798;
    border-radius: 8px;
    color: #222222;
    font-weight: 700;
}

.cz-price-sample-container .srvContainer .srvUseList li.srvUseHighlight::before {
    content: "recommended";
    position: static;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    height: auto;
    margin: 0 7px 0 0;
    padding: 3px 7px;
    background: #00b798;
    border-radius: 999px;
    color: #ffffff;
    font-family: "Open Sans", Arial, sans-serif;
    font-size: 0.62rem;
    font-weight: 800;
    line-height: 1;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    transform: none;
    vertical-align: middle;
}

/* =========================================================
   Branding Service Cards
   Visually separates retail branding from print/embroidery cards
   Scope: #branding-services-info only
   ========================================================= */

#branding-services-info .srvContainer {
    background: #1f2428;
    color: #ffffff;
    border: 1px solid rgba(255, 255, 255, 0.12);
    outline: none;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.16);
}

#branding-services-info .srvContainer h3,
#branding-services-info .srvContainer .srvDesc,
#branding-services-info .srvContainer .srvUseList li {
    color: #ffffff;
}

#branding-services-info .srvContainer .srvUseList li::before {
    background: #00b798;
}

#branding-services-info .srvContainer .srvUseList li.srvUseHighlight {
    background: rgba(0, 183, 152, 0.18);
    border-color: rgba(0, 183, 152, 0.50);
    border-left-color: #00b798;
    color: #ffffff;
}

#branding-services-info .srvContainer .srvUseList li.srvUseHighlight::before {
    background: #00b798;
    color: #ffffff;
}

#branding-services-info .srvContainer .srvImage {
    border-radius: 8px;
    box-shadow: 0 4px 14px rgba(255, 255, 255, 0.10);
}

#branding-services-info .srvContainer .srvLnk a {
    color: #00b798;
    font-weight: 700;
    text-decoration: underline;
}

#branding-services-info .srvContainer .srvLnk a:hover,
#branding-services-info .srvContainer .srvLnk a:focus {
    color: #ffffff;
}

#branding-services-info .srvContainer .srvIcon {
    filter: brightness(0) invert(1);
}

#branding-services-info .srvContainer:hover {
    border-color: #00b798;
    box-shadow: 0 10px 26px rgba(0, 183, 152, 0.22);
}

/* =========================================================
   Service Scroller Arrows
   Stronger, more obvious arrows for print + branding sections
   ========================================================= */

#services-info .servicePrev,
#services-info .serviceNext,
#branding-services-info .servicePrev,
#branding-services-info .serviceNext,
#branding-services-info .brandservicePrev,
#branding-services-info .brandserviceNext,
#branding-services-info .prev,
#branding-services-info .next {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 46px;
    height: 46px;
    min-width: 46px;
    min-height: 46px;
    padding: 0;
    background: #ffffff;
    border: 2px solid #00b798;
    border-radius: 50%;
    color: #00b798;
    font-size: 2rem;
    line-height: 1;
    font-weight: 700;
    text-decoration: none;
    box-shadow: 0 6px 16px rgba(0, 183, 152, 0.22);
    cursor: pointer;
    z-index: 10;
    transition: background 0.16s ease, color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

#services-info .servicePrev:hover,
#services-info .serviceNext:hover,
#branding-services-info .servicePrev:hover,
#branding-services-info .serviceNext:hover,
#branding-services-info .brandservicePrev:hover,
#branding-services-info .brandserviceNext:hover,
#branding-services-info .prev:hover,
#branding-services-info .next:hover,
#services-info .servicePrev:focus,
#services-info .serviceNext:focus,
#branding-services-info .servicePrev:focus,
#branding-services-info .serviceNext:focus,
#branding-services-info .brandservicePrev:focus,
#branding-services-info .brandserviceNext:focus,
#branding-services-info .prev:focus,
#branding-services-info .next:focus {
    background: #00b798;
    color: #ffffff;
    border-color: #00b798;
    box-shadow: 0 8px 20px rgba(0, 183, 152, 0.32);
    outline: 0;
}

#services-info .servicePrev,
#branding-services-info .servicePrev,
#branding-services-info .brandservicePrev,
#branding-services-info .prev {
    left: 8px;
}

#services-info .serviceNext,
#branding-services-info .serviceNext,
#branding-services-info .brandserviceNext,
#branding-services-info .next {
    right: 8px;
}

/* Keep arrows visible against the new black branding cards */
#branding-services-info .servicePrev,
#branding-services-info .serviceNext,
#branding-services-info .brandservicePrev,
#branding-services-info .brandserviceNext,
#branding-services-info .prev,
#branding-services-info .next {
    background: #1f2428;
    color: #ffffff;
    border-color: #00b798;
}

#branding-services-info .servicePrev:hover,
#branding-services-info .serviceNext:hover,
#branding-services-info .brandservicePrev:hover,
#branding-services-info .brandserviceNext:hover,
#branding-services-info .prev:hover,
#branding-services-info .next:hover,
#branding-services-info .servicePrev:focus,
#branding-services-info .serviceNext:focus,
#branding-services-info .brandservicePrev:focus,
#branding-services-info .brandserviceNext:focus,
#branding-services-info .prev:focus,
#branding-services-info .next:focus {
    background: #00b798;
    color: #ffffff;
}

/* Mobile: keep arrows smaller and out of the way */
@media screen and (max-width: 767px) {
    #services-info .servicePrev,
    #services-info .serviceNext,
    #branding-services-info .servicePrev,
    #branding-services-info .serviceNext,
    #branding-services-info .brandservicePrev,
    #branding-services-info .brandserviceNext,
    #branding-services-info .prev,
    #branding-services-info .next {
        width: 38px;
        height: 38px;
        min-width: 38px;
        min-height: 38px;
        font-size: 1.55rem;
    }
}


/* =========================================================
   Branding Service Cards - Link Visibility Fix
   Keeps links readable on black branding cards only
   ========================================================= */

#branding-services-info .srvContainer a,
#branding-services-info .srvContainer a:visited,
#branding-services-info .srvContainer .srvLnk a,
#branding-services-info .srvContainer .srvLnk a:visited {
    color: #ffffff !important;
    text-decoration: underline;
    text-decoration-color: rgba(255, 255, 255, 0.72);
    text-underline-offset: 4px;
}

#branding-services-info .srvContainer a:hover,
#branding-services-info .srvContainer a:focus,
#branding-services-info .srvContainer .srvLnk a:hover,
#branding-services-info .srvContainer .srvLnk a:focus {
    color: #00b798 !important;
    text-decoration-color: #00b798;
    outline: 0;
}

#branding-services-info .srvContainer a *,
#branding-services-info .srvContainer .srvLnk a * {
    color: inherit !important;
}

#branding-services-info .srvContainer .srvIcon {
    filter: brightness(0) invert(1);
}

#branding-services-info .srvContainer a:hover .srvIcon,
#branding-services-info .srvContainer a:focus .srvIcon,
#branding-services-info .srvContainer .srvLnk a:hover .srvIcon,
#branding-services-info .srvContainer .srvLnk a:focus .srvIcon {
    filter: none;
}


/* =========================================================
   Branding Service Cards - Softer Dark Background
   Replaces pure black with a warmer charcoal that is easier
   to read while still visually separating branding services.
   ========================================================= */

#branding-services-info .srvContainer {
    background: #1f2428;
    border-color: rgba(255, 255, 255, 0.12);
}

#branding-services-info .srvContainer:hover {
    border-color: #00b798;
    box-shadow: 0 10px 26px rgba(0, 183, 152, 0.20);
}

#branding-services-info .servicePrev,
#branding-services-info .serviceNext,
#branding-services-info .brandservicePrev,
#branding-services-info .brandserviceNext {
    background: #1f2428;
    color: #ffffff;
    border-color: #00b798;
}

#branding-services-info .srvContainer .srvUseHighlight {
    background: rgba(0, 183, 152, 0.16);
    border-color: rgba(0, 183, 152, 0.48);
}

/* =========================================================
   Mobile Sticky Header + Customize CTA Fix
   Scope: product listing page only
   Purpose: prevent sticky header / Yotpo summary from taking over
   the mobile viewport and center the customize CTA cleanly.
   ========================================================= */

@media screen and (max-width: 767px) {
  /* Keep sticky header compact and prevent injected widgets from expanding it */
  .cc-customize-sticky {
    width: 100% !important;
    max-width: 100vw !important;
   /* max-height: 132px !important;*/
    padding: 8px 10px 10px !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  .cc-customize-sticky .cc-top-bar-676 {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    box-sizing: border-box !important;
  }

  .cc-customize-sticky .cc-top-bar-676 .cc-first-section {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 7px !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  .cc-customize-sticky .cc-top-bar-676 .cc-first-section .cc-sticky-copy {
    display: block !important;
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: auto !important;
    max-height: 45px !important;
    margin: 0 !important;
    padding: 0 4px !important;
    overflow: hidden !important;
    text-align: center !important;
    box-sizing: border-box !important;
  }

  .cc-customize-sticky .cc-top-bar-676 .cc-first-section .cc-sticky-copy .cc-prd-name1,
  .cc-customize-sticky .cc-top-bar-676 .cc-first-section .cc-prd-name1 {
    display: block !important;
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #222222 !important;
    font-size: 0.92rem !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    text-align: center !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  /* Constrain the Yotpo instance inside the sticky header. */
  #stickyReviewSummary,
  .cc-customize-sticky #stickyReviewSummary,
  .cc-customize-sticky .stickyReviewSummary {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 17px !important;
    max-height: 17px !important;
    min-height: 0 !important;
    margin: 3px 0 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
    text-align: center !important;
    line-height: 1 !important;
    box-sizing: border-box !important;
  }

  .cc-customize-sticky #stickyReviewSummary *,
  .cc-customize-sticky .stickyReviewSummary * {
    max-width: 100% !important;
    max-height: 17px !important;
    line-height: 1 !important;
    font-size: 0.72rem !important;
    box-sizing: border-box !important;
  }

  .cc-customize-sticky #stickyReviewSummary .yotpo-widget-instance,
  .cc-customize-sticky #stickyReviewSummary .yotpo-reviews-star-ratings-widget,
  .cc-customize-sticky #stickyReviewSummary .yotpo-sr-bottom-line-summary,
  .cc-customize-sticky #stickyReviewSummary .yotpo-bottom-line,
  .cc-customize-sticky .stickyReviewSummary .yotpo-widget-instance,
  .cc-customize-sticky .stickyReviewSummary .yotpo-reviews-star-ratings-widget,
  .cc-customize-sticky .stickyReviewSummary .yotpo-sr-bottom-line-summary,
  .cc-customize-sticky .stickyReviewSummary .yotpo-bottom-line {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex-wrap: nowrap !important;
    width: auto !important;
    max-width: 100% !important;
    height: 17px !important;
    max-height: 17px !important;
    margin: 0 auto !important;
    overflow: hidden !important;
    white-space: nowrap !important;
  }

  .cc-customize-sticky #stickyReviewSummary .yotpo-sr-bottom-line-text,
  .cc-customize-sticky #stickyReviewSummary .yotpo-sr-bottom-line-text--right-panel,
  .cc-customize-sticky #stickyReviewSummary .yotpo-bottom-line-text,
  .cc-customize-sticky #stickyReviewSummary .text-m,
  .cc-customize-sticky .stickyReviewSummary .yotpo-sr-bottom-line-text,
  .cc-customize-sticky .stickyReviewSummary .yotpo-sr-bottom-line-text--right-panel,
  .cc-customize-sticky .stickyReviewSummary .yotpo-bottom-line-text,
  .cc-customize-sticky .stickyReviewSummary .text-m {
    display: inline-block !important;
    max-width: 148px !important;
    color: #5a5a5a !important;
    font-size: 0.72rem !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    vertical-align: middle !important;
  }

  /* Sticky customize CTA: centered, compact, and never wider than the viewport. */
  .cc-customize-sticky .cc-listing-customizeCTA {
    display: block !important;
    float: none !important;
    width: 100% !important;
    max-width: 340px !important;
    min-width: 0 !important;
    height: auto !important;
    margin: 0 auto !important;
    padding: 0 8px !important;
    box-sizing: border-box !important;
    text-align: center !important;
  }

  .cc-customize-sticky .cc-listing-customizeCTA .nextcta.button,
  .cc-customize-sticky .cc-listing-customizeCTA .nextcta {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    height: 48px !important;
    min-height: 48px !important;
    max-height: 48px !important;
    padding: 0 16px !important;
    margin: 0 auto !important;
    border-radius: 9px !important;
    line-height: 1 !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  .cc-customize-sticky .cc-listing-customizeCTA .button span,
  .cc-customize-sticky .cc-listing-customizeCTA .nexttxt {
    display: inline-block !important;
    font-size: 1.18rem !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }

  .cc-customize-sticky .cc-listing-customizeCTA .nexttxt br {
    display: none !important;
  }

/*  .cc-customize-sticky .cc-second-section {
    display: none !important;
  }*/

  /* Top-page customize CTA: stack below the H1, centered, and fit mobile width. */
  .listingInfoContainer.listingTop {
    padding-left: 14px !important;
    padding-right: 14px !important;
    overflow: visible !important;
  }

  .listingInfoContainer.listingTop .listingHeaderCopy {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    text-align: left !important;
  }

  .listingInfoContainer.listingTop .listing-customizeCTA {
    display: block !important;
    float: none !important;
    width: 100% !important;
    max-width: 360px !important;
    height: auto !important;
    margin: 14px auto 16px !important;
    padding: 0 !important;
    clear: both !important;
    text-align: center !important;
    box-sizing: border-box !important;
  }

  .listingInfoContainer.listingTop .listing-customizeCTA .nextcta,
  .listingInfoContainer.listingTop .listing-customizeCTA .nextcta.button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 56px !important;
    min-height: 56px !important;
    max-height: 56px !important;
    margin: 0 auto !important;
    padding: 0 18px !important;
    border-radius: 10px !important;
    line-height: 1 !important;
    box-sizing: border-box !important;
  }

  .listingInfoContainer.listingTop .listing-customizeCTA .nextcta .nexttxt,
  .listingInfoContainer.listingTop .listing-customizeCTA .button span {
    display: inline-block !important;
    font-size: 1.35rem !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }

  .listingInfoContainer.listingTop .listing-customizeCTA .nexttxt br {
    display: none !important;
  }
}

/* Extra-small phones: hide sticky review copy first, keep CTA usable. */
@media screen and (max-width: 380px) {
  .cc-customize-sticky {
    max-height: 116px !important;
  }

  .cc-customize-sticky .cc-top-bar-676 .cc-first-section .cc-sticky-copy {
    max-height: 24px !important;
  }

  #stickyReviewSummary,
  .cc-customize-sticky #stickyReviewSummary,
  .cc-customize-sticky .stickyReviewSummary {
    display: none !important;
  }

  .cc-customize-sticky .cc-listing-customizeCTA {
    max-width: 320px !important;
  }

  .cc-customize-sticky .cc-listing-customizeCTA .nextcta.button,
  .cc-customize-sticky .cc-listing-customizeCTA .nextcta {
    height: 46px !important;
    min-height: 46px !important;
    max-height: 46px !important;
  }
}

/* =========================================================
   Mobile Branding Services Slider Fix
   Scope: #branding-services-info only
   Purpose: make branding service cards behave like the main
   services slider on mobile instead of stacking all cards.
   ========================================================= */

#branding-services-info .brandservice-scrolling {
  width: 100%;
  margin: auto;
  overflow-y: hidden;
  overflow-x: auto;
}

#branding-services-info .brandserviceOptionsWrap {
  width: max-content;
  min-width: max-content;
  transition: all 500ms ease-out 0s;
}

@media screen and (min-width: 1024px) {
  #branding-services-info .brandservice-scrolling {
    overflow: hidden;
  }
}

@media screen and (max-width: 767px) {
  #branding-services-info .listingServiceScroller {
    position: relative;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
  }

  #branding-services-info .brandservice-scrolling {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x mandatory;
    padding: 0 0 8px;
    box-sizing: border-box;
  }

  #branding-services-info .brandserviceOptionsWrap {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: stretch;
    gap: 0;
    width: max-content !important;
    min-width: max-content !important;
    max-width: none !important;
  }

  #branding-services-info .brandserviceOptionsWrap .srvContainer {
    float: none !important;
    flex: 0 0 min(82vw, 325px);
    width: min(82vw, 325px) !important;
    max-width: min(82vw, 325px) !important;
    min-width: 0 !important;
    margin: 2px 14px 18px 2px !important;
    scroll-snap-align: start;
    box-sizing: border-box;
  }

  #branding-services-info .brandserviceOptionsWrap .srvContainer:last-child {
    margin-right: 2px !important;
  }
}

/* =========================================================
   Mobile Artwork Section Stacking Fix
   Scope: #productArtworkOptions only
   Purpose: prevent the unit selector and accordion service tabs
   from sitting side by side on mobile.
   ========================================================= */

@media screen and (max-width: 767px) {
  #productArtworkOptions,
  #productArtworkOptions * {
    box-sizing: border-box;
  }

  #productArtworkOptions .productArtworkMeasurementBar {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    clear: both !important;
    overflow: visible !important;
  }

  #productArtworkOptions .productArtworkMeasurementCopy {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  #productArtworkOptions .productArtworkUnitChoices {
    display: flex !important;
    align-items: stretch !important;
    justify-content: stretch !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 14px 0 0 !important;
    clear: both !important;
  }

  #productArtworkOptions .productArtworkUnitChoices .productArtworkUnitChoice {
    flex: 1 1 0 !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
  }

  #productArtworkOptions .productArtworkServiceTabs {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    clear: both !important;
    margin-top: 14px !important;
  }

  #productArtworkOptions .productArtworkServiceTab {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 10px !important;
    clear: both !important;
  }

  #productArtworkOptions .productArtworkServiceTabSummary {
    width: 100% !important;
    max-width: 100% !important;
  }
}

/* =========================================================
   Artwork Unit Selector State Guard
   Scope: #productArtworkOptions only
   Note: visual support for a single active unit. The actual
   de-selection behavior is handled by the small JS snippet below.
   ========================================================= */

#productArtworkOptions .productArtworkUnitChoices .productArtworkUnitChoice:not(.choice-sel) .productArtworkUnitIndicator::after {
  display: none !important;
}
/*
#productArtworkOptions .productArtworkUnitChoices .productArtworkUnitChoice:not(.choice-sel) {
  background: #f7f7f7 !important;
  border-color: rgba(90, 90, 90, 0.18) !important;
  box-shadow: none !important;
}*/

#productArtworkOptions .productArtworkUnitChoices .productArtworkUnitChoice.choice-sel {
  background: #ffffff !important;
  border-color: #00b798 !important;
  box-shadow: 0 4px 12px rgba(0, 183, 152, 0.14) !important;
}


/* =========================================================
   Shared Product Media Gallery
   Applies to standard product pages and subscription pages.
   Requires the productMediaGallery classes in the media block.
   ========================================================= */

.listingInfoContainer .leftBox .productMediaGallery {
  width: 100%;
  box-sizing: border-box;
  position: relative;
}

.listingInfoContainer .leftBox .productMediaList {
  padding: 0;
  margin: 0;
  list-style: none;
}

.listingInfoContainer .leftBox .productMediaItem {
  cursor: pointer;
  background: #f7f7f7;
  border: 1px solid rgba(90, 90, 90, 0.14);
  box-sizing: border-box;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

.listingInfoContainer .leftBox .productMediaItem:hover {
  border-color: rgba(0, 183, 152, 0.45);
  box-shadow: 0 4px 12px rgba(90, 90, 90, 0.12);
  transform: translateY(-1px);
}

.listingInfoContainer .leftBox .productMediaItem img,
.listingInfoContainer .leftBox .productMediaItem iframe,
.listingInfoContainer .leftBox .productMediaItem video {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.listingInfoContainer .leftBox .productMediaItem .youtubeVideoIcon {
  width: 100%;
  height: 100%;
  position: relative;
}

.listingInfoContainer .leftBox .productMediaItem .youtubeVideoIcon img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.listingInfoContainer .leftBox .productMediaItem .youtubeVideoIcon::after {
  content: "\25B6";
  display: flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  position: absolute;
  left: 50%;
  top: 50%;
  color: #ffffff;
  background: rgba(0, 0, 0, 0.62);
  border-radius: 50%;
  font-size: 1.35rem;
  line-height: 1;
  transform: translate(-50%, -50%);
}

@media screen and (min-width: 1024px) {
  .listingInfoContainer .leftBox .productMediaGallery {
    height: auto !important;
    margin-top: 16px;
  }

  .listingInfoContainer .leftBox .productMediaNav {
    width: 100%;
    height: auto;
    margin: 0;
    overflow: visible;
  }

  .listingInfoContainer .leftBox .productMediaListWrap {
    width: 100%;
    padding: 0;
    margin-left: 0 !important;
    transform: none !important;
    transition: none;
  }

  .listingInfoContainer .leftBox .productMediaList {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    height: auto;
    min-height: 0;
    white-space: normal;
  }

  .listingInfoContainer .leftBox .productMediaItem {
    display: block;
    width: 100%;
    height: auto;
    min-height: 220px;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    border-radius: 10px;
  }

  .listingInfoContainer .leftBox .productMediaGallery .prev,
  .listingInfoContainer .leftBox .productMediaGallery .next {
    display: none !important;
  }
}

@media screen and (min-width: 1200px) {
  .listingInfoContainer .leftBox .productMediaItem {
    min-height: 260px;
  }
}

@media screen and (max-width: 1023px) {
  .listingInfoContainer .leftBox .productMediaGallery {
    height: 110px;
  }

  .listingInfoContainer .leftBox .productMediaNav {
    width: 94%;
    margin: auto;
    overflow: hidden;
    height: inherit;
  }

  .listingInfoContainer .leftBox .productMediaListWrap {
    padding-left: 0;
    padding-right: 0;
    transition: all 500ms ease-out 0s;
  }

  .listingInfoContainer .leftBox .productMediaList {
    height: 110px;
    min-height: 110px;
    white-space: nowrap;
  }

  .listingInfoContainer .leftBox .productMediaItem {
    width: 100px;
    height: 100px;
    overflow: hidden;
    display: inline-block;
  }

  .listingInfoContainer .leftBox .productMediaGallery .prev,
  .listingInfoContainer .leftBox .productMediaGallery .next {
    display: block;
  }
}

@media screen and (max-width: 480px) {
  .listingInfoContainer .leftBox .productMediaNav {
    width: 90%;
  }

  .listingInfoContainer .leftBox .productMediaItem {
    width: 92px;
    height: 92px;
  }
}


/* =========================================================
   Subscription Listing Page - Scoped Additions
   Scope: .subscriptionListingPage only
   Purpose: subscription/supply pages use a different artwork router
   and do not depend on normal apparel service-selector bindings.
   ========================================================= */

.subscriptionListingPage #productArtworkOptions {
  padding: 24px;
}

.subscriptionListingPage #productArtworkOptions .subscriptionArtworkRouter,
.subscriptionListingPage #productArtworkOptions .subscriptionArtworkCards {
  display: block;
  width: 100%;
}

/*.subscriptionListingPage #productArtworkOptions .subscriptionArtworkCard {
  display: none;
}

.subscriptionListingPage #productArtworkOptions .subscriptionArtworkCard.is-active {
  display: block;
}*/

.subscriptionListingPage #productArtworkOptions .subscriptionArtworkCardHeader {
  display: block;
  margin: 0 0 16px;
  padding: 16px;
  background: #f4fffd;
  border: 1px solid rgba(0, 183, 152, 0.24);
  border-left: 5px solid #00b798;
  border-radius: 10px;
  box-sizing: border-box;
  text-align: left;
}

.subscriptionListingPage #productArtworkOptions .subscriptionArtworkCardHeader h3 {
  margin: 0 0 4px;
  font-family: "Questrial", "Open Sans", Arial, sans-serif;
  font-size: 1.25rem;
  line-height: 1.2;
  color: #222222;
  text-transform: lowercase;
}

.subscriptionListingPage #productArtworkOptions .subscriptionArtworkCardHeader span {
  display: block;
  color: #5a5a5a;
  font-size: 0.92rem;
  line-height: 1.35;
}

.subscriptionListingPage #productArtworkOptions .subscriptionArtworkDetails {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
  margin-top: 16px;
}

.subscriptionListingPage #productArtworkOptions .subscriptionArtworkDetailCard {
  padding: 18px;
  background: #ffffff;
  border: 1px solid rgba(90, 90, 90, 0.16);
  border-radius: 10px;
  box-shadow: 0 2px 8px rgba(90, 90, 90, 0.05);
  box-sizing: border-box;
  text-align: left;
}

.subscriptionListingPage #productArtworkOptions .subscriptionArtworkDetailCard h4 {
  margin: 0 0 10px;
  font-family: "Questrial", "Open Sans", Arial, sans-serif;
  font-size: 1.05rem;
  line-height: 1.2;
  color: #222222;
  text-transform: lowercase;
}

.subscriptionListingPage #productArtworkOptions .subscriptionArtworkDetailCard ul {
  margin: 0;
  padding-left: 1.25rem;
}

.subscriptionListingPage #productArtworkOptions .subscriptionArtworkDetailCard li {
  margin: 0 0 8px;
  color: #5a5a5a;
  font-size: 0.95rem;
  line-height: 1.45;
}

.subscriptionListingPage #productArtworkOptions .subscriptionArtworkDetailCard li:last-child {
  margin-bottom: 0;
}
h
.subscriptionListingPage #productArtworkOptions .subscriptionArtworkGuideLink {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  margin-top: 18px;
  padding: 11px 16px;
  background: #00b798;
  border: 1px solid #00b798;
  border-radius: 8px;
  color: #ffffff;
  font-family: "Open Sans", Arial, sans-serif;
  font-size: 0.92rem;
  font-weight: 700;
  line-height: 1.2;
  text-decoration: none;
  text-transform: lowercase;
  box-shadow: 0 6px 16px rgba(0, 183, 152, 0.16);
}

.subscriptionListingPage #productArtworkOptions .subscriptionArtworkGuideLink:hover,
.subscriptionListingPage #productArtworkOptions .subscriptionArtworkGuideLink:focus {
  background: #222222;
  border-color: #2b3237;
  color: #ffffff;
  text-decoration: none;
  outline: 0;
}

.subscriptionListingPage #productArtworkOptions[data-active-artwork-type="generic"] .productArtworkHelpLink {
  display: none;
}

@media screen and (min-width: 768px) {
  .subscriptionListingPage #productArtworkOptions {
    padding: 28px;
  }

  .subscriptionListingPage #productArtworkOptions .subscriptionArtworkDetails {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media screen and (max-width: 767px) {
  .subscriptionListingPage #productArtworkOptions .productArtworkHeader {
    display: block;
  }

  .subscriptionListingPage #productArtworkOptions .productArtworkHelpLink,
  .subscriptionListingPage #productArtworkOptions .subscriptionArtworkGuideLink {
    width: 100%;
    margin-top: 14px;
  }
}


/* =========================================================
   Subscription Pricing Copy Override
   Scope: subscription/supply listing pages only
   Purpose: private labels + neck prints read as available on demand
   without affecting standard product pages using shared CSS.
   ========================================================= */

.subscriptionListingPage .subscriptionPricingCard .subscriptionPriceBox {
  display: block;
}

.subscriptionListingPage .subscriptionPricingCard .subscriptionPriceValue {
  display: inline;
}

.subscriptionListingPage .subscriptionPricingCard .subscriptionPriceQtyWrap {
  display: inline-block;
}

.subscriptionListingPage .subscriptionPricingCard .subscriptionPriceForText,
.subscriptionListingPage .subscriptionPricingCard .subscriptionPriceQtyText {
  display: inline;
}

.subscriptionListingPage .subscriptionPricingCard .subscriptionPriceOnDemandText {
  display: none;
}

.subscriptionListingPage .subscriptionPricingCard.subscriptionPricingOnDemand .subscriptionPriceQtyWrap {
  display: none !important;
}

.subscriptionListingPage .subscriptionPricingCard.subscriptionPricingOnDemand .subscriptionPriceOnDemandText {
  display: inline-block;
}


/* =========================================================
   Subscription Pricing Labels
   Scope: subscription/supply listing pages only
   Purpose: replace generic "units" language with product-specific
   labels such as available on demand, 100 labels, or 50 patches.
   ========================================================= */

.subscriptionListingPage .subscriptionPricingCard .subscriptionPriceBox {
  display: block;
}

.subscriptionListingPage .subscriptionPricingCard .subscriptionPriceValue {
  display: inline-block;
  margin-right: 6px;
}

.subscriptionListingPage .subscriptionPricingCard .subscriptionPriceDescriptor {
  display: inline-block;
  color: #5a5a5a;
  font-size: 0.95rem;
  font-style: italic;
  line-height: 1.25;
  vertical-align: baseline;
  text-transform: lowercase;
}

/*.subscriptionListingPage .subscriptionPricingCard[data-subscription-pricing-type="private-label"] .subscriptionPriceDescriptor,
.subscriptionListingPage .subscriptionPricingCard[data-subscription-pricing-type="neck-print"] .subscriptionPriceDescriptor,*/
.subscriptionPriceDescriptor .availText {
    color: #00b798;
    font-weight: 700;
    font-style: normal;
}

/* =========================================================
   Product Media Gallery - Hard Cascade Override
   Applies to standard product pages and subscription products.
   Place at the very bottom of the shared listing CSS file.
   Purpose: override legacy .mobile-scroll, .pgNav, and .pgNav li rules.
   ========================================================= */

.listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery {
  width: 100% !important;
  box-sizing: border-box !important;
  position: relative !important;
}

.listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .productMediaList {
  padding: 0 !important;
  margin: 0 !important;
  list-style: none !important;
}

.listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .productMediaItem,
.listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .pgNav li.productMediaItem {
  cursor: pointer !important;
  background: #f7f7f7 !important;
  border: 1px solid rgba(90, 90, 90, 0.14) !important;
  box-sizing: border-box !important;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease !important;
}

.listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .productMediaItem:hover,
.listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .pgNav li.productMediaItem:hover {
  border-color: rgba(0, 183, 152, 0.45) !important;
  box-shadow: 0 4px 12px rgba(90, 90, 90, 0.12) !important;
  transform: translateY(-1px) !important;
}

.listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .productMediaItem img,
.listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .productMediaItem iframe,
.listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .productMediaItem video,
.listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .pgNav li.productMediaItem img,
.listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .pgNav li.productMediaItem iframe,
.listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .pgNav li.productMediaItem video {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .productMediaItem .youtubeVideoIcon {
  width: 100% !important;
  height: 100% !important;
  position: relative !important;
}

.listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .productMediaItem .youtubeVideoIcon img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
}

.listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .productMediaItem .youtubeVideoIcon::after {
  content: "\25B6" !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 52px !important;
  height: 52px !important;
  position: absolute !important;
  left: 50% !important;
  top: 50% !important;
  color: #ffffff !important;
  background: rgba(0, 0, 0, 0.62) !important;
  border-radius: 50% !important;
  font-size: 1.35rem !important;
  line-height: 1 !important;
  transform: translate(-50%, -50%) !important;
}

@media screen and (min-width: 1024px) {
  .listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery {
    height: auto !important;
    margin-top: 16px !important;
    overflow: visible !important;
  }

  .listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .productMediaNav,
  .listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery nav.mobile-scroll.productMediaNav {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
  }

  .listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .productMediaListWrap,
  .listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .listWrap.productMediaListWrap {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    margin-left: 0 !important;
    left: auto !important;
    transform: none !important;
    transition: none !important;
  }

  .listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .productMediaList,
  .listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery ul.pgNav.productMediaList {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    white-space: normal !important;
    overflow: visible !important;
  }

  .listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .productMediaItem,
  .listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .pgNav li.productMediaItem {
    display: block !important;
    float: none !important;
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    min-height: 220px !important;
    aspect-ratio: 1 / 1 !important;
    overflow: hidden !important;
    border-radius: 10px !important;
    vertical-align: initial !important;
  }

  .listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .prev,
  .listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .next {
    display: none !important;
  }
}

@media screen and (min-width: 1200px) {
  .listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .productMediaItem,
  .listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .pgNav li.productMediaItem {
    min-height: 260px !important;
  }
}

@media screen and (max-width: 1023px) {
  .listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery {
    height: 110px !important;
    overflow: visible !important;
  }

  .listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .productMediaNav,
  .listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery nav.mobile-scroll.productMediaNav {
    width: 94% !important;
    margin: auto !important;
    overflow: hidden !important;
    height: inherit !important;
  }

  .listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .productMediaListWrap,
  .listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .listWrap.productMediaListWrap {
    padding-left: 0 !important;
    padding-right: 0 !important;
    transition: all 500ms ease-out 0s !important;
  }

  .listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .productMediaList,
  .listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery ul.pgNav.productMediaList {
    height: 110px !important;
    min-height: 110px !important;
    white-space: nowrap !important;
    display: block !important;
  }

  .listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .productMediaItem,
  .listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .pgNav li.productMediaItem {
    width: 100px !important;
    height: 100px !important;
    min-height: 0 !important;
    aspect-ratio: auto !important;
    overflow: hidden !important;
    display: inline-block !important;
    border-radius: 0 !important;
  }

  .listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .prev,
  .listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .next {
    display: block !important;
  }
}

@media screen and (max-width: 480px) {
  .listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .productMediaNav,
  .listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery nav.mobile-scroll.productMediaNav {
    width: 90% !important;
  }

  .listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .productMediaItem,
  .listingInfoContainer .leftBox .viewOptionsContainer.productMediaGallery .pgNav li.productMediaItem {
    width: 92px !important;
    height: 92px !important;
  }
}