/*font*/
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap');

/*
/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
html {
    font-family: sans-serif;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}

body {
    margin: 0;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
    display: block;
}

audio,
canvas,
progress,
video {
    display: inline-block;
    vertical-align: baseline;
}

audio:not([controls]) {
    display: none;
    height: 0;
}

[hidden],
template {
    display: none;
}

a {
    background-color: transparent;
}

a:active,
a:hover {
    outline: 0;
}

abbr[title] {
    border-bottom: 1px dotted;
}

b,
strong {
    font-weight: bold;
}

dfn {
    font-style: italic;
}

h1 {
    margin: .67em 0;
    font-size: 2em;
}

mark {
    color: #000;
    background: #ff0;
}

small {
    font-size: 80%;
}

sub,
sup {
    position: relative;
    font-size: 75%;
    line-height: 0;
    vertical-align: baseline;
}

sup {
    top: -.5em;
}

sub {
    bottom: -.25em;
}

img {
    border: 0;
}

svg:not(:root) {
    overflow: hidden;
}

figure {
    margin: 1em 40px;
}

hr {
    height: 0;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}

pre {
    overflow: auto;
}

code,
kbd,
pre,
samp {
    font-family: monospace, monospace;
    font-size: 1em;
}

button,
input,
optgroup,
select,
textarea {
    margin: 0;
    font: inherit;
    color: inherit;
}

button {
    overflow: visible;
}

button,
select {
    text-transform: none;
}

button,
html input[type="button"],
input[type="reset"],
input[type="submit"] {
    -webkit-appearance: button;
    cursor: pointer;
}

button[disabled],
html input[disabled] {
    cursor: default;
}

button::-moz-focus-inner,
input::-moz-focus-inner {
    padding: 0;
    border: 0;
}

input {
    line-height: normal;
}

input[type="checkbox"],
input[type="radio"] {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    padding: 0;
}

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
    height: auto;
}

input[type="search"] {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    -webkit-appearance: textfield;
}

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
}

fieldset {
    padding: .35em .625em .75em;
    margin: 0 2px;
    border: 1px solid #c0c0c0;
}

legend {
    padding: 0;
    border: 0;
}

textarea {
    overflow: auto;
}

optgroup {
    font-weight: bold;
}

table {
    border-spacing: 0;
    border-collapse: collapse;
}

td,
th {
    padding: 0;
}

/* ------ end normalize css ------- */
* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

*:before,
*:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

html {
    font-size: 10px;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

body {
    font-family: 'Open Sans', sans-serif;
    font-size: 16px;
    line-height: 1.42857143;
    color: rgba(0, 0, 0, 0.8);
    background-color: #fff;
}

::selection {
    background-color: #0F89BB;
    color: #ffffff;
}

::-moz-selection {
    background-color: #0F89BB;
    color: #ffffff;
}

input,
button,
select,
textarea {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
}

a:link,
a:active,
a:visited {
    font-family: 'Open Sans', sans-serif;
    font-size: 16px;
    color: var(--bk-color-secondary, #E8631E);
    text-decoration: none;
}

body .widget-article a:hover,
body .widget-article a:focus {
    color: #0F89BB;
}

img {
    max-width: 100%;
    vertical-align: middle;
}

hr {
    margin-top: 20px;
    margin-bottom: 20px;
    border: 0;
    border-top: 1px solid #DFDFDF;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: inherit;
    color: inherit;
    font-weight: 600;
}

h1,
h2,
h3 {
    margin-top: 0;
    margin-bottom: 20px;
    padding-bottom: 0;
}

h4,
h5,
h6 {
    margin-top: 0;
    margin-bottom: 10px;
    padding-bottom: 0;
}

h1,
.widget h1 a {
    font-size: 42px;
}

h2,
.widget h2 a {
    font-size: 36px;
}

h3,
.widget h3 a {
    font-size: 28px;
}

h4,
.widget h4 a {
    font-size: 24px;
}

h5,
.widget h5 a {
    font-size: 20px;
}

h6,
.widget h6 a {
    font-size: 16px;
}

p {
    font-family: 'Open Sans', sans-serif;
    font-size: 16px;
    line-height: 1.42857143;
    color: #0C0C0C;
    margin: 0 0 20px;
    padding-bottom: 0;
}

ul,
ol {
    margin-bottom: 20px;
    padding: 0 0 0 15px;
}

ul li,
ol li {
    font-size: 16px;
    color: #0C0C0C;
    line-height: 1.8;
}

table {
    max-width: 100%;
    table-layout: inherit;
    margin-bottom: 20px;
}

table,
th,
td {
    border: 1px solid #D9D9D9;
    padding: 10px;
    text-align: left;
    font-size: 16px;
    color: #0C0C0C;
}

body input[type="submit"],
body input[type="button"],
body button,
body .button,
body a.button {
    background: var(--bk-color-primary, #176F92) none repeat scroll 0 0;
    border: medium none;
    color: #fff;
    cursor: pointer;
    display: inline-block;
    font-family: 'Open Sans', sans-serif;
    font-size: 18px;
    font-weight: 500;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    height: auto;
    padding: 15px 30px;
    transition: all 300ms ease 0s;
}

body input[type="submit"]:hover,
body input[type="button"]:hover,
body button:hover,
body .button:hover,
body a.button:hover {
    background: none #000000;
}

body input[type="submit"][disabled],
body input[type="button"][disabled],
body button[disabled],
body .button.disabled,
body a.button.disabled,
body input[type="submit"][disabled]:hover,
body input[type="button"][disabled]:hover,
body button[disabled]:hover,
body .button.disabled:hover,
body a.button.disabled:hover {
    background: #D9D9D9 none repeat scroll 0 0;
    border: medium none;
    color: #666;
}

.body .widget {
    margin-bottom: 15px;
}

/*form element desgin*/

.form-row {
    margin: 15px 0;
}

input[type="text"],
input[type="password"],
textarea,
select {
    border: 2px solid #878787;
    box-sizing: border-box;
    height: 50px;
    padding: 3px 14px;
    margin: 0;
    width: 350px;
    color: #000000;
    font-size: 16px;
}

input[type="text"],
input[type="password"],
textarea {
    transition: all 300ms ease-out;
}

input[type="text"]::-webkit-input-placeholder {
    color: #666666;
}

input[type="text"]::-moz-placeholder {
    color: #666666;
}

input[type="text"]:-ms-input-placeholder {
    color: #666666;
}

input[type="text"][type="text"]:-moz-placeholder {
    color: #666666;
}

input[type="password"]::-webkit-input-placeholder {
    color: #666666;
}

input[type="password"]::-moz-placeholder {
    color: #666666;
}

input[type="password"]:-ms-input-placeholder {
    color: #666666;
}

input[type="password"]:-moz-placeholder {
    color: #666666;
}

textarea::-webkit-input-placeholder {
    color: #666666;
}

textarea::-moz-placeholder {
    color: #666666;
}

textarea:-ms-input-placeholder {
    color: #666666;
}

textarea:-moz-placeholder {
    color: #666666;
}

input[type="text"]:focus,
input[type="password"]:focus,
textarea:focus {
    border: 2px solid #0F89BB;
}

input[type="text"],
input[type="password"],
textarea,
select {
    width: 350px;
}

select,
.registration-form select {
    width: 350px;
}

select {
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    border-color: #878787;
    height: 50px;
    border-width: 2px;
    font-family: inherit;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 3px 30px 3px 14px;
    border-radius: 0;
    background: url("/template/106fffdc/images/select-icon.webp") no-repeat right #fff;
    background-position-x: calc(100% - 10px);
    background-size: 12px;
}

select:focus {
    border: 2px solid #0F89BB;
}

textarea {
    height: 150px;
}

input[type="checkbox"]+span,
input[type="radio"]+span {
    margin-right: 20px;
}

input.error-field-error[type="text"],
input.error-field-error[type="password"],
textarea.error-field-error {
    border: 2px solid #ff0000;
}

/* Editor fix */
.widget p a:hover,
.widget li a:hover,
.widget th a:hover,
.widget td a:hover,
.widget h1 a:hover,
.widget h2 a:hover,
.widget h3 a:hover,
.widget h4 a:hover,
.widget h5 a:hover,
.widget h6 a:hover {
    color: #0F89BB;
}

.widget figure {
    margin: 0 0 20px;
}

/* snippet reset css */

.widget-snippet {
    font-family: 'Open Sans', sans-serif;
    font-size: 16px;
    line-height: 1.42857143;
    color: #0C0C0C;
}

.widget-snippet h1,
.widget-snippet h2,
.widget-snippet h3,
.widget-snippet h4,
.widget-snippet h5,
.widget-snippet h6 {
    font-family: 'Open Sans', sans-serif;
    color: #0C0C0C;
    font-weight: 600;
}

.widget-snippet h1,
.widget-snippet h2,
.widget-snippet h3 {
    margin-top: 0;
    margin-bottom: 20px;
    padding-bottom: 0;
}

.widget-snippet h4,
.widget-snippet h5,
.widget-snippet h6 {
    margin-top: 0;
    margin-bottom: 10px;
    padding-bottom: 0;
}

.widget-snippet h1,
.widget-snippet h1 a {
    font-size: 42px;
}

.widget-snippet h2,
.widget-snippet h2 a {
    font-size: 36px;
}

.widget-snippet h3,
.widget-snippet h3 a {
    font-size: 28px;
}

.widget-snippet h4,
.widget-snippet h4 a {
    font-size: 24px;
}

.widget-snippet h5,
.widget-snippet h5 a {
    font-size: 20px;
}

.widget-snippet h6,
.widget-snippet h6 a {
    font-size: 16px;
}

.widget-snippet p {
    font-family: 'Open Sans', sans-serif;
    font-size: 16px;
    line-height: 1.42857143;
    color: #0C0C0C;
    margin: 0 0 20px;
    padding-bottom: 0;
}

.widget-snippet a:focus,
.widget-snippet a:hover {
    outline: none;
    text-decoration: none;
}

.widget-snippet table,
.widget-snippet th,
.widget-snippet td {
    border: 1px solid #D9D9D9;
    padding: 10px;
    text-align: left;
    font-size: 16px;
    color: #0C0C0C;
}

/* ===============================================  LAYOUT DESIGN  =============================================== */
.fixed-width>div {
    border-left: 1px solid #ddd;
    border-right: 1px solid #ddd;
    margin: auto;
    width: 1600px;
}

@media (max-width: 1300px) {
    .fixed-width>div {
        border: 0;
        width: auto;
    }
}

div.iframe-mask {
    z-index: 0;
}

body>.body {
    padding: 0;
}

.body .widget.spaceLeftRight {
    padding-left: 15px;
    padding-right: 15px;
}

.widget-container>.page-content>.v-split-container>.v-split {
    margin: auto;
    width: 1430px;
}

.widget-container>.page-content>.v-split-container>.v-split .widget,
.widget-container>.page-content>.v-split-container>.v-split .widget.widget-snippet.spaceLeftRight {
    padding-left: 15px;
    padding-right: 15px;
}

.widget-container>.page-content>.v-split-container>.v-split .widget.widget-snippet,
.widget-container>.page-content>.v-split-container>.v-split .widget.noSpaceLeftRight {
    padding-left: 0;
    padding-right: 0;
}

/* --------------------Fixed layout ------------------ */

div#bs-AE75DB85-B46B-46A7-9558-C5D5A876623B {
    padding-top: 30px;
    padding-bottom: 30px;
}

#bs-1B4E7967-7C12-4BAB-9519-444C0E83CB1F .widget-container>.page-content>.v-split-container>.v-split {
    width: auto;
}

div#bs-1B4E7967-7C12-4BAB-9519-444C0E83CB1F {
    padding-bottom: 100px;
}

@media(max-width: 767px) {
    div#bs-AE75DB85-B46B-46A7-9558-C5D5A876623B {
        padding-top: 15px;
        padding-bottom: 15px;
    }

    div#bs-1B4E7967-7C12-4BAB-9519-444C0E83CB1F {
        padding-bottom: 50px;
    }
}

@media(max-width: 575px) {
    div#bs-1B4E7967-7C12-4BAB-9519-444C0E83CB1F {
        padding-bottom: 30px;
    }
}


/* --- Fixed layout   END */
.auto-page.page-newsletter-subscription .newsletter.subscribe.valid-verify-form .form-row:nth-last-of-type(5) 
{
  display: none
}

/* --------------------Left sidebar layout ------------------ */
div#bs-CBAF18B4-1791-432A-9542-D0268E147E7B {
    padding-top: 30px;
    padding-bottom: 30px;
}

#bs-CBAF18B4-1791-432A-9542-D0268E147E7B .widget-container {
    padding-left: 15px;
    padding-right: 15px;
}

#bs-E140A193-073A-4167-8639-60798CC90302 .widget-container {
    padding-left: 15px;
    padding-right: 15px;
}

#spltr-8D83763E-CBE9-48D9-9576-44617F761408 {
    padding-right: 30px;
}

#spltr-DB91B46D-59DD-4C7C-B1AA-316FE388D585 {
    padding-left: 30px;
}

div#bs-E140A193-073A-4167-8639-60798CC90302 {
    padding-bottom: 100px;
}

@media(max-width: 991px) {
    #spltr-8D83763E-CBE9-48D9-9576-44617F761408 {
        padding-right: 15px;
    }

    #spltr-DB91B46D-59DD-4C7C-B1AA-316FE388D585 {
        padding-left: 15px;
    }

    div#bs-E140A193-073A-4167-8639-60798CC90302 {
        padding-bottom: 50px;
    }
}

@media(max-width: 767px) {
    #spltr-8D83763E-CBE9-48D9-9576-44617F761408 {
        padding-right: 0;
    }

    #spltr-DB91B46D-59DD-4C7C-B1AA-316FE388D585 {
        padding-left: 0;
    }

    div#bs-CBAF18B4-1791-432A-9542-D0268E147E7B {
        padding-top: 15px;
        padding-bottom: 15px;
    }
}

@media(max-width: 575px) {
    div#bs-E140A193-073A-4167-8639-60798CC90302 {
        padding-bottom: 30px;
    }
}

/* --------------------Left sidebar layout END ------------------ */



/* __________________/  END LAYOUT DESIGN  \___________________ */


/* =============================================== HEDER DESIGN ===============================================*/
body::before {
    background-color: #F9C227;
    content: "";
    height: 34px;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}

body>.header::before {
    background-color: #F6F6F6;
    content: "";
    height: 70px;
    left: 0;
    position: absolute;
    right: 0;
    bottom: 0;
}

.configure-to-order p,
.configure-to-order p a {
    font-family: 'Open Sans';
    line-height: 24px;
}

.configure-to-order p {
    margin: 0;
    text-align: center;
    font-weight: 400;
    font-size: 14px;
    color: #000000;
}

.configure-to-order p a,
.configure-to-order p a:focus {
    font-weight: 700;
    color: #000000;
    text-decoration: underline;
    text-transform: uppercase;
    font-size: 14px;
    cursor: pointer;
}

