.modal {z-index: 999999999;}
a:focus {outline:none !important;}
.comm-content { background:#fff !important;}
html {scroll-behavior: smooth;}
#you-may-also-need-backdrop {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: transparent;
	z-index: 1059;
}
#you-may-also-need {
	position: fixed;
	top: 0;
	right: 400px;
	width: 620px;
	max-width: calc(100vw - 20px);
	max-height: 100vh;
	overflow-y: auto;
	background: #fff;
	border: 1px solid #d9d9d9;
	border-radius:25px;
	z-index: 1060;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25);
	font-family: Arial, Helvetica, sans-serif;
}
#you-may-also-need[data-context="addtocart"] {
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	z-index: 1000;
}
#you-may-also-need .ymn-header {
	background: #0d7397;
	color: #fff;
	padding: 14px 18px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 20px;
	font-weight: 600;
	border-radius: 6px 6px 0 0;
}
#you-may-also-need .ymn-close {
	background: none;
	border: none;
	color: #fff;
	font-size: 18px;
	cursor: pointer;
}
#you-may-also-need .you-may-need-wrapper {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 20px;
}
#you-may-also-need .need-arrow {
	flex: 0 0 auto;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	border: 1px solid #d9d9d9;
	background: #fff;
	color: #0d7397;
	font-size: 14px;
	cursor: pointer;
}
#you-may-also-need .need-arrow:disabled {
	color: #ccc;
	cursor: default;
}
#you-may-also-need .you-may-need-products {
	flex: 1;
	overflow: hidden;
}
#you-may-also-need .you-may-need-track {
	display: flex;
	gap: 20px;
	transition: transform 0.3s ease;
}
#you-may-also-need .need-product {
	flex: 0 0 calc((100% - 40px) / 3);
	max-width: calc((100% - 40px) / 3);
	text-align: center;
}
#you-may-also-need .need-product img {
	width: 120px;
	height: 90px;
	object-fit: contain;
	margin-bottom: 12px;
}
#you-may-also-need .need-title {
	display: block;
	color:#39393a;
	font-size: 13px;
	line-height: 18px;
	min-height:41px;
	text-decoration: none;
	font-weight: 600;
}
#you-may-also-need .need-title:hover {
	color:#39393a;
}
#you-may-also-need .need-price {
	font-size: 18px;
	color: #0099cc;
	font-weight: 700;
	margin: 12px 0;
}
#you-may-also-need .need-price small {
	display: block;
	font-size: 12px;
	color: #666;
	font-weight: 400;
}
#you-may-also-need .ymn-add {
	width: 100%;
	background:#94c347;
	color: #fff;
	border: none;
	border-radius: 4px;
	padding: 10px 20px;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
}
#you-may-also-need .ymn-add:disabled {
	background: #9ecdb3;
	cursor: default;
}
#you-may-also-need .ymn-proceed {
	display: none;
	width: 100%;
	background:#364916;
	color: #fff;
	border: none;
	padding: 14px;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
	border-radius: 0 0 6px 6px;
}
@media (max-width: 767px) {
 #you-may-also-need {
 right: 0;
 width: 100%;
 max-width: 100%;
 bottom: 0;
 border-radius: 0;
}
 #you-may-also-need .need-product {
 flex: 0 0 100%;
 max-width: 100%;
}
 #you-may-also-need .ymn-proceed {
 display: block;
}
}
.dv-basket-card {
	background: white;
	border: 1px solid #dcdcdc;
}
.basket-card {
	padding-right: 20px;
}
.basket-card-actions {
	margin-top: 15px;
	text-align: right;
}
.basket-status {
	margin-top: 15px;
}
.stock-status {
	display: flex;
	align-items: center;
	gap: 8px;
	font-weight: 600;
}
.stock-status.in-stock {
	color: #28a745;
}
.stock-status.back-order {
	color: #f39c12;
}
.delivery-status {
	margin-top: 6px;
	font-size: 13px;
	color: #666;
}
.delivery-date {
	margin-top: 2px;
	font-weight: 600;
	color: #222;
	padding-left: 1px;
}
.basket-qty-wrapper {
	margin-top: 20px;
}
.qty-label {
	display: block;
	margin-bottom: 8px;
	font-size: 13px;
	font-weight: 600;
	color: #000;
}
.basket-qty {
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1px solid #ddd;
	border-radius: 34px;
	overflow: hidden;
	width: 140px;
	height: 42px;
	margin-left: auto;
}
.qty-btn {
	width: 40px;
	height: 40px;
	border: none;
	background: #f8f8f8;
	cursor: pointer;
	transition: 0.2s;
}
.qty-btn:hover {
	background: #ececec;
}
.qty-btn:disabled {
	opacity: 0.45;
	cursor: not-allowed;
}
.qty-input {
	width: 60px;
	border: none;
	text-align: center;
	font-weight: 600;
	background: #fff;
}
.basket-remove-container {
	margin-top: 15px;
	margin-bottom: 20px;
}
.basket-remove {
	background: none;
	border: none;
	color: #ff0d17;
	padding: 0;
	font-size: 26px;
}
.basket-remove:hover {
	text-decoration: underline;
}
.switch-badge {
	display: inline-block;
	background: #007b5f;
	color: #fff;
	font-size: 12px;
	padding: 5px 12px;
	border-radius: 20px;
	margin-bottom: 10px;
	font-weight: 600;
}
.switch-title {
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 5px;
}
.switch-text {
	color: #666;
	font-size: 13px;
}
.switch-price {
	font-size: 20px;
	font-weight: bold;
}
.switch-saving {
	color: #28a745;
	font-weight: 600;
	margin-top: 6px;
}
.switch-product-name {
	font-size: 16px;
	font-weight: 600;
	margin-top: 8px;
}
.switch-price {
	margin-top: 6px;
	font-size: 18px;
	font-weight: 700;
}
.switch-price small {
	display: block;
	font-size: 12px;
	color: #777;
	font-weight: 400;
}
.switch-saving-label {
	font-size: 12px;
	color: #666;
}
.switch-saving {
	color: #28a745;
	font-size: 18px;
	font-weight: 700;
}
/* ===========================
     Switch & Save
    =========================== */

.switch-save-card {
	margin-top: 20px;
	padding: 20px;
	border: 2px solid #d5007f; /* Brand magenta */
	border-radius: 8px;
	background: #ffffff;
}
.switch-save-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 15px;
}
.switch-heading {
	font-size: 18px;
	font-weight: 600;
	color: #222;
}
.switch-product-name {
	font-size: 16px;
	font-weight: 600;
	margin: 0px 0;
	color: #09c;
	margin-top: -28px;
}
.switch-price {
	font-size: 17px;
	font-weight: 700;
	color: #000000;
}
.switch-price small {
	display: block;
	margin-top: 4px;
	font-size: 12px;
	font-weight: 500;
	color: #222121;
}
.switch-saving {
	font-size: 18px;
	font-weight: 700;
	color: #0a8a43;
}
.switch-footer {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 20px;
}
.switch-footer .btn {
	min-width: 170px;
}
.delivery-cutoff {
	margin-top: 6px;
	font-size: 13px;
	color: #555;
}
.delivery-cutoff i {
	color: #d5007f;
	margin-right: 5px;
}
.delivery-countdown {
	font-weight: 700;
	color: #d5007f;
}
.delivery-date {
	margin-top: 5px;
	font-size: 14px;
	font-weight: 600;
}
.basket-switch-save {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 16px 20px;
	margin-bottom: 20px;
	border: 2px solid #d5007f;
	border-radius: 8px;
	background: #fff;
}
.basket-switch-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 10px;
}
.basket-switch-header h3 {
	margin: 0;
	font-size: 20px;
	font-weight: 600;
}
.basket-switch-total {
	font-size: 18px;
	font-weight: 700;
	color: #198754;
}
.basket-switch-save p {
	margin: 0 0 15px;
	color: #666;
}
.voucher-applied {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px;
	background: #eaf8ef;
	color: #1e7e34;
	border-radius: 20px;
	font-size: 13px;
	font-weight: 600;
}
/*Anil css*/
.row.dv-basket-card {
	border-radius: 10px;
	padding: 10px;
	margin-bottom: 20px;
	border-radius: 10px;
}
.switch-heading {
	position: relative;
	top: -36px;
	background: #fff;
	display: inline-block;
	padding: 0 12px;
}
.fa-plus:before, .fa-minus:before {
	color: #0099cc !important;
}
.price-row.ex-vat > strong {
	font-size: 18px;
	color: #0099cc;
}
.price-row.ex-vat {
	font-weight: 700
}
.price-row.ex-vat > span {
	font-size: 13px;
	color: #0099cc;
}
.price-row.inc-vat > strong {
	font-size: 16px;
	color: #0099cc;
	font-weight: 400 !important
}
.price-row.inc-vat {
	font-weight: 400 !important
}
.price-row.inc-vat > span {
	font-size: 12px;
	color: #0099cc;
	font-weight: 400 !important
}
.price-row.save-saving > strong {
	font-size: 18px;
	color: #5cb85c;
}
.price-row.save-saving {
	font-weight: 600
}
.price-row.save-saving > span {
	font-size: 13px;
	color: #5cb85c;
}
button.btn.btn-success.atb-replace {
	padding: 7px 16px;
	margin-top: 12px;
	border-radius: 6px !important;
}
/*button.btn.btn-success.replaceall {
            padding: 7px 16px;
            margin-top: 12px;
            border-radius: 6px !important;
        }
        button.btn.btn-success.replaceall:hover {
                color: #fff;
                background-color: #5cb85c;
                border-color: #4cae4c;
        }*/
.switch-save-card .btn-success {
	color: #fff;
	background-color: #5cb85c;
	border-color: #4cae4c;
}
.switch-save-card .btn-success:hover {
	color: #fff;
	background-color: #5cb85c;
	border-color: #4cae4c;
}
.shipping-time {
	display: flex;
	align-items: center;
	margin-bottom: 20px;
}
.shipping-time img {
	margin-right: 12px
}
.shipping-time {
	font-weight: 600;
	color: #5cb85c;
	line-height: 18px
}
.basket-switch-left {
	display: flex;
	flex-direction: column;
}
.basket-switch-left h3 {
	margin: 0;
	font-size: 32px;
	font-weight: 700;
}
.basket-switch-left p {
	margin: 5px 0 14px;
	color: #666;
}
/*.basket-switch-right {
        text-align: right;
    }

        .basket-switch-right span {
            display: block;
            color: #666;
            font-size: 15px;
        }

        .basket-switch-right strong {
            font-size: 36px;
            color: #0b8b52;
            font-weight: 700;
        }*/

.replaceall {
	width: 220px;
	height: 50px;
	font-size: 18px;
	border: 2px solid #d5007f;
}
.switchAll {
	border: 2px solid #d5007f;
}
.basket-switch-save {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	border: 2px solid #d5007f;
	border-radius: 10px;
	background: #fff;
	padding: 22px 26px;
	margin-bottom: 25px;
	position: relative;
}
/* .basket-switch-left {
        flex: 1;
    }*/

.switch-banner-title {
	display: inline-block;
	margin: 0;
	padding: 6px 14px;
	background: #d5007f;
	color: #fff;
	font-size: 30px;
	font-weight: 700;
	border-radius: 4px;
}
/*.basket-switch-left p {
        margin: 18px 0 0;
        font-size: 16px;
        color: #666;
        line-height: 1.5;
    }*/

