html,
body {
    font-size        : 14px;
    font-family      : "Segoe UI", Verdana, Arial, sans-serif;
    margin           : 0;
    background-color : #FCFCFC;
    position         : relative;
    height           : 100%
}
a,
a:link,
a:hover,
a:active,
a:visited {
    text-decoration : none;
    font-weight     : inherit;
    color           : inherit;
}
textarea {
    resize : none;
}
.errorlist {
    background    : #FEFEFE;
    border        : 1px solid #E6E6E6;
    border-radius : 6px 6px 6px 6px;
    color         : #333333;
    /*min-width     : 250px;*/
    padding       : 4px 7px;
    box-shadow    : 0 -1px 0 #F4F4F4 inset, 0 2px 3px rgba(0, 0, 0, 0.5);
}
.errorlist.positioned-error {
    position : absolute;
    z-index  : 1;
}
.errorlist.positioned-right {
    margin-left : 8px;
}
.errorlist.positioned-left {
    margin-right : 8px;
}
.errorlist .message-text:before {
    color          : #000000;
    content        : "* ";
    vertical-align : middle;
}
.errorlist .message-text {
    vertical-align : middle;
}
.errorlist.positioned-right .pointer {
    background : url("/wc/7.0.0/images/common/errorlist/errorlist-left-arrow.png") no-repeat scroll left top transparent;
    position   : absolute;
    left       : -9px;
    top        : 7px;
    width      : 10px;
    height     : 15px;
}
.errorlist.positioned-error .close-btn {
    background : url("/wc/7.0.0/images/common/errorlist/errorlist_close.png") no-repeat scroll left top transparent;
    height     : 12px;
    position   : absolute;
    right      : -6px;
    top        : -6px;
    width      : 12px;
    cursor     : pointer;
}
.errorlist.positioned-left .pointer {
    background : url("/wc/7.0.0/images/common/errorlist/errorlist-right-arrow.png") no-repeat scroll left top transparent;
    position   : absolute;
    right      : -10px;
    top        : 7px;
    width      : 10px;
    height     : 15px;
}
.errorlist.positioned-error.positioned-left .close-btn {
    background : url("/wc/7.0.0/images/common/errorlist/errorlist_close.png") no-repeat scroll left top transparent;
    height     : 12px;
    position   : absolute;
    left       : -6px;
    top        : -6px;
    width      : 12px;
    cursor     : pointer;
}
.error-field-error.inline-error,
.validation-error {
    background-color : #FFEEEE;
    border           : 1px solid #FF0000;
    color            : #FF0000;
}
.radio-checkbox-row.validation-error{
    border: 0;
    background: none;
}
.div-mask {
    background-color: #ffffffab;
    text-align       : center;
    z-index: 100;
}
.div-mask.bg-white {
    background-color : white;
}

.vertical-aligner {
    display        : inline-block;
    height         : 100%;
    vertical-align : middle;
}
.loader {
    font-size: 31px;
    width             : 1em;
    height            : 1em;
    border-radius     : 50%;
    margin            : -0.5em 0 0 -0.5em;
    -webkit-animation : load6 1.7s infinite ease;
    animation         : load6 1.7s infinite ease;
    position          : absolute;
    left              : 50%;
    top               : 50%;
}
@-webkit-keyframes load6 {
    0% {
        box-shadow : -0.11em -0.83em 0 -0.35em #1199C4, -0.11em -0.83em 0 -0.38em #1199C4, -0.11em -0.83em 0 -0.41em #1199C4, -0.11em -0.83em 0 -0.44em #1199C4, -0.11em -0.83em 0 -0.47em #1199C4;
    }
    5%,
    95% {
        box-shadow : -0.11em -0.83em 0 -0.35em #1199C4, -0.11em -0.83em 0 -0.38em #1199C4, -0.11em -0.83em 0 -0.41em #1199C4, -0.11em -0.83em 0 -0.44em #1199C4, -0.11em -0.83em 0 -0.47em #1199C4;
    }
    30% {
        box-shadow : -0.11em -0.83em 0 -0.35em #1199C4, -0.51em -0.66em 0 -0.38em #1199C4, -0.75em -0.36em 0 -0.41em #1199C4, -0.83em -0.03em 0 -0.44em #1199C4, -0.81em 0.21em 0 -0.47em #1199C4;
    }
    55% {
        box-shadow : -0.11em -0.83em 0 -0.35em #1199C4, -0.29em -0.78em 0 -0.38em #1199C4, -0.43em -0.72em 0 -0.41em #1199C4, -0.52em -0.65em 0 -0.44em #1199C4, -0.57em -0.61em 0 -0.47em #1199C4;
    }
    100% {
        -webkit-transform : rotate(360deg);
        box-shadow        : -0.11em -0.83em 0 -0.35em #1199C4, -0.11em -0.83em 0 -0.38em #1199C4, -0.11em -0.83em 0 -0.41em #1199C4, -0.11em -0.83em 0 -0.44em #1199C4, -0.11em -0.83em 0 -0.47em #1199C4;
    }
}
@keyframes load6 {
    0% {
        box-shadow: -0.11em -0.83em 0 -0.35em #000000, -0.11em -0.83em 0 -0.38em #000000, -0.11em -0.83em 0 -0.41em #000000, -0.11em -0.83em 0 -0.44em #000000, -0.11em -0.83em 0 -0.47em #000000;
    }
    5%,
    95% {
        box-shadow: -0.11em -0.83em 0 -0.35em #000000, -0.11em -0.83em 0 -0.38em #000000, -0.11em -0.83em 0 -0.41em #000000, -0.11em -0.83em 0 -0.44em #000000, -0.11em -0.83em 0 -0.47em #000000;
    }
    30% {
        box-shadow: -0.11em -0.83em 0 -0.35em #000000, -0.51em -0.66em 0 -0.38em #000000, -0.75em -0.36em 0 -0.41em #000000, -0.83em -0.03em 0 -0.44em #000000, -0.81em 0.21em 0 -0.47em #000000;
    }
    55% {
        box-shadow: -0.11em -0.83em 0 -0.35em #000000, -0.29em -0.78em 0 -0.38em #000000, -0.43em -0.72em 0 -0.41em #000000, -0.52em -0.65em 0 -0.44em #000000, -0.57em -0.61em 0 -0.47em #000000;
    }
    100% {
        transform  : rotate(360deg);
        box-shadow: -0.11em -0.83em 0 -0.35em #000000, -0.11em -0.83em 0 -0.38em #000000, -0.11em -0.83em 0 -0.41em #000000, -0.11em -0.83em 0 -0.44em #000000, -0.11em -0.83em 0 -0.47em #000000;
    }
}
/*Loader 2*/
.loader2 {
    width: 40px;
    height: 40px;
    background-color: #333;

    margin: 100px auto;
    -webkit-animation: sk-rotateplane 1.2s infinite ease-in-out;
    animation: sk-rotateplane 1.2s infinite ease-in-out;
}

@-webkit-keyframes sk-rotateplane {
    0% { -webkit-transform: perspective(120px) }
    50% { -webkit-transform: perspective(120px) rotateY(180deg) }
    100% { -webkit-transform: perspective(120px) rotateY(180deg)  rotateX(180deg) }
}

@keyframes sk-rotateplane {
    0% {
        transform: perspective(120px) rotateX(0deg) rotateY(0deg);
        -webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg)
    } 50% {
          transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg);
          -webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg)
      } 100% {
            transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
            -webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg);
        }
}
.view-popup .info-row {
    padding : 5px 0;
}
.view-popup {
    min-width : 450px;
}
.view-popup > div.value {
    display       : block;
    margin        : 10px;
    border-radius : 5px;
    border        : 1px solid #000000;
    padding       : 5px;
}
/*********************** accordion ************************/
.accordion-panel {
    padding : 0 0 15px;
}
.accordion-panel > .label-bar {
    background  : none repeat scroll 0 0 #FAFDFD;
    border      : 1px solid #E1E5E5;
    color       : #777;
    cursor      : pointer;
    font-size   : 15px;
    height      : 42px;
    line-height : 42px;
    margin      : 0 0 7px;
    padding     : 7px 15px 7px 40px;
    position    : relative;
}
.ie9 .accordion-panel > .label-bar {
    background-size : 100% 100%;
    filter          : none;
}
.accordion-panel > .label-bar.expanded {
    background : none repeat scroll 0 0 #FFFFFF;
    color      : #1199C4;
}
.accordion-panel > .label-bar:hover {
    background : none repeat scroll 0 0 #FFFFFF;
}
.accordion-panel > .label-bar .toggle-icon {
    background-image : url("/wc/7.0.0/images/widgets/accordion/accordion-toggle.png");
    display          : inline-block;
    height           : 16px;
    left             : 7px;
    position         : absolute;
    top              : 12px;
    vertical-align   : top;
    width            : 16px;
}
.accordion-item {
    background : none repeat scroll 0 0 #FFFFFF;
    border     : 1px solid #E1E5E5;
    margin     : 0 0 15px;
    padding    : 12px;
    position   : relative;
    top        : -1px;
}
.accordion-item form {
    padding : 0;
}
.accordion-panel > .accordion-item.collapsed {
    display : none;
}
.accordion-panel > .accordion-item table th:first-child,
.accordion-panel > .accordion-item table th:last-child {
    border-radius : 0;
}
.expanded .toggle-icon {
    background-position : -16px 0;
}
.multi-column.two-column .columns {
    width : 50%;
}
.multi-column .columns {
    display        : inline-block;
    vertical-align : top;
    margin         : 0;
    padding        : 0;
    outline        : 0;
}
.two-column .first-column .column-content {
    margin-right : 5px;
}
.two-column .last-column .column-content {
    margin-left : 5px;
}
.multi-column.three-column .columns {
    width : 33.33%;
}

.float-none {
    float: none !important;
}
.ml-0 {
    margin-left: 0 !important;
}
.mt-30 {
    margin-top: 30px !important;
}
.pr-0 {
    padding-right: 0 !important;
}
.pl-12 {
    padding-left: 12px !important;
}


.newsletter .form-row {
    position: relative;
}

.newsletter .form-row .errorlist {
    position: absolute;
    bottom: -26px;
}
 /************************** Common Style ***************************/
:focus-visible {
    outline: none;
}
.link,
.link-btn {
    background: none;
    color: #666666;
    cursor: pointer;
    display: inline-block;
    text-decoration: underline;
    padding: 0;
}

.link + .link,
.link-btn + .link-btn {
    margin-left: 15px;
}

.link:hover,
.link-btn:hover {
    background: none;
    color: #000000;
}
span.product-image-link.image-link.link {
    cursor: pointer;
}
.tool-icon {
    cursor : pointer;
}
.form-row {
    margin : 5px 0;
}
.form-row label {
    color: #555555;
    display: inline-block;
    font-size: 14px;
    margin: 0;
    padding: 0;
    text-align: left;
    vertical-align: middle;
    width: 150px;
}
.form-row .suggestion {
    display: inline-block;
    padding-left: 10px;
    color: #AAAAAA;
    font-style: italic;
}
input[type=submit],
input[type=button],
button,
.button,
a.button {
    background-color : #000;
    border     : none;
    color      : #fff;
    cursor     : pointer;
    display    : inline-block;
}
input[type=submit],
input[type=button],
button,
.button,
a.button {
    padding : 8px 15px;
}
span.button,
a.button {
    height: auto;
}
input[type=submit]:hover,
input[type=button]:hover,
button:hover,
a.button:hover,
.button:hover {
    background-color : #666666;
}
input[type=submit][disabled],
input[type=button][disabled],
button[disabled],
.button.disabled,
a.button.disabled {
    background  : #bfbfbf;
    border      : none;
    color       : #ACACAC;
    text-shadow : 0 0 1px #E6E6E6;
}
.strike-through {
    text-decoration: line-through;
}
.stepper .stepper-input {
    box-sizing: border-box;
    height: 36px;
    padding: 9px 28px 10px 10px;
    width: 100%;
}
.stepper .stepper-arrow {
    z-index: 0;
}
.stepper .stepper-arrow.up {
    border-radius: 0 3px 0 0;
}
.stepper .stepper-arrow.down {
    border-radius: 0 0 3px;
}
.text-center {
    text-align: center;
}
.text-right {
    text-align: right;
}
/* +++++++++++++++++++++++++++++++++ pagination design +++++++++++++++++++++++++++++++++++++ */
.pagination {
    display : inline-block;
    float: right;
}
.pagination span {
    background-color : #FFFFFF;
    border           : 1px solid #CCCCCC;
    color            : #555555;
    cursor           : pointer;
    margin           : 0 2px;
    padding          : 3px 10px;
    box-shadow       : 1px 1px 0 #CCCCCC;
    display : inline-block;
}
.pagination span.first {
    margin-left : 0;
}
.pagination span.last {
    margin-right : 0;
}
.pagination span.disabled {
    color : #BEBEBE;
}
.pagination span.current {
    background : url("/wc/7.0.0/images/site/btn_bg.png") repeat-x left top;
    border     : 1px solid #4D4D4D;
    color      : #FFFFFF;
}
/* +++++++++++++++++++++++++++++++++++++++++ custom select +++++++++++++++++++++++++++++++++++++ */
.chosen-container-single {
    display        : inline-block;
    padding-right  : 24px;
    vertical-align : middle;
    min-width: 178px;
}
.chosen-container-single .chosen-single div b {
    top: 5px;
}
.chosen-container-single .chosen-single span {
    line-height: 26px;
}
.chosen-container-single.per-page-count {
    float: left;
    padding-right : 29px;
}
.chosen-container-single .chosen-drop {
    position      : absolute;
    min-width     : 100%;
    box-sizing    : border-box;
    z-index       : 100;
}
.chosen-container-single .chosen-single {
    color         : #000000;
    text-shadow   : 0 0;
    overflow      : hidden;
    text-overflow : ellipsis;
    white-space   : nowrap;
    line-height   : 19px;
}
.chosen-container-single .active-result {
    box-sizing    : border-box;
    background    : none repeat scroll 0 0 #FFFFFF;
    border-bottom : 1px solid #F1F1F1;
    display       : block;
    font-size     : 13px;
    padding       : 5px 15px;
    text-overflow : ellipsis;
    white-space   : nowrap;
}
.chosen-container .chosen-results li.depth-1 {
    padding-left : 15px;
}
.chosen-container .chosen-results li.depth-2 {
    padding-left : 30px;
}
.chosen-container .chosen-results li.depth-3 {
    padding-left : 45px;
}
.chosen-container .chosen-results li.depth-4 {
    padding-left : 60px;
}
.chosen-container .chosen-results li.depth-5 {
    padding-left : 75px;
}
.chosen-container .chosen-results li.depth-6 {
    padding-left : 90px;
}
.chosen-container .chosen-results li.depth-7 {
    padding-left : 105px;
}
.chosen-container .chosen-results li.depth-8 {
    padding-left : 120px;
}
.chosen-container .chosen-results li.depth-9 {
    padding-left : 135px;
}
.chosen-container .chosen-results li.depth-10 {
    padding-left : 150px;
}
.chosen-container .chosen-results li.depth-11 {
    padding-left : 165px;
}
.chosen-container .chosen-results li.depth-12 {
    padding-left : 180px;
}
.chosen-container .chosen-results li.depth-13 {
    padding-left : 195px;
}
.chosen-container .chosen-results li.depth-14 {
    padding-left : 210px;
}
.chosen-container .chosen-results li.depth-15 {
    padding-left : 225px;
}
.chosen-container .chosen-results li.depth-16 {
    padding-left : 240px;
}
.chosen-container .chosen-results li.depth-17 {
    padding-left : 255px;
}
.chosen-container .chosen-results li.depth-18 {
    padding-left : 270px;
}
.chosen-container .chosen-results li.depth-19 {
    padding-left : 285px;
}
.chosen-container .chosen-results li.depth-20 {
    padding-left : 300px;
}
.chosen-container .chosen-results li.depth-21 {
    padding-left : 315px;
}
.chosen-container .chosen-results li.depth-22 {
    padding-left : 330px;
}
.chosen-container .chosen-results li.depth-23 {
    padding-left : 345px;
}
.chosen-container .chosen-results li.depth-24 {
    padding-left : 360px;
}
.chosen-container .chosen-results li.depth-25 {
    padding-left : 375px;
}
.chosen-container .chosen-results li.depth-26 {
    padding-left : 390px;
}
.chosen-container .chosen-results li.depth-27 {
    padding-left : 405px;
}
.chosen-container .chosen-results li.depth-28 {
    padding-left : 420px;
}
.chosen-container .chosen-results li.depth-29 {
    padding-left : 435px;
}
.chosen-container .chosen-results li.depth-30 {
    padding-left : 450px;
}
.chosen-container.td-full-width {
    width: -moz-calc(100% - 26px);
    /* @alternate */ width: -webkit-calc(100% - 26px);
    /* @alternate */   width: calc(100% - 26px);
}
.chosen-container.validation-error {
    border : 1px solid #FF0000;
}
/* +++++++++++++++++++++++++++++++++++++++++ scroll design ++++++++++++++++++++++++++++++++++++++++ */
.scroll-left,
.scroll-right {
    display        : inline-block;
    height         : 24px;
    width          : 26px;
    vertical-align : bottom;
    border         : 1px solid #E1E1E1;
    cursor         : pointer;
}
.scroll-left {
    background : url("/wc/7.0.0/images/site/left-arrow.png") no-repeat left top;
}
.scroll-right {
    background : url("/wc/7.0.0/images/site/right-arrow.png") no-repeat left top;
}
.scroll-right.disabled,
.scroll-left.disabled {
    /* @alternate */ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)";
    filter: alpha(opacity=40);
    /* @alternate */ -moz-opacity: 40;
    /* @alternate */ -khtml-opacity: 40;
    opacity: 0.4;
    cursor: default;
}
.scrollable-view .header {
    background    : none;
    margin        : 0;
    padding       : 0;
    border-bottom : 2px solid #CCCCCC;
    overflow      : hidden;
}
.scrollable-view {
    background    : none;
    border-bottom : 2px solid #CCCCCC;
    margin-bottom : 0;
    padding       : 0;
    overflow      : hidden;
}
.scrollable-view .scroller {
    float : right;
}
.scrollable-view > .content {
    overflow-x  : hidden;
    white-space : nowrap;
    border      : 1px #CCCCCC solid;
    padding     : 31px 42px;
}
.scrollable-view .product-block {
    border         : 1px solid #E6E6E6;
    display        : inline-block;
    margin         : 5px;
    padding        : 10px;
    vertical-align : top;
    white-space    : normal;
}
/* +++++++++++++++++++++++++++++++++++++++++ spinner design +++++++++++++++++++++++++++++++++++++ */
.ui-spinner {
    background-color : #F9F9F9;
    border           : 1px solid #E6E6E6;
    border-radius    : 5px;
    display          : inline-block;
    height           : auto !important;
    padding          : 0 18px 0 0;
    position         : relative;
}
.ui-spinner input {
    background-color : #F9F9F9;
    border-top       : none;
    border-bottom    : none;
    border-left      : none;
    border-right     : 1px #E6E6E6 solid;
    padding          : 5px;
    margin           : 0;
    text-align       : center;
    width            : 20px;
    border-radius    : 3px 0 0 3px;
}
.ui-spinner-button {
    background-image  : url("/wc/7.0.0/images/site/spinner-arrow.png");
    background-repeat : no-repeat;
    color             : #CCCCCC;
    cursor            : pointer;
    font-size         : 10px;
    height            : 13px;
    position          : absolute;
    right             : 0;
    width             : 18px;
}
.ui-spinner-button .ui-icon {
    display : none;
}
.ui-spinner-button.ui-spinner-up {
    background-position : 0 0;
    top                 : 0;
}
.ui-spinner-button.ui-spinner-up:hover {
    background-position : -18px 0;
}
.ui-spinner-button.ui-spinner-down {
    background-position : 0 -14px;
    bottom              : 0;
}
.ui-spinner-button.ui-spinner-down:hover {
    background-position : -18px -14px;
}

/* ++++++++++++++++++++++++++++++++++++++++++++++++ rechaptcha +++++++++++++++++++++++++++++++++++++ */
.recaptcha-container {
    display: inline-block;
    margin-left: -2px;
}
#recaptcha_table {
    table-layout : auto;
}
#recaptcha_table .recaptcha_input_area {
    height : auto !important;
}
#recaptcha_table #recaptcha_response_field {
    margin-top : 7px !important;
}
.simple-captcha-reload.icon {
    background: url("/wc/7.0.0/images/site/captcha-changer.png") no-repeat left top;
    display: inline-block;
    height: 16px;
    margin: 0 5px;
    width: 16px;
    cursor: pointer;
}
/* ++++++++++++++++++++++++++++ Password Strength Meter start +++++++++++++++++++++++++++++++++++++ */
.password-meter-wrap {
    display     : inline-block;
    margin-left : 10px;
    width       : 150px;
}
.password-meter-wrap .password-strength-bar {
    height  : 10px;
    display : block;
    float   : left;
}
.password-meter-wrap .very-weak {
    width      : 50px;
    background : #B30004;
}
.password-meter-wrap .weak {
    width      : 60px;
    background : #CF6100;
}
.password-meter-wrap .better {
    width      : 70px;
    background : #FC9B00;
}
.password-meter-wrap .medium {
    width      : 80px;
    background : #FFE364;
}
.password-meter-wrap .strong {
    width      : 90px;
    background : #8DCE00;
}
.password-meter-wrap .strongest {
    width      : 100px;
    background : #2FA300;
}



/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++    page content block design start  ++++++++++++++++++++++++++*/
.widget-container {
    position : relative;
    margin   : auto;
}
.body .page-content .widget-container {
    width : auto;
}
.header .widget,
.footer .widget,
.dockable .widget {
    position : absolute;
}
[section] .widget-group {
    position : absolute;
}
.body .widget,
.body .grid-block,
.body .body-section,
.body .product-widget{
    position : relative;
}
.l-fixed-container,
.r-fixed-container {
    display : flex;
}
.r-fixed-left,
.l-fixed-right {
    flex  : 1 1 0;
    width : auto;
}
.no-fixed-container {
    display : block;
}
.no-fixed-item,
.no-fixed-left,
.no-fixed-middle,
.no-fixed-right {
    display        : inline-block;
    vertical-align : top;
}
.no-fixed-container > .l-fixed-container,
.no-fixed-container > .r-fixed-container {
    display : inline-flex;
}
.double-input-row.mandatory > label:after,
.form-row.mandatory > label:after {
    color   : #FF0000;
    content : " *";
}

/********************* page content block design end ********************/

/*********************************************************************************************** Widget design start ****************************************************************************/
/* +++++++++++++++++  Widget common  design +++++++++++++++++++++++++ */
.header .widget,
.footer .widget,
.dockable .widget {
    /*overflow: hidden;*/
}
.header .widget.widget-languageSelector,
.footer .widget.widget-languageSelector {
    overflow: visible;
}
/* Hide Google Translate Element top banner that pushes layout when active. */
.goog-te-banner-frame.skiptranslate, body > .skiptranslate { display:none !important; }
body { top: 0 !important; }
.goog-tooltip, .goog-tooltip:hover { display:none !important; }
.goog-text-highlight { background:none !important; box-shadow:none !important; }
.widget > .widget-title {
    font-size      : 16px;
    padding-bottom : 10px;
}
.widget-tableOfContents .widget-title-wrapper {
    text-align: center !important;
    margin: 0 0 0.5em;
}
.widget-tableOfContents .widget-title-wrapper .widget-title {
    text-align: center !important;
    font-size: 2em;
    font-weight: 700;
    line-height: 1.2;
    margin: 0.67em 0;
}
.cart-menu-button, .search-menu-button   {
    background: none;
    cursor:pointer;
}
.cart-menu-button:after, .search-menu-button:after  {
    font-family: 'FontAwesome';
    content: "\f079";
    display: inline-block;
    font-size: 20px;
}
.search-menu-button:after {
    display: inline-flex;
    position: absolute;
    top: 0;
    left: 0;
    height: 24px;
    width: 24px;
    cursor: pointer;
    content: "";
    background-repeat: no-repeat;
    background-image: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="utf-8"%3F><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools --><svg width="24px" height="24px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M20 20L15.8033 15.8033M18 10.5C18 6.35786 14.6421 3 10.5 3C6.35786 3 3 6.35786 3 10.5C3 14.6421 6.35786 18 10.5 18C14.6421 18 18 14.6421 18 10.5Z" stroke="%23000000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>');
    background-position: center;
}
.search-menu-button.close:after {
    content: "";
    background-image: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="utf-8"%3F><!-- Uploaded to: SVG Repo, www.svgrepo.com, Generator: SVG Repo Mixer Tools --><svg width="24px" height="24px" viewBox="-0.5 0 25 25" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M3 21.32L21 3.32001" stroke="%23000000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/><path d="M3 3.32001L21 21.32" stroke="%23000000" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>');
}
.cart-menu-button:after{
    content: "\f07a";
}
.widget-cart .content.show{
    float: right;
}
.widget-cart .content.show{
    float: right;
    height:100%;
    /* @alternate */ -webkit-transition: all 0.3s ease;
    /* @alternate */ -moz-transition: all 0.3s ease;
    /* @alternate */ -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
    /* @alternate */ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    /* @alternate */ -moz-opacity: 100;
    /* @alternate */ -khtml-opacity: 100;
    opacity: 1;
}
.header .widget.widget-cart, .header .widget.widget-search {
    overflow: visible;
}

/* +++++++++++++++++  Breadcrumb widget  design +++++++++++++++++++++++++ */

.breadcrumb-item.root .icon {
    background : url("/wc/7.0.0/images/site/breadcrumb-root.png") no-repeat left top;
    display    : inline-block;
    height     : 16px;
    width      : 16px;
}
.breadcrumb-item .separator {
    padding   : 0 5px;
    font-size : 16px;
}
.breadcrumb-item .label {
    color : #555555;
}
.breadcrumb-item .label:hover {
    color : #CCCCCC;
}
/* +++++++++++++++++  Cart widget design +++++++++++++++++++++++++ */
.cart-widget-img {
    background     : url("/wc/7.0.0/images/site/cart-icon.png") no-repeat left top;
    display        : inline-block;
    height         : 24px;
    width          : 24px;
    vertical-align : middle;
}
.cart-widget-text {
    font-size      : 13px;
    padding-left   : 3px;
    vertical-align : middle;
}
.quick-cart {
    cursor : pointer;
}
.quick-cart-content {
    background-color : #FFFFFF;
    border           : 1px solid #DDDDDD;
    padding          : 7px;
    width            : 200px;
}
.quick-cart-content .product-name {
    width : 110px;
}
.quick-cart-content table th {
    background-color : #F1F1F1;
    border           : 1px solid #DDDDDD;
    color            : #555555;
    font-size        : 13px;
    font-weight      : normal;
    padding          : 5px;
}
.quick-cart-content table th.product-name {
    text-align : left;
}
.quick-cart-content table td {
    border     : 1px solid #DDDDDD;
    padding    : 5px;
    word-break : break-all;
}
.quick-cart-content table td.quantity {
    text-align : center;
}
.quick-cart-content table td.price {
    text-align : right;
}
.quick-cart-content table td.total {
    background-color : #F1F1F1;
}
.quick-cart-content table td.total-price {
    background-color : #F1F1F1;
    text-align       : right;
}
.cart-details-link {
    overflow    : hidden;
    padding-top : 6px;
}
.cart-details-link .checkout {
    float : left;
}
.cart-details-link .view-cart {
    float : right;
}
.cart-menu-button {
    display: none;
    width: 26px;
    height: 26px;
    background: green;
}
/* +++++++++++++++++  Image widget design +++++++++++++++++++++++++ */