.configure-to-order p a:hover {
    color: var(--bk-color-primary, #176F92);
}

/* ----------------------- Top navigation ----------------------------- */

.widget-navigation.top-nav .nav-wrapper {
    border-left: 1px solid #000000;
    padding-left: 20px;
}

.widget-navigation.top-nav .nav-wrapper a {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 600;
    font-size: 15px;
    line-height: 20px;
    letter-spacing: 0.03em;
    color: #2C2C2C;
    padding: 5px 14px;
}

.widget-navigation.top-nav .nav-wrapper a:hover,
.widget-navigation.top-nav .nav-wrapper .active a {
    color: var(--bk-color-primary, #176F92);
}

/* ----------------------- cart ----------------------------- */

.cart-wrapper.advanced-flying-cart {
    cursor: pointer;
}

.cart-wrapper.advanced-flying-cart .cart-widget-img {
    height: 24px;
    width: 20px;
    background-image: url("/template/106fffdc/images/cart-icon.svg");
    background-repeat: no-repeat;
    background-position: 0 0;
    transition: all 300ms ease-out;
}

.cart-wrapper.advanced-flying-cart:hover .cart-widget-img {
    background-position: 0 -40px;
}

.cart-wrapper.advanced-flying-cart .cart-widget-text {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 600;
    font-size: 15px;
    line-height: 20px;
    letter-spacing: 0.03em;
    color: #2C2C2C;
    margin-left: 6px;
}

.cart-wrapper.advanced-flying-cart:hover .cart-widget-text {
    color: var(--bk-color-primary, #176F92);
}

/* ----------------------- User Navigation ----------------------------- */

.widget-navigation.user-nav .responsive-menu-btn {
    width: auto;
}

.widget-navigation.user-nav .responsive-menu-btn:before {
    content: "";
    width: 22px;
    height: 22px;
    background-image: url("/template/106fffdc/images/user-icon.svg");
    background-repeat: no-repeat;
    background-position: 0 0;
    display: inline-block;
    vertical-align: -5px;
    transition: all 300ms ease-out 0s;
}

.widget-navigation.user-nav .menu-title:hover .responsive-menu-btn:before,
.widget-navigation.user-nav .responsive-menu-btn.close:before {
    background-position: 0 -40px;
}

.widget-navigation.user-nav .responsive-menu-btn:after {
    content: "Login/Register";
    display: inline-block;
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 600;
    font-size: 15px;
    line-height: 20px;
    letter-spacing: 0.03em;
    color: #2C2C2C;
    margin-left: 9px;
}

.widget-navigation.user-nav .menu-title:hover .responsive-menu-btn:after,
.widget-navigation.user-nav .menu-title .responsive-menu-btn.close:after {
    color: var(--bk-color-primary, #176F92);
}

.widget-navigation.user-nav .menu-button em {
    display: none;
}

.widget-navigation.user-nav .responsive-navigation {
    height: auto;
    box-shadow: 0 0 10px 10px rgba(0, 0, 0, .05);
    top: 34px;
    padding: 12px 15px;
    background-color: #ffffff;
    left: -51px;
    width: 250px;
}
.widget-navigation .navigation-item .nav-profile-not-logged-in>.autoGeneratedPage {
    background-color: var(--bk-color-primary, #176f92);
    padding: 8px 42px !important;
    font-size: 14px !important;
    color: #fff !important;
}
.widget-navigation .navigation-item .nav-profile-not-logged-in>.autoGeneratedPage:hover {
    background-color: #000;  
}
.widget-navigation.user-nav .responsive-navigation:after {
    content: "";
    height: 0;
    width: 0;
    border-style: solid;
    border-width: 0px 10px 10px 10px;
    border-color: transparent transparent #ffffff transparent;
    position: absolute;
    right: calc(50% - 5px);
    top: -10px;
}

.widget-navigation.user-nav .responsive-navigation .navigation-item {
    padding: 5px 0;
}

.widget-navigation.user-nav .responsive-navigation .navigation-item~.navigation-item {
    border-top: 1px #e4e4e4 solid;
}

.widget-navigation.user-nav .responsive-navigation .navigation-item a {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 600;
    font-size: 16px;
    line-height: 20px;
    letter-spacing: 0.03em;
    color: #2C2C2C;
    padding: 5px;
}

.widget-navigation.user-nav .responsive-navigation .navigation-item a:hover {
    color: var(--bk-color-primary, #176F92);
}
.errorlist.after {
    font-size: 14px;
}
.shopping-cart .product-card__product-name a:hover, .shopping-cart .order-summary-card__add-promo-codes .text-align:hover, .shopping-cart .order-summary-card .continue-shopping .continue-shopping-btn:hover, .checkout-page.version-2 .advance-checkout-order-details-right-dom .product-name .customer-canvas-designed-edit:hover, .checkout-page.version-2 .advance-checkout-order-details-left-dom-inner .login-btn-from-checkout:hover, .checkout-page.version-2 .advance-checkout-order-details-right-dom .product-name a:hover, .checkout-page.version-2 .order-summary-panel .cart-edit-button a:hover, .checkout-page.version-2 .advance-checkout-order-details-right-dom-inner .add-promo-codes .text-align:hover {
    color: var(--bk-color-primary, #176f92);
}
.shopping-cart .order-summary-card .proceed-to-checkout .checkout-btn:hover {
    background-color: var(--bk-color-primary, #176f92);
    color: #fff;
}
.fee-editor-active .widget-navigation {
  position: absolute !important;
}
/* ----------------------- Main menu ----------------------------- */
@media(min-width: 992px) {
    .main-menu .horizontal>.navigation-item>a {
        font-family: 'Open Sans';
        font-style: normal;
        font-weight: 600;
        font-size: 16px;
        line-height: 22px;
        letter-spacing: 0.03em;
        text-transform: uppercase;
        color: #000000;
        padding: 24px 0;
        margin-right: 34px;
        position: relative;
    }

    .main-menu .horizontal>.navigation-item>a:hover,
    .main-menu .horizontal>.navigation-item.active>a {
        color: var(--bk-color-primary, #176F92);
    }

    .main-menu .horizontal>.navigation-item.last>a {
        margin-right: 0;
    }

    .main-menu .horizontal>.navigation-item>a:after {
        content: "";
        height: 5px;
        width: 0;
        position: absolute;
        background-color: var(--bk-color-primary, #176F92);
        left: 0;
        bottom: 0;
        transition: all 300ms ease-out;
    }

    .main-menu .horizontal>.navigation-item>a:hover:after,
    .main-menu .horizontal>.navigation-item.active>a:after {
        width: 100%;
    }

    .main-menu .horizontal .navigation-item.has-child {
        position: static;
    }

    .main-menu .horizontal>.has-child>.navigation-item-child-container {
        top: 70px;
        left: 0;
        width: calc(100% + 440px);
        padding: 48px 70px;
        border-top: 2px #000 solid;
        border-bottom: 6px solid var(--bk-color-primary, #176F92);
    }

    .main-menu .horizontal>.has-child>.navigation-item-child-container .navigation-item {
        padding: 0;
    }

    .main-menu .horizontal>.has-child>.navigation-item-child-container>.navigation-item.first>a {
        font-family: 'Open Sans';
        font-style: normal;
        font-weight: 700;
        font-size: 33px;
        line-height: 45px;
        letter-spacing: 0.03em;
        text-transform: uppercase;
        color: var(--bk-color-primary, #176F92);
        border-bottom: 2px solid var(--bk-color-primary, #176F92);
        padding-bottom: 15px;
    }

    .main-menu .horizontal>.has-child>.navigation-item-child-container>.navigation-item>a {
        border: none;
        padding: 0;
        font-family: 'Open Sans';
        font-style: normal;
        font-weight: 400;
        font-size: 17px;
        line-height: 38px;
        letter-spacing: 0.02em;
        color: #000000;
    }
    .main-menu .horizontal .navigation-item-1.submenu {
        overflow-y: auto;
        max-height: 450px;
    }
    .main-menu .horizontal .navigation-item.submenu {
        padding: 0 !important;
        width: auto;
    }
    .horizontal>.navigation-item>.navigation-item-child-container>.navigation-item>.navigation-item-child-container {
        left: 0;
        position: absolute;
        top: 0;
        width: 100%;
    }
    .horizontal .navigation-item .navigation-item-child-container .navigation-item a {
        display: block;
        position: relative;
        border-bottom: 1px #e6e6e6 solid;
        font-size: 22px;
        padding: 10px 20px;
        color: var(--bk-color-secondary, #E8631E);
        font-weight: 600;
        text-transform: uppercase;
        letter-spacing: 0.12em;
    }
    .horizontal .navigation-item .navigation-item-child-container .navigation-item a:hover{
        color: var(--bk-color-primary, #176F92);
    }
    .main-menu .horizontal .navigation-item.submenu>a {
        display: none;
    }
    .main-menu .horizontal .navigation-item.mega-menu>.navigation-item-child-container {
        display: flex;
        position: static;
        width: 100%;
    }
    .main-menu .horizontal .navigation-item.submenu .navigation-item-child-container {
        display: block;
        position: static;
        width: auto;
    }
    .main-menu .horizontal .navigation-item.submenu a {
        font-family: 'Open Sans';
        font-style: normal;
        font-weight: 400;
        font-size: 17px;
        line-height: 38px;
        letter-spacing: 0.02em;
        color: #000000;
        padding: 0;
        border: none;
    }

    .main-menu .horizontal .navigation-item.submenu a:hover,
    .main-menu .horizontal .navigation-item.submenu .active a {
        color: var(--bk-color-primary, #176F92);
    }

    .main-menu .horizontal .navigation-item.submenu .submenu-title a {
        font-weight: 700;
        font-size: 18px;
        line-height: normal;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        color: var(--bk-color-primary, #176F92);
        margin-bottom: 12px;
        margin-top: 30px;
        pointer-events: none;
    }

    .main-menu .horizontal .navigation-item.submenu.noChild .submenu-title a {
        margin-top: 15px;
        pointer-events: inherit;
    }

    .main-menu .horizontal .navigation-item.submenu.noChild {
        margin-top: 25px;
    }

    .main-menu .horizontal .navigation-item.submenu>.navigation-item-child-container .navigation-item-child-container {
        padding-left: 20px;
    }

    .main-menu .horizontal .navigation-item.submenu>.navigation-item-child-container .navigation-item-child-container a {
        font-size: 15px;
    }

}

/* ----------------------- Header search ----------------------------- */


/* ----------------------- Header Currency ----------------------------- */
.currency-widget p {
    margin: 0;
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 600;
    font-size: 15px;
    line-height: 20px;
    letter-spacing: 0.03em;
    color: #2C2C2C;
    border-left: 1px #000000 solid;
    padding: 5px 0 5px 64px;
}

.currency-widget p:after {
    content: "";
    width: 24px;
    height: 24px;
    position: absolute;
    background-image: url("/template/106fffdc/images/australia-flage.png");
    background-repeat: no-repeat;
    background-position: center;
    left: 29px;
    top: 3px;
}

/* ================================================ BODY DESIGN ================================================*/



/* 
** Login/Registration/Reset Password/Customer New Password Page Desgin
**-----------------------------------------------------------------------
*/

.page-login .login-form,
.password-reset-form,
.customer-new-password,
.registration-form {
    position: relative;
    margin: 0 auto;
    background-color: #ffffff;
    border: 1px solid #d6d6d6;
    padding: 50px;
}

.page-login .login-form,
.password-reset-form,
.customer-new-password {
    max-width: 550px;
    width: 100%;
}

.registration-form {
    max-width: 900px;
}

.login-form .title,
.registration-form .title,
.password-reset-form .title,
.customer-new-password .title {
    font-size: 32px;
    line-height: 44px;
    font-weight: 600;
    padding-bottom: 20px;
    color: #0C0C0C;
    text-transform: uppercase;
    letter-spacing: .01em;
}

.page-login .login-form label,
.password-reset-form .form-row label,
.customer-new-password .form-row label,
.registration-form label {
    font-family: 'Open Sans', sans-serif;
    font-size: 17px;
    color: #2C2C2C;
    display: block;
    text-transform: capitalize;
    width: 100%;
    padding-bottom: 5px;
}

/* label hide */
.page-login .login-form label,
.customer-new-password .submit-row label,
.registration-form .submit-row label {
    display: none;
}

.login-form input[type="text"],
.login-form input[type="password"],
.password-reset-form .form-row input,
.customer-new-password input[type="text"],
.customer-new-password input[type="password"],
.registration-form input[type="text"],
.registration-form input[type="password"],
.registration-form select {
    width: 100%;
    background-color: #ffffff;
}

.login-form .form-row,
.password-reset-form .form-row,
.customer-new-password .form-row,
.registration-form .form-row {
    display: block;
    margin: 0;
    padding-bottom: 20px;
    position: relative;
}

.login-form .form-row:last-child,
.password-reset-form .form-row:last-child,
.customer-new-password .form-row:last-child,
.registration-form .form-row:last-child {
    padding-bottom: 0;
}

.password-reset-form .form-row.submit-row button,
.customer-new-password .form-row button,
.registration-form .form-row button {
    margin: 0;
    width: 100%;
}

/* Validation Error Message */
.login-form .errorlist.after,
.password-reset-form .errorlist.after,
.customer-new-password .errorlist.after,
.registration-form .errorlist.after {

}
.registration-form .errorlist.after {
  position: absolute;
  font-size: 13px;
}
.page-registration .registration-form .form-row ~ .form-row {
  margin-top: 0;
}
.page-registration .registration-form {
  max-width: 700px;
  padding:45px 25px
}
.page-registration .registration-form .submit-row button {
  margin-top: 15px;
}
/* -----------------------------------
    Login Page 
--------------------------------------*/

.login-form .remember {
    font-family: 'Open Sans', sans-serif;
    font-size: 17px;
    color: #2C2C2C;
}

.login-form .lost-password a {
    color: #666666;
    margin-top: 0;
    display: inline-block;
    font-weight: normal;
    font-size: 16px;
    text-decoration: underline;
}

.login-form .lost-password a:hover {
    color: var(--bk-color-secondary, #E8631E);
}
.page-login .login-form .form-row ~ .form-row {
 margin: 15px 0;
  padding: 0;
}
.login-form .no-account-label,
.login-form .account-register a {
    color: #2C2C2C;
    font-size: 18px;
}

.login-form .account-register a {
    font-weight: 600;
}

.login-form .account-register a:hover {
    color: var(--bk-color-secondary, #E8631E);
}

.login-form .submit-row {
    margin: 0px 0 0;
    float: none;
    display: block;
}

.login-form .remember input {
    margin-right: 5px;
    margin-top: -4px;
}

.login-form .remember+.form-row {
    padding: 0;
}
.page-login .login-form .account-register a, .page-login .login-form .lost-password a {
  font-size: 18px;
}
/* ----- Login Page | END ------------ */


/* -----------------------------------
    Reset Password Page 
--------------------------------------*/
.password-reset-form .lost-password-text {
    padding: 0 0 5px 0;
    color: #2C2C2C;
    font-weight: normal;
    font-size: 17px;
    margin-bottom: 20px;
    text-align: left;
}

/* ----- Reset Password Page | END ------------ */


/* -----------------------------------
    Registration Page 
--------------------------------------*/
.registration-form .title {
    padding-left: 20px;
}

.registration-form>.form-row:not(.submit-row) {
    width: 50%;
    float: left;
    position: relative;
    padding-left: 15px;
    padding-right: 15px;
    z-index: 1;
}

.registration-form .form-row.submit-row {
    padding: 0 15px;
}

.registration-form:after {
    content: "";
    display: table;
    clear: both;
}

.registration-form .password-meter-wrap {
    position: absolute;
    bottom: 86px;
    right: 15px;
    margin: 0;
    text-align: right;
    width: auto;
}

.registration-form .password-meter-wrap>div {
    display: inline-block;
}

.registration-form .password-meter-wrap .password-description {
    font-size: 13px;
    margin-right: 7px;
}

.registration-form .password-meter-wrap .password-strength-bar {
    border-radius: 0;
    height: 8px;
    float: none;
}

/* ----- Registration Page  | END ------------ */

/* ======== customer login/registration/reset password responsive ================= */
@media(max-width: 767px) {
    .registration-form {
        padding: 0;
        border: none;
        box-shadow: none;
    }

}

@media(max-width: 575px) {

    .page-login .login-form,
    .password-reset-form,
    .customer-new-password {
        padding: 0;
        border: none;
        box-shadow: none;
    }

    .login-form .title,
    .registration-form .title,
    .password-reset-form .title,
    .customer-new-password .title {
        font-size: 25px;
        line-height: 30px;
        padding-bottom: 10px;
        padding-left: 0;
    }

    .page-login .login-form .login-button {
        width: 100%;
    }

    .page-registration .registration-form>.form-row {
        padding-left: 0;
        padding-right: 0;
    }

    .registration-form>.form-row:not(.submit-row) {
        width: 100%;
    }
}

/* --- Login/Registration/Reset Password/Customer New Password Page Desgin | END --- */


























/* ----------------------------------------------------
    Product Card design
-------------------------------------------------------*/

.product-view.image-view .product-block,
.product-view.scrollable-view .product-block {
    border: none;
    padding: 30px;
    background: var(--bk-color-surface, #fbfbfb);
    transition: all 300ms ease-out;
    margin: 15px;
}

.product-view.image-view .product-block:hover,
.product-view.scrollable-view .product-block:hover {
    box-shadow: 0px 0px 32px rgba(0, 0, 0, 0.14);
}

.product-view.image-view .content {
    display: flex;
    flex-wrap: wrap;
}

.product-view.scrollable-view img,
.product-view.image-view img {
    max-width: 100%;
}

.sale-percent-display {
    border-radius: 0;
    background-color: #F9C227;
    color: rgba(0, 0, 0, 0.8);
}

.product-block a.product-name-link.title-link.link {
    font-family: 'Open Sans';
    font-weight: 700;
    font-size: 16px;
    line-height: 25px;
    color: rgba(0, 0, 0, 0.8);
}

.product-block .current-price.price {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 700;
    font-size: 24px;
    line-height: 28px;
    color: var(--bk-color-primary, #176F92);
}

.product-block .current-price.price .tax-message {
    font-size: 13px;
    font-weight: 400;
}

.product-block .add-to-cart-button {
    background: none;
    width: 100%;
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: normal;
    letter-spacing: 0.17em;
    text-transform: uppercase;
    color: #000000;
    border: 2px solid #000000;
    padding: 14px 30px;
}

.product-block .add-to-cart-button:hover {
    background: var(--bk-color-primary, #176F92);
    border: 2px solid var(--bk-color-primary, #176F92);
    color: #ffffff;
}

.product-block .product-image {
    margin-bottom: 20px;
}

.product-view.image-view .product-name,
.product-view.scrollable-view .product-name {
    margin: 0 0 20px;
    height: 50px;
    overflow: hidden;
}

.product-block .price-waper {
    padding-bottom: 20px;
    display: flex;
    align-items: center;
}

.product-block .price-waper .previous-price.price {
    order: 1;
    margin-left: 5px;
    padding: 0;
}

.product-view.scrollable-view>.content {
    padding: 0;
    margin-left: -32px;
    margin-right: -32px;
    border: none;
    padding: 10px;
}

.product-view.scrollable-view {
    overflow: visible;
    border: none;
}

.product-view.scrollable-view .header {
    border: none;
}

.product-view.scrollable-view .header {
    overflow: visible;
    height: 0;
}

.product-view.scrollable-view .header .scroller {
    float: none;
    height: 0;
}

.product-view.scrollable-view .header .scroll-left,
.product-view.scrollable-view .header .scroll-right {
    background: #FFFFFF;
    width: 46px;
    height: 45px;
    border: 1px solid var(--bk-color-primary, #176F92);
    transition: all 300ms ease-out 0s;
    position: absolute;
    top: 50%;
    margin-top: -22px;
}

.product-view.scrollable-view .header .scroll-left:hover,
.product-view.scrollable-view .header .scroll-right:hover {
    background: var(--bk-color-primary, #176F92) !important;
    border: 1px solid var(--bk-color-primary, #176F92) !important;
}

.product-view.scrollable-view .header .scroll-left:after,
.product-view.scrollable-view .header .scroll-right:after {
    content: "";
    width: 16px;
    height: 13px;
    position: absolute;
    top: 14px;
    background-repeat: no-repeat;
}

.product-view.scrollable-view .header .scroll-left:after {
    background-image: url("/template/106fffdc/images/product-scroll-left-arrow.svg");
    left: 13px;
}

.product-view.scrollable-view .header .scroll-right:after {
    background-image: url("/template/106fffdc/images/product-scroll-right-arrow.svg");
    left: 15px;
}

.product-view.scrollable-view .header .scroll-left:hover:after {
    background-image: url("/template/106fffdc/images/product-scroll-left-arrow-hover.svg");
    left: 13px;
}

.product-view.scrollable-view .header .scroll-right:hover:after {
    background-image: url("/template/106fffdc/images/product-scroll-right-arrow-hover.svg");
    left: 15px;
}

.product-view.scrollable-view .header .scroll-left {
    left: -68px;
}

.product-view.scrollable-view .header .scroll-right {
    right: -68px;
}

@media(max-width:991px) and (min-width: 768px) {
    #spltr-DB91B46D-59DD-4C7C-B1AA-316FE388D585 .image-view .product-view-height-width {
               width: calc(100% / 2 - 10px);
        padding: 15px;
    }

    #spltr-DB91B46D-59DD-4C7C-B1AA-316FE388D585 .image-view .product-view-height-width .image {
        height: 147px;
    }
}

/* -------------------- Product Card design END --------------------------------*/


/* ----------------------------------------------------
    Pagination design
-------------------------------------------------------*/
.product-view .footer,
.category-view .footer,
.entire-search .footer,
.product-search .footer {
    background: none;
    border: none;
    overflow: hidden;
    border-top: 1px #DFDFDF solid;
    padding-top: 15px;
}

.pagination span {
    font-size: 18px;
    font-weight: 500;
    line-height: 21px;
    color: #1C1C1C;
    border-radius: 3px;
    vertical-align: middle;
    border: none;
    box-shadow: none;
    margin: 0 8px;
    padding: 4px 11px;
}

.pagination span:hover {
    color: #0F89BB;
}

.pagination span.disabled {
    opacity: .5;
}

.pagination span.first,
.pagination span.last {
    display: none;
}

.pagination span.prev,
.pagination span.next {
    width: 29px;
    height: 29px;
    font-size: 0;
    position: relative;
}

.pagination span.prev:after,
.pagination span.next:after {
    content: "";
    width: 8px;
    height: 14px;
    position: absolute;
    top: 0;

}

.pagination span.prev:after,
.pagination span.next:after {
    content: "";
    width: 8px;
    height: 14px;
    position: absolute;
    top: 7px;
    left: 11px;
}

.pagination span.prev:after,
.pagination span.prev.disabled:hover:after {
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%228%22%20height%3D%2214%22%20viewBox%3D%220%200%208%2014%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath%20d%3D%22M7.71364%200.241416C7.34459%20-0.0918646%206.76042%20-0.0784064%206.40887%200.271476L0.254646%206.39654C-0.0848824%206.73446%20-0.0848824%207.26554%200.254646%207.60346L6.40887%2013.7285C6.76042%2014.0784%207.34459%2014.0919%207.71364%2013.7586C8.0827%2013.4253%208.0969%2012.8715%207.74535%2012.5216L2.19746%207L7.74535%201.47839C8.0969%201.12851%208.0827%200.574696%207.71364%200.241416Z%22%20fill%3D%22black%22%20fill-opacity%3D%220.5%22%2F%3E %3C%2Fsvg%3E");
}

.pagination span.prev:hover:after {
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%228%22%20height%3D%2214%22%20viewBox%3D%220%200%208%2014%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath%20d%3D%22M7.71364%200.241416C7.34459%20-0.091865%206.76042%20-0.078406%206.40887%200.271476L0.254646%206.39654C-0.0848823%206.73446%20-0.0848823%207.26554%200.254646%207.60346L6.40887%2013.7285C6.76042%2014.0784%207.34459%2014.0919%207.71364%2013.7586C8.0827%2013.4253%208.0969%2012.8715%207.74535%2012.5216L2.19746%207L7.74535%201.47839C8.0969%201.12851%208.0827%200.574696%207.71364%200.241416Z%22%20fill%3D%22%230F89BB%22%2F%3E %3C%2Fsvg%3E");
}

.pagination span.next:after,
.pagination span.next.disabled:hover:after {
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%228%22%20height%3D%2214%22%20viewBox%3D%220%200%208%2014%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath%20d%3D%22M0.286356%200.241416C0.655415%20-0.0918646%201.23958%20-0.0784064%201.59113%200.271476L7.74535%206.39654C8.08488%206.73446%208.08488%207.26554%207.74535%207.60346L1.59113%2013.7285C1.23958%2014.0784%200.655415%2014.0919%200.286355%2013.7586C-0.0827039%2013.4253%20-0.0968998%2012.8715%200.254648%2012.5216L5.80254%207L0.254648%201.47839C-0.0968998%201.12851%20-0.0827038%200.574696%200.286356%200.241416Z%22%20fill%3D%22black%22%20fill-opacity%3D%220.5%22%2F%3E %3C%2Fsvg%3E");
}

.pagination span.next:hover:after {
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%228%22%20height%3D%2214%22%20viewBox%3D%220%200%208%2014%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath%20d%3D%22M0.286356%200.241416C0.655415%20-0.091865%201.23958%20-0.078406%201.59113%200.271476L7.74535%206.39654C8.08488%206.73446%208.08488%207.26554%207.74535%207.60346L1.59113%2013.7285C1.23958%2014.0784%200.655415%2014.0919%200.286355%2013.7586C-0.0827039%2013.4253%20-0.0968998%2012.8715%200.254648%2012.5216L5.80254%207L0.254648%201.47839C-0.0968998%201.12851%20-0.0827038%200.574696%200.286356%200.241416Z%22%20fill%3D%22%230F89BB%22%2F%3E %3C%2Fsvg%3E");
}

.pagination span.current {
    color: #ffffff;
    background-color: #0F89BB;
    background-image: none;
    border: none;
}

/* ----------------- Pagination design End ------------------ */



/* ----------------------------------------------------
    Category details 
-------------------------------------------------------*/
.category-details-container .title {
    font-family: 'Open Sans', sans-serif;
    font-weight: 300;
    font-size: 24px;
    line-height: 43px;
    color: #0C0C0C;
    border-bottom: 1px #DFDFDF solid;
    position: relative;
    padding-bottom: 10px;
    padding-right: 190px;
}

.category-details .product-container .title span {
    display: none;
}

.category-details .product-view .header {
    text-align: right;
    padding: 0;
    background: none;
    border: none;
    margin-top: -91px;
}

.product-view .sortable {
    margin: 0;
    position: relative;
}

.product-view.image-view .product-sorting {
    padding: 5px 15px;
    width: auto;
    height: 39px;
    border: 1px solid #DFDFDF;
    border-radius: 3px;
}

.product-view.image-view .content {
    margin-left: -15px;
    margin-right: -15px;
}

.category-details .product-view.image-view .content {
    margin-top: 40px;
}

/* ----------------- Category details End ------------------ */

/* ----------------------------------------------------
    Category navigation
-------------------------------------------------------*/
.category-nav .widget-title,
.widget-filter .widget-title {
    font-weight: 700;
    font-size: 24px;
    line-height: 33px;
    color: #000;
    position: relative;
    padding-bottom: 10px;
    margin-top: 10px;
    margin-bottom: 3px;
    text-transform: uppercase;
    letter-spacing: .01em;
    border-bottom: 1px #DFDFDF solid;
    margin-bottom: 20px;
}

.category-nav .navigation-item a {
    border: none;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 19px;
    padding: 7px 0;
    color: #2C2C2C;
      margin-bottom: 8px;
}

.category-nav .navigation-item a:hover,
.category-nav .navigation-item.active>a {
    color: var(--bk-color-primary, #176F92);
}

.widget-navigation.category-nav {
    margin-bottom: 50px;
}

.category-nav .vertical .navigation-item .navigation-item-child-container {
    padding-bottom: 10px;
}

.category-nav .navigation-item .navigation-item a {
    font-size: 15px;
    padding: 5px 0;
}

/* ----------------- Category navigation End ------------------ */


/* ----------------------------------------------------------------
    Add to cart popup 
-------------------------------------------------------------------*/

.popup {
    box-shadow: none;
    padding: 30px 50px;
    background: #fff;
    box-sizing: border-box;
}

.add-to-cart-popup.popup,
.wish-list-popup.add-to-wishlist-popup.popup,
.add-to-wish-list-popup.add-to-wishlist-popup,
.add-to-compare-popup.popup,
.add-cart-information-popup.popup,
.add-to-gift-registry-popup.popup {
    max-width: 680px;
    width: 100% !important;
}

.popup .header {
    background-color: #ffffff;
    border-bottom: 1px #dfdfdf solid;
    color: #333;
    padding: 5px 30px 20px 0;
}

.popup .close-icon,
.popup .header-line .icon.close {
    right: 20px;
    top: 22px;
}

.popup .close-icon::after,
.popup .close-icon::before,
.popup .header-line .icon.close::after,
.popup .header-line .icon.close::before {
    content: "";
    width: 2px;
    height: 30px;
    display: inline-block;
    background: #222222;
    position: absolute;
    top: 0;
}

.popup .close-icon::before,
.popup .header-line .icon.close::before {
    transform: rotate(-45deg);
}

.popup .close-icon::after,
.popup .header-line .icon.close::after {
    transform: rotate(45deg);
}

.add-to-cart-popup .status-bar-product-name,
.add-cart-information-popup .status-bar-product-name {
    font-size: 22px;
}

.add-to-cart-popup .status-message,
.add-cart-information-popup .status-message {
    font-size: 20px;
}

.popup .body {
    padding: 20px 0;
}

.popup .button-line,
.popup .footer {
    padding: 0 30px;
    border-top: 1px solid #dfdfdf;
    background: none;
    padding-top: 20px;
}

.add-to-cart-popup table tr,
.add-cart-information-popup table tr {
    display: flex;
    flex-direction: column;
    align-items: center;
    border: none;
}

.add-to-cart-popup table td,
.add-cart-information-popup table td {
    border: none;
    padding: 0;
    width: 100%;
}

.add-to-cart-popup table,
.add-cart-information-popup table {
    border: none;
    margin: 0;
}

.add-to-cart-popup td.product-img {
    padding: 0 0 20px;
    width: 100%;
    text-align: center;
}

.add-to-cart-popup table td.short-info,
.add-cart-information-popup table td.short-info {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.add-to-cart-popup .short-info .prodict-name,
.add-cart-information-popup .short-info .prodict-name {
    font-size: 18px;
    color: #2C2C2C;
    padding-bottom: 10px;
    text-align: center;
}

.add-to-cart-popup .short-info .item,
.add-cart-information-popup .short-info .item {
    display: flex;
    justify-content: center;
    padding-bottom: 10px;
}

.add-to-cart-popup .short-info .item>span,
.add-cart-information-popup .short-info .item>span {
    line-height: 36px;
    margin-right: 6px;
    color: #2c2c2c;
}

.add-to-cart-popup .short-info .stepper,
.add-cart-information-popup .short-info .stepper {
    float: none;
    margin: 0;
    display: flex;
    width: auto;
    border: 1px #d6d6d6 solid;
}

.add-to-cart-popup .stepper .stepper-input,
.add-cart-information-popup .stepper .stepper-input,
.add-to-cart-popup .stepper .stepper-arrow,
.add-cart-information-popup .stepper-arrow {
    float: none;
    margin: 0;
    height: 40px;
    width: 40px;
    padding: 0;
    position: static;
    border: none;
    background: none;
    text-align: center;
}

.add-to-cart-popup .stepper .stepper-arrow.up,
.add-to-cart-popup .stepper .stepper-arrow.down {
    text-indent: inherit;
    font-size: 0;
}

.add-to-cart-popup .stepper .stepper-arrow.up {
    order: -1;
}

.add-to-cart-popup .stepper .stepper-arrow.up:after,
.add-to-cart-popup .stepper .stepper-arrow.down:after {
    font-size: 18px;
    color: #2c2c2c;
    line-height: 38px;
    font-weight: 600;
}

.add-to-cart-popup .stepper .stepper-arrow.up:after {
    content: "+";
}

.add-to-cart-popup .stepper .stepper-arrow.down:after {
    content: "-";
}

.add-to-cart-popup .short-info .current-price,
.add-cart-information-popup .short-info .current-price {
    font-size: 18px;
    color: #2c2c2c;
}

.add-to-cart-popup .cart-summary-header,
.add-cart-information-popup .cart-summary-header {
    float: none;
    padding: 0;
    text-align: center;
    font-size: 16px;
    color: #2c2c2c;
}

.add-to-cart-popup .cart-summary,
.add-cart-information-popup .cart-summary {
    float: none;
    text-align: center;
    padding-bottom: 12px;
    font-size: 18px;
}

.add-to-cart-popup .button-item,
.add-cart-information-popup .button-item {
    display: flex;
}

.add-to-cart-popup .button-item>*,
.add-cart-information-popup .button-item>* {
    width: 50%;
    text-align: center;
    margin: 0 5px;
}

.add-to-cart-popup .button-item .button {
    font-size: 16px;
    padding: 10px 20px;
}

.add-to-cart-popup .button-item .continue-shopping-btn,
.add-cart-information-popup .button-item .continue-shopping-btn {
    border: 1px var(--bk-color-secondary, #E8631E) solid;
    background: no-repeat;
    color: var(--bk-color-secondary, #E8631E);
}
.add-to-cart-popup .button-item .continue-shopping-btn:hover,
.add-cart-information-popup .button-item .continue-shopping-btn:hover {
    background: var(--bk-color-secondary, #E8631E);
    color: #ffffff;
}

.add-to-cart-popup .product-thumb-view img,
.add-cart-information-popup .product-thumb-view img {
    max-height: inherit;
    max-width: inherit;
}

.add-cart-information-popup .header .title {
    font-size: 24px;
    font-weight: 700;
}

.add-cart-information-popup td.product-img {
    padding: 0 0 20px;
    text-align: center;
}

.add-to-cart-popup .short-info>div,
.add-cart-information-popup .short-info>div {
    padding-bottom: 10px;
}

.add-to-cart-popup .short-info>div.name,
.add-cart-information-popup .short-info>div.name {
    color: #0C0C0C;
    font-weight: 500;
    text-align: center;
}

.add-to-cart-popup .short-info>div.quantity,
.add-cart-information-popup .short-info>div.quantity {
    color: #0C0C0C;
    font-weight: 500;
}

.add-to-cart-popup .short-info>div.current-price,
.add-cart-information-popup .short-info>div.current-price {
    color: #0C0C0C;
    font-weight: 500;
    font-size: 22px;
}


.add-to-cart-popup h4.title,
.add-cart-information-popup h4.title {
    text-align: center;
    border: none;
    margin-top: 6px;
    font-weight: 600;
    font-size: 22px;
}

/* ------------------------------Add to cart popup END -----------------------------------*/

/*----------------------------------------------------
    Filter widget design 
------------------------------------------------------*/
.widget-filter a.reset-filter {
    font-size: 15px;
    font-weight: 600;
    text-decoration: underline;
    color: #2C2C2C;
}

.widget-filter a.reset-filter:hover {
    color: var(--bk-color-primary, #176F92);
    cursor: pointer;
}

.widget-filter .filter-profile .accordion-panel>.label-bar {
    display: flex;
    padding: 0;
    border: none;
    align-items: center;
    background: none;
    border-bottom: 1px #DFDFDF solid;
    padding-bottom: 12px;
}

.widget-filter .filter-profile .accordion-panel .label-bar label {
    flex: 1 1 auto;
    order: 1;
    font-weight: 600;
    font-size: 17px;
    line-height: 20px;
    color: #2C2C2C;
}

.widget-filter .filter-profile .accordion-panel .label-bar a.toggle-icon {
    order: 4;
    position: static;
    margin-left: 10px;
    width: 16px;
    height: 16px;
}

.widget-filter .filter-profile .accordion-panel .label-bar.expanded a.toggle-icon {
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath%20d%3D%22M16%2011.125L15.125%2012L8%204.875L0.875%2012L0%2011.125L8%203.125L16%2011.125Z%22%20fill%3D%22%232C2C2C%22%2F%3E %3C%2Fsvg%3E");
    background-position: 0 0;
}

.widget-filter .filter-profile .accordion-panel .label-bar.collapsed a.toggle-icon {
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath%20d%3D%22M0%204.875L0.875%204L8%2011.125L15.125%204L16%204.875L8%2012.875L0%204.875Z%22%20fill%3D%22%232C2C2C%22%2F%3E %3C%2Fsvg%3E");
    background-position: 0 0;
}

.widget-filter .filter-profile .accordion-panel .label-bar .numbers-of-selected {
    order: 3;
    color: #2c2c2c;
    margin-left: 6px;
}

.widget-filter .filter-profile .accordion-panel .label-bar .clear-selection {
    order: 2;
    text-decoration: underline;
}

.widget-filter .filter-profile .name {
    display: none;
}

.widget-filter .filter-group-item label {
    font-family: 'Rubik';
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 17px;
    color: #666666;
    flex: 1 1 auto;
}

.widget-filter .filter-group-item {
    display: flex;
    align-items: center;
}

.widget-filter .filter-group-item .filter-group-item-label-wrapper {
    margin: 0;
    display: flex;
    width: 100%;
}

.widget-filter .filter-group-item span {
    font-family: 'Rubik';
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 17px;
    color: #666666;
}

.widget-filter .filter-group .accordion-panel {
    padding: 0;
}

/* ----------------------- Filter widget design END --------------------- */

/* -----------------------------------------------------------------------
    Product details page
-------------------------------------------------------------------------*/


.widget-productImage .image-preview-box {
    padding: 20px;
      border: 1px solid rgba(223, 223, 223, 0.7);
}

.image-preview-box.product-detail-view>img {
    max-width: 100%;
    max-height: 100%;
}

.widget-productName h1.product-name {
    font-family: 'Open Sans', sans-serif;
    font-size: 26px;
    line-height: 36px;
    color: rgba(0, 0, 0, 0.8);
    margin: 0;
    font-weight: 700;
    max-width: 613px;
}

#spltr-96ff24bf-8e83-4924-bd85-926693cd3a57 {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
}

.product-widget.widget-productName {
    width: 100%;
    padding-bottom: 20px;
}

.product-widget.widget-productSku {
    width: 100%;
    padding-bottom: 15px;
}

.product-widget.widget-productSku label,
.product-widget.widget-productSku .value {
    font-size: 18px;
    font-weight: 400;
}

.product-widget.widget-productSku .value {
    font-weight: 600;
}
.product-widget.widget-variation {
    width: 100%;
    padding: 15px 0;
}
.product-widget.widget-variation .variation-container .variation-type {
    max-width: 370px;
}

.product-widget.widget-variation .variation-container .variation-dropdown-container .variation-type label.type-label {
    text-align: left;
}

.product-widget.widget-price {
	display: flex;
    align-items: baseline;
    width: 100%;
    padding: 20px 0 10px;
    border-top: 1px #DFDFDF solid;
    margin: 25px 0 0;
}
.widget-productCategory label{
    font-size: 18px;
}
.widget-productCategory{
    font-size: 16px;
}
.product-widget.widget-price .previous-price.price {
    font-size: 22px;
    color: #666;
    padding: 0;
    margin-left: 5px;
    order: 1;
}

.product-widget.widget-stockMark {
    width: 50%;
    text-align: right;
}

.product-widget.widget-stockMark .product-status.error {
    background: none;
    border: none;
    text-align: right;
    font-weight: 700;
}

.product-widget.widget-addCart {
    width: 100%;
    display: flex;
    justify-content:flex-start;
    padding-top: 42px;
    margin-top: 20px;
    border-top: 1px #DFDFDF solid;
}

.widget-price .price {
    font-weight: 500;
    font-size: 38px;
    line-height: 45px;
    color: var(--bk-color-primary, #176F92);
    padding: 0;
}
.product-widget.widget-productCategory {
    padding: 7px 0;
}
.product-widget.widget-stockMark .stock-mark {
    font-weight: 700;
    font-size: 18px;
    line-height: 24px;
    color: rgba(0, 0, 0, 0.8);
    margin-top: 7px;
    display: inline-block;
}

.product-widget.widget-stockMark .stock-mark:before {
    content: "";
    width: 22px;
    height: 22px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
}

.product-widget.widget-stockMark .stock-mark.available:before {
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2222%22%20height%3D%2222%22%20viewBox%3D%220%200%2022%2022%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cg%20clip-path%3D%22url%28%23clip0_211_1931%29%22%3E %3Cpath%20d%3D%22M10.9995%200.158661C5.01367%200.158661%200.158203%205.01413%200.158203%2011C0.158203%2016.9859%205.01367%2021.8414%2010.9995%2021.8414C16.9854%2021.8414%2021.8409%2016.9859%2021.8409%2011C21.8409%205.01413%2016.9854%200.158661%2010.9995%200.158661ZM16.6979%207.64514L10.8839%2016.2191C10.712%2016.4736%2010.4376%2016.6454%2010.1666%2016.6454C9.89558%2016.6454%209.59811%2016.4967%209.4064%2016.3083L5.99534%2012.8939C5.76397%2012.6626%205.76397%2012.2825%205.99534%2012.0511L6.83819%2011.2082C7.06956%2010.9769%207.44967%2010.9769%207.67773%2011.2082L9.89889%2013.4261L14.7246%206.3065C14.9097%206.03546%2015.2832%205.96605%2015.5542%206.14784L16.5425%206.81882C16.8102%207.00061%2016.883%207.37411%2016.6979%207.64514Z%22%20fill%3D%22%2307B44C%22%2F%3E %3C%2Fg%3E %3Cdefs%3E %3CclipPath%20id%3D%22clip0_211_1931%22%3E %3Crect%20width%3D%2222%22%20height%3D%2222%22%20fill%3D%22white%22%2F%3E %3C%2FclipPath%3E %3C%2Fdefs%3E %3C%2Fsvg%3E");
}
.widget-productImage .image-preview-box .vertical-aligner.img-preview-box-vertical-aligner {
    display: none;
}
.product-widget.widget-addCart .cart-button-container {
    width: 100%;
    display: flex;
    gap: 10px;
  flex-wrap: wrap;
}
.remove-from-compare-button, .product-widget .remove-from-compare-button, .product-widget.widget-addCart .button.add-to-wish-list, .product-widget.widget-addCart .add-to-compare-button.button {
  height: 62px;
  width: calc(100% - 52%) !important;
  border-radius: 6px;
}
.product-widget .remove-from-compare-button:hover {
  border: 2px solid var(--bk-color-primary, #176f92);
  background: var(--bk-color-primary, #176f92);
  color: #fff;
}
.product-widget.widget-addCart .button.add-to-wish-list:hover, .product-widget.widget-addCart .add-to-compare-button.button:hover {
  color: #fff;
}
.popup .close-icon::before,  .popup .close-icon::before, .popup .close-icon::after, .popup .close-icon::after {
  display:none !important;
}
/* incriment decriment stepper */
.product-widget.widget-addCart .stepper {
    margin: 0;
    float: none;
    background: #FFFFFF;
    border: 2px solid #000000;
    border-radius: 0;
    height: 64px;
    display: flex;
    width: calc(100% - 70%);
}

.product-widget.widget-addCart .stepper .product-quantity-selector {
    padding: 0;
    text-align: center;
    border: none;
    height: 57px;
    background: #ffffff;
    flex: 1 1 auto;
    order: 2;
    font-size: 24px;
    color: var(--bk-color-primary, #176F92);
    z-index: inherit;
}

.product-widget.widget-addCart .stepper .stepper-arrow {
    background: none;
    border: none;
    position: static;
    height: 64px;
    width: 39px;
    text-indent: inherit;
    font-size: 0;
    line-height: 64px;
    text-align: center;
    flex-grow: 0;
    flex-shrink: 0;
    position: relative;
}

.product-widget.widget-addCart .stepper .stepper-arrow.up {
    order: 3;
  position: relative !important;
}

.product-widget.widget-addCart .stepper .stepper-arrow.down {
    order: 1;
}

.product-widget.widget-addCart .stepper .stepper-arrow.up:after,
.product-widget.widget-addCart .stepper .stepper-arrow.up:before,
.product-widget.widget-addCart .stepper .stepper-arrow.down:after {
    position: absolute;
}

.product-widget.widget-addCart .stepper .stepper-arrow.up:after,
.product-widget.widget-addCart .stepper .stepper-arrow.up:before {
    content: "";
    width: 14px;
    height: 2px;
    background-color: #000;
    top: 28px;
    left: 12px;
}

.product-widget.widget-addCart .stepper .stepper-arrow.up:before {
    transform: rotate(90deg);
}

/* incriment decriment stepper END */
.product-widget.widget-addCart .stepper .stepper-arrow.down:after {
    content: "";
    width: 14px;
    height: 2px;
    background-color: #000;
    top: 28px;
    right: 10px;
}

.product-widget.widget-addCart .add-to-cart-button {
    font-weight: 500;
    font-size: 22px;
    line-height: 26px;
    text-transform: uppercase;
    color: #FFFFFF;
    padding: 19px 30px;
    width: calc(100% - 68%);
    text-align: center;
}
.product-widget.widget-addCart .stepper, .widget-addCart .buy-now-button, .product-widget.widget-addCart .add-to-cart-button {
  min-width: 185px;
}
.variation-dropdown-container .chosen-container-single .chosen-single {
    padding: 0;
    border: 2px solid #000000;
    border-radius: 0;
    height: auto;
    box-shadow: none;
}

.variation-dropdown-container .chosen-container-single .chosen-single span.variation-value {
    font-family: 'Rubik';
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 19px;
    color: #2C2C2C;
    padding: 16px 44px 16px 16px;
}

.variation-dropdown-container .chosen-container-single .chosen-single div {
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath%20d%3D%22M0%204.875L0.875%204L8%2011.125L15.125%204L16%204.875L8%2012.875L0%204.875Z%22%20fill%3D%22%232C2C2C%22%2F%3E %3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-position: center;
    right: 16px;
}

.variation-container .variation-dropdown-container .chosen-container {
    width: 100%;
    margin: 0;
}

.variation-dropdown-container .chosen-container-single .chosen-single span {
    margin: 0;
}

.variation-dropdown-container .chosen-container-single .chosen-single div b {
    display: none;
}

.add-cart-information-popup .variation-container {
    width: 300px;
    margin: 0 auto;
}

.variation-container .variation-dropdown-container .variation-type label.type-label {
    display: block;
    padding-bottom: 5px;
    text-align: center;
}

.add-cart-information-popup .button-item .add-to-cart-button {
    order: 1;
}

.variation-dropdown-container .chosen-container-single.chosen-container-active .chosen-single {
    border: 2px solid var(--bk-color-primary, #176F92);
}

.variation-dropdown-container .chosen-container-single .chosen-drop {
    box-shadow: none;
    top: 58px !important;
    left: -1px !important;
    right: -1px !important;
}

.variation-dropdown-container .chosen-container .chosen-results {
    padding: 10px;
    border: 2px var(--bk-color-primary, #176F92) solid;
}

.variation-dropdown-container .chosen-container .chosen-results .chosen-result {
    padding: 7px 10px;
    font-size: 16px;
    height: auto;
    line-height: normal;
    font-weight: 600;
    color: rgba(0, 0, 0, 0.8);
    border: none;
}

.widget-productDownloadableSpec {
    width: 100%;
    height: 1px;
}

.widget-productDownloadableSpec .product-downloadable-spec {
    max-width: 120px;
    max-height: 120px;
    position: absolute;
    right: 0;
    top: -83px;
}

.widget-productDownloadableSpec .product-downloadable-spec img {
    max-width: 100%;
    max-height: 100%;
}

.widget-productSummary {
    width: 100%;
       margin: 10px 0;
}

.widget-productSummary .title {
    display: none;
}

.widget-productSummary .summary {
    background: #FFFFFF;
    border: 1px solid #EBEBEB;
    box-shadow: 4px 4px 0px rgb(0, 0, 0, .04);
    padding: 30px;
    font-size: 18px;
    line-height: 1.8;
    font-weight: 500;
    color: #2C2C2C;
}

.widget-productImage .multi-image-scroll-wrapper {
    max-width: 582px;
    border: none;
}

.widget-productImage .image-thumb-container .thumb-image img {
    max-width: 100%;
}

.widget-productImage .image-thumb-container .thumb-image {
    width: 117px;
    height: 85px;
    border: 1px solid rgba(223, 223, 223, 0.7);
    margin: 0 8px;
    cursor: pointer;
}

.widget-productImage .multi-image-scroll-wrapper .scroll-navigator {
    width: 16px;
    cursor: pointer;
}

.widget-productImage .multi-image-scroll-wrapper .image-left-scroller.scroll-navigator {
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath%20d%3D%22M11.5625%200L3.5625%208L11.5625%2016L12.4375%2015.125L5.3125%208L12.4375%200.875L11.5625%200Z%22%20fill%3D%22%230A0A0A%22%2F%3E %3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-position: center center;
}

.widget-productImage .multi-image-scroll-wrapper .image-left-scroller.scroll-navigator:hover {
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath%20d%3D%22M11.5625%200L3.5625%208L11.5625%2016L12.4375%2015.125L5.3125%208L12.4375%200.875L11.5625%200Z%22%20fill%3D%22%230F89BB%22%2F%3E %3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-position: center center;
}

.widget-productImage .multi-image-scroll-wrapper .image-right-scroller.scroll-navigator {
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath%20d%3D%22M4.4375%200L3.5625%200.875L10.6875%208L3.5625%2015.125L4.4375%2016L12.4375%208L4.4375%200Z%22%20fill%3D%22%230A0A0A%22%2F%3E %3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-position: center center;
}

.widget-productImage .multi-image-scroll-wrapper .image-right-scroller.scroll-navigator:hover {
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath%20d%3D%22M4.4375%200L3.5625%200.875L10.6875%208L3.5625%2015.125L4.4375%2016L12.4375%208L4.4375%200Z%22%20fill%3D%22%230F89BB%22%2F%3E %3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-position: center center;
}

#spltr-07e42076-41ee-45c4-8638-7b3b2924d6d2 .product-widget.widget-addCart {
    position: absolute;
    top: 25px;
    right: 90px;
    padding: 0;
    display: inline-block;
    width: auto;
    border: none;
    margin: 0;
}

#spltr-07e42076-41ee-45c4-8638-7b3b2924d6d2 .product-widget.widget-addCart .add-to-cart-button,
#spltr-07e42076-41ee-45c4-8638-7b3b2924d6d2 .product-widget.widget-addCart .stepper {
    display: none;
}

#spltr-07e42076-41ee-45c4-8638-7b3b2924d6d2 .add-to-wish-list.button {
    padding: 6px;
    border: none;
    height: 48px;
    width: 48px;
    background: rgba(255, 255, 255, .85);
    border-radius: 50%;
}

.widget-productImage .image-preview-box .sale.tag-mark {
    display: none;
}

#spltr-07e42076-41ee-45c4-8638-7b3b2924d6d2 .add-to-wish-list.button::after {
    top: 4px;
    position: absolute;
    left: 8px;
    font-size: 30px;
    color: #000;
}


#related-product-listing .header {
    display: none;
}
.product-widget.widget-related .title {
    font-family: 'Open Sans', sans-serif;
    font-weight: 700;
    font-size: 32px;
    line-height: 43px;
    color: #0C0C0C;
    position: relative;
    padding-bottom: 19px;
    margin-bottom: 20px;
    text-transform: uppercase;
}

.widget-related .product-view.scrollable-view .header {
    border: none;
    position: absolute;
    top: 50%;
    right: 0;
    left: 0;
    overflow: visible;
}

.widget-related .scrollable-view {
    border: none;
    overflow: visible;
}

.product-widget.widget-related .title:before {
    content: "";
    height: 3px;
    position: absolute;
    left: 0;
    bottom: 0;
}

.product-widget.widget-related .title:before {
    background-color: #DFDFDF;
    width: 100%;
}

.product-widget.widget-related {
    margin-top: 50px;
}

.widget-information .bmui-tab {
    padding-top: 100px;
}

.product-widget.widget-information .bmui-tab-body-container .title {
    font-size: 26px;
    font-weight: 700;
    color: #0C0C0C;
    padding-bottom: 30px;
}

.widget-information .bmui-tab .bmui-tab-body-container {
    padding: 40px 0;
    border-color: rgba(0, 0, 0, 0.15);
    border-style: solid;
    border-width: 2px 0 0;
    margin-top: -2px;
}

.widget-information .bmui-tab .bmui-tab-header {
    font-weight: 500;
    font-size: 20px;
    line-height: 29px;
    color: rgba(0, 0, 0, 0.8);
    background: none;
    border-color: rgba(0, 0, 0, 0);
    border-style: solid;
    border-width: 0 0 2px;
    margin-right: 45px;
    text-transform: uppercase;
    padding: 0 0 8px;
    font-weight: 700;
    letter-spacing: 0.1em;
}

.widget-information .bmui-tab .bmui-tab-header:hover {
    color: var(--bk-color-primary, #176F92);
}

.widget-information .bmui-tab .bmui-tab-header.bmui-tab-active {
    border-color: var(--bk-color-primary, #176F92);
    color: var(--bk-color-primary, #176F92);
}

.widget-information .bmui-tab .bmui-tab-body-container {
    padding: 40px 0;
    border-color: rgba(0, 0, 0, 0.15);
    border-style: solid;
    border-width: 2px 0 0;
    margin-top: -2px
}

.image-popup-container.popup {
    height: auto !important;
    width: auto !important;
    padding: 0;
}

.image-popup-container .navigator.close-button {
    background: none;
    top: 15px;
    right: 15px;
}

.image-popup-container .close-button::after,
.image-popup-container .close-button::before {
    content: "";
    width: 2px;
    height: 30px;
    display: inline-block;
    background: #222222;
    position: absolute;
    top: 0;
}

.image-popup-container .close-button::before {
    transform: rotate(-45deg);
}

.image-popup-container .close-button::after {
    transform: rotate(45deg);
}

.image-popup-container .image-wrapper {
    border: none;
    padding: 60px 40px 40px;
}

.image-popup-container .navigator.right-button,
.image-popup-container .navigator.left-button {
    width: 24px;
    height: 42px;
    margin-top: -21px;
}

.image-popup-container .navigator.right-button {
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2242%22%20viewBox%3D%220%200%2024%2042%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath%20d%3D%22M2.29688%2042L0%2039.7031L18.7031%2021L0%202.29688L2.29688%200L23.2969%2021L2.29688%2042Z%22%20fill%3D%22%230A0A0A%22%2F%3E %3C%2Fsvg%3E");
    right: 9px;
    background-repeat: no-repeat;
    background-position: center center;
}

.image-popup-container .navigator.right-button:hover {
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2242%22%20viewBox%3D%220%200%2024%2042%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath%20d%3D%22M2.29688%2042L0%2039.7031L18.7031%2021L0%202.29688L2.29688%200L23.2969%2021L2.29688%2042Z%22%20fill%3D%22%230F89BB%22%2F%3E %3C%2Fsvg%3E");
    right: 9px;
    background-repeat: no-repeat;
    background-position: center center;
}

.image-popup-container .navigator.left-button {
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2242%22%20viewBox%3D%220%200%2024%2042%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath%20d%3D%22M21%2042L0%2021L21%200L23.2969%202.29688L4.59375%2021L23.2969%2039.7031L21%2042Z%22%20fill%3D%22%230A0A0A%22%2F%3E %3C%2Fsvg%3E");
    left: 9px;
    background-repeat: no-repeat;
    background-position: center center;
}

.image-popup-container .navigator.left-button:hover {
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2224%22%20height%3D%2242%22%20viewBox%3D%220%200%2024%2042%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath%20d%3D%22M21%2042L0%2021L21%200L23.2969%202.29688L4.59375%2021L23.2969%2039.7031L21%2042Z%22%20fill%3D%22%230F89BB%22%2F%3E %3C%2Fsvg%3E");
    left: 9px;
    background-repeat: no-repeat;
    background-position: center center;
}

.widget-related .product-view.scrollable-view .header .scroller {
    position: absolute;
    top: 0;
    left: -45px;
    right: -35px;
}

/* product ask question  */
.widget-information .ask-question-panel {
    max-width: 800px;
}

.widget-information .question-form {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.widget-information .ask-question-panel .form-row label {
    display: block;
    font-size: 16px;
    color: #2C2C2C;
    padding-bottom: 5px;
    font-weight: 500;
}

.widget-information .ask-question-panel input,
.widget-information .ask-question-panel .form-row textarea {
    width: 100%;
    padding: 10px 14px;
}

.widget-information .ask-question-panel button {
    width: 100%;
    margin: 0 auto;
    display: block;
}

.widget-information .ask-question-panel .form-row {
    margin: 0;
    padding: 15px;
    position: relative;
}

.widget-information .ask-question-panel .form-row:last-child label {
    display: none;
}

.widget-information .ask-question-panel .form-row:nth-child(2),
.widget-information .ask-question-panel .form-row:nth-child(3) {
    width: 50%;
}

.widget-information .ask-question-panel .form-row:nth-child(4),
.widget-information .ask-question-panel .form-row:nth-child(5) {
    width: 100%;
}

.widget-information .ask-question-panel .form-row .errorlist.after {
    position: absolute;
    left: 15px;
    bottom: -5px;
}

/* product ask question END  */

/* product review panel  */
.review-view-panel .no-review-message {
    padding-bottom: 20px;
    display: block;
}

.write-review-panel .review-form {
    max-width: 800px;
    display: flex;
    flex-wrap: wrap;
}

.write-review-panel .review-form .form-row {
    margin: 0;
    padding: 15px;
}

.write-review-panel .review-form .form-row:nth-child(2),
.write-review-panel .review-form .form-row:nth-child(3) {
    width: 50%;
}

.write-review-panel .review-form .form-row:nth-child(4),
.write-review-panel .review-form .form-row:nth-child(5),
.write-review-panel .review-form .form-row:nth-child(6) {
    width: 100%;
}

.write-review-panel .review-form .form-row.btn-row button {
    margin-right: 5px;
}

.write-review-panel .review-form .form-row label {
    display: block;
    width: 100%;
    font-size: 16px;
    color: #2C2C2C;
    padding-bottom: 5px;
    font-weight: 500;
}

.write-review-panel .review-form input[type="text"],
.write-review-panel .review-form textarea {
    width: 100%;
}

.write-review-panel .review-form textarea {
    padding: 10px 15px;
}

.write-review-panel .review-form .review-image-input-with-dropzone-wrapper {
    border: 2px #ccc dashed;
    position: relative;
}

.write-review-panel .review-form .review-image-input-with-dropzone-wrapper .masked-file-input {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    visibility: hidden;
}

.write-review-panel .review-form .review-image-input-with-dropzone-wrapper .dropzone {
    padding: 46px;
}

.write-review-panel .review-form .review-image-input-with-dropzone-wrapper .dropzone svg {
    display: none;
}

.write-review-panel .review-form .review-image-input-with-dropzone-wrapper .dropzone .dropzone-text {
    font-size: 16px;
    display: block;
    text-align: center;
}

.write-review-panel .review-form .review-image-input-with-dropzone-wrapper .dropzone:before {
    content: "";
    width: 42px;
    height: 42px;
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2243%22%20height%3D%2243%22%20viewBox%3D%220%200%2043%2043%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cg%20clip-path%3D%22url%28%23clip0_286_2%29%22%3E %3Cpath%20d%3D%22M14.2622%2030.3149L21.2622%2037.3149L28.2622%2030.3149%22%20stroke%3D%22%23176F92%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E %3Cpath%20d%3D%22M21.2622%2021.5649V37.3149%22%20stroke%3D%22%23176F92%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E %3Cpath%20d%3D%22M36.8022%2032.2224C38.3237%2031.1526%2039.4646%2029.6257%2040.0595%2027.8635C40.6543%2026.1012%2040.6722%2024.1952%2040.1104%2022.4221C39.5486%2020.6491%2038.4365%2019.1011%2036.9353%2018.0029C35.4342%2016.9048%2033.6222%2016.3135%2031.7622%2016.3149H29.5572C29.0309%2014.2637%2028.0461%2012.3586%2026.6769%2010.7431C25.3078%209.12754%2023.59%207.84365%2021.6528%206.98807C19.7157%206.13248%2017.6097%205.72749%2015.4934%205.8036C13.3771%205.87971%2011.3056%206.43492%209.43493%207.42744C7.56425%208.41996%205.94311%209.82393%204.69354%2011.5336C3.44397%2013.2434%202.59855%2015.2143%202.22092%2017.298C1.84328%2019.3817%201.94328%2021.524%202.51338%2023.5635C3.08347%2025.603%204.10882%2027.4866%205.51221%2029.0724%22%20stroke%3D%22%23176F92%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E %3C%2Fg%3E %3Cdefs%3E %3CclipPath%20id%3D%22clip0_286_2%22%3E %3Crect%20width%3D%2242%22%20height%3D%2242%22%20fill%3D%22white%22%20transform%3D%22translate%280.262207%200.564941%29%22%2F%3E %3C%2FclipPath%3E %3C%2Fdefs%3E %3C%2Fsvg%3E");
    display: block;
    margin: 0px auto 10px;
}

.write-review-panel .multiple-image-queue .file-selection-queue {
    padding: 15px;
    border-bottom: 1px #d6d6d6 solid;
}

.write-review-panel .multiple-image-queue .file-selection-queue .queue-image-preview {
    max-width: 120px;
    max-height: 120px;
    display: block;
    margin-bottom: 12px;
}

.write-review-panel .multiple-image-queue .file-selection-queue .file-name {
    font-size: 13px;
}

.write-review-panel .multiple-image-queue .file-selection-queue .file-remove {
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2225%22%20height%3D%2225%22%20viewBox%3D%220%200%2025%2025%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cpath%20d%3D%22M3.48047%206.20215H5.48047H21.4805%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E %3Cpath%20d%3D%22M19.4805%206.20215V20.2021C19.4805%2020.7326%2019.2698%2021.2413%2018.8947%2021.6164C18.5196%2021.9914%2018.0109%2022.2021%2017.4805%2022.2021H7.48047C6.95004%2022.2021%206.44133%2021.9914%206.06626%2021.6164C5.69118%2021.2413%205.48047%2020.7326%205.48047%2020.2021V6.20215M8.48047%206.20215V4.20215C8.48047%203.67172%208.69118%203.16301%209.06626%202.78793C9.44133%202.41286%209.95004%202.20215%2010.4805%202.20215H14.4805C15.0109%202.20215%2015.5196%202.41286%2015.8947%202.78793C16.2698%203.16301%2016.4805%203.67172%2016.4805%204.20215V6.20215%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E %3Cpath%20d%3D%22M10.4805%2011.2021V17.2021%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E %3Cpath%20d%3D%22M14.4805%2011.2021V17.2021%22%20stroke%3D%22black%22%20stroke-width%3D%222%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%2F%3E %3C%2Fsvg%3E");
    background-size: 16px 16px;
    margin-left: 8px;
}

.review-view-panel .total-review-panel {
    max-width: 350px;
    margin-bottom: 30px;
}

.review-view-panel .total-review-panel h2.review-heading {
    padding: 0;
    font-size: 26px;
}

.review-view-panel .total-review-panel .avg-review-label {
    font-size: 18px;
    padding: 10px 20px;
    background-color: var(--bk-color-primary, #176F92);
    color: #ffffff;
    display: flex;
    justify-content: space-between;
}

.review-view-panel .total-review-panel div.total {
    font-size: 16px;
    padding: 20px 20px 0 20px;
    background-color: #f2f2f2;
    border-style: solid;
    border-color: var(--bk-color-primary, #176F92);
    border-width: 0 1px 0 1px;
}

.review-view-panel .total-review-panel .visible-review-label {
    font-size: 16px;
    padding: 4px 20px 23px;
    background-color: #f2f2f2;
    display: block;
    border-style: solid;
    border-color: var(--bk-color-primary, #176F92);
    border-width: 0 1px 1px 1px;
}

.review-view-panel .product-review-container {
    background: none;
    border: none;
    padding: 0;
}

.review-view-panel .single-review-block {
    background: #FFFFFF;
    border: 1px solid #EBEBEB;
    box-shadow: 4px 4px 0px rgb(0, 0, 0, .04);
    padding: 20px;
    line-height: 1.8;
    font-weight: 500;
    color: #2C2C2C;
    margin: 0;
    display: flex;
    flex-direction: column;
}

.review-view-panel .single-review-block~.single-review-block {
    margin-top: 20px;
}

.review-view-panel .single-review-block .review-head {
    font-size: 14px;
    order: 2;
    color: #666;
    padding-bottom: 7px;
    margin-bottom: 14px;
    border-bottom: 1px #ececec solid;
}

.review-view-panel .single-review-block .review-head span.review-date {
    display: block;
}

.review-view-panel .single-review-block .reviewer-name {
    order: 1;
    font-size: 18px;
    font-weight: 600;
}

.review-view-panel .single-review-block .review-description {
    order: 3;
    font-size: 15px;
    color: var(--bk-color-primary, #176F92);
}

/* product review panel END  */

.widget-addCart .buy-now-button {
  padding: 20px 15px;
  margin-left: 5px;
  width: calc(100% - 68%);
  font-weight: 500;
  font-size: 22px;
  line-height: 26px;
  text-transform: uppercase;
  text-align: center;
  border-radius: 8px;
}

/* ------------------------------- Product details page END ----------------------- */

.shop-techbuyer-category .category-image-view.category {
    padding: 0;
    border: none;
	margin: 0 0 20px;
    overflow: hidden;
    width: 23.5%;
}
.category-view.image-view .category-image-view-width a {
    width: 100%;
    height: 100%;
}
.category-view.image-view .category-image-view img {
    height: 100%;
}
.shop-techbuyer-category .category-view.image-view .content {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    margin: 0 -15px;
}

.shop-techbuyer-category .category-image-view.category .category-name-link.title-link {
    font-family: 'Open Sans';
    font-weight: 600;
    font-size: 18px;
    line-height: 25px;
    text-align: center;
    color: #000000;
    display: inline-block;
    margin-top: 10px;
}

/* =============================================== FOOTER DESIGN ===============================================*/
body>.footer {
    background: #1E1E1E;
}

body>.footer:before {
    content: "";
    height: 68px;
    background-color: #fff;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
}

.footer-hr-line hr {
    border-top: 1px solid rgba(255, 255, 255, 0.27);
    margin: 0;
}

.footer .widget-title {
    font-family: 'Open Sans', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 17px;
    letter-spacing: 0.19em;
    text-transform: uppercase;
    color: #FFFFFF;
}


/* ------ ABN - Techbuyer ----  */
.abn-teachbuy p {
    letter-spacing: 0.03em;
    color: #000000;
    font-size: 14px;
    border-left: 1px #000 solid;
    padding: 3px 0 3px 26px;
    margin: 0;
}

/* -------- We Accept:------ */
.footer .footer-we-accept .widget-title {
    font-weight: 700;
    font-size: 13px;
    letter-spacing: 0.19em;
    text-transform: uppercase;
    color: #000000;
    display: inline-block;
    padding: 0;
    vertical-align: middle;
    margin-right: 12px;
}


/* -------- Footer nav ------ */

.footer .vertical .navigation-item a {
    border: none;
    font-size: 15px;
    line-height: normal;
    letter-spacing: 0.03em;
    color: #FFFFFF;
    opacity: 0.8;
    font-weight: 400;
    padding: 8px 0;
}

.footer .vertical .navigation-item a:hover {
    color: #FFFFFF;
    opacity: 1;
}


/* -------- Footer Newsletter ------ */

.widget-newsletter .form-row {
    margin: 0;
}

.widget-newsletter label {
    width: 100%;
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    letter-spacing: 0.03em;
    color: #FFFFFF;
    opacity: 0.8;
    margin-bottom: 30px;
    line-height: 25px;
}

.widget-newsletter .form-row label:after {
    vertical-align: middle;
    content: "";
    display: inline-block;
    height: 18px;
    width: 16px;
    background-color: #1E1E1E;
    margin-left: -8px;
}

.widget.widget-newsletter .form-row input {
    width: 100%;
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    line-height: 33px;
    letter-spacing: 0.03em;
    color: #FFFFFF;
    background: none;
    border-style: solid;
    border-width: 0 0 2px 0;
    border-color: rgba(255, 255, 255, 0.27);
    border-radius: 0;
    padding: 3px 135px 3px 0 !important;
}

.widget.widget-newsletter .form-row input::-webkit-input-placeholder {
    color: #FFFFFF;
    opacity: 0.8;
}

.widget.widget-newsletter .form-row input::-moz-placeholder {
    color: #FFFFFF;
    opacity: 0.8;
}

.widget.widget-newsletter .form-row input:-ms-input-placeholder {
    color: #FFFFFF;
    opacity: 0.8;
}

.widget.widget-newsletter .form-row input:-moz-placeholder {
    color: #FFFFFF;
    opacity: 0.8;
}

.widget.widget-newsletter .form-row input:focus {
    border-style: solid;
    border-width: 0 0 2px 0;
    border-color: #0F89BB;
    padding: 3px 135px 3px 0 !important;
}

.widget.widget-newsletter .form-row input.error-field-error[type="text"] {
    border-style: solid;
    border-width: 0 0 2px 0;
    border-color: #ff0000;
    background: none;
    padding: 3px 135px 3px 0 !important;
}

.widget-newsletter .form-row .errorlist.after {
    position: static;
}

.widget-newsletter .errorlist.after .message-block {
    bottom: 20px;
    font-size: 14px;
}

.widget-newsletter .form-row.button-container {
    position: absolute;
    right: 0;
    bottom: 51px;
}

.widget-newsletter .form-row.button-container label {
    display: none;
}

.widget-newsletter .form-row.button-container button {
    background: none;
    padding: 5px 0;
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 700;
    font-size: 17px;
    letter-spacing: 0.19em;
    text-transform: uppercase;
    color: #FFFFFF;
}

.footer .widget-newsletter .widget-title {
    padding-bottom: 15px;
}

.widget-newsletter .message-block {
    position: absolute;
    left: 0;
    right: 0;
    bottom: -9px;
    width: auto;
}


.site-popup .title-bar {
    padding: 0;
    background: none;
    font-size: 26px;
    font-weight: 700;
}

.site-popup .title-bar .close:before {
    color: #2c2c2c;
}

.site-popup .button-line {
    display: flex;
    justify-content: center;
}

.advance.checkout-page .advance-checkout-order-details-right-dom-inner .checkout-others-payment-option .code-submit-form input {
    border: 2px #878787 solid;
    padding: 10px 20px;
    border-radius: 0;
}

.advance.checkout-page .advance-checkout-order-details-right-dom-inner .checkout-others-payment-option .code-submit-form input:focus {
    border: 2px var(--bk-color-primary, #176F92) solid;
    padding: 10px 20px;
}

.advance.checkout-page .advance-checkout-order-details-right-dom-inner .checkout-others-payment-option .code-submit-form .code-submit-form-submit {
    background-color: var(--bk-color-primary, #176F92);
    color: #ffffff;
    border-radius: 0;
}

.advance.checkout-page .advance-checkout-order-details-right-dom-inner .checkout-others-payment-option .code-submit-form .code-submit-form-submit:hover {
    background-color: var(--bk-color-secondary, #E8631E);
}

.advance-checkout-order-details-right-dom .image {
    flex: 0 0 120px;
    border: none;
    padding: 0;
}

.advance-checkout-order-details-right-dom .image img {
    margin: 0 auto;
}

.advance-checkout-order-details-right-dom .image .wrapper {
    border: 1px #f1f1f1 solid;
    padding: 5px;
}

.advance-checkout-order-details-right-dom .cart-item~.cart-item {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px #d6d6d6 solid;
}

.advance-checkout-order-details-right-dom-inner .cartitem-table {
    margin-bottom: 25px;
}

.checkout-page .advance-checkout-billing-init-step .form-row {
    width: 50%;
    margin: 0;
    padding: 15px;
}

.advance.checkout-page .address-edit-from-wrap form {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    margin-left: -15px;
    margin-right: -15px;
}

.advance.checkout-page .address-edit-from-wrap form .form-row {
    width: 50%;
    margin: 0;
    padding: 0 15px 30px;
    position: relative;
}
.advance.checkout-page .address-edit-from-wrap form .country-selector-row + .company-row {
    width: 100%;
}
.advance.checkout-page .address-edit-from-wrap form {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    margin-left: -15px;
    margin-right: -15px;
}

.advance-checkout-order-details-left-dom-inner h1.page-heading {
    font-size: 30px;
    font-family: 'Open Sans', sans-serif;
    color: #000000;
    border-bottom: 1px #d6d6d6 solid;
    padding-bottom: 7px;
    margin-bottom: 55px;
}

.advance-checkout-order-details-right-dom h2 {
    margin-top: 8px;
    padding-bottom: 13px;
    font-size: 30px;
    color: #000;
}

.advance.checkout-page .advance-checkout-order-details-right-dom-inner .checkout-others-payment-option .code-submit-form .message-block {
    bottom: -13px;
}

.advance.checkout-page .header.section-to-collapse-expand .title {
    padding: 0;
    font-size: 22px;
    cursor: pointer;
}
.checkout-page .advance-checkout-steps-left-dom .contact-section .header .title:after,
.checkout-page .advance-checkout-steps-left-dom .section .header .title:after {
    top: 8px;
}
.contact-information-advance-panel .contact-information-edit-mode {
    margin-bottom: 30px;
}

.advance.checkout-page .advance-checkout-billing-init-step .form-row.company-row,
.advance.checkout-page .advance-checkout-billing-init-step .form-row.form-row.state-selector-row {
    padding-bottom: 0;
}

.advance.checkout-page .address-edit-from-wrap form>input.submit-button {
    margin-left: 15px;
}

.advance.checkout-page .address-edit-from-wrap form input.button {
    min-width: 150px;
}

.advance.checkout-page .section.shipping .shipping-handing-advance-panel .info-row {
    background-color: #e7f0f4;
    border-radius: 0;
}

.advance.checkout-page .section.shipping .shipping-handing-advance-panel .info-row span {
    color: var(--bk-color-primary, #176F92);
    font-weight: 700;
}

.flying-cart-quantity-wrapper .stepper .product-quantity-selector {
    padding: 0;
    text-align: center;
    border: none;
    height: 41px;
    background: #ffffff;
    flex: 1 1 auto;
    order: 2;
    font-size: 20px;
    color: var(--bk-color-primary, #176F92);
    z-index: inherit;
}

.flying-cart-quantity-wrapper .stepper .stepper-arrow {
    background: none;
    border: none;
    position: static;
    height: 46px;
    width: 39px;
    text-indent: inherit;
    font-size: 0;
    line-height: 64px;
    text-align: center;
    flex-grow: 0;
    flex-shrink: 0;
    position: relative;
}

.flying-cart-quantity-wrapper .stepper .stepper-arrow.up {
    order: 3;
}

.flying-cart-quantity-wrapper .stepper .stepper-arrow.down {
    order: 1;
}

.flying-cart-quantity-wrapper .stepper .stepper-arrow.up:after,
.flying-cart-quantity-wrapper .stepper .stepper-arrow.up:before,
.flying-cart-quantity-wrapper .stepper .stepper-arrow.down:after {
    position: absolute;
}

.flying-cart-quantity-wrapper .stepper .stepper-arrow.up:after,
.flying-cart-quantity-wrapper .stepper .stepper-arrow.up:before {
    content: "";
    width: 14px;
    height: 2px;
    background-color: #000;
    top: 20px;
    left: 11px;
    transform: none;
}

.flying-cart-quantity-wrapper .stepper .stepper-arrow.up:before {
    transform: rotate(90deg);
}

.flying-cart-quantity-wrapper .stepper .stepper-arrow.down::before {
    content: "";
    width: 14px;
    height: 2px;
    background-color: #000;
    top: 21px;
    left: 15px;
    transform: none;
}

.flying-cart-quantity-wrapper .stepper .stepper-arrow.down::after {
    display: none;
}

.flying-cart-quantity-wrapper .stepper {
    display: flex;
    width: 114px;
    padding: 0;
    border-radius: 0;
}

.advance.checkout-page {
    grid-template-columns: 55% 45%;
}

.advance-checkout-steps-left-dom {
    padding: 0 70px 0 0;
}

.advance-checkout-order-details-right-dom {
    padding: 0 0 0 70px;
    background: none;
}

.advance-checkout-steps-left-dom .contact-section .body.guest-checkout-no-billing-address-exist-yet {
    margin-top: -55px;
}

.contact-information-view-mode.address-view {
    margin-bottom: 20px;
}

.widget-breadcrumb .breadcrumb-item.root a:hover::before,
.breadcrumb-item .label:hover {
    color: var(--bk-color-secondary, #E8631E);
}

.widget.widget-breadcrumb .breadcrumb-item.current {
    color: #000;
    font-size: 14px;
    font-weight: 700;
}

.breadcrumb-item.root .separator {
    font-size: 0;
}

.widget-breadcrumb .breadcrumb-item.root a::before {
    content: "Home";
    color: #2C2C2C;
    font-size: 14px;
    font-weight: 400;
}

.widget-breadcrumb .breadcrumb-item .separator::after {
    color: #2C2C2C;
    content: "/";
    font-size: 16px;
    font-weight: 400;
    line-height: 1;
    margin-left: 2px;
    vertical-align: -2px;
}

.widget-breadcrumb .separator {
    font-size: 0;
}

.breadcrumb-item.root .icon {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    display: none;
}

.widget-breadcrumb .breadcrumb-item a,
.widget-breadcrumb .breadcrumb-item a:hover {
    color: #2C2C2C;
}

.breadcrumb-item .label {
    font-size: 14px;
    color: #2C2C2C;
}

.breadcrumb-item .label:hover {
    color: var(--bk-color-secondary, #E8631E);
}

.widget-breadcrumb .breadcrumb-item.root a:hover::before {
    color: var(--bk-color-secondary, #E8631E);
}
.checkout-page.version-2 .advance-checkout-order-details-left-dom-inner .page-heading {
    font-size: 24px;
    font-weight: 600;
    color: rgba(0, 0, 0, 1);
    margin: 0 0 20px;
    padding: 0 0 15px;
}
div.flying-cart-quantity-wrapper .stepper {
    padding: 0;
}
div.flying-cart-quantity-wrapper .stepper .product-quantity-selector, div.flying-cart-quantity-wrapper .stepper-arrow.up, div.flying-cart-quantity-wrapper .stepper-arrow.down {
    height: 24px;
}
div.flying-cart-quantity-wrapper .stepper .stepper-arrow.up:after, div.flying-cart-quantity-wrapper .stepper .stepper-arrow.up:before {
    width: 10px;
    top: 11px;
    left: 15px;
}
div.flying-cart-quantity-wrapper .stepper .stepper-arrow.down::before {
    width: 10px;
    top: 11px;
    left: 10px;
}
div.flying-cart-quantity-wrapper .stepper .product-quantity-selector {
    font-size: 15px;
}
div.flying-cartitem-btn-wrapper .flying-cart-footer-button{
  background: var(--bk-color-primary, #176F92);
    border: 2px solid var(--bk-color-primary, #176F92);
  color:#fff;
  font-size: 18px;
}
div.flying-cartitem-btn-wrapper .flying-cart-footer-button:hover{
  background: #000;
    border: 2px solid #000;
}
div.flying-cart-content.page-content.loading.popup .continue-shopping-btn {
    font-size: 18px;
    line-height: 34px;
    height: 50px;
}
div.flying-cart-bottom-column {
    padding-top: 10px;
    margin-top: 0;
    border-top: 0;
}
/* add */
/** Customer Profile End **/
#customer-profile-tabs {
    margin: 10px auto 30px;
    max-width: 1400px;
    width: 100%;
}

.customer-profile-v2 .header-message {
    font-weight: 500;
    font-size: 37px;
    line-height: normal;
    color: #000;
}

#customer-profile-tabs.customer-profile-v2 .button.profileLogout {
    margin-top: 0;
    border: 0;
    max-width: 150px;
}

#customer-profile-tabs.customer-profile-v2 .profileLogout a {
    color: var(--bk-color-primary, #176F92);
    padding: 10px 20px 30px;
    font-size: 15px;
    font-weight: 500;
    display: block;
    width: 100%;
    text-align: center;
    height: 40px;
    border-radius: 0;
    line-height: 20px;
    background-color: transparent;
    border: 2px solid var(--bk-color-primary, #176F92);
    text-transform: uppercase;
}

#customer-profile-tabs.customer-profile-v2 .profileLogout a::before {
    content: "";
    background: url(/template/106fffdc/images/logout.svg);
    vertical-align: top;
    height: 20px;
    display: inline-block;
    overflow: hidden;
    width: 17px;
    -webkit-transition: all 0.5s ease 0s;
    transition: all 0.5s ease 0s;
    margin-right: 10px;
    background-position: 0 0px;
}

#customer-profile-tabs.customer-profile-v2 .profileLogout:hover a::before {
    background-position: 0 38px;
}

#customer-profile-tabs.customer-profile-v2 .profileLogout:hover a {
    background: var(--bk-color-primary, #176F92);
}

.bmui-tab.left-side-header.customer-profile-v2 .bmui-tab-header-container {
    border-color: #bdbdbd;
    background: transparent;
    padding-left: 35px;
    border-right: 1px solid #DEDEDE;
}

.customer-profile-v2 .customer-profile {
    position: absolute;
    left: 0;
    top: 0;
    overflow: unset;
}

.customer-profile-v2 .customer-profile::after {
    content: "";
    position: absolute;
    width: 22px;
    height: 22px;
    right: -15px;
    top: 0px;
    background: var(--bk-color-primary, #176F92) url(../images/cam.svg) no-repeat center 4px;
    transform: translateX(-50%);
    border-radius: 50px;
}

.customer-profile-v2 .customer-profile img {
    -o-object-fit: cover;
    object-fit: cover;
    height: 52px;
    width: 52px;
    border-radius: 50%;
}

.customer-profile-v2.bmui-tab.left-side-header .bmui-tab-header .title::after {
    display: none
}

.customer-profile-v2.bmui-tab.left-side-header .bmui-tab-header .title {
    position: relative;
    font-family: 'Open Sans', sans-serif;
    font-style: normal;
    font-weight: 600;
    font-size: 17px;
    line-height: 34px;
    color: #000000;
    opacity: 0.8;
    border: 0;
    padding: 0 0 15px 0;

}

.customer-profile-v2.bmui-tab.left-side-header .bmui-tab-header.bmui-tab-active .title,
.customer-profile-v2.bmui-tab.left-side-header .bmui-tab-header:hover .title {
    background: none;
    color: var(--bk-color-primary, #176F92) !important;
}

#customer-profile-tabs.customer-profile-v2 .bmui-tab-body-container .bmui-tab-header-container {
    border-bottom: 0;
}

.bmui-tab.left-side-header.customer-profile-v2 .bmui-tab-body-container {
    border: 1px #bdbdbd solid;
    border-left-color: rgb(232, 232, 232);
    border-left-style: solid;
    border-left-width: 1px;
    border-left: 0;
}

.bmui-tab.left-side-header.customer-profile-v2 .bmui-tab-body-container {
    padding: 25px 40px;
}

#customer-profile-tabs.customer-profile-v2 .special-product .title {
    padding-left: 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

#customer-profile-tabs .scrollable-view .header {
    border: none;
    display: none;
}

#customer-profile-tabs .scrollable-view .content {
    margin: 0 -30px;
    padding: 10px 20px 20px;
    display: flex;
    flex-wrap: wrap;
}

#customer-profile-tabs.customer-profile-v2 .special-product .title::before {
    display: none;
}

.bmui-tab.left-side-header.customer-profile-v2>.bmui-tab-body-container .bmui-tab-header .title {
    font-size: 18px;
    line-height: 20px;
    padding: 15px 0;
    font-weight: 600;
    color: rgba(0, 0, 0, 1);
}

.customer-profile-v2.bmui-tab.left-side-header .bmui-tab-header.bmui-tab-active .title,
.customer-profile-v2.bmui-tab.left-side-header .bmui-tab-header.bmui-tab-active .title {
    color: var(--bk-color-primary, #176F92);
}

.customer-profile-v2.bmui-tab.left-side-header .bmui-tab-header.bmui-tab-active,
.customer-profile-v2.bmui-tab.left-side-header .bmui-tab-header.bmui-tab-active {
    font-weight: 500;
    position: relative;
}

.customer-profile-v2.bmui-tab.left-side-header .bmui-tab-header.bmui-tab-active:after {
    position: absolute;
    content: "";
    left: 0;
    bottom: 10px;
    width: 50px;
    height: 3px;
    background: var(--bk-color-primary, #176F92);
}

.customer-profile-v2.bmui-tab.left-side-header .bmui-tab-header-container.bmui-tab-header-container.top-box .bmui-tab-active:after {
    bottom: 5px;
}

.customer-profile-v2.bmui-tab.left-side-header .bmui-tab-body-container .bmui-tab-header~.bmui-tab-header {
    margin-left: 50px;
}

.customer-profile-v2.bmui-tab.left-side-header .bmui-tab-body-container .bmui-tab-header~.bmui-tab-header .title {
    margin-left: 0px;
}

.customer-profile-v2.bmui-tab.left-side-header .bmui-tab-body-container .bmui-tab-header.bmui-tab-active .title::after,
.customer-profile-v2.bmui-tab.left-side-header .bmui-tab-body-container .bmui-tab-header:hover .title::after {
    opacity: 1;
}

.customer-profile-v2.bmui-tab.left-side-header .bmui-tab-body-container .bmui-tab-header .title::after {
    height: 1px;
    width: auto;
    background-color: var(--bk-color-primary, #176F92);
    position: absolute;
    left: 0;
    right: 0;
    top: auto;
    opacity: 0;
    bottom: 0;
}

#customer-profile-tabs.customer-profile-v2 .bmui-tab-body-container .bmui-tab-header-container {
    width: 100%;
    background: #fff;
}

#customer-profile-tabs.customer-profile-v2 .bmui-tab-body-container .bmui-tab-body-container {
    margin-top: 20px;
}

#bmui-tab-account_information .account-short-details>div {
    width: 30%;
}

#bmui-tab-account_information .account-short-details {
    display: flex;
    background: #F9F9F9;
    padding: 30px;
    margin: 0 0 15px;
    justify-content: end;
    flex-wrap: wrap;
}

#bmui-tab-account_information .account-short-details>div.customer-address {
    width: 40%;
}

#bmui-tab-account_information .account-short-details>div.customer-address>p.address-line-1 {
    width: 100%;
}

.bmui-tab-panel .account_information .name {
    display: none;
}

#bmui-tab-account_information .account-short-details .form-row label {
    position: relative;
    font-weight: 500;
    font-size: 18px;
    line-height: 21px;
    color: #000000;
    padding: 0 0 3px 0;
    width: 100%;
}

#bmui-tab-account_information .account-short-details p.address-line-1 {
    position: relative;
    padding: 25px 0 0 40px;
    width: 40%;
}

#bmui-tab-account_information .account-short-details p.address-line-1:before {
    content: '';
    width: 28px;
    height: 20px;
    background: url("../images/icon-address-profile.svg");
    background-repeat: no-repeat;
    background-position: 0 0;
    position: absolute;
    left: 0;
    top: 0;
}

#bmui-tab-account_information .account-short-details p.address-line-1:after {
    content: 'Address';
    position: absolute;
    left: 40px;
    top: 0;
    font-weight: 500;
    font-size: 18px;
    line-height: 21px;
    color: #000000;
}

#bmui-tab-account_information .account-short-details .form-row {
    padding: 0 0 0 40px;
    width: 100%;
    color: rgba(0, 0, 0, 0.8);
    display: block;
    width: 100%;
    height: 85px;
    font-size: 17px;
}

#bmui-tab-account_information .account-short-details .form-row div {
    position: relative;
}

#bmui-tab-account_information .account-short-details .form-row div:before {
    content: '';
    width: 28px;
    height: 28px;
    background: url("../images/icon-email-profile.svg") no-repeat;
    background-repeat: no-repeat;
    background-position: 0 0;
    position: absolute;
    left: -40px;
    top: 0;
}

#bmui-tab-account_information .account-short-details .form-row .icon-customer-mobile:before {
    background: url("../images/icon-mobile-profile.svg") no-repeat center right;
}

#bmui-tab-account_information .account-short-details .form-row .icon-customer-phone:before {
    background: url("../images/icon-phone-profile.svg") no-repeat;
}

#bmui-tab-account_information .account-short-details .form-row .icon-customer-fax:before {
    background: url("../images/icon-fax-profile.svg") no-repeat center right;
}

#bmui-tab-account_information .button-line {
    text-align: left;
    padding: 10px 0 0 0;
}

#bmui-tab-account_information .button-line span.link-btn.account-details-edit-link {
    border: 1px solid rgba(0, 0, 0, 1.0);
    border-radius: 3px;
    background-image: none;
    font-weight: 500;
    font-size: 16px;
    line-height: 19px;
    text-align: center;
    color: #050505;
    position: relative;
    text-decoration: none;
    padding: 8px 20px;
}

#bmui-tab-account_information .button-line span.link-btn.account-details-edit-link:hover {
    color: #fff;
    background-color: #38A5C6;
    border-color: #38A5C6;
}


#customer-profile-tabs thead th {
    font-style: normal;
    font-weight: 500;
    font-size: 15px;
    line-height: 20px;
    color: #000;
    padding: 10px;
}

#customer-profile-tabs tbody td {
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    line-height: 26px;
    color: #000000;
}

#customer-profile-tabs .actions-column .floating-action-dropper:before {
    content: '\f142';
    font-size: 16px;
}

#bmui-tab-shipping_address tbody td.contact-cell label,
#bmui-tab-billing_address tbody td.contact-cell label,
#bmui-tab-account_information tbody td.contact-cell label {
    font-weight: 600;
}

#customer-profile-tabs .bmui-tab .form-row label {
    display: block;
}

#customer-profile-tabs table+.button-line {
    text-align: right;
}

#bmui-tab-billing_address tbody td.action-cell .action-icon.edit,
#bmui-tab-shipping_address tbody td.action-cell .action-icon.edit {
    padding: 8px;
    border: 1px solid #bdbbbb;
    border-radius: 0;
    background-image: none;
    position: relative;
    width: 65px;
    height: 34px;
}

#bmui-tab-billing_address tbody td.action-cell .action-icon.edit:before,
#bmui-tab-shipping_address tbody td.action-cell .action-icon.edit:before {
    content: 'Edit';
    position: absolute;
    left: 50%;
    top: 8px;
    font-weight: 400;
    font-size: 14px;
    line-height: 17px;
    text-align: center;
    color: #050505;
    transform: translateX(-50%)
}

#bmui-tab-billing_address tbody td.action-cell .action-icon.edit:hover,
#customer-profile-tabs tbody td.action-cell .action-icon.edit:hover {
    color: #fff !important;
    background-color: var(--bk-color-primary, #176F92) !important;
    border-color: var(--bk-color-primary, #176F92);
}

#bmui-tab-billing_address tbody td.action-cell .action-icon.edit:hover::before,
#customer-profile-tabs tbody td.action-cell .action-icon.edit:hover::before {
    color: #fff;
}

#bmui-tab-billing_address tbody td.action-cell .action-icon.delete,
#bmui-tab-shipping_address tbody td.action-cell .action-icon.delete,
#bmui-tab-billing_address tbody td.action-cell .action-icon.active,
#bmui-tab-shipping_address tbody td.action-cell .action-icon.active {
    height: 25px;
}

.page-profile .edit-address-form .form-row.btn-row {
    width: 100%;
}

#customer-profile-tabs.customer-profile-v2 button {
    border: 2px solid var(--bk-color-primary, #176F92);
    border-radius: 3px;
    background-image: none;
    font-weight: 500;
    font-size: 16px;
    line-height: 19px;
    text-align: center;
    color: #fff;
    position: relative;
    text-decoration: none;
    padding: 11px 16px;
    background: var(--bk-color-primary, #176F92);
    text-transform: capitalize;
    width: auto;
    margin-top: 0;
    float: right;
    border-radius: 0;
    height: auto;

}

#customer-profile-tabs.customer-profile-v2 button.cancel-button {
    border: 2px solid #000;
    background: transparent;
    color: #000;
}

.page-profile .bmui-tab-body-container .form-row.btn-row button {
    margin-left: 12px;
}

#customer-profile-tabs.customer-profile-v2 button:hover {
    background-color: #000;
    border-color: #000;
    color: #fff !important;
}

#customer-profile-tabs.customer-profile-v2 .bmui-tab-body-container .bmui-tab-body-container .store_credit {
    font-size: 17px;
}

.customer-profile-v2 .customer-basic-info .customer-name-text {
    font-size: 17px;
    color: #000;
    font-weight: 500;
}

#customer-profile-tabs.customer-profile-v2 .bmui-tab-body-container .bmui-tab-body-container .store_credit .form-row.mandatory {
    margin-top: 20px;
}

#bmui-tab-account_information .button-line {
    text-align: right;
    padding: 10px 0 0 0;

}

#bmui-tab-account_information .button-line span.link-btn.account-details-edit-link {
    background-image: none;
    font-weight: 500;
    font-size: 16px;
    line-height: 19px;
    text-align: center;
    color: #fff;
    position: relative;
    text-decoration: none;
    padding: 11px 20px;
    background: var(--bk-color-primary, #176F92);
    border: 2px solid var(--bk-color-primary, #176F92);
    border-radius: 0;
    width: auto;
    text-transform: capitalize;
    transition: all 300ms ease-out;
}

#bmui-tab-account_information .button-line span.link-btn.password-edit-link,
#customer-profile-tabs span.create-new.button,
.wish-list-list .button.create-wish-list,
.wish_list .wish-list-share-form .form-row:nth-last-child(1) button,
.page-profile .bmui-tab-body-container .form-row.btn-row button {
    background-image: none;
    font-weight: 500;
    font-size: 16px;
    line-height: 18px;
    text-align: center;
    color: var(--bk-color-primary, #176F92);
    position: relative;
    text-decoration: none;
    padding: 12px 20px;
    background: #fff;
    border: 2px solid var(--bk-color-primary, #176F92);
    border-radius: 0;
    width: auto;
    text-transform: capitalize;
    float: right;
}

#bmui-tab-account_information .button-line span.link-btn.account-details-edit-link:hover {
    color: #fff;
    background-color: #000;
    border-color: #000;
}

#bmui-tab-account_information .button-line span.link-btn.password-edit-link:hover,
#customer-profile-tabs span.create-new.button:hover,
.wish-list-list .button.create-wish-list:hover,
.store_credit .store-credit-request-form .submit-button:hover,
.wish_list .wish-list-share-form .form-row:nth-last-child(1) button:hover,
.page-profile .bmui-tab-body-container .form-row.btn-row button:hover {
    color: #fff;
    background-color: var(--bk-color-primary, #176F92);
    border-color: var(--bk-color-primary, #176F92);
    color: #fff;
}

#customer-profile-tabs.customer-profile-v2 .form-row input[type="text"],
#customer-profile-tabs.customer-profile-v2 .form-row input[type="email"],
#customer-profile-tabs.customer-profile-v2 .form-row input[type="password"],
#customer-profile-tabs.customer-profile-v2 .form-row select {
    border: 2px solid #878787;
    border-radius: 0;
}

#customer-profile-tabs.customer-profile-v2 .form-row input[type="text"]:focus,
#customer-profile-tabs.customer-profile-v2 .form-row input[type="email"]:focus,
#customer-profile-tabs.customer-profile-v2 .form-row input[type="password"]:focus,
#customer-profile-tabs.customer-profile-v2 .form-row select:focus {
    border: 2px solid var(--bk-color-primary, #176F92);
}

body.page-profile select,
body.page-profile input[type="text"],
body.page-profile input[type="password"],
body.page-profile input[type="email"] {
    height: 45px !important;
    padding: 3px 14px !important;
    border: 1px solid #757575;
}

body.page-profile select:focus,
body.page-profile input[type="text"]:focus,
body.page-profile input[type="password"]:focus,
body.page-profile input[type="email"]:focus {
    border: 1px solid #FFCB54;
}

#customer-profile-tabs.customer-profile-v2 .account_information .account-details-form .form-row.btn-row {
    width: 100%;
    text-align: right;
    overflow: hidden;
}

#customer-profile-tabs .bmui-tab .form-row label {
    display: block;
    color: #000;
}

#customer-profile-tabs.customer-profile-v2 .form-row label {
    display: block;
    width: 100%;
    font-size: 16px;
    padding-bottom: 5px;

}

#customer-profile-tabs.customer-profile-v2 .billing_address .edit-address-form .form-row.company-row,
#customer-profile-tabs.customer-profile-v2 .shipping_address .edit-address-form .form-row.company-row {
    width: 100%;
}

#bmui-tab-account_information form.edit-password-form .form-row {
    margin-bottom: 15px;
    margin-top: 10px;
}

#bmui-tab-account_information form.edit-password-form .form-row.btn-row {
    margin-top: 25px;
}

.bmui-tab.left-side-header .bmui-tab .account_information .form-row label {
    font-weight: 400;
}

#customer-profile-tabs thead th {
    font-style: normal;
    font-weight: 500;
    font-size: 15px;
    line-height: 20px;
    color: #000;
    padding: 10px;
    padding-left: 10px;
}

#customer-profile-tabs .billing_address th:first-child,
#customer-profile-tabs .billing_address td.name-cell,
#customer-profile-tabs .shipping_address th:first-child,
#customer-profile-tabs .shipping_address td.name-cell {
    width: 20% !important;
}

#customer-profile-tabs .billing_address th:nth-last-of-type(2),
#customer-profile-tabs .billing_address td.contact-cell,
#customer-profile-tabs .shipping_address th:nth-last-of-type(2),
#customer-profile-tabs .shipping_address td.contact-cell {
    width: 35% !important;
}

#customer-profile-tabs tbody td:nth-of-type(3) {
    padding-right: 10px;
    width: 21%;
}

#customer-profile-tabs tbody td {
    word-break: break-word;
}

#customer-profile-tabs #bmui-tab-my-orders #order-list thead th {
    word-break: normal;
}

#customer-profile-tabs th:first-child,
#customer-profile-tabs td:first-child {
    padding-left: 13px;
    text-transform: capitalize;
}

#customer-profile-tabs th:last-child,
#customer-profile-tabs td:last-child {
    text-align: center;
    width: 15%;
    text-align: right;
    padding-right: 12px;
}

#customer-profile-tabs tr,
table tr {
    border-bottom: 1px solid #F6F6F6;
}

#customer-profile-tabs.customer-profile-v2 .form-row textarea {
    height: 120px;
    border: 1px solid #757575;
    border-radius: 0;
    padding: 10px 10px;
    font-size: 17px;
}

#customer-profile-tabs.customer-profile-v2 .form-row textarea:focus {
    border: 1px solid var(--bk-color-primary, #176F92);
}

#customer-profile-tabs.customer-profile-v2 .store-credit-request-form .form-row label {
    margin-bottom: 5px;
}

span.action-icon.details,
span.action-icon.edit,
span.action-icon.share {
    background: none !important;
}

.wish-list-list span.action-icon.details:after,
.wish-list-list span.action-icon.edit:after,
.wish-list-list span.action-icon.share:after,
span.action-icon.add-to-cart {
    content: "\f06e";
    font-family: 'FontAwesome';
    color: #333;
    vertical-align: middle;
    position: absolute;
    top: 0;
    left: 0;
    line-height: 15px;
}

.wish-list-list span.action-icon.edit:after {
    content: "\f044";
}

.wish-list-list span.action-icon.share:after {
    content: "\f064";
}

.action-icon {
    position: relative;
    margin: 0 6px;
}

.action-icon.delete, 
.action-icon.remove {
    background-image: url("data:image/svg+xml,%3Csvg%20width%3D%2216%22%20height%3D%2216%22%20viewBox%3D%220%200%2016%2016%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cg%20clip-path%3D%22url%28%23clip0_293_6%29%22%3E %3Cpath%20d%3D%22M15.2751%2016C15.0876%2016%2014.9126%2015.925%2014.7626%2015.7875L8.0001%209.01251L1.2251%2015.7875C0.950098%2016.0625%200.487598%2016.0625%200.212598%2015.7875C-0.0624023%2015.5125%20-0.0624023%2015.05%200.212598%2014.775L6.9876%208.00001L0.212598%201.22501C-0.0624023%200.950006%20-0.0624023%200.487506%200.212598%200.212506C0.487598%20-0.0624939%200.950098%20-0.0624939%201.2251%200.212506L8.0001%206.98751L14.7751%200.212506C15.0501%20-0.0624939%2015.5126%20-0.0624939%2015.7876%200.212506C16.0626%200.487506%2016.0626%200.950006%2015.7876%201.22501L9.0126%208.00001L15.7876%2014.775C16.0626%2015.05%2016.0626%2015.5125%2015.7876%2015.7875C15.6501%2015.925%2015.4626%2016%2015.2751%2016Z%22%20fill%3D%22%230A0A0A%22%2F%3E %3C%2Fg%3E %3Cdefs%3E %3CclipPath%20id%3D%22clip0_293_6%22%3E %3Crect%20width%3D%2216%22%20height%3D%2216%22%20fill%3D%22white%22%2F%3E %3C%2FclipPath%3E %3C%2Fdefs%3E %3C%2Fsvg%3E");
    background-position: center center;
    background-size: 12px 12px;
    background-repeat: no-repeat;
}

#customer-profile-tabs tbody td.unpaid {
    color: #e85656;
}