.basket-switch-right {
	text-align: right;
	margin-left: 30px;
}
.basket-switch-right span {
	display: block;
	font-size: 18px;
	color: #333;
}
.basket-switch-right strong {
	display: block;
	font-size: 36px;
	color: #11854b;
	font-weight: 700;
}
.basket-switch-btn {
	position: absolute;
	left: 26px;
	bottom: 22px;
}
.replaceall {
	min-width: 190px;
	height: 44px;
	border-radius: 6px !important;
	font-size: 16px;
	font-weight: 600;
	color: #d5007f;
}
.switchsave {
	background: #d5007f;
	color: white;
	padding: 10px;
	height: 60px;
	margin-right: 10px;
}
.switchsave:hover {
	background: #d5007f;
	color: white;
	padding: 10px;
	height: 60px;
	margin-right: 10px;
}
.replaceall:hover {
	min-width: 190px;
	height: 44px;
	border-radius: 6px !important;
	font-size: 16px;
	font-weight: 600;
	color: #d5007f;
}
.you-may-need {
	margin-top: 25px;
	border: 1px solid #d9d9d9;
	border-radius: 6px;
	overflow: hidden;
	background: #fff;
}
.you-may-need-header {
	background: #0d7397;
	color: #fff;
	padding: 14px 18px;
	font-size: 20px;
	font-weight: 600;
}
.you-may-need-wrapper {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 20px;
}
.need-arrow {
	flex: 0 0 auto;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	border: 1px solid #d9d9d9;
	background: #fff;
	color: #0d7397;
	font-size: 14px;
	cursor: pointer;
}
.need-arrow:disabled {
	color: #ccc;
	cursor: default;
}
.you-may-need-products {
	flex: 1;
	overflow: hidden;
}
.you-may-need-track {
	display: flex;
	gap: 20px;
	transition: transform 0.3s ease;
}
.need-product {
	flex: 0 0 calc((100% - 40px) / 3);
	max-width: calc((100% - 40px) / 3);
	text-align: center;
}
.need-product img {
	width: 250px;
	height: 100px;
	object-fit: contain;
	margin-bottom: 12px;
}
.need-title {
	display: block;
	color: #333;
	font-size: 13px;
	line-height: 18px;
	min-height: 35px;
	text-decoration: none;
	font-weight: 600;
}
.need-title:hover {
	color: #0099cc;
}
.need-part {
	font-size: 12px;
	color: #777;
	margin: 6px 0;
}
.need-price {
	font-size: 18px;
	color: #0099cc;
	font-weight: 700;
	margin: 12px 0;
}
.need-price small {
	display: block;
	font-size: 12px;
	color: #666;
	font-weight: 400;
}
.need-product .btn {
	width: 80%;
	border-radius: 4px;
	font-size: 14px;
	font-weight: 600;
	padding: 10px 10px;
}
.basket-sidebar-info {
	margin-top: 20px;
}
.sidebar-card {
	background: #fff;
	border: 1px solid #e6e6e6;
	border-radius: 8px;
	margin-bottom: 12px;
	overflow: hidden;
}
.sidebar-card.banner {
	border: none;
	border-radius: 8px;
}
.sidebar-card.banner .sidebar-banner-img {
	display: block;
	width: 100%;
	height: auto;
	border-radius: 8px;
}
.card-header {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 18px;
	font-size: 22px;
	font-weight: 700;
	color: #222;
}
.card-header i {
	width: 28px;
	text-align: center;
	font-size: 24px;
	color: #444;
}
.card-body {
	padding: 0 18px 16px;
	font-size: 14px;
	line-height: 1.6;
	color: #555;
}
.card-footer {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 14px 18px;
	border-top: 1px solid #efefef;
	font-weight: 600;
}
.card-footer a {
	color: #111;
	text-decoration: none;
}
.card-footer i {
	font-size: 22px;
	color: #444;
}
.payment-card .payment-icons {
	display: flex;
	padding: 20px;
	flex-wrap: wrap;
}
.payment-card img {
	height: 50px;
	width: auto;
}
.card-header span {
	font-size: 15px;
	font-weight: 600;
}
.card-toggle {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 15px 18px;
	cursor: pointer;
	border-top: 1px solid #eee;
	font-weight: 600;
}
.card-toggle i {
 transition: .3s;
}
.card-content {
	display: none;
	padding: 0 18px 18px;
	color: #666;
	font-size: 13px;
	line-height: 1.7;
}
.sidebar-card.active .card-content {
	display: block;
}
.sidebar-card.active .card-toggle i {
	transform: rotate(180deg);
}
.atb-add:hover {
	color: #fff !important;
	background-color: #5cb85c !important;
	border-color: #4cae4c !important;
}
/* Mobile: one card per "page" instead of three */
@media (max-width: 767px) {
 .need-product {
 flex: 0 0 100%;
 max-width: 100%;
}
}
#basketSummary .row.dv-basket-card {
	margin-right: 0;
	margin-left: 0;
}
.switch-heading {
	font-size: 14px;
	top: -32px;
	color: #D5007F;
	left: -133px;
}
.basket-price-box strong {
	font-size: 17px;
	color: #0099CC;
	font-weight: 600
}
.basket-price-box span {
	font-size: 12px;
	color: #009FD1;
	font-weight: 500
}
.switch-save-card > .row {
	display: flex
}
.switch-save-card > .row > .text-right {
	margin-left: auto;
	padding-right: 0 !important
}
.basket-switch-save {
	margin-right: 20px;
}
.basket-remove {
	color: #0099ccab !important;
}
.basket-remove:hover {
	color: #09c !important;
}
.replaceall {
	background: transparent;
	border-color: #D5007F !important;
	border-width: 2px !important;
}
.basket-switch-save p {
	font-weight: 500;
	color: #000
}
.price-row.save-saving > span, .price-row.save-saving > strong {
	color: #D5007F;
}
.switch-save-card .btn-success {
	background-color: transparent !important;
	border-color: #D5008B !important;
	color: #D5008B !important;
}
.checkout1 {
	background: #94c347 !important;
}
.price-row.ex-vat1 > strong {
	color: #0099cc;
	font-size: 14px;
	font-weight: 600;
}
 @media (max-width:991px) {
 body:has(#vbBasketDetails), html:has(#vbBasketDetails) {
 overflow-x: hidden;
}
 .switch-save-card {
 margin-bottom: 15px;
}
 .basket-switch-save {
 flex-wrap: wrap
}
 div:has( > div#vbBasketDetails) {
 margin: 0 !important;
 padding: 8px !important;
}
 div:has( > div#vbBasketDetails) > div > div {
 margin: 0 !important;
 padding: 0 !important;
}
 div#basketSummary > div {
 margin-right: 0 !important;
 padding: 15px !important;
}
 .replaceall {
 min-width: 100%;
}
 .basket-switch-save > img {
 margin-right: 12px;
}
 .basket-switch-save > div[style="font-weight: bold;"] {
 width: calc(100% - 110px)
}
 #basketSummary .basket-card {
 padding: 0 !important;
 margin: 0 !important;
}
 #basketSummary .basket-card  .dv-basket-card   {
 padding: 0 !important;
 margin: 0 !important;
}
 #basketSummary .basket-card .dv-basket-card {
 display: flex;
 flex-wrap: wrap;
}
 #basketSummary .basket-card .dv-basket-card > div:first-child {
 margin: 0px 0px 0px 0px !important;
 padding: 0px !important;
 max-width: 70px;
}
 #basketSummary .basket-card .dv-basket-card > div:nth-child(2) {
 margin: 0px 10px 0px 0px !important;
 padding: 0px !important;
 width: calc(100% - 110px)
}
 #basketSummary .basket-card .dv-basket-card > div:nth-child(3) {
 width: 100%;
}
 #basketSummary .basket-card .dv-basket-card > div:nth-child(3) .basket-card-actions {
 display: flex
}
 #basketSummary .basket-card .dv-basket-card > div:nth-child(3) {
 position: initial;
}
 #basketSummary .basket-card .dv-basket-card {
 position: relative;
}
 #basketSummary .basket-card .dv-basket-card {
 padding-top: 5px !important;
 padding-bottom: 15px !important;
}
 #basketSummary .basket-card .dv-basket-card .basket-remove-container {
 position: absolute;
 bottom: 4px;
 right: 8px;
 margin: 0px;
 padding: 0px;
}
 #basketSummary .qty-label {
 display: none;
}
 #basketSummary .basket-card-actions {
 justify-content: center;
 align-items: center;
 gap: 15px
}
 #basketSummary .basket-card-actions .basket-price-box {
 order: 2;
}
 #basketSummary .basket-qty-wrapper {
 margin-top: 0px;
}
 .switch-save-card {
 display: flex;
 flex-wrap: wrap;
 position: relative;
}
 .switch-save-card > div:nth-child(1) {
 margin: 0 10px 0 0 !important;
 padding: 0px !important;
 max-width: 70px
}
 .switch-save-card > div:nth-child(2) {
 width: calc(100% - 80px);
 flex-wrap: wrap;
}
 .switch-save-card > div:nth-child(2) > div:last-child {
 margin-left: initial;
 text-align: left
}
 .switch-heading {
 left: -87px;
}
 .switch-save-card > div:nth-child(2) > div {
 margin: 0px 0px 0px 0px;
 padding: 0 0 0 15px;
}
 #vbBasketDetails > div.dv-basket-card {
 padding: 12px !important
}
 .dv-basket-card {
 border: none;
}
 #basketSummary .basket-card {
 padding: 12px 12px 2px 12px !important;
}

    /* Below 992px, .col-md-8 (product list) and .col-md-4 (this Summary block, wrapped in
       .main-basket-summary) both go full-width and stack - the Summary block landed directly
       under the last product card with no gap at all ("container too close to the summary").
       margin-top only, scoped to .main-basket-summary (not the parent column, which would also
       affect the >=992px side-by-side layout), so this only applies once the two columns have
       actually stacked. */
    .main-basket-summary {
 margin-top: 20px;
}
}
.dv-basket-card {
	border: none;
}
#basketSummary .basket-card {
	border: 1px solid #DCDCDC;
	margin-bottom: 20px !important;
	padding: 12px 12px 12px 12px !important;
	border-radius: 8px;
	background: #fff;
}
 @media (max-width:1199px) {
 body, html {
 overflow-x: hidden
}
 section#utility-bar {
 display: block !important;
}
 .mobileBasketMessage, .mobileBasketBackdrop, .g-bc-secondary, .basketMessage, .printerMessage, .tab-open.g-flex-allcenter[data-toggle="offcanvas-close"] {
 display: none !important
}
 .navbar-inverse .small-screen-links a {
 outline: none;
}
}
/* =========================================
   PROMO CODE - byte-for-byte copy of Views/Shared/MiniBasket.cshtml's
   collapsible "Promotion Code" widget rules (that file has no CSS vars
   defined at these exact property names, so this reproduces its
   var(--green)/var(--border) as the same #00a651/#e5e5e5 hex values).
   Do not "improve" these values without also updating MiniBasket.cshtml -
   the whole point is the two stay pixel-identical.
   ========================================= */

.promo {
	margin-bottom: 12px;
}
.promo summary {
	font-size: 13px;
	color: #000;
	cursor: pointer;
	list-style: none;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 4px 0;
}
 .promo summary::-webkit-details-marker {
 display: none;
}
 .promo summary::after {
 content: "▾";
 transition: transform .2s;
 font-size: 20px;
}
 .promo[open] summary::after {
 transform: rotate(180deg);
}
.promo-form {
	display: flex;
	gap: 8px;
	margin-top: 8px;
}
.promo-form input {
	flex: 1;
	border: 1px solid #e5e5e5;
	border-radius: 4px;
	padding: 8px 10px;
	font-size: 13px;
}
.promo-form button {
	background: #00a651;
	color: #fff;
	border: none;
	border-radius: 4px;
	padding: 8px 16px;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
}
.promo-applied {
	color: black;
}
/* Apply/remove feedback - scoped to the promo widget only, since
           .error-message/#error-message is a sitewide shared convention
           (see Scripts/site.js) reused elsewhere for unrelated messages.
           Same margin-top/color as mini-basket's #minibasket-voucher-code-error. */
.promo .error-message {
	margin-top: 10px !important;
	color: red !important;
}
/* =========================================
   QTY UPSELL - "increase qty in your basket, save an extra X%" offer for
   compatible/own-brand cartridges (CompatibleUpsellRates config). Per the
   "Basket Switch & Save / Add Ons" design spec (Promotional Lozenge), this
   is a small pill/badge sitting directly under the qty stepper on the
   product's own card - NOT a separate promo card like Switch & Save.
   Same brand pink used throughout the basket, no green. */

.qty-upsell-pill {
	display: inline-block;
	margin-top: 10px;
	background: #fff;
	border: 1px solid #d5007f;
	color: #d5007f;
	font-weight: 700;
	font-size: 12px;
	padding: 6px 14px;
	border-radius: 999px;
	cursor: pointer;
	white-space: nowrap;
}
.qty-upsell-pill:hover {
	background: #fdeaf3;
}
.mobile-checkout-btn {
	display: none !important;
}

/* Visible on mobile */
@media (max-width: 767px) {
 .mobile-checkout-btn {
 display: block !important;
 width: 100%;
 float: none !important;
}
}
 body:has(#vbBasketDetails) .container.body-content > .row.g-m-t-20 {
 margin-top: 0px !important
}
 @media (max-width: 767px) {
 .mobile-checkout-btn {
 margin-top: 0px !important;
}
}
.basket-switch-save {
	border: none;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}
#basketSummary .row.dv-basket-card > div {
	text-align: left
}
#basketSummary .row.dv-basket-card {
	text-align: center
}
#basketSummary .row.dv-basket-card > button.qty-upsell-pill {
	margin-top: 15px
}
/*New Style 21-08-26*/
#you-may-also-need .ymn-close, .you-may-need .ymn-close {
	border: 1px solid #fff !important;
	border-radius: 100%;
	width: 30px;
	height: 30px;
	line-height: 20px;
	color: #fff !important
}
#popup, .fa-times:hover {
	color: #fff !important
}
#you-may-also-need .need-title, .you-may-need .need-title {
	font-size: 12px;
	line-height: 16px;
}
#you-may-also-need .need-product, .you-may-need .need-product {
	text-align: left;
}
#you-may-also-need .need-product > .need-title + .need-title, .you-may-need .need-product > .need-title + .need-title {
	font-weight: 500;
	min-height: fit-content;
}
.you-may-need-header, .ymn-header {
	background: #364916 !important;
}
#you-may-also-need .need-price, .you-may-need .need-price {
	font-size: 12px !important;
	color: #364916 !important;
}
#you-may-also-need {
	border: none !important;
}
#you-may-also-need .ymn-proceed {
	display: inline-block !important;
	max-width: 200px;
	padding: 11px !important;
	border-radius:25px !important;
}
#you-may-also-need[data-context="addtocart"] {
	text-align: center !important
}
#you-may-also-need[data-context="addtocart"] .ymn-proceed {
	display: inline-block !important;
}
.promo .error-message {
	color: #ffffff !important;
	background: #ff0000db !important;
	padding-bottom: 0px;
}
.checkout1 {
	border: none !important;
	border-radius: 6px !important;
	font-weight: 600 !important;
}
h4.basket-product-title a {
	color: #364916 !important
}
.price-row.ex-vat1 > strong, .basket-price-box span, .fa-plus:before, .fa-minus:before, .basket-remove, .switch-product-name, .price-row.ex-vat > strong, .price-row.ex-vat > span, .price-row.inc-vat > strong, .price-row.inc-vat > span {
	color: #364916 !important;
}
.basket-product-title, .switch-product-name {
	font-size: 14px !important;
	line-height: 18px;
	margin-bottom: 0
}
.basket-product-code strong {
	font-weight: 100 !important;
	font-size: 12px !important
}
div#AmazonPayButton {
	width: 100% !important;
	padding: 27px 10px !important;
	align-items: center
}
.card-toggle a.toggle-link {
	color: #000000
}
.promo summary {
	position: relative;
}
 .promo summary::after {
 content: "";
 position: absolute;
 top: 9px;
 right: 0;
 width: 8px;
 height: 8px;
 border-right: 2px solid currentColor;
 border-bottom: 2px solid currentColor;
 transform: rotate(45deg);
}
 .promo[open] summary::after {
 transform: rotate(225deg);
}
.sidebar-card {
	border: none !important;
	border-bottom: 1px solid #000 !important;
	border-radius: 0 !important;
	padding-bottom: 8px !important;
}
.sidebar-card > div {
	padding-left: 0 !important;
	padding-right: 0 !important;
}
.sidebar-card.banner {
	border-bottom: 0px !important;
}
.card-header span {
	font-size: 18px;
	font-weight: 600;
}
.sidebar-card > div {
	font-size: 12px !important;
	font-weight: 500 !important;
	color: #000 !important;
}
.sidebar-card > div strong {
	font-weight: 500 !important;
}
.card-toggle a.toggle-link {
	font-size: 12px !important;
	font-weight: 600 !important;
}
.card-toggle {
	border-top: none;
}
.card-body {
	padding-bottom: 0 !important
}
.sidebar-card:last-child {
	border-bottom: 0px !important;
}
.sidebar-card .card-toggle i {
	font-size: 16px !important
}
.payment-card .payment-icons {
	padding: 0 !important;
	text-align: center !important;
	justify-content: center !important;
}
 section:has(div#vbBasketDetails) {
 background: #fff !important;
}
#basketSummary .basket-card {
	border: 1px solid #8e8e8e !important;
}
.basket-qty {
	border: 1px solid #696969 !important;
}
.qty-btn {
	background: transparent !important
}
.qty-minus {
	border-right: 1px solid #696969 !important;
}
.qty-plus {
	border-left: 1px solid #696969 !important;
}
.qty-input {
	color: #364916 !important;
	font-size: 16px !important;
}
.basket-switch-save {
	background: #fcf7fe;
	justify-content: left;
	flex-wrap: nowrap;
	align-items: center
}
.basket-switch-save > div {
	font-size: 18px !important;
	margin-right: 15px;
}
.basket-switch-save > div > p {
	font-size: 14px !important;
	margin-bottom: 0px;
}
.replaceall {
	min-width: 140px;
	max-width: 140px;
}
.basket-switch-save > button {
	margin-left: auto
}
.basket-switch-save > img {
	height: auto !important;
	max-width: 150px;
	margin-right: 15px;
}
.replaceall {
	font-weight: 500 !important;
	font-size: 14px !important;
}
.basket-switch-save {
	margin-right: 0 !important;
}
 @media (max-width: 991px) {
 #you-may-also-need {
 width: 92% !important;
 max-width: 92% !important;
 border-radius: 20px !important;
}
 #you-may-also-need .need-product {
 text-align: center !important;
}
 div#basketSummary > div {
 padding: 0 !important;
}
 .basket-switch-save {
 display: block;
 overflow: hidden;
}
 div#basketSummary > div {
 padding: 10px 10px 14px 10px !important
}
 .basket-switch-save > img {
 float: left;
 margin-top: 6px;
 height: 110px !important
}
 .basket-switch-save > div > p {
 margin-bottom: 12px;
}
 .basket-switch-save button {
 padding: 4px 0px !important;
 height: 38px !important;
}
 .basket-switch-save > div[style="font-weight: bold;"] {
 width: calc(100% - 0px) !important;
}
 .basket-switch-save > div {
 margin-right: 0px;
}
}
/*New basket 21-08-26*/