.widget-image img {
    /* max-height : 100%;
    max-width  : 100%; */
    height: auto;
    max-width: 100%;
    width: auto;
}

/* +++++++++++++++++  Category Banner widget design +++++++++++++++++++++++++ */

.category-banner-image img {
    height: auto;
    max-width: 100%;
    width: auto;
}

/* +++++++++++++++++  Navigation widget design +++++++++++++++++++++++++ */

.widget-navigation .image-wrapper img {
    vertical-align : middle;
    padding-right  : 5px;
}
.navigation-item a {
    display : inline-block;
    color   : #555555;
}
.navigation-item a:hover {
    color : #999999;
}
/*Menu*/
.widget-navigation .menu-title {
    display: none;
}
.widget-navigation .menu-button {
    -moz-user-select: none;
    border-radius: 5px;
    cursor: pointer;
    height: 28px;
    width: 32px;
    user-select: none;
}
.widget-navigation .menu-button em {
    background-color: #999;
    display: block;
    height: 2px;
    margin: 6px 0 5px 3px;
    -webkit-transition: all 200ms ease;
    -moz-transition: all 200ms ease;
    -ms-transition: all 200ms ease;
    -o-transition: all 200ms ease;
    transition: all 200ms ease;
    width: 26px;
}
.widget-navigation .menu-button em:nth-child(1) {
    /* @alternate */ -moz-transform: rotate(0) translateX(0) translateY(0);
    /* @alternate */ -webkit-transform: rotate(0) translateX(0) translateY(0);
    /* @alternate */ -o-transform: rotate(0) translateX(0) translateY(0);
    /* @alternate */ -ms-transform: rotate(0) translateX(0) translateY(0);
    transform: rotate(0) translateX(0) translateY(0);
}
.widget-navigation .menu-button em:nth-child(2) {
    /* @alternate */ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
    filter: alpha(opacity=100);
    /* @alternate */ -moz-opacity: 100;
    /* @alternate */ -khtml-opacity: 100;
    opacity: 100;
}
.widget-navigation .menu-button em:nth-child(3) {
    /* @alternate */ -moz-transform: rotate(0) translateX(0) translateY(0);
    /* @alternate */ -webkit-transform: rotate(0) translateX(0) translateY(0);
    /* @alternate */ -o-transform: rotate(0) translateX(0) translateY(0);
    /* @alternate */ -ms-transform: rotate(0) translateX(0) translateY(0);
    transform: rotate(0) translateX(0) translateY(0);
}
.widget-navigation .menu-button.close em:nth-child(1) {
    /* @alternate */ -moz-transform: rotate(45deg) translateX(6.0px) translateY(6.0px);
    /* @alternate */ -webkit-transform: rotate(45deg) translateX(6.0px) translateY(6.0px);
    /* @alternate */ -o-transform: rotate(45deg) translateX(6.0px) translateY(6.0px);
    /* @alternate */ -ms-transform: rotate(45deg) translateX(6.0px) translateY(6.0px);
    transform: rotate(45deg) translateX(6.0px) translateY(6.0px);
}
.widget-navigation .menu-button.close em:nth-child(2) {
    /* @alternate */ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
    filter: alpha(opacity=0);
    /* @alternate */ -moz-opacity: 0;
    /* @alternate */ -khtml-opacity: 0;
    opacity: 0;
}
.widget-navigation .menu-button.close em:nth-child(3) {
    /* @alternate */ -moz-transform: rotate(-45deg) translateX(5px) translateY(-5px);
    /* @alternate */ -webkit-transform: rotate(-45deg) translateX(5px) translateY(-5px);
    /* @alternate */ -o-transform: rotate(-45deg) translateX(5px) translateY(-5px);
    /* @alternate */ -ms-transform: rotate(-45deg) translateX(5px) translateY(-5px);
    transform: rotate(-45deg) translateX(5px) translateY(-5px);
}
/*responsive*/

.header .widget.widget-navigation{
    overflow: visible;
    float: none;
}
.left-container .navigation-item, .responsive-navigation .navigation-item {
    display: block;
    padding:10px 20px;
    background: #fff;
}
.widget-navigation .nav-wrapper.hide {
    /* @alternate */ -webkit-transition: all 1s ease;
    /* @alternate */ -moz-transition: all 1s ease;
    /* @alternate */ -ms-transition: all 1s ease;
    /* @alternate */ -o-transition: all 1s ease;
    transition: all 1s ease;
    height:0;
}
.widget-navigation .nav-wrapper.show {
    /* @alternate */ -webkit-transition: all 1s ease;
    /* @alternate */ -moz-transition: all 1s ease;
    /* @alternate */ -ms-transition: all 1s ease;
    /* @alternate */ -o-transition: all 1s ease;
    transition: all 1s ease;
    height:500px;
}
.left-container{
    width:300px;
    float: left;
}
.left-container.open{
    /* @alternate */ -webkit-transform: translate3d(0%, 0, 0);
    /* @alternate */ -moz-transform: translate3d(0%, 0, 0);
    /* @alternate */ -ms-transform: translate3d(0%, 0, 0);
    /* @alternate */ -o-transform: translate3d(0%, 0, 0);
    transform: translate3d(0%, 0, 0);
    /* @alternate */ -webkit-transition: all 1s ease;
    /* @alternate */ -moz-transition: all 1s ease;
    /* @alternate */ -ms-transition: all 1s ease;
    /* @alternate */ -o-transition: all 1s ease;
    transition: all 1s ease;
    overflow: hidden;
}
.page-container.open{
    /* @alternate */ -webkit-transform: translate3d(300px, 0, 0);
    /* @alternate */ -moz-transform: translate3d(300px, 0, 0);
    /* @alternate */ -ms-transform: translate3d(300px, 0, 0);
    /* @alternate */ -o-transform: translate3d(300px, 0, 0);
    transform: translate3d(300px, 0, 0);
    /* @alternate */ -webkit-transition: all 1s ease;
    /* @alternate */ -moz-transition: all 1s ease;
    /* @alternate */ -ms-transition: all 1s ease;
    /* @alternate */ -o-transition: all 1s ease;
    transition: all 1s ease;
}
.page-container{
    /* @alternate */ -webkit-transform: translate3d(0%, 0, 0);
    /* @alternate */ -moz-transform: translate3d(0%, 0, 0);
    /* @alternate */ -ms-transform: translate3d(0%, 0, 0);
    /* @alternate */ -o-transform: translate3d(0%, 0, 0);
    transform: translate3d(0%, 0, 0);
    /* @alternate */ -webkit-transition: all 0.4s ease;
    /* @alternate */ -moz-transition: all 0.4s ease;
    /* @alternate */ -ms-transition: all 0.4s ease;
    /* @alternate */ -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}
.left-container {
    bottom: 0;
    left: 0;
    margin: 0;
    position: fixed;
    right: 0;
    top: 0;
    z-index: 0;
    /* @alternate */ -webkit-transform: translate3d(-100%, 0, 0);
    /* @alternate */ -moz-transform: translate3d(-100%, 0, 0);
    /* @alternate */ -ms-transform: translate3d(-100%, 0, 0);
    /* @alternate */ -o-transform: translate3d(-100%, 0, 0);
    transform: translate3d(-100%, 0, 0);
    /* @alternate */ -webkit-transition: all 1s ease;
    /* @alternate */ -moz-transition: all 1s ease;
    /* @alternate */ -ms-transition: all 1s ease;
    /* @alternate */ -o-transition: all 1s ease;
    transition: all 1s ease;
}

/*Horizontal*/
.horizontal > .navigation-item {
    display : inline-block;
}
.horizontal .navigation-item a {
    display : inline-block;
    padding : 5px;
}

.horizontal .navigation-item-child-container {
    display : none;
}
.horizontal .navigation-item:hover > .navigation-item-child-container {
    display : inline-block;
}
.horizontal .navigation-item.has-child {
    position : relative;
}
.horizontal .has-child .navigation-item-child-container {
    background: rgba(0, 0, 0, 0) url("/wc/7.0.0/images/site/light-white-colo.png") repeat scroll left top;
    left: 150px;
    position: absolute;
    top: 0;
    width: 150px;
    z-index: 10000;
}
.horizontal > .has-child > .navigation-item-child-container {
    background: rgba(0, 0, 0, 0) url("/wc/7.0.0/images/site/light-white-colo.png") repeat scroll left top;
    left: 0;
    top: 27px;
}
.horizontal .navigation-item .navigation-item-child-container .navigation-item {
    padding : 0 5px;
}
.horizontal .navigation-item .navigation-item-child-container .navigation-item a {
    display       : block;
    position      : relative;
    border-bottom : 1px #E6E6E6 solid;
}
.horizontal .navigation-item .navigation-item-child-container .navigation-item .navigation-item-child-container {
    left     : 150px;
    position : absolute;
    top      : 0;
    width    : 150px;
}
/*Vertical*/
.vertical .navigation-item a {
    border-bottom : 1px dashed #CCCCCC;
    display       : block;
    padding       : 5px 0;
}
.vertical .navigation-item.first {
    padding-top : 0;
}
.vertical .navigation-item.last {
    padding-bottom : 0;
}
.vertical .navigation-item .navigation-item-child-container {
    display : none;
}
.vertical .navigation-item.active > a {
    color : #FF9000;
}
.vertical .navigation-item.active > .navigation-item-child-container {
    display : block;
    padding : 0 0 0 20px;
}
/*responsive menu design*/
.nav-wrapper.responsive-navigation {
    position: absolute;
    width: 100%;
    z-index: 99;
}
@media only screen and (max-width: 991px) {
    .fee-preview-mode.ff .widget-navigation.main_menu .nav-wrapper {
        width: calc(100vw - 17px);
    }
}
.nav-wrapper.responsive-navigation .navigation-item {
    position: relative;
    display: block;
}
.responsive-navigation .navigation-item.has-child .child-opener {
    position: absolute;
    right: 15px;
    top: 16px;
}
.responsive-navigation .navigation-item.has-child .child-opener::before {
    content: "\f067";
    font-family: fontawesome;
}
.responsive-navigation .navigation-item.has-child .child-opener.close::before {
    content: "\f068";
}

.responsive-navigation .navigation-item.has-child .navigation-item .child-opener {
    top: 6px;
}

/* +++++++++++++++++  Gallery widget design +++++++++++++++++++++++++ */
.nivo-directionNav a {
    background-color : #FFFFFF;
    padding: 10px;
}
.nivo-directionNav a.nivo-nextNav {
    border-radius : 50% 0 0 50%;
    border-left   : 1px #CCCCCC solid;
    border-top    : 1px #CCCCCC solid;
    border-right  : none;
    border-bottom : 1px #CCCCCC solid;
}
.nivo-directionNav a.nivo-prevNav {
    border-radius : 0 50% 50% 0;
    border-left   : none;
    border-top    : 1px #CCCCCC solid;
    border-right  : 1px #CCCCCC solid;
    border-bottom : 1px #CCCCCC solid;
}

/* Site Tabify tab */
.bmui-tab-panel[aria-hidden=true] {
    display : none;
}

/* The Nivo Slider styles */
.nivoSlider {
    position:relative;
    width:100%;
    height:auto;
    overflow: hidden;
}
.nivoSlider img {
    position:absolute;
    top:0;
    left:0;
    max-width: none;
    height: 100%;
    object-fit: cover;
    object-position: 0 0;
}
.nivo-main-image {
    display: block !important;
    position: relative !important;
    width: 100% !important;
}

/* If an image is wrapped in a link */
.nivoSlider a.nivo-imageLink {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    border:0;
    padding:0;
    margin:0;
    z-index:6;
    display:none;
    background:white;
    filter:alpha(opacity=0);
    opacity:0;
}
/* The slices and boxes in the Slider */
.nivo-slice {
    display:block;
    position:absolute;
    z-index:5;
    height:100%;
    top:0;
}
.nivo-box {
    display:block;
    position:absolute;
    z-index:5;
    overflow:hidden;
}
.nivo-box img { display:block; }