#customer-profile-tabs tbody td.paid {
    color: #45A801;
}

#customer-profile-tabs tbody td.awaiting {
    color: #d7ac04;
}

#order-details .info-row {
    margin: 12px 0 15px;
}

#order-details .info-row>* {
    font-size: 17px;
    font-weight: 400;
}

#order-details .info-row label {
    color: #000;
}

#order-details .info-row:last-child {
    border-top: 1px solid #E8E8E8;
    margin-top: 12px;
    padding-top: 12px;
    max-width: 500px;
    float: right;
    width: 100%
}

#order-details .info-row:last-child label,
#order-details .info-row:last-child .value {
    font-weight: 700;
    font-size: 20px;
}

.page-profile #customer-profile-tabs #bmui-tab-my-orders .completed_order .order-items-wrap thead tr th:first-child,
.page-profile #customer-profile-tabs #bmui-tab-my-orders .completed_order .order-items-wrap tbody tr td:first-child {
    width: 48%;
}

.page-profile #customer-profile-tabs #bmui-tab-my-orders .pending_order .order-items-wrap thead tr th:first-child,
.page-profile #customer-profile-tabs #bmui-tab-my-orders .pending_order .order-items-wrap tbody tr td:first-child {
    width: 40%;
}

#customer-profile-tabs .bmui-tab-panel #order-details .order-items-wrap table tr td .wrapper img {
    max-width: 60px;
}