/*New basket 20-08-26*/
.basket-wrapper {
	width: 100%;
	max-width: 800px;
	margin: 0 auto;
}
.basket-items {
	background: #fff;
	border: 1px solid #a5a5a5;
	border-radius: 10px;
	padding: 15px;
	margin-bottom: 21px;
}
.basket-items-normal {
	display: flex;
	align-items: flex-start;
}
.basket-items-normal .item-img {
	width: 120px;
	margin-right: 20px;
}
.basket-items-normal .item-img a {
	display: flex;
}
.basket-items-normal .item-img img {
	width: 100%;
}
.item-title-area h2 {
	margin: 0;
	padding: 0px;
}
.item-title-area h2 a {
	color:#364916;
	font-weight: 700;
	font-size: 14px;
	line-height: 1.32;
	margin: 0 0 4px 0;
	text-decoration: none;
	display: block;
}
.product-code {
	display: block;
	margin-bottom: 4px;
	font-size: 12px;
	font-weight: 500;
	color: #000000;
}
span.stock {
	display: block;
	margin-top: 14px;
	margin-bottom: 4px;
	font-size: 12px;
	font-weight: 500;
	color: #000000;
}
span.stock {
	position: relative;
	padding-left: 22px;
	font-size: 12px;
	line-height: 16px
}
span.stock:before {
	content: "";
	display: block;
	width: 13px;
	height: 13px;
	position: absolute;
	border-radius: 100%;
	left: 0px;
	top: 1px
}
 span.stock.stock-in::before {
 background: #2fbf71;
 color: #2fbf71;
}
 span.stock.stock-out::before {
 background: #ff3131;
 color: #ff3131;
}
span.stock strong {
	font-style: italic;
}
.item-title-area {
	width: calc(100% - 240px)
}
.p-price-q-area {
	width: 150px;
	text-align: right;
	margin-left: 20px;
}
.p-without-vat {
	color: #364916;
	font-weight: 700;
	font-size: 14px;
	line-height: 1.32;
	margin: 0 0 4px 0;
	text-decoration: none;
	display: block;
}
.p-with-vat {
	color: #364916;
	font-weight: 500;
	font-size: 14px;
	line-height: 1.32;
	margin: 0 0 4px 0;
	text-decoration: none;
	display: block;
}
.basket-items button {
	background: transparent;
	border: none;
}
.trash-like {
	display: flex;
	justify-content: flex-end;
	gap: 14px;
	align-items: center;
	margin-top: 20px;
}
.trash-like button {
	margin: 0px;
	padding: 0px;
	cursor: pointer
}
button.like-btn .like-b {
	display: none
}
button.like-btn:hover .like-b {
	display: block
}
button.like-btn:hover .unlike-b {
	display: none
}
.qnt-w {
	margin-top: 23px;
	display: block;
}
#cbi-cart, #cbi-cart * {
	float: none !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	box-sizing: border-box !important;
}
.cbi-g-qty {
	grid-area: qty;
	justify-self: end;
}
.cbi-qty {
	display: flex;
	align-items: stretch;
	border: 1px solid var(--border);
	border-radius: 999px;
	overflow: hidden;
	width: 108px;
	height: 34px;
}
 #cbi-cart :not(.cbi-qty) {
 overflow: visible !important;
}
#cbi-cart, #cbi-cart * {
	float: none !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	box-sizing: border-box !important;
}
.cbi-qty input {
	flex: 1;
	width: 100%;
	border: none;
	border-left: 1px solid var(--border);
	border-right: 1px solid var(--border);
	text-align: center;
	font-size: 14px;
	font-weight: 700;
	color: #364916;
	-moz-appearance: textfield;
}
.cbi-qty button {
	background: #fff;
	border: none;
	width: 30px;
	font-size: 16px;
	font-weight: 600;
	color: #364916;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	user-select: none;
}
.switch-save {
	margin-bottom: 0px;
	margin-top: 20px;
	border: 3px solid #d41f7e;
	position: relative;
}
.cbi-switch-save-label {
	position: absolute;
	top: -15px;
	left: 14px;
	background: #fff;
	color: var(--pink);
	font-weight: 700;
	font-size: 18px;
	padding: 0 6px;
}
.cbi-save-amount {
	color: var(--pink);
	font-weight: 700;
	font-size: 14px;
	margin: 0px 0 10px;
}
.mobile {
	display: none !important;
}
.cbi-switch-btn {
	display: block;
	width: 100%;
	border: 1.5px solid var(--pink) !important;
	color: var(--pink);
	background: #fff;
	font-weight: 500;
	font-size: 14px;
	padding: 9px 18px;
	border-radius: 6px;
	cursor: pointer;
	text-align: center;
}
 @media (max-width:768px) {
 .basket-items-normal {
 flex-wrap: wrap;
}
 .item-title-area {
 width: calc(100% - 70px);
}
 .p-price-q-area {
 width: calc(100% - 70px);
 text-align: left;
 margin-left: auto;
 display: flex;
 gap: 20px;
}
 .p-qnt {
 margin-left: auto;
 position: relative;
 top: -0px;
}
 .trash-like {
 margin-top: 0;
}
 .desktop {
 display: none !important;
}
 .basket-items-normal .item-img {
 width: 60px;
 margin-right: 10px;
}
 .mobile {
 display: block !important;
}
 span.stock {
 margin-top: 3px;
}
 .switch-save .p-price-q-area {
 display: block;
 text-align: left;
}
 span.stock {
 margin-left: 70px;
}
 .cbi-switch-btn {
 max-width: 120px;
}
}
/*New Style 21-08-26*/
#you-may-also-need .ymn-close, .you-may-need .ymn-close {
	border: 1px solid #fff !important;
	border-radius: 100%;
	width: 30px;
	height: 30px;
	line-height: 20px;
	color: #fff !important
}
#popup, .fa-times:hover {
	color: #fff !important
}
#you-may-also-need .need-title, .you-may-need .need-title {
	font-size: 12px;
	line-height: 16px;
}
#you-may-also-need .need-product, .you-may-need .need-product {
	text-align: left;
}
#you-may-also-need .need-product > .need-title + .need-title, .you-may-need .need-product > .need-title + .need-title {
	font-weight: 500;
	min-height: fit-content;
}
.you-may-need-header, .ymn-header {
	background: #364916 !important;
}
#you-may-also-need .need-price, .you-may-need .need-price {
	font-size: 12px !important;
	color: #364916 !important;
}
#you-may-also-need {
	border: none !important;
}
#you-may-also-need .ymn-proceed {
	display: inline-block !important;
	max-width: 200px;
	padding: 11px !important;
	border-radius: 6px !important;
}
#you-may-also-need[data-context="addtocart"] {
	text-align: center !important
}
#you-may-also-need[data-context="addtocart"] .ymn-proceed {
	display: inline-block !important;
}
.promo .error-message {
	color: #ffffff !important;
	background: #ff0000db !important;
	padding-bottom: 0px;
}
.checkout1 {
	border: none !important;
	border-radius: 6px !important;
	font-weight: 600 !important;
}
h4.basket-product-title a {
	color: #364916 !important
}
.price-row.ex-vat1 > strong, .basket-price-box span, .fa-plus:before, .fa-minus:before, .basket-remove, .switch-product-name, .price-row.ex-vat > strong, .price-row.ex-vat > span, .price-row.inc-vat > strong, .price-row.inc-vat > span {
	color: #364916 !important;
}
.basket-product-title, .switch-product-name {
	font-size: 14px !important;
	line-height: 18px;
	margin-bottom: 0
}
.basket-product-code strong {
	font-weight: 100 !important;
	font-size: 12px !important
}
div#AmazonPayButton {
	width: 100% !important;
	padding: 27px 10px !important;
	align-items: center
}
.card-toggle a.toggle-link {
	color: #000000
}
.promo summary {
	position: relative;
}
 .promo summary::after {
 content: "";
 position: absolute;
 top: 9px;
 right: 0;
 width: 8px;
 height: 8px;
 border-right: 2px solid currentColor;
 border-bottom: 2px solid currentColor;
 transform: rotate(45deg);
}
 .promo[open] summary::after {
 transform: rotate(225deg);
}
.sidebar-card {
	border: none !important;
	border-bottom: 1px solid #000 !important;
	border-radius: 0 !important;
	padding-bottom: 8px !important;
}
.sidebar-card > div {
	padding-left: 0 !important;
	padding-right: 0 !important;
}
.sidebar-card.banner {
	border-bottom: 0px !important;
}
.card-header span {
	font-size: 18px;
	font-weight: 600;
}
.sidebar-card > div {
	font-size: 12px !important;
	font-weight: 500 !important;
	color: #000 !important;
}
.sidebar-card > div strong {
	font-weight: 500 !important;
}
.card-toggle a.toggle-link {
	font-size: 12px !important;
	font-weight: 600 !important;
}
.card-toggle {
	border-top: none;
}
.card-body {
	padding-bottom: 0 !important
}
.sidebar-card:last-child {
	border-bottom: 0px !important;
}
.sidebar-card .card-toggle i {
	font-size: 16px !important
}
.payment-card .payment-icons {
	padding: 0 !important;
	text-align: center !important;
	justify-content: center !important;
}
 section:has(div#vbBasketDetails) {
 background: #fff !important;
}
#basketSummary .basket-card {
	border: 1px solid #c8c8c8 !important;
}
.basket-qty {
	border: 1px solid #696969 !important;
}
.qty-btn {
	background: transparent !important
}
.qty-minus {
	border-right: 1px solid #696969 !important;
}
.qty-plus {
	border-left: 1px solid #696969 !important;
}
.qty-input {
	color: #364916 !important;
	font-size: 16px !important;
}
.basket-switch-save {
	background: #fcf7fe;
	justify-content: left;
	flex-wrap: nowrap;
	align-items: center
}
.basket-switch-save > div {
	font-size: 18px !important;
	margin-right: 15px;
}
.basket-switch-save > div > p {
	font-size: 14px !important;
	margin-bottom: 0px;
}
.replaceall {
	min-width: 140px;
	max-width: 140px;
}
.basket-switch-save > button {
	margin-left: auto
}
.basket-switch-save > img {
	height: auto !important;
	max-width: 150px;
	margin-right: 15px;
}
.replaceall {
	font-weight: 500 !important;
	font-size: 14px !important;
}
.basket-switch-save {
	margin-right: 0 !important;
}