/* Caption styles */
.nivo-caption {
    position:absolute;
    left:0;
    bottom:0;
    background:#000;
    color:#fff;
    width:100%;
    z-index:8;
    padding: 5px 10px;
    opacity: 0.8;
    overflow: hidden;
    display: none;
    /* @alternate */ -moz-opacity: 0.8;
    filter:alpha(opacity=8);
    /* @alternate */ -webkit-box-sizing: border-box;
    /* @alternate */ -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.nivo-caption p {
    padding:5px;
    margin:0;
}
.nivo-caption a {
    display:inline !important;
}
.nivo-html-caption {
    display:none;
}
/* Direction nav styles (e.g. Next & Prev) */
.nivo-directionNav a {
    position:absolute;
    top:45%;
    z-index:9;
    cursor:pointer;
}
.nivo-prevNav {
    left:0;
}
.nivo-nextNav {
    right:0;
}
/* Control nav styles (e.g. 1,2,3...) */
.nivo-controlNav {
    text-align:center;
    padding: 15px 0;
}
.nivo-controlNav a {
    cursor:pointer;
}
.nivo-controlNav a.active {
    font-weight:bold;
}

.widget-gallery .nivoSlider {
    height: auto;
}
.widget-gallery .nivo-directionNav a.nivo-prevNav, .widget-gallery .nivo-directionNav a.nivo-nextNav {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    border: medium none;
    font-size: 0;
    position: absolute;
    top: 42%;
    color: #fff;
}
.widget-gallery .nivo-directionNav a:hover.nivo-prevNav, .widget-gallery .nivo-directionNav a:hover.nivo-nextNav{
    color: #000000;
}
.widget-gallery .nivo-directionNav a.nivo-prevNav::before {
    content: "\f104 ";
    font-family: FontAwesome;
    font-size: 60px;
    position: absolute;
    left: 20px;
}
.widget-gallery .nivo-directionNav a.nivo-nextNav::before {
    content: "\f105";
    font-family: FontAwesome;
    font-size: 60px;
    overflow: hidden;
    position: absolute;
    right: 20px;
}
.widget-gallery .nivo-controlNav {
    /* @alternate */ display: -webkit-box;
    /* @alternate */ display: -ms-flexbox;
    display: flex;
    /* @alternate */ -webkit-box-pack: center;
    /* @alternate */ -ms-flex-pack: center;
    justify-content: center;
    margin: 0 auto;
    padding: 15px;
    text-align: center;
}
.widget-gallery .nivo-controlNav .nivo-control {
    border: 1px solid;
    color: #999999;
    display: inline-block;
    font-size: 16px;
    line-height: 18px;
    margin: 5px;
    min-width: 30px;
    padding: 6px 8px;
}
.widget-gallery .nivo-controlNav .nivo-control.active, .widget-gallery .nivo-controlNav .nivo-control:hover {
    color: #000000;
}

@media (max-width:991px) {
    .widget-gallery .nivo-directionNav a.nivo-prevNav, .widget-gallery .nivo-directionNav a.nivo-nextNav {
        top: 40%;
    }
    .widget-gallery .nivo-directionNav a.nivo-nextNav::before {
        right: 15px;
        font-size: 52px;
    }
    .widget-gallery .nivo-directionNav a.nivo-prevNav::before {
        font-size: 52px;
        left: 15px;
    }
    .widget-gallery .nivo-controlNav {
        padding: 10px;
    }
}
@media (max-width:767px) {
    .widget-gallery .nivo-directionNav a.nivo-prevNav, .widget-gallery .nivo-directionNav a.nivo-nextNav {
        top: 34%;
    }
    .widget-gallery .nivo-directionNav a.nivo-nextNav::before {
        font-size: 42px;
        right: 10px;
    }
    .widget-gallery .nivo-directionNav a.nivo-prevNav::before {
        font-size: 42px;
        left: 10px;
    }
    .widget-gallery .nivo-controlNav {
        padding: 8px;
    }
    .widget-gallery .nivo-controlNav .nivo-control {
        margin: 5px;
        padding: 5px;
        width: auto;
    }
}

.shipping.type-label.hidden,
.delivery.type-label.hidden {
    display: none;
}
input.is-different-shipping-checkbox {
    opacity: 1 !important;
}
span.type-label.delivery {
    padding-left: 30px;
}
.wc-icon{
    height: 20px;
    width: 20px;
}
.hidden-delivery-checkbox{
    display: none;
}
.wc-icon.medium{
    height: 24px;
    width: 24px;
}
.wc-icon.large{
    height: 32px;
    width: 32px;
}
.wc-icon {
    fill: #929291;
}
.wc-icon.brand {
    fill: #1198C5;
}
.wc-icon.white {
    fill: #fff;
}
.checkout-page .section.shipping span.title.hidden {
    display: none;
}
@font-face {
    font-family: "Flaticon";
    src: url("/wc/7.0.0/font/Flaticon.eot");
    src: url("/wc/7.0.0/font/Flaticon.eot?#iefix") format("embedded-opentype"),
    url("/wc/7.0.0/font/Flaticon.woff") format("woff"),
    url("/wc/7.0.0/font/Flaticon.ttf") format("truetype"),
    url("/wc/7.0.0/font/Flaticon.svg#Flaticon") format("svg");
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'nxicons';
    src: url('/wc/7.0.0/font/nxicons.woff'),
    url('/wc/7.0.0/font/nxicons.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@media only screen and (max-width: 767px) {
    .fee-preview-mode.ff .widget-search .search-form {
        width: calc(100vw - 17px);
    }
}


@keyframes loading-spinner-animation {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/* ------------------------------------------
 // Multi Language popup design
--------------------------------------------*/
.popup.multi-language {
    padding: 30px 20px 35px;
    border-radius: 10px;
}
.popup.multi-language .title,
.popup.multi-language .label {
    text-align: center;
}
.popup.multi-language .title {
    font-size: 18px;
    max-width: 310px;
    margin: 0 auto;
    font-weight: 600;
    padding-bottom: 15px;
}
.popup.multi-language .label {
    font-size: 16px;
    padding-bottom: 10px;
}
.popup.multi-language .select-wrapper {
    /* @alternate */ display: -webkit-box;
    /* @alternate */ display: -ms-flexbox;
    display: flex;
    /* @alternate */ -webkit-box-align: center;
    /* @alternate */ -ms-flex-align: center;
    align-items: center;
    padding-bottom: 20px;
}
.popup.multi-language .select-wrapper .form-item {
    /* @alternate */ -webkit-box-flex: 1;
    /* @alternate */ -ms-flex-positive: 1;
    flex-grow: 1;
    /* @alternate */ -ms-flex-negative: 1;
    flex-shrink: 1;
    margin-right: 10px;
    padding-right: 0;
}
.popup.multi-language .chosen-container a,
.popup.multi-language .language-select-continue {
    height: 34px;
    border-radius: 3px;
}
.popup.multi-language .language-select-continue {
}
.popup.multi-language .language-popup-close {
    text-align: center;
}
.popup.multi-language .language-select-cancel {
    text-decoration: underline;
    cursor: pointer;
    background: none;
    padding: 0;
    color: #222;
}
.popup.multi-language .language-select-cancel:hover {
    text-decoration: none;
    color: #898888;
}
div.country-select.inside input {
    border: 1px #ccc solid;
    height: 36px;
    width: 100%;
}
div.country-select .country-list {
    width: 100%;
}
div.country-select.inside .flag-dropdown {
    right: 0;
}
.widget-article .article-item .article-content iframe,
.widget-html .html-widget-element-content iframe {
    max-width: 100%;
}
.fee-widget-content .article-content p {
    overflow-wrap: break-word;
}
@media (max-width: 767px) {
    div.col-0,
    div.col-1,
    div.col-2,
    div.col-3,
    div.col-4,
    div.col-5 {
        display: block;
        width: 100% !important;
    }
}

.fee-fixed-width-content {
    padding-left: calc(50% - 585px) !important;
    padding-right: calc(50% - 585px) !important;
}
.widget-blogPost.fee-hide-read-more-blog-widget-button .blog-read-more {
    display: none;
}


/* --------------------------------------------------------------------------------
// swipe box
--------------------------------------------------------------------------------- */
.fee-gallery-swipebox .swipe-image-wrap .swipebox .swipe-image {
    width: 100%;
    /* @alternate */ -o-object-fit: cover;
    object-fit: cover;
    aspect-ratio: 177/125;
}
.fee-gallery-swipebox .swipe-image-wrap {
    padding-left: 10px;
    padding-right: 10px;
}
.fee-gallery-swipebox.swipeBoxSlider .swipe-box-tab-header {
    /* @alternate */-webkit-box-pack: center;
    /* @alternate */-ms-flex-pack: center;
    justify-content: center;
}
.fee-gallery-swipebox .swipebox-container .pagination {
    /* @alternate */display: -webkit-box;
    /* @alternate */display: -ms-flexbox;
    display: flex;
    /* @alternate */-ms-flex-wrap: wrap;
    flex-wrap: wrap;
    /* @alternate */-webkit-box-pack: center;
    /* @alternate */-ms-flex-pack: center;
    justify-content: center;
    gap: 5px;
    padding-left: 10px;
    padding-right: 10px;
}
.fee-gallery-swipebox .swipebox-container .pagination span {
    margin: 0;
}

@media (max-width: 1200px) {
    .fee-gallery-swipebox .swipe-image-wrap .box {
        /*width: calc(100%/3)*/
    }
}
@media (max-width: 575px) {
    .fee-gallery-swipebox .swipe-image-wrap .box {
        /*width: calc(100%/2)*/
    }
}
/* --- swipe box : end --- */

/* --------------------------------------------------------------------------------
// galleriffic alternete layout
--------------------------------------------------------------------------------- */
.galleriffic-gallery-wrap.alternate-layout .galleriffic-content {
    padding: 0 50px;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.thumb-position-bottom .slideshow {
    width: 100%;
    height: auto;
    aspect-ratio: 10/4;
}
.fee-gallery-galleriffic .galleriffic-content .image-wrapper,
.fee-gallery-galleriffic .galleriffic-content .image-wrapper a,
.fee-gallery-galleriffic .slideshow-container img {
    width:100%;
    height: 100%;
    /* @alternate */ -o-object-fit: cover;
    object-fit: cover;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.alternate-layout .thumbs-container {
    padding: 0 50px;
    overflow: visible;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.alternate-layout .galleriffic-content {
    padding: 0 60px;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.alternate-layout .thumbs-container {
    padding: 0 60px;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.alternate-layout.thumb-position-bottom .thumbs-container {
    margin-top: 20px;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.alternate-layout.thumb-position-top .thumbs-container {
    margin-bottom: 20px;
}
.fee-gallery-galleriffic div.galleriffic-gallery-wrap .thumbs-container .pageLink.prev,
.fee-gallery-galleriffic div.galleriffic-gallery-wrap .thumbs-container .pageLink.next {
    height: 40px;
    width: 40px;
    background: none #ffffff;
    border: 1px rgba(0,0,0, .20) solid;
    border-radius: 50%;
    top: 50%;
    /* @alternate */ -webkit-transform: translateY(-50%);
    /* @alternate */ -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    /* @alternate */ display: -webkit-box;
    /* @alternate */ display: -ms-flexbox;
    display: flex;
    /* @alternate */ -webkit-box-align: center;
    /* @alternate */ -ms-flex-align: center;
    align-items: center;
    /* @alternate */ -webkit-box-pack: center;
    /* @alternate */ -ms-flex-pack: center;
    justify-content: center;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.alternate-layout .thumbs-container .pageLink.prev {
    left: 10px;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.alternate-layout .thumbs-container .pageLink.next {
    right: 10px;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.alternate-layout .thumbs-container .pageLink.prev:before,
.fee-gallery-galleriffic .galleriffic-gallery-wrap.alternate-layout .thumbs-container .pageLink.next:after {
    content: "\f104";
    font-family: "Fontawesome";
    font-size: 22px;
    color: rgba(0,0,0, .25);
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.alternate-layout .thumbs-container .pageLink.prev:before {
    content: "\f104";
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.alternate-layout .thumbs-container .pageLink.next:after {
    content: "\f105";
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.alternate-layout .thumbs {
    padding: 0;
    /* @alternate */ display: -webkit-box;
    /* @alternate */ display: -ms-flexbox;
    display: flex;
    gap: 0 20px;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.alternate-layout .thumbs li {
    width: calc(257px - 10px);
    height: 144px;
    margin: 0;
    padding: 0;
    border: none;
    flex-grow: 0;
    flex-shrink: 0;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.alternate-layout .thumb img {
    width: 100%;
    height: 100%;
    /* @alternate */ -o-object-fit: cover;
    object-fit: cover;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.alternate-layout .thumb {
    height: 100%;
}
@media(max-width: 1200px){
    .fee-gallery-galleriffic .galleriffic-gallery-wrap.alternate-layout .thumbs li {
        width: calc(213px - 10px);
        height: 118px;
    }
}
@media(max-width: 991px){
    .fee-gallery-galleriffic .galleriffic-gallery-wrap.alternate-layout .thumbs li {
        width: calc(157px - 10px);
        height: 86px;
    }
}
@media (max-width: 767px) {
    .galleriffic-gallery-wrap.alternate-layout .galleriffic-content {
        padding: 0 40px;
    }
    .fee-gallery-galleriffic .galleriffic-gallery-wrap.alternate-layout .thumbs-container {
        padding: 0 40px;
    }
    .fee-gallery-galleriffic .galleriffic-gallery-wrap.alternate-layout.thumb-position-bottom .thumbs-container {
        margin-top: 10px;
    }
    .fee-gallery-galleriffic .galleriffic-gallery-wrap.alternate-layout.thumb-position-top .thumbs-container {
        margin-bottom: 10px;
    }
    .fee-gallery-galleriffic .galleriffic-gallery-wrap.alternate-layout.thumb-position-bottom .galleriffic-content {
        padding: 0 40px;
    }
    .fee-gallery-galleriffic .galleriffic-gallery-wrap.alternate-layout .thumbs-container .pageLink.prev,
    .fee-gallery-galleriffic .galleriffic-gallery-wrap.alternate-layout .thumbs-container .pageLink.next {
        height: 20px;
        width: 20px;
    }
    .fee-gallery-galleriffic .galleriffic-gallery-wrap.alternate-layout .thumbs-container .pageLink.prev:before,
    .fee-gallery-galleriffic .galleriffic-gallery-wrap.alternate-layout .thumbs-container .pageLink.next:after {
        font-size: 14px;
    }
    .fee-gallery-galleriffic .galleriffic-gallery-wrap.alternate-layout .thumbs {
        gap: 0 10px;
    }
    .fee-gallery-galleriffic .galleriffic-gallery-wrap.alternate-layout .thumbs li {
        width: calc(103px - 5px);
        height: 60px;
    }

}
/* --- galleriffic alternet layout: end --- */


/* --------------------------------------------------------------------------------
// galleriffic rollover layout
--------------------------------------------------------------------------------- */
.fee-gallery-galleriffic .galleriffic-gallery-wrap.rollover-layout {
    /* @alternate */ display: -webkit-box;
    /* @alternate */ display: -ms-flexbox;
    display: flex;
    /* @alternate */ -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    padding-top: 30px;
    padding-bottom: 30px;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.rollover-layout.caption-position-top,
.fee-gallery-galleriffic .galleriffic-gallery-wrap.rollover-layout.caption-position-bottom {
    display: block;
    padding: 0;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.rollover-layout .thumb-and-content-wrap {
    padding: 0 20px 35px;
    display: flex;
    flex-wrap: nowrap;
    position: relative;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.rollover-layout .thumbs-container {
    float: none;
    margin: 0;
    width: 20%;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.rollover-layout.thumb-position-left .thumbs-container {
    padding-right: 7px;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.rollover-layout.thumb-position-right .thumbs-container {
    padding-left: 7px;
}
.fee-gallery-galleriffic .rollover-layout .slideshow-container {
    height: 100%;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.rollover-layout .galleriffic-content {
    width: 80%;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.rollover-layout.thumb-position-left .galleriffic-content {
    padding-left: 7px;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.rollover-layout.thumb-position-right .galleriffic-content {
    padding-right: 7px;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.rollover-layout .thumbs-container img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.rollover-layout .thumbs {
    padding: 0;
    gap: 14px;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.rollover-layout .thumbs li {
    padding: 0;
    margin: 0;
    border: none;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.rollover-layout .thumb {
    width: 100%;
    aspect-ratio: 10/6;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.rollover-layout .thumbs-container .pagination.top {
    display: none;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.rollover-layout .thumbs-container .pagination.bottom {
    position: absolute;
    left: 20px;
    right: 20px;
    bottom: 0;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.rollover-layout .thumbs-container .pagination {
    /* @alternate */ display: -webkit-box;
    /* @alternate */ display: -ms-flexbox;
    display: flex;
    /* @alternate */ -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    /* @alternate */ -webkit-box-pack: center;
    /* @alternate */ -ms-flex-pack: center;
    justify-content: center;
    /* @alternate */ -webkit-box-align: center;
    /* @alternate */ -ms-flex-align: center;
    align-items: center;
    gap: 8px;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.rollover-layout .thumbs-container .pagination span,
.fee-gallery-galleriffic .galleriffic-gallery-wrap.rollover-layout .thumbs-container .pagination a {
    height: auto;
    margin: 0;
    text-decoration: none;
    color: #666;
    font-size: 16px
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.rollover-layout .thumbs-container .pagination span.current {
    color: #000000;
    font-weight: 600;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.rollover-layout .thumbs-container .pagination a[title*="Next"],
.fee-gallery-galleriffic .galleriffic-gallery-wrap.rollover-layout .thumbs-container .pagination a[title*="Prev"] {
    height: 18px;
    width: 18px;
    font-size: 0;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.rollover-layout .thumbs-container .pagination a[title="Next ›"] {
    background: url("data:image/svg+xml,%3Csvg%20width%3D%2218%22%20height%3D%2218%22%20viewBox%3D%220%200%2018%2018%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath%20d%3D%22M10.0637%208.99996L4.88867%203.82496L6.07423%202.6394L12.4348%208.99996L6.07423%2015.3605L4.88867%2014.175L10.0637%208.99996Z%22%20fill%3D%22black%22%2F%3E %3C%2Fsvg%3E") no-repeat center;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.rollover-layout .thumbs-container .pagination a[title="‹ Prev"] {
    background: url("data:image/svg+xml,%3Csvg%20width%3D%2218%22%20height%3D%2218%22%20viewBox%3D%220%200%2018%2018%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath%20d%3D%22M7.45469%209.00002L12.0547%204.40002L11.0009%203.34619L5.34704%209.00002L11.0009%2014.6538L12.0547%2013.6L7.45469%209.00002Z%22%20fill%3D%22black%22%2F%3E %3C%2Fsvg%3E") no-repeat center;
}
.fee-gallery-galleriffic .rollover-layout .slideshow-container .slideshow {
    height: 100%;
}
.fee-gallery-galleriffic .rollover-layout .slideshow-container .slideshow img {
    height: 100%;
    width: 100%;
    /* @alternate */ -o-object-fit: cover;
    object-fit: cover;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap .caption-container .caption {
    max-width: 800px;
    margin: 0 auto;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap .caption-container .caption .image-title {
    font-size: 26px;
    font-weight: 600;
    color: #000;
    line-height: 1.4;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap .caption-container .caption .image-desc {
    font-size: 14px;
    color: #333;
    line-height: 1.5;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap .caption-container .caption > div + div {
    margin-top: 15px;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.caption-position-top .caption-container {
    padding: 0;
    margin-bottom: 20px;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.rollover-layout .caption-container {
    padding: 0 20px;
}
.fee-gallery-galleriffic .galleriffic-gallery-wrap.caption-position-bottom .caption-container {
    padding: 0;
    margin-top: 20px;
}
/* --- galleriffic rollover layout : end --- */

/* --------------------------------------------------------------------------------
// owl carousel
--------------------------------------------------------------------------------- */
.fee-gallery-owl .owl-item .item {
    width: 100%;
    aspect-ratio: 4/6;
}
.fee-gallery-owl .owl-carousel .owl-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.fee-gallery-owl .owl-carousel .owl-stage-outer {
    margin-bottom: 44px;
}

@media (max-width: 767px) {

    fee-gallery-owl .owl-carousel .owl-stage-outer {
        margin-bottom: 20px;
    }
}
/* --- owl carousel : end --- */

/********************************Start jssor******************************/
.fee-gallery-jssor div.jssor-slider-container {
    width: 1920px;
    height: 721px;
    padding: 0 !important;
    text-align: left;
    margin: 0 auto;
}
.fee-gallery-jssor div.jssor-slider-container .container {
    width: 100%;
    height: 100%;
}
.fee-gallery-jssor .jssor-slider-container .caption-wrapper {
    max-width: 1280px;
    margin: 0 auto;
}
.fee-gallery-jssor .jssor-slider-container .description {
    font-size: 18px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 6px;
    opacity: 70%;
}
.fee-gallery-jssor .jssor-slider-container .title {
    font-size: 58px;
    font-weight: 700;
    line-height: 77px;
    margin-bottom: 30px;
}
.fee-gallery-jssor .jssor-slider-container .caption-wrapper [u=caption].button {
    display: inline-block;
    margin: 0 5px;
    min-width: fit-content;
    width: auto;
    text-align: center;
    padding: 10px 0;
}
.fee-gallery-jssor .jssor-slider-container .caption-wrapper [u=caption].button a {
    display: block;
    width: 100%;
    padding: 14px 18px;
    line-height: 21px;
    font-size: 17px;
    font-weight: 500;
    border: 0;
    background-color: #008DF2;
}
.fee-gallery-jssor .jssor-slider-container .caption-wrapper [u=caption].button a:hover {
    background: #0078CE;
    color: #fff;
}
.fee-gallery-jssor .jssor-slider-container .container [u="caption"].title {
    text-align: center;
    padding: 10px 0;
}

.fee-gallery-jssor .jssor-slider-container .container [u="caption"].description {
    text-align: center;
}
.fee-gallery-jssor2 .jssor-slider-container .caption-wrapper [u=caption].button {
    text-align: left;
}
.fee-gallery-jssor2 .jssor-slider-container .container [u="caption"].title {
    text-align: left;
}

.fee-gallery-jssor2 .jssor-slider-container .container [u="caption"].description {
    text-align: left;
    padding: 20px 0;
    line-height: 40px;
}
.fee-gallery-jssor .jssor-slider-container .slide::after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    background: rgba(0, 0, 0, 0.1);
    /* @alternate */ background: linear-gradient(0deg, rgba(0, 0, 0, .56) 35%, rgba(248, 248, 248, 0) 95%);
}
.fee-gallery-jssor .jssor-slider-container .caption-wrapper {
    bottom: 50%;
    /* @alternate */ -webkit-transform: translateY(50%);
    /* @alternate */ -ms-transform: translateY(50%);
    transform: translateY(50%)
}
.fee-gallery-jssor .jssor-slider-container .jssorb03 {
    position: absolute;
    width: 400px !important;
    left: 50% !important;
    right: auto !important;
    bottom: 60px !important;
    top: auto !important;
    /* @alternate */ -webkit-transform: translatex(-50%);
    /* @alternate */ -ms-transform: translatex(-50%);
    transform: translatex(-50%);
    border-radius: 35px;
    opacity: 1 !important;
    height: auto !important;
    /* @alternate */ display: -webkit-box;
    /* @alternate */ display: -ms-flexbox;
    display: flex;
    /* @alternate */ -webkit-box-align: center;
    /* @alternate */ -ms-flex-align: center;
    align-items: center;
    /* @alternate */ -webkit-box-pack: center;
    /* @alternate */ -ms-flex-pack: center;
    justify-content: center;
    padding: 0 !important;
}
.fee-gallery-jssor .jssor-slider-container .jssorb03 div {
    width: 9px !important;
    height: 9px !important;
    border-radius: 100px;
    display: inline-block;
    vertical-align: middle;
    background-color: transparent !important;
    position: relative !important;
    left: auto !important;
    top: auto !important;
    background-image: none !important;
    font-size: 0;
    margin: 0 7px;
    padding: 2px;
}
.fee-gallery-jssor .jssor-slider-container .jssorb03 div span {
    display: block;
    background: rgba(255, 255, 255, 0.55);
    border-radius: 50%;
    font-size: 0;
    width: 6px;
    height: 6px;
}
.fee-gallery-jssor .jssor-slider-container .jssorb03 div.av {
    padding: 0;
}
.fee-gallery-jssor .jssor-slider-container .jssorb03 div.av span {
    background: #fff;
    width: 9px !important;
    height: 9px !important;

}
/*************************************END jssor*************************************************/

/********************************Start jssor2******************************************************/
.fee-gallery-jssor2 div.jssor-slider-container {
    width: 1920px;
    height: 721px;
    padding: 0 !important;
    text-align: left;
    margin: 0 auto;
}
.fee-gallery-jssor2 div.jssor-slider-container .container {
    width: 100%;
    height: 100%;
}
.fee-gallery-jssor2 .jssor-slider-container .caption-wrapper {
    max-width: 1400px;
    margin: 0 auto;
    text-align: left;
    padding-right: 37%;
}
.fee-gallery-jssor2 .jssor-slider-container .description {
    font-size: 27px;
    font-weight: 500;
    text-transform: capitalize;
    letter-spacing: unset;
    opacity: unset;
}
.fee-gallery-jssor2 .jssor-slider-container .title {
    font-size: 66px;
    font-weight: 700;
    line-height: 77px;
    margin-bottom: 20px;
}
.fee-gallery-jssor2 .jssor-slider-container .description:last-child {
    font-size: 18px;
    font-weight: 400;
    padding-right: 20%;
    opacity: 70%;
    line-height: 32px;
    letter-spacing: 0;
    text-transform: capitalize;
}
.fee-gallery-jssor2 .jssor-slider-container .caption-wrapper {
    bottom: 50%;
    /* @alternate */ -webkit-transform: translateY(50%);
    /* @alternate */ -ms-transform: translateY(50%);
    transform: translateY(50%)
}
.fee-gallery-jssor2 .jssor-slider-container .slide::after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    background: rgba(0, 0, 0, .1);
    /* @alternate */ background: linear-gradient(90deg, rgba(0, 0, 0, .36) 35%, rgba(248, 248, 248, 0) 95%);
}
/*************************************END jssor2*************************************************/

/********************************Start jssor3******************************/
.fee-gallery-jssor3 div.jssor-slider-container {
    width: 1920px;
    height: 721px;
    padding: 0 !important;
    text-align: left;
    margin: 0 auto;
}
.fee-gallery-jssor3 div.jssor-slider-container .container {
    width: 100%;
    height: 100%;
}
.fee-gallery-jssor3 .jssor-slider-container .slide::after {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    background: transparent;
}
.fee-gallery-jssor3 .jssor-slider-container .jssorb03 {
    position: absolute;
    width: 400px !important;
    left: 50% !important;
    right: auto !important;
    bottom: 60px !important;
    top: auto !important;
    /* @alternate */ -webkit-transform: translatex(-50%);
    /* @alternate */ -ms-transform: translatex(-50%);
    transform: translatex(-50%);
    border-radius: 35px;
    opacity: 1 !important;
    height: auto !important;
    /* @alternate */ display: -webkit-box;
    /* @alternate */ display: -ms-flexbox;
    display: flex;
    /* @alternate */ -webkit-box-align: center;
    /* @alternate */ -ms-flex-align: center;
    align-items: center;
    /* @alternate */ -webkit-box-pack: center;
    /* @alternate */ -ms-flex-pack: center;
    justify-content: center;
    padding: 0 !important;
}
.fee-gallery-jssor3 .jssor-slider-container .jssorb03 div {
    display: inline-block;
    vertical-align: middle;
    background-color: transparent !important;
    position: relative !important;
    left: auto !important;
    top: auto !important;
    background-image: none !important;
    margin: 0 7px;
    width: 24px;
    height: 24px;
}
.fee-gallery-jssor3 .jssor-slider-container .jssorb03 div span {
    display: block;
    background: rgba(255, 255, 255, 0.55);
    width: 24px;
    height: 24px;
    font-size: 15px;
    font-weight: 700;
    border-radius: 8px;
    line-height: 24px;
    color: #000;
}
.fee-gallery-jssor3 .jssor-slider-container .jssorb03 div span:hover,
.fee-gallery-jssor3 .jssor-slider-container .jssorb03 div.av span {
    background: #2B87F3;
    color: #fff;
}
.fee-gallery-jssor3 .jssor-slider-container .jssora20r {
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2229%22%20height%3D%2254%22%20viewBox%3D%220%200%2029%2054%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath%20d%3D%22M1.56299%202.00781L26.5566%2027.0015L1.56299%2051.9951%22%20stroke%3D%22white%22%20stroke-width%3D%223%22%2F%3E %3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-position: center;
    padding: 34px;
}
.fee-gallery-jssor3 .jssor-slider-container .jssora20l{
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2229%22%20height%3D%2254%22%20viewBox%3D%220%200%2029%2054%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath%20d%3D%22M1.56299%202.00781L26.5566%2027.0015L1.56299%2051.9951%22%20stroke%3D%22white%22%20stroke-width%3D%223%22%2F%3E %3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-position: center;
    padding: 34px;
    transform:rotate(180deg)
}
.fee-gallery-jssor3 .jssor-slider-container .jssora20r:hover,
.fee-gallery-jssor3 .jssor-slider-container .jssora20l:hover {
    background-color: rgba(0, 0, 0, 0.1);
    border-radius: 20px;
    background-position: center
}
/*************************************END jssor3*************************************************/

@media only screen and (max-width: 1200px) {
    .fee-gallery-jssor .jssor-slider-container .caption-wrapper {
        max-width: 1480px;
    }
    .fee-gallery-jssor .jssor-slider-container .description {
        font-size: 24px;
    }
    .fee-gallery-jssor .jssor-slider-container .title {
        font-size: 74px;
        line-height: 110px;
    }
    .fee-gallery-jssor .jssor-slider-container .caption-wrapper [u=caption].button {
        width: 280px;
    }
    .fee-gallery-jssor .jssor-slider-container .caption-wrapper [u=caption].button a {
        padding: 26px 8px;
        font-size: 25px;
    }
    .fee-gallery-jssor .jssor-slider-container .jssorb03 div {
        width: 12px !important;
        height: 12px !important;
    }
    .fee-gallery-jssor .jssor-slider-container .jssorb03 div span {
        width: 10px;
        height: 10px;
    }
    .fee-gallery-jssor .jssor-slider-container .jssorb03 div.av span {
        width: 12px !important;
        height: 12px !important;
    }
}
@media only screen and (max-width: 767px) {
    .fee-gallery-jssor .jssor-slider-container .description {
        font-size: 30px;
    }
    .fee-gallery-jssor .jssor-slider-container .caption-wrapper [u=caption].button a {
        font-size: 30px;
    }
}
@media only screen and (max-width: 1200px) {
    .fee-gallery-jssor2 .jssor-slider-container .caption-wrapper {
        padding-right: 30%;
    }
    .fee-gallery-jssor2 .jssor-slider-container .description {
        font-size: 38px;
        line-height: 70px;
    }
    .fee-gallery-jssor2 .jssor-slider-container .title {
        font-size: 78px;
        line-height: 100px;
        margin-bottom: 20px;
    }
    .fee-gallery-jssor2 .jssor-slider-container .description:last-child {
        font-size: 28px;
        padding-right: 0;
        line-height: 52px;
    }
}
@media only screen and (max-width: 767px) {
    .fee-gallery-jssor2 .jssor-slider-container .caption-wrapper {
        padding-right: 0;
    }
    .fee-gallery-jssor2 .jssor-slider-container .description {
        font-size: 50px;
    }
    .fee-gallery-jssor2 .jssor-slider-container .title {
        font-size: 90px;
    }
    .fee-gallery-jssor2 .jssor-slider-container .description:last-child {
        font-size: 50px;
        line-height: 70px;
    }
}
/*section related css*/
.fee-widget-content:not(.fee-empty-content) {
    height: 100%;
    width: 100%;
}
.fee-column-section-added-from-editor.fee-full-width-row:not(.dont-apply-flex){
    /* @alternate */ display: -webkit-box;
    /* @alternate */ display: -ms-flexbox;
    display: flex;
    /* @alternate */ -ms-flex-pack: distribute;
    justify-content: space-around;
    height: auto !important;
}

.fee-column-section-added-from-editor.v-split.grid-block:not(.dont-apply-flex) > .grid-block {
    height: auto !important;
    /* @alternate */ -webkit-box-sizing: border-box;
    box-sizing: border-box;
    /* @alternate */ display: -webkit-box;
    /* @alternate */ display: -ms-flexbox;
    display: flex;
    /* @alternate */ -webkit-box-orient: vertical;
    /* @alternate */ -webkit-box-direction: normal;
    /* @alternate */ -ms-flex-direction: column;
    flex-direction: column;
}

.page-content .v-split-container > .fee-column-section-added-from-editor.v-split.grid-block:not(.dont-apply-flex) {
    /* @alternate */ display: -webkit-box;
    /* @alternate */ display: -ms-flexbox;
    display: flex;
}
/* Mirror the editor-only `.fee .no-fixed-container { display: flex }` rule
   for storefront. In the editor body the `.fee`-scoped rule flexes every
   `.no-fixed-container` row, so columns (col-half-50, col-third-33, etc.)
   sit side-by-side. On storefront the base `.no-fixed-container
   { display: block }` won, so any row whose class combination didn't
   trigger one of the legacy flex rules (e.g. the seed product auto-page
   row, or any future layout saved without `.fee-column-section-added-
   from-editor`) ended up with its columns stacked vertically.
   This rule generalises the convergence: any `.no-fixed-container` row
   directly inside `.page-content > .v-split-container` flexes on
   storefront the same way it does in the editor — covering main page
   bodies, auto-pages, mega menu submenus, popup content, and owl
   carousel slides (all of which normalise to the same hierarchy). The
   `:not(.dont-apply-flex)` opt-out is preserved so anything that
   explicitly wants block layout still gets it. Header/footer/dockable
   sections are not affected because their `.widget-container` is not
   wrapped in `.page-content`. */
.page-content .v-split-container > .no-fixed-container.v-split.grid-block:not(.dont-apply-flex) {
    /* @alternate */ display: -webkit-box;
    /* @alternate */ display: -ms-flexbox;
    display: flex;
}
.page-content .v-split-container > .v-split.grid-block.fee-section-act-row {
    display: block;
}
.fee-section-act-row.fee-full-width-row {
    display: block;
}

/*section related css*/



.fee-gallery-owl .product-view .owl-item .product-block {
    width: 100%;
    border: 1px #DDDDDD  solid;
    border-radius: 15px;
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}
.fee-gallery-owl .product-view .owl-item .product-block .product-image {
    height: auto;
    background: none;
}
.fee-gallery-owl .product-view .owl-item .product-block .product-image a.product-image-link {
    display: block;
    width: 100%;
    aspect-ratio: 10 / 8;
}
.fee-gallery-owl .product-view .owl-item .product-block .product-image a.product-image-link img {
    max-width: unset;
    max-height: unset;
    border-radius: 15px 15px 0 0;
}
.fee-gallery-owl .product-view .owl-item .product-block .block-content-wrap {
    text-align: center;
}
.fee-gallery-owl .product-view .owl-item .item  {
    aspect-ratio: unset;
}
.fee-gallery-owl .product-view .owl-item .product-block .review-rating-wrapper {
    /* @alternate */ display: -webkit-box;
    /* @alternate */ display: -ms-flexbox;
    display: flex;
    /* @alternate */ -webkit-box-pack: center;
    /* @alternate */ -ms-flex-pack: center;
    justify-content: center;
    padding: 10px;
}
.fee-gallery-owl .product-view .owl-item .product-block .review-rating-wrapper .review-rating {
    /* @alternate */ display: -webkit-box;
    /* @alternate */ display: -ms-flexbox;
    display: flex;
    gap: 0;
    /* @alternate */ -webkit-box-align: center;
    /* @alternate */ -ms-flex-align: center;
    align-items: center;
    margin: 0;
}
.fee-gallery-owl.widget-gallery .owl-controls .owl-nav .owl-prev,
.fee-gallery-owl.widget-gallery .owl-controls .owl-nav .owl-next {
    background: #ffffff;
    border: 1px solid #ffffff;
    height: 32px;
    margin: 5px;
    position: relative;
    width: 32px;
    line-height: 35px;
    border-radius: 30px;
    font-size: 0;
    /* @alternate */ -webkit-box-shadow: 0 4px 15px 0 rgba(0,0,0, .15);
    box-shadow: 0 4px 15px 0 rgba(0,0,0, .15);
}
.fee-gallery-owl.widget-gallery .owl-controls .owl-nav .owl-prev:hover,
.fee-gallery-owl.widget-gallery .owl-controls .owl-nav .owl-next:hover {
    background: #008df2;
    border: 1px solid #008df2;
    height: 32px;
    margin: 5px;
    position: relative;
    width: 32px;
    line-height: 35px;
    border-radius: 30px;
    font-size: 0;
    /* @alternate */ -webkit-box-shadow: 0 4px 15px 0 rgba(0, 0, 0, .15);
    box-shadow: 0 4px 15px 0 rgba(0, 0, 0, .15);
}
.fee-gallery-owl.widget-gallery  .owl-controls .owl-nav .owl-prev:before,
.fee-gallery-owl.widget-gallery .owl-controls .owl-nav .owl-next:before {
    color: #333333;
    font-family: fontawesome;
    font-size: 22px;
    left: auto;
    position: absolute;
    right: auto;
    top: -3px;
}
.fee-gallery-owl.widget-gallery .owl-controls .owl-nav .owl-prev:hover:before,
.fee-gallery-owl.widget-gallery .owl-controls .owl-nav .owl-next:hover:before {
    color: #ffffff;
}
.fee-gallery-owl.widget-gallery .owl-controls .owl-nav .owl-prev::before {
    content: "\f104";
    left: 11px;
}
.fee-gallery-owl.widget-gallery .owl-controls .owl-nav .owl-next::before {
    content: "\f105";
    right: 10px;
}
.fee-gallery-owl .owl-carousel.product-view .owl-stage-outer {
    margin-bottom: 20px;
}
.fee-gallery-owl .owl-carousel .owl-controls .owl-dot span {
    background: #F0F3F4;
    border: 1px #DDDDDD solid;
}
.fee-gallery-owl .owl-carousel .owl-controls .owl-dot:hover span,
.fee-gallery-owl .owl-carousel .owl-controls .owl-dot.active span {
    background: #008DF2;
    border: 1px #008DF2 solid;
}
.fee-gallery-owl .product-view .owl-item .product-block .block-content-wrap .product-name {
    margin: 0;
    padding: 24px 5px;
    height: auto;
}

.fee-gallery-owl .product-view .owl-item .product-block .block-content-wrap .product-name-link {
    font-size: 18px;
    line-height: 24px;
    font-weight: 600;
    color: #000000;
}
.fee-gallery-owl .product-view .owl-item .product-block .block-content-wrap .add-to-cart-button {
    position: absolute;
    top: 61%;
    right: 12px;
    height: 32px !important;
    width: 32px;
    border-radius: 50%;
    font-size: 0;
    background-color: #ffffff;
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath%20d%3D%22M7.01737%2017.5C6.62915%2017.5%206.29906%2017.3678%206.0271%2017.1034C5.75513%2016.8389%205.61915%2016.5179%205.61915%2016.1405C5.61915%2015.763%205.75513%2015.442%206.0271%2015.1776C6.29906%2014.9131%206.62915%2014.7809%207.01737%2014.7809C7.4056%2014.7809%207.7357%2014.9131%208.00766%2015.1776C8.27963%2015.442%208.41561%2015.763%208.41561%2016.1405C8.41561%2016.5179%208.27963%2016.8389%208.00766%2017.1034C7.7357%2017.3678%207.4056%2017.5%207.01737%2017.5ZM14.7615%2017.5C14.3732%2017.5%2014.0431%2017.3678%2013.7712%2017.1034C13.4992%2016.8389%2013.3632%2016.5179%2013.3632%2016.1405C13.3632%2015.763%2013.4992%2015.442%2013.7712%2015.1776C14.0431%2014.9131%2014.3732%2014.7809%2014.7615%2014.7809C15.1497%2014.7809%2015.4798%2014.9131%2015.7517%2015.1776C16.0237%2015.442%2016.1597%2015.763%2016.1597%2016.1405C16.1597%2016.5179%2016.0237%2016.8389%2015.7517%2017.1034C15.4798%2017.3678%2015.1497%2017.5%2014.7615%2017.5ZM6.10774%205.21911L8.13289%209.34264H13.5799C13.626%209.34264%2013.6669%209.33143%2013.7028%209.30902C13.7387%209.28661%2013.7694%209.25548%2013.795%209.21564L15.9384%205.42827C15.9692%205.37349%2015.9717%205.32493%2015.9461%205.28261C15.9205%205.24026%2015.877%205.21909%2015.8155%205.21909L6.10774%205.21911ZM5.53308%204.05381H16.6268C16.9535%204.05381%2017.2007%204.18902%2017.3681%204.45943C17.5356%204.72985%2017.5436%205.006%2017.3919%205.28787L14.8321%209.79679C14.701%2010.0209%2014.5276%2010.1955%2014.312%2010.3205C14.0964%2010.4454%2013.86%2010.5079%2013.6029%2010.5079H7.77334L6.84834%2012.1514C6.80737%2012.2112%206.80609%2012.2759%206.84451%2012.3456C6.88293%2012.4154%206.94055%2012.4502%207.01737%2012.4502H16.1597V13.6155H7.01737C6.48472%2013.6155%206.08446%2013.3922%205.81658%2012.9455C5.54872%2012.4988%205.53925%2012.0528%205.78816%2011.6076L6.92828%209.61453L4.02116%203.6653H2.5V2.5H4.77404L5.53308%204.05381Z%22%20fill%3D%22black%22%2F%3E %3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-position: center;
    /* @alternate */ -webkit-box-shadow: 0 4px 15px 0 rgba(0,0,0, .15);
    box-shadow: 0 4px 15px 0 rgba(0,0,0, .15);
    /* @alternate */ -webkit-transition: all 100ms ease-out 0s;
    /* @alternate */ -o-transition: all 100ms ease-out 0s;
    transition: all 100ms ease-out 0s;
}

.fee-gallery-owl .product-view .owl-item .product-block .block-content-wrap .add-to-cart-button:hover {
    background-color: #008DF2;
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath%20d%3D%22M7.01737%2017.5C6.62915%2017.5%206.29906%2017.3678%206.0271%2017.1034C5.75513%2016.8389%205.61915%2016.5179%205.61915%2016.1405C5.61915%2015.763%205.75513%2015.442%206.0271%2015.1776C6.29906%2014.9131%206.62915%2014.7809%207.01737%2014.7809C7.4056%2014.7809%207.7357%2014.9131%208.00766%2015.1776C8.27963%2015.442%208.41561%2015.763%208.41561%2016.1405C8.41561%2016.5179%208.27963%2016.8389%208.00766%2017.1034C7.7357%2017.3678%207.4056%2017.5%207.01737%2017.5ZM14.7615%2017.5C14.3732%2017.5%2014.0431%2017.3678%2013.7712%2017.1034C13.4992%2016.8389%2013.3632%2016.5179%2013.3632%2016.1405C13.3632%2015.763%2013.4992%2015.442%2013.7712%2015.1776C14.0431%2014.9131%2014.3732%2014.7809%2014.7615%2014.7809C15.1497%2014.7809%2015.4798%2014.9131%2015.7517%2015.1776C16.0237%2015.442%2016.1597%2015.763%2016.1597%2016.1405C16.1597%2016.5179%2016.0237%2016.8389%2015.7517%2017.1034C15.4798%2017.3678%2015.1497%2017.5%2014.7615%2017.5ZM6.10774%205.21911L8.13289%209.34264H13.5799C13.626%209.34264%2013.6669%209.33143%2013.7028%209.30902C13.7387%209.28661%2013.7694%209.25548%2013.795%209.21564L15.9384%205.42827C15.9692%205.37349%2015.9717%205.32493%2015.9461%205.28261C15.9205%205.24026%2015.877%205.21909%2015.8155%205.21909L6.10774%205.21911ZM5.53308%204.05381H16.6268C16.9535%204.05381%2017.2007%204.18902%2017.3681%204.45943C17.5356%204.72985%2017.5436%205.006%2017.3919%205.28787L14.8321%209.79679C14.701%2010.0209%2014.5276%2010.1955%2014.312%2010.3205C14.0964%2010.4454%2013.86%2010.5079%2013.6029%2010.5079H7.77334L6.84834%2012.1514C6.80737%2012.2112%206.80609%2012.2759%206.84451%2012.3456C6.88293%2012.4154%206.94055%2012.4502%207.01737%2012.4502H16.1597V13.6155H7.01737C6.48472%2013.6155%206.08446%2013.3922%205.81658%2012.9455C5.54872%2012.4988%205.53925%2012.0528%205.78816%2011.6076L6.92828%209.61453L4.02116%203.6653H2.5V2.5H4.77404L5.53308%204.05381Z%22%20fill%3D%22white%22%2F%3E %3C%2Fsvg%3E");
}
.fee-gallery-owl .product-view .owl-item .product-block .block-content-wrap .add-to-cart-button:after,
.fee-gallery-owl .product-view .owl-item .product-block .block-content-wrap .add-to-cart-button:before {
    display: none;
}
.fee-gallery-swiper.swiperSlider .product-view.image-view .product-block {
    width: 350px;
    border: 1px #DDDDDD solid;
    border-radius: 15px;
    padding: 0;
    margin: 0 auto;
}
.fee-gallery-swiper.swiperSlider .swiper-backface-hidden .swiper-slide {
    /* @alternate */ display: -webkit-box;
    /* @alternate */ display: -ms-flexbox;
    display: flex;
    /* @alternate */ -webkit-box-pack: center;
    /* @alternate */ -ms-flex-pack: center;
    justify-content: center;
}
.fee-gallery-swiper.swiperSlider .product-view.image-view .product-block .product-image {
    height: auto;
}
.fee-gallery-swiper.swiperSlider .product-view.image-view .product-block .product-image-link {
    display: block;
    width: 100%;
    aspect-ratio: 13 / 8;
}
.fee-gallery-swiper.swiperSlider .product-view.image-view .product-block .product-image-link img {
    max-width: unset;
    max-height: unset;
    border-radius: 15px 15px 0 0;
    width: 100%;
    height: 100%;
    /* @alternate */ -o-object-fit: cover;
    object-fit: cover;
}
.fee-gallery-swiper.swiperSlider .product-view.image-view .product-block .block-content-wrap {
    text-align: center;
}
.fee-gallery-swiper.swiperSlider .product-block .block-content-wrap .product-name {
    margin: 0;
    padding: 24px 5px;
    height: auto;
}
.fee-gallery-swiper.swiperSlider .product-block .block-content-wrap .product-name .product-name-link {
    font-size: 18px;
    line-height: 24px;
    font-weight: 600;
    color: #000000;
}
.fee-gallery-swiper.swiperSlider .product-block .add-to-cart-button {
    position: absolute;
    top: 59%;
    right: 12px;
    height: 32px;
    width: 32px;
    border-radius: 50%;
    font-size: 0;
    background-color: #ffffff;
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath%20d%3D%22M7.01737%2017.5C6.62915%2017.5%206.29906%2017.3678%206.0271%2017.1034C5.75513%2016.8389%205.61915%2016.5179%205.61915%2016.1405C5.61915%2015.763%205.75513%2015.442%206.0271%2015.1776C6.29906%2014.9131%206.62915%2014.7809%207.01737%2014.7809C7.4056%2014.7809%207.7357%2014.9131%208.00766%2015.1776C8.27963%2015.442%208.41561%2015.763%208.41561%2016.1405C8.41561%2016.5179%208.27963%2016.8389%208.00766%2017.1034C7.7357%2017.3678%207.4056%2017.5%207.01737%2017.5ZM14.7615%2017.5C14.3732%2017.5%2014.0431%2017.3678%2013.7712%2017.1034C13.4992%2016.8389%2013.3632%2016.5179%2013.3632%2016.1405C13.3632%2015.763%2013.4992%2015.442%2013.7712%2015.1776C14.0431%2014.9131%2014.3732%2014.7809%2014.7615%2014.7809C15.1497%2014.7809%2015.4798%2014.9131%2015.7517%2015.1776C16.0237%2015.442%2016.1597%2015.763%2016.1597%2016.1405C16.1597%2016.5179%2016.0237%2016.8389%2015.7517%2017.1034C15.4798%2017.3678%2015.1497%2017.5%2014.7615%2017.5ZM6.10774%205.21911L8.13289%209.34264H13.5799C13.626%209.34264%2013.6669%209.33143%2013.7028%209.30902C13.7387%209.28661%2013.7694%209.25548%2013.795%209.21564L15.9384%205.42827C15.9692%205.37349%2015.9717%205.32493%2015.9461%205.28261C15.9205%205.24026%2015.877%205.21909%2015.8155%205.21909L6.10774%205.21911ZM5.53308%204.05381H16.6268C16.9535%204.05381%2017.2007%204.18902%2017.3681%204.45943C17.5356%204.72985%2017.5436%205.006%2017.3919%205.28787L14.8321%209.79679C14.701%2010.0209%2014.5276%2010.1955%2014.312%2010.3205C14.0964%2010.4454%2013.86%2010.5079%2013.6029%2010.5079H7.77334L6.84834%2012.1514C6.80737%2012.2112%206.80609%2012.2759%206.84451%2012.3456C6.88293%2012.4154%206.94055%2012.4502%207.01737%2012.4502H16.1597V13.6155H7.01737C6.48472%2013.6155%206.08446%2013.3922%205.81658%2012.9455C5.54872%2012.4988%205.53925%2012.0528%205.78816%2011.6076L6.92828%209.61453L4.02116%203.6653H2.5V2.5H4.77404L5.53308%204.05381Z%22%20fill%3D%22black%22%2F%3E %3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-position: center;
    /* @alternate */ -webkit-box-shadow: 0 4px 15px 0 rgba(0,0,0, .15);
    box-shadow: 0 4px 15px 0 rgba(0,0,0, .15);
    /* @alternate */ -webkit-transition: all 100ms ease-out 0s;
    /* @alternate */ -o-transition: all 100ms ease-out 0s;
    transition: all 100ms ease-out 0s;
}
.fee-gallery-swiper.swiperSlider .product-block .add-to-cart-button:hover {
    background-color: #008DF2;
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20viewBox%3D%220%200%2020%2020%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath%20d%3D%22M7.01737%2017.5C6.62915%2017.5%206.29906%2017.3678%206.0271%2017.1034C5.75513%2016.8389%205.61915%2016.5179%205.61915%2016.1405C5.61915%2015.763%205.75513%2015.442%206.0271%2015.1776C6.29906%2014.9131%206.62915%2014.7809%207.01737%2014.7809C7.4056%2014.7809%207.7357%2014.9131%208.00766%2015.1776C8.27963%2015.442%208.41561%2015.763%208.41561%2016.1405C8.41561%2016.5179%208.27963%2016.8389%208.00766%2017.1034C7.7357%2017.3678%207.4056%2017.5%207.01737%2017.5ZM14.7615%2017.5C14.3732%2017.5%2014.0431%2017.3678%2013.7712%2017.1034C13.4992%2016.8389%2013.3632%2016.5179%2013.3632%2016.1405C13.3632%2015.763%2013.4992%2015.442%2013.7712%2015.1776C14.0431%2014.9131%2014.3732%2014.7809%2014.7615%2014.7809C15.1497%2014.7809%2015.4798%2014.9131%2015.7517%2015.1776C16.0237%2015.442%2016.1597%2015.763%2016.1597%2016.1405C16.1597%2016.5179%2016.0237%2016.8389%2015.7517%2017.1034C15.4798%2017.3678%2015.1497%2017.5%2014.7615%2017.5ZM6.10774%205.21911L8.13289%209.34264H13.5799C13.626%209.34264%2013.6669%209.33143%2013.7028%209.30902C13.7387%209.28661%2013.7694%209.25548%2013.795%209.21564L15.9384%205.42827C15.9692%205.37349%2015.9717%205.32493%2015.9461%205.28261C15.9205%205.24026%2015.877%205.21909%2015.8155%205.21909L6.10774%205.21911ZM5.53308%204.05381H16.6268C16.9535%204.05381%2017.2007%204.18902%2017.3681%204.45943C17.5356%204.72985%2017.5436%205.006%2017.3919%205.28787L14.8321%209.79679C14.701%2010.0209%2014.5276%2010.1955%2014.312%2010.3205C14.0964%2010.4454%2013.86%2010.5079%2013.6029%2010.5079H7.77334L6.84834%2012.1514C6.80737%2012.2112%206.80609%2012.2759%206.84451%2012.3456C6.88293%2012.4154%206.94055%2012.4502%207.01737%2012.4502H16.1597V13.6155H7.01737C6.48472%2013.6155%206.08446%2013.3922%205.81658%2012.9455C5.54872%2012.4988%205.53925%2012.0528%205.78816%2011.6076L6.92828%209.61453L4.02116%203.6653H2.5V2.5H4.77404L5.53308%204.05381Z%22%20fill%3D%22white%22%2F%3E %3C%2Fsvg%3E");
}
.fee-gallery-swiper.swiperSlider .swiper-pagination {
    position: static;
    margin-top: 30px;
}
.widget-gallery.fee-gallery-swiper .swiper-button-prev,
.widget-gallery.fee-gallery-swiper .swiper-button-next {
    background: #ffffff;
    border: 1px solid #ffffff;
    height: 32px;
    margin: 5px;
    position: relative;
    width: 32px;
    line-height: 35px;
    border-radius: 30px;
    font-size: 0;
    /* @alternate */ -webkit-box-shadow: 0 4px 15px 0 rgba(0,0,0, .15);
    box-shadow: 0 4px 15px 0 rgba(0,0,0, .15);
    opacity: 1;
}
.widget-gallery.fee-gallery-swiper .swiper-button-prev:hover,
.widget-gallery.fee-gallery-swiper .swiper-button-next:hover {
    background: #008DF2;
    border: 1px solid #008DF2;
}
.widget-gallery.fee-gallery-swiper .swiper-button-prev.swiper-button-disabled:after,
.widget-gallery.fee-gallery-swiper .swiper-button-next.swiper-button-disabled:after {
    opacity: .3
}
.widget-gallery.fee-gallery-swiper .swiper-button-prev:after,
.widget-gallery.fee-gallery-swiper .swiper-button-next:after {
    color: #333333;
    font-family: fontawesome;
    font-size: 22px;
    left: auto;
    position: absolute;
    right: auto;
    top: 3px;
}
.widget-gallery.fee-gallery-swiper .swiper-button-prev:hover:after,
.widget-gallery.fee-gallery-swiper .swiper-button-next:hover:after {
    color: #ffffff;
}
.widget-gallery.fee-gallery-swiper .swiper-button-prev:after {
    content: "\f104";
    left: 11px;
}
.widget-gallery.fee-gallery-swiper .swiper-button-next:after {
    content: "\f105";
    right: 10px;
}
.fee_img-gallery_product_swiper .swiper-horizontal {
    position: relative;
}
.fee_img-gallery_product_swiper .swiper-horizontal .swiper-button-next,
.fee_img-gallery_product_swiper .swiper-horizontal .swiper-button-prev {
    position: absolute;
    top: 50%;
    margin-top: -16px;
}
.fee_img-gallery_product_swiper .swiper-horizontal .swiper-button-next {
    right: 50%;
    margin-right: -230px;
}
.fee_img-gallery_product_swiper .swiper-horizontal .swiper-button-prev {
    left: 50%;
    margin-left: -230px;
}
.fee-gallery-swiper.swiperSlider .swiper-pagination .swiper-pagination-bullet {
    background: #F0F3F4;
    border: 1px #DDDDDD solid;
    opacity: 1;
    height: 10px;
    width: 10px;
}
.fee-gallery-swiper.swiperSlider .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
    background: #008DF2;
    border: 1px #008DF2 solid;
}
.fee-gallery-owl .article-title {
    font-size: 22px;
    line-height: 1.4;
    font-weight: 600;
    padding-bottom: 20px;
}
.fee_img-gallery_article_swiper .article-title {
    font-size: 22px;
    font-weight: 600;
    line-height: 1.4;
    color: #000;
    padding-bottom: 20px;
}
.fee_img-gallery_article_swiper .swiper-horizontal {text-align: center;}
.fee_img-gallery_article_swiper .swiper-horizontal .swiper-button-prev,
.fee_img-gallery_article_swiper .swiper-horizontal .swiper-button-next {
    display: inline-block;
    margin: 0px 4px;
    left: auto;
    right: auto;
}
.fee-gallery-owl.fee_img-gallery_article_owl .owl-carousel .owl-stage-outer {
    margin-bottom: 0;
}
.fee-gallery-owl .category-image-view.category {
    width: 100%;
    border: 1px #DDDDDD  solid;
    padding: 0;
    margin: 0;
}

.fee-gallery-owl .category-image-view-height {
    height: auto;
}

.fee-gallery-owl .category-image-view-height a {
    display: block
;width: 100%;
    aspect-ratio: 10 / 8;
}
.fee-gallery-owl .owl-carousel .category-image-view-height a img {
    max-width: unset;
    max-height: unset;
}

.fee-gallery-owl.fee_img-gallery_category_owl .owl-item .item {
    aspect-ratio: unset;
}
.fee-gallery-owl .category-image-view.category .category-name {
    margin: 0;
    padding: 24px 5px 5px 5px;
    height: auto;
}
.fee-gallery-owl .category-image-view.category .category-name-link {
    font-size: 18px;
    line-height: 24px;
    font-weight: 600;
    color: #000000
}
.fee-gallery-owl .category-image-view.category .summary {
    padding: 0 5px 24px 5px;
    height: auto;
}

.fee-gallery-swiper .category-image-view.category {
    width: 350px;
    border: 1px #DDDDDD solid;
    padding: 0;
    margin: 0 auto;
}

.fee-gallery-swiper .category-image-view-height {
    height: auto;
}

.fee-gallery-swiper .category-image-view-height a {
    display: block;
    width: 100%;
    aspect-ratio: 13 / 8;
}
.fee-gallery-swiper .category-image-view-height a img {
    max-width: unset;
    max-height: unset;
    width: 100%;
    height: 100%;
    /* @alternate */ -o-object-fit: cover;
    object-fit: cover;
}
.fee-gallery-swiper .category-image-view .category-name {
    margin: 0;
    padding: 24px 10px 5px 10px;
    height: auto;
}
.fee-gallery-swiper .category-image-view .category-name-link {
    font-size: 18px;
    line-height: 24px;
    font-weight: 600;
    color: #000000;
}
.fee-gallery-swiper .category-image-view .summary {
    padding: 0 10px 24px;
    height: auto;
}

.fee_img-gallery_category_swiper .swiper-horizontal {
    position: relative;
}
.widget-gallery .swiper-horizontal {
    padding-bottom: 15px;
}
.fee_img-gallery_category_swiper .swiper-horizontal .swiper-button-next,
.fee_img-gallery_category_swiper .swiper-horizontal .swiper-button-prev {
    position: absolute;
    top: 50%;
    margin-top: -16px;
}
.fee_img-gallery_category_swiper .swiper-horizontal .swiper-button-next {
    right: 50%;
    margin-right: -230px;
}
.fee_img-gallery_category_swiper .swiper-horizontal .swiper-button-prev {
    left: 50%;
    margin-left: -230px;
}


/* +++++++++++++++++  Login widget design +++++++++++++++++++++++++ */

.login-form {
    background-color : #F9F9F9;
    padding          : 30px;
    width            : 318px;
}
.login-form .submit-row {
    float : right;
}
.login-form .remember {
    margin : 12px 0 22px;
    width  : 230px;
}
.login-form .remember label {
    display : none;
}
.login-form input[type="checkbox"] {
    display : inline-block;
    width   : auto;
}
.login-form input {
    display : block;
    width   : 310px;
}
.login-form .form-row.simple-captcha label {
    display : none;
}
.login-form .lost-password a {
    color : #FF0000;
}
.login-form .lost-password a:hover {
    color : #F39292;
}
.login-form .account-register a {
    color : #00CED1;
}
.login-form .account-register a:hover {
    color : #3FEAEC;
}

.registration-verification-message {
    font-size: 14px;
    max-width: 600px;
    text-align: center;
    margin: 0 auto 30px;
}

.registration-verification-message .resend-verification-button {
    padding: 6px 25px 8px 25px;
    display: inline-block;
    background-color: #000;
    border-radius: 3px;
    color: #ffffff;
    font-size: 16px;
    line-height: 26px;
    margin-top: 15px;
    cursor: pointer;
}

.registration-verification-message .resend-verification-button:hover {
    background-color: #2b2b2b;
}

/*login navigation*/

.widget-navigation .nav-profile-logged-in {
    /* @alternate */ display: -webkit-box;
    /* @alternate */ display: -ms-flexbox;
    display: flex;
    /* @alternate */ -webkit-box-pack: justify;
    /* @alternate */ -ms-flex-pack: justify;
    justify-content: space-between;
    /* @alternate */ -webkit-box-align: center;
    /* @alternate */ -ms-flex-align: center;
    align-items: center;
}
.widget-navigation .nav-profile-logged-in .nav-profile-info-wrapper {
    /* @alternate */ display: -webkit-box;
    /* @alternate */ display: -ms-flexbox;
    display: flex;
    /* @alternate */ -webkit-box-align: center;
    /* @alternate */ -ms-flex-align: center;
    align-items: center;
    gap: 10px;
}
.widget-navigation .nav-profile-logged-in .nav-profile-pic {
    height: 32px;
    width: 32px;
    /* @alternate */ -o-object-fit: cover;
    object-fit: cover;
    border-radius: 50%;
}
.widget-navigation .nav-profile-logged-in .nav-customer-name {
    font-size: 15px;
    font-weight: 600;
}
.widget-navigation .nav-profile-logged-in .autoGeneratedPage {
    padding: 0;
    border: none;
    font-size: 13px;
    font-weight: 600;
    text-decoration: underline;
    color: #333333;
}
.widget-navigation .nav-profile-not-logged-in {
    text-align: center;
    /* @alternate */ display: -webkit-box;
    /* @alternate */ display: -ms-flexbox;
    display: flex;
    /* @alternate */ -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    /* @alternate */ -webkit-box-pack: center;
    /* @alternate */ -ms-flex-pack: center;
    justify-content: center;
}
.widget-navigation .navigation-item .nav-profile-not-logged-in > .autoGeneratedPage {
    border: none;
    display: inline-block!important;
    width: auto;
    background-color: #000000;
    padding: 8px 42px;
    font-size: 14px;
    font-weight: 600;
    color: #ffffff;
}
.widget-navigation .nav-profile-not-logged-in .nav-profile-suggestion-wrapper {
    /* @alternate */ display: -webkit-box;
    /* @alternate */ display: -ms-flexbox;
    display: flex;
    /* @alternate */ -webkit-box-pack: justify;
    /* @alternate */ -ms-flex-pack: justify;
    justify-content: space-between;
    /* @alternate */ -webkit-box-align: center;
    /* @alternate */ -ms-flex-align: center;
    align-items: center;
    width: 100%;
    padding-top: 20px;
}
.widget-navigation .nav-profile-not-logged-in .nav-customer-qa {
    font-size: 15px;
    font-weight: 600;
    color: #000000;
}
.widget-navigation .nav-profile-not-logged-in .customer-register-link a {
    padding: 0;
    font-size: 13px;
    font-weight: 600;
    color: #333333;
    border: none;
    text-decoration: underline;
}



.profile-responsive-mask {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: rgba(0,0,0, .5);
}

.maintenance-message-block {
    background-color: #f9f9f9;
    max-width: 600px;
    margin: 50px auto;
    padding: 30px 20px;
}

.maintenance-message-block h1 {
    margin: 0;
    font-family: "Segoe UI", Verdana, Arial, sans-serif;
    font-size: 26px;
    font-weight: 700;
    line-height: normal;
    color: #222;
}


/*variation  css*/
input.product-quantity-selector-bulk.validation-error {
    background: #e42c2c82;
}
.quantity-selector-column .errorlist.after {
    display: none;
}
.bulk-selected-cart-popup .cart-add-error-message {
    background: #ff90884f;
    padding: 10px;
    color: #ff1100;
    text-align: center;
}
.bulk-selected-cart-popup .header {
    height: 35px;
}

.bulk-selected-cart-popup .cart-add-error-message span.var-comb-name {
    font-weight: 500;
}
.bulk-selected-cart-popup .bulk-card-add-message {
    text-align: center;
    font-size: 23px;
    padding: 20px;
}
.bulk-variation-selection-table .representation .color.variation-type {
    height: 30px;
    width: 30px;
}
.bulk-variation-widget-container .add-to-cart-button-bulk.button {
    width: 100%;
    text-align: center;
    padding: 15px;
    font-size: 18px;
    text-transform: uppercase;
}
/*Bulk variation design*/
.bulk-variation-widget-container {
    margin-bottom: 30px;
}
.bulk-variation-selection-table-wrapper {
    overflow-x: auto;
}
.bulk-variation-selection-table,
.bulk-variation-selection-table th,
.bulk-variation-selection-table td {
    border:none;
    text-align: center;
}
.bulk-variation-selection-table {
    min-width: 500px;
    border: none;
    background-color: #f7f7f7;
}
.bulk-variation-selection-table th {
    background-color: #e8e8e8;
    text-align: center;
    border-bottom: 1px #dbd9d9 solid;
}

.bulk-variation-selection-table td .stepper {
    float: none;
    display: inline-block;
    margin: 0;
}
.bulk-variation-widget-container span.representation {
    display: inline-block;
}
/*admin panel*/
.demo-bulk-variation-panel table {
    background-color: #fff;
}
.demo-bulk-variation-panel table input {
    border: 1px #ccc solid;
    padding: 6px;
    text-align: center;
}



.variation-color-selection-to-product-customise {
    display: flex;
    text-align: center;
    justify-content: center;
}

.variation-color-selection-to-product-customise .variation-value.color {
    height: 35px;
    width: 35px;
    margin: 2px;
    margin-right: 10px;
    cursor: pointer;
}


/* ========================== New Variation =========================== */
.widget-variation .advanced-variation-ui {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
.widget-variation .advanced-variation-ui > .representation .variation-option {
    border: 2px solid #ffffff;
    padding: 12px;
    border-radius: 50%;
    margin: 5px 5px 5px 0;
    box-shadow: 0 0 0 1px #ffffff;
}
.widget-variation .advanced-variation-ui > .representation .variation-option.selected-variation-value.image-view {
    border: none;
    padding: 0;
    border-radius: 0;
    margin: 2px;
    box-shadow: none;
}
.widget-variation .advanced-variation-ui > .representation .variation-option.text {
    border-radius: 0;
    background-color: #e6e6e6;
    color: #222;
}
.widget-variation .advanced-variation-ui > .representation .variation-option.selected {
    border: 2px solid #ffffff;
    padding: 12px;
    border-radius: 50%;
    margin: 5px 5px 5px 0;
    box-shadow: 0 0 0 1px #9d9d9d;
}
.widget-variation .advanced-variation-ui > .representation .variation-option.selected.selected-variation-value.image-view {
    border: 2px solid #000000;
    padding: 0;
    border-radius: 0;
    margin: 2px;
    box-shadow: none;
}
.widget-variation .advanced-variation-ui > .representation .variation-option.text.selected {
    border-radius: 0;
}
.widget-variation .cart-preview-panel .variation-combination-preview {
    display: flex;
    justify-content: space-between;
    margin: 10px 0 20px;
    font-size: 17px;
    font-weight: 500;
}
.widget-variation .cart-preview-panel .second-level-variation-type {
    margin-left: 6px;
}

.widget-variation .cart-preview-panel .size-guid a {
    color: #128fd8;
    text-decoration: underline;
    cursor: pointer;
}

.widget-variation .cart-preview-panel  .cart-preview-table {
    background-color: #f9f9f9;
    border-bottom: 1px #d8d6d6 solid;
    margin-bottom: 30px;
}
.widget-variation .cart-preview-panel  .cart-preview-table th,
.widget-variation .cart-preview-panel  .cart-preview-table td {
    padding: 5px 20px;
    text-align: left;
}
.widget-variation .cart-preview-panel  .cart-preview-table td {
    padding: 10px 20px;
}
.widget-variation .cart-preview-panel  .cart-preview-table th {
    padding: 10px 20px;
    border-bottom: 2px #e6e6e6 solid;
}
.widget-variation .cart-preview-panel  .cart-preview-table tr {}
.widget-variation .cart-preview-panel  .cart-preview-table tr:nth-child(odd) {
    background-color: #f5f5f5;
}
.widget-variation .cart-preview-panel  .cart-preview-table tr:nth-child(even) {
    background-color: #ffffff;
}
.widget-variation .cart-preview-panel  .cart-preview-table .stepper {
    float: none;
    margin: 0;
    display: inline-block;
}

.widget-variation .cart-preview-panel  .cart-preview-table .price-amount {
    font-size: 16px;
    font-weight: 500;
}
.widget-variation .cart-preview-panel .cart-preview-table .variation-option.text {
    color: #222;
    background: none;
    padding: 0;
}
.widget-variation .cart-preview-panel .cart-preview-table .variation-option.color-plate {
    height: 24px;
    width: 24px;
    padding: 0;
    border-radius: 50%;
}
.widget-variation .selected-variation-product {
    background-color: #f4f4f4;
    border: 1px #e0e0e0 solid;
    padding: 20px;
    position: relative;
    box-shadow: 2px 2px 0 0 rgba(0, 0, 0, .05);
}
.widget-variation .selected-variation-product .selected-product {
    position: relative;
    background-color: #ffffff;
    padding: 20px 64px 20px 20px;
    margin-bottom: 3px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
.widget-variation .selected-variation-product .remove-preview {
    position: absolute;
    top: 11px;
    right: 10px;
    font-size: 0;
    height: 32px;
    width: 32px;
    border: 1px #c7c7c7 solid;
    border-radius: 50%;
    cursor: pointer;
}
.widget-variation .selected-variation-product .remove-preview:after,
.widget-variation .selected-variation-product .remove-preview:before {
    content: "";
    height:1px;
    width: 15px;
    position: absolute;
    left: 7px;
    background-color: #666;
    top: 50%;
}

.widget-variation .selected-variation-product .remove-preview:after{
    transform: rotate(45deg)
}
.widget-variation .selected-variation-product .remove-preview:before {
    transform: rotate(-45deg);
}
.widget-variation .selected-variation-product .product-name {
    font-size: 18px;
    width: 100%;
}

.widget-variation .selected-variation-product .product-short-info {
    font-size: 16px;
    font-weight: 600;
    margin-right: 15px;
}

.widget-variation .selected-variation-product .product-sku-level {
    font-size: 14px;
    margin-right: 15px;
    flex: 1 1 auto;
}

.widget-variation .selected-variation-product .product-sku-level .product-sku {
    display: inline-block;
}

.widget-variation .selected-variation-product .selected-product-quantity {
    width: 100px;
    height: 40px;
    border: 1px #ccc solid;
    padding: 0 30px 0 30px;
    position: relative;
    text-align: center;
    line-height: 36px;
    display: flex;
    align-items: center;
    margin-left: auto;
    margin-top: 10px;
}
.widget-variation .selected-variation-product .selected-product-quantity span {
    width: 30px;
    height: 40px;
    position: absolute;
    font-size: 18px;
    font-weight: 600;
    cursor: pointer;
}

.widget-variation .selected-variation-product .selected-product-quantity span {
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.widget-variation .selected-variation-product .selected-product-quantity span.selected-variation-qty {
    width: 38px;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
}
.widget-variation .selected-variation-product .selected-product-quantity span.decrease-qty {
    left: 0
}

.widget-variation .selected-variation-product .selected-product-quantity span.increase-qty {
    right: 0
}
.widget-variation .selected-variation-product .preview-to-add-to-cart-button {
    font-size: 16px;
    padding: 10px 40px;
    font-weight: 600;
    color: #fff;
    margin-top: 15px;
}


.incomplete-info-for-variation-ui {
    padding: 30px;
    background-color: #fff;
}

.incomplete-info-for-variation-ui .header {
    background: none;
    padding: 0 0 20px;
    font-size: 22px;
    font-weight: 700;
    border-bottom: 1px #d8d8d8 solid;
}
.incomplete-info-for-variation-ui.popup .close-icon {
    position: absolute;
    top: 9px;
    right: 15px;
    font-size: 0;
    height: 32px;
    width: 32px;
    cursor: pointer;
}
.incomplete-info-for-variation-ui.popup .close-icon:before,
.incomplete-info-for-variation-ui.popup .close-icon:after {
    content: "";
    height: 1px;
    width: 15px;
    position: absolute;
    left: 7px;
    background-color: #666;
    top: 50%;
}
.incomplete-info-for-variation-ui.popup .close-icon:before {
    transform: rotate(-45deg);
}
.incomplete-info-for-variation-ui.popup .close-icon:after {
    transform: rotate(45deg);
}
.incomplete-info-for-variation-ui  .body {
    padding: 30px 0;
}

.incomplete-info-for-variation-ui .body h4.title {
    font-size: 18px;
    color: #4d4d4d;
}

.incomplete-info-for-variation-ui .form-row {
    margin: 0;
}
.incomplete-info-for-variation-ui .form-row ~ .form-row {
    padding-top: 20px
}
.incomplete-info-for-variation-ui .form-row label {
    width: 100%;
    display: block;
    padding-bottom: 5px;
    font-size: 14px;
    color: #222;
    font-weight: 500;
}
.incomplete-info-for-variation-ui .form-row textarea {
    width: 100%;
    height:120px;
    border: 1px #d8d8d8 solid;
    margin: 0;
    font-family: "Segoe UI", Verdana, Arial, sans-serif;
    color: #111111;
    font-size: 14px;
    padding: 5px 10px;
}

.incomplete-info-for-variation-ui .footer {
    background: none;
    padding: 20px 0 0 0;
    text-align: center;
}

.incomplete-info-for-variation-ui .footer .button {
    width: 150px;
    font-size: 16px;
    font-weight: 600;
    border-radius: 3px;
}
.incomplete-info-for-variation-ui .footer .button {
    background: #333;
    border: 2px #333 solid;
    color: #ffffff;
    transition: all 300ms ease-out 0s;
}
.incomplete-info-for-variation-ui .footer .button:hover {
    background: #000;
    border: 2px #000 solid;
}

.incomplete-info-for-variation-ui .footer .button.close-btn {
    background: none;
    border: 2px #505050 solid;
    color: #010101;
    line-height: 22px;
    margin: 0 3px;
}
.incomplete-info-for-variation-ui .footer .button.close-btn:hover {
    background: #333;
    border: 2px #333 solid;
    color: #fff;
    line-height: 22px;
    margin: 0 3px;
}
.incomplete-info-for-variation-ui input[type="file"] {
    height: 25px;
}
.product-block .advanced-variation-ui {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}
.product-block .advanced-variation-ui .representation {
    margin: 2px;
}
.product-block .parent-option.color-plate {
    height: 24px;
    width: 24px;
    border-radius: 50%;
    padding: 2px;
    border: 2px #ffffff solid;
    box-shadow: 0 0 1px 1px rgba(0,0,0,0);
}
.product-block .parent-option.color-plate.selected {
    box-shadow: 0 0 1px 1px rgba(0,0,0,.5);
}

.fee-app-tab-incomplete-data-cart-popup-wrapper {
    max-height: calc(100vh - 40px);
}
.fee-app-tab-incomplete-data-cart-popup-wrapper .body {
    max-height: calc(100vh - 190px);
    overflow-y: auto;
}
.selected-variation-value.image-view {
    width: 55px;
    height: 70px;
}
.option-cell.selected .selected-variation-value.image-view {
    border: 2px solid #000000;
}

.variation-container.fee-variation-container-wrapper {
    padding: 0 0 0 50%;
}
.variation-container.fee-variation-container-wrapper .selected-value-display-group {
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.variation-container.fee-variation-container-wrapper .selected-value-display-group .selected-value-display {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}
.variation-container.fee-variation-container-wrapper .selected-value-display-group .selected-value-display .selected-type-label {
    font-style: normal;
    font-weight: 400;
    font-size: 13px;
    line-height: 16px;
    color: #868E96;
}
.variation-container.fee-variation-container-wrapper .selected-value-display-group .selected-value-display .selected-option-label {
    font-style: normal;
    font-weight: 600;
    font-size: 13px;
    line-height: 16px;
    color: #171127;
}
.variation-container.fee-variation-container-wrapper .variation-radio-group {
    margin: 12px 0 0;
    padding: 0;
}
.variation-container.fee-variation-container-wrapper .variation-radio-group label {
    margin: 0 0 8px;
    display: inline-flex;
}
.variation-container.fee-variation-container-wrapper .variation-radio-group .variation-radio-option {
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 4px;
    margin: 0 0 10px;
    padding: 12px 10px;
    display: flex;
    gap: 8px;
    align-items: center;
    justify-content: flex-start;
}
.variation-container.fee-variation-container-wrapper .variation-radio-group .variation-radio-option input[type="radio"] {
    margin: 0;
    height: 16px;
    width: 16px;
    cursor: pointer;
}
.variation-container.fee-variation-container-wrapper .variation-radio-group .variation-radio-option label {
    margin: 0;
    width: 100%;
    cursor: pointer;
}

/*Data Type VIdeo*/
[data-style-type="video"] {
    position: relative;
}
.video-element-container video[data-style-type="video"],
.fee-widget-editable .video-element-container video[data-style-type="video"] {
    pointer-events: auto;
}
.video-element-container {
    position: relative;
    width: 100%;
}
.snippet-video-thumbnail {
    position: relative;
    z-index: 10501;
    cursor: pointer;
    display: block;
    line-height: 0;
    overflow: hidden;
}
.snippet-video-thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.snippet-video-play-icon {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none;
    z-index: 1;
    line-height: 0;
}
.snippet-video-play-icon img {
    display: block;
    width: 44px;
    height: 44px;
}
.wc-video-lightbox-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.85);
    z-index: 99999;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.3s ease;
}
.wc-video-lightbox-overlay.wc-video-lightbox-active {
    opacity: 1;
}
.wc-video-lightbox-overlay-content {
    position: relative;
    width: 90%;
    max-width: 960px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.wc-video-lightbox-video {
    width: 100%;
    max-height: calc(100vh - 100px);
    display: block;
}
.wc-video-lightbox-content {
    width: 100%;
    border-radius: 14px;
    overflow: hidden;
}
.wc-video-lightbox-close {
    position: absolute;
    top: 0;
    right: -50px;
    background: rgba(0, 0, 0, 0.4);
    border: none;
    color: #fff;
    font-size: 24px;
    cursor: pointer;
    width: 40px;
    height: 40px;
    padding: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: background 0.15s, transform 0.15s;
    line-height: 1;
    z-index: 3;
    margin: 0;
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}
.wc-video-lightbox-close:hover {
    background: rgb(255 255 255);
    color: #000;
}
@media only screen and (max-width: 1366px) {
    .wc-video-lightbox-close {
        top: -36px;
        right: 10px;
    }
}
.vs-player-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(0,0,0,0.15) 0%, rgba(0,0,0,0.45) 100%);
    transition: background 0.2s;
}
/* In editor mode the thumbnail must not intercept widget-level clicks until the widget is in edit mode */
body.fee-editor-active .snippet-video-thumbnail {
    pointer-events: none;
}
.video-element-container .video-item{
    display: inline-block;
    width: 100%;
    height: 100%;
}
.video-element-container .video-item .snippet-video-thumbnail,
.video-element-container .video-item video,
.video-element-container .video-item iframe {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
body.fee-editor-active .fee-widget-selected.fee-widget-editable .snippet-video-thumbnail {
    pointer-events: all;
    cursor: pointer;
}
.snippet-video-thumbnail img {
    width: 100%;
    height: 100% !important;
    object-fit: cover;
    object-position: center;
}

/* Newsletter*/

.newsletter .message-block.info-message {
    position: absolute;
    top: -47px;
}


.widget-newsletter .newsletter.custom-newsletter .fee-nl-row {
    display: flex;
    gap: 8px;
    align-items: end;
}
.widget-newsletter .newsletter.custom-newsletter .fee-nl-row .form-row {
    margin-bottom: 0;
    flex: 1 1 auto;
    min-width: 0;
}
.widget-newsletter .newsletter.custom-newsletter .fee-nl-row label {
    margin-bottom: 4px;
}
.widget-newsletter .newsletter.custom-newsletter .fee-nl-row .form-row.button-container {
    flex: 0 0 auto;
    margin: 0;
}
.widget-newsletter .newsletter.custom-newsletter button.newsletter-subscription.submit-button {
    height: 40px;
    padding: 6px 26px;
    border-radius: 4px;
    font-weight: 500;
    font-size: 14px;
    text-align: center;
    vertical-align: middle;
    display: inline-block;
}
/* Layout modes are placeholder-only — hide the field labels (keep the conditions checkbox label). */

/* Button on its own row, centered, beneath the fields. */
.widget-newsletter .newsletter.custom-newsletter .fee-nl-btn-below {
    margin-top: 40px;
    margin-bottom: 0;
    text-align: center;
}
.widget-newsletter .newsletter.custom-newsletter .fee-nl-btn-below .form-row {
    margin-bottom: 0;
}

/* conditions checkbox — its own line below the fields. Scoped to .newsletter so it also
   styles the floating-subscription popup (which is .newsletter but not .inplace, and renders
   outside .widget-newsletter). */
.widget-newsletter .newsletter.custom-newsletter  .newsletter-conditions-row {
    margin-top: 30px;
    margin-bottom: 0;
}
.widget-newsletter .newsletter.custom-newsletter  .newsletter-conditions-label {
    display: flex;
    align-items: center;
    gap: 7px;
    cursor: default;
    font-weight: normal;
    width: 100%;
    pointer-events: none;
}
.widget-newsletter .newsletter.custom-newsletter  .newsletter-conditions-text a {
    pointer-events: auto;
}
.widget-newsletter .newsletter.custom-newsletter  .newsletter-conditions-checkbox {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 20px;
    height: 20px;
    flex-shrink: 0;
    margin: 0;
    border: 2px solid #c9d0d8;
    border-radius: 4px;
    background-color: #fff;
    cursor: pointer;
    pointer-events: auto;
    position: relative;
    transition: border-color 0.15s ease, background-color 0.15s ease;
    vertical-align: middle;
}
.widget-newsletter .newsletter.custom-newsletter  .newsletter-conditions-checkbox:checked {
    background-color: #444;
    border-color: #444;
}
.widget-newsletter .newsletter.custom-newsletter  .newsletter-conditions-checkbox::after {
    content: '';
    position: absolute;
    display: none;
    left: 5px;
    top: 1px;
    width: 4px;
    height: 10px;
    border: 2px solid #fff;
    border-top: none;
    border-left: none;
    transform: rotate(45deg);
}
.widget-newsletter .newsletter.custom-newsletter .newsletter-conditions-checkbox:checked::after {
    display: block;
}
.widget-newsletter .newsletter.custom-newsletter  .newsletter-conditions-checkbox:focus-visible {
    outline: 2px solid #6b7280;
    outline-offset: 2px;
}
.widget-newsletter .newsletter.custom-newsletter  .newsletter-conditions-text {
    font-size: 16px;
    line-height: 1.4;
    color: #000;
}
.widget-newsletter .newsletter.custom-newsletter  .newsletter-conditions-text a {
    text-decoration: underline;
}
/* split layouts: widget title moves to the left, the form sits to its right */
.widget-newsletter:has(.newsletter.custom-newsletter.fee-nl-split) {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 24px;
    justify-content: center;
}
.widget-newsletter:has(.newsletter.custom-newsletter.fee-nl-split) > .widget-title-wrapper {
    flex: 1 1 200px;
    text-align: left !important;
    margin: 0;
}
.widget-newsletter:has(.newsletter.custom-newsletter.fee-nl-split) > .newsletter.custom-newsletter.fee-nl-split {
    flex: 1.2 1 280px;

}
/* layout2 + layout3: centered title above a centered form block */
.widget-newsletter:has(.newsletter.custom-newsletter.fee-nl-layout2) > .widget-title-wrapper,
.widget-newsletter:has(.newsletter.custom-newsletter.fee-nl-layout3) > .widget-title-wrapper {
    text-align: center !important;
}
.widget-newsletter .newsletter.custom-newsletter.fee-nl-layout2,
.widget-newsletter .newsletter.custom-newsletter.fee-nl-layout3 {
    max-width: 640px;
    margin-left: auto;
    margin-right: auto;
}
.widget-newsletter .newsletter.custom-newsletter.fee-nl-layout2 .fee-nl-row {
    justify-content: center;
}

/*Newsletter layout desing*/
.widget-newsletter .newsletter.custom-newsletter  input:is([type="text"], [type="email"]) {
    border: 1px solid #000000;
    width: 100%;
    max-width: 100%;
    border-radius: 4px;
    padding: 10px 12px;
    font-weight: 400;
    font-size: 14px;
    height: 40px;
    line-height: 1;
    display: block;
    box-sizing: border-box;
}
.widget-newsletter .newsletter.custom-newsletter  .form-row .errorlist {
    bottom: -22px;
}
.form-row.newsletter-conditions-row label.newsletter-conditions-label {
    width: auto;
}

/* ── Floating subscription popup redesign ────────────────────────────────── */

/* Strip popup-framework padding so our inner div controls all spacing */
.newsletter-floating-subscription-popup {
    padding: 0 !important;
    overflow: hidden;
    border-radius: 12px !important;
}
.newsletter-floating-subscription-popup .floating-subscription-popup {
    border-radius: 12px;
    overflow: hidden;
    background: #fff;
    min-width: 400px;
    max-width: 500px;
    width: 100%;
}

/* ── Dark teal header ── */
.newsletter-floating-subscription-popup .floating-subscription-popup > .header {
    background: #1d5068;
    padding: 24px 24px 28px;
    position: relative;
}

/* Envelope icon box */
.newsletter-popup-header-icon {
    width: 46px;
    height: 46px;
    background: rgba(255, 255, 255, 0.15);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
    color: #fff;
}
.floating-subscription-popup  .header {
    background: #004156;
    border-color: #004156;
}
.floating-subscription-popup button.newsletter-subscription.submit-button {
    width: 100%;
    height: 46px;
    border-radius: 8px;
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    text-align: center;
    vertical-align: middle;
}
.floating-subscription-popup button.newsletter-subscription.submit-button:hover {
    background: #343434;
}
/* X close button */
.newsletter-floating-subscription-popup .floating-subscription-popup > .header .close-popup {
    position: absolute;
    top: 14px;
    right: 16px;
    color: rgba(255, 255, 255, 0.75);
    cursor: pointer;
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 0;
    transition: background 0.12s;
}
.newsletter-floating-subscription-popup .floating-subscription-popup > .header .close-popup::after {
    content: '\00D7';
    font-size: 22px;
    line-height: 1;
    color: rgba(255, 255, 255, 0.85);
}
.newsletter-floating-subscription-popup .floating-subscription-popup > .header .close-popup:hover {
    background: rgba(255, 255, 255, 0.12);
}

/* Title and subtitle */
.newsletter-floating-subscription-popup .newsletter-subscription-popup-title-wrapper {
    margin-top: 0;
}
.newsletter-floating-subscription-popup .newsletter-subscription-popup-title-wrapper .title {
    color: #fff;
    font-size: 20px;
    font-weight: 600;
    margin: 0 0 8px;
    line-height: 1.3;
}
.newsletter-floating-subscription-popup .newsletter-subscription-popup-title-wrapper .sub-title {
    color: rgba(255, 255, 255, 0.72);
    font-size: 15px;
    margin: 0;
    line-height: 1.55;
    font-weight: normal;
}
.newsletter-floating-subscription-popup span.close-popup.close-icon {
    filter: brightness(0) invert(1);
}
.newsletter-floating-subscription-popup .form-row label {
    display: block;
    width: 100%;
    margin-bottom: 6px;
}
.newsletter-floating-subscription-popup .form-row {
    position: relative;
    margin-bottom: 16px;
    margin-top: 0;
}
.newsletter-floating-subscription-popup .body {
    background-color: #FFFFFF;
    padding: 25px 25px;
}
.newsletter-floating-subscription-popup .form-row input:is([type="text"], [type="email"]) {
    width: 100%;
    display: block;
    border: 1px solid #DDDDDD;
    height: 44px;
    padding: 12px;
    box-sizing: border-box;
    border-radius: 5px;
}
.form-row.newsletter-conditions-row label.newsletter-conditions-label {
    width: auto;
    display: flex;
    align-items: center;
    margin: 0;
}
.newsletter-floating-subscription-popup .form-row .errorlist {
    position: relative;
    bottom: inherit;
}
/* ── White form body ── */
.newsletter-floating-subscription-popup .floating-subscription-popup > .body {
    padding: 24px 24px 8px;
    background: #fff;
}
.newsletter-floating-subscription-popup .floating-subscription-popup > .body .form-row {
    margin-bottom: 16px;
}

/* Labels */
.newsletter-floating-subscription-popup .floating-subscription-popup .body .form-row label {
    display: block;
    font-size: 13px;
    font-weight: 500;
    color: #374151;
    margin-bottom: 6px;
}
.newsletter-floating-subscription-popup .floating-subscription-popup .body .form-row.mandatory label::after {
    content: ' *';
    color: #ef4444;
}

/* Inputs — !important overrides global WC input defaults */
.newsletter-floating-subscription-popup .floating-subscription-popup .body input:is([type="text"], [type="email"]) {
    width: 100% !important;
    box-sizing: border-box !important;
    border: 1px solid #d1d5db !important;
    border-radius: 6px !important;
    padding: 12px 14px !important;
    font-size: 14px !important;
    color: #374151 !important;
    background: #fff !important;
    outline: none !important;
    height: 46px !important;
    line-height: 1.4 !important;
    transition: border-color 0.15s !important;
    display: block !important;
    box-shadow: none !important;
}
.newsletter-floating-subscription-popup .floating-subscription-popup .body input:is([type="text"], [type="email"]):focus {
    border-color: #6b7280 !important;
    box-shadow: none !important;
}

/* ── Footer: full-width Subscribe button ── */
.newsletter-floating-subscription-popup .floating-subscription-popup > .popup-bottom.footer {
    padding: 8px 24px 24px;
    background: #fff;
}
.newsletter-floating-subscription-popup .floating-subscription-popup > .popup-bottom.footer .button-item {
    display: block;
}
.newsletter-floating-subscription-popup .floating-subscription-popup .newsletter-subscription.submit-button {
    width: 100%;
    background: #111827;
    color: #fff;
    border: none;
    border-radius: 6px;
    padding: 14px;
    font-size: 15px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s;
    display: block;
    text-align: center;
    line-height: 1;
}
.newsletter-floating-subscription-popup .floating-subscription-popup .newsletter-subscription.submit-button:hover {
    background: #374151;
}
.floating-subscription-popup {
    max-width: 580px;
}
.floating-subscription-popup .popup-bottom.footer {
    border: 0;
    background: #fff;
    padding: 0 25px 25px 25px;
}
.newsletter-floating-subscription-popup .newsletter-conditions-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    column-gap: 8px;
}
.newsletter-floating-subscription-popup .newsletter-conditions-row > .errorlist {
    flex-basis: 100%;
    order: 1;
    margin-top: 4px;
}
.newsletter-floating-subscription-popup .newsletter-conditions-label {
    display: flex;
    align-items: center;
    gap: 8px;
    cursor: default;
    font-weight: normal;
    pointer-events: none;
}
.newsletter-floating-subscription-popup .newsletter-conditions-label p {
    margin: 0;
}
.newsletter-floating-subscription-popup .newsletter-conditions-text a {
    pointer-events: auto;
}
.newsletter-floating-subscription-popup .newsletter-conditions-checkbox {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    width: 18px;
    height: 18px;
    min-width: 18px;
    flex-shrink: 0;
    margin: 0;
    border: 2px solid #c9d0d8;
    border-radius: 4px;
    background: #fff;
    cursor: pointer;
    pointer-events: auto;
    position: relative;
    transition: border-color 0.15s, background-color 0.15s;
}
.newsletter-floating-subscription-popup .newsletter-conditions-checkbox:checked {
    background-color: #6b7280;
    border-color: #6b7280;
}
.newsletter-floating-subscription-popup .newsletter-conditions-checkbox::after {
    content: '';
    position: absolute;
    display: none;
    left: 4px;
    top: 0px;
    width: 4px;
    height: 10px;
    border: 2px solid #fff;
    border-top: none;
    border-left: none;
    transform: rotate(45deg);
}
.newsletter-floating-subscription-popup .newsletter-conditions-checkbox:checked::after {
    display: block;
}

body.wc-ai-agent-generated-page button.Zebra_DatePicker_Icon.fee-identical-sewc-elm.Zebra_DatePicker_Icon_Inside {
    opacity: 0;
}

.widget-newsletter .message-block.error-message,
.widget-newsletter .message-block.success-message {
    position: absolute;
    top: -48px;
    width: auto;
}
 /*product page previous page button design*/
.widget-productName .previous-page {
    font-size: 16px;
    font-weight: 500;
    padding: 10px 15px;
    border: 2px #000 solid;
    display: inline-block;
    margin-bottom: 20px;
    cursor: pointer;
    transition: all 300ms ease-out 0s;
}
.widget-productName .previous-page:hover {
    border: 2px #000 solid;
    background-color: #000000;
    color: #ffffff;
}

.widget-productName .previous-page i {
    font-size: 14px;
    margin-right: 5px;

}
 .form-row .pass-input-wrapper {
    display: block;
    position: relative;
}
.form-row .pass-input-wrapper input {
    padding: 10px 35px 10px 15px;
}

.form-row .pass-input-wrapper .toggle-password {
    font-size: 0;
    width: 32px;
    height: 40px;
    position: absolute;
    right: 0;
    top: 0;
    z-index: 21;
    cursor: pointer;
    background-repeat: no-repeat;
    background-size: 26px;
    background-position: center;
}

.form-row .pass-input-wrapper .toggle-password.hide {
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath%20d%3D%22M17.703%205L15.1935%207.35275C14.241%207.03175%2013.179%206.8285%2012.0113%206.8285C6.3345%206.8285%203%2011.7417%203%2011.7417C3%2011.7417%204.446%2013.955%206.8595%2015.5952L4.67625%2017.777L5.73675%2018.8375L18.7642%206.06125L17.703%205ZM13.191%209.33425C10.725%208.2445%208.18025%2010.7652%209.24225%2013.2387L7.94775%2014.519C6.58725%2013.649%205.529%2012.5315%204.90275%2011.774C6.0225%2010.538%208.5155%208.3285%2012.0113%208.3285C12.7065%208.3285%2013.3582%208.41775%2013.9688%208.56475L13.191%209.33425ZM11.0287%2014.9075L14.8463%2011.1628C15.609%2013.496%2013.344%2015.713%2011.0287%2014.9075ZM21%2011.7417C21%2011.7417%2017.811%2017.3285%2012.0113%2017.3285C10.977%2017.3285%2010.0147%2017.1103%209.123%2016.7758L10.3335%2015.5885C10.8697%2015.7333%2011.427%2015.8285%2012.0113%2015.8285C15.6045%2015.8285%2018.0892%2013.1832%2019.1392%2011.8055C18.5925%2011.189%2017.6722%2010.313%2016.449%209.5915L17.5657%208.4965C19.8022%209.9215%2021%2011.7417%2021%2011.7417Z%22%20fill%3D%22%23696969%22%2F%3E %3C%2Fsvg%3E");
}
.form-row .pass-input-wrapper .toggle-password.show {
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath%20d%3D%22M12.0113%208.5C15.5745%208.5%2018.0585%2010.759%2019.1392%2011.977C18.0885%2013.3547%2015.6045%2016%2012.0113%2016C8.69625%2016%206.06375%2013.348%204.90275%2011.9448C6.0225%2010.7095%208.5155%208.5%2012.0113%208.5ZM12.0113%207C6.3345%207%203%2011.9132%203%2011.9132C3%2011.9132%206.62625%2017.5%2012.0113%2017.5C17.811%2017.5%2021%2011.9132%2021%2011.9132C21%2011.9132%2017.7818%207%2012.0113%207ZM12%2012.25L9.48%2010.6218C9.17625%2011.0905%209%2011.65%209%2012.25C9%2013.9068%2010.3432%2015.25%2012%2015.25C13.6568%2015.25%2015%2013.9068%2015%2012.25C15%2010.5932%2013.6568%209.25%2012%209.25C11.4435%209.25%2010.9215%209.4015%2010.4753%209.6655L12%2012.25Z%22%20fill%3D%22%23696969%22%2F%3E %3C%2Fsvg%3E");
}

 body > .header,
body > .footer {
    position: relative;
}

.v-split.grid-block > .grid-block {
    height: auto !important;
}
.fee-fixed-width-row {
    max-width: 1172px;
    margin: 0 auto
}

/*V2 for product Start*/
.import-mapping-form .clickable-select-fields {
    color: #008DF2;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 16px;
    text-decoration-line: underline;
    cursor: pointer;
}
.import-mapping-form .fee-select-path-icon input[type="text"] {
    background-image: url(../../images/front-end-editor/folder.svg);
    background-size: 16px;
    background-repeat: no-repeat;
    background-position: calc(100% - 8px) center;
    padding-right: 30px;
}
.item-import-for-editor .import-status.total {
    padding: 32px 20px 0;
}
.item-import-for-editor .total-progress {}
.item-import-for-editor .total-progress .progress-bar {
    width: 100%;
    height: 24px;
    border-radius: 30px;
    background: #F0F3F4;
}
.item-import-for-editor .total-progress .progress-bar .completed {
    background: #0DC15C;
    height: 24px;
    border-radius: 30px;
}
.fee-task-details-item-import-table {}
.fee-task-details-item-import-table th::after {
    display: none;
}
.fee-task-details-item-import-table .success-header,
.fee-task-details-item-import-table .category-success-count {
    color: #0DC15C;
}
.fee-task-details-item-import-table .error-header,
.fee-task-details-item-import-table .category-error-count {
    color: #FB3030;
}
.fee-task-details-item-import-table .cell-warning-header,
.fee-task-details-item-import-table .category-warning-count {
    color: #FF9F40;
}
.item-import-for-editor .button-line {
    text-align: center;
    padding: 4px 0 32px;
}
.item-import-for-editor .button-line .download-button {
    color: #008DF2;
    text-align: center;
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 16px;
    text-decoration-line: underline;
}
.se-product-create-edit-form .file-selection-queue .file-remove {
    background-position: center !important;
    top: 50%;
    transform: translateY(-50%);
}

.se-product-create-edit-form .multiple-video-queue {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    margin-top: 10px;
    gap: 5px;
}
.se-product-create-edit-form .spec-file-block {
    position: relative;
    border: 1px #ddd solid;
    padding: 10px 24px 10px 10px;
    border-radius: 5px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    gap: 10px;
    margin-top: 10px;
}
.se-product-create-edit-form .spec-file-block .tool-icon.remove {
    margin-left: auto;
}
#bmui-tab-manage-blog-post .toolbar.toolbar-left .search-text,
#bmui-tab-manage-blog-category .toolbar.toolbar-left .search-text,
#bmui-tab-manage-blog-comment .toolbar.toolbar-left .search-text,
#bmui-tab-manage-product .toolbar.toolbar-left .search-text,
#bmui-tab-manage-category .toolbar.toolbar-left .search-text {
    width: 250px !important;
}
.page-seo-config .bmui-tab-panel {
    padding-right: 20px;
}
.fee-create-edit-form .form-section-info h3 {
    color: #008DF2;
    font-size: 18px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px;
    margin: 0 0 15px;
}
.fee-top-view .fee-am-left .fee-identical-sewc-elm {
    display: inline-flex;
    width: auto;
    min-width: unset;
    align-items: center;
}
.chosen-container .chosen-single div b {
    display: none;
}
.form-row .Zebra_DatePicker_Icon_Wrapper {
    width: 100%;
}
.form-row .Zebra_DatePicker_Icon_Wrapper input {
    width: 100%;
}
/*V2 for product End*/

/*Utility*/
.bg-none {
    background: none !important;
}

@keyframes fee-draft-pulse {
    0%   { box-shadow: 0 0 0 0 rgba(234, 67, 53, 0.5); }
    50%  { box-shadow: 0 0 0 4px rgba(234, 67, 53, 0.3); }
    100% { box-shadow: 0 0 0 0 rgba(234, 67, 53, 0); }
}
.fee-draft-highlight {
    border-color: #ea4335 !important;
    animation: fee-draft-pulse 0.6s ease 2;
}

/* ─── Common plugin setup page ─────────────────────────────────────────── */
.common-plugin-setup-page {
    height: 100%;
    display: flex;
    flex-direction: column;
    background: #eef0f1;
    max-width: 930px;
    margin: 0 auto;
}
/* Header */
.common-plugin-setup-page .cpsp-header {
    background: #fff;
    border-radius: 15px;
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 10px 20px;
}
.common-plugin-setup-page .cpsp-back-btn {
    width: 24px;
    height: 24px;
    cursor: pointer;
    display: grid;
    place-items: center;
    color: #000;
    font-size: 16px;
    flex-shrink: 0;
}
.common-plugin-setup-page .cpsp-back-btn.is-disabled {
    opacity: 0.5;
    cursor: default;
}
.common-plugin-setup-page .cpsp-header-text {
    flex: 1;
}
.common-plugin-setup-page .cpsp-header-title {
    font-size: 20px;
    line-height: 30px;
    font-weight: 600;
    color: #000;
}
.common-plugin-setup-page .cpsp-header-subtitle {
    font-size: 12px;
    line-height: 16px;
    color: #4F4F4F;
}
.common-plugin-setup-page .cpsp-next-btn {
    font-weight: 600;
    font-size: 14px;
    line-height: 20px;
    height: 36px;
    padding: 8px 22px;
    border-radius: 50px;
    border: 1px solid transparent;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    background: #008DF2;
    color: #fff;
}
/* Body layout */
.common-plugin-setup-page .cpsp-body {
    flex: 1;
    display: flex;
    min-height: 0;
    margin-top: 20px;
}
.common-plugin-setup-page .cpsp-inner {
    flex: 1;
    background: #fff;
    border-radius: 15px;
    display: flex;
    min-height: 0;
    overflow: hidden;
}
/* Stepper */
.common-plugin-setup-page .cpsp-stepper {
    width: 244px;
    border-right: 1px solid #ddd;
    padding: 18px;
    flex-shrink: 0;
}
.common-plugin-setup-page .cpsp-step {
    position: relative;
}
.common-plugin-setup-page .cpsp-step--has-line {
    padding-bottom: 26px;
}
.common-plugin-setup-page .cpsp-step-line {
    position: absolute;
    left: 25px;
    top: 59px;
    height: 24px;
    width: 2px;
    background: #ddd;
}
.common-plugin-setup-page .cpsp-step.is-complete .cpsp-step-line {
    background: rgba(0, 201, 80, 0.5);
}
.common-plugin-setup-page .cpsp-step-inner {
    display: flex;
    gap: 12px;
    align-items: center;
    cursor: pointer;
    padding: 10px 14px;
    border-radius: 10px;
    border: 1px solid transparent;
}
.common-plugin-setup-page .cpsp-step.is-active .cpsp-step-inner {
    border-color: #2B7FFF;
    background: #EFF6FF;
}
.common-plugin-setup-page .cpsp-step-dot {
    width: 24px;
    height: 24px;
    border-radius: 100px;
    flex-shrink: 0;
    display: grid;
    place-items: center;
    z-index: 1;
    background: #F0F3F4;
    color: #828282;
}
.common-plugin-setup-page .cpsp-step-dot svg { display: block; }
.common-plugin-setup-page .cpsp-step.is-active .cpsp-step-dot {
    background: #008DF2;
    color: #fff;
    border: none;
}
.common-plugin-setup-page .cpsp-step.is-active .cpsp-step-dot path { fill: #fff; }
.common-plugin-setup-page .cpsp-step.is-complete .cpsp-step-dot {
    background: #22C55E;
    color: #fff;
    border: none;
}
.common-plugin-setup-page .cpsp-step.is-complete .cpsp-step-inner {
    border-color: rgba(13, 193, 92, 0.1);
    background: rgba(13, 193, 92, 0.1);
}
.common-plugin-setup-page .cpsp-step.is-complete .cpsp-step-title {
    color: #000000;
}
.common-plugin-setup-page .cpsp-step.is-complete .cpsp-step-subtitle {
    color: #4F4F4F;
}
.common-plugin-setup-page .cpsp-step-text {
    padding-top: 1px;
}
.common-plugin-setup-page .cpsp-step-title {
    margin: 0;
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    color: #828282;
}
.common-plugin-setup-page .cpsp-step.is-active .cpsp-step-title {
    color: #000;
}
.common-plugin-setup-page .cpsp-step-subtitle {
    font-size: 12px;
    font-weight: 400;
    color: #BDBDBD;
    line-height: 16px;
}
.common-plugin-setup-page .cpsp-step.is-active .cpsp-step-subtitle {
    color: #828282;
}
/* Content area */
.common-plugin-setup-page .cpsp-content {
    flex: 1;
    min-width: 0;
}
/* Panel header */
.common-plugin-setup-page .cpsp-panel-header {
    padding: 16px 20px;
    border-bottom: 1px solid #F0F3F4;
}
.common-plugin-setup-page .cpsp-panel-body {
    overflow-y: auto;
    max-height: calc(100vh - 252px);
    padding: 20px;
}
.common-plugin-setup-page .cpsp-panel-title {
    font-size: 16px;
    line-height: 22px;
    font-weight: 600;
    color: #1A1A1A;
    margin: 0;
}
.common-plugin-setup-page .cpsp-panel-subtitle {
    font-size: 12px;
    line-height: 16px;
    font-weight: 400;
    color: #828282;
    margin: 0;
}
/* Section rows (icon + title/desc) */
.common-plugin-setup-page .cpsp-section-row {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    margin-bottom: 12px;
}
.common-plugin-setup-page .cpsp-section-icon {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: #F0F3F4;
    display: grid;
    place-items: center;
    color: #4F4F4F;
    flex-shrink: 0;
}
.common-plugin-setup-page .cpsp-section-title {
    font-size: 14px;
    line-height: 20px;
    font-weight: 600;
    color: #000;
}
.common-plugin-setup-page .cpsp-section-desc {
    font-size: 12px;
    line-height: 16px;
    color: #828282;
}
/* Shared box */
.common-plugin-setup-page .cpsp-box {
    background: #F9FAFB;
    border-radius: 14px;
}
.common-plugin-setup-page .cpsp-box--scopes {
    padding: 20px;
    margin-bottom: 24px;
}
.common-plugin-setup-page .cpsp-scope-wrap {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.common-plugin-setup-page .cpsp-scope-wrap .cpsp-scope-row:last-child {
    border-bottom: none;
}
.common-plugin-setup-page .cpsp-box--sync-list {
    padding: 4px 16px;
}
.common-plugin-setup-page .cpsp-box--mapping {
    padding: 18px 20px;
}
.common-plugin-setup-page .cpsp-box--audience {
    padding: 16px 18px;
    margin-bottom: 16px;
}
.common-plugin-setup-page .cpsp-box--global-toggles {
    padding: 4px 18px;
}
/* Direction rows */
.common-plugin-setup-page .cpsp-direction-row {
    display: flex;
    align-items: flex-start;
    gap: 2px;
    flex-direction: column;
    margin: 0 0 12px;
}
.common-plugin-setup-page .cpsp-direction-label {
    font-size: 12px;
    line-height: 16px;
    font-weight: 600;
    color: #000;
}
.common-plugin-setup-page .cpsp-direction-hint {
    font-size: 12px;
    line-height: 16px;
    color: #828282;
}
/* Scope rows */
.common-plugin-setup-page .cpsp-scope-row {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 0;
    font-size: 14px;
    color: #000;
}
.common-plugin-setup-page .cpsp-scope-row .fee-info-tooltip {
    margin: 0;
}
.common-plugin-setup-page .cpsp-scope-label {
    display: flex;
    align-items: center;
    gap: 10px;
    cursor: pointer;
}
.common-plugin-setup-page .cpsp-scope-box {
    width: 16px;
    height: 16px;
    border-radius: 5px;
    display: grid;
    place-items: center;
    flex-shrink: 0;
    border: 1.5px solid #c4cad0;
    background: #fff;
}
.common-plugin-setup-page .cpsp-scope-box svg {
    display: none;
}
.common-plugin-setup-page .cpsp-scope-box.is-checked {
    border-color: #008DF2;
    background: #008DF2;
}
.common-plugin-setup-page .cpsp-scope-box.is-checked svg {
    display: block;
}
.common-plugin-setup-page .cpsp-scope-info {
    width: 15px;
    height: 15px;
    border-radius: 50%;
    border: 1.3px solid #b6bdc4;
    color: #8a9099;
    font-size: 10px;
    font-weight: 600;
    font-style: italic;
    display: grid;
    place-items: center;
    cursor: help;
    font-family: Georgia, serif;
}
.common-plugin-setup-page .cpsp-divider {
    height: 1px;
    background: #F0F3F4;
    margin: 20px 0;
}
/* Sync items */
.common-plugin-setup-page .cpsp-sync-item {
    padding: 14px 0;
}
.common-plugin-setup-page .cpsp-sync-item--bordered {
    border-bottom: 1px solid #eaeaea;
}
.common-plugin-setup-page .cpsp-sync-item-inner {
    display: flex;
    align-items: center;
    gap: 14px;
}
.common-plugin-setup-page .cpsp-sync-text {
    flex: 1;
}
.common-plugin-setup-page .cpsp-sync-title {
    font-size: 14px;
    font-weight: 600;
    color: #000;
}
.common-plugin-setup-page .cpsp-sync-desc {
    font-size: 13px;
    color: #828282;
    margin-top: 1px;
}
/* Toggle */
.common-plugin-setup-page .cpsp-toggle {
    width: 32px;
    height: 16px;
    border-radius: 999px;
    flex-shrink: 0;
    background: #bdbdbd;
    position: relative;
    cursor: pointer;
    transition: background .15s;
}
.common-plugin-setup-page .cpsp-toggle.is-on {
    background: #008DF2;
}
.common-plugin-setup-page .cpsp-toggle-knob {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #fff;
    transition: left .15s;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
}
.common-plugin-setup-page .cpsp-toggle.is-on .cpsp-toggle-knob {
    left: 18px;
}
/* Toggle options */
.common-plugin-setup-page .cpsp-toggle-opts {
    display: flex;
    gap: 22px;
    margin: 12px 0 2px 52px;
    flex-wrap: wrap;
}
.common-plugin-setup-page .cpsp-toggle-opts.is-hidden {
    display: none;
}
.common-plugin-setup-page .cpsp-toggle-opt {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 13px;
    color: #4f4f4f;
}
.common-plugin-setup-page .cpsp-toggle-opt-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #0dc15c;
}
/* ── Common radio-group cards (setup wizard) ──────────────────────────────────
   One bordered radio-row design used by BOTH:
   - JS-toggled cards (no native input) → active via .is-active
   - native radio rows (<label><input type=radio>…) → active via :has(input:checked)
   Markup: .cpsp-radio-cards > .cpsp-radio-card [> .cpsp-radio-card__dot | <input radio>]
           > .cpsp-radio-card__text > .cpsp-radio-card__title + .cpsp-radio-card__desc */
.common-plugin-setup-page .cpsp-radio-cards {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 18px;
}
.common-plugin-setup-page .cpsp-radio-card {
    display: flex;
    align-items: center;
    gap: 12px;
    border: 1px solid #F0F3F4;
    background: #fff;
    border-radius: 10px;
    padding: 12px 16px;
    cursor: pointer;
    margin: 0;
}
.common-plugin-setup-page .cpsp-radio-card.is-active,
.common-plugin-setup-page .cpsp-radio-card:has(input:checked) {
    border-color: #F0F3F4;
    background: #F6F6F7;
}
/* Native radio (radio-input rows) — the indicator itself */
.common-plugin-setup-page .cpsp-radio-card > input[type="radio"] {
    flex-shrink: 0;
    margin: 0;
    cursor: pointer;
}
/* Custom dot indicator (JS-toggled cards that have no native input) */
.common-plugin-setup-page .cpsp-radio-card__dot {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 1px solid #BDBDBD;
    background: #fff;
    flex-shrink: 0;
    position: relative;
}
.common-plugin-setup-page .cpsp-radio-card.is-active .cpsp-radio-card__dot {
    border-color: #008DF2;
}
.common-plugin-setup-page .cpsp-radio-card.is-active .cpsp-radio-card__dot::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #008DF2;
}
.common-plugin-setup-page .cpsp-radio-card__text {
    flex: 1;
    min-width: 0;
}
.common-plugin-setup-page .cpsp-radio-card__title {
    display: block;
    font-size: 12px;
    line-height: 16px;
    font-weight: 600;
    color: #000;
}
.common-plugin-setup-page .cpsp-radio-card__desc {
    display: block;
    font-size: 12px;
    color: #828282;
    margin-top: 2px;
}
.common-plugin-setup-page .cpsp-field-label {
    font-size: 12px;
    font-weight: 600;
    color: #4f4f4f;
    margin-bottom: 6px;
}
.common-plugin-setup-page .cpsp-field-note {
    font-size: 13px;
    color: #4f4f4f;
    margin-top: 18px;
}
.common-plugin-setup-page .cpsp-radio-group {
    display: flex;
    gap: 18px;
    margin-top: 8px;
    flex-wrap: wrap;
}
.common-plugin-setup-page .cpsp-radio {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: #4f4f4f;
    cursor: pointer;
}
.common-plugin-setup-page .cpsp-radio input {
    accent-color: #008DF2;
}
/* Recommended mappings (Export / Import step) */
.common-plugin-setup-page .cpsp-recommended {
    display: flex;
    align-items: center;
    gap: 12px;
    border-radius: 10px;
    padding: 14px 16px;
}
/* Slider-style toggle: a label.cpsp-toggle wrapping a hidden checkbox + .cpsp-toggle-slider.
   Reuses the .cpsp-toggle track; the slider is the knob and the :checked state drives it. */
.common-plugin-setup-page label.cpsp-toggle {
    display: inline-block;
}
.common-plugin-setup-page .cpsp-toggle input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
    margin: 0;
}
.common-plugin-setup-page .cpsp-toggle-slider {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #fff;
    transition: left .15s;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
}
.common-plugin-setup-page .cpsp-toggle:has(input[type="checkbox"]:checked) {
    background: #008DF2;
}
.common-plugin-setup-page .cpsp-toggle input[type="checkbox"]:checked ~ .cpsp-toggle-slider {
    left: 18px;
}
.common-plugin-setup-page .cpsp-recommended-info {
    flex: 1;
    min-width: 0;
}
.common-plugin-setup-page .cpsp-recommended-title {
    margin: 0;
    font-size: 14px;
    font-weight: 600;
    color: #000;
}
.common-plugin-setup-page .cpsp-recommended-desc {
    margin: 2px 0 0;
    font-size: 13px;
    line-height: 18px;
    color: #828282;
}
/* Info bar: mapping count + "Review all mappings" link */
.common-plugin-setup-page .cpsp-recommended-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 12px;
    padding: 10px 16px;
    background: #f5f9ff;
    border-radius: 8px;
    font-size: 13px;
    color: #4f4f4f;
}
.common-plugin-setup-page .cpsp-recommended-bar strong {
    font-weight: 600;
    color: #000;
}
.common-plugin-setup-page .cpsp-review-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #008DF2;
    font-size: 13px;
    text-decoration: none;
    cursor: pointer;
    white-space: nowrap;
}
.common-plugin-setup-page .cpsp-review-link:hover {
    text-decoration: underline;
}
.common-plugin-setup-page .cpsp-review-icon {
    display: inline-flex;
    align-items: center;
}
/* Tracked events wrapper */
.common-plugin-setup-page .cpsp-te-wrap {
    margin-top: 28px;
}
/* MailChimp Tracked Events block — shared by the setup wizard and the Settings
   section, so it is intentionally NOT scoped to .common-plugin-setup-page. */
.mc-te-block .mc-te-head {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin: 0 0 8px;
}
.mc-te-block .mc-te-head-icon {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    background: #f0f3f4;
    display: grid;
    place-items: center;
    color: #4f4f4f;
    flex-shrink: 0;
}
.mc-te-block .mc-te-head-text {
    flex: 1;
}
.mc-te-block .mc-te-head-title {
    font-size: 15px;
    font-weight: 600;
    color: #000;
}
.mc-te-block .mc-te-head-desc {
    font-size: 13px;
    color: #828282;
}
.mc-te-block .mc-te-master-wrap {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-shrink: 0;
    padding-top: 4px;
}
.mc-te-block .mc-te-master-label {
    font-size: 12px;
    font-weight: 600;
    color: #4f4f4f;
}
/* Pill toggle (32x16) — JS sets background/knob inline on click; these rules
   provide the base look and the initial on-state via .is-on. */
.mc-te-block .mc-te-switch {
    width: 32px;
    height: 16px;
    border-radius: 999px;
    flex-shrink: 0;
    background: #bdbdbd;
    position: relative;
    cursor: pointer;
    transition: background .15s;
}
.mc-te-block .mc-te-switch.is-on {
    background: #008DF2;
}
.mc-te-block .mc-toggle-knob {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #fff;
    transition: left .15s;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
}
.mc-te-block .mc-te-switch.is-on .mc-toggle-knob {
    left: 18px;
}
/* Klaviyo settings standalone toggle (32x16, is-on driven) */
.klv-set-toggle {
    width: 32px;
    height: 16px;
    border-radius: 999px;
    flex-shrink: 0;
    background: #bdbdbd;
    position: relative;
    cursor: pointer;
    transition: background .15s;
}
.klv-set-toggle.is-on {
    background: #008DF2;
}
.klv-set-toggle .klv-toggle-knob {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #fff;
    transition: left .15s;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
}
.klv-set-toggle.is-on .klv-toggle-knob {
    left: 18px;
}
/* Events card */
.mc-te-block .mc-te-events {
    background: #F9FAFB;
    border-radius: 14px;
    padding: 6px 16px;
}
.mc-te-block .mc-te-events.is-dimmed {
    opacity: .5;
}
.mc-te-block .mc-te-row {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 2px;
}
.mc-te-block .mc-te-row--bordered {
    border-bottom: 1px solid #eaeaea;
}
.mc-te-block .mc-te-row-text {
    flex: 1;
    min-width: 0;
}
.mc-te-block .mc-te-row-title {
    font-size: 14px;
    font-weight: 600;
    color: #000;
}
.mc-te-block .mc-te-row-desc {
    font-size: 12px;
    color: #828282;
    margin-top: 1px;
}
.mc-te-block .mc-te-note {
    font-size: 12px;
    color: #828282;
    margin-top: 8px;
}
/* ─── Common plugin settings section (dashboard → Settings) ─────────────────
   Shared layout for a plugin's Settings page: a stack of white cards, each with
   an icon + title/desc header, setting rows, and the account/disconnect row.
   Reusable across plugins; JS toggle hooks (.mc-set-toggle / .mc-toggle-knob)
   are kept on the markup. */
.common-plugin-settings {
    padding: 10px;
    max-width: 680px;
    margin: 0 auto;
}
.common-plugin-settings .cps-card {
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 14px;
    padding: 25px;
    margin-bottom: 20px;
}
.common-plugin-settings .cps-card:last-child {
    margin-bottom: 0;
}
.common-plugin-settings .cps-card-head {
    display: flex;
    align-items: flex-start;
    gap: 15px;
    margin-bottom: 20px;
}
.common-plugin-settings .cps-card-icon {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: #F0F3F4;
    display: grid;
    place-items: center;
    color: #4F4F4F;
    flex-shrink: 0;
}
.common-plugin-settings .cps-card-head-text {
    flex: 1;
}
.common-plugin-settings .cps-card-title {
    font-size: 18px;
    font-weight: 600;
    color: #000;
    line-height: 24px;
    margin: 0 0 2px;
}
.common-plugin-settings .cps-card-desc {
    font-size: 12px;
    color: #828282;
    margin-top: 2px;
    line-height: 16px;
}
/* Setting row — toggle (left) + text, matching the Tracked Events row style */
.common-plugin-settings .cps-setting-row {
    display: flex;
    align-items: center;
    gap: 12px;
}
.common-plugin-settings .cps-setting-text {
    flex: 1;
    min-width: 0;
}
.common-plugin-settings .cps-setting-title {
    font-size: 14px;
    font-weight: 600;
    color: #000;
}
.common-plugin-settings .cps-setting-desc {
    font-size: 12px;
    color: #828282;
    line-height: 18px;
    margin-top: 1px;
}
/* Toggle (32×16) — matches the Tracked Events switch. JS (.mc-set-toggle) sets
   background/knob inline on click; .is-on drives the initial render. */
.common-plugin-settings .cps-toggle {
    width: 32px;
    height: 16px;
    border-radius: 999px;
    flex-shrink: 0;
    background: #bdbdbd;
    position: relative;
    cursor: pointer;
    transition: background .15s;
}
.common-plugin-settings .cps-toggle.is-on {
    background: #008DF2;
}
.common-plugin-settings .cps-toggle .mc-toggle-knob {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #fff;
    transition: left .15s;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
}
.common-plugin-settings .cps-toggle.is-on .mc-toggle-knob {
    left: 18px;
}
/* Account / disconnect row */
.common-plugin-settings .cps-account-row {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
    border: 1px solid #ddd;
    border-radius: 5px;
    background: #fafbfc;
}
.common-plugin-settings .cps-account-icon {
    width: 36px;
    height: 36px;
    border-radius: 9px;
    background: #ffe01b;
    display: grid;
    place-items: center;
    flex-shrink: 0;
}
.common-plugin-settings .cps-account-info {
    flex: 1;
}
.common-plugin-settings .cps-account-email {
    font-size: 14px;
    font-weight: 600;
    color: #000;
}
.common-plugin-settings .cps-account-meta {
    font-size: 12px;
    color: #828282;
    margin-top: 2px;
}
.common-plugin-settings .cps-disconnect-btn, .common-plugin-settings .cps-disconnect-btn:focus, .common-plugin-settings .cps-disconnect-btn:active {
    font-weight: 600;
    font-size: 14px;
    line-height: 20px;
    height: 30px;
    padding: 5px 16px;
    border-radius: 50px;
    border: 1px solid #eb0012;
    cursor: pointer;
    background: transparent;
    color: #eb0012;
}
.common-plugin-settings .cps-disconnect-btn:hover {
    background: #eb0012;
    border-color: #eb0012;
    color: #ffffff;
}

/* ==========================================================================
   Common plugin LIST page (cpl-*) — title+count, toolbar (search/filter/
   actions), bordered rounded table, pagination. Shared across all plugin data
   pages (Customers, Groups, Products, Orders, Sync history, …). The mc-* hooks
   on the markup are kept for JS; cpl-* classes only drive the visuals.
   ========================================================================== */
.common-plugin-list {
    padding: 10px;
}
/* Title + counter (matches core Orders .entity-count.title) */
.common-plugin-list .cpl-head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 16px;
}
.common-plugin-list .cpl-title {
    font-size: 25px;
    font-weight: 600;
    color: #000;
    line-height: 32px;
}
.common-plugin-list .cpl-count {
    display: inline-flex;
    align-items: center;
    font-size: 14px;
    color: #828282;
    line-height: 20px;
}
.common-plugin-list .cpl-count::before {
    content: "";
    display: inline-block;
    width: 1px;
    height: 20px;
    background: #BDBDBD;
    margin-right: 10px;
}
/* Toolbar: search + filter + right-aligned action buttons */
.common-plugin-list .cpl-toolbar {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 16px;
    flex-wrap: wrap;
}
.common-plugin-list .cpl-search {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 250px;
    height: 36px;
    padding: 0 12px 0 0;
    margin: 0;
    background: #fff;
    border: 1px solid #BDBDBD;
    border-radius: 60px;
    font-size: 14px;
    line-height: 20px;
    color: #000;
}
.common-plugin-list .cpl-search-icon {
    display: inline-flex;
    align-items: center;
    color: #828282;
    flex-shrink: 0;
}
/* Icon is a submit <button class="icon-search"> (WC search-form structure):
   strip the admin button chrome + sprite, keep the inline SVG. Higher specificity
   than the global .search-form .icon-search admin rule so it always wins. */
.common-plugin-list .cpl-search .icon-search {
    border: 0;
    background: none;
    padding: 0;
    margin: 0;
    height: auto;
    float: none;
    line-height: 0;
    cursor: pointer;
    color: #828282;
}
.common-plugin-list .cpl-search .icon-search:before {
    display: none;
}
.common-plugin-list .cpl-search-icon svg {
    width: 16px;
    height: 16px;
}
.common-plugin-list .cpl-search input {
    flex: 1;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
    font: inherit;
    color: inherit;
    box-shadow: none;
}
.common-plugin-list .cpl-select {
    position: relative;
    min-width: 170px;
}
.common-plugin-list .cpl-select select {
    width: 100%;
    height: 36px;
    padding: 0 36px 0 16px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: #fff;
    border: 1px solid #BDBDBD;
    border-radius: 50px;
    font-size: 14px;
    color: #000;
    cursor: pointer;
    outline: none;
}
.common-plugin-list .cpl-select-chev {
    position: absolute;
    right: 14px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    color: #000;
    display: inline-flex;
    align-items: center;
}
.common-plugin-list .cpl-select-chev svg {
    width: 16px;
    height: 16px;
}
/* chosen.js fallback: the host editor may enhance the filter <select> into a
   .chosen-container. Style it to match the native .cpl-select pill so the
   dropdown looks identical either way. The .cpl-select-chev SVG still supplies
   the arrow; chosen's own arrow (.chosen-single div) is hidden. */
.common-plugin-list .cpl-select .chosen-container {
    width: 100% !important;
    font-size: 14px;
}
.common-plugin-list .cpl-select .chosen-container .chosen-single {
    height: 36px;
    line-height: 34px;
    padding: 0 36px 0 16px;
    background: #fff;
    border: 1px solid #BDBDBD;
    border-radius: 50px;
    box-shadow: none;
    color: #000;
}
.common-plugin-list .cpl-select .chosen-container-active .chosen-single {
    border-color: #BDBDBD;
    box-shadow: none;
}
.common-plugin-list .cpl-select .chosen-container .chosen-single span {
    margin-right: 0;
}
.common-plugin-list .cpl-select .chosen-container .chosen-single div {
    display: none;
}
.common-plugin-list .cpl-select .chosen-container .chosen-drop {
    border: 1px solid #BDBDBD;
    border-radius: 12px;
    margin-top: 6px;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .08);
}
.common-plugin-list .cpl-select .chosen-container .chosen-results {
    margin: 4px 0;
    padding: 0;
}
.common-plugin-list .cpl-select .chosen-container .chosen-results li {
    padding: 8px 16px;
}
.common-plugin-list .cpl-select .chosen-container .chosen-results li.highlighted {
    background: #008DF2;
    color: #fff;
}
.common-plugin-list .cpl-toolbar-spacer {
    flex: 1;
}
.common-plugin-list .cpl-icon-btn {
    width: 52px;
    height: 36px;
    border-radius: 30px;
    border: 1px solid #BDBDBD;
    background: #fff;
    cursor: pointer;
    display: grid;
    place-items: center;
    color: #4f4f4f;
    font-size: 16px;
    flex-shrink: 0;
}
.common-plugin-list .cpl-icon-btn svg {
    width: 20px;
    height: 20px;
    fill: currentColor;
}
.common-plugin-list .cpl-icon-btn:hover {
    background: #0078CE;
    border-color: #0078CE;
    color: #fff;
}
.common-plugin-list .cpl-icon-btn:hover svg,
.common-plugin-list .cpl-icon-btn:hover svg path,
.common-plugin-list .cpl-icon-btn:hover svg use {
    fill: #fff;
}
/* Bordered, rounded table container (header + rows + pagination live inside) */
.common-plugin-list .cpl-table {
    /* AJAX container only — the bordered card is .cpl-table-card so the
       pagination footer can sit outside the border. */
}
.common-plugin-list .cpl-table-card {
    background: #fff;
    border: 1px solid #DDDDDD;
    border-radius: 12px;
    overflow-x: hidden;
    overflow-y: auto;
    max-height: calc(100vh - 360px);
}
/* Selection bar (shown by JS when rows are checked) */
.common-plugin-list .cpl-sel-bar {
    align-items: center;
    gap: 14px;
    padding: 10px 20px;
    background: #eef6ff;
    border-bottom: 1px solid #cfe6ff;
}
/* Checkbox cursor (replaces inline) */
.common-plugin-list .cpl-thead input[type="checkbox"],
.common-plugin-list .cpl-row input[type="checkbox"] {
    cursor: pointer;
}
/* Capitalized cell (replaces inline text-transform) */
.common-plugin-list .cpl-cell--cap {
    text-transform: capitalize;
}
/* Sync-history direction + status badge — static layout only; colours stay inline (dynamic) */
.common-plugin-list .cpl-hist-dir {
    font-size: 12px;
    font-weight: 600;
}
.common-plugin-list .cpl-hist-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-weight: 600;
    font-size: 12px;
    padding: 3px 10px;
    border-radius: 5px;
    white-space: nowrap;
}
.common-plugin-list .cpl-sel-count {
    font-size: 13px;
    font-weight: 600;
    color: #008DF2;
}
.common-plugin-list .cpl-sel-btn {
    font-weight: 600;
    font-size: 13px;
    line-height: 1;
    height: 30px;
    padding: 0 16px;
    border-radius: 50px;
    border: 1px solid transparent;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #008DF2;
    color: #fff;
}
/* Table header + rows (grid-template-columns set inline per table) */
.common-plugin-list .cpl-thead {
    display: grid;
    align-items: center;
    gap: 12px;
    padding: 12px 10px;
    background: #ffffff;
    border-bottom: 1px solid #DDDDDD;
    font-size: 12px;
    font-weight: 600;
    color: #828282;
    position: sticky;
    top: 0;
    z-index: 2;
}
.common-plugin-list .cpl-row {
    display: grid;
    align-items: center;
    gap: 12px;
    padding: 10px;
    border-bottom: 1px solid #F0F3F4;
    font-size: 14px;
    color: #000000;
}
.common-plugin-list .cpl-cell {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.common-plugin-list .cpl-cell strong,
.common-plugin-list .cpl-cell-strong {
    color: #000;
}
.common-plugin-list .cpl-mono {
    font-family: monospace;
    font-size: 13px;
    color: #4f4f4f;
}
/* Status dot + label */
.common-plugin-list .cpl-status {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 14px;
    color: #000000;
}
.common-plugin-list .cpl-status-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex-shrink: 0;
}
.common-plugin-list .cpl-info-i {
    width: 15px;
    height: 15px;
    border-radius: 50%;
    border: 1.3px solid #b6bdc4;
    color: #8a9099;
    font-size: 10px;
    font-weight: 600;
    font-style: italic;
    display: grid;
    place-items: center;
    cursor: help;
    font-family: Georgia, serif;
    flex-shrink: 0;
}
/* Row action (kebab) menu */
.common-plugin-list .cpl-row-actions {
    position: relative;
    text-align: center;
    cursor: pointer;
    color: #828282;
    font-size: 18px;
    line-height: 1;
}
.common-plugin-list .cpl-row-actions .fee-icon.more {
    width: 20px;
    height: 20px;
    vertical-align: middle;
    display: block;
    fill: #828282;
}
.common-plugin-list .cpl-row-menu {
    display: none;
    position: absolute;
    right: 0;
    top: 100%;
    z-index: 4000700;
    background: #FFFFFF;
    border: 1px solid #DDDDDD;
    border-radius: 8px;
    box-shadow: 0 4px 25px rgba(0, 0, 0, .30);
    min-width: 150px;
    padding: 12px 0;
    text-align: left;
}
.common-plugin-list .cpl-row-menu-item {
    padding: 6px 16px;
    font-size: 14px;
    line-height: 20px;
    color: #000000;
    cursor: pointer;
    white-space: nowrap;
}
.common-plugin-list .cpl-row-menu-item:hover {
    color: #008DF2;
    background-color: rgba(0, 141, 242, 0.1);
}
.common-plugin-list .cpl-empty {
    padding: 36px 0;
    text-align: center;
    color: #9aa0a6;
    font-size: 13px;
}
/* Pagination footer — sits OUTSIDE the bordered .cpl-table-card */
.common-plugin-list .cpl-pagination {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 0 4px;
    margin-top: 16px;
}
.common-plugin-list .cpl-pagination-info {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    color: #828282;
}
.common-plugin-list .cpl-pager {
    display: flex;
    align-items: center;
    gap: 8px;
}
.common-plugin-list .cpl-page-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    height: 32px;
    padding: 0 12px;
    border: 1px solid #DDDDDD;
    border-radius: 5px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1;
    cursor: pointer;
    color: #000;
    background: #fff;
    transition: .3s;
}
.common-plugin-list .cpl-page-btn:hover {
    color: #0078CE;
    border-color: #008DF2;
}
.common-plugin-list .cpl-page-btn--text {
    min-width: 54px;
}
.common-plugin-list .cpl-page-btn.current {
    background: #fff;
    color: #008DF2;
    border-color: #008DF2;
    cursor: default;
}
.common-plugin-list .cpl-page-btn.disabled {
    background: rgba(189, 189, 189, 0.5);
    color: #fff;
    pointer-events: none;
    cursor: not-allowed;
}
.common-plugin-list .cpl-page-ellipsis {
    display: inline-flex;
    align-items: flex-end;
    justify-content: center;
    min-width: 24px;
    height: 32px;
    color: #828282;
    font-size: 13px;
    cursor: default;
}
/* Activity & Tracking page (mc-act-*) */
.common-plugin-list .mc-act-page-title {
    font-size: 22px;
    font-weight: 600;
    color: #000;
    margin: 0 auto 18px;
    max-width: 900px;
}
.common-plugin-list .mc-act-card {
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 12px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
    padding: 24px;
    margin: 0 auto 18px;
    max-width: 900px;
}
.common-plugin-list .mc-act-head {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 18px;
}
.common-plugin-list .mc-act-head-icon {
    width: 36px;
    height: 36px;
    border-radius: 9px;
    background: #f0f3f4;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.common-plugin-list .mc-act-head-text {
    flex: 1;
    min-width: 0;
}
.common-plugin-list .mc-act-title {
    font-size: 18px;
    font-weight: 600;
    color: #000;
    line-height: 24px;
}
.common-plugin-list .mc-act-desc {
    font-size: 13px;
    color: #4f4f4f;
    margin-top: 4px;
    max-width: 640px;
    line-height: 18px;
}
.common-plugin-list .mc-act-resync-all {
    font-weight: 600;
    font-size: 14px;
    line-height: 20px;
    height: 30px;
    padding: 5px 16px;
    border-radius: 50px;
    border: 1px solid transparent;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: #008DF2;
    color: #fff;
    white-space: nowrap;
}
.common-plugin-list .mc-act-filters {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 14px;
    flex-wrap: wrap;
}
.common-plugin-list .mc-act-filter {
    position: relative;
}
.common-plugin-list .mc-act-filter--entity {
    width: 170px;
}
.common-plugin-list .mc-act-filter--status {
    width: 150px;
}
.common-plugin-list .mc-act-filter select {
    width: 100%;
    height: 36px;
    padding: 0 32px 0 12px;
    -webkit-appearance: none;
    appearance: none;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 5px;
    font-size: 14px;
    color: #000;
    cursor: pointer;
    outline: none;
}
.common-plugin-list .mc-act-filter-chev {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    color: #828282;
    font-size: 11px;
}
.common-plugin-list .mc-act-note {
    font-size: 12px;
    color: #828282;
    margin-top: 12px;
}
.common-plugin-list .mc-act-empty {
    border: 1px solid #ddd;
    border-radius: 5px;
    padding: 36px 0;
    text-align: center;
    color: #9aa0a6;
    font-size: 13px;
}
.common-plugin-list .mc-act-foot {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    margin-top: 14px;
}
.common-plugin-list .mc-act-link {
    color: #008DF2;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
}
.common-plugin-list .mc-act-reports-foot {
    display: flex;
    justify-content: flex-end;
    max-width: 900px;
    margin: 0 auto;
}
.common-plugin-list .mc-act-reports-link {
    color: #008DF2;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
}
/* Data sync log table (mc-log-*) */
.common-plugin-list .mc-log-table {
    border: 1px solid #ddd;
    border-radius: 5px;
    overflow: hidden;
}
.common-plugin-list .mc-log-head,
.common-plugin-list .mc-log-row {
    display: grid;
    grid-template-columns: 120px 1.6fr 90px 110px 1.2fr 130px 110px;
    gap: 12px;
    padding: 11px 16px;
}
.common-plugin-list .mc-log-head {
    padding: 10px 16px;
    background: #f0f3f4;
    font-size: 12px;
    font-weight: 600;
    color: #4f4f4f;
    text-transform: uppercase;
    letter-spacing: .04em;
}
.common-plugin-list .mc-log-row {
    align-items: center;
    border-top: 1px solid #eaeaea;
    background: #fff;
    font-size: 13px;
}
.common-plugin-list .mc-log-row.is-failed {
    background: rgba(235, 0, 18, .035);
}
.common-plugin-list .mc-log-entity {
    font-weight: 600;
    color: #000;
}
.common-plugin-list .mc-log-record {
    color: #4f4f4f;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.common-plugin-list .mc-log-dir {
    font-family: monospace;
    font-size: 11px;
    font-weight: 600;
    color: #4f4f4f;
}
.common-plugin-list .mc-log-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-weight: 600;
    font-size: 12px;
    line-height: 16px;
    padding: 3px 10px;
    border-radius: 5px;
    white-space: nowrap;
}
.common-plugin-list .mc-log-badge--synced {
    background: rgba(13, 193, 92, .12);
    color: #0a9b49;
}
.common-plugin-list .mc-log-badge--failed {
    background: rgba(235, 0, 18, .1);
    color: #eb0012;
}
.common-plugin-list .mc-log-badge--default {
    background: rgba(0, 0, 0, .06);
    color: #4f4f4f;
}
.common-plugin-list .mc-log-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
}
.common-plugin-list .mc-log-badge--synced .mc-log-dot {
    background: #0dc15c;
}
.common-plugin-list .mc-log-badge--failed .mc-log-dot {
    background: #eb0012;
}
.common-plugin-list .mc-log-badge--default .mc-log-dot {
    background: #828282;
}
.common-plugin-list .mc-log-detail {
    font-size: 12px;
    color: #828282;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.common-plugin-list .mc-log-row.is-failed .mc-log-detail {
    color: #eb0012;
}
.common-plugin-list .mc-log-time {
    color: #828282;
    font-size: 12px;
}
.common-plugin-list .mc-act-resync {
    font-weight: 600;
    font-size: 14px;
    line-height: 20px;
    height: 30px;
    padding: 5px 16px;
    border-radius: 50px;
    border: 1px solid #008DF2;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    color: #008DF2;
    white-space: nowrap;
}
.common-plugin-list .mc-log-empty {
    padding: 36px 0;
    text-align: center;
    color: #9aa0a6;
    font-size: 13px;
    border-top: 1px solid #eaeaea;
}

/* ─── Common plugin Email Assignments (accordion cards) ───────────────────── */
.common-plugin-email-assignments {
    padding: 10px;
    max-width: 680px;
    margin: 0 auto;
}
.common-plugin-email-assignments .cpea-title {
    font-size: 22px;
    font-weight: 600;
    color: #000;
}
.common-plugin-email-assignments .cpea-subtitle {
    font-size: 13px;
    line-height: 18px;
    color: #4F4F4F;
    margin-top: 4px;
    max-width: 760px;
}
.common-plugin-email-assignments .cpea-subtitle strong {
    color: #000;
}
.common-plugin-email-assignments .cpea-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.common-plugin-email-assignments .cpea-card {
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 14px;
    background: #fff;
}
.common-plugin-email-assignments .cpea-card-header {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 20px 25px;
    cursor: pointer;
}
.common-plugin-email-assignments .cpea-icon {
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: #F0F3F4;
    display: grid;
    place-items: center;
    color: #4F4F4F;
    flex-shrink: 0;
}
.common-plugin-email-assignments .cpea-icon .fee-icon {
    width: 20px;
    height: 20px;
}
.common-plugin-email-assignments .cpea-info {
    flex: 1;
    min-width: 0;
}
.common-plugin-email-assignments .cpea-name-row {
    display: flex;
    align-items: center;
    gap: 10px;
}
.common-plugin-email-assignments .cpea-name {
    font-size: 14px;
    font-weight: 600;
    color: #000;
}
.common-plugin-email-assignments .cpea-desc {
    font-size: 12px;
    line-height: 16px;
    color: #4F4F4F;
    margin-top: 2px;
}
.common-plugin-email-assignments .cpea-chip {
    font-size: 14px;
    font-weight: 600;
    line-height: 16px;
    padding: 4px 10px;
    border-radius: 100px;
    white-space: nowrap;
    display: inline-flex;
    align-items: center;
    gap: 5px;
}
.common-plugin-email-assignments .cpea-chip--configured {
    background: rgba(13, 193, 92, .12);
    color: #0a9b49;
}
.common-plugin-email-assignments .cpea-chip--configured::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #0dc15c;
}
.common-plugin-email-assignments .cpea-chip--not {
    background: #F0F3F4;
    color: #828282;
}
.common-plugin-email-assignments .cpea-chev {
    color: #99A1AF;
    flex-shrink: 0;
    display: inline-flex;
    align-items: center;
}
.common-plugin-email-assignments .cpea-chev .cpea-chev-up {
    display: none;
}
.common-plugin-email-assignments .cpea-card.is-open .cpea-chev .cpea-chev-down {
    display: none;
}
.common-plugin-email-assignments .cpea-card.is-open .cpea-chev .cpea-chev-up {
    display: inline;
}
.common-plugin-email-assignments .cpea-body {
    display: none;
    padding: 0 25px 20px 76px;
}
.common-plugin-email-assignments .cpea-card.is-open .cpea-body {
    display: block;
}
.common-plugin-email-assignments .cpea-label {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 13px;
    font-weight: 600;
    color: #000;
    margin-bottom: 6px;
}
.common-plugin-email-assignments .cpea-req {
    color: #eb0012;
}
.common-plugin-email-assignments .cpea-select,
.common-plugin-email-assignments .cpea-input {
    width: 100%;
    height: 38px;
    padding: 0 12px;
    border: 1px solid #BDBDBD;
    border-radius: 6px;
    font-size: 14px;
    color: #000;
    background: #fff;
    cursor: pointer;
    outline: none;
}
.common-plugin-email-assignments .cpea-toggle-row {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 16px;
}
.common-plugin-email-assignments .cpea-toggle-title {
    font-size: 14px;
    font-weight: 600;
    color: #000;
}
.common-plugin-email-assignments .cpea-toggle-desc {
    font-size: 12px;
    color: #828282;
    margin-top: 2px;
}
.common-plugin-email-assignments .cpea-toggle {
    width: 32px;
    height: 16px;
    border-radius: 999px;
    flex-shrink: 0;
    background: #bdbdbd;
    position: relative;
    cursor: pointer;
    transition: background .15s;
}
.common-plugin-email-assignments .cpea-toggle::before {
    content: "";
    position: absolute;
    top: 2px;
    left: 2px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .2);
    transition: left .15s;
}
.common-plugin-email-assignments .cpea-toggle.is-on {
    background: #0078CE;
}
.common-plugin-email-assignments .cpea-toggle.is-on::before {
    left: 18px;
}
.common-plugin-email-assignments .cpea-actions {
    display: flex;
    gap: 10px;
    margin-top: 18px;
}
.common-plugin-email-assignments .cpea-empty {
    padding: 40px 0;
    text-align: center;
    color: #9aa0a6;
    font-size: 14px;
}

/* ─── Common plugin Dashboard ─────────────────────────────────────────────── */
.common-plugin-dashboard {
    padding: 10px;
}
.common-plugin-dashboard .cpd-title {
    font-size: 22px;
    font-weight: 600;
    color: #000;
    margin-bottom: 18px;
}
.common-plugin-dashboard .cpd-stack {
    display: flex;
    flex-direction: column;
    gap: 18px;
}
/* Connection banner */
.common-plugin-dashboard .cpd-banner {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 18px;
    background: rgba(13, 193, 92, .08);
    border: 1px solid rgba(13, 193, 92, .30);
    border-radius: 12px;
}
.common-plugin-dashboard .cpd-banner-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.common-plugin-dashboard .cpd-banner-icon svg {
    display: block;
}
.common-plugin-dashboard .cpd-banner-text {
    font-size: 14px;
    color: #000;
}
.common-plugin-dashboard .cpd-banner-strong {
    font-weight: 600;
}
.common-plugin-dashboard .cpd-banner-underline {
    text-decoration: underline;
}
.common-plugin-dashboard .cpd-muted {
    color: #828282;
}
.common-plugin-dashboard .cpd-spacer {
    flex: 1;
}
.common-plugin-dashboard .cpd-open-link {
    color: #008DF2;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    margin-right: 14px;
}
.common-plugin-dashboard .cpd-disconnect {
    font-weight: 600;
    font-size: 14px;
    line-height: 20px;
    height: 30px;
    padding: 5px 16px;
    border-radius: 50px;
    border: 1px solid #eb0012;
    cursor: pointer;
    background: transparent;
    color: #eb0012;
}
/* Stat cards */
.common-plugin-dashboard .cpd-stats {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 14px;
}
.common-plugin-dashboard .cpd-stat-card {
    background: #fff;
    border: 1px solid #E5E7EB;
    border-radius: 12px;
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.common-plugin-dashboard .cpd-stat-label {
    font-size: 13px;
    color: #6B7280;
    font-weight: 500;
    margin-bottom: 8px;
}
.common-plugin-dashboard .cpd-stat-value {
    font-size: 28px;
    font-weight: 600;
    color: #000;
    line-height: 1;
}
.common-plugin-dashboard .cpd-stat-value--green {
    color: #0dc15c;
}
.common-plugin-dashboard .cpd-stat-icon {
    width: 38px;
    height: 38px;
    border-radius: 9px;
    background: #f0f3f4;
    display: grid;
    place-items: center;
    color: #828282;
    flex-shrink: 0;
}
/* Generic white card */
.common-plugin-dashboard .cpd-card {
    background: #fff;
    border: 1px solid #E5E7EB;
    border-radius: 12px;
    padding: 24px;
}
/* Insights */
.common-plugin-dashboard .cpd-insights-head {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
}
.common-plugin-dashboard .cpd-insights-title {
    font-size: 16px;
    font-weight: 600;
    color: #000;
}
.common-plugin-dashboard .cpd-insights-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
}
.common-plugin-dashboard .cpd-insight {
    border: 1px solid #E5E7EB;
    border-radius: 10px;
    padding: 16px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.common-plugin-dashboard .cpd-insight-head {
    display: flex;
    align-items: flex-start;
    gap: 9px;
}
.common-plugin-dashboard .cpd-insight-dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    flex-shrink: 0;
    margin-top: 5px;
}
.common-plugin-dashboard .cpd-insight-dot--red {
    background: #eb0012;
}
.common-plugin-dashboard .cpd-insight-dot--amber {
    background: #ff9f40;
}
.common-plugin-dashboard .cpd-insight-dot--green {
    background: #0dc15c;
}
.common-plugin-dashboard .cpd-insight-title {
    font-size: 15px;
    font-weight: 600;
    color: #000;
    line-height: 20px;
}
.common-plugin-dashboard .cpd-insight-body {
    font-size: 12px;
    color: #828282;
    line-height: 18px;
    padding-left: 18px;
}
.common-plugin-dashboard .cpd-insight-foot {
    display: flex;
    justify-content: flex-end;
    margin-top: auto;
}
.common-plugin-dashboard .cpd-insight-link {
    font-size: 12px;
    font-weight: 600;
    color: #008DF2;
    text-decoration: none;
}
/* Audience & sync */
.common-plugin-dashboard .cpd-aud-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}
.common-plugin-dashboard .cpd-aud-title {
    font-size: 20px;
    font-weight: 600;
    color: #000;
    line-height: 26px;
}
.common-plugin-dashboard .cpd-aud-desc {
    font-size: 14px;
    color: #4f4f4f;
    margin-top: 6px;
    max-width: 640px;
    line-height: 20px;
}
.common-plugin-dashboard .cpd-aud-actions {
    display: flex;
    align-items: center;
    gap: 0;
}
.common-plugin-dashboard .cpd-aud-actions .cpd-select {
    border-radius: 6px 0 0 6px;
    background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTggMTAuMjQ5OUw0IDYuMjQ5ODdMNC43MTY2NyA1LjUzMzJMOCA4LjgzMzJMMTEuMjgzMyA1LjU0OTg3TDEyIDYuMjY2NTRMOCAxMC4yNDk5WiIgZmlsbD0iYmxhY2siLz4KPC9zdmc+");
    background-repeat: no-repeat;
    background-position: calc(100% - 8px) center;
}
.common-plugin-dashboard .cpd-aud-actions .fee-popup__button {
    border-radius: 0 6px 6px 0;
}
.common-plugin-dashboard .cpd-lastsync {
    font-size: 13px;
    color: #828282;
    white-space: nowrap;
}
.common-plugin-dashboard .cpd-lastsync strong {
    color: #4f4f4f;
    font-weight: 600;
}
.common-plugin-dashboard .cpd-aud-row {
    display: flex;
    align-items: flex-end;
    gap: 14px;
    flex-wrap: wrap;
}
.common-plugin-dashboard .cpd-aud-col {
    flex: 1;
    min-width: 320px;
}
.common-plugin-dashboard .cpd-aud-label {
    font-size: 12px;
    font-weight: 600;
    color: #4f4f4f;
    margin-bottom: 6px;
}
.common-plugin-dashboard .cpd-aud-input-row {
    display: flex;
    gap: 8px;
    align-items: center;
}
.common-plugin-dashboard .cpd-aud-field {
    position: relative;
    flex: 1;
}
.common-plugin-dashboard .cpd-select,
.common-plugin-dashboard .cpd-input {
    width: 100%;
    height: 36px;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    font-size: 14px;
    color: #000;
    background: #fff;
    outline: none;
}
.common-plugin-dashboard .cpd-select {
    padding: 0 32px 0 12px;
    -webkit-appearance: none;
    appearance: none;
    cursor: pointer;
}
.common-plugin-dashboard .cpd-input {
    padding: 0 12px;
}
.common-plugin-dashboard .cpd-select-chev {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
    color: #828282;
    font-size: 11px;
}
.common-plugin-dashboard .cpd-aud-refresh {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1px #BDBDBD solid;
    background: #fff;
    cursor: pointer;
    display: grid;
    place-items: center;
    color: #4f4f4f;
    font-size: 14px;
    flex-shrink: 0;
}
/* Audience field shown inline in the card header (compact, not full-width) */
.common-plugin-dashboard .cpd-aud-actions .cpd-aud-field {
    flex: none;
    width: 280px;
}
/* chosen.js audience dropdown — render as a clean pill that matches the Sync Now
   button height (the .cpd-select-chev SVG supplies the arrow; chosen's is hidden). */
.common-plugin-dashboard .cpd-aud-field .chosen-container {
    width: 100% !important;
}
.common-plugin-dashboard .cpd-aud-field .chosen-single {
    height: 38px;
    line-height: 36px;
    padding: 0 30px 0 12px;
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    background: #fff;
    box-shadow: none;
    color: #000;
}
.common-plugin-dashboard .cpd-aud-field .chosen-single span {
    margin-right: 0;
}
.common-plugin-dashboard .cpd-aud-field .chosen-single div {
    display: none;
}
.common-plugin-dashboard .cpd-aud-field .chosen-drop {
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    margin-top: 4px;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .08);
}
.common-plugin-dashboard .cpd-aud-field .chosen-results li.highlighted {
    background: #008DF2;
    color: #fff;
}
/* Divider between the header and the two-column content */
.common-plugin-dashboard .cpd-aud-divider {
    height: 1px;
    background: #E5E7EB;
    margin: 0 -24px 20px;
}
/* Recently synced + Sync activity — two columns inside the one card */
.common-plugin-dashboard .cpd-two-col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0;
}
.common-plugin-dashboard .cpd-col {
    min-width: 0;
}
.common-plugin-dashboard .cpd-col:first-child {
    padding-right: 24px;
}
.common-plugin-dashboard .cpd-col--divider {
    border-left: 1px solid #E5E7EB;
    padding-left: 24px;
}
.common-plugin-dashboard .cpd-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
}
.common-plugin-dashboard .cpd-card-title {
    font-size: 16px;
    font-weight: 600;
    color: #000;
}
.common-plugin-dashboard .cpd-view-all {
    color: #008DF2;
    font-size: 13px;
    text-decoration: none;
}
.common-plugin-dashboard .cpd-recent-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0;
}
.common-plugin-dashboard .cpd-recent-row + .cpd-recent-row {
    border-top: 1px solid #F0F3F4;
}
.common-plugin-dashboard .cpd-recent-name {
    font-size: 14px;
    font-weight: 600;
    color: #000;
}
.common-plugin-dashboard .cpd-recent-email {
    font-size: 12px;
    color: #828282;
}
.common-plugin-dashboard .cpd-status {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-weight: 600;
    font-size: 12px;
    padding: 3px 10px;
    border-radius: 5px;
}
.common-plugin-dashboard .cpd-status::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
}
.common-plugin-dashboard .cpd-status--ok {
    background: rgba(13, 193, 92, .12);
    color: #0a9b49;
}
.common-plugin-dashboard .cpd-status--ok::before {
    background: #0dc15c;
}
.common-plugin-dashboard .cpd-status--skip {
    background: rgba(130, 130, 130, .12);
    color: #828282;
}
.common-plugin-dashboard .cpd-status--skip::before {
    background: #828282;
}
.common-plugin-dashboard .cpd-status--fail {
    background: rgba(235, 0, 18, .1);
    color: #eb0012;
}
.common-plugin-dashboard .cpd-status--fail::before {
    background: #eb0012;
}
.common-plugin-dashboard .cpd-status-info {
    width: 14px;
    height: 14px;
    border-radius: 50%;
    border: 1.3px solid currentColor;
    font-size: 9px;
    font-weight: 600;
    font-style: italic;
    display: grid;
    place-items: center;
    cursor: help;
    font-family: Georgia, serif;
    flex-shrink: 0;
}
.common-plugin-dashboard .cpd-act-subtitle {
    font-size: 12px;
    color: #828282;
    margin-bottom: 14px;
}
.common-plugin-dashboard .cpd-act-row {
    display: flex;
    gap: 12px;
    padding-bottom: 14px;
}
.common-plugin-dashboard .cpd-act-dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    border: 2px solid #008DF2;
    margin-top: 4px;
    flex-shrink: 0;
}
.common-plugin-dashboard .cpd-act-text {
    font-size: 13px;
    color: #4f4f4f;
    line-height: 18px;
}
.common-plugin-dashboard .cpd-act-time {
    font-size: 12px;
    color: #828282;
    margin-top: 2px;
}
.common-plugin-dashboard .cpd-empty {
    padding: 28px 0;
    text-align: center;
    color: #9aa0a6;
    font-size: 13px;
}
.common-plugin-dashboard .cpd-insights-emoji {
    font-size: 16px;
}

/* ─── Common plugin Placeholder ("coming soon") ───────────────────────────── */
.common-plugin-placeholder {
    padding: 22px 28px 60px;
}
.common-plugin-placeholder .cpph-title {
    font-size: 22px;
    font-weight: 600;
    color: #000;
    margin-bottom: 18px;
}
.common-plugin-placeholder .cpph-card {
    background: #fff;
    border: 1px solid #E5E7EB;
    border-radius: 12px;
    padding: 48px 24px;
    text-align: center;
}
.common-plugin-placeholder .cpph-icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    background: #f0f3f4;
    display: inline-grid;
    place-items: center;
    color: #9aa0a6;
    margin-bottom: 14px;
}
.common-plugin-placeholder .cpph-heading {
    font-size: 16px;
    font-weight: 600;
    color: #000;
    margin-bottom: 6px;
}
.common-plugin-placeholder .cpph-text {
    font-size: 13px;
    color: #9aa0a6;
}

/* Global sync */
.common-plugin-setup-page .cpsp-gs-label {
    display: block;
    font-size: 13px;
    color: #5a6472;
    margin-bottom: 6px;
}
.common-plugin-setup-page .cpsp-gs-input {
    width: 100%;
    padding: 9px 11px;
    border: 1px solid #e0e4e8;
    border-radius: 7px;
    font-size: 14px;
}
.common-plugin-setup-page .cpsp-gs-toggle-row {
    padding: 16px 0;
}
.common-plugin-setup-page .cpsp-gs-toggle-row--bordered {
    border-bottom: 1px solid #eaeaea;
}
.common-plugin-setup-page .cpsp-gs-toggle-inner {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
}
.common-plugin-setup-page .cpsp-gs-toggle-text {
    max-width: 460px;
}
.common-plugin-setup-page .cpsp-gs-toggle-title {
    font-size: 14px;
    font-weight: 600;
    color: #000;
}
.common-plugin-setup-page .cpsp-gs-toggle-desc {
    font-size: 13px;
    color: #828282;
    margin-top: 2px;
}
.common-plugin-setup-page .cpsp-gs-toggle-action {
    flex-shrink: 0;
}

/* Common plugin connect popup */
.plugin-connect-popup {
    width: 600px !important;
}
.plugin-connect-popup .mc-connect-modal-body {
    padding: 48px 20px;
    text-align: center;
}
.plugin-connect-popup .mc-connect-modal__brand-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 24px;
    margin-bottom: 24px;
}
.plugin-connect-popup .mc-connect-modal__brand-tile {
    width: 60px;
    height: 60px;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 0 50px rgba(0, 91, 174, 0.1), 0 1px 2px rgba(0, 0, 0, 0.05);
    display: grid;
    place-items: center;

}
.plugin-connect-popup .mc-connect-modal__connector {
    display: flex;
    align-items: center;
    width: 76px;
}
.plugin-connect-popup .mc-connect-modal__dash {
    flex: 1;
    height: 2px;
    background: repeating-linear-gradient(90deg, #008DF2 0 5px, transparent 5px 10px);
    opacity: 0.5;
}
.plugin-connect-popup .mc-connect-modal__link-dot {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: #008DF2;
    display: grid;
    place-items: center;
    flex-shrink: 0;
    box-shadow: 0 2px 8px rgba(0, 141, 242, 0.4);
}
.plugin-connect-popup .mc-connect-modal__heading {
    font-size: 18px;
    line-height: 24px;
    font-weight: 600;
    color: #000000;
    margin-bottom: 4px;
}
.plugin-connect-popup .mc-connect-modal__subtext {
    font-size: 12px;
    color: #828282;
    line-height: 16px;
    margin: 0 auto 32px;
    max-width: 440px;
}
.plugin-connect-popup .mc-connect-modal__actions {
    display: flex;
    justify-content: center;
    gap: 10px;
}
.plugin-connect-popup .mc-connect-modal__btn--cancel {
    min-width: 110px;
    justify-content: center;
}
.plugin-connect-popup .mc-connect-modal__btn--proceed {
    min-width: 170px;
    justify-content: center;
}
.plugin-connect-popup .mc-connected-body {
    padding: 36px 32px;
    text-align: center;
}
.plugin-connect-popup .mc-connected-body__title {
    font-size: 16px;
    font-weight: 600;
    color: #1a1a1a;
}

/* ── MailChimp Field Mapping section (centered card + icon header) ─────────── */
.mc-fm-page {
    padding: 10px;
}
.mc-fm-wrap {
    background: #fff;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 14px;
    padding: 25px;
    max-width: 680px;
    margin: 0 auto;
}
.mc-fm-header {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 18px;
}
.mc-fm-header-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: #F0F3F4;
    border-radius: 10px;
    height: 36px;
    width: 36px;
}
.mc-fm-header-text {
    flex: 1;
    min-width: 0;
}
.mc-fm-title {
    font-size: 18px;
    font-weight: 600;
    color: #000;
    line-height: 24px;
}
.mc-fm-desc {
    font-size: 13px;
    color: #4f4f4f;
    margin-top: 4px;
    max-width: 640px;
    line-height: 18px;
}

/* ── MailChimp field mapping accordion ─────────────────────────── */
/* ============================================================================
   Common Field Mapping component (cpsp / shared across plugins).
   Structure + classes are reused by any plugin's mapping table; the CSS lives
   here (editor-common.css) so the design is identical everywhere.
   Grid: WebCommander select | arrow | target select | Auto-sync | delete.
   ========================================================================== */
.exsited-field-mapping {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.exsited-field-mapping__table-wrapper {
    border: 1px solid #E5E7EB;
    border-radius: 8px;
    overflow: hidden;
}
.exsited-field-mapping__col-headers {
    display: grid;
    grid-template-columns: 1fr 24px 1fr 90px 40px;
    align-items: center;
    padding: 10px 20px;
    border-bottom: 1px solid #F0F3F4;
    border-radius: 8px 8px 0 0;
    font-size: 14px;
    line-height: 20px;
    font-weight: 600;
    background: #F9FAFB;
}
.exsited-field-mapping__section {
    border-bottom: 1px solid #E5E7EB;
    border-top: none;
}
.exsited-field-mapping__section:last-of-type {
    border-bottom: none;
}
.exsited-field-mapping__section-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 20px;
    cursor: pointer;
    font-size: 12px;
    line-height: 16px;
    font-weight: 600;
    color: #000;
    user-select: none;
}
.exsited-field-mapping__section-header:hover {
    background: #FAFBFC;
}
.exsited-field-mapping__chevron {
    color: #6B7280;
    transition: transform 0.15s ease;
    flex-shrink: 0;
}
.exsited-field-mapping__section.expanded > .exsited-field-mapping__section-header .exsited-field-mapping__chevron {
    transform: rotate(90deg);
}
.exsited-field-mapping__section-body[hidden] {
    display: none;
}
.exsited-field-mapping__section-body {
    padding: 10px 20px;
    background: #F9FAFB;
}
.exsited-field-mapping__row {
    display: grid;
    grid-template-columns: 1fr 24px 1fr 90px 40px;
    align-items: center;
    gap: 8px;
    margin-bottom: 20px;
}
.exsited-field-mapping__row:last-of-type {
    margin-bottom: 0;
}
.exsited-field-mapping__select {
    width: 100%;
    padding: 6px 24px 6px 12px;
    border: 1px solid #BDBDBD;
    border-radius: 6px;
    font-size: 14px;
    color: #000000;
    background-color: #fff;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    background-image: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTggMTAuMjQ5OUw0IDYuMjQ5ODdMNC43MTY2NyA1LjUzMzJMOCA4LjgzMzJMMTEuMjgzMyA1LjU0OTg3TDEyIDYuMjY2NTRMOCAxMC4yNDk5WiIgZmlsbD0iYmxhY2siLz4KPC9zdmc+");
    background-repeat: no-repeat;
    background-position: right 8px center;
    cursor: pointer;
}
.exsited-field-mapping__select--wc {
    color: #6B7280;
    background-color: #F9FAFB;
}
.exsited-field-mapping__select:disabled {
    cursor: default;
}
.exsited-field-mapping__arrow {
    color: #9CA3AF;
    text-align: center;
    font-size: 14px;
}
.exsited-field-mapping__autosync {
    display: flex;
    align-items: center;
    justify-content: center;
}
.exsited-field-mapping__autosync-input {
    width: 16px;
    height: 16px;
    cursor: pointer;
}
.exsited-field-mapping__delete {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 20px;
    width: 20px;
    line-height: unset;
    margin-left: auto;
}
.exsited-field-mapping__delete:hover {
    background: transparent;
    border: none;
}
.exsited-field-mapping__lock {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    color: #9CA3AF;
}
.exsited-field-mapping__add {
    display: inline-block;
    margin: 8px 0 4px;
    color: #2196F3;
    font-size: 13px;
    text-decoration: underline;
    cursor: pointer;
}
.exsited-field-mapping__add:hover {
    color: #1976D2;
}
.exsited-field-mapping .exsited-field-mapping__sync-banner {
    background: rgba(0, 141, 242, 0.1);
    border-radius: 10px;
    padding: 10px;
    margin-top: 20px;
    display: flex;
    gap: 15px;
    align-items: center;
}
.exsited-field-mapping .exsited-field-mapping__sync-icon {
    width: 40px;
    height: 40px;
    border-radius: 100px;
    background: #FFFFFF;
    color: #1D4ED8;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}
.exsited-field-mapping .exsited-field-mapping__sync-title {
    color: #008DF2;
    font-weight: 600;
    font-size: 12px;
    line-height: 16px;
}
.exsited-field-mapping .exsited-field-mapping__sync-desc {
    color: #000000;
    font-size: 12px;
    line-height: 16px;
    margin-top: 3px;
}
.exsited-field-mapping__footer-note {
    font-size: 12px;
    color: #828282;
    margin: 6px 0 0;
}
/* Klaviyo field-mapping "Required" column badges */
.klv-field-mapping .exsited-field-mapping__col-headers > div:nth-child(4) {
    text-align: center;
}
.klv-field-mapping .klv-fm-badge {
    text-align: center;
}
.klv-field-mapping .klv-fm-tag {
    display: inline-flex;
    align-items: center;
    font-weight: 700;
    font-size: 12px;
    line-height: 16px;
    padding: 3px 9px;
    border-radius: 5px;
    background: rgba(0, 0, 0, .06);
    color: #4f4f4f;
    white-space: nowrap;
}
.klv-field-mapping .klv-fm-optional {
    font-size: 13px;
    color: #828282;
}
 /* BASICS */

.CodeMirror {
  /* Set height, width, borders, and global font properties here */
  font-family: monospace;
  height: 300px;
}
.CodeMirror-scroll {
  /* Set scrolling behaviour here */
  overflow: auto;
}

/* PADDING */

.CodeMirror-lines {
  padding: 4px 0; /* Vertical padding around content */
}
.CodeMirror pre {
  padding: 0 4px; /* Horizontal padding of content */
}

.CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
  background-color: white; /* The little square between H and V scrollbars */
}

/* GUTTER */

.CodeMirror-gutters {
  border-right: 1px solid #ddd;
  background-color: #f7f7f7;
  white-space: nowrap;
}
.CodeMirror-linenumbers {}
.CodeMirror-linenumber {
  padding: 0 3px 0 5px;
  min-width: 20px;
  text-align: right;
  color: #999;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}

.CodeMirror-guttermarker { color: black; }
.CodeMirror-guttermarker-subtle { color: #999; }

/* CURSOR */

.CodeMirror div.CodeMirror-cursor {
  border-left: 1px solid black;
}
/* Shown when moving in bi-directional text */
.CodeMirror div.CodeMirror-secondarycursor {
  border-left: 1px solid silver;
}
.CodeMirror.cm-keymap-fat-cursor div.CodeMirror-cursor {
  width: auto;
  border: 0;
  background: #7e7;
}
.cm-animate-fat-cursor {
  width: auto;
  border: 0;
  -webkit-animation: blink 1.06s steps(1) infinite;
  -moz-animation: blink 1.06s steps(1) infinite;
  animation: blink 1.06s steps(1) infinite;
}
@-moz-keyframes blink {
  0% { background: #7e7; }
  50% { background: none; }
  100% { background: #7e7; }
}
@-webkit-keyframes blink {
  0% { background: #7e7; }
  50% { background: none; }
  100% { background: #7e7; }
}
@keyframes blink {
  0% { background: #7e7; }
  50% { background: none; }
  100% { background: #7e7; }
}

/* Can style cursor different in overwrite (non-insert) mode */
div.CodeMirror-overwrite div.CodeMirror-cursor {}

.cm-tab { display: inline-block; }

.CodeMirror-ruler {
  border-left: 1px solid #ccc;
  position: absolute;
}

/* DEFAULT THEME */

.cm-s-default .cm-keyword {color: #708;}
.cm-s-default .cm-atom {color: #219;}
.cm-s-default .cm-number {color: #164;}
.cm-s-default .cm-def {color: #00f;}
.cm-s-default .cm-variable,
.cm-s-default .cm-punctuation,
.cm-s-default .cm-property,
.cm-s-default .cm-operator {}
.cm-s-default .cm-variable-2 {color: #05a;}
.cm-s-default .cm-variable-3 {color: #085;}
.cm-s-default .cm-comment {color: #a50;}
.cm-s-default .cm-string {color: #a11;}
.cm-s-default .cm-string-2 {color: #f50;}
.cm-s-default .cm-meta {color: #555;}
.cm-s-default .cm-qualifier {color: #555;}
.cm-s-default .cm-builtin {color: #30a;}
.cm-s-default .cm-bracket {color: #997;}
.cm-s-default .cm-tag {color: #170;}
.cm-s-default .cm-attribute {color: #00c;}
.cm-s-default .cm-header {color: blue;}
.cm-s-default .cm-quote {color: #090;}
.cm-s-default .cm-hr {color: #999;}
.cm-s-default .cm-link {color: #00c;}

.cm-negative {color: #d44;}
.cm-positive {color: #292;}
.cm-header, .cm-strong {font-weight: bold;}
.cm-em {font-style: italic;}
.cm-link {text-decoration: underline;}

.cm-s-default .cm-error {color: #f00;}
.cm-invalidchar {color: #f00;}

/* Default styles for common addons */

div.CodeMirror span.CodeMirror-matchingbracket {color: #0f0;}
div.CodeMirror span.CodeMirror-nonmatchingbracket {color: #f22;}
.CodeMirror-matchingtag { background: rgba(255, 150, 0, .3); }
.CodeMirror-activeline-background {background: #e8f2ff;}

/* STOP */

/* The rest of this file contains styles related to the mechanics of
   the editor. You probably shouldn't touch them. */

.CodeMirror {
  line-height: 1;
  position: relative;
  overflow: hidden;
  background: white;
  color: black;
}

.CodeMirror-scroll {
  /* 30px is the magic margin used to hide the element's real scrollbars */
  /* See overflow: hidden in .CodeMirror */
  margin-bottom: -30px; margin-right: -30px;
  padding-bottom: 30px;
  height: 100%;
  outline: none; /* Prevent dragging from highlighting the element */
  position: relative;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}
.CodeMirror-sizer {
  position: relative;
  border-right: 30px solid transparent;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
}

/* The fake, visible scrollbars. Used to force redraw during scrolling
   before actuall scrolling happens, thus preventing shaking and
   flickering artifacts. */
.CodeMirror-vscrollbar, .CodeMirror-hscrollbar, .CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
  position: absolute;
  z-index: 6;
  display: none;
}
.CodeMirror-vscrollbar {
  right: 0; top: 0;
  overflow-x: hidden;
  overflow-y: scroll;
}
.CodeMirror-hscrollbar {
  bottom: 0; left: 0;
  overflow-y: hidden;
  overflow-x: scroll;
}
.CodeMirror-scrollbar-filler {
  right: 0; bottom: 0;
}
.CodeMirror-gutter-filler {
  left: 0; bottom: 0;
}

.CodeMirror-gutters {
  position: absolute; left: 0; top: 0;
  padding-bottom: 30px;
  z-index: 3;
}
.CodeMirror-gutter {
  white-space: normal;
  height: 100%;
  -moz-box-sizing: content-box;
  box-sizing: content-box;
  padding-bottom: 30px;
  margin-bottom: -32px;
  display: inline-block;
  /* Hack to make IE7 behave */
  *zoom:1;
  *display:inline;
}
.CodeMirror-gutter-elt {
  position: absolute;
  cursor: default;
  z-index: 4;
}

.CodeMirror-lines {
  cursor: text;
}
.CodeMirror pre {
  /* Reset some styles that the rest of the page might have set */
  -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0;
  border-width: 0;
  background: transparent;
  font-family: inherit;
  font-size: inherit;
  margin: 0;
  white-space: pre;
  word-wrap: normal;
  line-height: inherit;
  color: inherit;
  z-index: 2;
  position: relative;
  overflow: visible;
}
.CodeMirror-wrap pre {
  word-wrap: break-word;
  white-space: pre-wrap;
  word-break: normal;
}

.CodeMirror-linebackground {
  position: absolute;
  left: 0; right: 0; top: 0; bottom: 0;
  z-index: 0;
}

.CodeMirror-linewidget {
  position: relative;
  z-index: 2;
  overflow: auto;
}

.CodeMirror-widget {}

.CodeMirror-wrap .CodeMirror-scroll {
  overflow-x: hidden;
}

.CodeMirror-measure {
  position: absolute;
  width: 100%;
  height: 0;
  overflow: hidden;
  visibility: hidden;
}
.CodeMirror-measure pre { position: static; }

.CodeMirror div.CodeMirror-cursor {
  position: absolute;
  border-right: none;
  width: 0;
}

div.CodeMirror-cursors {
  visibility: hidden;
  position: relative;
  z-index: 1;
}
.CodeMirror-focused div.CodeMirror-cursors {
  visibility: visible;
}

.CodeMirror-selected { background: #d9d9d9; }
.CodeMirror-focused .CodeMirror-selected { background: #d7d4f0; }
.CodeMirror-crosshair { cursor: crosshair; }

.cm-searching {
  background: #ffa;
  /* @alternate */ background: rgba(255, 255, 0, .4);
}

/* IE7 hack to prevent it from returning funny offsetTops on the spans */
.CodeMirror span { *vertical-align: text-bottom; }

/* Used to force a border model for a node */
.cm-force-border { padding-right: .1px; }

@media print {
  /* Hide the cursor when printing */
  .CodeMirror div.CodeMirror-cursors {
    visibility: hidden;
  }
}