#customer-profile-tabs .bmui-tab-panel #order-details .order-items-wrap table tr td .wrapper .details {
    font-size: 16px;
    line-height: 20px;
    padding: 8px 10px;
    width: 70%;
    padding-right: 10px;
    display: inline-block;
    vertical-align: middle;
}

#customer-profile-tabs.customer-profile-v2 .bmui-tab-body-container .bmui-tab-body-container {
    margin-top: 20px;
}

#customer-profile-tabs .bmui-tab-panel .panel-header .title {
    font-size: 20px;
    font-weight: 500;
    margin-bottom: 3px;
    display: block;
}

#customer-profile-tabs .bmui-tab-body-container h1 {
    color: #000;
    font-size: 20px;
    font-weight: 500;
    font-family: 'Open Sans', sans-serif;
    margin: 0 0 20px;
}

#customer-profile-tabs .wish-list-edit-form th {
    font-weight: 600;
    font-size: 15px;
    color: #4c4c4c;
}

#customer-profile-tabs .wish-list-edit-form tbody td {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 26px;
    color: #000000;
    padding: 12px 10px;
}

#customer-profile-tabs .bmui-tab-panel .panel-header .address span {
    font-weight: 400;
    color: #666;
}

#customer-profile-tabs .bmui-tab-panel .panel-header .address span:first-child {
    font-weight: 700;
    display: block;
    color: var(--bk-color-primary, #176F92);
    margin: 15px 0 3px;
}

#order-details .order-items-wrap th:nth-of-type(2),
#order-details .order-items-wrap td:nth-of-type(2) {
    display: none;
}

#customer-profile-tabs #bmui-tab-my-wallet h1 {
    line-height: 24px;
    margin: 20px auto 20px;
}

#customer-profile-tabs .bmui-tab-panel #order-details .order-items-wrap table tr td .wrapper .details .refer-this.product-share {
    padding: 4px 5px;
    border: 1px solid rgba(0, 0, 0, 1.0);
    background: transparent;
    max-width: 90px;
    color: #000;
    text-align: center;
    border-radius: 0px;
    margin-top: 10px;
    font-size: 14px;
    text-transform: uppercase;
    cursor: pointer;
    line-height: 22px;
}

#customer-profile-tabs .bmui-tab-panel #order-details .order-items-wrap table tr td .wrapper .details .refer-this.product-share:hover {
    padding: 4px 5px;
    background: #047dc1;
    border-color: #047dc1;
    max-width: 90px;
    color: #fff;
    text-align: center;
    border-radius: 0px;
    margin-top: 10px;
    font-size: 14px;
    text-transform: uppercase;
}


.floating-panel-popup.product-share-option.popup .customer-share-options label {
    font-size: 20px;
    margin-bottom: 12px;
    padding-bottom: 6px;
    display: block;
    border-bottom: 1px solid #f7f7f9
}

.floating-panel-popup.product-share-option.popup .customer-share-options .share-medium div {
    margin-bottom: 15px;
    cursor: pointer;
    color: #262626;
    padding-left: 30px;
    position: relative;
}

.floating-panel-popup.product-share-option.popup .customer-share-options .facebook-share:before {
    content: "\f09a";
    font-family: 'FontAwesome';
    position: absolute;
    left: 3px;
    font-size: 23px;
    color: #000;
}

.floating-panel-popup.product-share-option.popup .customer-share-options .twitter-share:before {
    content: "\f099";
    font-family: 'FontAwesome';
    position: absolute;
    left: 0;
    font-size: 23px;
    color: #000;
}

.floating-panel-popup.product-share-option.popup .customer-share-options .linkedin-share:before {
    content: "\f0e1";
    font-family: 'FontAwesome';
    position: absolute;
    left: 1px;
    font-size: 22px;
    color: #000;
    top: -2px;
}

.floating-panel-popup.product-share-option.popup .customer-share-options .share-medium div:hover {
    color: #047dc1;
}

.floating-panel-popup.product-share-option.popup .customer-share-options .share-medium div:hover:before {
    color: #047dc1;
}

.floating-panel-popup .action-item:hover {
    background-color: #ecf7fd;
}

.floating-panel-popup.product-share-option.popup .customer-share-options .share-medium div img {
    display: none;
}

.floating-panel-popup.product-share-option.popup .customer-share-options .share-medium div:hover img {
    border: 1px solid #ccc
}

.page-profile .comment-area .comment-row .show-comment,
.page-guest-customer-order-comment .comment-row .show-comment {
    width: 100%;
    padding: 5px 0 10px;
    font-weight: 400;
}

.page-profile .comment-area .comment-row.customer .name,
.page-guest-customer-order-comment .comment-row.customer .name {
    color: #000;
    font-size: 17px;
    font-weight: 500;
}

.page-profile .comment-area .comment-row .date-time,
.page-guest-customer-order-comment .comment-row .date-time {
    font-size: 14px;
    color: #878787;
    padding-top: 3px;
}

#customer-profile-tabs #bmui-tab-my-orders #order-list .id-col {
    width: 84px;
}

#customer-profile-tabs .credit-debit-card .new-card {
    width: 300px;
    max-width: inherit;
    background-color: #f0f6f9;
    border-radius: 0;
}

#customer-profile-tabs .credit-debit-card .new-card .link,
#customer-profile-tabs .credit-debit-card .new-card .link-btn {
    background: none;
    color: #000;
}

.site-popup.popup .payment-form.site-popup-form .header-wrapper>h1 {
    font-size: 22px;
    line-height: normal;
    margin: 0 0 12px;
    font-weight: 600;
}

.payment-form .form-row label,
.payment-form .double-input-row label {
    display: block;
    padding-bottom: 5px;
    width: 100%;
    display: block;
    padding-bottom: 5px;
    width: 100%;
    color: #000;
    font-size: 15px;
}

.page-profile .site-popup.popup .payment-form.site-popup-form .button-line .close.cancel-button {
    color: #000 !important;
}

.page-profile .site-popup.popup .payment-form.site-popup-form {

    margin-top: -5px !important;
}

.payment-form.site-popup-form .double-input-row.mandatory {
    padding-bottom: 13px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.payment-form.site-popup-form .double-input-row .mandatory-chosen-wrapper {
    width: calc(50% - 18px);
}

.payment-form.site-popup-form .double-input-row .mandatory-chosen-wrapper select {
    margin: 0;
    width: 100%;
    height: 50px;
    border: 1px #757575 solid;
    font-size: 16px;
    color: #000000;
    border-radius: 0;
}

.payment-form.site-popup-form .double-input-row>.form-type-info {
    color: #000;
    font-size: 20px;
    height: 50px;
    line-height: 47px;
    margin: 0;
    text-align: center;
    width: 36px;
    background-color: transparent;
    border-bottom: 1px solid transparent;
    border-top: 1px solid transparent;
}

.page-profile .payment-form.site-popup-form .double-input-row.mandatory .errorlist.after,
.advance.checkout-page .address-edit-from-wrap .form-row .errorlist.after {
    line-height: 15px;
    position: absolute;
    left: 15px;
    bottom: 12px;
}

#customer-profile-tabs.customer-profile-v2 button[disabled],
#customer-profile-tabs.customer-profile-v2 button[disabled]:hover {
    color: #e6e6e6 !important;
    ;
    background-color: #6c757d !important;
    border: 2px solid #6c757d !important;
    text-shadow: none;
    opacity: 0.7;
    cursor: default !important;
    font-weight: 500;
}

.wish_list .wish-list-share-form .form-row {
    width: 48%;
    display: inline-block;
    margin: 15px 15px 10px 0;
    position: relative;
}

.wish_list .wish-list-share-form .form-row:nth-last-child(1),
.wish_list .wish-list-share-form .form-row:nth-last-child(2) {
    width: 100%;
    display: block;
    margin: 0 0 15px;
}

.wish_list .wish-list-share-form .form-row textarea {
    width: 100%;
    max-width: 938px
}

.wish_list .wish-list-share-form .form-row:nth-last-child(1) {
    text-align: right;
    padding-right: 30px;
}

.wish_list .wish-list-share-form .form-row:nth-last-child(1) button {
    margin-left: 12px;
    max-width: 160px;
    width: 100%;
    cursor: pointer;
}

.wish_list .wish-list-share-form .form-row .errorlist.after {
    position: absolute;
    bottom: -15px;
}

.page-filter .total-result {
    margin-top: 50px;
    color: #ffa836;
}

.wish_list .no-data {
    display: block;
    color: #262626;
    font-weight: 500;
    font-size: 17px;
}

.wish_list .wish-list-edit-form .form-row.btn-row {
    text-align: right;
    margin-bottom: 90px;
}

#customer-profile-tabs.customer-profile-v2 .wish-list-share-form textarea {
    width: 100%;
    max-width: 98%;
    border: 1px solid #757575;
}

body.page-profile .close.cancel-button:hover {
    color: #000 !important;
    background-color: #FFCB54 !important;
    border-color: #FFCB54 !important;
}

.page-profile .errorlist.after {
    position: absolute;
    font-size: 12px;
}

#customer-profile-tabs.customer-profile-v2 .form-row {
    height: auto;
    margin-bottom: 16px;
}

/******************************/
.time-out.popup .header-line {
    background-color: transparent;
    text-align: center;
    padding-top: 50px;
}

.time-out.popup .header-line .ok {
    background-color: rgb(34, 108, 150);
    color: #fff;
    display: inline-block;
    height: 50px;
    line-height: 50px;
    text-align: center;
    width: 110px;
    cursor: pointer;
}

.time-out.popup .body {
    text-align: center;
    position: absolute;
    top: 40px;
    width: auto;
    background: transparent;
    padding: 0;
    left: 50%;
    transform: translate(-50%);
}

.time-out.popup .header-line:hover .ok {
    background-color: #000;
    color: #fff;
}

.floating-panel-popup.popup {
    max-width: 180px;
    padding: 12px 20px;
    box-shadow: 0 0 2px #bfbbbb;
}