/*New 21-08-26-V2*/
.switch-save {margin: 10px 0 0px !important;}
.cbi-save-amount {color: var(--pink) !important;}
.replaceall:hover { max-width:140px!important; min-width:140px!important;}
.cbi-qty button {padding-bottom:4px;}
.trash-like button {display: flex;}
.col-md-4.dv-basket-card > div { margin-bottom:20px; padding:15px 14px 12px 14px !important; border:1px solid #c8c8c8 !important; border-radius:8px !important; }
.summary-basket-card1 h4 { margin-top:0px !important}
.cbi-qty { border:1px solid #c8c8c8!important;}
.qty-upsell-pill { border:1px solid #ff3131 !important; font-size:14px; color:#ff3131 !important; padding:7px 20px;}
.summary-basket-card1 .main-basket-summary .basket-summary { font-size:14px !important; font-weight:700; color:#94c347; display:flex; gap:15px; align-items:center;}
.summary-basket-card1 .main-basket-summary .basket-summary span:last-child {text-align:left}
.col-md-4.dv-basket-card > div.summary-basket-card1 { border:none !important; padding:10px 0px 0px 0px !important }
.summary-basket-card2 > div:first-child { margin-top:0px !important;}
.summary-basket-card2 > div { margin-bottom:25px;}
.summary-basket-card2 .pull-left, .summary-basket-card2 .pull-left strong { font-size:14px !important; font-weight:500!important;}
.summary-basket-card2 hr {border-color: #39393a!important;}
.summary-basket-card2 hr.g-m-tb-10 + div .pull-left, .summary-basket-card2 hr.g-m-tb-10 + div .pull-left strong,
.summary-basket-card2 hr.g-m-tb-10 + div .pull-right, .summary-basket-card2 hr.g-m-tb-10 + div .pull-right strong{ font-size:18px !important; font-weight:700!important; padding-right:0 !important;}
.summary-basket-card2 .pull-right, .summary-basket-card2 .pull-right strong {font-size:14px !important; font-weight:500!important; padding-right:0 !important}
.summary-basket-card2 hr.g-m-tb-10 + div { margin-bottom:10px !important}
.promo summary::after {content: "" !important;}
.promo[open] summary::after {transform: rotate(224deg) !important;}
button.minibasket-voucher-remove i.fa-times:before {content: "x" !important;font-family: sans-serif;color: #f44336 !important;}
@media (min-width:991px) {
.checkout1 {margin: 0px !important;}
}
.summary-basket-card3 .sidebar-card.banner { padding:0 !important; margin:0 !important;}
.col-md-4.dv-basket-card > div.summary-basket-card3 {padding:0 !important; border:none !important}
.summary-basket-card4 > div { margin-top:0 !important}
.summary-basket-card4 .card-header  { padding-top:5px !important}
.summary-basket-card4  .sidebar-card.tradepricing { margin-bottom:0px !important; padding-bottom:0px !important;}
.card-header {padding: 18px 18px 11px 18px !important}

.summary-basket-card5 .card-header { padding-top:5px !important;}
.summary-basket-card5 .sidebar-card.payment-card {padding:0 0 6px 0 !important; margin:0 !important;}
.summary-basket-card5  .payment-icons { display:flex;  gap:10px}
.item-title-area .voucher-applied, .item-title-area .qty-upsell-pill {margin-top: 5px !important; margin-bottom: 10px!important;}

.summary-basket-card2 hr:has(+ #voucherTotal) {display:none}
.summary-basket-card2 #voucherTotal .pull-left, .summary-basket-card2 #voucherTotal .pull-right, .summary-basket-card2 #voucherTotal .pull-left strong {font-size: 14px !important;font-weight: 500 !important; line-height:16px}
.summary-basket-card5 .card-header img { max-height:25px;}
button.remove-voucher i.fa-trash:before {content:"x" !important; font-family:sans-serif; color:#f44336 !important;}
.promo-applied .promo-applied__saving {font-weight: 500 !important;font-size: 14px !important;}
.payment-card .payment-icons {justify-content: left !important;	margin-left: 55px;}
.payment-card .payment-icons img { max-height:46px}
.basket-sidebar-info .card-body, .basket-sidebar-info .card-toggle {margin-left:55px;}
body:has(div#vbBasketDetails) section:has(.bread-crumb) { background:transparent !important;}
body:has(div#vbBasketDetails) section:has(.bread-crumb) h1 {font-size:18px !important; font-weight:700 !important; color:#39393a !important; margin-bottom:0!important}
body:has(div#vbBasketDetails) section:has(.bread-crumb) h1 + div { display:none}
body:has(div#vbBasketDetails) section:has(.comm-title-banner) { background:transparent !important;}
body:has(div#vbBasketDetails) section:has(.comm-title-banner) h1 {font-size:18px !important; font-weight:700 !important; color:#39393a !important; margin-bottom:0!important}
body:has(div#vbBasketDetails) section:has(.comm-title-banner) h1 + div { display:none}

body:has(div#vbBasketDetails) .bread-crumb { font-size:12px !important; font-weight:600 !important; color:#000 !important}
body:has(div#vbBasketDetails) .bread-crumb a {color:#0285ca !important}
body:has(div#vbBasketDetails) .bread-crumb > a + i + a {color:#000 !important}
body:has(div#vbBasketDetails) #comm-confidence{ background:#f3f3f3; max-width:100% !important;width:100% !important;}
body:has(div#vbBasketDetails) #comm-confidence > div { max-width:1140px; margin: 0 auto}
body:has(div#vbBasketDetails) .comm-title-banner { height:auto !important; margin-top:10px;}
body:has(div#vbBasketDetails) section:has(.bread-crumb)>div {max-width:1140px }
#you-may-also-need .need-title, .you-may-need .need-title {display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;text-overflow: ellipsis;line-height: 18px;}
.you-may-need-header {font-size: 18px !important;}
.summary-basket-card2 > [style="height:70px;"] {display:none;}
.summary-basket-card2 > [style="height:70px;"] {display:none;}
.summary-basket-card2 #AmazonPayButton { margin-top:5px!important;margin-bottom: 0 !important;}
div#AmazonPayButton {padding: 27px 10px 0px 10px !important;}
#paypal-button2 {margin-top:62px;margin-bottom: 0px !important;}
.summary-basket-card2 > div#paypal-button3 { display:none !important;}
.summary-basket-card2 > div#paypal-message { margin-bottom:0 !important}
.paypal-buttons.paypal-buttons-context-iframe {max-height: 40px !important;border-radius: 6px !important;overflow: hidden !important;}
.summary-basket-card2 .checkout1.pull-right { font-weight:600!important}
.cart-item__title {
	display: block;
	font-size: 13px;
	font-weight: 600;
	color: var(--text);
	margin: 0 0 2px;
	line-height: 1.3;
	text-decoration: none;
}
@media (max-width: 768px) {
.basket-items.switch-save .p-qnt  {
top: -12px !important;
}
}
/*New 21-08-26-V2*/

 @media (max-width: 991px) {
 #you-may-also-need {
 width: 92% !important;
 max-width: 92% !important;
 border-radius: 20px !important;
}
 #you-may-also-need .need-product {
 text-align: center !important;
}
 div#basketSummary > div {
 padding: 0 !important;
}
 .basket-switch-save {
 display: block;
 overflow: hidden;
}
 div#basketSummary > div {
 padding: 10px 10px 14px 10px !important
}
 .basket-switch-save > img {
 float: left;
 margin-top: 6px;
 height: 110px !important
}
 .basket-switch-save > div > p {
 margin-bottom: 12px;
}
 .basket-switch-save button {
 padding: 4px 0px !important;
 height: 38px !important;
}
 .basket-switch-save > div[style="font-weight: bold;"] {
 width: calc(100% - 0px) !important;
}
 .basket-switch-save > div {
 margin-right: 0px; 
}
}
/*Anil Updated*/


/*Mobile popup css*/
.popup-header {
	background:#364916;
	color: #fff;
	padding: 18px 20px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	position: sticky;
	top: 0;
	z-index: 2;
	border-radius: 16px 16px 0 0;
}
.popup-header h2 {
	margin: 0;
	font-size: 16px;
	font-weight: 700;
}
.close-btn {
	background:transparent;
	border: none;
	color: #fff;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	font-size: 18px;
	line-height: 1;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	border: 1px solid #fff;
}
.close-btn:hover {
	background: rgba(255, 255, 255, 0.28);
}
  .item-list {
	padding: 4px 16px 8px;
}
.item {
	display: flex;
	gap: 14px;
	align-items: flex-start;
	padding: 18px 0;
}
.item + .item {
	border-top: 1px solid #2f3030;
}
.item-thumb {
	width: 68px;
	height: 68px;
	flex-shrink: 0;
	border-radius: 6px;
	background: #f4f5f6;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
}
.item-thumb svg {
	width: 100%;
	height: 100%;
}
.item-info {
	flex: 1;
	min-width: 0;
}
body:has(div#vbBasketDetails) .popup:has(.popup-header) .item-title {
	font-size: 12px;
	font-weight: 600;
	color: #000;
	line-height: 18px;
	margin: 0 0 6px;
}
a.item-title {
	font-size: 12px;
	font-weight: 600;
	color: #000;
	line-height:18px;
	margin: 0 0 6px;
	display: block;
}
.item-price {
	font-size: 14px;
	font-weight: 700;
	color:#364916;
	margin: 0 0 10px;
}
.item-price span {
	font-weight:700;
	color: #364916;
	font-size: 12px;
}
.add-btn {
	display: inline-block;
	background:#364916;
	color: #fff;
	border: none;
	font-size: 12px;
	font-weight: 600;
	padding: 10px 16px;
	border-radius: 6px;
	cursor: pointer;
	width: 100%;
	max-width: 136px;
}
.add-btn:hover {
	background: #0c5a7a;
}
.add-btn:active {
	transform: scale(0.98);
}
.popup-footer {
  	text-align: center;
	padding: 14px 16px 22px;
	position: sticky;
	bottom: 0;
	background: #fff;
	border-top: 1px solid #2f3030;
	border-radius: 0 0 16px 16px;
}
.checkout-btn {
	width: 100%;
	background:#00a651;
	color: #fff;
	border: none;
	font-size: 12px;
	font-weight: 700;
	padding: 14px;
	border-radius: 8px;
	cursor: pointer;
}
.checkout-btn:hover {
	background: #2e9c5f;
}
.checkout-btn:active {
	transform: scale(0.98);
}




body:has(div#vbBasketDetails) .popup:has(.popup-header) {display:none; border: 1px solid #a5a5a5 !important; border-radius:8px; padding:0px !important}
body:has(div#vbBasketDetails) .popup .popup-header { border-radius:8px 8px 0 0 !important}
body:has(div#vbBasketDetails) .popup:has(.popup-header) .close-btn, body:has(div#vbBasketDetails) .popup:has(.popup-header) .popup-footer{ display:none!important}
@media(min-width:992px) {
.popup-footer {
	position: relative !important;
	border-top: none !important;
	padding:0 !important;
}
}
@media(max-width:991px) {
body:has(div#vbBasketDetails) .popup:has(.popup-header) {display:block;}
body:has(div#vbBasketDetails) .you-may-need { display:none}
}
.ymn-mobile-view { display:none}
@media(max-width:991px) {
.ymn-mobile-view { display:block}
#you-may-also-need .popup-header {border-radius: 8px 8px 0 0 !important;}
#you-may-also-need .ymn-header, #you-may-also-need .ymn-desktop-view { display:none !important}
#you-may-also-need .popup-header {padding: 13px 16px !important;}
#you-may-also-need[data-context="addtocart"] {border-radius: 8px !important;}
#you-may-also-need  .item-info { text-align:left !important;}
#you-may-also-need .ymn-add {background: #364916 !important;padding:8px 10px !important;font-size: 12px !important;max-width:120px !important;}
#you-may-also-need .popup-footer { padding-bottom:12px !important; padding-top:0px !important;}
#you-may-also-need .ymn-proceed {max-width: 100% !important;padding: 10px !important;border-radius: 6px !important;}
#you-may-also-need .ymn-proceed  { font-size:12px !important; line-height:20px}
#you-may-also-need .popup-footer { border:none !important;}
#you-may-also-need {height: 530px !important;max-height: initial !important;}
#you-may-also-need {
 position: fixed !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
 height:525px !important;
}
}
@media(max-width:991px) {
.summary-basket-card2 #AmazonPayButton {
margin-top:10px !important;
}
.basket-items.switch-save span.mobile.stock.stock-in, .basket-items.switch-save span.mobile.stock.stock-out,
.basket-items.switch-save .p-with-vat {display:none !important}
.summary-basket-card2 .checkout1.pull-right {
margin-bottom: 10px;
}
}




.mini-cart .cart-item {
	display: flex;
	gap: 10px;
	padding: 14px 0;
	border-bottom:none !important;
}
.mini-cart  .mini-cart__body > div { border-bottom:1px solid #b4b4b4 !important; margin-bottom:15px !important; padding-bottom:15px !important}

.switch-save.switch-save--all {border: 1px solid #e6007e !important;}
/*Mobile popup css*/
.modal-dialog{ color:#000 !important}


.basket-switch-save > img {display:block !important;}
.basket-switch-save > img.mobile-img { display:none !important;}
@media (max-width:991px) {
.basket-switch-save > img {display:none !important;}
.basket-switch-save > img.mobile-img { display:block !important;}
}
.need-product .btn {background:#94c347 !important; border-color:#94c347!important; border-radius: 6px !important;}
.need-product .btn:hover {background:#94c347 !important; border-color:#94c347!important; border-radius: 6px !important;}

.atb-add:hover {
background-color: #09c !important;
border-color: #09c !important;
}
.item-thumb img{ width:100% !important;}

.basket-sidebar-info .card-content {
font-size: 12px !important;
font-weight: 500 !important;
color: #000 !important;
padding:10px 0 0 0!important;
}
.sidebar-card.active .card-toggle .toggle-link { font-size:0 !important; text-indent:-999px;}
.sidebar-card.active .card-toggle .toggle-link:before{content:"Read Less";display:block;font-size:12px; font-weight:600; color:#000;width:100px; text-indent:initial;}
.dv-basket-card-portal .summary-basket-card2 {overflow:hidden !important;}

.g-butt-primary:hover, .g-butt-primary:focus {
	background-color: #74a12b !important;}

@media (max-width:991px) {
	#you-may-also-need .ymn-proceed {
		background: #94c347 !important;
	}
}
.basket-offer-banner img { width:100%}

.hdr-basket .g-butt-primary:hover, .hdr-basket .g-butt-primary:focus,
.mini-product-entry .g-butt-primary:hover, .mini-product-entry .g-butt-primary:focus,
.prd-summ-entry .g-butt-primary:hover, .prd-summ-entry .g-butt-primary:focus,
#newsletter-signup .g-butt-primary:hover, #newsletter-signup .g-butt-primary:focus,
#price-box .g-butt-primary:hover, #price-box .g-butt-primary:focus{background-color: #45c182 !important; border-color: #45c182 !important;}

/*========================================
Header css start
=========================================*/
.site-header{position:relative;	background: #f7fcfe; border-bottom:4px solid #364916;padding-top: 14px;}
.icon-btn{display:flex;flex-direction:column;align-items:center;gap:7px;
font-size:12px;color:#39393a;background:none;border:none;cursor:pointer; text-decoration:none;}
.icon-btn svg{width:22px;height:22px;stroke:#0f6fb8;fill:none;stroke-width:1.6;}
.hamburger{
background: none;
border: none;
cursor: pointer;
color: #0185ca;
flex-direction: column;
justify-content: center;
gap: 4px;
width:30px;
height: 20px;
order: 0;
padding: 0;
}
.hamburger span{display:block;height:4px;background:#364916;border-radius:2px;}

.header-top{
display:flex;
align-items:center;
flex-wrap:wrap;
gap:24px;
padding:14px 12px 8px 5px;
max-width: 1140px;
margin: 0 auto;
}
.logo{order:1;display:flex;flex-direction:column;line-height:0.9;font-weight:400;color:#8a8f93;font-size:20px;flex:0 0 auto;}
.logo img {max-height: 66px;}
.logo strong{color:#1f8fe0;font-size:30px;font-weight:800;letter-spacing:-0.5px;}




a.icon-btn.only-for-mobile {display:none;}
.header-actions > a[data-toggle="modal"] {position:relative; top:-4px;}
@media (max-width:900px){
a.icon-btn.only-for-mobile {display:block;}
a.icon-btn.only-for-mobile > span {display:none;}
a.icon-btn.only-for-mobile { margin-left:5px}
.header-actions > a {display:none;}
.header-actions > a[data-toggle="modal"] {display:block}
}


.search-bar{order:2;flex:1 1 auto;display:flex;max-width:520px; flex: 1 1 100%;
margin: 0 auto; 	position: relative;
	z-index: 999999;}
.search-bar input{
flex:1;border:2px solid #364916;border-right:none;
border-radius:10px 0 0 10px !important;padding:13px 14px;font-size:11px;outline:none; color:#838586;
}
.search-bar input:focus{border-radius: 10px 0 0 10px !important;}
.search-bar button{
background:#364916;color:#fff;border:none;border-radius:0 10px 10px 0;
padding:10px 22px;font-size:14px;cursor:pointer;
}

.header-actions{	
order: 3;
display: flex;
gap:15px;
flex: 0 0 auto;
}
.header-actions .icon-wrap{position:relative;}
.basket-count{
position:absolute;top: -12px;
	left: -3px;background:#4caf50;color:#fff;
font-size:11px;width:18px;height:18px;border-radius:50%;
display:flex;align-items:center;justify-content:center;font-weight:700;
}

/* ==================================================================
 PRIMARY NAV — desktop mega-menu. Kept as its own implementation
 (off-canvas panels below are the separate mobile nav).
 ================================================================== */
.main-nav{
padding:7px 7px 0px;
position:relative;
}
.main-nav ul{list-style:none;margin:0;padding:0;display:flex;gap:36px; max-width: 1140px;
margin: 0 auto;}
.main-nav > ul > li > a{
font-weight:700;	color: #39393a;
		font-size: 16px;padding:4px 0 15px 0;display:inline-block; text-decoration:none;
}
.main-nav li.open > a,
.main-nav a:hover{color:#5e9700;}

/* ==================================================================
 PROMO BAR — one shared markup. Desktop shows every item in a row;
 the mobile media query turns the same items into a fade slider.
 ================================================================== */
.promo-bar{
background:#f3f3f3;
display:flex;justify-content:center;gap:48px;
padding:12px 20px;font-size:13px;color:#4a4f54;
flex-wrap:wrap;
}
.promo-item{display:flex;align-items:center;gap:8px; color:#39393a; font-size:12px; font-weight:500;}
.promo-item a{color:#39393a; font-size:12px; font-weight:500; text-decoration:none;}
.promo-bar svg{width:20px;height:20px;stroke:#4a4f54;fill:none;stroke-width:1.5;flex:0 0 auto;}

/* Mega menu (desktop) */
.mega-menu{
display:none;
position:absolute;left:0;top:100%;
background:#fff;border-top:4px solid #364916;
box-shadow:0 12px 24px rgba(0,0,0,0.15);
padding:26px 36px;z-index:50;
min-width:calc(100% - 0px);
border-bottom: 4px solid #616363;
}
.main-nav li.open .mega-menu{display:flex;gap:56px;}
.main-nav li.open .mega-menu > div{display:flex;gap:100px; max-width:1140px; margin:0 auto; width:calc(100% - 72px);}
.mega-col h4{
color:#94c347;font-size:14px;margin:0 0 14px;
}
.mega-col h4 a {
	color: #94c347;
	font-size: 14px;
	margin: 0 0 14px;
	font-weight:600;
}
.mega-col ul{display:flex;flex-direction:column;gap:20px;list-style:none;padding:0;margin:0;}
.mega-col.brands-grid{display:flex;flex-direction:column;}
.mega-col.brands-grid .grid{
display:grid;grid-template-columns:repeat(3, minmax(110px,1fr));gap:20px 28px;
}
.mega-col a{font-size:16px;color:#39393a;font-weight:400;text-decoration:none;}
.mega-col a:hover{color:#94c347;text-decoration:none;}
.brand-logos{
margin-bottom:4px;
display: grid;
grid-template-columns: repeat(2, 1fr);
gap: 30px;
}
.brand-logos span{
border:1px solid #e2e6e9;border-radius:4px;padding:10px 14px;font-weight:700;font-size:13px;
display:flex;align-items:center;justify-content:center;min-width:88px;color:#2b2f33;
}

form.search-bar .input-group {border:none; display:flex; width:100%}
form.search-bar .input-group input{background:#fff !important}
.icon-btn span {color: #39393A; font-weight:500;font-size: 12px;}
div#offcanvas .panel {background:transparent !important;}

/* My Account — signed-in header slot + dropdown */
.acct { position: relative; display: flex; flex-direction: column; align-items: center; }
.acct button span img{height:36px !important;width: auto !important;}
.acct__btn { display: flex; flex-direction: column; align-items: center; gap: 4px; background: none; border: 0; padding: 0; cursor: pointer; font: inherit; }
.acct__mark { position: relative; width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; }
.acct__label { font-size: 12px; font-weight: 500; color: #3b4349; white-space: nowrap; }
.acct__menu {
  position: absolute; top: 56px; right: -8px; z-index: 50; min-width: 172px;
  background: #fff; border: 1px solid #d5dade; border-radius:8px;
  box-shadow: 0 6px 16px rgba(20, 28, 36, .14); text-align: left; overflow:hidden;
}
.acct__menu[hidden] { display: none; }
.acct__menu-head { padding: 10px 14px; background: #f7f8f6; border-bottom: 1px solid #e3e7ea; font-size: 12px; color: #6b7480; }
.acct__menu-head strong { color: #2b3237; }
.acct__item { display: block; padding: 9px 14px; font-size: 13px; color: #2b3237; text-decoration: none; white-space: nowrap; }
.acct__item + .acct__item { border-top: 1px solid #edf0f2; }
.acct__item:hover { background: #f7f8f6; }
.acct__logout {
  display: flex; align-items: center; gap: 8px; padding: 10px 14px;
  border-top: 1px solid #e3e7ea; background: #fbfcfc;
  color: #3f5117; font-size: 13px; font-weight: 700; text-decoration: none; white-space: nowrap; cursor: pointer;
}
.acct__logout:hover { background: #f2f5f7; }
.acct__logout img { flex: 0 0 auto; }

/* ==================================================================
 MOBILE OVERRIDES — same header-top / promo-bar markup as desktop,
 just re-flowed. Only the off-canvas panel nav below is genuinely
 mobile-only markup (its desktop counterpart is the mega-menu above).
 ================================================================== */
.overlay, .offcanvas{display:none;}
@media (min-width: 900px){ 
.hamburger { display:none;}
}
@media (max-width: 900px){
.main-nav{display:none;}

.header-top{padding:10px 12px;gap:12px;}
.hamburger{display:flex;}
.logo{order:1;flex:1 1 auto;text-align:center;font-size:18px;}
.logo img  {max-width:130px;width:fit-content; max-height: initial;}
.logo strong{font-size:22px;}
.search-bar{order:3;flex:1 1 100%;max-width:none;margin-top:2px;}
.header-actions{order:2;gap:16px;}
.header-actions .icon-btn svg{width:20px;height:20px;}
.header-actions .icon-btn .label{display:none;}
.header-actions .icon-btn.hide-mobile{display:none;}
.header-actions .acct .acct__label{display:none;}
.header-actions .acct__menu{right:-16px;}

.promo-bar{
position:relative;overflow:hidden;
background:#eef2f4;border-top:1px solid #dfe4e7;
height:34px;padding:0;gap:0;
}
.promo-bar svg{width:18px;height:18px;}
.promo-item{
position:absolute;top:0;left:0;right:0;bottom:0;
justify-content:center;
padding:0 12px;font-size:12.5px;
opacity:0;visibility:hidden;
transition:opacity .6s ease;
}
.promo-item.active{opacity:1;visibility:visible;}

/* Off canvas menu */
.overlay{
display:block;
position:fixed;inset:0;background:rgba(0,0,0,0.4);
opacity:0;visibility:hidden;transition:opacity .25s ease;z-index:90;
}
.overlay.active{opacity:1;visibility:visible;}

.offcanvas{
position:fixed;top:0;left:0;bottom:0;width:82%;max-width:340px;
background:#364916;color:#fff;z-index:100;
transform:translateX(-100%);transition:transform .28s ease;
display:flex;flex-direction:column;overflow:hidden; z-index:999999;
}
.offcanvas.active{transform:translateX(0);}

.panel-track{display:flex;height:100%;transition:transform .28s ease;}
.panel{flex:none;display:flex;flex-direction:column;overflow-y:auto; width:100%;}

.panel-header{
background:#39393a;color:#fff;
display:flex;align-items:center;justify-content:space-between;
padding:14px 16px;font-weight:700;font-size:16px;flex:0 0 auto;
}
.panel-header .close-btn{background:none;border:none;color:#fff;cursor:pointer;}
.panel-header .close-btn svg{width:18px;height:18px;stroke:#fff;fill:none;stroke-width:2;}

.crumbs{flex:0 0 auto;}
.crumb-row{
display:flex;align-items:center;justify-content:space-between;gap:10px;
padding:12px 16px;
cursor:pointer;
}
.crumb-row .crumb-label{font-weight:700;font-size:15px;}
.crumb-row .crumb-back{
background:none;border:none;color:#fff;display:flex;align-items:center;gap:4px;
font-size:12px;font-weight:500;cursor:pointer;padding:0;flex:0 0 auto;
}
.crumb-row .crumb-back svg{width:16px;height:16px;stroke:#fff;fill:none;stroke-width:2.2;}
.crumb-row.active{}
.nav-highlighted.active{background:#94c347;}

.vat-toggle{
display:flex;align-items:center;justify-content:center;gap:12px;
padding:14px 16px;font-size:14px;font-weight:600;flex:0 0 auto;
border-bottom:1px solid rgba(255,255,255,0.25);
}
.switch{
position:relative;width:42px;height:22px;background:rgba(255,255,255,0.35);
border-radius:12px;cursor:pointer;flex:0 0 auto;
}
.switch::after{
content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;background:#fff;
border-radius:50%;transition:left .2s ease;
}
.switch.on::after{left:22px;}

.panel nav{flex:1;padding:6px 0;}
.panel-link{
display:flex;align-items:center;justify-content:space-between;
padding:7px 18px;font-weight:500;font-size:14px;cursor:pointer;color: #fff !important;
		text-decoration: none !important;
}
.panel-link.sub{font-weight:400;padding-left:18px;}
.panel-link svg{width:16px;height:16px;stroke:#fff;fill:none;stroke-width:2;}
.panel-link:hover, .panel-link:active{}
.panel-link.sub a { color:#fff; text-decoration:none;}
.panel-link a { color:#fff; text-decoration:none;}

/* Rows that both link to a category AND drill into a sub-level: the
 label itself is a real, working link; the chevron is a separate
 button that only opens the next panel. */
.panel-row{
display:flex;align-items:stretch;font-weight:700;font-size:15px;
}
.panel-row-link{
flex:1;display:flex;align-items:center;padding:8px 18px;color:#fff !important; font-size: 14px !important;
		text-decoration: none !important;
}
.panel-row-arrow{
display:flex;align-items:center;justify-content:center;
padding:10px 22px;background:none;border:none;cursor:pointer;
border-left:1px solid #d0d4d6);
}
.panel-row-arrow:hover, .panel-row-arrow:active{background:rgba(255,255,255,0.08);}
.panel-row-arrow svg{width:16px;height:16px;stroke:#fff;fill:none;stroke-width:2;}

.panel-divider{height:1px;background:rgba(255,255,255,0.25);margin:8px 16px;}

.panel-footer{padding:4px 0 16px;flex:0 0 auto;}
.panel-footer {
background-color: transparent !important; padding:0 !important; border-top: none !important;
}
.panel-link a { color:#fff !important}
.brand-grid-mobile{
display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:14px 16px 4px;
}
.brand-grid-mobile > div > a { background:#fff; padding:1px 2px; text-align:center; display:block;}
.brand-grid-mobile > div > a img{ display:inline-block}
.brand-grid-mobile span{
background:#fff;border-radius:4px;padding:12px 8px;text-align:center;font-weight:800;
font-size:13px;color:#2b2f33;
}
.all-brands-title, .section-title-mobile{
padding:14px 18px 4px;font-weight:700;font-size:14px;opacity:.9;
}
.brand-list-mobile{
display:grid;grid-template-columns:1fr 1fr;gap:0 12px;padding:4px 18px 8px;
}
.brand-list-mobile a{display:block;padding:8px 0;font-size:14px;font-weight:400;color:#fff;text-decoration: none;}
}

@media (max-width: 950px){
.search-bar {
flex: 1 1 0%;
}
}
@media (max-width: 900px){
.search-bar {
flex: 1 1 100%;
}
.site-header {
border-bottom:none;
}
.site-header{padding-top: 4px;}

.brand-grid-mobile > div > a img {display: inline-block;max-height: 40px;}
.second-level {background:#43591f; padding-bottom:5px; margin-bottom:20px;}
.second-level a{font-weight:500 !important}
}
.mini-cart-overlay {
z-index: 999999999 !important;
}







/*========================================
Header css end
=========================================*/

.basket-offer-banner img { width:100%}



/*========================================
Product Page css start
=========================================*/
.section01 {
max-width: 1140px;
margin:0 auto 80px auto;
padding:0px 10px;
}
.section01 {
display: grid;
grid-template-columns: minmax(0, 1fr) 340px;
gap: 32px;
align-items: start;
}
.section01 > div {
min-width: 0;
}
/* ---------- LEFT: title + gallery ---------- */
 .section01 .title-block h1 {
font-size:18px;
line-height: 1.25;
margin: 0 0 10px;
font-weight: 700;
color:#39393a;
}
.section01 .rating-row {
display: flex;
align-items: center;
gap: 10px;
margin-bottom: 22px;
font-size: 12px;
}
.section01 .stars { position:relative; top:-2px;}
.section01 .stars { color: #ffbd59; font-size: 16px; letter-spacing: 1px; }
.section01 .rating-score { font-weight: 700; color:#39393a; }
.section01 .reviews-link { color:#364916; text-decoration: none; 	font-weight: 600; }
.section01 .reviews-link:hover { text-decoration: underline; }

.section01 .gallery {
display: flex;
align-items: center;
gap: 8px;
}
.section01 .nav-btn {
flex: 0 0 auto;
width:40px;
height:40px;
border-radius: 50%;
border: 1px solid #cbcbcb;
background: #fff;
color:#0285ca;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
font-size: 16px;
transition: background .15s, border-color .15s;
}

.thumb-row  .nav-btn{width:32px; height:32px;}
.thumb-row  .nav-btn img { height:14px; position:relative;}
#thumbPrev img { left:-1px;}
#thumbNext img{right:-1px;}
#nextBtn img { position:relative; right:-2px;}
.section01 .nav-btn:hover {border-color:#3d4f1e; }
.section01 .nav-btn:focus-visible { outline: 2px solid #0285ca; outline-offset: 2px; }
.section01 .stage-wrap {
flex: 1 1 auto;
display: flex;
flex-direction: column;
align-items: center;
min-width: 0;
}
.section01 .stage {
width: 100%;
max-width: 520px;
aspect-ratio: 530 / 300;
background: #fff;
border-radius: 6px;
overflow: hidden;
position: relative;
display: flex;
align-items: center;
justify-content: center;
}
.section01 .stage img {
width: 100%;
height: 100%;
object-fit: contain;
display: none;
user-select: none;
-webkit-user-drag: none;
cursor: zoom-in;
}
.section01 .stage img.active {
display: block;
}
.section01 .zoom-hint {
position: absolute;
right: 10px;
bottom: 10px;
display: flex;
align-items: center;
gap: 6px;
background: rgba(255,255,255,0.92);
border: 1px solid #e2e6ea;
color: #5a6572;
font-size: 12px;
padding: 5px 10px;
border-radius: 999px;
pointer-events: none;
opacity: 0;
transform: translateY(4px);
transition: opacity .15s, transform .15s;
}
.section01 .zoom-hint svg { width: 14px; height: 14px; }
.section01 .stage:hover .zoom-hint { opacity: 1; transform: translateY(0); }
.section01 .counter-pill {
margin-top: 14px;
padding: 4px 16px;
border: 1px solid #364916;
color:#364916;
border-radius: 999px;
font-size: 12px;
font-weight: 700;
background: #fff;
min-width: 52px;
text-align: center;
}
.section01 .thumb-row {
margin-top: 14px;
display: flex;
align-items: center;
gap:18px;
width: 100%;
max-width: 560px;
}
.section01 .thumb-strip {
display: flex;
gap: 10px;
overflow: hidden;
flex: 1 1 auto;
min-width: 0;
}
.section01 .thumb {
flex: 0 0 auto;
width: 68px;
height: 68px;
border: 1px solid #e2e6ea;
border-radius: 4px;
background: #fff;
padding: 4px;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
transition: border-color .15s, box-shadow .15s;
}
.section01 .thumb img {
max-width: 100%;
max-height: 100%;
object-fit: contain;
}
.section01 .thumb.active {
border-color:#3d4f1e;
box-shadow: 0 0 0 1px #0285ca;
}
.section01 .thumb:hover { border-color:#364916; }
/* ---------- RIGHT: buy box ---------- */
.section01 .buy-box {
background: #ffffff;
border-radius:12px;
padding: 20px;
box-shadow: 0 1px 54px rgba(0, 0, 0, 0.08), 0 4px 20px rgba(0, 0, 0, 0.08);
}
.section01 .price-frame {
border:1px solid #939495;
border-radius: 4px;
padding:7px 13px;
margin-bottom:4px;
}
.section01 .price-ex {
font-size: 20px;
font-weight: 700;
color:#39393a;
}
.section01 .price-ex .unit { font-size: 12px; font-weight: 500; color: #000; }
.section01 .price-inc {
font-size: 14px;
color: #39393a;
font-weight: 700;
margin-top:0px;
}
.section01 .price-inc .unit { font-size: 12px; font-weight: 500; color: #000; }
.section01 .free-delivery {
font-size: 12px;
font-weight: 700;
margin-top:1px;
color:#39393a;
margin-bottom: 0;
}
.section01 .add-basket {
width: 100%;
background:#94c347;
color: #fff;
border: none;
border-radius: 4px;
padding: 14px 18px;
font-size: 16px;
font-weight: 700;
cursor: pointer;
transition: background .15s;
margin-bottom: 18px;
}
.section01 .add-basket:hover { background:#82b52d; }
.section01 .add-basket:focus-visible { outline: 2px solid #2f9c5c; outline-offset: 2px; }
.section01 .feature-list {
list-style: none;
margin: 0 0 18px;
padding: 0;
font-size: 14px;
}
.section01 .feature-list li {
position: relative;
padding-left: 16px;
margin-bottom: 8px;
line-height: 1.4;
color: #000;
font-size: 12px;
}
.section01 .feature-list li::before {
content: "";
position: absolute;
left: 0;
top:6px;
width: 5px;
height: 5px;
border-radius: 50%;
background: #2a3541;
}
.section01 .info-row {
display: flex;
align-items: flex-start;
gap: 12px;
padding:8px 0;
font-size: 12px;
line-height: 18px;
}
.section01 .info-row:first-of-type { border-top: 1px solid #e2e6ea; }
.section01 .info-icon {
flex: 0 0 auto;
width: 22px;
height: 22px;
color:#0285ca;
}
.section01 .info-icon svg { width: 100%; height: 100%; }
.section01 .info-text b { display: block; color: #14202b; }
.section01 .info-text span.sub { color:#39393a; }
.section01 .cartridge-box {
margin-top: 18px;
background:#fea6db;
border-radius: 6px;
padding: 18px;
box-shadow: 0 1px 54px rgba(0, 0, 0, 0.08), 0 4px 20px rgba(0, 0, 0, 0.08);
}
.section01 .cartridge-head {
display: flex;
align-items: center;
gap: 12px;
margin-bottom: 10px;
}
.section01 .drops { display: flex; }
.section01 .drop {
width: 14px;
height: 18px;
border-radius: 50% 50% 50% 0;
transform: rotate(45deg);
margin-left: -4px;
}
.section01 .drop:first-child { margin-left: 0; }
.section01 .drop.c { background: #16b7e8; }
.section01 .drop.m { background: #ec3d8e; }
.section01 .drop.y { background: #f6c400; }
.section01 .drop.k { background: #1c1c1c; }
.section01 .cartridge-head h3 {
margin: 0;
font-size: 16px;
font-weight: 700;
color: #14202b;
}
.section01 .cartridge-body {
display: flex;
align-items: center;
justify-content: space-between;
gap: 12px;
}
.section01 .cartridge-body p {
margin: 0;
font-size: 13.5px;
color: #24333f;
line-height: 1.4;
}
.section01 .chevron-btn {
flex: 0 0 auto;
width: 34px;
height: 34px;
border-radius: 4px;
background:transparent;
border: none;
color: #fff;
display: flex;
align-items: center;
justify-content: center;
cursor: pointer;
}
.section01 .chevron-btn:hover { background:transparent;}
span.info-icon img{ max-height:20px; }
span.info-icon {  gap:15px}
.section01 .info-icon {align-items:center; justify-content:center; display:flex; min-width:30px}
/* ---------- responsive ---------- */
@media (max-width: 860px) {
 .section01 {
grid-template-columns: 1fr;
}
}
@media (max-width: 480px) {
.section01 .page { padding: 18px 14px 40px; }
.section01 .title-block h1 { font-size: 21px; }
.section01 .nav-btn { width: 28px; height: 28px; font-size: 14px; }
.section01 .nav-btn img { height:15px;}
.section01 .thumb { width: 52px; height: 52px; }
.section01 .price-ex { font-size: 19px; }
}
@media (prefers-reduced-motion: reduce) {
* { transition: none !important; }
}
/* ---------- ZOOM LIGHTBOX ---------- */
.section01 .lightbox-overlay {
position: fixed;
inset: 0;
background: rgba(10, 14, 18, 0.88);
display: none;
align-items: center;
justify-content: center;
z-index: 1000;
padding: 24px;
}
.section01 .lightbox-overlay.open {
display: flex;
}
.section01 .lightbox-frame {
position: relative;
width: 100%;
max-width: 1000px;
height: 100%;
max-height: 800px;
display: flex;
align-items: center;
justify-content: center;
}
.section01 .lightbox-viewport {
width: 100%;
height: 100%;
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
border-radius: 4px;
background: #10151a;
cursor: zoom-in;
touch-action: none;
}
.section01 .lightbox-viewport.zoomed { cursor: grab; }
.section01 .lightbox-viewport.zoomed.dragging { cursor: grabbing; }
.section01 .lightbox-viewport img {
max-width: 100%;
max-height: 100%;
object-fit: contain;
user-select: none;
-webkit-user-drag: none;
transform-origin: center center;
transition: transform .18s ease-out;
will-change: transform;
}
.section01 .lightbox-viewport.dragging img {
transition: none;
}
.section01 .lightbox-close {
position: absolute;
top: -46px;
right: 0;
width: 36px;
height: 36px;
border-radius: 50%;
border: 1px solid rgba(255,255,255,0.3);
background: rgba(255,255,255,0.08);
color: #fff;
font-size: 18px;
line-height: 1;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
}
.section01 .lightbox-close:hover { background: rgba(255,255,255,0.18); }
.section01 .lightbox-nav {
position: absolute;
top: 50%;
transform: translateY(-50%);
width: 42px;
height: 42px;
border-radius: 50%;
border: 1px solid rgba(255,255,255,0.3);
background: rgba(255,255,255,0.08);
color: #fff;
font-size: 18px;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
}
.section01 .lightbox-nav:hover { background: rgba(255,255,255,0.18); }
.section01 .lightbox-nav.prev { left: -54px; }
.section01 .lightbox-nav.next { right: -54px; }
.section01 .lightbox-zoom-controls {
position: absolute;
bottom: -46px;
left: 50%;
transform: translateX(-50%);
display: flex;
align-items: center;
gap: 10px;
}
.section01 .zoom-btn {
width: 34px;
height: 34px;
border-radius: 50%;
border: 1px solid rgba(255,255,255,0.3);
background: rgba(255,255,255,0.08);
color: #fff;
font-size: 18px;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
}
.section01 .zoom-btn:hover { background: rgba(255,255,255,0.18); }
.section01 .lightbox-counter {
color: #fff;
font-size: 13px;
min-width: 44px;
text-align: center;
opacity: 0.85;
}
@media (max-width: 860px) { 
.section01 {
margin:0 auto 50px auto;
}
}
@media (max-width: 720px) {
.section01 .lightbox-nav.prev { left: 4px; }
.section01 .lightbox-nav.next { right: 4px; }
.section01 .lightbox-close { top: 4px; right: 4px; background: rgba(0,0,0,0.4); }
.section01 .lightbox-zoom-controls { bottom: 10px; }
}




.section02 {
	max-width: 1140px;
	margin:0 auto 70px auto;
	padding:0px 10px;
}
/* ===== Tabs ===== */
.section02 .tabs {
	display: inline-flex;
	gap: 32px;
	list-style: none;
	margin: 0 0 0 0;
	padding: 0 0 14px 0;
	border-bottom: 1px solid #d9d9d9;
	flex-wrap:wrap;
}
.section02 .tabs li a {
	color: #364916;
	text-decoration: none;
	font-weight: 700;
	font-size: 12px;
}
.section02 .tabs li a:hover {
	text-decoration: underline;
}
/* ===== Section heading ===== */
.section02 .section-title {
	font-size:18px;
	font-weight: 700;
	color: #111;
	margin: 28px 0 24px 0;
}
/* ===== Feature grid ===== */
.section02 .features {
	display: flex;
	flex-wrap: wrap;
	gap:60px;
}
.section02 .feature {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
}
.section02 .feature .icon {
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 14px;
}
.section02 .feature .icon img { height:43px;}
.section02 .feature .icon svg {
	width: 100%;
	height: 100%;
}
.section02 .feature p {
	margin: 0;
	font-size: 12px;
	line-height: 1.4;
	color:#39393a;
}
@media (max-width: 860px) {
.section02 .tabs { display:none;}
.section02 .features {
gap:25px;
}
}

/*Save When You Buy A Printer Bundle*/
.card-pdp {
max-width: 1140px;
margin: 0 auto 31px auto;
background: #fff;
border: 1px solid #e0e0e0;
border-radius:10px;
overflow: hidden;
box-shadow: 0 1px 3px rgba(0,0,0,0.08);
}

.card-pdp .card-header {
background:#364916;
color: #fff;
padding: 22px 28px !important;
font-size:18px;
font-weight: 700;
}

.card-pdp .bundles {
display: flex;
padding: 32px 0px 28px 0px;
gap: 0;
}

.card-pdp .bundle {
flex: 1;
padding: 0 24px;
}

.card-pdp .bundle:first-child {
border-right: 1px solid #ddd;
}

.card-pdp .bundle-title {
text-align: center;
font-size: 18px;
font-weight: 700;
color:#39393a;
margin: 0 0 8px 0;
}

.card-pdp .bundle-underline {
width: 220px;
max-width: 100%;
height: 2px;
background: #0f6f97;
margin: 0 auto 28px auto;
}

.card-pdp .products {
display: flex;
gap: 20px;
margin-bottom: 20px;
}

.card-pdp .product {
flex: 1;
text-align: left;
}

.card-pdp .product img {
width: 100%;
max-width: 140px;
height: 110px;
object-fit: contain;
display: block;
margin-bottom: 12px;
}

.card-pdp .product-placeholder {
width: 100%;
max-width: 100%;
height: 110px;
border-radius: 4px;
display: flex;
align-items: center;
justify-content: center;
font-size: 11px;
color: #999;
margin-bottom: 12px;
text-align: center;
padding: 6px;
}
.card-pdp .product a { text-decoration:none; color:#39393a}
.card-pdp .product p {
font-size: 12px;
font-weight: 700;
line-height:18px;
margin: 0;
color:#39393a;
min-height: 38px;
}

.card-pdp .price-per-ml {
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
color: #fff;
font-weight: 700;
font-size: 12px;
padding: 8px 18px;
border-radius: 20px;
width: fit-content;
margin: 0 auto 24px auto;
}
.card-pdp .price-per-ml img { max-height:13px;}
.card-pdp .price-per-ml.compatible {
background: #2e8b3d;
}

.card-pdp .price-per-ml.original {
background: #7a1414;
}

.card-pdp .price-per-ml .drop {
font-size: 13px;
}

.card-pdp .deal-box {
background:#f3f8eb;
border-radius: 6px;
padding: 18px 20px;
}

.card-pdp .save-label {
color: #7d0000;
font-weight: 700;
font-size: 12px;
margin: 0 0 13px 0;
}

.card-pdp .deal-row {
display: flex;
align-items: center;
justify-content: space-between;
flex-wrap: wrap;
gap: 12px;
}

.card-pdp .price-block {
display: flex;
flex-direction: column;
}

.card-pdp .price {
font-size: 20px;
font-weight: 700;
color: #39393a;
}

.card-pdp .price .ex-vat {
font-size: 11px;
font-weight: 400;
color:#39393a;
margin-left: 4px;
}

.card-pdp .delivery-note {
font-size: 11px;
color: #39393a;
margin-top: 6px;
font-weight: 700;
}

.card-pdp .add-btn {
background: #94c347;
color: #fff;
border: none;
font-weight: 700;
font-size: 14px;
padding: 12px 26px;
border-radius: 3px;
cursor: pointer;
white-space: nowrap;
}

.card-pdp .add-btn:hover {
background:#82b52d !important;
}
@media (max-width:1160px) { 
.card-pdp {
margin-left:10px;
margin-right:10px;
}
.card-pdp .card-header {
padding: 16px 15px !important;
}
.card-pdp .bundles {
padding: 24px 10px 21px 10px;
}
.card-pdp .bundle {
padding: 0 10px;
}
}
@media (max-width: 880px) { 
.card-pdp .add-btn {
max-width: 150px;
}
.card-pdp .deal-row {
flex-direction: row;
align-items: flex-start;
flex-wrap: nowrap;
}
}
@media (max-width: 700px) {
.card-pdp .bundles {
flex-direction: column;
}
.card-pdp .bundle:first-child {
border-right: none;
border-bottom: 1px solid #ddd;
padding-bottom: 28px;
margin-bottom: 28px;
}
.card-pdp .add-btn {
width: 100%;
max-width: 120px;
padding: 12px 10px;
}
}
/*Save When You Buy A Printer Bundle*/

/*Accordian Area CSS*/
.accordion { max-width:1140px; margin:0 auto; 	border-top: 1px solid #dddddd;padding-top: 8px;}
@media (max-width:1160px) {  
.accordion {margin:10px 10px;}
}
.accordion .accordion-section {
border-bottom: 1px solid #ddd;
}
.accordion .accordion-header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 18px 4px;
cursor: pointer;
background: none;
border: none;
width: 100%;
text-align: left;
font-size: 18px;
font-weight: 700;
color:#39393a;
}
.accordion .accordion-header .icon {
font-size: 14px;
flex-shrink: 0;
margin-left: 12px;
}

.accordion .accordion-panel {
max-height: 0;
overflow: hidden;
transition: max-height 0.3s ease;
}
.accordion [aria-expanded="true"] + .accordion-panel {max-height: initial !important;}
.accordion .accordion-panel-inner {
padding: 0 0px 20px;
}
.accordion-panel-inner:has(.sub-section) {	padding: 0 40px 20px;}
.accordion .accordion-panel-inner p {
margin: 0 0 14px;
line-height: 1.6;
font-size: 14px;
color:#39393a;
}
.accordion .spec-table {
display: flex;
flex-direction: column;
margin-bottom: 16px;
}

.accordion .spec-row {
display: flex;
justify-content: space-between;
align-items: center;
padding: 12px 14px;
font-size: 14px;
}
.accordion .spec-row span.label{
font-size: 14px !important;
}
.accordion .spec-row:nth-child(odd) { background: #eaf3da; }
.accordion .spec-row:nth-child(even) { background: #d7d7d9; }
.accordion .spec-row .label {
font-weight: 700;
color: #1a1a1a;
}
.accordion .spec-row .value, .accordion .spec-row .value a {
color: #333;
text-align: right;
text-decoration:none;
font-size: 14px !important;
}
.accordion .sub-section {
border-top: 1px solid #ddd;
}
.accordion .sub-section:first-child {border-top:none;}
.accordion .sub-header {
display: flex;
align-items: center;
justify-content: space-between;
padding: 14px 4px;
cursor: pointer;
background: none;
border: none;
width: 100%;
text-align: left;
font-size: 16px;
font-weight: 700;
color:#39393a;
}
.accordion .sub-header .icon {
font-size: 18px;
line-height: 1;
}
.accordion .sub-panel {
max-height: 0;
overflow: hidden;
transition: max-height 0.3s ease;
}
.accordion .sub-panel-inner {
padding: 0 4px 16px;
}
.accordion .sub-panel-inner .spec-row {
padding: 12px 14px;
margin-bottom: 3px;
border-radius: 5px;
}

.accordion .review {
padding: 14px 4px;
border-bottom: 1px solid #eee;
}
.accordion .review:last-child { border-bottom: none; }
.accordion .review-head {
display: flex;
justify-content: space-between;
font-size: 14px;
font-weight: 700;
margin-bottom: 4px;
}
.accordion .review-stars {
color: #e0a300;
font-size: 13px;
}
.accordion .review-body {
font-size: 14px;
color: #444;
line-height: 1.5;
margin: 0;
}
.accordion .review-meta {
font-size: 12px;
	color: #39393a;
}
.accordion .accordion-header .icon {
  flex-shrink: 0;
  margin-left: 12px;
  width:30;
  height: 00px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
font-size:0 !important;
text-indent:-999px;
}
.accordion .accordion-header .icon::before {
  content: "";
  width:14px;
  height:14px;
  border: solid #555;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
  margin-top: -3px;
  transition: transform 0.25s ease, margin 0.25s ease;
}
.accordion .accordion-header[aria-expanded="true"] .icon::before {
  transform: rotate(-135deg);
  margin-top: 3px;
}
@media (max-width: 480px) {
.accordion .accordion-header { font-size: 16px; }
.accordion .spec-row { font-size: 13px; padding: 10px; }
.accordion .review-head { flex-direction: column; gap: 2px; }
}
/*Accordian Area CSS*/

/*Feefo CSS*/
.feefo-widget-area{
max-width:1140px;
margin:0 auto;
padding:20px 0px;
}
.feefo-widget-area .feefo-grid{
display:flex;
flex-direction:column;
gap:20px;
}
.feefo-widget-area .left-col{
display:flex;
flex-direction:column;
gap:20px;
}
.feefo-widget-area .card{
border:1px solid #e1e4e8;
border-radius:10px;
padding:22px;
background:#fff;
}
.feefo-widget-area .rating-card{
text-align:center;
}
.feefo-widget-area .rating-card h2{
margin:0 0 14px;
font-size:18px;
font-weight:700;
color:#39393a;
}
.feefo-widget-area .stars-row{
display:flex;
justify-content:center;
gap:6px;
margin-bottom:16px;
}
.feefo-widget-area .star-box{
width:38px;
height:38px;
background:#febd57;
border-radius:4px;
display:flex;
align-items:center;
justify-content:center;
}
.feefo-widget-area .star-box svg{width:20px;height:20px;fill:#fff;}
.feefo-widget-area .rating-score{
font-weight:700;
font-size:12px;
margin-bottom:10px;
color:#39393a;
}
.feefo-widget-area .rating-brand{
display:flex;
align-items:center;
justify-content:center;
gap:6px;
font-weight:700;
font-size:12px;
margin-bottom:22px;
color:#39393a;
}
.feefo-widget-area .rating-brand .dots{color:#febd57;}
.feefo-widget-area .bar-row{
display:grid;
grid-template-columns:16px 1fr 24px;
align-items:center;
gap:10px;
margin-bottom:10px;
font-weight:600;
font-size: 12px;
color: #39393a;
}
.feefo-widget-area .bar-row span:last-child { font-weight:500;}
.feefo-widget-area .bar-track{
height:10px;
background:#e2e2e2;
border-radius:0px;
overflow:hidden;
margin-left:10px;
}
.feefo-widget-area .bar-fill{
height:100%;
background:#febd57;
border-radius:0px;
transition:width .3s ease;
}
.feefo-widget-area .bar-row.disabled{opacity:.35;}
.feefo-widget-area .badge-card{
display: flex;
	align-items: flex-end;
	gap: 16px;
	padding: 10px 10px;
}
.feefo-widget-area .badge-icon{
width:56px;
height:56px;
flex-shrink:0;
display:flex;
align-items:center;
justify-content:center;
}
.feefo-widget-area .badge-icon svg{width:100%;height:100%;}
.feefo-widget-area .badge-title{
font-weight:700;
font-size:1rem;
line-height:1.3;
margin:0 0 4px;
}
.feefo-widget-area .badge-sub{
display:flex;
align-items:center;
gap:5px;
font-size:0.78rem;
color:#555;
}
.feefo-widget-area .badge-sub img,
.feefo-widget-area .badge-sub .feefo-mini{
font-weight:700;
color:#333;
}
.feefo-widget-area .badge-link{
margin-left: auto;
	text-align: left;
	flex-shrink: 0;
	max-width: 176px;
	display: flex;
	align-items: center;
}
.feefo-widget-area .badge-link a{
color:#0f6f97;
text-decoration:none;
font-size:0.85rem;
font-weight:600;
line-height:1.3;
}
.feefo-widget-area .badge-link a:hover{text-decoration:underline;}
.feefo-widget-area .talking-card h3{
margin: 0 0 19px;
font-size: 18px;
font-weight: 700;
color: #39393a;
}
.feefo-widget-area .tab-row{
display:flex;
flex-wrap:wrap;
gap:10px;
margin-bottom:18px;
}
.feefo-widget-area .tab-btn {
	border: 1px solid #e1e4e8;
	background: #fff;
	border-radius: 4px;
	padding: 13px 16px;
	font-size: 12px;
	font-weight: 600;
	cursor: pointer;
	display: flex;
	align-items: center;
	gap: 8px;
	transition: background .15s, color .15s, border-color .15s;
}
.feefo-widget-area .tab-btn:hover{border-color:#364916;}
.feefo-widget-area .tab-btn.active{
background:#364916;
border-color:#364916;
color:#fff;
}
.feefo-widget-area .tab-btn .close-x{
font-size: 10px;
line-height: 1;
border: 1px solid #fff;
border-radius: 100%;
width: 16px;
height: 12px;
padding-top: 4px;
font-weight: 500;
}
.feefo-widget-area .quotes p, .feefo-widget-area .review-content p{
margin: 0 0 14px;
color: #000;
font-size: 13px;
}
.feefo-widget-area .quotes p:last-child{margin-bottom:0;}
.feefo-widget-area .comments-header{
display:flex;
justify-content:space-between;
align-items:flex-start;
flex-wrap:wrap;
gap:12px;
margin:26px 0 18px;
}
.f-wrapper { padding:0 0px;}
.feefo-widget-area .comments-header h3{
margin: 0 0 4px;
font-size: 18px;
font-weight: 700;
color: #39393a;
}
.feefo-widget-area .comments-header span{
color: #838586;
font-size: 18px;
}
.feefo-widget-area .rating-select{
padding: 9px 14px;
border: 1px solid #e1e4e8;
border-radius: 6px;
font-size:12px;
font-weight: 600;
cursor: pointer;
color: #39393a;
background: #f0f0f2;
}
.feefo-widget-area .review{
display:flex;
gap:20px;
padding:20px 0;
border-bottom:1px solid #e1e4e8;
}
.feefo-widget-area .review:first-of-type{padding-top:0;}
.feefo-widget-area .review-meta{
flex-shrink:0;
width:110px;
display:flex;
flex-direction:column;
gap:8px;
}
.feefo-widget-area .review-name{
font-weight:700;
}
.feefo-widget-area .verified-badge{
align-self: flex-start;
	background: #00bdbd;
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	padding: 6px 10px;
	border-radius: 12px;
	letter-spacing: .2px;
}
.feefo-widget-area .review-content{
flex:1;
min-width:0;
}
.feefo-widget-area .review-stars{
display:flex;
gap:2px;
margin-bottom:8px;
}
.feefo-widget-area .review-stars svg{width:16px;height:16px;fill:#febd57;}
.feefo-widget-area .review-body{
margin:0;
line-height:1.55;
color:#222;
font-size:0.96rem;
}
.feefo-widget-area .review.hidden{display:none;}


.feefo-widget-area .load-more-wrap{
text-align:center;
margin-top:22px;
}
.feefo-widget-area .load-more-btn{
	border: 1px solid #e1e4e8;
	background: #fff;
	border-radius: 24px;
	padding: 11px 30px;
	font-weight: 500;
	font-size: 12px;
	cursor: pointer;
	color: #39393a;
	transition: background .15s;
}
.feefo-widget-area .load-more-btn:hover{background:#f5f5f5;}
.feefo-widget-area .load-more-btn:disabled{opacity:.4;cursor:default;}
.feefo-widget-area .no-results{
text-align:center;
color:#555;
padding:30px 0;
font-size:0.95rem;
}
.feefo-widget-area .bar-row span:first-child {display:flex;align-items: center; width:43px;}
.feefo-widget-area .bar-row span:first-child svg {fill:#febd57; margin-left:8px; margin-right:13px; }
.feefo-widget-area .rating-card {padding: 22px 15px;}
.feefo-widget-area .badge-link a{ font-size:12px; color:#000; text-decoration:none; font-weight: 500;}
@media (min-width:860px){
.feefo-widget-area .feefo-grid{
display:grid;
grid-template-columns:340px 1fr;
align-items:start;
gap:20px;
}
.feefo-widget-area .right-col{display:flex;flex-direction:column;gap:20px;}
.feefo-widget-area .card {
padding: 22px 10px;
}
.feefo-widget-area .review-meta {
width: 100%;
}
.feefo-widget-area .review {flex-wrap: wrap;}
}
@media (max-width:520px){
.feefo-widget-area .review{gap:14px;}
.feefo-widget-area .review-meta {
width: 100%;
}
.feefo-widget-area .review {flex-wrap: wrap;}
}
/*Feefo CSS*/


/*different tabs Css*/
.widget-new{
max-width:1140px;
margin:0 auto;
background:#fff;
border-radius:10px;
}
.widget-new .tabs{
display:flex;
list-style:none;
margin:0;
padding:14px 0 0 0;
position:relative;
border-radius: 10px 10px 0 0;
overflow: hidden;
}
.widget-new .tabs li{
flex:1;
border-radius: 10px 10px 0 0;
overflow: hidden;
}
.widget-new ul.tabs li:has(.tab-btn.active) {margin-top:-12px;}
.widget-new .tab-btn{
width:100%;
border:0;
cursor:pointer;
font-weight:700;
font-size:17px;
color:#fff;
padding:16px 10px;
text-align:center;
position:relative;
transition:padding .2s ease, transform .2s ease;
font-family:inherit;
letter-spacing:.3px;
}
.widget-new .tab-btn.dark-text{ color:#111; }

.widget-new .tab-btn[data-tab="bundles"]{ background:#364916; }
.widget-new .tab-btn[data-tab="black"]{ background:#111111; }
.widget-new .tab-btn[data-tab="magenta"]{ background:#e6007e; }
.widget-new .tab-btn[data-tab="cyan"]{ background:#1a8fe3; }
.widget-new .tab-btn[data-tab="yellow"]{ background:#f5d33f; color:#1a1200; }
.widget-new .tab-btn[data-tab="maintenance"]{ background:#777777; color:#ffffff; }
.widget-new .tab-btn.active{
padding-top:22px;
padding-bottom:22px;
z-index:3;
box-shadow:0 6px 14px rgba(0,0,0,0.18);
}
.widget-new .tab-btn.active::after{
content:"";
position:absolute;
right:-18px;
top:0;
bottom:0;
width:36px;
background:inherit;
z-index:2;
border-radius:0 0 0 0;
clip-path:path('M0,0 C 18,0 18,100% 0,100% L 36,100% L 36,0 Z');
}
.widget-new .tab-btn.active::before{
content:"";
position:absolute;
left:0; right:0; bottom:-1px;
height:14px;
background:#fff;
border-radius:14px 14px 0 0;
z-index:1;
opacity:0;
}

.widget-new .tab-panels{ padding:0; }
.widget-new .tab-panel{ display:none; padding:20px; }
.widget-new .tab-panel.active{ display:block; }
.widget-new .product{
display:flex;
align-items:flex-start;
gap:20px;
padding:20px 6px;
border-bottom:1px solid #ececec;
}
.widget-new .product:last-child{ border-bottom:none; }
.widget-new .product-img{
	width: 90px;
	height: 90px;
	flex: 0 0 90px;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1px solid #e5e5e5;
	border-radius: 6px;
	background: transparent;
	overflow: hidden;
	padding: 8px;
}
.widget-new .product-img img{ max-width:100%; max-height:100%; }
.widget-new .product-info{ flex:1; min-width:180px; }
.widget-new .product-info h3{
margin: 0 0 4px;
font-size: 12px;
line-height: 16px;
color: #39393a;
}
.widget-new .sku{ color:#000; font-size:10px; margin-bottom:6px; }
.widget-new .stock{ color:#007a3f; font-weight:700; font-size:10px; }
.widget-new .delivery{color: #000;
	font-size: 10px;
	margin-bottom: 8px;}

.widget-new .switch-save{
display:inline-flex;
align-items:center;
gap:8px;
margin-top:6px;
border:none !important;
padding:0 !important;
}
.widget-new .switch-save .badge{
color:#fff;
font-size:11px;
font-weight:700;
padding:0;
border-radius:6px;
line-height:1.2;
text-align:center;
}
.widget-new .switch-save .badge-text{	font-size: 12px;
	color: #d41f7e;
	font-weight: 700;
	line-height: 1.3;}

.widget-new .price-block{ text-align:right; flex:0 0 200px; }
.widget-new .price-ex{ font-size:20px; font-weight:800; color:#39393a;display: flex;
	align-items: flex-end; }
.widget-new .price-ex sup{ font-size:11px; font-weight:500; color:#39393a; margin-left:2px; position: relative;
	top: -12px; }
.widget-new .price-inc{	color: #39393a;
	font-size: 11px;
	margin-bottom: 6px;
	text-align: left; margin-top:4px;}
.widget-new .per-ml{ font-size:10px; font-weight:700; margin-bottom:10px; text-align: left;}
.widget-new .per-ml.good{ color:#007a3f; background:url(icon013.png) left center no-repeat; background-size:9px;padding-left:10px; }
.widget-new .per-ml.bad{ color:#8a1c1c; background:url(icon014.png) left center no-repeat; background-size:9px;padding-left:10px; }

.widget-new .qty-cart{
display:flex;
align-items:center;
justify-content:flex-end;
gap:10px;
}
.widget-new .qty-selector{
display:flex;
align-items:center;
border:1px solid #ccc;
border-radius:6px;
overflow:hidden;
}
.widget-new .qty-selector button{
width:22px;
height:30px;
border:0;
font-size:16px;
cursor:pointer;
background: transparent;
}
.widget-new .qty-selector input{
width:30px;
height:35px;
border:0;
text-align:center;
font-size:14px;
}
.widget-new .add-basket{
background:#94c347;
color:#fff;
border:0;
border-radius:6px;
font-weight:700;
padding:9px 18px;
cursor:pointer;
font-size:14px;
white-space:nowrap;
transition:background .2s;
}
.widget-new .add-basket:hover{ background:#82b52d !important; }
.widget-new .accordion{ display:none; }
.widget-new .acc-item{ border-bottom:1px solid #eee; }
.widget-new .acc-header{
width:100%;
border:0;
cursor:pointer;
display:flex;
align-items:center;
justify-content:space-between;
padding:16px 18px;
font-weight:700;
font-size:15px;
color:#fff;
font-family:inherit;
	border-radius: 8px 8px 0 0;
	margin-top: -1px;
}
.widget-new .acc-header[data-tab="bundles"]{ background:#1478a3; }
.widget-new .acc-header[data-tab="black"]{ background:#111111; }
.widget-new .acc-header[data-tab="magenta"]{ background:#e6007e; }
.widget-new .acc-header[data-tab="cyan"]{ background:#1a8fe3; }
.widget-new .acc-header[data-tab="yellow"]{ background:#f5d33f; color:#1a1200; }
.widget-new .acc-header .chev{
transition:transform .25s ease;
font-size:14px;
}
.widget-new .acc-header.open .chev{ transform:rotate(180deg); }
.widget-new .acc-panel{
max-height:0;
overflow:hidden;
transition:max-height .3s ease;
background:#fff;
}
.widget-new .tab-panels {
	padding: 0;
	border: 1px solid #0000001c;
	border-radius: 0px 0px 10px 10px;
}
.widget-new .acc-panel .product{ padding:16px 14px; }
@media (max-width: 760px){
.widget-new .tabs, .widget-new .tab-panels{ display:none; }
.widget-new .accordion{ display:block; }

.widget-new .product{ flex-wrap:wrap; border-bottom: 1px solid #0000002e;}
.widget-new .price-block{ 
		flex: 1 1 100%;
		text-align: left;
		margin-top: 0;
		padding-left: 134px;
 }
.widget-new .qty-cart{ justify-content:flex-start; }
.widget-new .product-info{ flex:1 1 55%; }
.widget-new .product {
	row-gap: normal;
}

.widget-new .acc-header.open > span {	font-size:0 !important;}
.widget-new .acc-header.open  > span::before {
	content: "";
	width:12px;
	height:12px;
	border: solid #fff;
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
	margin-top: -7px;
	display:block;
	transition: transform 0.25s ease, margin 0.25s ease;
}

.widget-new .acc-header > span {	font-size:0 !important;}
.widget-new .acc-header  > span::before {
	content: "";
	width:12px;
	height:12px;
	border: solid #fff;
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
	margin-top: -7px;
	display:block;
	transition: transform 0.25s ease, margin 0.25s ease;
}
}



@media (max-width: 450px){
.widget-new .product-img {
	width: 42px;
	height: 42px;
	flex: 0 0 55px;
}
	.widget-new .price-block {
		padding-left: 94px;
	}
}
/*different tabs Css*/


.sticky-buybar {
	position: fixed;
	top: var(--site-header-height);
	left: 0;
	right: 0;
	z-index: 999;
	background: #ffffff;
	box-shadow: 0 4px 16px rgba(0,0,0,0.12);
	transform: translateY(-110%);
	opacity: 0;
	transition: transform .25s ease, opacity .25s ease;
	pointer-events: none;
	top:0;
}
.sticky-buybar.show {
	transform: translateY(0);
	opacity: 1;
	pointer-events: auto;
}
.sticky-buybar-inner {
	max-width: 1140px;
	margin: 0 auto;
	padding: 14px 20px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
}
.sticky-buybar-left {
	min-width: 0;
	flex: 1 1 auto;
		gap: 20px;
	display: grid;
}
.sticky-title {
	margin: 0 0 10px 0;
	font-size: 18px;
	font-weight: 700;
	color: #39393a;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.sticky-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
	list-style: none;
	margin: 0;
	padding: 0;
}
.sticky-tabs a {
	color:#364916;
	text-decoration: none;
	font-weight: 700;
	font-size: 12px;
	white-space: nowrap;
}
.sticky-tabs a:hover { text-decoration: underline; }
.sticky-buybar-right {
	flex: 0 0 auto;
	display:grid;
	align-items: center;
	gap: 16px;
}
.sticky-price-frame {
	border: 1px solid #939495;
	border-radius: 4px;
	padding: 6px 12px;
	white-space: nowrap;
}
.sticky-price-ex {
	font-size:20px;
	font-weight: 700;
	color: #39393a;
}
.sticky-price-ex .unit,
.sticky-price-inc .unit { font-size: 12px; font-weight: 500; color: #000; }
.sticky-price-inc {
	font-size: 12px;
	font-weight: 700;
	color: #39393a;
	margin-top: 2px;
}
.sticky-free-delivery {
	font-size: 12px;
	font-weight: 700;
	color: #39393a;
	margin-top: 4px;
}
.sticky-add-basket {
	background:#94c347;
	color: #fff;
	border: none;
	border-radius: 4px;
	padding: 10px 22px;
	font-size: 16px;
	font-weight: 700;
	cursor: pointer;
	white-space: nowrap;
	transition: background .15s;
}
.sticky-add-basket:hover { background:#82b52d !important; }

@media (max-width: 860px) {
	.sticky-buybar-inner {
		flex-wrap: wrap;
		padding: 10px 14px;
	}
	.sticky-tabs { display: none; }
	.sticky-title { font-size: 15px; margin-bottom: 0; }
	.sticky-buybar-left { flex: 1 1 100%; }
	.sticky-price-frame { display: none; }
	.sticky-buybar-right { flex: 1 1 100%; justify-content: flex-end; }
	.sticky-add-basket { flex: 1 1 auto; }
	.accordion-panel-inner:has(.sub-section) {
	padding: 0 0px 20px !important;
}
}

.price-frame + div.clearfix { margin:6px 0px 12px 0px}
.price-frame + div.clearfix > div > div > button {
width: 100%;
background: #2fbf71;
color: #fff;
border: none;
border-radius: 4px;
padding:2px 18px;
font-size: 16px;
font-weight: 700;
cursor: pointer;
transition: background .15s;
margin-bottom:0px;
height:auto
}
.price-frame + div.clearfix > div > div > button:hover {
background: #2f9c5c !important;
}

.call-us__menu-phone a {
color: #364916 !important;
}

@media (max-width:900px) {
.product > #page-content {margin-top:25px}
.product > #page-content > .container {padding-left:0px !important; padding-right:0px !important;}
.widget-new .product {
gap: 8px;
padding:20px 0px !important;
}
.sticky-buybar.show {display:none !important;}
.header-actions .acct__menu {
top: 37px !important;
z-index: 999999 !important;
}
.section02 .features {
justify-content: center;
}
}
@media (max-width: 760px) {
.widget-new .price-block {
padding-left: 100px;
}
}
@media (max-width: 450px) {
.widget-new .price-block {
padding-left:64px;
}
}
/*========================================
Product Page css end
=========================================*/

/*========================================
Call Us - desktop hover dropdown (phone number + opening hours) start
=========================================*/
.call-us { position: relative; display: flex; flex-direction: column; align-items: center; }
.call-us__menu {
  position: absolute; top: 56px; left: 50%; transform: translateX(-50%);
  z-index: 50; min-width: 200px;
  background: #fff; border: 1px solid #d5dade; border-radius: 4px;
  box-shadow: 0 6px 16px rgba(20, 28, 36, .14);
  text-align: center; padding: 14px 16px;
  opacity: 0; visibility: hidden; pointer-events: none;
  transition: opacity .15s ease;
}
.call-us:hover .call-us__menu,
.call-us:focus-within .call-us__menu {
  opacity: 1; visibility: visible; pointer-events: auto;
}
.call-us__menu-head { font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #6b7480; }
.call-us__menu-phone { margin-top: 6px; }
.call-us__menu-phone a { font-size: 20px; font-weight: 700; color: #2b3237; text-decoration: none; }
.call-us__menu-hours { font-size: 12px; color: #6b7480; line-height: 1.5; margin-top: 6px; }
@media (max-width: 900px) {
  .header-actions > .call-us { display: none; }
}
/*========================================
Call Us - desktop hover dropdown (phone number + opening hours) end
=========================================*/
/*========================================
Buy More & Save pill - tag icon start
=========================================*/
.qty-upsell-pill { display: inline-flex; align-items: center; gap: 6px; }
.qty-upsell-pill__icon { flex-shrink: 0; }
/*========================================
Buy More & Save pill - tag icon end
=========================================*/

.mini-cart__footer > .total-row {font-size:18px !important}
.mini-cart__footer > .total-row[style="font-weight: normal;"] {font-size:14px !important}




