/** Customer Profile End **/
.btn-add {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  justify-content: center;
}
.add-to-compare-button, .button.add-to-wish-list, .remove-from-compare-button, .product-widget .remove-from-compare-button, .add-to-wish-list.disabled, .product-widget.widget-addCart .add-to-compare-button, .product-widget.widget-addCart .add-to-wish-list {
  padding: 14px 18px;
  width:100%;
  font-size:18px;
  border: 2px solid var(--bk-color-primary, #176f92);
  color: var(--bk-color-primary, #176f92);
}
.content.product-content .product-block .block-content-wrap {
  padding: 20px;
}

.content.product-content .product-block .block-content-wrap .summary {
  padding-left: 0;
  padding-right: 0;
}
.content.product-content .product-block .block-content-wrap .summary p,
.content.product-content .product-block .block-content-wrap .summary {
  font-size: 14px;
  font-weight: 400
}
.button.add-to-wish-list:hover {
  color: #fff;
  border-color: #000;
}
.fee-widget-product-image-view .product-view.image-view .product-block:hover {
  border: 1px solid #e6e6e6;
}
.add-to-compare-button::after, .add-to-wish-list::after, .remove-from-compare-button::after {
  margin-left: 8px;
}
.btn-group.view-switchers {
  margin: 15px 0;
}
.product-view .header, .category-view .header, .entire-search .header, .product-search .header {
  background-color: transparent;
  border-bottom: 0;
}
.product-view .footer, .category-view .footer, .entire-search .footer, .product-search .footer {
border-top: 0;
}
.blog-post-item .post-description .blog-post-info {
  padding: 5px 0 12px;
}
.blog-post-item .blog-post-info > span {
  font-size: 13px;
}
.blog-post-item .post-description .blog-post-info .comment-count {
  margin-left: 8px;
}
.side-in-search-area .search-bar {
  margin: 30px 40px 30px;
}
div.side-in-search-area .search-bar input[type="text"] {
  padding: 0 0 15px !important;
}
/**********payment-success**************/
.page-post-payment table.cartitem-table {
    margin: 10px 0;
    border: 0;
}

.page-post-payment .message-details {
    max-width: 600px;
    margin: 0px auto 30px;
    text-align: center;
}

.page-post-payment .message-details p {
    font-size: 25px;
    font-weight: 400;
    line-height: 32px;
    color: #000;
}

.page-post-payment .message-details p a {
    color: #000;
    font-size: 25px;
    font-weight: 500;
    line-height: 32px;
    text-decoration: underline !important;
    font-family: 'Open Sans', sans-serif;
}

.page-post-payment .message-details p a:hover {
    color: #2a87bc;
}

.page-post-payment .message-details p.order-info .order-id {
    font-size: 33px;
    font-weight: 700;
}

.page-post-payment .order-details {
    max-width: 1200px;
    margin: 20px auto 30px;
    padding: 50px;
    border: 1px solid #efefef;
    background: #FFFFFF;
    border: 1px solid #F0F0F0;
    border-radius: 0;
}

.page-post-payment .order-details h4.table_heading {
    display: none;
}

.page-post-payment .order-details .cartitem-table tr td {
    font-size: 20px;
    color: #000;
    font-weight: 400;
    font-family: 'Open Sans', sans-serif;
}

.page-post-payment .order-details .cartitem-table tr td {
    padding: 20px 0;
}

.page-post-payment .order-details .cartitem-table tr:first-child th {
    font-size: 22px;
    background: transparent;
    font-weight: 500;
    color: #000;
    font-family: 'Open Sans', sans-serif;
}

.page-post-payment .cartitem-table th,
.page-post-payment .cartitem-table td {
    width: 20%;
    text-align: center;
}

.page-post-payment .cartitem-table th.price,
.page-post-payment .cartitem-table td.price {
    text-align: right;
}

.page-post-payment .order-details .cartitem-table th:first-child,
.page-post-payment .order-details .cartitem-table th:last-child {
    padding: 0
}

.page-post-payment .order-details .cartitem-table th:first-child,
.page-post-payment .order-details .cartitem-table td:first-child {
    width: 40%;
    text-align: left;
    font-size: 18px;
}

.page-post-payment .order-details .cartitem-table th:last-child,
.page-post-payment .order-details .cartitem-table td:last-child {
    width: 20%;
}

.page-post-payment .payment-success-total table td {
    font-size: 17px;
    color: #393939;
}

.page-post-payment .payment-success-total>table,
.page-post-payment .payment-success-total>table td {
    border: 0;
    padding: 10px 0;
}

.page-post-payment .payment-success-total>table td.price,
.page-post-payment .payment-success-total>table td.price .price {
    text-align: right;
    font-size: 20px;
    font-weight: 400;
    color: #000;
}

.page-post-payment .payment-success-total>table tr.total-order .price {
    font-size: 22px;
    font-weight: 700;
    color: #000;
}

.page-post-payment .payment-success-total>table tr.total-order .total-label {
    font-size: 22px;
    font-weight: 700;
    color: #000;
}

.page-post-payment .payment-success-total>table tr {
    border-bottom: 1px solid #f6f6f6;
}

.page-post-payment .payment-success-total>table tr.total-order {
    border-bottom: 0;
}

.page-post-payment .order-details .cartitem-table th,
.page-post-payment .order-details .cartitem-table td {
    border: 0
}

/**********end payment-success**************/



/** Flying Cart Start **/
.flying-cart-remove-wrapper .flying-cart-item-remove {
    background-image: url("../images/flying-cart-cross-arrow.svg");
}

.flying-cart-content.page-content.loading.popup {
    padding: 0;
    top: 0 !important;
}

.flying-cart-item .flying-cart-item-image {
    max-width: 100px;
    width: 100%;
}

.flying-cart-item {
    border-bottom: 1px solid rgba(0, 0, 0, 0.11);
    padding: 25px 35px;
}

.flying-cart-page-heading {
    font-family: 'Open Sans', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 28px;
    line-height: 32px;
    text-align: center;
    text-transform: capitalize;
    color: #000000;
    padding: 18px 0;
    padding: 18px 0;
}

.flying-cart-item:last-child {
    padding-bottom: 320px;
}

.flying-cart-item-image img {
    width: 126px;
    height: 126px;
    object-fit: contain;
}

.flying-cart-product-name a:link,
.flying-cart-product-name a:visited {
    font-family: 'Open Sans', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    color: #000000;
    text-transform: capitalize;
}

.flying-cart-product-name a:hover {
    color: #0f72aa;
}

.flying-cart-quantity.quantity.cartitem-table .flying-cart-quantity-wrapper.wrapper {
    float: left;
}

.flying-cart-quantity-wrapper .stepper-arrow::before,
.flying-cart-quantity-wrapper .stepper-arrow::after {
    background-color: transparent;
}

.flying-cart-quantity-wrapper .stepper-arrow.down::before {
    transform: unset;
    right: 20px;
}

.flying-cart-quantity-wrapper .stepper input[type="text"]:focus,
.flying-cart-quantity-wrapper .stepper input[type="tel"]:focus,
.flying-cart-quantity-wrapper .stepper input[type="password"]:focus,
.flying-cart-quantity-wrapper .stepper input[type="email"]:focus,
.flying-cart-quantity-wrapper .stepper textarea:focus {
    border: 0;
}

.flying-cart-quantity-wrapper .stepper-arrow.up,
.flying-cart-quantity-wrapper .stepper-arrow.down {
    width: 35px;
    font-weight: 400;
}

.flying-cart-unit-price-wrapper {
    font-size: 21px;
    font-weight: 500;
    line-height: 23px;
}

.flying-cart-footer {
    padding: 30px 35px;
    left: 0;
    z-index: 111;
}

.flying-cart-shopping-cart-total>div {
    margin-bottom: 10px;
}

.check-out-total *,
.shopping-cart-total * {
    font-size: 18px;
    text-transform: capitalize;
}

.flying-cart-total-label span,
.flying-cart-bottom-price span {
    font-size: 20px;
    line-height: 24px;
    color: #000;
}

.flying-cart-footer .flying-cart-shopping-cart-total .flying-cart-bottom-price span {
    font-size: 20px;
    font-weight: 500 !important;
    color: #000;
    text-transform: capitalize;
}

.flying-cart-shopping-cart-total .flying-cart-total-order {
    padding-top: 0;
    margin-top: 20px;
}

.flying-cart-shopping-cart-total .flying-cart-total-order .flying-cart-total-label span {
    font-size: 21px;
    text-transform: uppercase;
    font-weight: 500;
}

.flying-cart-total-order .flying-cart-total-label span,
.flying-cart-total-order .flying-cart-bottom-price span {
    font-weight: 500 !important;
}

.flying-cart-shopping-cart-total .flying-cart-total-order .flying-cart-bottom-price span {
    font-size: 30px;
    text-transform: uppercase;
    color: #000;
    font-weight: 700 !important;
}

.flying-cartitem-btn-wrapper .flying-cart-footer-button {
    width: 100% !important;
    max-width: 100% !important;
    background: var(--bk-color-primary, #176F92);
    border: 2px solid var(--bk-color-primary, #176F92);
    padding: 6px 30px;
    border-radius: 0;
    font-family: 'Open Sans', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 18px;
    line-height: 35px;
    text-align: center;
    text-transform: uppercase;
    color: #FFFFFF;
    height: 50px;
}

.flying-cartitem-btn-wrapper .flying-cart-footer-button:hover {
    background: var(--bk-color-secondary, #E8631E);
    border: 2px solid var(--bk-color-secondary, #E8631E);
    color: #fff;
}

.flying-cart-content.page-content.loading.popup .continue-shopping-btn {
    width: 100% !important;
    max-width: 100% !important;
    background: var(--bk-color-primary, #176F92);
    border: 2px solid var(--bk-color-primary, #176F92);
    font-weight: 500;
    padding: 6px 30px;
    border-radius: 0;
    font-size: 20px;
    line-height: 49px;
    color: #fff;
    height: 63px;
}

.flying-cart-content.page-content.loading.popup .continue-shopping-btn:hover {
    background: #000;
    border: 2px solid #000;
    color: #fff;
}

/** Stepper Start **/


.flying-cart-quantity-wrapper .stepper .stepper-arrow.up {
    -webkit-box-ordinal-group: 4;
    -ms-flex-order: 3;
    order: 3;
    position: relative;
}

.flying-cart-quantity-wrapper .stepper .stepper-arrow.down {
    -webkit-box-ordinal-group: 2;
    -ms-flex-order: 1;
    order: 1;
    position: relative;
}

/** Stepper End **/
.advance-checkout-order-details-right-dom-inner .cartitem-table,
.flying-cart-content.page-content.loading.popup .flying-cart-container,
.advance-checkout-steps-left-dom {
    background-color: rgba(57, 210, 173, 0.7) transparent;
    scrollbar-width: thin;
}
.advance-checkout-steps-left-dom, .advance-checkout-order-details-right-dom {
    display: block;
}
.advance-checkout-order-details-left-dom-inner, .advance-checkout-order-details-right-dom-inner {
    width: auto;
}
.advance-checkout-order-details-right-dom-inner .cartitem-table::-webkit-scrollbar,
.flying-cart-content.page-content.loading.popup .flying-cart-container::-webkit-scrollbar,
.advance-checkout-steps-left-dom::-webkit-scrollbar {
    width: 10px;
}

.advance-checkout-order-details-right-dom-inner .cartitem-table::-webkit-scrollbar-corner,
.advance-checkout-order-details-right-dom-inner .cartitem-table::-webkit-scrollbar-track,
.flying-cart-content.page-content.loading.popup .flying-cart-container::-webkit-scrollbar-corner,
.flying-cart-content.page-content.loading.popup .flying-cart-container::-webkit-scrollbar-track,
.advance-checkout-steps-left-dom::-webkit-scrollbar-corner,
.advance-checkout-steps-left-dom::-webkit-scrollbar-track {
    background-color: transparent;
    background: transparent
}

.advance-checkout-order-details-right-dom-inner .cartitem-table::-webkit-scrollbar-thumb,
.flying-cart-content.page-content.loading.popup .flying-cart-container::-webkit-scrollbar-thumb,
.advance-checkout-steps-left-dom::-webkit-scrollbar-thumb {
    background-color: #ccc;
    border: 1px solid transparent;
    background-clip: content-box;
}

.flying-cart-content.page-content.loading.popup .flying-cart-container::-webkit-scrollbar-thumb,
.advance-checkout-steps-left-dom::-webkit-scrollbar-thumb {
    background-color: var(--bk-color-primary, #176F92);
    -webkit-border-radius: 10px;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.3);
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
}

.advance-checkout-order-details-right-dom-inner .cartitem-table::-webkit-scrollbar-track,
.flying-cart-content.page-content.loading.popup .flying-cart-container::-webkit-scrollbar-track,
.advance-checkout-steps-left-dom::-webkit-scrollbar-track {
    background: transparent;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
    -webkit-border-radius: 10px;
    border-radius: 10px;
}

.advance-checkout-order-details-right-dom-inner .cartitem-table::-webkit-scrollbar-thumb:window-inactive,
.flying-cart-content.page-content.loading.popup .flying-cart-container::-webkit-scrollbar-thumb:window-inactive,
.advance-checkout-steps-left-dom::-webkit-scrollbar-thumb:window-inactive {
    background: rgba(255, 255, 255, 0.3);
}
@media (max-width: 767px) {
    .flying-cart-content.page-content.loading.popup {
        width: 100vw!important;
        left: auto!important;
        right: 0;
        min-width: inherit;
    }
  .page-registration .registration-form {
  padding: 25px 15px;
}
    .flying-cart-content .flying-cart-item {
        padding: 25px 15px;
    }
    
    .flying-cart-content .flying-cart-item {
        display: block;
        position: relative;
        text-align: center;
    }
    
    .flying-cart-item .flying-cart-item-image {
        margin: 0 auto;
    }
    
    .flying-cart-quantity.quantity.cartitem-table .flying-cart-quantity-wrapper.wrapper {
        float: none;
    }
    
    .flying-cart-unit-price-wrapper {
        margin-top: 0;
    }
    
    .flying-cart-remove-wrapper .flying-cart-item-remove {
        position: absolute;
        top: 15px;
        right: 15px;
    }
    
    .flying-cart-content.page-content.loading.popup .flying-cart-container {
        height: calc(100% - 375px);
    }
    .category-details .product-view.image-view .content {
    margin-top: 0px;
}

}

/** Flying Cart End **/

body.widget-snippet::before {
    background-color: #fff;
}

/*-------------------- Start jesor slider------------*/
.mb-0 {
    margin-bottom: 0 !important;
}

.jssor-slider-container .caption-wrapper {
    position: static;
    padding: 0;
    height: 100%;
    display: block;
    text-align: left;
}

.jssor-slider-container .caption-wrapper>* {
    z-index: 2;
}

.jssor-slider-container .caption-wrapper [u=caption] {
    position: absolute;
    padding: 0;
    z-index: 2;
    overflow: hidden;
}

.jssor-slider-container .caption-wrapper [u=caption] a {
    padding: 0;
    border: none;
    display: inline;
    z-index: 1;
}

.jssor-slider-container .slide:after {
    background: rgba(0, 0, 0, 0)
}

div.jssor-slider-container .jssora20l,
div.jssor-slider-container .jssora20r,
div.jssor-slider-container .slide {
    display: none;
}

div.jssor-slider-container[jssor-slider="true"] .slide,
div.jssor-slider-container[jssor-slider="true"] .jssora20l,
div.jssor-slider-container[jssor-slider="true"] .jssora20r {
    display: block;
}

/* jssor slider defoult */
div[id^="jssor-slider-"] .jssora20l::before,
div[id^="jssor-slider-"] .jssora20r::before {
    height: 8px;
    margin: 0 auto;
    color: #ffffff;
    content: "\f105 ";
    font-family: fontawesome;
    font-size: 36px;
    left: 0;
    right: 0;
    text-align: center;
}

div[id^="jssor-slider-"] .jssora20l:hover:before,
div[id^="jssor-slider-"] .jssora20r:hover:before {
    color: #ffffff;
}

.jssor-slider-container .jssor-loader .loader-2 {
    display: none;
}

div[id^="jssor-slider-"] .jssora20l {
    left: auto;
    right: 0;
    transform: rotate(180deg);
}

div[id^="jssor-slider-"] .jssora20l,
div[id^="jssor-slider-"] .jssora20r {
    background: none;
    bottom: 0;
    height: 50px;
    line-height: 46px;
    text-align: center;
    position: absolute;
    transition: all 300ms ease-out 0s;
    width: 50px;
    border: 1px solid rgba(255, 255, 255, 0.2);
}

div.jssor-slider-container .jssora20l {
    left: 50px;
}

div[id^="jssor-slider-"] .jssora20r::before {
    line-height: 46px;
}

div[id^="jssor-slider-"] .jssora20r {
    left: auto;
    right: 50px;
}

div.jssor-slider-container .jssora20l,
div.jssor-slider-container .jssora20r,
div.jssor-slider-container .slide {
    display: none;
}

div[id^="jssor-slider-"] .jssora20l:hover,
div[id^="jssor-slider-"] .jssora20r:hover {
    background: var(--bk-color-secondary, #E8631E) none repeat scroll 0 0;
    border: 1px solid var(--bk-color-secondary, #E8631E);
}

div[id^="jssor-slider-"] .jssora20l:hover::before,
div[id^="jssor-slider-"] .jssora20r:hover::before {
    color: #fff;
}

div.jssor-slider-container .container,
div.jssor-slider-container {
    width: 1920px;
    height: 677px;
    margin: 0 auto;
}

div.jssor-slider-container .slide {
    display: none;
}

div.jssor-slider-container[jssor-slider="true"] .slide {
    display: block;
}

div.jssor-slider-container .container [u="caption"] {
    color: #ffffff;
    height: auto;
    left: 20%;
    margin-left: -128px;
    max-width: 700px;
    padding: 0;
    position: absolute;
    right: 0;
    text-align: left;
}

div.jssor-slider-container .description.jssor-caption-1 {
    top: 20%;
    height: 140px;
}

div.jssor-slider-container .description.jssor-caption-1 h1 {
    color: #fff;
    font-family: 'Open Sans', sans-serif;
    font-size: 60px;
    font-weight: 700;
    line-height: 1.2;
    margin: 0;
    text-transform: uppercase;
}

div.jssor-slider-container .title.jssor-caption-2 {
    top: 44%;
    height: 78px;
}

div.jssor-slider-container .title.jssor-caption-2 span {
    color: rgba(255, 255, 255, 0.8);
    font-family: 'Open Sans', sans-serif;
    font-size: 25px;
    font-weight: 400;
    line-height: 1.5;
    margin: 0;
}

div.jssor-slider-container .container .jssor-caption-3 {
    top: 64%;
}

div.jssor-slider-container .container .jssor-caption-3>a {
    padding: 15px 40px;
    background: var(--bk-color-primary, #176F92);
    font-family: Open Sans;
    font-size: 1.1em;
    font-weight: 700;
    width: 250px;
    height: 58px;
    line-height: 1.3;
    letter-spacing: 0.15em;
    text-decoration: none;
    text-transform: uppercase;
    color: #fff;
    display: inline-block;
    transition: all 300ms ease-out 0s;
}

div.jssor-slider-container .container .jssor-caption-3>a::after {
    content: '';
    width: 16px;
    height: 13px;
    display: inline-block;
    margin: 7px 0 0 15px;
    background-repeat: no-repeat;
    background-image: url(/template/106fffdc/images/button-arrow.svg);
    transition: all 300ms ease-out 0s;
    position: absolute;
}

div.jssor-slider-container .container .jssor-caption-3>a:hover {
    background: var(--bk-color-secondary, #E8631E);
}

/* End jssor slider defoult */

/*blog design*/

.blog-post-item .content>p {
    margin: 0;
    padding: 0;
}
.blog-post-details .image.blog-post-image img {
  min-width: 750px;
}
.blog-posts::after,
.blog-post-content::after {
    content: "";
    display: block;
    clear: both;
}

.blog-post-item {
    box-sizing: border-box;
    float: left;
    padding: 0 15px;
    width: 33.333%;
    border-bottom: none;
}

.blog-post-item .title a {
    color: #000;
    font-family: 'Poppins', sans-serif;
    font-size: 22px;
    text-transform: uppercase;
    font-weight: 700;
    opacity: 0.9;
    transition: all 300ms ease-out;
    line-height: 1.5;
}

.blog-post-item .title a:hover {
    color: var(--bk-color-secondary, #E8631E);
}

.blog-post-item .content {
    color: #878787;
    font-size: 15px;
    line-height: 1.8;
}

div.post .post-list-view-width {
    width: 100%;
}

.blog-post-item .details-link.link a {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
    color: #42a5f6;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1px;
    padding: 0;
    text-transform: uppercase;
}

.widget-blogPost .title {
    padding-bottom: 18px;
    margin: 0;
    padding-top: 60px;
      line-height: 36px;
}

.blog-post-info>span {
    height: 20px;
    display: inline-block;
    font-size: 16px;
    font-weight: 600;
    color: #000;
    line-height: normal;
    opacity: 0.5;
}

.blog-post-info span.date {
    background: none;
    padding-left: 0;
    margin-right: 0;
}

.blog-post-item .post-description {
    position: relative;
    padding-left: 30px;
}

.blog-post-item .post-description::after {
    content: "";
    position: absolute;
    border-left: 2.5px solid rgba(0, 0, 0, 0.2);
    height: 80px;
    top: 35px;
    left: 0;
}

.blog-post-info span.categories {
    background: none;
    padding: 0;
    margin: 0;
    opacity: 1;
    position: absolute;
    top: 31px;
    left: 30px;
}

.blog-post-info span.categories a {
    color: #000;
    padding: 0;
    font-size: 16px;
    text-transform: uppercase;
    font-weight: 600;
    line-height: normal;
    transition: all 300ms ease-out;
}

.blog-post-info span.categories a:hover {
    color: var(--bk-color-secondary, #E8631E);
}

.blog-post-item .post-description:hover {
    position: relative;
}

.blog-posts,
.blog-post-content {
    margin: 0 -15px;
}

 

.blog-post-item {
    margin-bottom: 30px;
    box-sizing: border-box;
    float: left;
    padding: 0 20px;
    width: 33.333%;
    border-bottom: none;
}

.blog-post-item div.post-list-view {
    height: auto;
    padding: 0;
    width: 100%;
}

.blog-post-item div.post-list-view img {
    height: auto;
    max-width: 100%;
    max-height: 100%;
    width: 100%;
}

/*Checkout & Profile design*/

.advance.checkout-page .form-row input,
.advance.checkout-page .form-row select,
.advance.checkout-page .form-row textarea,
.advance.checkout-page textarea {
    border-radius: 0;
    border: 2px #878787 solid;
}

.advance.checkout-page .form-row input:focus,
.advance.checkout-page .form-row textarea:focus,
.advance.checkout-page textarea:focus {
    border-radius: 0;
    border: 2px var(--bk-color-primary, #176F92) solid;
}

.contact-information-advance-panel span.text-login-from-checkout-advance a {
    color: var(--bk-color-secondary, #E8631E);
    font-size: 17px;
    font-weight: 600;
    cursor: pointer;
    position: relative;
}

.advance-checkout-order-details-right-dom .price-row.total-order .price .currency-code {
    font-weight: 600;
    color: #000;
}

.advance-checkout-order-details-right-dom .price-row.total-order .price,
.advance-checkout-order-details-right-dom .product-name a,
.advance.checkout-page .continue-shopping-btn-from-checkout,
.checkout-page .continue-shopping-btn-from-checkout {
    color: var(--bk-color-primary, #176F92);
}

.advance.checkout-page .continue-shopping-btn-from-checkout:hover,
.checkout-page .continue-shopping-btn-from-checkout:hover {
    color: var(--bk-color-secondary, #E8631E);
}

.advance.checkout-page .checkout-button-wrapper-bottom .advance-checkout-next-step-parser-button {
    background-color: var(--bk-color-primary, #176F92);
    border-radius: 0;
    min-width: 307px;
    height: auto;
    line-height: normal;
    padding: 19px 30px;
}

.advance.checkout-page .checkout-button-wrapper-bottom .advance-checkout-next-step-parser-button:hover {
    background-color: var(--bk-color-secondary, #E8631E);
}

.advance.checkout-page .shipping-address-advance-panel .form-row input[type="checkbox"]:checked+.type-label:before {
    background-color: var(--bk-color-primary, #176F92);
    border: 2px var(--bk-color-primary, #176F92) solid;
}

.advance.checkout-page .shipping-info-advance-panel>.form-row input[type="radio"]:checked+.label-text:before {
    border-color: var(--bk-color-primary, #176F92);
}

.advance.checkout-page .shipping-info-advance-panel>.form-row input[type="radio"]:checked+.label-text:after {
    background-color: var(--bk-color-primary, #176F92);
}

.advance.checkout-page .address-view .edit-address,
.advance.checkout-page .address-view .change-address {
    font-weight: 600;
    color: var(--bk-color-primary, #176F92);
}

.checkout-page .toolbar-btn {
    border: 1px solid var(--bk-color-primary, #176F92);
    color: var(--bk-color-primary, #176F92);
    font-size: 15px;
    background: none;
}

.checkout-page .toolbar-btn:hover {
    color: #ffffff;
    background: var(--bk-color-primary, #176F92);
    border: 1px solid var(--bk-color-primary, #176F92);
}

.page-checkout .floating-panel-popup.popup {
    width: 325px !important;
    padding: 14px;
    max-width: inherit;
}

.advance.checkout-page .button,
.advance.checkout-page .button,
.floating-panel-popup.popup .create-address {
    background-color: var(--bk-color-primary, #176F92);
    text-align: center;
    color: #fff;
    padding: 10px 12px;
    cursor: pointer;
    line-height: 17px;
    border-radius: 0;
    font-size: 15px;
}

.advance.checkout-page .button:hover,
.advance.checkout-page .button:hover,
.floating-panel-popup.popup .create-address:hover {
    background: var(--bk-color-secondary, #E8631E);
    color: #ffffff;
}

.address-selection-popup .addresses>.address {
    color: #000;
    border-bottom: none;
    padding: 12px 0px;
}

.contact-information-advance-panel span.text-login-from-checkout-advance a:hover {
    color: var(--bk-color-primary, #176F92);
}

.body #customer-profile-tabs.customer-profile-v2 .profileLogout a {
    padding: 8px 15px;
}

#customer-profile-tabs.customer-profile-v2 button.cancel-button {
    border: 2px solid var(--bk-color-primary, #176F92);
    background: transparent;
    color: var(--bk-color-primary, #176F92);
}

#customer-profile-tabs.customer-profile-v2 button.cancel-button:hover {
    background: var(--bk-color-primary, #176F92);
    color: #fff;
    border: 2px solid var(--bk-color-primary, #176F92);
}

.page-profile .errorlist.after {
    font-size: 14px;
}

.site-popup .content,
.confirm-popup .body {
    padding: 30px 0;
}

body.page-profile select,
body.page-profile input[type="text"],
body.page-profile input[type="password"],
body.page-profile input[type="email"] {
    width: 100%;
}

body.page-profile .close.cancel-button:hover {
    color: #fff !important;
    background-color: #000 !important;
    border-color: #000 !important;
}

/*End Checkout & Profile design*/
#spltr-CE0A0B26-395F-461E-BF6F-B2CDE7C0EF2B {
    margin-top: 0;
}
.checkout-page.version-2 .advance-checkout-order-details-right-dom-inner .cartitem-table > div {
    border-top: 1px #fdfdfd solid;
    margin: 0;
}
.checkout-page.version-2 .advance-checkout-order-details-right-dom .product-name {
    padding: 0;
}
.shopping-cart .product-card__product-name a {
    font-size: 16px;
    font-weight: 500;
    color: #0f0f0f;
}
.shopping-cart .my-cart-order-summary {
    height: fit-content;
}
.newsletter.subscribe.valid-verify-form .form-row label {
    display: block;
    width: 100%;
    margin-bottom: 5px;
}
/* +++++++++++++++ Contact Us Page ++++++++++++++++ */
.widget-html.Contact-us-page,
.widget-form.contact_form {
    max-width: 750px;
    margin: 0 auto;
    text-align: center;
    padding: 0 15px;
}

.widget-html.Contact-us-page h2 {
    font-size: 45px;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 1.2;
    color: #000000;
    font-family: 'Open Sans', sans-serif;
    letter-spacing: 0.05em;
    margin: 15px 0;
}

.widget-html.Contact-us-page h4 {
    font-size: 32px;
    font-family: 'Open Sans', sans-serif;
    color: #000000;
    line-height: 1.4;
    margin: 0;
    font-weight: 500;
}

.widget-html.Contact-us-page p {
    font-size: 17px;
    line-height: 1.7;
    margin: 5px auto 15px;
    font-weight: 400;
    font-family: 'Open Sans', sans-serif;
    color: #000000;
    max-width: 420px;
}

.widget-form.contact_form .widget-title {
    font-size: 32px;
    font-family: 'Open Sans', sans-serif;
    color: #000000;
    line-height: 1.3;
    margin: 0;
    font-weight: 500;
    padding: 25px 0 14px;
}

/*.widget-form .contact_form input[type="text"], .widget-form .contact_form textarea, .widget-form .contact_form select {*/
/*border: 1px solid #0F89BB;*/
/*}*/
.contact_form .form-row.btn-row {
    display: inline-block;
    width: 100%;
    vertical-align: top;
}

/*.contact_form .form-row input[type="text"]:focus,*/
/*.contact_form .form-row textarea:focus {*/
/*border: 1px solid #0F89BB;*/
/*}*/
.widget-form .double-input-row,
.widget-form .triple-input-row,
.widget-form .contact_form .double-input-row,
.contact_form .custom-form .single-input-row {
    margin: 0 -12px;
}

.contact_form .custom-form .form-row {
    padding: 0 12px;
}

.widget.widget-form.contact_form .form-row,
.widget.widget-form.contact_form .single-input-row .form-row {
    margin: 12px 0;
}

.widget.widget-form.contact_form .custom-form .single-input-row .textArea {
    margin-top: 24px;
}

.contact_form .custom-form .form-row.btn-row label {
    display: none;
}

.custom-form .contact_form .errorlist {
    min-width: inherit;
    padding-left: 0;
}

.widget-form input[type="text"],
.widget-form textarea,
.widget-form select {
    border: 2px solid #878787;
}

.contact_form .custom-form .form-row input[type="text"] {
    color: #000000;
    font-size: 17px;
    line-height: 22px;
    margin: 0;
    width: 100%;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    padding: 5px 10px;
    height: 50px;
    /*border: 1px solid #878787;*/
}

.contact_form .custom-form .form-row textarea {
    color: #000000;
    font-size: 17px;
    line-height: 22px;
    margin: 0;
    width: 100%;
    font-family: 'Open Sans', sans-serif;
    font-weight: 400;
    padding: 10px;
    height: 180px;
    /*border: 1px solid #878787;*/
}

.contact_form .custom-form .form-row input[type="text"]::-webkit-input-placeholder {
    color: rgba(0, 0, 0, 0.8);
    font-size: 15px;
}

.contact_form .custom-form .form-row input[type="text"]::-moz-placeholder {
    color: rgba(0, 0, 0, 0.8);
}

.contact_form .custom-form .form-row input[type="text"]:-ms-input-placeholder {
    color: rgba(0, 0, 0, 0.8);
}

.contact_form .custom-form .form-row input[type="text"]:-moz-placeholder {
    color: rgba(0, 0, 0, 0.8);
}

.contact_form .custom-form .form-row textarea::-webkit-input-placeholder {
    color: rgba(0, 0, 0, 0.8);
}

.contact_form .custom-form .form-row textarea::-moz-placeholder {
    color: rgba(0, 0, 0, 0.8);
}

.contact_form .custom-form .form-row textarea:-ms-input-placeholder {
    color: rgba(0, 0, 0, 0.8);
}

.contact_form .custom-form .form-row textarea:-moz-placeholder {
    color: rgba(0, 0, 0, 0.8);
}

.contact_form .custom-form .form-row.btn-row {
    padding: 0;
    text-align: right;
}

.contact_form .custom-form .form-row.btn-row .submit-button {
    font-size: 18px;
    text-transform: uppercase;
    line-height: 22px;
    height: 50px;
    font-weight: 500;
    transition: all 300ms ease-out 0s;
    padding: 10px;
    margin: 0;
    width: 100%;
    background: var(--bk-color-primary, #176F92);
    color: #ffffff;
}

.contact_form .custom-form .form-row.btn-row .submit-button:hover {
    background: var(--bk-color-secondary, #E8631E);
    color: #ffffff;
}

.contact_form .errorlist.after .message-block {
    font-size: 14px;
}

.message-block.info-message,
.message-block.success {
    font-size: 15px;
    padding: 7px;
}


@media (max-width: 991px) {
    .widget-html.Contact-us-page h2 {
        font-size: 38px;
    }
}

@media (max-width: 767px) {
    .widget-form.contact_form .custom-form {
        margin-bottom: 20px;
    }

    .widget-html.Contact-us-page h2 {
        font-size: 32px;
        margin: 15px 0 20px;
    }

    .widget-html.Contact-us-page h4 {
        font-size: 24px;
    }

    .widget-form.contact_form .widget-title {
        font-size: 24px;
        padding: 10px 0 10px;
    }
  .product-widget.widget-addCart .add-to-cart-button, .widget-addCart .buy-now-button, .product-widget.widget-addCart .add-to-cart-button {
  width: 100% !important;
    padding: 13px 14px !important;
    font-size: 18px !important;
}
}

@media (max-width: 575px) {
    .widget-form .double-input-row .form-row {
        width: 100%;
    }

    .contact_form .custom-form .form-row textarea {
        height: 150px;
    }
}

/* +++++++++++++++ End Contact Us Page ++++++++++++++++ */


/* ===================== Snippet responsive =========================== */

/* ---------------- Banner Bottom ------------------- */
@media(max-width:1559px) {
    .widget-snippet .banner-bottom-section>div.item-section:nth-of-type(1) {
        background-size: 391px;
    }

    .widget-snippet .banner-bottom-section>div.item-section:nth-of-type(2) {
        background-size: 472px;
    }

    .widget-snippet .banner-bottom-section>div.item-section:nth-of-type(3) {
        background-size: 235px;
    }
}
@media(min-width:1420px){
    .widget-snippet .banner-bottom-section > div.item-section:nth-last-of-type(2) {
        height: 90rem;
    }
    .widget-snippet .banner-bottom-section > div.item-section:nth-last-of-type(1) {
        height: 90rem;
    }
}

@media(max-width: 1419px) {
    .widget-snippet .banner-bottom-section>div.item-section {
        padding: 3rem 3rem;
    }

    .widget-snippet .banner-bottom-section>div.item-section:nth-last-of-type(2) {
        padding: 4rem 4rem;
        background-size: 625px;
        height: 72rem;
    }

    .widget-snippet .banner-bottom-section>div.item-section:nth-of-type(4) .content {
        max-width: 71%;
    }

    .widget-snippet .banner-bottom-section>div.item-section:nth-last-of-type(1) {
        height: 72rem;
        background-size: 341px;
        padding: 4rem;
    }
}

@media(max-width:1199px) {
    .widget-snippet .banner-bottom-section>div.item-section:nth-of-type(1) {
        width: 50%;
        flex: 1 1 50%;
        order: 0;
    }

    .widget-snippet .banner-bottom-section>div.item-section:nth-of-type(2) {
        width: 50%;
        flex: 1 1 50%;
        order: 1;
    }

    .widget-snippet .banner-bottom-section>div.item-section:nth-of-type(3) {
        order: 3;
        height: 70rem;
        background-size: 475px;
    }

    .widget-snippet .banner-bottom-section>div.item-section:nth-last-of-type(2) {
        order: 5;
        height: auto;
        padding: 4rem 2rem 19em;
        background-size: 40em;
    }

    .widget-snippet .banner-bottom-section>div.item-section:nth-last-of-type(1) {
        order: 4;
        height: 70rem;
    }
}

@media(max-width:991px) {
    .widget-snippet .banner-bottom-section>div.item-section .content h3 {
        font-size: 2em;
    }

    .widget-snippet .banner-bottom-section>div.item-section:nth-of-type(1) .content,
    .widget-snippet .banner-bottom-section>div.item-section:nth-of-type(3) .content {
        max-width: 100%;
    }

    .widget-snippet .banner-bottom-section>div.item-section .content p {
        font-size: 1em;
    }
}

@media(max-width:767px) {
    .widget-snippet .banner-bottom-section>div.item-section:nth-of-type(1) {
        width: 100%;
        flex: 1 1 100%;
        height: auto;
        padding-bottom: 12em;
    }

    .widget-snippet .banner-bottom-section>div.item-section .content h3 {
        font-size: 1.5em;
    }

    .widget-snippet .banner-bottom-section>div.item-section:nth-of-type(2) {
        width: 100%;
        flex: 1 1 100%;
        height: auto;
        padding-bottom: 14em;
    }

    .widget-snippet .banner-bottom-section>div.item-section:nth-of-type(3) {
        flex: 1 1 100%;
        width: 100%;
        height: auto;
        padding-bottom: 13em;
        background-size: 20em;
    }

    .widget-snippet .banner-bottom-section>div.item-section:nth-last-of-type(1) {
        flex: 1 1 100%;
        width: 100%;
        height: auto;
        background-size: 19em;
        padding: 4rem 2rem 16em;
    }

    .widget-snippet .banner-bottom-section>div.item-section:nth-of-type(4) .content {
        width: 100%;
        max-width: inherit;
    }

    .widget-snippet .banner-bottom-section>div.item-section:nth-of-type(4) .content>p {
        padding: 12px 0 8px;
        margin-bottom: 7px;
    }

    .widget-snippet .banner-bottom-section>div.item-section:nth-last-of-type(2) {
        background-size: 20em;
    }

}


/* -------- CERTIFIED DATA ERASURE --------------  */
@media(max-width: 1429px) {
    .widget.widget-snippet .data-erasure-area {
        padding-left: 15px;
        padding-right: 15px;
        max-width: inherit;
    }

    .widget.widget-snippet .data-erasure-area .content .left-part img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .widget.widget-snippet .data-erasure-area .content .right-part {
        padding: 3em;
    }
}

@media(max-width: 991px) {
    .widget.widget-snippet .data-erasure-area .content .right-part h4 {
        font-size: 2em;
    }

    .widget.widget-snippet .data-erasure-area .content .right-part p {
        font-size: 15px;
    }

    .widget.widget-snippet .data-erasure-area .content .right-part a {
        padding: 6px 19px;
        font-size: 1em;
        line-height: 2.5em;
    }

    .widget.widget-snippet .data-erasure-area .content .right-part p strong {
        font-size: 20px;
    }
}

@media(max-width: 767px) {
    .widget.widget-snippet .data-erasure-area .content {
        display: block;
    }

    .widget.widget-snippet .data-erasure-area .content .right-part {
        padding: 1.5em;
    }

    .widget.widget-snippet .data-erasure-area .content .right-part h4 {
        font-size: 1.5em;
    }
}

/* --------------------------SELL YOUR USED IT EQUIPMENT --------------------- */
@media(max-width: 1599px) {
    .widget.widget-snippet .sell-usedit-area .content .left-part img {
        height: 100%;
        width: 100%;
        object-fit: cover;
    }
}

@media(max-width: 1429px) {
    .widget.widget-snippet .sell-usedit-area .content .right-part {
        padding: 4rem;
    }
}

@media(max-width: 991px) {
    .widget.widget-snippet .sell-usedit-area .content .right-part h4 {
        font-size: 2em;
    }

    .widget.widget-snippet .sell-usedit-area .content .right-part p {
        font-size: 15px;
    }

    .widget.widget-snippet .sell-usedit-area .content .right-part p strong {
        font-size: 19px;
    }

    .widget.widget-snippet .sell-usedit-area .content .right-part a {
        font-size: 1em;
        padding: 7px 20px;
        ;
        line-height: 2.2em;
    }
}

@media(max-width: 767px) {
    .widget.widget-snippet .sell-usedit-area .content {
        display: block;
    }

    .widget.widget.widget-snippet .sell-usedit-area .content .right-part {
        padding: 1.5em;
    }

    .widget.widget-snippet .sell-usedit-area .content .right-part h4 {
        font-size: 1.8em;
    }
}

/* ------------------ TECHBUYER REVIEWS ----------------- */
@media(max-width: 1279px) {
    #spltr-CE0A0B26-395F-461E-BF6F-B2CDE7C0EF2B {
        margin-top: 0;
    }
}

@media(max-width: 767px) {
    .widget-snippet .wc-quick-feature {
        padding-left: 15px;
        padding-right: 15px;
        margin-bottom: 30px;
    }

    .widget-snippet .wc-quick-feature .main-wrapper {
        max-width: inherit;
    }

}

/* ------------------ Feature Product ----------------- */

@media(max-width: 1599px) {
    .home-feature-product .product-view.scrollable-view>.content {
        margin-left: 54px;
        margin-right: 54px;
    }

    .home-feature-product .product-view.scrollable-view .header .scroll-left {
        left: 22px;
        z-index: 1;
        background: #ffffff;
    }

    .home-feature-product .product-view.scrollable-view .header .scroll-right {
        right: 22px;
        z-index: 1;
    }
}

@media(max-width: 767px) {

    .home-feature-product .product-view.scrollable-view .header .scroll-left,
    .product-view.scrollable-view .header .scroll-right {
        top: 0;
        margin-top: 0;
    }

    .home-feature-product .product-view.scrollable-view>.content {
        margin-left: 0;
        margin-right: 0;
        padding-top: 67px;
        padding-left: 0;
        padding-right: 0;
    }

    .home-feature-product .product-view.scrollable-view .product-block {
        padding: 15px;
        margin: 9px;
    }
}

.add-to-wishlist-popup.popup .body {
    padding: 30px 0 40px;
}
.add-to-wish-list-popup.add-to-wishlist-popup.popup .body {
    padding: 30px 0 20px;
}
.wish-list-popup.add-to-wishlist-popup.popup .status-message,
.add-to-wish-list-popup.add-to-wishlist-popup.popup .status-bar-product-name,
.add-to-wish-list-popup.add-to-wishlist-popup.popup .status-message {
    font-size: 24px;
    font-weight: 700;
}
.add-to-wish-list-popup.add-to-wishlist-popup.popup .status-bar-product-name ~ .status-message {
    font-size: 18px;
    font-weight: 400;
}
.add-to-wish-list-popup.add-to-wishlist-popup .message-block.error-message {
    border: none;
    background: none;
    font-weight: 600;
}
.wish-list-popup .no-wish-list-message {
    font-size: 18px;
}

.wish-list-popup .form-row label,
.add-to-wishlist-popup label {
    width: auto;
    display: block;
    font-size: 17px;
    color: #0C0C0C;
    font-weight: 600;
    padding-bottom: 5px;
}
.wish-list-popup .form-row input {
    width: 100%;
    background-color: #ffffff;
}
.wish-list-popup select {
    width: 100%;
}
.add-to-wishlist-popup .footer {
    display: flex;
    justify-content: center;
}

.wish-list-popup .footer .create-wish-list,
.wish-list-popup .add-to-wish-list {
    order: 1;
    margin-left: 5px;
}
.wish-list-popup .add-to-wish-list:hover {
    background: none #000000;
}
.add-to-wish-list-popup table {
    margin: 0;
    border: none;
}
.add-to-wish-list-popup table tr {
    border: none;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.add-to-wish-list-popup table td,
.add-to-wish-list-popup table td.product-img {
    padding: 0;
    border: none;
    margin: 0;
}
.add-to-wish-list-popup table td.product-img img {
    max-width: 150px;
    max-height: 110px;
}
.add-to-wish-list-popup table td.short-info {
    text-align: center;
    padding-top: 20px;
}
.add-to-wish-list-popup table .short-info .prodict-name {
    color: #0C0C0C;
    font-weight: 600;
    text-align: center;
}
.add-to-wish-list-popup table .short-info .product-summery {
    padding-top: 10px;
    font-size: 15px;
}
/* confirm popup */
.site-popup .title-bar,
.confirm-popup .header-line, 
.confirm-popup .title-bar {
    background: none;
    background-color: #ffffff;
    border-bottom: 1px #dfdfdf solid;
    color: #333;
    padding: 5px 30px 20px 0;
}
.site-popup .title-bar .title,
.confirm-popup .header-line .title, 
.confirm-popup .title-bar .title {
    font-size: 24px;
    font-weight: 700;
}

.popup.confirm-popup .body {
    padding: 30px 0;
    min-height: 150px;
}
.popup.confirm-popup .button-line {
    padding-left: 0;
    padding-right: 0;
    display: flex;
    justify-content: center;
}
@media (max-width: 767px) {
    .wish-list-popup.add-to-wishlist-popup.popup,
    .add-to-wish-list-popup.add-to-wishlist-popup.popup,
    .confirm-popup.popup {
        padding: 20px;
        width: calc(100vw - 40px)!important;
        min-width: inherit;
    }
    
    .wish-list-popup.add-to-wishlist-popup.popup .status-message, 
    .add-to-wish-list-popup.add-to-wishlist-popup.popup .status-bar-product-name, 
    .add-to-wish-list-popup.add-to-wishlist-popup.popup .status-message {
        font-size: 20px;
    }
    
    .wish-list-popup .no-wish-list-message {
        font-size: 16px;
    }
    
    .add-to-wishlist-popup .footer {
        padding: 20px 0  0;
        display: block;
    }
    
    .wish-list-popup .footer .create-wish-list, 
    .wish-list-popup .add-to-wish-list,
    .wish-list-popup .footer .close-popup {
        margin-left: 0;
        width: 100%;
    }
    
    .wish-list-popup .footer .close-popup {
        margin-top: 10px;
    }
    
    .add-to-wishlist-popup.popup .body {
        padding: 15px 0 15px;
    }
    .add-to-wishlist-popup .footer .continue-shopping-btn,
    .add-to-wishlist-popup .footer .view-wish-list {
        width: 100%;
    }
    .add-to-wishlist-popup .footer .view-wish-list {
        margin-top: 10px;
    }
}


/* Blog page */
.blog-post-details .comment-post-panel .form-row.mandatory > input {
    max-width: 100%;
    width: 100%;
}
.blog-post-details .comment-post-panel .form-row.mandatory > textarea {
    height: 250px;
    max-width: 100%;
    width: 100%;
}
.blog-post-details .comment-post-panel .form-row button {
    cursor: pointer;
    text-transform: uppercase;
    width: 100%;
}
.blog-post-details .comment-post-panel h2 {
    font-size: 30px;
    font-weight: 500;
    padding-bottom: 15px;
    color: #000;
}
.blog-category-details .title ,
.blog-post-details .title {
    color: #272727;
    font-family: 'Open Sans', sans-serif;
    font-size: 30px;
    font-weight: 600;
    line-height: 1.2;
    padding-bottom: 20px;
    margin-bottom: 0;
    text-transform: capitalize;
}
.blog-post-info span.categories a {
    color: #666666;
}
#blog-post-create-comment-panel .max-character {
    padding: 0;
    position: absolute;
    right: 0;
    top: 8px;
}
.blog-post-details .comment-post-panel .form-row {
    position: relative;
}
.blog-post-details .comment-post-panel label {
    font-size: 16px;
    color: #2C2C2C;
    padding-bottom: 5px;
    font-weight: 500;
}
.blog-post-details .comment-post-panel .simpleCaptcha-container label {
    display: none;
}
.blog-post-details .blog-post-info span.categories {
    display: none;
}
.blog-post-details .blog-post-details span.date {
    background: url("../../../blog/images/site/calender.png") no-repeat left top;
    padding-left: 24px;
    margin-right: 10px;
}
.blog-post-details .blog-post-info > span {
    font-size: 16px;
    line-height: 18px;
      background: none;
}
.blog-post-details .image {
    padding: 20px 0;
}

/* ================ Blog-Details-Social-Media-icon-css ======================== */
.blog-post-details .social-media-share a span {
    display: none;
}
.blog-post-details .social-media-share-bar .social-media-share {
    float: left;
    margin-right: 5px;
}
.blog-post-details .social-media-share a.addthis_button_facebook::after {
    color: #ffffff;
    content: "\f39e";
    display: inline-block;
    font-family: "FontAwesome";
    font-size: 22px;
    margin-top: 5px;
}
.blog-post-details .social-media-share a.addthis_button_facebook {
    background-color: #305891;
    border: 2px solid #305891;
}
.blog-post-details .social-media-share-bar .social-media-share a {
    border-radius: 3px;
    float: left;
    height: 40px;
    line-height:27px;
    text-align: center;
    transition: all 300ms ease-out 0s;
    width: 40px;
}
.blog-post-details .social-media-share a span {
    display: none;
}
.blog-post-details .social-media-share a.addthis_button_facebook:hover::after {
    color: #305891;
}
.blog-post-details .social-media-share a.addthis_button_facebook:hover {
    background-color: rgba(48, 88, 145, 0);
}
.blog-post-details .social-media-share a.addthis_button_twitter::after {
    color: #ffffff;
    content:"\f099";
    display: inline-block;
    font-family: "FontAwesome";
    font-size: 22px;
    margin-top: 5px;
}
.blog-post-details .social-media-share a.addthis_button_twitter {
    background-color: #2ca8d2;
    border: 2px solid #2ca8d2;
}
.blog-post-details .social-media-share a.addthis_button_twitter:hover::after {
    color: #2ca8d2;
}
.blog-post-details .social-media-share a.addthis_button_twitter:hover {
    background-color: rgba(44, 168, 210, 0);
}
.blog-post-details .social-media-share a.addthis_button_google::after {
    color: #ffffff;
    content: "\f1a0";
    display: inline-block;
    font-family: "FontAwesome";
    font-size: 22px;
    margin-top: 6px;
}
.blog-post-details .social-media-share a.addthis_button_google {
    background-color: #0868b9;
    border: 2px solid #0868b9;
}
.blog-post-details .social-media-share a.addthis_button_google:hover::after {
    color: #0868b9;
}
.blog-post-details .social-media-share a.addthis_button_google:hover {
    background-color: rgba(8, 104, 185, 0);
}
.blog-post-details .social-media-share a.addthis_button_linkedin::after {
    color: #ffffff;
    content: "\f0e1";
    display: inline-block;
    font-family: "FontAwesome";
    font-size: 22px;
    margin-top: 5px;
}
 
.blog-post-details .social-media-share a.addthis_button_linkedin:hover {
    background-color: rgba(68, 155, 200, 0);
}
.blog-post-details .social-media-share a.addthis_button_email::after {
    color: #ffffff;
    content: "\f0e0";
    display: inline-block;
    font-family: "FontAwesome";
    font-size: 22px;
    margin-top: 3px;
}
 
 
.blog-post-details .social-media-share a.addthis_button_email:hover {
    background-color: rgba(115, 138, 141, 0);
}
.blog-post-details .social-media-share-bar {
    padding-bottom: 20px;
    overflow: hidden;
}
.blog-post-details .blog-post-comment-panel {
    padding: 0;
}
.blog-post-details .post-description > .loging-to-react {
    background: var(--bk-color-primary, #176F92) none repeat scroll 0 0;
    border: medium none;
    color: #ffffff;
    cursor: pointer;
    display: inline-block;
    font-size: 16px;
    font-weight: 400;
    height: auto;
    padding: 10px 25px;
    transition: all 300ms ease 0s;
}
.blog-post-details .post-description > .loging-to-react:hover {
    background: var(--bk-color-secondary, #E8631E) none repeat scroll 0 0;
    color: #ffffff;
}
/* End Blog page */

/*Section Full-wide*/
.page-content > .v-split-container > .v-split.fee-fixed-width-content,
.widget-container > .v-split-container .v-split.fee-fixed-width-content,
.widget-container > .page-content > .v-split.fee-fixed-width-content,
.widget-container > .page-content > .v-split-container > .v-split.fee-fixed-width-content {
    width: auto;
}
.fee-fixed-width-content {
    padding-left: calc(50% - 700px) !important;
    padding-right: calc(50% - 700px) !important;
}

@media screen and (max-width: 980px) {
    body > .body {
        padding: 0;
    }
}

.fee-widget-product-scroll-view .product-view.scrollable-view .current-price.price .tax-message,
.fee-widget-product-image-view .product-view.image-view .current-price.price .tax-message,
.fee-widget-product-list-view .current-price.price .tax-message, .fee-widget-product-tabular-view .current-price.price .tax-message {
    color: #999;
    font-size: 10px;
    font-weight: 400;
    width: 100%;
    display: block;
}
.fee-widget-product-scroll-view .product-view.scrollable-view .product-name{
    padding-left: 15px;
    padding-right: 15px;
}
.fee-widget-product-scroll-view .product-view.scrollable-view .block-content-wrap > .price-waper {
    margin: 7px 15px 0;
}

/*Section Full-wide*/

div.widget-snippet .data-erasure-area{
    max-width: 100% !important;
    width: 100%;
}
div.wi-snippet-footer-social-media {
    padding: 0;
    margin: 0;
}

/* [MCP:product-card-theme-colours] */
/* ---------------------------------------------------------------------------
   The product-card controls were rendering WebCommander's factory blue instead of
   the template's colour. Measured on the listing (rest -> hover):

     Add to cart / wish list / compare / view details
         #008df2 -> #0078ce      both platform blues
     price ($550.00, incl. the currency-symbol and price-amount spans)
         #008df2, no hover

   NOTHING NEW IS INVENTED HERE - these are the template's own values, taken from
   its stylesheet:

     body .button                    background: #176F92    (the theme button fill)
     body .button:hover              background: #000000    (the theme button hover)
     .product-block .add-to-cart-button:hover
                                     background: #176F92; color: #fff
     a:link, a:active, a:visited     color: #E8631E         (the theme link colour)

   #176F92 is the template's dominant colour (93 uses in style.css; #E8631E is
   second at 24). Buttons take the theme fill and the theme's black hover, so the
   pair matches every other button on the site. The price takes #176F92 as well -
   it is a price, not an anchor, so the orange link colour would misread it as a
   link.

   Scoped with #webcommander-page (the body id) to clear ecommerce.min.css, which
   sets the blue at class-only specificity - no !important needed.
   --------------------------------------------------------------------------- */
#webcommander-page .product-block .add-to-cart-button.button,
#webcommander-page .product-block .add-to-wish-list.button,
#webcommander-page .product-block .add-to-compare-button.button,
#webcommander-page .product-block .remove-from-compare-button.button,
#webcommander-page .product-block .quick-view-btn.button,
#webcommander-page .product-block .show-details-button.button {
    background: var(--bk-color-primary, #176F92);
    border-color: var(--bk-color-primary, #176F92);
    color: #ffffff;
}

#webcommander-page .product-block .add-to-cart-button.button:hover,
#webcommander-page .product-block .add-to-wish-list.button:hover,
#webcommander-page .product-block .add-to-compare-button.button:hover,
#webcommander-page .product-block .remove-from-compare-button.button:hover,
#webcommander-page .product-block .quick-view-btn.button:hover,
#webcommander-page .product-block .show-details-button.button:hover {
    background: #000000;
    border-color: #000000;
    color: #ffffff;
}

#webcommander-page .product-block .current-price,
#webcommander-page .product-block .current-price .currency-symbol,
#webcommander-page .product-block .current-price .price-amount {
    color: var(--bk-color-primary, #176F92);
}
/* [/MCP:product-card-theme-colours] */


/* [MCP:tabular-quantity-cell-one-row] */
/* ---------------------------------------------------------------------------
   Tabular view, Quantity cell: one row, right aligned, matched chips.

   The quantity stepper, wishlist and compare were stacked in a column three
   deep, pushing every table row to 162px tall. The cell is a flex COLUMN, and
   it had no room to be anything else:

     column                             width   flex
     image-column                        140    0 0 140px
     name-column                         572    1 1 0%
     price-column                        548    0 0 auto   <- for "$550.00"
     multi-cart-selection-step-column     110    0 1 auto

   The controls need 50 + 50 + 60 plus gaps - about 172px - in a 110px cell, so
   they had nowhere to go but downwards. The price column, sized to content at
   548px for a five-character price, is what left so little for them.

   The cell is given a stated 170px and laid out as a row, aligned to the right
   edge of the table. 170px is fixed rather than fit-content on purpose: this
   class is used by the HEADER row as well, and a content-sized cell makes the
   header and body columns resolve to different widths, which is exactly how a
   table's last column drifts out of alignment with its own heading. Both now
   report the same right edge.

   THE TWO CHIPS ALSO DID NOT MATCH. Wishlist was 50x40 with `padding: 14px 18px`,
   compare 60x40 with `padding: 15px 30px`, and both carry `font-size: 0` with
   their icon on a pseudo-element - so the glyph was being centred inside a
   zero-width content box offset by uneven padding. They are now the same 40x40
   box with the padding removed and the icon centred by flex, which places it
   the same way in both.

   Measured after: all three controls on one line (top 15 in the cell), gaps 6px,
   both chips 39x40, and one right edge shared by header and body.
   --------------------------------------------------------------------------- */

#webcommander-page .product-view.tabular-view .product-table-view-column.multi-cart-selection-step-column {
    flex: 0 0 170px;
    width: 170px;
    min-width: 170px;
    flex-direction: row;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
}

#webcommander-page .product-view.tabular-view .product-table-view-row .add-to-wish-list,
#webcommander-page .product-view.tabular-view .product-table-view-row .add-to-compare-button,
#webcommander-page .product-view.tabular-view .product-table-view-row .remove-from-compare-button {
    box-sizing: border-box;
    width: 40px;
    height: 40px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* [/MCP:tabular-quantity-cell-one-row] */

/* Review-rating stars rendered enormous and stacked vertically: 5 stars, one per line,
   591px tall on desktop and 841px on mobile, inflating the product card to ~1430-1919px.
   The raty star PNG is naturally 16x16, but the theme sizes ALL images inside the product
   widget for product PHOTOS, and those blanket rules catch the stars:
       .product-view.image-view img            max-height: 250px
       .fee-widget-product-image-view ... img  width: 100%; height: 100%
       @media (max-width: 575px) ... img       min-height: 150px; max-height: 150px
   height alone cannot fix this - min-height is a FLOOR that clamps the used height even
   against height with !important, which is why the mobile stars stayed 150px tall until
   min-height was zeroed too. Pin the star box on all six sizing properties.
   Scoped to .review-rating so product photos keep the theme's sizing - verified
   unchanged at 303/200.8/144.8/245/52.5 x 215 across 1512/991/767/575/390.
   After: star 16x16, all five on one row, rating ~97x18 at every width. */
#webcommander-page .review-rating img {
    width: 16px !important;
    height: 16px !important;
    min-width: 0 !important;
    min-height: 0 !important;
    max-width: 16px !important;
    max-height: 16px !important;
    vertical-align: middle !important;
}
#webcommander-page .review-rating,
#webcommander-page .review-rating.read-only {
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

/* [MCP:category-widget-pagination-centre] */
/* The category widget's footer holds only the "Showing 1 to 8 of 8" line, and it sat
   hard left (x=275) while the tile grid it belongs to is centred - measured 573px off
   the grid centre. The footer is display:block with that line as its only child, so
   text-align centres it cleanly: status centre 377 -> 950, matching the grid centre.

   Scoped to .widget-category deliberately. The product and blog widgets put the same
   .pagination-literal-status in a FLEX footer (blog uses space-between) where the left
   position is the intended half of a status-left / pages-right layout, so they are
   left alone. */
#webcommander-page .widget-category .footer {
    text-align: center;
}
/* [/MCP:category-widget-pagination-centre] */

/* Card action buttons were three different sizes. Measured at 1512px:
       ADD TO CART       263x38    font 15px  border 1px  padding 7px 17px
       ADD TO WISH LIST  261x60.6  font 18px  border 2px  padding 14px 18px
       ADD TO COMPARE    261x84.3  font 18px  border 0     padding 15px 30px
       VIEW DETAILS      145x38    font 14px  border 1px  padding 7px 17px
   Three heights, three font sizes, three border widths. ADD TO COMPARE was worst: its
   FontAwesome icon is an inline-block 23x29 box, so it could not share a line with the
   long label and wrapped onto a second row, making that button 84px tall.
   Normalise the three to VIEW DETAILS' metrics and let both icons sit inline.
   VIEW DETAILS itself is deliberately NOT in these selectors - it already looked right.
   Result at 1512px: height spread 46.3px -> 0, card 856px -> 811px.
   Gated to min-width 768px on purpose: below that the cards collapse to ~36px wide (a
   separate pre-existing layout bug - the page already scrolls horizontally at 390px
   with or without this block), and there white-space: nowrap would clip the labels. */
@media screen and (min-width: 768px) {
    #webcommander-page .product-block .add-to-cart-button,
    #webcommander-page .product-block .add-to-wish-list,
    #webcommander-page .product-block .add-to-compare-button {
        height: 38px !important;
        min-height: 0 !important;
        box-sizing: border-box !important;
        padding: 7px 17px !important;
        margin: 0 0 8px !important;
        font-size: 14px !important;
        line-height: 22px !important;
        border: 1px solid rgb(23, 111, 146) !important;
        border-radius: 0 !important;
        text-align: center !important;
        white-space: nowrap !important;
        overflow: hidden !important;
    }
    #webcommander-page .product-block .add-to-wish-list::after,
    #webcommander-page .product-block .add-to-compare-button::after {
        font-size: 15px !important;
        line-height: 22px !important;
        display: inline !important;
        width: auto !important;
        height: auto !important;
        min-height: 0 !important;
        vertical-align: baseline !important;
        margin-left: 6px !important;
    }
}


/* [MCP:card-action-buttons-equal-width] */
/* All four card action buttons should be one width. Measured at 1512px before this:
       ADD TO CART / WISH LIST / COMPARE   263px   (full column width)
       VIEW DETAILS                        145.3px (shrink-to-fit)
   width spread 117.7px. Give VIEW DETAILS the same block/100% sizing as the other
   three; left edges already agreed at x=107 so only the right edge moves.

   The :hover rules exist and still work - all four go to a black fill. But the earlier
   sibling block pinned `border: 1px solid rgb(23,111,146) !important` on the three
   action buttons, and an !important REST declaration outranks the platform's
   `.button:hover` border-color, so those three kept a teal border on hover while
   VIEW DETAILS went black - measured, not assumed. Restating the hover one step
   higher is required whenever an !important rest rule is added.
   Verified after: width spread 0px, and all four hover borders resolve to rgb(0,0,0).

   Still min-width 768px only: below that the cards collapse to ~36px wide and the page
   already scrolls horizontally without any of this, so mobile is deliberately untouched.
   Colours are the theme's own existing values - nothing new is introduced here.

   AMENDED: the hover border was originally set to rgb(0,0,0) because the hover FILL
   measured black at the time. The theme's hover fill is now rgb(232,99,30), so black
   no longer matched. Re-measured on both home and category: all four buttons hover to
   rgb(232,99,30), and .show-details-button - which this block never targets - already
   resolves its border to that same value. Matching it here rather than inventing one. */
@media screen and (min-width: 768px) {
    #webcommander-page .product-block .add-to-cart-button,
    #webcommander-page .product-block .add-to-wish-list,
    #webcommander-page .product-block .add-to-compare-button,
    #webcommander-page .product-block .show-details-button {
        display: block !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    #webcommander-page .product-block .add-to-cart-button:hover,
    #webcommander-page .product-block .add-to-wish-list:hover,
    #webcommander-page .product-block .add-to-compare-button:hover {
        border-color: rgb(232, 99, 30) !important;
    }
}
/* [/MCP:card-action-buttons-equal-width] */

/* [MCP:list-view-action-buttons-match-details] */
/* ---------------------------------------------------------------------------
   In list view, Add to cart / Add to wish list / Add to compare rendered as
   square blocks while VIEW DETAILS below them was a pill, so one stack of four
   buttons carried two different shapes.

   The platform actually agrees with the pill. ecommerce.min.css asks for it on
   the list-view cart button too:

       .product-view.list-view .product-block .btn-add .add-to-cart-button   30px

   What flattens the first three is an UNMARKED rule at the end of this file:

       #webcommander-page .product-block .add-to-cart-button,
       #webcommander-page .product-block .add-to-wish-list,
       #webcommander-page .product-block .add-to-compare-button
           { height: 38px !important; padding: 7px 17px !important;
             border-radius: 0 !important; ... }

   It normalises exactly those three and does not mention .show-details-button,
   which is why VIEW DETAILS kept its 30px radius. This block restores the shape
   for the three, matching VIEW DETAILS on every property that differed:

                     radius   height   padding      border-width
       before  cart   0px      38px    7px 17px     1px
       after   cart   30px     40px    8px 10px     0
       target  view   30px     40px    8px 10px     0     (unchanged)

   Background, colour and font already matched and are not touched.

   `!important` is required: the competing declarations are themselves
   `!important`, so nothing without it can win. Specificity is (1,4,0) against
   their (1,2,0), so this also wins independent of source order. The apply script
   refuses to write if that rule is ever removed, since this would then be
   overriding nothing.

   Scoped to .product-view.list-view. In image view all four buttons already
   share radius 0, so widening this would create the very mismatch it fixes.
   --------------------------------------------------------------------------- */

#webcommander-page .product-view.list-view .product-block .add-to-cart-button,
#webcommander-page .product-view.list-view .product-block .add-to-wish-list,
#webcommander-page .product-view.list-view .product-block .add-to-compare-button {
    border-radius: 30px !important;
    height: 40px !important;
    padding: 8px 10px !important;
    border-width: 0 !important;
}

/* [/MCP:list-view-action-buttons-match-details] */

/* [MCP:tabular-compare-chip-match] */
/* ---------------------------------------------------------------------------
   Tabular Quantity cell: the compare chip wears the same skin as the wishlist.

   The pair disagreed because they resolve from DIFFERENT rules - the
   one-class-short asymmetry in the platform CSS:

     chip       winning rest rule                       spec     source
     wishlist   .button.add-to-wish-list                (0,2,0)  ecommerce.min.css
                  background: #fff  (theme adds the teal border and ink)
     compare    (no equivalent rule exists)
                body .button                            (0,1,1)  style.css
                  background: var(--bk-color-primary, #176F92)

   Platform CSS reaches the wishlist with two classes and the compare button
   with one, so the wishlist gets the dressed chip and the compare button falls
   through to the theme's generic filled button. Measured:

     state    wishlist                          compare
     rest     #ffffff / ink #176F92 / 2px       #176F92 / ink #ffffff / no border
     hover    #000000 / ink #ffffff / 2px       #000000 / ink #ffffff / no border

   Only the REST state differed - both already invert to black on hover - so the
   compare button is given the wishlist's rest values and nothing else changes.
   `.remove-from-compare-button` is included because that is the class the button
   switches to once a product is in the compare list; without it the chip would
   revert to the filled skin the moment it is clicked.

   THE HOVER IS RESTATED DELIBERATELY. This rest rule sits at (1,4,0), which
   outranks the platform hover rules that were doing the inverting -
   `body .button:hover` (0,2,1) and `.add-to-compare-button:hover` (0,2,0) - so
   without a hover rule of its own the chip would simply stop reacting. The
   hover values are copied from what the wishlist already measures, not invented.

   The teal is written as var(--bk-color-primary, #176F92), the token this
   theme's own `body .button` rule uses, so a reseeded kit carries both chips
   together.

   Verified across all 10 rows: identical computed background, ink, border and
   glyph colour at rest and with hover forced, asserting el.matches(':hover')
   rather than assuming the hover engaged.
   --------------------------------------------------------------------------- */

#webcommander-page .product-view.tabular-view .product-table-view-row .add-to-compare-button,
#webcommander-page .product-view.tabular-view .product-table-view-row .remove-from-compare-button {
    background: #ffffff;
    border: 2px solid var(--bk-color-primary, #176F92);
    color: var(--bk-color-primary, #176F92);
}

#webcommander-page .product-view.tabular-view .product-table-view-row .add-to-compare-button:hover,
#webcommander-page .product-view.tabular-view .product-table-view-row .remove-from-compare-button:hover {
    background: #000000;
    border-color: #000000;
    color: #ffffff;
}

/* [/MCP:tabular-compare-chip-match] */

/* [MCP:tabular-view-details-theme-skin] */
/* ---------------------------------------------------------------------------
   Tabular view's "View Details" was the last control still wearing WebCommander's
   factory skin. Measured on the Feature Product table (rest -> hover):

     View Details    transparent / #008DF2 text / #008DF2 border  ->  #008DF2 fill
     Add To Compare  #176F92 fill / white                         ->  #000000   (already themed)
     Add to wish list white / #176F92                             ->  near-black (already themed)

   Winning rule was ecommerce.min.css L438:
       .show-details-button.button, .quick-view-btn.button   (0,2,0)
   which out-specifies the theme's own
       body input[...], body .button { background: var(--bk-color-primary, #176F92);
                                       color: #fff }        (0,1,1)

   The values here are the theme's, restated in the same var(...) form the theme
   uses - not invented, and not hardcoded past the token. Hover takes
   `body .button:hover { background: none #000000 }`.

   THE HOVER RULE IS NOT OPTIONAL. The rest rule below is id-prefixed at (1,2,0);
   without restating hover one step higher it would out-rank the platform's
   .show-details-button.button:hover (0,3,0) and the button would stop reacting.

   Scoped through .tabular-product-view: this view has NO .product-block, which is
   why the earlier [MCP:product-card-theme-colours] block - scoped to
   .product-block - reached list and image view but silently missed this one.
   --------------------------------------------------------------------------- */
#webcommander-page .tabular-product-view .show-details-button.button {
    background: var(--bk-color-primary, #176F92);
    border: 1px solid var(--bk-color-primary, #176F92);
    color: #ffffff;
}

#webcommander-page .tabular-product-view .show-details-button.button:hover,
#webcommander-page .tabular-product-view .show-details-button.button:focus {
    background: #000000;
    border-color: #000000;
    color: #ffffff;
}

/* [/MCP:tabular-view-details-theme-skin] */

/* [MCP:shop-toolbar-centred] */
/* Centre the listing toolbar (view switchers, sort, "Showing x to y").
   Measured at 1660px before: header spans x=145..1515 and is already display:flex,
   but the three visible controls sat at x=155..717 - 394px left of centre.

   justify-content alone does NOT fix this, and it was tried first: it computed to
   `center` and moved nothing. The cause is a FOURTH child that is invisible to a
   width/height filter - SPAN.pagination, 0x0, carrying a computed
   margin-left: 777.906px from ecommerce.min.css's `margin-left: auto`, which is how
   the platform pins a pager to the right-hand end of the row. An auto margin consumes
   ALL free space before justify-content is applied, so the row can never centre while
   it is present.

   This listing has one page, so that span is genuinely empty (0 child nodes, verified
   with :empty and childNodes). Drop it from the flex line only when it IS empty, so a
   real multi-page pager keeps its deliberate right-hand placement and its auto margin.
   Using display:none rather than margin-left:0 also removes its 10px flex gap, which
   otherwise left the group 5px off centre.

   Verified: offset from header centre AND from the product grid centre is 0px at
   1660/1512/991/767 and within 0.5px at 390. Header height unchanged (70px, 102.8 mobile). */
#webcommander-page .product-view > .header {
    justify-content: center !important;
}
#webcommander-page .product-view > .header > .pagination:empty {
    display: none !important;
}
/* [/MCP:shop-toolbar-centred] */

/* [MCP:tabular-header-column-align] */
/* ---------------------------------------------------------------------------
   Tabular view: the header labels did not line up with the body columns.
   Price and Quantity were each 60px out.

   Measured at 1880px viewport, wrapper 1370px wide:

                        header                       body row
       image-column     L=255  W=140                 L=255  W=140    aligned
       name-column      L=395  W=572                 L=395  W=512    <- 60px wider
       price-column     L=967  W=548                 L=907  W=548    <- start 60px out
       last column      L=1515 W=110                 L=1455 W=170    <- 60px narrower

   ROOT CAUSE: THE HEADER AND THE BODY USE DIFFERENT CLASS NAMES FOR THE SAME
   LOGICAL COLUMN.

       header cell   .product-table-view-column.header.multi-cart-step-column
       body cell     .product-table-view-column.multi-cart-selection-step-column

   Note "selection" is present in one and absent in the other. Both start life at
   110px from ecommerce.min.css, but this site already carries a deliberate
   override that widens the BODY cell so the stepper plus the wishlist and
   compare chips fit:

       [style.css] #webcommander-page .product-view.tabular-view
                     .product-table-view-column.multi-cart-selection-step-column
                     { width:170px; min-width:170px; flex:0 0 170px }   (1,4,0)

   That selector cannot match the header cell - class matching is exact token
   matching, and `multi-cart-step-column` is simply a different token from
   `multi-cart-selection-step-column`. So the body's last column became 170px
   while the header's stayed at 110px.

   The 60px then propagates leftwards rather than staying put, because the name
   column is `flex: 1 1 0%` and therefore absorbs whatever the fixed columns
   leave behind: the body's name column shrinks by exactly 60px, which drags the
   start of the body's price column 60px left of the header's. That is why TWO
   columns look wrong when only ONE was ever resized.

   FIX: give the header cell the same width the body cell already has, so the
   pair stays locked together. 170px is taken from the existing body override
   rather than chosen - matching that is the whole point, and 110px is not an
   option because the body genuinely needs the room for its three controls.

   Specificity mirrors the existing body rule exactly, (1,4,0), so the two read
   as a matched pair in the file and neither can drift without the other being
   noticed. `.multi-cart-step-column` cannot accidentally hit the body cell for
   the same exact-token reason described above.

   If the body override is ever retuned, THIS BLOCK MUST BE RETUNED WITH IT -
   they are two halves of one measurement.
   --------------------------------------------------------------------------- */

#webcommander-page .product-view.tabular-view
  .product-table-view-column.multi-cart-step-column {
    width: 170px;
    min-width: 170px;
    flex: 0 0 170px;
}

/* [/MCP:tabular-header-column-align] */

/* [MCP:sort-dropdown-theme-skin] */
/* Sort dropdown wore a browser-ish default while every control beside it is themed.
   Measured before, against the card buttons on the same page:
       select   234x39   border 1px rgb(223,223,223)   radius 3px
       button   263x38   border 1px rgb(23,111,146)    radius 0px
   Pale grey border, a 3px radius nothing else on the page uses, and 1px taller.
   Restate the theme's OWN values - the teal and the square corner are copied from
   .show-details-button, not invented - so the control reads as part of the set.

   background-COLOR only, never the background shorthand: the arrow is a
   background-image on this select, and the shorthand would erase it. Verified the
   arrow is still present after.

   Hover/focus taken to black to match the card buttons, which go to a black fill on
   hover; outline is removed only because the border already carries the focus signal.
   Font size stays 16px on purpose - it matches its row-mates (the switchers and the
   "Showing x to y" text are both 16px), not the 14px of the buttons.
   After: height, border colour and radius all equal the button's. */
#webcommander-page .product-view > .header .sortable select.product-sorting {
    height: 38px !important;
    border: 1px solid rgb(23, 111, 146) !important;
    border-radius: 0 !important;
    background-color: rgb(255, 255, 255) !important;
    color: rgba(0, 0, 0, 0.8) !important;
    transition: border-color 0.3s, box-shadow 0.3s !important;
}
#webcommander-page .product-view > .header .sortable select.product-sorting:hover,
#webcommander-page .product-view > .header .sortable select.product-sorting:focus {
    border-color: rgb(0, 0, 0) !important;
    outline: none !important;
}
/* [/MCP:sort-dropdown-theme-skin] */

/* [MCP:tabular-product-title-type] */
/* ---------------------------------------------------------------------------
   The tabular product title read as body copy. Measured across the three views:

     template standard   16px / 25px / weight 700
                         .product-block a.product-name-link.title-link.link
                         [template style.css L1602]
     list view           16px / 25px / 700     matches
     image view          16px / 25px / 700     matches
     tabular             16px / 22.86px / 400  <- same SIZE, but not bold

   So the title was never smaller in px - it was unbolded, at the same 16px as the
   category line above it and the summary below it, which is why it disappeared
   into the row. The template's own rule cannot reach it: tabular view has no
   .product-block (its chain is .wc-tabular-action-buttons >
   .product-table-view-column > .product-table-view-row > .tabular-product-view),
   the same gap that left View Details on the platform skin.

   Restated here at the template's values, unchanged: 16px / 25px / 700.

   Only the three type properties are set - colour is deliberately left alone so
   the existing link and :hover colour rules keep working (an id-prefixed rule
   restating colour would out-rank them and kill the hover).
   --------------------------------------------------------------------------- */
#webcommander-page .tabular-product-view .product-name-link,
#webcommander-page .tabular-product-view a.title-link {
    font-size: 16px;
    line-height: 25px;
    font-weight: 700;
}

/* [/MCP:tabular-product-title-type] */

/* [MCP:hide-unassigned-sell-to-us-nav] */
/* Footer navigation widgets with no menu assigned render WC's ADMIN placeholder to real
   visitors: a heading followed by the literal text "No menu assigned in this navigation".

   This block previously targeted a single widget id and therefore only cleared ONE
   layout. There are at least two distinct broken instances on this site:
       wi-05240641-...786  widget-id 5661   -> /about-us, /contact-us
       wi-723CFADD-...405  widget-id 1759   -> the category layout
   Chasing ids does not scale, so match the STATE instead: WC marks the placeholder with
   its own class, .wc-nav-empty-placeholder, so any navigation widget containing one is
   by definition unconfigured.

   Rule 1 removes the whole widget (heading included) via :has() - verified supported in
   this browser with CSS.supports('selector(:has(*))').
   Rule 2 is the fallback for engines without :has(): it hides at least the placeholder
   text, though the heading would remain there.

   Verified across /about-us, /contact-us, /category/powerconnect-switches,
   /category/server-memory and /: broken widgets visible 1 -> 0 where present, and every
   correctly-configured nav widget still renders (8 of 8, and 7 of 7 on the others).
   Footer heights unchanged.

   This HIDES; it does not delete. The widgets still exist and still render into the DOM.
   The real fix is to delete them in the editor or assign each a menu - and because this
   rule is state-based, assigning a menu makes the widget reappear on its own, with no
   CSS change needed. */
#webcommander-page .widget-navigation:has(.wc-nav-empty-placeholder) {
    display: none !important;
}
#webcommander-page .wc-nav-empty-placeholder {
    display: none !important;
}
/* [/MCP:hide-unassigned-sell-to-us-nav] */

/* [MCP:product-title-hover-standard] */
/* ---------------------------------------------------------------------------
   Product title hover: the template's teal, in every view.

   Measured on a real hover of a VISIBLE link in each view, asserting
   el.matches(':hover') rather than assuming the hover engaged:

     view      rest                hover before          hover after
     image     rgba(0,0,0,0.8)     rgba(0,0,0,0.8)       #176F92
     list      rgba(0,0,0,0.8)     rgb(0,141,242)        #176F92
     tabular   rgb(34,34,34)       rgb(0,141,242)        #176F92

   rgb(0,141,242) is stock WebCommander link-blue and appears nowhere in this
   template, whose accent is #176F92 - the same teal the price, the buttons and
   the wishlist chip already use.

   The winning rule was, at equal specificity:

     (0,4,1)  .product-view.image-view .product-name a:hover   -> #008DF2
                                                          [ecommerce.min.css]
     (0,4,1)  .product-block a.product-name-link.title-link.link
                                                          [style.css, loads later]

   Same weight, and style.css comes second, so in the GRID the theme's REST
   declaration beats the platform's HOVER declaration and the title does not
   react at all. In list and tabular the theme rule does not reach the element
   the same way, so the platform blue shows through. One rule, three different
   outcomes - which is why the hover is stated here for all views at (1,3,1),
   above both.

   Only the hover is set. The resting colours still differ between views -
   rgba(0,0,0,0.8) in image and list, rgb(34,34,34) in tabular - which is a
   separate inconsistency and was left alone deliberately, since the request was
   about the hover.

   The teal is written as var(--bk-color-primary, #176F92), the token the theme
   uses for the same colour elsewhere. The token is currently undefined on this
   site, so it resolves to the literal the theme already ships, and a seeded kit
   would carry the titles with everything else.
   --------------------------------------------------------------------------- */

#webcommander-page .product-view .product-name a:hover,
#webcommander-page .product-view a.product-name-link:hover,
#webcommander-page .product-block a.product-name-link:hover,
#webcommander-page .tabular-product-view a.product-name-link:hover {
    color: var(--bk-color-primary, #176F92);
}

/* [/MCP:product-title-hover-standard] */

/* [MCP:image-view-rating-align-left] */
/* ---------------------------------------------------------------------------
   The grid (image-view) star rating sat centred while every other line in the card
   was flush left. Measured against the content column's left edge:

     title / summary / category / In stock   offset +20   (the column padding)
     .review-rating-wrapper                  offset +20
     .review-rating  (the stars)             offset +118  <- centred

   IT IS A MARGIN, NOT AN ALIGNMENT PROPERTY. text-align on the stars is already
   `left` and changes nothing; the wrapper is a row flex, so its `align-items:
   center` controls the VERTICAL axis only. What moves them is

       .product-view.image-view .product-block .review-rating.read-only
           { margin: 15px auto 0 }        [ecommerce.min.css L2159]  (0,5,0)

   whose `auto` left margin centres the stars inside the wrapper - computed
   margin-left was 98.19px on every card.

   Only the horizontal margins are reset; the 15px top margin is left as the
   platform sets it, so vertical rhythm is unchanged. Measured after: +118 -> +20
   on all four cards.

   Scoped to .image-view. List and tabular views resolve their rating from
   different rules and are left alone.
   --------------------------------------------------------------------------- */
#webcommander-page .product-view.image-view .product-block .review-rating.read-only {
    margin-left: 0;
    margin-right: auto;
}

/* [/MCP:image-view-rating-align-left] */

/* [MCP:blog-card-link-colours] */
/* ---------------------------------------------------------------------------
   Blog cards: the post-title HOVER and the "Read More" COLOUR were the theme's
   SECONDARY orange. Put both on the template's standard colour.

   THE PALETTE, counted from this template's own active CSS (comment-stripped):

       --bk-color-primary    -> #176F92   100 literal uses + 100 var fallbacks
       --bk-color-secondary  -> #E8631E    24 uses
       widget link hover        #0F89BB    the theme's hover blue

   #176F92 is the standard: button fill (`body .button`), nav hover and active
   colour, the nav underline, shopping-cart link hover. No brand-kit token is
   defined on this site, so every var() resolves to its literal fallback - which
   is why those fallbacks are what actually render.

   MEASURED BEFORE, per anchor in a card (there are four, and only two were
   raised - identifying them individually mattered, since the first anchor in the
   card is the image link, not the title):

       [0] image link      #E8631E  ->  #E8631E   (no change)
       [1] TITLE           #000000  ->  #E8631E   <- hover is the secondary
       [2] "TECHPEDIA"     #666666  ->  #E8631E
       [3] "Read More"     #E8631E  ->  #E8631E   <- rest is the secondary, hover dead

   WHY EACH ONE.

   The title's hover is set by the blog-specific rule, which OUT-SPECIFIES the
   theme's own intent for exactly this element:

       [style.css]      .blog-post-item .title a:hover
                          { color: var(--bk-color-secondary, #E8631E) }   (0,3,1)
       [style.css]      .widget h4 a:hover  { color: #0F89BB }            (0,2,2)  loses
       [plugins.min.css].blog-post-item .title a:hover { color: #666 }    (0,3,1)  loses on order

   The title markup is `a` inside `h4.title`, so the theme's `.widget h4 a:hover`
   was written to cover it and is simply outranked.

   "Read More" has NO hover rule anywhere - it falls through to
   `a:link { color: var(--bk-color-secondary, #E8631E) }` (0,1,1) for its rest
   colour and nothing changes it on hover. Verified as a genuine dead hover with
   `el.matches(':hover')` true and the computed colour identical.

   FIX
     title      hover  -> --bk-color-primary   (was the secondary orange)
                rest   -> UNCHANGED at #000000; the black heading is deliberate
                          and was not what was raised.
     Read More  rest   -> --bk-color-primary   (was the secondary orange)
                hover  -> #0F89BB, the theme's own widget-link hover, so the
                          control finally has feedback instead of resting and
                          hovering on the same colour.

   Every value comes from the theme; nothing is invented. If you would rather the
   two hovers matched exactly, change the Read More hover to
   var(--bk-color-primary, #176F92) - it then rests and hovers identically, which
   is why it is not the default here.

   Specificity: the title hover must beat (0,3,1), so it is written at (0,4,1);
   Read More's rest beats `a:link` (0,1,1) at (0,3,1). No id and no !important.

   NOT CHANGED, and worth a decision: anchor [2], the category eyebrow
   ("TECHPEDIA"), also hovers to the same secondary orange. It was not pointed
   at, so it is left alone rather than swept in silently.
   --------------------------------------------------------------------------- */

/* post title — hover only; the black rest colour is left as designed */
.widget-blogPost .blog-post-item .title a:hover {
    color: var(--bk-color-primary, #176F92);
}

/* "Read More" — standard colour at rest, theme hover blue on hover */
.widget-blogPost .blog-post-item a.blog-read-more {
    color: var(--bk-color-primary, #176F92);
}

.widget-blogPost .blog-post-item a.blog-read-more:hover {
    color: #0F89BB;
}

/* [/MCP:blog-card-link-colours] */

/* [MCP:grid-card-vertical-rhythm] */
/* ---------------------------------------------------------------------------
   Grid cards carried three gaps well outside their own spacing rhythm. Measured
   from TEXT INK (not box edges — padding moves text inside a box without moving
   the box, which is what made the first attempt at this look like a no-op):

       image -> title text     76px      <- marked
       title -> description    27px      the card's own rhythm
       description -> rating   29px
       price text -> button    41px      <- marked

   Each oversized gap is a stack of separate declarations:

       image box   margin-bottom 20  +  wrap padding-top 20  +  name padding-top 20
       rating      margin-top    15  on top of the description's margin-bottom 10
       actions     margin-top    15  +  .btn-add margin-top 10  +  price padding-bottom 15

   What is REMOVED here is space that genuinely exists between blocks:

       .image / .product-image   margin-bottom  20px -> 0
       .review-rating            margin-top     15px -> 0
       .price-waper              padding-bottom 15px -> 10px
       .wc-product-actions-group margin-top     15px -> 10px

   Deliberately NOT touched: .product-name's 20px padding-top. Removing it moves
   the title text up inside a fixed-height box, so the 20px simply reappears
   BELOW the title — measured title->description going 27px -> 47px while the card
   height did not change. Space that only relocates is not a fix.

   Result, same card:

       image -> title text     76 -> 56
       title -> description    27 -> 27   (unchanged — no gap was shuffled)
       description -> rating   29 -> 14
       price text -> button    41 -> 31
       card height            811 -> 766

   Scoped to image-view: list and tabular views lay these blocks out differently
   and were not part of the report.
   --------------------------------------------------------------------------- */

#webcommander-page .product-view.image-view .product-block .image,
#webcommander-page .product-view.image-view .product-block .product-image {
    margin-bottom: 0;
}

#webcommander-page .product-view.image-view .product-block .review-rating {
    margin-top: 0;
}

#webcommander-page .product-view.image-view .product-block .price-waper {
    padding-bottom: 10px;
}

#webcommander-page .product-view.image-view .product-block .wc-product-actions-group {
    margin-top: 10px;
}

/* [/MCP:grid-card-vertical-rhythm] */

/* [MCP:image-view-title-padding] */
/* ---------------------------------------------------------------------------
   Grid (image-view) card title was indented 20px further than everything else in
   the card. Measured from the content wrap:

     .block-content-wrap        padding: 20px   -> every child box starts at +20
     .product-name              padding: 20px extra  -> its TEXT starts at +40
     .summary / .parent-name / rating / .in-stock / actions
                                padding: 0      -> their text starts at +20

   So the title alone was out of the column. The extra padding comes from

       .product-view.image-view .product-name { padding-left:20px; padding-right:20px }
       [ecommerce.min.css L2040]  (0,2,0)

   Zeroed here at (1,2,0). Only the horizontal padding is touched - the 50px height
   and overflow:hidden that give the title its two-line box are left as the theme
   sets them (measured unchanged at 50px after).

   Scoped to .image-view per the request. The same platform rule also names
   .scrollable-view, which is deliberately left alone.
   --------------------------------------------------------------------------- */
#webcommander-page .product-view.image-view .product-name {
    padding-left: 0;
    padding-right: 0;
}

/* [/MCP:image-view-title-padding] */

/* [MCP:blog-paginator-centre-single-page] */
/* The blog widget's paginator row is a flex row with TWO children:
   .pagination-literal-status ("Showing 1 to 3 of 3 (1 Page)") and .pagination
   (the page links). plugins.min.css lays it out at (0,3,0) as
     .widget-blogPost .blog-post-content > .blog-post-paginator-row
       -> display:flex; justify-content:space-between; column-gap:10px
   which is correct when both children have content: status left, links right.
   With a single page WC still emits .pagination but leaves it EMPTY, so
   space-between pins the status hard left - measured 597.6px left of the row
   centre at 1512 wide (347.6 at 900, 85.1 at 375).

   Centred ONLY in that single-page case, via :has(> .pagination:empty). The
   sibling category widget was centred unconditionally in
   [MCP:category-widget-pagination-centre], whose comment notes it deliberately
   left this blog row alone because space-between is the intended half of a
   status-left / pages-right layout. That reasoning still holds when page links
   exist, so the guard keeps it: verified by appending two real <a> links at
   runtime - the row reverts to space-between, status back to x=56 and the links
   visible at x=1433.5.

   The empty .pagination is hidden rather than left in place because it stays a
   flex item otherwise, so the row's 10px column-gap still applies and widens the
   centred group - that alone left the status 5px off centre. Same mechanism the
   shop toolbar already uses in [MCP:shop-toolbar-centred]. No !important needed:
   the id prefix takes these to (1,4,0) against the platform's (0,3,0), confirmed
   by dry-run. Measured offset after: -0.01px at 1512, 900 and 375; row height
   unchanged at 22.8px. No hover or colour involved, so no rest/hover pair to
   restate. */
#webcommander-page .widget-blogPost .blog-post-content > .blog-post-paginator-row:has(> .pagination:empty) {
    justify-content: center;
}

#webcommander-page .widget-blogPost .blog-post-content > .blog-post-paginator-row > .pagination:empty {
    display: none;
}
/* [/MCP:blog-paginator-centre-single-page] */

/* [MCP:image-view-price-margin] */
/* ---------------------------------------------------------------------------
   Grid (image-view) price block sat 20px outside the card column. Measured from
   .block-content-wrap, whose own 20px padding already puts every child at +20:

     .summary / .parent-name / rating / .in-stock / .product-name   box at +20
     .price-waper                                                   box at +40

   The extra 20px is a MARGIN, not padding:

       .product-view.image-view .block-content-wrap > .price-waper
           { margin: 7px 20px 0 }      [ecommerce.min.css L2067]  (0,4,0)
       (the same declaration repeats for .fee-widget-product-scroll-view at (0,5,0),
        which this still outranks via the id)

   Only the horizontal margins are zeroed. The 7px top margin and the
   padding of 0 0 15px, which set this block's vertical rhythm, are left as the
   platform has them. Measured after: box +40 -> +20, width 253 -> 293.

   NOTE the price TEXT still sits at +24 rather than +20: the remaining 4px comes
   from inside .price-block-container, not from this margin, and is left alone.

   Scoped to .image-view, matching the title-padding fix in the same card.
   --------------------------------------------------------------------------- */
#webcommander-page .product-view.image-view .block-content-wrap > .price-waper {
    margin-left: 0;
    margin-right: 0;
}

/* [/MCP:image-view-price-margin] */

/* [MCP:footer-we-accept-single-row] */
/* ---------------------------------------------------------------------------
   The footer's "We Accept:" widget stacked its title above the card logos. Both
   children are plain blocks, so they took a line each:

       .widget-title-wrapper   254x23  at (0, 0)
       .image-widget-wrapper   254x44  at (0, 23)     <- second line

   A flex row puts them side by side and centres them against each other. The
   title stops filling the line (254px -> 112px, its own text width) so the logos
   sit directly after it.

   NOWRAP, not wrap. The first version of this block wrapped, which looked fine
   at the widths I tested (the widget measures 378px and the row fits from 1200
   to 1850). But the widget carries its own responsive rule

       @media (min-width: 1430px) and (max-width: 1599px)
           .responsive #wi-0E1CA810-… { width: 272px; right: 15px; bottom: 12px }

   and 272px cannot hold a 378px row, so wrap did as it was told and stacked it
   again. Reproduced by forcing that width:

       272px + wrap     widget 272x79   two lines
       272px + nowrap   widget 272x26   one line, logos scaled 254px -> 148px

   So the row is unconditional and the logos SHRINK instead of dropping to a
   second line. That needs both companions: min-width: 0 lets the image wrapper
   shrink below its content size (a flex item will not otherwise), and
   max-width: 100% + height: auto scale the bitmap in proportion.

   SPACING. The theme also puts `margin-right: 12px` on .widget-title, which
   stacked on top of this container's `gap: 12px` and left 24px between the label
   and the marks. The margin is zeroed so the gap is the single source of that
   spacing:

       title -> logos   24px -> 12px      widget 378px -> 366px

   Layout only — no colour, size or font, and the image file is untouched.
   --------------------------------------------------------------------------- */

#webcommander-page .widget-image.footer-we-accept {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    flex-wrap: nowrap;
}

#webcommander-page .widget-image.footer-we-accept .widget-title-wrapper {
    margin-bottom: 0;
    flex: 0 0 auto;
}

#webcommander-page .widget-image.footer-we-accept .widget-title {
    margin-right: 0;
}

#webcommander-page .widget-image.footer-we-accept .image-widget-wrapper {
    flex: 0 1 auto;
    min-width: 0;
    text-align: left;
}

#webcommander-page .widget-image.footer-we-accept .image-widget-wrapper img {
    max-width: 100%;
    height: auto;
}

/* [/MCP:footer-we-accept-single-row] */

/* [MCP:hover-accent-orange] */
/* ---------------------------------------------------------------------------
   Hover accent: the template's orange, on product titles and card controls.

   The reference is the site's own DISCOVER MORE call to action, which sits at
   #176F92 (or transparent) and turns rgb(232,99,30) = #E8631E on hover. Nothing
   on the product listings was using it - measured on a real hover of a visible
   element in each view, asserting el.matches(':hover'):

     control        before                     after
     title          #008DF2 blue / no change   #E8631E
     add to cart    #000000                    #E8631E
     wish list      #000000                    #E8631E
     compare        #000000                    #E8631E
     view details   #000000                    #E8631E
     add selected   #000000                    #E8631E

   THE BLACK CAME FROM THREE EXISTING MARKER BLOCKS, not from the platform:

     product-card-theme-colours       #webcommander-page .product-block
                                        .add-to-cart-button.button:hover   (1,4,0)
     tabular-compare-chip-match       tabular compare chip hover           (1,4,0)
     tabular-view-details-theme-skin  tabular View Details hover           (1,4,0)

   Those blocks are left untouched and this one is written ABOVE them at (1,5,0)
   and (1,6,0) instead of editing three separate blocks. That is deliberate:
   style.css on this instance is being written by more than one session - the
   marker count went from 6 to 18 during this work - so rewriting another
   session's block risks clobbering an edit that landed in between. An
   out-specifying block is safe under that concurrency; a rewrite is not.

   Tabular needs its own arms because that view has NO `.product-block` - its
   controls sit under `.product-table-view-row` and `.tabular-product-view` - so
   a `.product-block`-scoped selector silently misses every tabular control.

   CONTRAST, recorded deliberately: white on #E8631E measures 3.37:1, under the
   4.5:1 AA minimum for normal text. The template already ships that pairing on
   DISCOVER MORE, so this matches the design rather than introducing a new
   problem, but it is a hover state on a filled button and worth knowing. Black
   ink on the same orange measures 6.23:1 if it ever needs to pass.
   --------------------------------------------------------------------------- */

#webcommander-page .product-view .product-name a:hover,
#webcommander-page .product-view a.product-name-link:hover,
#webcommander-page .product-block a.product-name-link:hover,
#webcommander-page .tabular-product-view a.product-name-link:hover {
    color: #E8631E;
}

#webcommander-page .product-view .product-block .add-to-cart-button.button:hover,
#webcommander-page .product-view .product-block .add-to-wish-list.button:hover,
#webcommander-page .product-view .product-block .add-to-compare-button.button:hover,
#webcommander-page .product-view .product-block .remove-from-compare-button.button:hover,
#webcommander-page .product-view .product-block .quick-view-btn.button:hover,
#webcommander-page .product-view .product-block .show-details-button.button:hover,
#webcommander-page .product-view.tabular-view .product-table-view-row .add-to-cart-button.button:hover,
#webcommander-page .product-view.tabular-view .product-table-view-row .add-to-wish-list.button:hover,
#webcommander-page .product-view.tabular-view .product-table-view-row .add-to-compare-button.button:hover,
#webcommander-page .product-view.tabular-view .product-table-view-row .remove-from-compare-button.button:hover,
#webcommander-page .product-view.tabular-view .product-table-view-row .quick-view-btn.button:hover,
#webcommander-page .product-view.tabular-view .product-table-view-row .show-details-button.button:hover,
#webcommander-page .product-view.tabular-view .tabular-product-view .add-to-cart-button.button:hover,
#webcommander-page .product-view.tabular-view .tabular-product-view .add-to-wish-list.button:hover,
#webcommander-page .product-view.tabular-view .tabular-product-view .add-to-compare-button.button:hover,
#webcommander-page .product-view.tabular-view .tabular-product-view .remove-from-compare-button.button:hover,
#webcommander-page .product-view.tabular-view .tabular-product-view .quick-view-btn.button:hover,
#webcommander-page .product-view.tabular-view .tabular-product-view .show-details-button.button:hover,
#webcommander-page .add-to-cart-multi-select-fixed-button:hover {
    background: #E8631E;
    border-color: #E8631E;
    color: #ffffff;
}

/* [/MCP:hover-accent-orange] */

/* [MCP:grid-product-name-spacing] */
/* ---------------------------------------------------------------------------
   Grid (image) view product name: drop the 20px top padding and the 20px bottom
   margin.

   Measured before on .product-name (293x50):

       padding : 20px 0px 0px      <- padding-top 20px
       margin  : 0px 0px 20px      <- margin-bottom 20px
       height  : 50px
       box-sizing: border-box
       overflow: hidden
       gap to the next element (.summary): 20px

   The two values come from DIFFERENT stylesheets, both at (0,3,0) on the same
   selector, which is why neither shows up as "the" rule:

       [ecommerce.min.css] .product-view.image-view .product-name
                             { padding-top: 20px; height: 45px; overflow: hidden }
       [style.css]         .product-view.image-view .product-name
                             { margin: 0 0 20px; height: 50px; overflow: hidden }

   (ecommerce.min.css also carries an earlier, fully superseded copy with
   margin-top:7px / margin-bottom:10px / height:24px, and responsive.css restates
   height:43px with margin:0 inside a media query. Only the two above are
   winning at desktop width.)

   WORTH KNOWING: because `box-sizing: border-box` is set globally by both
   plugins.min.css and style.css, that 20px top padding is subtracted from the
   fixed 50px height rather than added to it - so the title only ever had 30px of
   usable space, and `overflow: hidden` silently clipped the second line of any
   two-line product name. Removing the padding gives the name the full 50px, so
   longer titles that were being cut off now fit.

   Height is deliberately NOT touched. The request was padding-top and
   margin-bottom; changing the 50px as well would alter card height across the
   whole grid, and the responsive rules restate it per breakpoint.

   Specificity: the competing rules are both (0,3,0), so a same-shape selector
   would depend on source order to win. Qualifying with the element name gives
   (0,3,1) and wins outright - no id and no !important needed, and it also beats
   responsive.css's (0,3,0) restatement at narrow widths, where margin-bottom is
   already 0 and this simply agrees with it.

   Scoped to image view, which is where the request came from. The theme applies
   the same margin to `.product-view.scrollable-view .product-name` as well; that
   view is left alone rather than swept in silently.
   --------------------------------------------------------------------------- */

.product-view.image-view div.product-name {
    padding-top: 0;
    margin-bottom: 0;
}

/* [/MCP:grid-product-name-spacing] */

/* [MCP:list-view-product-name-no-bottom-padding] */
/* List view product name link carried 22px of bottom padding, making its box 47px tall
   for a 25px line. Three rules in the platform sheet set padding on
   .product-view.list-view .product-name-link in sequence - 0 0 18px 0, then 5px, then
   0 0 22px 0 - and the last one wins. The grid/image view already computes 0.

   Beaten on SPECIFICITY, not !important: the platform rule is (0,3,0), this is (1,3,0)
   via the page id, so no !important is needed and any later :hover keeps working.
   Scoped to .list-view so the grid and tabular views are untouched.

   Measured: link height 47 -> 25, padding-bottom 22px -> 0, card 546.4 -> 524.4.
   Grid view unchanged at 25px / 0px / 766.4. Gap to the summary text stays 10px. */
#webcommander-page .product-view.list-view .product-name-link {
    padding-bottom: 0;
}
/* [/MCP:list-view-product-name-no-bottom-padding] */

/* [MCP:mcp-list-view-image-letterbox] */
/* Product LIST view - remove the dead vertical space above and below the product photo.
   MEASURED on / (home, product widget 8959), viewport 1490px, list view:
     .image.product-image img  box = 284.8 x 524.4  - stretched to the card's full height
     photo actually painted by object-fit:contain = 284.8 x 185
     => 169.7px of empty letterbox ABOVE and BELOW the photo, on all 10 cards
        (image boxes measured 504-691px tall across the listing).
   WINNING RULE was ecommerce.min.css at specificity (0,7,1):
     .fee-widget-product-list-view .product-view.list-view .content .product-block
       .image.product-image img { height:100%; width:100%; object-fit:contain }
   That sheet ALSO sets max-height:100% at (0,6,1), which out-specifies the widget's
   own configured cap .list-view .product-view-height-width img { max-height:250px }
   at (0,2,1) - so the platform sheet was defeating the site's own 250px image setting.
   FIX: let the img box hug the photo (height:auto) and restore that 250px cap.
   The photo's RENDERED size does not change - object-fit:contain was already painting
   it at 284.8 x 185 because width:100% constrains it - so nothing is scaled or cropped;
   only the empty letterbox is removed. Verified identical rendered size at 1490/1200/992/768/480px.
   REJECTED alternative: object-fit:cover fills the height with no gap but crops the
   product past recognition on a listing - measured, screenshotted, discarded.
   .image is repeated in the selector to reach (0,8,1) so this wins on specificity alone
   and does not depend on style.css (sheet 20) loading after ecommerce.min.css (sheet 15).
   SCOPED to .list-view on purpose: image/grid view measured byte-identical before/after
   (img 215px tall in all 10 cards) and tabular view has no .product-block at all.
   LEFT ALONE: the card is ~546px tall because .wc-product-actions-group stacks 4
   full-width buttons (224px), so whitespace now sits BELOW the photo instead of
   being split above and below it. Reducing the card height was not requested. */
.fee-widget-product-list-view .product-view.list-view .content .product-block .image.image.product-image img {
    height: auto;
    max-height: 250px;
}
/* [/MCP:mcp-list-view-image-letterbox] */

/* [MCP:tabular-name-column-rhythm] */
/* Tabular view, Name column: the six stacked blocks - category eyebrow
   .parent-name, .product-name-link, .summary, .review-rating-wrapper, .in-stock
   and the .wc-tabular-action-buttons row - carried NO vertical separation at all.
   Measured gap between every consecutive pair: 0px, with only the button row
   holding margin-top:10px. The blocks were kept apart purely by line-height, so
   the eyebrow, title, description, stars and stock line read as one dense mass.

   Applied one standard step of 8px between siblings, and 14px before the action
   button row so the control separates from the text it belongs to. Measured
   after: 8/8/8/8 then 14 on every row, at 1512 and 900.

   The :last-child / :first-child margin reset on .summary is load-bearing, not
   tidiness. Descriptions are merchant-authored: plain-text ones have no child
   elements, but rich-text ones ship a <p> whose margin-bottom of 20px collapses
   out through .summary - it has no padding, border or overflow to contain it.
   That produced a 20px gap on those rows against 0px elsewhere, and because
   adjacent sibling margins COLLAPSE to the larger value, an 8px margin-top on
   the next block could not override it - the row stayed at 20px while its
   neighbours moved to 8px. Zeroing only the summary's first/last child keeps
   spacing BETWEEN paragraphs of a multi-paragraph description intact.

   Scoped under .tabular-product-view because the image and list views build a
   different DOM - .product-block, no .product-table-view-column - so they cannot
   match; verified unchanged at 335x746.4 and 680x524.4 respectively. Only the
   home page currently exposes a tabular switcher, so this is one widget today,
   but the rule is generic so any future tabular listing inherits the rhythm. */
#webcommander-page .tabular-product-view .product-table-view-column.name-column > * + * {
    margin-top: 8px;
}

#webcommander-page .tabular-product-view .product-table-view-column.name-column > .wc-tabular-action-buttons {
    margin-top: 14px;
}

#webcommander-page .tabular-product-view .product-table-view-column.name-column > .summary > *:first-child {
    margin-top: 0;
}

#webcommander-page .tabular-product-view .product-table-view-column.name-column > .summary > *:last-child {
    margin-bottom: 0;
}
/* [/MCP:tabular-name-column-rhythm] */

/* [MCP:category-header-no-negative-pull] */
/* ---------------------------------------------------------------------------
   On category pages the view-switcher / sort row was painted ON TOP of the page
   heading. Measured on /category/powerconnect-switches at 1530px:

     h2.title.page-heading   y=276  h=54  bottom=330
     .header (control row)   y=259            <- starts 17px ABOVE the heading
     gap heading -> header   -71px            <- i.e. a 71px overlap

   Cause is a single declaration:

       .category-details .product-view .header { padding: 0; margin-top: -91px }
       [template style.css L1881]  (0,3,0)

   The negative pull is meant to lift the controls beside the heading, but the
   heading is full-width here (1190px, the same width and left edge as the control
   row), so there is no space beside it and the two simply collide.

   THE TEMPLATE'S OWN STANDARD for this row is margin-top: 0 - that is exactly how
   the same .header renders in the homepage product widget, where nothing overlaps
   (measured: margin 0px 0px 5px, no overlapping element). This restores it.

   Only margin-top is reset; the padding:0 from the same rule is left alone.
   Measured after: overlap gone, heading -> header gap +20px, control row y=350.
   --------------------------------------------------------------------------- */
#webcommander-page .category-details .product-view .header {
    margin-top: 0;
}

/* [/MCP:category-header-no-negative-pull] */

/* [MCP:category-card-match-home-design] */
/* Category grid cards did not match the home page's card design, and my own earlier
   block was clipping their labels. Measured at 1500px before:
       HOME      card 335 -> content-wrap 333 -> buttons 263x38, nothing clipped
       CATEGORY  card 260 -> content-wrap 200 -> buttons 130x38, labels needing
                 151/200/199px but only 128px of client width - ALL THREE CLIPPED

   Two separate causes:
   (a) The theme zeroes card padding only under .fee-widget-product-image-view. An
       auto-generated category listing has no such wrapper, so it keeps padding:30px
       per side and loses 60px of card width. Same shape of bug as the category
       toolbar: a rule scoped to the fee-widget never reaches auto-pages.
   (b) My card-action-button block set height:38px + white-space:nowrap +
       overflow:hidden, which is safe on a 335px card and destructive on a 260px one:
       it hid the overflow instead of letting it wrap. Replaced with min-height so a
       button can grow if it ever must, and overflow visible so nothing is ever hidden.

   NOTE the selector: on this site #webcommander-page IS the body element, so
   `body.page-category #webcommander-page` matches NOTHING. It has to be
   #webcommander-page.page-category - same element, no descendant combinator.

   After: category buttons 190x38, zero clipped, height spread 0, width spread 0 -
   identical geometry rules to home, which is unchanged at 263x38 / spread 0. */
#webcommander-page.page-category .product-view.image-view .product-block {
    padding-left: 0 !important;
    padding-right: 0 !important;
}
@media screen and (min-width: 768px) {
    #webcommander-page .product-block .add-to-cart-button,
    #webcommander-page .product-block .add-to-wish-list,
    #webcommander-page .product-block .add-to-compare-button {
        height: auto !important;
        min-height: 38px !important;
        white-space: normal !important;
        overflow: visible !important;
    }
}
#webcommander-page.page-category .product-view.image-view .product-block .add-to-cart-button,
#webcommander-page.page-category .product-view.image-view .product-block .add-to-wish-list,
#webcommander-page.page-category .product-view.image-view .product-block .add-to-compare-button,
#webcommander-page.page-category .product-view.image-view .product-block .show-details-button {
    padding-left: 8px !important;
    padding-right: 8px !important;
}
/* [/MCP:category-card-match-home-design] */

/* [MCP:list-view-card-rhythm-match-grid] */
/* List-view cards used a different vertical rhythm from the grid cards, though the DOM
   is identical (.product-name, .summary, .parent-name, .review-rating-wrapper,
   .in-stock, .price-waper, .wc-product-actions-group). Measured gaps at 1500px:
       grid  name>summary 0   summary>cat 10  cat>rating 0  rating>stock 0  stock>price 7   price>actions 10
       list  name>summary 10  summary>cat 10  cat>rating 0  rating>stock 7  stock>price 5   price>actions 15
   Normalise list to the grid's values - grid is the default view, so it is the
   reference rather than a new invented scale. After: every gap equal, list card
   524.4 -> 514.4, grid untouched at 746.4.
   .product-name's own wrapper padding is deliberately NOT touched: in the grid it is
   breathing room under the image, in list view it is the top of the text column -
   different jobs, so matching them would not be an improvement. */
#webcommander-page .product-view.list-view .product-block .summary {
    margin-top: 0;
}
#webcommander-page .product-view.list-view .product-block .in-stock {
    margin-top: 0;
}
#webcommander-page .product-view.list-view .product-block .price-waper {
    margin-top: 7px;
    margin-bottom: 0;
    padding-bottom: 10px;
}
#webcommander-page .product-view.list-view .product-block .wc-product-actions-group {
    margin-top: 10px;
}
/* [/MCP:list-view-card-rhythm-match-grid] */

/* [MCP:card-action-icons-lead-label] */
/* ---------------------------------------------------------------------------
   The wishlist and compare icons trailed their labels. Both are ::after glyphs:

       .add-to-compare-button:after, .add-to-wish-list:after,
       .remove-from-compare-button:after { content: "\f079"; display:inline-block }
       .add-to-wish-list:after           { content: "\f08a" }
       [ecommerce.min.css L461 / L468]
       + margin-left: 8px  [template style.css L5054]
       + display:inline !important; margin-left:6px !important  [template style.css L7243]

   The buttons are display:block, not flex, so flex-direction:row-reverse is not
   available - the glyph has to move to ::before. The ::after content is switched
   off and the same FontAwesome codepoints are re-emitted on ::before with a
   trailing margin instead of a leading one.

   The codepoints are copied exactly: \f08a heart for wishlist, \f079 exchange for
   compare AND for .remove-from-compare-button (the toggled state, which shares the
   compare rule - leaving it out would make the icon jump back behind the label the
   moment the button is clicked).

   font-family must be restated on ::before: the platform sets FontAwesome on the
   ::after rule only, so without it the glyph renders as a missing-character box.
   --------------------------------------------------------------------------- */
#webcommander-page .product-block .add-to-wish-list::after,
#webcommander-page .product-block .add-to-compare-button::after,
#webcommander-page .product-block .remove-from-compare-button::after {
    content: none;
}

#webcommander-page .product-block .add-to-wish-list::before {
    content: "\f08a";
    font-family: FontAwesome;
    display: inline;
    margin-right: 6px;
}

#webcommander-page .product-block .add-to-compare-button::before,
#webcommander-page .product-block .remove-from-compare-button::before {
    content: "\f079";
    font-family: FontAwesome;
    display: inline;
    margin-right: 6px;
}

/* [/MCP:card-action-icons-lead-label] */

/* [MCP:category-summary-no-sliced-line] */
/* ---------------------------------------------------------------------------
   Product descriptions in the category listing were cut through the middle of a
   line of text, so the last row read as half-height letters.

   ecommerce.min.css caps the cell:

       .category .summary { height: 60px; overflow: hidden }

   60px is exactly three 20px lines, so the cap itself is fine. What breaks it is
   the FIRST line: descriptions that open with a bold "Please Note:" run produce a
   69px line box, so the three lines measure 69 + 22 + 22 and the crop lands
   inside line three. Measured, before:

       line boxes   69px, 22px, 22px      content 69px in a 60px box
       lines sliced by the crop edge: 2

   Normalising the line box to 20px throughout the cell makes every line the same
   height, so the crop can only ever fall BETWEEN lines:

       after        content 61px, lines sliced: 0, full sentence visible

   WHY NOT A LINE CLAMP. The obvious fix is -webkit-line-clamp, and it cannot
   work here: .summary and its <p> are flex items, and a flex item is blockified,
   so `display: -webkit-box` computes to `flow-root` and the clamp never engages.
   Verified by setting it inline — display still resolved to flow-root and the
   line was still sliced. The descendant selector is needed for the same reason
   the bug exists: the oversized line box comes from an inner element, not from
   .summary itself.

   Rows whose text genuinely overruns three lines still truncate — that is the
   platform's 60px cap doing its job — but they now truncate at a line boundary
   instead of through the glyphs.

   Scoped to .category, mirroring the rule that sets the cap, so summaries on
   other page types keep their own line spacing.
   --------------------------------------------------------------------------- */

#webcommander-page.category .summary,
#webcommander-page.category .summary * {
    line-height: 20px;
}

/* [/MCP:category-summary-no-sliced-line] */

/* [MCP:tabular-summary-align-left] */
/* Product description was centred in the category page's TABULAR view only, while the
   name, category and stock lines beside it were all left aligned - so the description
   was the only centred text in the column.
   Winning rule was ecommerce.min.css `.category .summary` (0,2,0), which carries
   text-align: center along with color/font-size/height/overflow. It only bites in the
   tabular view; the grid and list views on the same page already computed left.
   Measured before -> after:
       category tabular  center -> left   (and its inner <p>, which inherits)
       category grid     left   -> left
       category list     left   -> left
       home all 3 views  left   -> left
   Beaten on specificity at (1,3,0), no !important, so nothing here can block a later
   hover or state rule. The <p> is named explicitly because the platform rule sets the
   alignment on it too, not only on the wrapper.
   Scoped to .category so the home page's tabular view - already correct - is untouched. */
#webcommander-page.category .product-view.tabular-view .summary,
#webcommander-page.category .product-view.tabular-view .summary p {
    text-align: left;
}
/* [/MCP:tabular-summary-align-left] */

/* [MCP:tabular-category-header-align] */
/* ---------------------------------------------------------------------------
   Tabular view on the FIXED category pages: the column labels did not sit over
   the cells beneath them. Measured on /category/powerconnect-switches at 1490px,
   header-label left edge MINUS body-content left edge:

       Image      +82      label shoved to the right edge of its 140px cell
       Name       -15
       Price     +410      "Price" at x=1270 above a value at x=860
       Quantity   +93

   The COLUMN BOXES are not desynced - [MCP:tabular-header-column-align] already
   matched those, and header and body both report x=845 w=460 for the price
   column. What still disagreed was text-align and horizontal padding:

                     header            body
       image         right / 10px 0    left / 15px
       name          left  / 10px 0    left / 15px
       price         right / 10px 0    left / 15px
       quantity      right / 10px 0    left / 15px

   ROOT CAUSE IS THIS THEME, NOT THE PLATFORM. style.css already carries
       .category-details .product-view .header { text-align:right; padding:0 }   (0,3,0)
   written for the TOOLBAR div.header (the view switchers plus sort dropdown).
   But every table header CELL also carries the class `header`
   (.product-table-view-column.header.price-column), so that selector hits the
   cells as collateral. It is scoped to .category-details, which is exactly why
   the same widget on /home was never affected.

   The SAME tabular widget on /home is already correct and is the reference:
   its header computes text-align:left with padding 10px 15px and measures
   delta 0 on all four columns. This block restates those values rather than
   inventing an alignment. Verified: on /home the rule is a genuine NO-OP -
   delta 0 before AND after - which is what proves it is not overriding a page
   that already works.

   Scoped through .product-table-view-header .product-table-view-column so the
   TOOLBAR keeps its right alignment: measured before/after at 1490/1200/992/768/
   480px, the toolbar, .view-switchers and .sortable are pixel-identical, while
   all four column deltas go to 0 at every width.

   (0,5,0) beats the theme's (0,3,0) on specificity, so it does not depend on
   source order. Body cells deliberately untouched - their 15px padding is the
   inset every cell's content shares.
   --------------------------------------------------------------------------- */
.product-view.tabular-view .product-table-view-header .product-table-view-column.header {
    text-align: left;
    padding: 10px 15px;
}
/* [/MCP:tabular-category-header-align] */

/* [MCP:pdp-detail-column-gutter] */
/* ---------------------------------------------------------------------------
   Product page: 30px gutter between the image and the detail column.

   The two columns met with no gap at all - the image's right edge and the
   product name's left edge both measured x=760, so the text sat directly on the
   divider. The column itself declares no horizontal padding:

     .l-fixed-right              700px wide @ x=760   padding 0
       .fee-widget-content       700px wide           padding 0

   The padding goes on the inner `.fee-widget-content` rather than on
   `.l-fixed-right` so the column's own 700px track is untouched and only its
   contents inset - the divider and the grid stay where they are.

   Measured before -> after:

     image right edge   760       760   (unchanged)
     name left edge     760       790
     gap                  0        30
     column right edge 1460      1460   (unchanged)

   The buy row was the thing to check, since it is the widest content in the
   column: 210 + 224 + 224 = 658px of controls in 700px. With 30px taken out
   they shrink to 201 + 214 + 214 and stay on ONE line, with no label clipped -
   verified by comparing scrollWidth against clientWidth on each button rather
   than by eye. The wishlist and compare row goes 336 -> 322 each, also uncut.

   Scoped to `#webcommander-page.page-product` so only the product detail page
   is affected. `.l-fixed-right` is a generic layout class used for any
   right-hand column on the site, and there is exactly one on this page.
   --------------------------------------------------------------------------- */

#webcommander-page.page-product .l-fixed-right > .fee-widget-content {
    padding-left: 30px;
}

/* [/MCP:pdp-detail-column-gutter] */

/* [MCP:pdp-buy-row-theme-standard] */
/* ---------------------------------------------------------------------------
   The product-detail buy row disagreed with the template on every axis, and two of
   its four controls still wore WebCommander's factory blue. Measured before:

     Add to cart   224x66  22px/600  radius 6px  #008df2 fill  -> hover #0078ce
     Buy now       224x66  22px/500  radius 8px  #176F92 fill  -> hover near-black
     Wish list     336x62  18px/500  radius 6px  white + #008df2 2px border
     Add to compare 336x62 18px/500  radius 6px  white + #008df2 2px border

   The standard is taken from the theme's OWN base button rule, not invented and not
   copied from the listing (which is being edited concurrently by another session):

       body input[...], body button, body .button {
           background: var(--bk-color-primary, #176F92);
           border: medium none;  color: #fff;
           font-size: 18px; font-weight: 500;
           text-transform: uppercase; letter-spacing: 0.1em;
           padding: 15px 30px; transition: all 300ms ease 0s;
       }
       body .button:hover { background: none #000000 }

   HOVER USES THE ORANGE, NOT THAT BLACK. Another session ships [MCP:hover-accent-orange],
   which sets rgb(232,99,30) = #E8631E as this site's hover accent across the product
   listings, taking its reference from the site's own DISCOVER MORE call to action
   (#176F92 -> #E8631E). The listing measures orange on hover today. Matching it here
   keeps the detail page consistent with the listings rather than reintroducing the
   black those blocks deliberately replaced.

   So all four take the same fill, type and metrics, which also makes the row
   internally consistent - it was three different font sizes and three radii.

   THE HOVER RULE IS REQUIRED, not decorative: the rest rule below is id-prefixed at
   (1,2,0) and would otherwise out-rank the platform's own .add-to-cart-button:hover
   (0,2,0), leaving the row dead on hover.

   The quantity stepper is deliberately untouched - it is an input control, not a
   button, and the theme styles it separately.
   --------------------------------------------------------------------------- */
#webcommander-page .cart-button-container .add-to-cart-button,
#webcommander-page .cart-button-container .buy-now-button,
#webcommander-page .product-widget .add-to-wish-list,
#webcommander-page .product-widget .add-to-compare-button,
#webcommander-page .product-widget .remove-from-compare-button {
    background: var(--bk-color-primary, #176F92);
    border: 1px solid var(--bk-color-primary, #176F92);
    color: #ffffff;
    font-size: 18px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    padding: 15px 30px;
    border-radius: 0;
    transition: all 300ms ease 0s;
}

#webcommander-page .cart-button-container .add-to-cart-button:hover,
#webcommander-page .cart-button-container .buy-now-button:hover,
#webcommander-page .product-widget .add-to-wish-list:hover,
#webcommander-page .product-widget .add-to-compare-button:hover,
#webcommander-page .product-widget .remove-from-compare-button:hover {
    background: var(--bk-color-secondary, #E8631E);
    border-color: var(--bk-color-secondary, #E8631E);
    color: #ffffff;
}

/* [/MCP:pdp-buy-row-theme-standard] */

/* [MCP:profile-active-tab-hide-accent-bar] */
/* Hide the 50x3 accent bar drawn under the ACTIVE nav tab on the customer profile.
   The bar comes from this site's own style.css:
       .customer-profile-v2.bmui-tab.left-side-header .bmui-tab-header.bmui-tab-active:after
       { position:absolute; content:""; left:0; bottom:10px; width:50px; height:3px;
         background: var(--bk-color-primary, #176F92); }
   plus a companion that only repositions the SAME pseudo in the top-box layout
       ... .bmui-tab-header-container.top-box .bmui-tab-active:after { bottom: 5px }
   Specificity (0,5,0) and (0,6,0); this override is (1,5,0), so the id beats both and
   no !important is needed.

   Deliberately NOT touched: `.bmui-tab-active .title::after { opacity: 1 }` in the same
   file. That is a DIFFERENT pseudo-element, generated on .title rather than on the tab,
   so this selector cannot match it - hiding it would be an unrelated change.

   NOT VERIFIED IN A BROWSER: /customer/profile is auth-gated and redirects to
   /customer/login when signed out, so the live DOM could not be measured from here.
   The rule is static and scoped to .customer-profile-v2, which exists only on this
   dashboard. */
#webcommander-page .customer-profile-v2.bmui-tab.left-side-header .bmui-tab-header.bmui-tab-active::after {
    display: none;
}
/* [/MCP:profile-active-tab-hide-accent-bar] */

/* [MCP:customer-profile-full-width] */
/* ---------------------------------------------------------------------------
   Customer profile: uncap the 640px tab bodies to full width.

   The cap is NOT per-tab template CSS - it comes from the platform module sheet
   /wc/7.0.0/css/site/module/customer-profile.css, which repeats the identical
   declaration pair on three unrelated selectors, so the same defect shows up on
   several tabs at once. Enumerated on THIS template (comment-aware, brace-matched
   parse of the live sheet, 220,605 bytes):

       L1067  .customer-profile-v2 .customer-profile-manage-account-body      (0,2,0)
       L2669  #customer-profile-tabs.customer-profile-v2
                #bmui-tab-my-entitlements                                     (2,1,0)
       L2720  #customer-profile-tabs.customer-profile-v2 #bmui-tab-my-wallet
                .my-wallet-empty-card                                         (2,2,0)

   all three: max-width:640px; margin:0 auto
   -> Manage My Account, My Entitlements, My Wallet. Overview, My Orders and
   Assigned Pages carry no cap, which is why they are not listed here.

   Line numbers differ per template - these were re-enumerated for 106fffdc and
   are NOT the 1076/2732/2785 seen on d8f790fb. Always re-scan; do not trust them.

   All three sit at the TOP LEVEL of the sheet - a brace-matched walk found no
   @media or @supports rule setting max-width on any of them - so the cap is
   unconditional and this override needs no breakpoint.

   WHY !important RATHER THAN MORE SPECIFICITY: two of the three platform
   selectors already carry TWO ids, and /customer/profile is a login-only route
   (it 302s to /customer/login), so the module-sheet-vs-style.css load order
   cannot be observed from here. The selectors below are copied VERBATIM, so
   without !important this block would lose outright if the module sheet loads
   last. Proven in a local harness against the REAL module sheet: baseline 640px,
   and 100% with the override placed BOTH before and after the module sheet.

   Nothing legitimate is stomped: max-width is the only property touched.
   `margin: 0 auto` is deliberately LEFT ALONE - at full width the auto margins
   compute to 0, so removing it would be a no-op change with extra blast radius.

   NOT touched: .customer-profile-v2 itself is capped at 1145px (L840, and 1155px
   under max-width:1199px). That is the whole profile page container including the
   left nav, not a tab body, so widening it is a different decision.
   --------------------------------------------------------------------------- */
.customer-profile-v2 .customer-profile-manage-account-body {
    max-width: 100% !important;
}

#customer-profile-tabs.customer-profile-v2 #bmui-tab-my-entitlements {
    max-width: 100% !important;
}

#customer-profile-tabs.customer-profile-v2 #bmui-tab-my-wallet .my-wallet-empty-card {
    max-width: 100% !important;
}
/* [/MCP:customer-profile-full-width] */

/* [MCP:profile-logout-flat] */
/* ---------------------------------------------------------------------------
   Customer profile sidebar LOGOUT: no border, no padding, no icon.

   What is overridden, both already in this file:

       #customer-profile-tabs.customer-profile-v2 .profileLogout a
           { border: 2px solid …; padding: 10px 20px 30px; height: 40px;
             line-height: 20px; display: block; width: 100%; text-align: center }
       .body #customer-profile-tabs.customer-profile-v2 .profileLogout a
           { padding: 8px 15px }        <- the padding actually in effect, (1,3,1)
       #customer-profile-tabs.customer-profile-v2 .profileLogout a::before
           { content: ""; background: url(images/logout.svg); width: 17px;
             height: 20px; display: inline-block; margin-right: 10px }

   Two ids (page + tabs container) put these at (2,2,1), clearing (1,3,1) without
   !important.

   THE ICON WAS DRAWN TWICE:

       a::before      theme pseudo-element, 17x20, logout.svg   <- the visible one
       span.icon      platform element, 20x20, absolute, background-image

   `content: none` removes the pseudo outright rather than hiding it, so its 17px
   box and 10px right margin go too; display:none would have left the declaration
   alive for the theme's :hover rule that shifts its background-position.

   The span was ALSO hidden here at first, then that rule was removed on request —
   the pseudo was the mark actually showing, so the extra rule was doing nothing
   visible. The span keeps whatever the platform gives it.

   NOT VERIFIED IN A BROWSER: /customer/profile requires a session and redirects
   an unauthenticated client to /customer/login. Selectors and the declarations
   they override were read from style.css; the cascade was checked by
   reconstructing the markup inside a page that loads the same stylesheet.

   STILL OPEN: the control keeps height: 40px with line-height: 20px, so with the
   padding gone the label sits in the top 20px of a 40px box. line-height: 40px
   would centre it — not applied, because padding: 0 was the ask.
   --------------------------------------------------------------------------- */

#webcommander-page #customer-profile-tabs.customer-profile-v2 .profileLogout a {
    border: none;
    padding: 0;
}

#webcommander-page #customer-profile-tabs.customer-profile-v2 .profileLogout a::before {
    content: none;
}

/* [/MCP:profile-logout-flat] */

/* [MCP:profile-active-subtab-no-bottom-border] */
/* Remove the 2px black underline on the ACTIVE sub-tab inside the profile dashboard
   (Pending Orders / Completed Orders / Orders).
   Winning rule lives in the platform customer-profile stylesheet, not this file:
       .customer-profile-v2.bmui-tab.left-side-header .bmui-tab-header.top.bmui-tab-active
       { border-bottom: 2px rgba(0,0,0,1) solid; }
   That is (0,6,0); this override is (1,6,0) via the page id, so no !important.

   Scoped to .bmui-tab-active only - inactive sub-tabs are left exactly as they are,
   and this is a different element from the left-nav accent bar hidden by
   [MCP:profile-active-tab-hide-accent-bar], which was an ::after on the LEFT nav tab.

   NOT VERIFIED IN A BROWSER: /customer/profile is auth-gated and redirects to
   /customer/login when signed out, so the live DOM is unreachable from here. */
#webcommander-page .customer-profile-v2.bmui-tab.left-side-header .bmui-tab-header.top.bmui-tab-active {
    border-bottom: none;
}
/* [/MCP:profile-active-subtab-no-bottom-border] */

/* [MCP:profile-tab-strip-transparent] */
/* ---------------------------------------------------------------------------
   Customer profile, My Orders: the tab strip loses its white panel.

   The tab header container behind "Pending Orders / Completed Orders / Orders"
   was painted white by the theme:

     #customer-profile-tabs.customer-profile-v2 .bmui-tab-body-container
       .bmui-tab-header-container            (1,3,0)   width: 100%; background: #fff

   That is live theme code, not a commented-out leftover - checked with a
   comment mask over style.css, since a plain text search reports rules inside
   comment blocks as though they were active.

   Worth noting the theme already treats the OTHER tab header this way:

     .bmui-tab.left-side-header.customer-profile-v2 .bmui-tab-header-container
       border-color: #bdbdbd; background: transparent; ...

   so transparent is the template's own handling for a tab strip, and this
   brings the top-box strip in line with it.

   The override is written at (2,3,0) - the same selector with the page id in
   front - so it wins on specificity rather than on file order. Ordering alone
   would be fragile here: style.css on this instance is being edited by several
   sessions at once and the marker count moved from 6 to 18 during this work.

   VERIFICATION NOTE, stated honestly: /customer/profile redirects to
   /customer/login, so this could not be measured on the real page. Instead the
   cascade was verified against a SYNTHETIC replica of that DOM built inside a
   live page, so every real stylesheet applied:

     #customer-profile-tabs.customer-profile-v2 > .bmui-tab-body-container
       > .bmui-tab-header-container.top-box

     before   rgb(255, 255, 255)
     after    rgba(0, 0, 0, 0)

   Only the background is touched; width, borders and the tab items themselves
   are left exactly as they were.
   --------------------------------------------------------------------------- */

#webcommander-page #customer-profile-tabs.customer-profile-v2 .bmui-tab-body-container .bmui-tab-header-container {
    background: transparent;
}

/* [/MCP:profile-tab-strip-transparent] */

/* [MCP:profile-send-button-float-none] */
/* ---------------------------------------------------------------------------
   My Entitlements > My Store Credit: the "Send" submit button was floated right
   and hanging outside the bottom of its white card.

   WINNING RULE IS THIS THEME'S OWN, not the platform module sheet:
       [style.css L4250]  #customer-profile-tabs.customer-profile-v2 button
                          { float: right; ... }                          (1,1,1)
   It floats EVERY button inside the customer profile, not just this one.

   The float was doing two things, and the second is the visible defect.
   Reproduced in a harness carrying the real customer-profile.css + style.css
   over the live DOM chain
   (.store-credit-request-form > .form-row.send-button > button.submit-button):

                            float    .form-row.send-button height    button vs card
       before               right    0px  (COLLAPSED)                bottom 271 > card 246  -> spills out
       after  float:none    none     45px                            bottom 271 < card 307  -> contained

   A floated child contributes no height to its parent, so .form-row.send-button
   measured 0px and the card closed above the button instead of around it.
   float:none returns it to flow: the row gets its 45px back, the card grows
   236 -> 297, and the button is enclosed. The button also moves to the left edge
   of the row, which is what removing a right float means.

   (1,4,1) here beats the theme's (1,1,1), so this does not depend on source
   order even though both live in style.css.

   SCOPED to the store-credit request form on purpose. The same float:right also
   applies to every other button under #customer-profile-tabs - the Manage My
   Account save button among them - and several of those are deliberately
   right-aligned, so widening this is a separate call, not an obvious cleanup.
   Only `float` is set; the button keeps its theme skin (padding, background,
   border, text-transform) from the L4250 rule and its :hover from L4306.
   --------------------------------------------------------------------------- */
#customer-profile-tabs.customer-profile-v2 .store-credit-request-form .form-row.send-button button {
    float: none;
}
/* [/MCP:profile-send-button-float-none] */

/* [MCP:wish-list-create-button-no-float] */
/* ---------------------------------------------------------------------------
   Requested: float: none on the "Create New Wish List" button in My Lists.

   Two ids (page + tabs container) give this (2,3,0), which clears the
   (1,3,0)-shaped rules that style this control — the same specificity that took
   effect for the logout link in [MCP:profile-logout-flat].

   VERIFICATION LIMITS, both worth knowing:

   1. /customer/profile requires a session and redirects an unauthenticated
      client to /customer/login, so this could not be measured in a browser
      before or after, and there is no before/after screenshot.

   2. The rule that floats it could not be read either. DevTools attributes the
      button's styling to a sheet shown as "customer.cs…:41", which is served
      only on authenticated customer pages — it is not on /customer/login, and
      it is not customer-profile.css (that file exists, 220KB, and contains no
      occurrence of create-wish-list). Eight other candidate paths 404.
      style.css itself only mentions .create-wish-list for the wish-list POPUP
      (.wish-list-popup .footer .create-wish-list), not this button.

   So the float's origin and its specificity are unknown. This declaration is
   written to beat the specificity such rules normally use here, without
   !important. If the button still floats after this, that rule is either more
   specific or !important, and the fix is to match it — the computed value from
   the inspector would settle it in one step.
   --------------------------------------------------------------------------- */

#webcommander-page #customer-profile-tabs.customer-profile-v2 .wish_list .create-wish-list {
    float: none;
}

/* [/MCP:wish-list-create-button-no-float] */

/* [MCP:scrollable-view-price-centre] */
/* ---------------------------------------------------------------------------
   The price row in the customer-profile "Top Selling Product" widget sat hard
   against the left edge of its own box while the rest of the card sat in from
   both sides. Marked node: div.price-waper, 221x48 on that page.

   It is not a text-align problem. The row is a FLEX container:

       .product-block .price-waper { padding-bottom:20px; display:flex; align-items:center }
       [template style.css L1657]  (0,2,0)

   so text-align never reaches .price-block-container - a flex item is placed by
   justify-content, which was never declared and therefore resolved to the
   initial value (normal, i.e. flex-start). align-items:center on the same rule
   only ever handled the CROSS axis, which is why the row looked vertically
   right and horizontally wrong.

   Measured on a reconstruction of the profile chain against the site's live
   stylesheets (/customer/profile requires a login, so it cannot be visited by
   the probe; the chain is taken from the screenshot's breadcrumb:
   .product-view.scrollable-view > .content > .product-block > .block-content-wrap
   > .price-waper):

       row 266px, price ink 89px      before  inset L=0  R=177   off-centre -88px
                                      after   inset L=88 R=88    off-centre   0px

   Checked at 1530 / 1199 / 991 / 767 / 575 / 390px: centred at every width, and
   no overflow - when a sale row's two children (.price-block-container plus the
   struck-through .previous-price) already fill the line there is nothing left to
   distribute, so those rows simply stay put rather than spilling past the edges.

   SCOPE: .scrollable-view only, which today is exactly this widget - the
   listings on / and /category render .image-view, and no scrollable-view is
   reachable anywhere else on the site. That limit is deliberate: the grid and
   list cards were deliberately left-aligned earlier (see
   [MCP:image-view-rating-align-left], [MCP:image-view-title-padding]), and
   centring their price alone would put the price out of step with the title,
   rating and buttons above it. Verified with the candidate injected on the home
   page: every .image-view price row stayed justify-content:start with its ink
   still at inset 0.
   --------------------------------------------------------------------------- */
#webcommander-page .product-view.scrollable-view .product-block .price-waper {
    justify-content: center;
}

/* [/MCP:scrollable-view-price-centre] */

/* [MCP:profile-nav-icon-align] */
/* ---------------------------------------------------------------------------
   Customer profile left nav: the icon sat well above its label.

   The icon is pinned to a FIXED offset by the platform module sheet, while this
   template enlarges the label - so the two were designed against different
   metrics:

       [customer-profile.css]
         .customer-profile-v2.bmui-tab.left-side-header .bmui-tab-header
           { position: relative; padding: 8px 8px 8px 30px }
         .customer-profile-v2.bmui-tab.left-side-header .bmui-tab-header .icon
           { width: 20px; height: 20px; position: absolute; left: 0; top: 8px }
         .customer-profile-v2.bmui-tab.left-side-header .bmui-tab-header .title
           { font-size: 14px; line-height: 21px }        <- platform's assumption

       [style.css L3936]
         .customer-profile-v2.bmui-tab.left-side-header .bmui-tab-header .title
           { font-size: 17px; line-height: 34px; font-weight: 600 }   <- what renders

   `top: 8px` only centres a 20px icon against a 21px line box. Once the label's
   line-height became 34px the row grew to 8 + 34 + 8 = 50px and the text settled
   on the row's centre at 24.5px, while the icon's centre stayed at 8 + 10 = 18px.
   Measured across all eight rows: the icon sits 6.5px above the label.

   MEASURE THE GLYPHS, NOT THE ELEMENT BOX. The label also carries
   `padding: 0 0 15px` (space for the active-tab underline drawn by
   `.title::after`), so its element box is 38px tall and centres at 32px - 7px
   below where the text actually is. Comparing icon centre against that padded
   box reports the fix as failing when it is correct. The verification here takes
   the label's box from a Range over its text node, which is the visible glyph
   box: 23px tall, centred at 24.5px.

   FIX: centre the icon on the row instead of offsetting it by a constant.

   This is exact rather than approximate, and it is worth saying why: the row's
   vertical padding is symmetric (8px top and 8px bottom), so the label's line box
   is already centred in the row. Centring the icon on the row therefore centres
   it on the label - and it stays correct if the font size, the line-height or the
   padding are ever retuned, which a hard-coded `top` value would not.

   `transform` is safe to set here: the icon carries none of its own (verified -
   the platform rule sets only background-image, width, height, position, left and
   top, and the :hover variants change background-image only), so nothing is being
   replaced. All the per-item icon artwork is delivered through background-image
   on the same element and is untouched.

   SPECIFICITY: the platform rule is (0,5,0). Prefixing the container id gives
   (1,5,0), which wins regardless of stylesheet ORDER - and order genuinely cannot
   be observed here, because /customer/profile 302-redirects to /customer/login,
   so the page cannot be loaded without a session. Using the id rather than
   !important keeps the door open for a later, more specific override.

   VERIFICATION NOTE: measured in a reconstructed harness - the real module
   stylesheet and this site's style.css loaded in production order against the
   documented markup - because the live route needs a login. The geometry above
   is taken from the stylesheets themselves, and the fix is self-centring rather
   than a tuned constant, so it does not depend on the harness reproducing the
   markup exactly.
   --------------------------------------------------------------------------- */

#customer-profile-tabs.customer-profile-v2.bmui-tab.left-side-header
  .bmui-tab-header .icon {
    top: 50%;
    transform: translateY(-50%);
}

/* [/MCP:profile-nav-icon-align] */

/* [MCP:profile-tab-body-remove-outer-border] */
/* ---------------------------------------------------------------------------
   Customer profile: drop the outer 1px box around the tab body container.

   On Overview it read as a stray horizontal rule floating above the "Top Selling
   Product" card, because the tab-header-container is hidden on that tab and only
   the body container's own top edge was left drawing.

   WINNING RULE IS THIS THEME'S OWN:
       [style.css]  .bmui-tab.left-side-header.customer-profile-v2
                      .bmui-tab-body-container { border: 1px #bdbdbd solid }   (0,4,0)

   Measured on the live DOM chain
   (#customer-profile-tabs.bmui-tab.left-side-header.customer-profile-v2 >
    .customer-profile-right > .bmui-tab-body-container) with the real
   customer-profile.css + style.css + responsive.css loaded:

       viewport   border T/R/B/L        before -> after
       1100px     1px/1px/1px/0px  ->   0/0/0/0
        700px     0/0/0/0          ->   0/0/0/0     (already none under 767px)

   So this is a NO-OP on mobile - responsive.css already removes it below 767px -
   and only changes the desktop rendering, which is where the stray line was.

   The class is repeated to reach (0,5,0) so it beats the theme's (0,4,0) on
   specificity alone rather than relying on being appended later in the same file.

   NOTHING ELSE LOSES A BORDER - verified unchanged in the same measurement:
     .bmui-tab-header-container   keeps its right/bottom edge, and its full
                                  1px #DEDEDE box under 767px
     .special-product .title      keeps its 1px bottom rule (the "Top Selling
                                  Product" underline)
     .customer-profile-card       already borderless, still borderless
   Inner cards therefore keep defining the panel's structure; only the redundant
   outer wrapper box is removed.
   --------------------------------------------------------------------------- */
.bmui-tab.left-side-header.customer-profile-v2 .bmui-tab-body-container.bmui-tab-body-container {
    border: none;
}
/* [/MCP:profile-tab-body-remove-outer-border] */

/* [MCP:profile-nav-remove-right-divider] */
/* ---------------------------------------------------------------------------
   Customer profile: remove the vertical divider between the left nav and the
   tab content.

   WINNING RULE IS THIS THEME'S OWN:
       [style.css]  .bmui-tab.left-side-header.customer-profile-v2
                      .bmui-tab-header-container
                    { border-color:#bdbdbd; background:transparent;
                      border-right: 1px solid #DEDEDE }                   (0,4,0)

   SCOPED TO min-width:768px ON PURPOSE - this is the whole point of the block.
   responsive.css gives the SAME element a full box under 767px:
       @media (max-width: 767px)
       .bmui-tab.left-side-header.customer-profile-v2 .bmui-tab-header-container
       { border: 1px solid #DEDEDE; float:none; width:auto }              (0,4,0)
   so on mobile the nav is a bordered CARD, not a column with a divider.
   Measured border T/R/B/L on the live DOM chain with the real
   customer-profile.css + style.css + responsive.css:

       viewport   before      unscoped override   this block
       1200px     0/1/1/0     0/0/1/0             0/0/1/0
        700px     1/1/1/1     1/0/1/1  <- BREAKS  1/1/1/1  <- intact

   An unscoped `border-right: none` would have punched the right side out of that
   mobile card, so the media query is load-bearing, not decoration.

   Only border-RIGHT is set. The 1px #EBEBEB border-BOTTOM from
   customer-profile.css .bmui-tab-header-container.top-box is deliberately left
   alone - it underlines the active tab label and was not part of the request
   (measured still rgb(235,235,235) after this block at both widths).

   The class is repeated to reach (0,5,0) so it beats the theme's (0,4,0) on
   specificity rather than on being appended later in the same file.
   --------------------------------------------------------------------------- */
@media (min-width: 768px) {
    .bmui-tab.left-side-header.customer-profile-v2 .bmui-tab-header-container.bmui-tab-header-container {
        border-right: none;
    }
}
/* [/MCP:profile-nav-remove-right-divider] */

/* [MCP:profile-create-button-standard] */
/* ---------------------------------------------------------------------------
   Customer profile: "Create New Wish List" wears the standard button skin.

   The button rendered as a ghost while the Save button on Manage My Account -
   the reference the design points at - is a solid fill. Measured side by side:

     property     Save (standard)        Create New Wish List (before)
     background   #176F92                #ffffff
     colour       #ffffff                #176F92
     border       none                   2px solid #176F92
     padding      15px 30px              12px 20px
     font-size    18px                   16px
     transform    uppercase              capitalize
     letter-sp    1.8px                  1.6px
     hover        #000000                #176F92

   Save gets its look from the site-wide `body .button` rule; the create button
   is deliberately pulled OUT of that by a theme rule that also dresses the
   password-edit link and the wish-list popup:

     #bmui-tab-account_information .button-line span.link-btn.password-edit-link,
     #customer-profile-tabs span.create-new.button, .wish-list-popup ...   (1,2,1)

   Only the create button is pulled back to the standard here. The password-edit
   link keeps its ghost treatment - verified unchanged - because that rule is
   shared and the request was about this one button. The hover is restated at
   (2,3,1) so it beats the theme's own hover arm at (1,3,1); without it the
   button would stop reacting once the rest rule out-specified the cascade.

   Both class spellings are covered - `span.create-new.button` and
   `.create-wish-list.button` - because the markup could not be read directly.

   VERIFICATION NOTE: /customer/profile redirects to /customer/login, so this
   was measured against a SYNTHETIC replica of the profile DOM built inside a
   live page, with every real stylesheet applying. After the change the create
   button matches Save on all eight properties above, at rest and on hover.
   Worth a glance on the real page next time you are signed in.
   --------------------------------------------------------------------------- */

#webcommander-page #customer-profile-tabs span.create-new.button,
#webcommander-page #customer-profile-tabs .create-wish-list.button {
    background-color: var(--bk-color-primary, #176F92);
    color: #ffffff;
    border: 0;
    padding: 15px 30px;
    font-size: 18px;
    text-transform: uppercase;
    letter-spacing: 1.8px;
}

#webcommander-page #customer-profile-tabs span.create-new.button:hover,
#webcommander-page #customer-profile-tabs .create-wish-list.button:hover {
    background-color: #000000;
    color: #ffffff;
    border: 0;
}

/* [/MCP:profile-create-button-standard] */

/* [MCP:profile-nav-title-no-bottom-padding] */
/* Left-nav item label carried bottom padding, making span.title 49px tall for a 34px
   line (measured in DevTools on the active Overview item: 213x49).

   Scoped through .customer-profile-left on purpose. The dashboard has TWO different
   .bmui-tab-header .title elements and they are styled by different rules:
       left nav   .customer-profile-left ... .title
                  { font-size: 17px; line-height: 34px; font-weight: 600 }
       sub-tabs   .bmui-tab-body-container .bmui-tab-header .title
                  { font-size: 18px; line-height: 20px; padding: 15px 0 }
   The sub-tab rule's 15px vertical padding is deliberate spacing for the Pending /
   Completed / Orders row, so this selector must NOT reach it - .customer-profile-left
   and .bmui-tab-body-container are disjoint branches of the tree.

   (1,6,0) via the page id, so no !important and nothing here can block a later
   :hover or .bmui-tab-active rule on the same label.

   NOT VERIFIED IN A BROWSER: /customer/profile is auth-gated and redirects to
   /customer/login when signed out; the platform customer-profile.css is served only
   on that page (four candidate paths all 404), so no fixture is possible either. */
#webcommander-page .customer-profile-v2.bmui-tab.left-side-header .customer-profile-left .bmui-tab-header .title {
    padding-bottom: 0;
}
/* [/MCP:profile-nav-title-no-bottom-padding] */

/* [MCP:scrollable-view-title-hover] */
/* ---------------------------------------------------------------------------
   Hover colour for the product title in the customer-profile widget.

   A title hover already exists site-wide and already names this card:

       #webcommander-page .product-view .product-name a:hover,
       #webcommander-page .product-block a.product-name-link:hover, ...
           -> var(--bk-color-primary, #176F92)   [MCP:product-title-hover-standard]
           -> #E8631E                            [MCP:hover-accent-orange], later, wins

   and it DOES reach this widget. Forcing :hover on the link inside a
   reconstruction of the profile chain returns rgb(232,99,30), identical to a real
   listing title. So the rule was never missing - what was missing was the hover
   firing at all where the pointer actually is. Colouring the title only when the
   title's own box is hovered fails whenever anything else in the card takes the
   pointer, which is the ordinary case on a card whose image and body are the big
   targets. Measured, before this block:

       card  hovered ->  title rgba(0,0,0,0.8)      <- no reaction
       link  hovered ->  title rgb(232,99,30)

   Driving it from .product-block:hover makes the title react to the whole card,
   which is also the stronger version of what was asked for: hovering the link is
   hovering the card, so the direct hover keeps working unchanged.

   (0,4,1) rest / (1,3,1) existing hover / (1,5,0) here, so this wins on class
   count with the same single id, and it sets the SAME colour the existing hover
   rule resolves to today - it changes when the colour applies, not which colour.

   Written as var(--bk-color-secondary, #E8631E) because that is exactly how the
   theme already declares its link colour (a:link), so a seeded kit moves the two
   together instead of stranding one on a literal.

   VERIFICATION LIMIT, stated plainly: /customer/profile redirects anonymous
   requests to /customer/login/, so the live widget cannot be measured without the
   user's session. Everything above was measured on the documented chain against
   the site's real stylesheets, which settles the cascade but not the page's own
   markup.

   CONTRAST, recorded deliberately: #E8631E on the card's white measures 3.37:1.
   The title is 16px/700, which is NOT WCAG large text, so the bar is 4.5:1 and
   this hover state does not meet it. It is the colour every other product title
   on this site already hovers to, so this matches the design rather than adding a
   new problem - but it is worth knowing.

   SCOPE: .scrollable-view only. The grid and list cards keep link-only hover; the
   listings were verified unchanged (card hovered -> title still rgba(0,0,0,0.8),
   link hovered -> still rgb(232,99,30)).
   --------------------------------------------------------------------------- */
#webcommander-page .product-view.scrollable-view .product-block:hover a.product-name-link,
#webcommander-page .product-view.scrollable-view .product-block:hover a.title-link {
    color: var(--bk-color-secondary, #E8631E);
}

/* [/MCP:scrollable-view-title-hover] */

/* [MCP:customer-profile-white-background] */
/* ---------------------------------------------------------------------------
   Requested: white background on the customer profile page.

   The wrapper is grey today:

       .customer-profile-v2-wrapper { background-color: #F7F7F7; padding: 65px 20px }

   That rule is (0,1,0); prefixing the page id makes this (1,1,0), so no
   !important is needed. Padding is left alone — only the colour was asked for.

   The value is the kit's background ROLE rather than a literal white. The kit
   seeded for this site defines background as #FFFFFF, so it renders white today,
   and if that role is ever re-pointed this page follows the rest of the site
   instead of staying pinned to a hard-coded colour. The #FFFFFF fallback keeps it
   white if the token is ever absent.

   NOT VERIFIED IN A BROWSER: /customer/profile requires a session and redirects
   an unauthenticated client to /customer/login, so there is no before/after
   measurement. The selector and the rule it overrides were read from the
   platform sheet the page loads; the cascade was checked by reconstructing the
   wrapper inside a page that loads the same stylesheets, where it resolves to
   rgb(255, 255, 255).
   --------------------------------------------------------------------------- */

#webcommander-page .customer-profile-v2-wrapper {
    background-color: var(--bk-color-background, #FFFFFF);
}

/* [/MCP:customer-profile-white-background] */

/* [MCP:profile-logout-match-nav-items] */
/* ---------------------------------------------------------------------------
   Left nav: make LOGOUT render as one more nav row instead of a button.

   The PLATFORM already styles it to match - customer-profile.css L913 gives
   .profileLogout a padding:8px 8px 8px 30px and L905 gives the wrapper
   margin-top:12px, exactly like a .bmui-tab-header. Every difference is from
   THIS THEME:
     [style.css L3832] .button.profileLogout { margin-top:0; max-width:150px }
     [style.css L3838] .profileLogout a { color:var(--bk-color-primary);
                       font-size:15px; text-align:center; height:40px; width:100% }
     [style.css L3872] .profileLogout:hover a { background:var(--bk-color-primary) }
     [style.css L7641] #webcommander-page ... .profileLogout a
                       { border:none; padding:0 }                (2,2,1) - highest
   plus text-transform:uppercase and letter-spacing:1.8px inherited from .button.

   VALUES TAKEN FROM THE RENDERED PAGE, not from a reconstructed harness. An
   earlier revision of this block used harness numbers (14px, padding 0 0 10px)
   and was WRONG on both counts - it shrank the label and dropped the left inset
   so the text printed on top of the icon. Corrected against the real render:

     nav row pitch          62px = 50px box + 12px margin
                            50px box = padding 8+8 + line-height 34   -> confirms
                            the PLATFORM box values, so they are restored here
     nav text inset         ~29px from the row's left edge            -> 30px
     nav label size         "My Carts" 8.75px/char vs a 14px "Logout" at
                            7.3px/char = ratio .83 = 14/17            -> 17px

   So the nav label is the THEME's 17px/600/line-height 34 (style.css L3912),
   NOT the 14px that customer-profile.css `.bmui-tab-header.top .title` would
   impose - that rule does not win on the live page.

   INK: the nav title is color:#000000 under opacity:.8. Logout's text is a bare
   text node sharing its <a> with the icon span, so opacity there would fade the
   icon too - it gets color:rgba(0,0,0,.8) instead: same text result, icon left
   at full strength like the nav icons.

   The icon is centred with top:50%/translateY(-50%) to match [style.css L7688],
   which targets .bmui-tab-header .icon and never reached the logout icon (fixed
   top:8px). Hover restated as the nav convention - no fill, primary text - and it
   MUST be restated, or the id-prefixed rest rule below out-ranks
   .profileLogout:hover a and the hover dies.

   Selector matches [L7641]'s (2,2,1) exactly and is appended later, so it wins
   the padding:0 it has to beat.
   --------------------------------------------------------------------------- */
#customer-profile-tabs.customer-profile-v2 .button.profileLogout {
    margin-top: 12px;
    max-width: none;
}

#webcommander-page #customer-profile-tabs.customer-profile-v2 .profileLogout a {
    display: block;
    width: auto;
    height: auto;
    padding: 8px 8px 8px 30px;
    text-align: left;
    text-transform: none;
    letter-spacing: normal;
    font-family: 'Open Sans', sans-serif;
    font-weight: 600;
    font-size: 17px;
    line-height: 34px;
    color: rgba(0, 0, 0, 0.8);
    background: none;
}

#customer-profile-tabs.customer-profile-v2.bmui-tab.left-side-header .profileLogout a .icon {
    top: 50%;
    transform: translateY(-50%);
}

#webcommander-page #customer-profile-tabs.customer-profile-v2 .profileLogout:hover a {
    background: none;
    color: var(--bk-color-primary, #176F92);
}
/* [/MCP:profile-logout-match-nav-items] */

/* [MCP:pdp-action-icons-match-label] */
/* ---------------------------------------------------------------------------
   On the product page, ADD TO WISH LIST and ADD TO COMPARE drew their icons in
   #008DF2 blue while the button label beside them was white on the teal fill.

   The icons are FontAwesome glyphs on a pseudo-element, and a platform sheet
   paints them:

       product-details.css
           .product-widget.widget-addCart .button.add-to-wish-list::after
               { color: rgb(0, 141, 242) }

   That is the same hard-coded #008DF2 that was overriding the theme on this
   page's Add to cart button — a platform default leaking through a theme that
   never asked for it.

   `color: inherit` rather than a literal white: the glyph then takes whatever
   the button's own label colour is, in every state, so it can never drift from
   the text again. Measured:

                      label      icon (before)   icon (after)
       wish, rest     #ffffff    #008DF2          #ffffff
       wish, hover    #ffffff    #ffffff          #ffffff
       compare, rest  #ffffff    #008DF2          #ffffff
       compare, hover #ffffff    #008DF2          #ffffff

   Note the asymmetry that was there before: the wishlist icon already went white
   on HOVER (something overrode the blue in that state) while compare stayed blue
   in both. Inheriting removes the special case rather than adding a second one.

   Scoped to .product-widget.widget-addCart, which is the product page's buy
   block — listing cards style these buttons separately and are untouched.
   --------------------------------------------------------------------------- */

#webcommander-page .product-widget.widget-addCart .button.add-to-wish-list::after,
#webcommander-page .product-widget.widget-addCart .button.add-to-compare-button::after {
    color: inherit;
}

/* [/MCP:pdp-action-icons-match-label] */

/* [MCP:profile-create-button-match-site-buttons] */
/* Make the profile's Create New Wish List / Create New button wear the SAME button
   identity as the rest of this site, measured from the live product-card buttons:
       card buttons   font-size 14px, letter-spacing normal, border 1px solid
                      rgb(23,111,146), radius 0, hover fill+border rgb(232,99,30)
       this button    font-size 18px, letter-spacing 1.8px, border 0, hover fill #000

   Only the identity properties are changed. Padding stays 15px 30px and the uppercase
   transform stays - both come from the existing profile blocks and are reasonable for a
   standalone CTA, unlike the card buttons' 7px 17px which is tuned for a stacked column.
   Background and text colour are already correct and are not restated.

   This intentionally overrides two blocks written by another session on this same file,
   [MCP:profile-nav-remove-right-divider] and [MCP:profile-create-button-standard].
   Neither is edited; deleting THIS block restores their look exactly.
   The hover is restated here because those blocks set their own hover - without it the
   button would keep the black hover and only change at rest.

   NOT VERIFIED IN A BROWSER: /customer/profile is auth-gated and its platform CSS is
   served only on that page, so no live measurement or fixture was possible. */
#webcommander-page #customer-profile-tabs span.create-new.button,
#webcommander-page #customer-profile-tabs .create-wish-list.button {
    font-size: 14px;
    letter-spacing: normal;
    border: 1px solid rgb(23, 111, 146);
    border-radius: 0;
}
#webcommander-page #customer-profile-tabs span.create-new.button:hover,
#webcommander-page #customer-profile-tabs .create-wish-list.button:hover {
    background-color: rgb(232, 99, 30);
    border-color: rgb(232, 99, 30);
    color: #ffffff;
}
/* [/MCP:profile-create-button-match-site-buttons] */

/* [MCP:wish-list-create-button-height-auto] */
/* ---------------------------------------------------------------------------
   My Lists: "Create New Wish List" button - height auto.

   Requested against the rule shown in DevTools,
     [MCP:wish-list-create-button-no-float] (another session's block, L8901)
     #webcommander-page #customer-profile-tabs.customer-profile-v2
       .wish_list .create-wish-list { float: none }
   so this adds to that same element rather than editing that block.

   HONEST NOTE ON EFFECT: nothing in the loaded CSS constrains this button's
   height. Scanned style.css, customer-profile.css, site-fixed.min.css,
   ecommerce.min.css, site-base-noncritical.css and site-responsive-base.css for
   any height / max-height / min-height reaching span.button.create-wish-list -
   the only matches already say auto:
       [customer-profile.css]  #customer-profile-tabs span.button   height:auto
       [style.css]             body .button                         height:auto
       [site-fixed.min.css]    span.button                          height:auto
   so as a stylesheet declaration this is expected to be a NO-OP. It is kept
   because a height applied inline by JS is the one source not visible from
   here, and this makes the intent explicit and self-documenting.

   IF THE BUTTON IS STILL CLIPPED, height is not the cause. The likely mechanism
   is that .create-wish-list is a <span> in normal INLINE flow: its 15px vertical
   padding (from [style.css L7723] padding:15px 30px) paints outside the line
   box, so it contributes no layout height and gets visually cut by whatever
   follows or by an ancestor's overflow. The fix for that is
   `display: inline-block`, not a height - unverified here because
   /customer/profile is login-only, so it is deliberately NOT applied blind.
   --------------------------------------------------------------------------- */
#webcommander-page #customer-profile-tabs.customer-profile-v2 .wish_list .create-wish-list {
    height: auto;
}
/* [/MCP:wish-list-create-button-height-auto] */