/* v4 */
/* upload trigger 1 — kart portret 136.375% */
@import url('https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600;700;800&display=swap');
:root {
    --input-placeholder-color: #222;
    --white-clr: #fff;
}

.rtl {
    direction: var(--web-direction);
}

.dropdown-item:hover,
.dropdown-item:focus {
    color: var(--web-primary);
}

.dropdown-item.active,
.dropdown-item:active {
    color: var(--web-secondary);
}

.navbar-light .navbar-tool-icon-box {
    color: var(--web-primary);
}

.search_button {
    background-color: var(--web-primary);
}

.navbar-stuck-menu {
    background-color: var(--web-primary);
}

.mega-nav .nav-item .nav-link {
    color: var(--web-primary) !important;
}

.owl-theme .owl-nav [class*="owl-"],
.checkbox-alphanumeric label:hover {
    border-color: var(--web-primary);
}

::-webkit-scrollbar-thumb:hover {
    background: var(--web-secondary) !important;
}

[type="radio"]:not(.show) {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

[type="radio"]:not(.show) + span:after {
    box-shadow: 0 0 0 0.1em var(--web-secondary);
}

[type="radio"]:not(.show):checked + span:after {
    background: var(--web-secondary);
    box-shadow: 0 0 0 0.1em var(--web-secondary);
}

.navbar-tool .navbar-tool-label {
    background-color: var(--web-secondary) !important;
}

.btn--primary {
    color: #fff;
    background-color: var(--web-primary) !important;
    border-color: var(--web-primary) !important;
}

.d--none {
    display: none;
}

.web-text-primary,
.text-primary {
    color: var(--web-primary) !important;
}

.btn--primary:hover {
    color: #fff;
    background-color: var(--web-primary) !important;
    border-color: var(--web-primary) !important;
}

.btn-secondary {
    background-color: var(--web-secondary) !important;
    border-color: var(--web-secondary) !important;
}

.btn-outline-accent:hover {
    color: #fff;
    background-color: var(--web-primary);
    border-color: var(--web-primary);
}

.btn-outline-accent {
    color: var(--web-primary);
    border-color: var(--web-primary);
}

.text-accent {
    color: var(--web-primary);
}

.text-base-2 {
    color: var(--web-secondary);
}
a:hover {
    color: var(--web-primary);
}

.text-primary,
.text-base,
.active-menu {
    color: var(--web-primary) !important;
}

.page-item.active > .page-link {
    box-shadow: 0 0.5rem 1.125rem -0.425rem var(--web-primary);
}

.page-item.active .page-link {
    background-color: var(--web-primary);
}

.btn-outline-accent:not(:disabled):not(.disabled):active,
.btn-outline-accent:not(:disabled):not(.disabled).active,
.show > .btn-outline-accent.dropdown-toggle {
    background-color: var(--web-secondary);
    border-color: var(--web-secondary);
}

.btn-outline-primary {
    color: var(--web-primary);
    border-color: var(--web-primary);
}

.btn-outline-primary:hover {
    background-color: var(--web-primary);
    border-color: var(--web-primary);
}

.btn-outline-primary:focus,
.btn-outline-primary.focus {
    box-shadow: 0 0 0 0 var(--web-primary);
}

.btn-outline-primary:not(:disabled):not(.disabled):active,
.btn-outline-primary:not(:disabled):not(.disabled).active,
.show > .btn-outline-primary.dropdown-toggle {
    background-color: var(--web-primary);
    border-color: var(--web-primary);
}

.btn-outline-primary:not(:disabled):not(.disabled):active:focus,
.btn-outline-primary:not(:disabled):not(.disabled).active:focus,
.show > .btn-outline-primary.dropdown-toggle:focus {
    box-shadow: 0 0 0 0 var(--web-primary);
}

.for-discount-value {
    background: var(--web-primary);
}

span.badge-accent {
    color: var(--base);
    background-color: var(--web-primary-40);
}

span.badge-accent:hover {
    color: var(--base) !important;
}

.custom-light-primary-color {
    background-color: var(--web-primary-10);
}

.custom-light-primary-color-20 {
    background-color: var(--web-primary-20);
}

.password-toggle-btn
    .custom-control-input:checked
    ~ .password-toggle-indicator {
    color: var(--web-primary);
}

.for-count-value {
    color: var(--web-primary);
}

.web--bg-primary {
    background-color: var(--web-primary);
}

.web--bg-secondary {
    background-color: var(--web-secondary);
}

.count-value {
    color: var(--web-primary);
}

@media (min-width: 768px) {
    .navbar-stuck-menu {
        background-color: var(--web-primary);
    }
}

@media (max-width: 767px) {
    .search_button .input-group-text i {
        color: var(--web-primary) !important;
    }
    .search_button .input-group-text i.text-absolute-white{
        color: #ffffff !important;
    }

    .mega-nav1 {
        color: var(--web-primary) !important;
    }

    .mega-nav1 .nav-link {
        color: var(--web-primary) !important;
    }
}

@media (max-width: 471px) {
    .mega-nav1 {
        color: var(--web-primary) !important;
    }

    .mega-nav1 .nav-link {
        color: var(--web-primary) !important;
    }
}

.text-align-direction {
    text-align: var(--text-align-direction) !important;
}

.web-direction {
    direction: var(--web-direction) !important;
}

.social-media:hover {
    color: var(--web-secondary) !important;
}

.bg-white-overlay-50 {
    background: rgba(255, 255, 255, 0.05);
}

.min-width-160px {
    min-width: 160px !important;
}

.tracking-page .closet {
    float: var(--text-align-direction-alt);
}

.checkout-details-page .nav-tabs {
    border: none;
}

.checkout-details-page .nav-tabs .nav-item {
    width: 49%;
    text-align: center;
}

.checkout-details-page .nav-tabs .nav-link::before {
    height: 0;
}

.checkout-details-page .nav-tabs .nav-link.active,
.nav-tabs .nav-item.show .nav-link {
    background: var(--web-primary);
    border-color: var(--web-primary);
}

.checkout-details-page .nav-tabs .nav-link {
    background: var(--web-secondary);
    border: 1px solid var(--web-secondary);
}

.bootstrap-select.dropdown.form-control button {
    border: 1px solid #e3e9ef !important;
}

.bootstrap-select.dropdown.form-control button:focus {
    outline: none !important;
    box-shadow: none;
}

@media (max-width: 600px) {
    .contact-us-page.sidebar_heading {
        background: var(--web-primary);
    }
}

.delete-account-dropdown-menu {
    width: 200px;
    min-width: 0 !important;
}

.checkout-steps.steps-light .step-item.active .step-count,
.checkout-steps.steps-light .step-item.active .step-progress {
    color: #ffffff;
    background-color: var(--web-primary);
}

.checkout-steps.steps-light .step-count,
.checkout-steps.steps-light .step-progress {
    color: #4f4f4f;
    background-color: rgba(225, 225, 225, 0.67);
}

.checkout-steps.steps-light .step-item.active.current {
    color: var(--web-primary) !important;
    pointer-events: none;
}

.checkout-steps.steps-light .step-item {
    color: #4f4f4f;
    font-size: 14px;
    font-weight: 400;
}
.customize-step{
    margin: 0 auto 20px;
    max-width: 600px;
}
.customize-step .step-item{
    width: 190px;
    text-align: center;
}
.customize-step .step-item .step-count{
    width: 30px;
    height: 30px;
    border: 2px solid var(--border1);
    background-color: var(--color-white);
}
.customize-step .step-item:not(:last-child)::before{
    position: absolute;
    content: "";
    top: 4px;
    inset-inline-start: 110px;
    width: 168px;
    height: 1px;
    border-top: 2px dashed var(--border1);

}
.customize-step .step-item.active::before{
    border-top: 2px solid var(--web-primary);
}
.customize-step .step-item .step-count i{
    opacity: 0;
}
.customize-step .step-item.active .step-count i{
    opacity: 1 !important;
}
.customize-step .step-item.active .step-count{
    background-color: var(--web-primary) !important;
}
.fw-medium{
    font-weight: 500 !important;
}
@media screen and (max-width: 767px) {
    .customize-step{
        max-width: 100%;
        display: flex;
        align-items: flex-start;
    }
    .customize-step .step-item{
        width: 100%;
        text-align: center;
    }
    .customize-step .step-item .step-count{
        width: 30px;
        height: 30px;
        border: 2px solid var(--border1);
        background-color: var(--color-white);
    }
    .customize-step .step-item:not(:last-child)::before{
        position: absolute;
        content: "";
        top: 4px;
        inset-inline-start: 110px;
        width: 100%;
        height: 1px;
        border-top: 2px dashed var(--border1);

    }
}
@media screen and (max-width: 575px) {
    .customize-step .step-item:not(:last-child)::before{
        position: absolute;
        content: "";
        top: 4px;
        inset-inline-start: 80px;
        width: 100%;
        height: 1px;
        border-top: 2px dashed var(--border1);
    }
}
@media screen and (max-width: 575px) {
    .customize-step .step-item:not(:last-child)::before{
        inset-inline-start: 60px;
        border-top: 2px dashed var(--border1);
    }
}

.list-group-flush .list-group-item li,
.list-group-flush .list-group-item li a {
    color: var(--web-primary);
}

.list-group-flush .list-group-item li,
.list-group-flush .list-group-item li a:hover {
    color: var(--web-secondary);
}

.order-summery-aside .cart_title {
    font-weight: 400 !important;
    font-size: 14px;
}

.order-summery-aside .cart_value {
    font-weight: 600 !important;
    font-size: 14px;
}

@media (max-width: 575px) {
    .order-summery-aside .cart_title,
    .order-summery-aside .cart_value {
        font-size: 14px;
    }
}

.order-summery-aside .__cart-total_sticky {
    position: sticky;
    top: 80px;
}

.order-details-nav.nav-menu > * {
    border: none;
    border-bottom: 2px solid transparent;
    background-color: transparent;
    padding: 0.5rem 0;
    color: #9b9b9b;
}

.order-details-nav.nav-menu > *.active {
    border-color: var(--web-primary);
    color: var(--web-primary);
    font-weight: 700;
}

.max-width-150px {
    max-width: 150px;
}

.max-width-200px {
    max-width: 200px;
}

.max-width-350px {
    max-width: 350px;
}
.max-width-500px {
    max-width: 500px;
}

.width-300px {
    width: 300px;
}

.height-100px {
    height: 100px;
}

.max-height-500px {
    max-height: 500px !important;
}

[dir="ltr"] .heading_search {
    padding: 10px 29px 10px 20px;
}

[dir="rtl"] .heading_search {
    padding: 10px 20px 10px 29px;
}

[dir="ltr"] .chat_ib {
    padding: 0 0 6px 15px;
}

[dir="rtl"] .chat_ib {
    padding: 0 15px 6px 0;
}

[dir="ltr"] .received_msg {
    padding: 0 0 0 10px;
}

[dir="rtl"] .received_msg {
    padding: 0 10px 0 0;
}

[dir="ltr"] .received_withdraw_msg p {
    padding: 4px 8px 3px 10px;
}

[dir="rtl"] .received_withdraw_msg p {
    padding: 4px 10px 3px 8px;
}

.msg_history {
    padding: 0 15px;
}

[dir="ltr"] .send_msg p {
    padding: 5px 10px 5px 12px;
}

[dir="rtl"] .send_msg p {
    padding: 5px 12px 5px 10px;
}

.p-12px {
    padding: 12px;
}

[dir="ltr"] .ps-12px {
    padding-left: 12px;
}

[dir="rtl"] .ps-12px {
    padding-right: 12px;
}

[dir="ltr"] .float-start {
    float: left;
}

[dir="rtl"] .float-start {
    float: right;
}

[dir="ltr"] .float-end {
    float: right;
}

[dir="rtl"] .float-end {
    float: left;
}

[dir="ltr"] .ms-auto {
    margin-left: auto;
}

[dir="rtl"] .ms-auto {
    margin-right: auto;
}

[dir="ltr"] .ms-2 {
    margin-left: 0.5rem !important;
}

[dir="rtl"] .ms-2 {
    margin-right: 0.5rem !important;
}

[dir="ltr"] .me-2 {
    margin-right: 0.5rem !important;
}

[dir="rtl"] .me-2 {
    margin-left: 0.5rem !important;
}

[dir="ltr"] .me-3 {
    margin-right: 1rem !important;
}

[dir="rtl"] .me-3 {
    margin-left: 1rem !important;
}

[dir="ltr"] .me-4 {
    margin-right: 1.5rem !important;
}

[dir="rtl"] .me-4 {
    margin-left: 1.5rem !important;
}

[dir="ltr"] .ps-0 {
    padding-left: 0 !important;
}

[dir="ltr"] .ps-1 {
    padding-left: 0.25rem !important;
}

[dir="ltr"] .ps-2 {
    padding-left: 0.5rem !important;
}

[dir="ltr"] .ps-3 {
    padding-left: 1rem !important;
}

[dir="ltr"] .ps-4 {
    padding-left: 1.5rem !important;
}

[dir="ltr"] .ps-5 {
    padding-left: 3rem !important;
}

[dir="rtl"] .ps-0 {
    padding-right: 0 !important;
}

[dir="rtl"] .ps-1 {
    padding-right: 0.25rem !important;
}

[dir="rtl"] .ps-2 {
    padding-right: 0.5rem !important;
}

[dir="rtl"] .ps-3 {
    padding-right: 1rem !important;
}

[dir="rtl"] .ps-4 {
    padding-right: 1.5rem !important;
}

[dir="rtl"] .ps-5 {
    padding-right: 3rem !important;
}

[dir="ltr"] .pe-0 {
    padding-right: 0 !important;
}

[dir="ltr"] .pe-1 {
    padding-right: 0.25rem !important;
}

[dir="ltr"] .pe-2 {
    padding-right: 0.5rem !important;
}

[dir="ltr"] .pe-3 {
    padding-right: 1rem !important;
}

[dir="ltr"] .pe-4 {
    padding-right: 1.5rem !important;
}

[dir="ltr"] .pe-5 {
    padding-right: 3rem !important;
}

[dir="rtl"] .pe-0 {
    padding-left: 0 !important;
}

[dir="rtl"] .pe-1 {
    padding-left: 0.25rem !important;
}

[dir="rtl"] .pe-2 {
    padding-left: 0.5rem !important;
}

[dir="rtl"] .pe-3 {
    padding-left: 1rem !important;
}

[dir="rtl"] .pe-4 {
    padding-left: 1.5rem !important;
}

[dir="rtl"] .pe-5 {
    padding-left: 3rem !important;
}

.category-list-in-header {
    padding: 10px;
    border: 1px solid #0000001f;
    width: 100%;
    cursor: pointer;
    background: white;
}

.min-width-600px {
    min-width: 600px;
}

.loading-parent {
    position: fixed;
    z-index: 9999;
    height: 100vh;
    top: 0;
    display: block;
    justify-content: center;
    align-items: center;
}

.loading-parent.d--none {
    display: none;
}

.loading-parent-first-div {
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
}

.payment-loading-parent {
    position: fixed;
    z-index: 9999;
    left: 40%;
    top: 37%;
    width: 100%;
}

[dir="ltr"] .navbar form .search_button {
    border-radius: 0 7px 7px 0;
    left: unset;
    right: 0;
    top: 0;
}

[dir="rtl"] .navbar form .search_button {
    border-radius: 7px 0 0 7px;
    right: unset;
    left: 0;
    top: 0;
}

.header-subcategories-links {
    font-family: sans-serif !important;
    font-size: 1rem;
    font-weight: 300;
    line-height: 1.5;
    margin-left: 50px;
}

.mt-minus-11px {
    margin-top: -11px;
}

[dir="ltr"] .dir-end-minus-7px {
    right: -7px;
}

[dir="rtl"] .dir-end-minus-7px {
    left: -7px;
}

.category-single-product-price {
    font-size: 12px !important;
    color: #9b9b9b !important;
}
.category-single-product-price.fs-14{
    font-size: 14px !important;
}

.modal-quick-view .modal-dialog {
    max-width: 850px !important;
}

.modal-quick-view .product-title2 {
    font-family: "Roboto", sans-serif !important;
    font-weight: 400 !important;
    font-size: 22px !important;
    color: #000000 !important;
    position: relative;
    display: inline-block;
    word-wrap: break-word;
    overflow: hidden;
    max-height: 1.2em;
    line-height: 1.2em;
}

.modal-quick-view .cz-product-gallery {
    display: block;
    max-height: 530px;
    overflow: hidden;
}

.modal-quick-view .cz-product-gallery .table-responsive {
    overflow: hidden;
    max-height: 80px;
}

.modal-quick-view .cz-preview {
    width: 100%;
    margin-top: 0;
    max-height: 100% !important;
}

.modal-quick-view .cz-preview-item > img {
    width: 100%;
}

.modal-quick-view .details {
    border: 1px solid #e2f0ff;
    border-radius: 3px;
    padding: 16px;
}

@media (max-width: 991px) {
    .modal-quick-view .details {
        border: none;
        border-radius: 0;
        padding: 0;
    }
}

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

.modal-quick-view .cz-thumblist-item {
    display: block;
    position: relative;
    width: 64px;
    height: 64px;
    margin: 0.625rem;
    transition: border-color 0.2s ease-in-out;
    border: 1px solid #e2f0ff;
    border-radius: 0.3125rem;
    text-decoration: none !important;
    overflow: hidden;
}

.modal-quick-view .for-hover-bg {
    font-size: 18px;
    height: 45px;
}

.modal-quick-view .cz-thumblist-item > img {
    display: block;
    width: 80%;
    transition: opacity 0.2s ease-in-out;
    max-height: 58px;
    opacity: 0.6;
}

@media (max-width: 767px) and (min-width: 576px) {
    .modal-quick-view .cz-preview-item > img {
        width: 100%;
    }
}

@media (max-width: 575px) {
    .modal-quick-view .cz-thumblist {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -ms-flex-pack: center;
        justify-content: center;
        padding-top: 1rem;
        padding-right: 22px;
        padding-bottom: 10px;
    }

    .modal-quick-view .cz-thumblist-item {
        margin: 0;
    }

    .modal-quick-view .cz-thumblist {
        padding-top: 8px !important;
    }

    .modal-quick-view .cz-preview-item > img {
        width: 100%;
    }
}

.product-details-seller-info {
    position: absolute;
    inset-inline-end: 24px;
    inset-block-start: -4px;
}

.image-default-bg-color {
    background-color: #1455ac10;
}

@media (min-width: 768px) {
    [dir="ltr"] .text-md-start {
        text-align: left !important;
    }
    [dir="rtl"] .text-md-start {
        text-align: right !important;
    }
}
.owl-theme .owl-nav *,
.owl-theme .owl-nav [class*="owl-"]:hover {
    background-color: var(--web-primary) !important;
}

.rating {
    cursor: pointer;
    --dir: right;
    --fill: #1455ac;
    --fillbg: rgba(100, 100, 100, 0.15);
    --star: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 17.25l-6.188 3.75 1.641-7.031-5.438-4.734 7.172-0.609 2.813-6.609 2.813 6.609 7.172 0.609-5.438 4.734 1.641 7.031z"/></svg>');
    --stars: 5;
    --starsize: 2.5rem;
    --symbol: var(--star);
    --value: 1;
    --w: calc(var(--stars) * var(--starsize));
    --x: calc(100% * (var(--value) / var(--stars)));
    block-size: var(--starsize);
    inline-size: var(--w);
    position: relative;
    touch-action: manipulation;
    -webkit-appearance: none;
}

[dir="rtl"] .rating {
    --dir: left;
}

.rating::-moz-range-track {
    background: linear-gradient(
        to var(--dir),
        var(--fill) 0 var(--x),
        var(--fillbg) 0 var(--x)
    );
    block-size: 100%;
    mask: repeat left center/var(--starsize) var(--symbol);
}

.rating::-webkit-slider-runnable-track {
    background: linear-gradient(
        to var(--dir),
        var(--fill) 0 var(--x),
        var(--fillbg) 0 var(--x)
    );
    block-size: 100%;
    mask: repeat left center/var(--starsize) var(--symbol);
    -webkit-mask: repeat left center/var(--starsize) var(--symbol);
}

.rating::-moz-range-thumb {
    height: var(--starsize);
    opacity: 0;
    width: var(--starsize);
}

.rating::-webkit-slider-thumb {
    height: var(--starsize);
    opacity: 0;
    width: var(--starsize);
    -webkit-appearance: none;
}

.rating,
.rating-label {
    display: block;
    font-family: ui-sans-serif, system-ui, sans-serif;
}

.rating-label {
    margin-block-end: 1rem;
}

.rating--nojs::-moz-range-track {
    background: var(--fillbg);
}

.rating--nojs::-moz-range-progress {
    background: var(--fill);
    block-size: 100%;
    mask: repeat left center/var(--starsize) var(--star);
}

.rating--nojs::-webkit-slider-runnable-track {
    background: var(--fillbg);
}

.rating--nojs::-webkit-slider-thumb {
    background-color: var(--fill);
    box-shadow: calc(0rem - var(--w)) 0 0 var(--w) var(--fill);
    opacity: 1;
    width: 1px;
}

[dir="rtl"] .rating--nojs::-webkit-slider-thumb {
    box-shadow: var(--w) 0 0 var(--w) var(--fill);
}

.top-1 {
    top: 0.5rem;
}

.left-1 {
    left: 0.5rem;
}

#dataTable_wrapper > .row:nth-child(1) {
    display: flex;
}
#dataTable_wrapper > .row:nth-child(1) #dataTable_length {
    display: none;
}
[dir="rtl"] div.dataTables_wrapper div.dataTables_filter {
    text-align: left !important;
    padding-inline-end: 0 !important;
}
[dir="rtl"]
    div.table-responsive
    > div.dataTables_wrapper
    > div.row
    > div[class^="col-"]:last-child {
    padding-left: 0;
}

[dir="rtl"] .cz-image-zoom {
    direction: rtl;
}

[dir="rtl"] .cz-image-zoom-pane {
    direction: ltr;
}

.social-share-popup {
    padding: 25px;
    width: 100%;
}

.social-share-popup :is(header, .icons, .field) {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.social-share-popup header {
    padding-bottom: 15px;
    border-bottom: 1px solid #ebedf9;
}
.social-share-popup header span {
    font-size: 21px;
    font-weight: 600;
}
.social-share-popup header .close,
.icons a {
    display: flex;
    align-items: center;
    border-radius: 50%;
    justify-content: center;
    transition: all 0.3s ease-in-out;
}
.social-share-popup header .close {
    color: #878787;
    font-size: 17px;
    background: #f2f3fb;
    height: 33px;
    width: 33px;
    cursor: pointer;
}
.social-share-popup header .close:hover {
    background: #ebedf9;
}
.social-share-popup .content {
    margin: 20px 0;
}
.social-share-popup .icons {
    display: flex;
    justify-content: center;
    margin: 15px 0 20px 0;
    gap: 1.5rem;
    list-style: none;
}
.social-share-popup .content p {
    font-size: 16px;
}
.social-share-popup .content .icons li a {
    height: 50px;
    width: 50px;
    font-size: 20px;
    text-decoration: none;
    border: 1px solid transparent;
}
.social-share-popup .icons li a i {
    transition: transform 0.3s ease-in-out;
}
.social-share-popup .icons li:nth-child(1) a {
    color: #1877f2;
    border-color: #b7d4fb;
}
.social-share-popup .icons li:nth-child(1):hover a {
    background: #1877f2;
}
.social-share-popup .icons li:nth-child(2) a {
    color: #46c1f6;
    border-color: #b6e7fc;
}
.social-share-popup .icons li:nth-child(2):hover a {
    background: #46c1f6;
}
.social-share-popup .icons li:nth-child(3) a {
    color: #e1306c;
    border-color: #f5bccf;
}
.social-share-popup .icons li:nth-child(3):hover a {
    background: #e1306c;
}
.social-share-popup .icons li:nth-child(4) a {
    color: #25d366;
    border-color: #bef4d2;
}
.social-share-popup .icons li:nth-child(4):hover a {
    background: #25d366;
}
.social-share-popup .icons li:nth-child(5) a {
    color: #0088cc;
    border-color: #b3e6ff;
}
.social-share-popup .icons li:nth-child(5):hover a {
    background: #0088cc;
}
.social-share-popup .icons li:hover a {
    color: #fff;
    border-color: transparent;
}
.social-share-popup .icons li:hover a i {
    transform: scale(1.2);
}
.social-share-popup .content .field {
    margin: 12px 0 -5px 0;
    height: 45px;
    border-radius: 4px;
    padding: 0 5px;
    border: 1px solid #e1e1e1;
}
.social-share-popup .field.active {
    border-color: #7d2ae8;
}
.social-share-popup .field i {
    width: 50px;
    font-size: 18px;
    text-align: center;
}
.social-share-popup .field.active i {
    color: #7d2ae8;
}
.social-share-popup .field input {
    width: 100%;
    height: 100%;
    border: none;
    outline: none;
    font-size: 15px;
}
.social-share-popup .field button {
    color: #fff;
    padding: 5px 18px;
    background: var(--base);
    border: 0;
    border-radius: 5px;
}

.user-profile-container {
    background: rgba(252, 252, 252, 1);
    direction: var(--web-direction);
}

.line-height-16 {
    line-height: 16px;
}

.customer-profile-wishlist .price-range,
.customer-profile-wishlist .price-range .fs-16 {
    font-size: 13px;
}

.customer-profile-wishlist .price-range del {
    font-size: 14px;
}
.customer-profile-wishlist .price-range .discounted-unit-price {
    font-size: 15px;
}

.customer-profile-orders .status-badge {
    height: 25px;
    padding: 3px 9px 3px 9px;
    border-radius: 5px;
}

.text-secondary-50 {
    color: rgba(155, 155, 155, 1);
}

.border-lighter {
    border: 1px solid rgba(20, 85, 172, 0.05);
}

.user-profile-aside .aside-link {
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
}

.user-profile-aside .active-menu .aside-link {
    font-weight: 600;
}

.shadow-border {
    border: 2px solid rgba(155, 155, 155, 0.05) !important;
}

.details-text-justify h1,
.details-text-justify h2,
.details-text-justify h3,
.details-text-justify h4,
.details-text-justify h5,
.details-text-justify h6 {
    text-align: start;
}

.max-height-100px {
    max-height: 100px;
    overflow: hidden;
}

.min-height-auto {
    min-height: auto !important;
}
.min-height-100px {
    min-height: 100px;
}
.max-height-200px {
    max-height: 200px;
    overflow: hidden;
}
.tio-star.text-star,
.tio-star.text-warning {
    color: rgba(255, 125, 30, 1) !important;
}

.map-area-alert-border {
    border: 2px solid transparent;
}

.map-area-alert-danger {
    border: 2px solid red;
    border-radius: 5px;
    overflow: hidden;
}

.location-search-input-field {
    top: 10px !important;
    outline: none;
    border: 1px solid #b1b1b1;
    padding: 5px 10px;
    left: 250px !important;
    height: 40px;
    font-size: 14px;
    
}

@media (max-width: 767px) {
    .gmnoprint.gm-style-mtc-bbw {
        display: none;
    }
    .location-search-input-field {
        left: 10px !important;
    }
}
.text-force-underline {
    text-decoration: underline !important;
}

.temporarily-closed-sticky-alert {
    position: absolute;
    top: 60px;
    width: 100%;
    padding: 15px;
}

.temporarily-closed-sticky-alert div.alert-box {
    background-color: rgba(254, 247, 209, 1);
    font-size: 12px;
    letter-spacing: 0.03125rem;
    font-weight: 500;
    padding: 20px;
    display: flex;
    gap: 1rem;
    justify-content: center;
    align-items: center;
}

.temporarily-closed-sticky-alert div.alert-box img {
    width: 25px;
}

.temporarily-closed-sticky-alert div button {
    background-color: transparent;
    border: 0;
    font-size: 14px;
    min-width: 20px;
}

.light-placeholder::-webkit-input-placeholder {
    color: var(--input-placeholder-color) !important;
    opacity: 0.3 !important;
}

.light-placeholder::-moz-placeholder {
    color: var(--input-placeholder-color) !important;
    opacity: 0.3 !important;
}

.light-placeholder:-ms-input-placeholder {
    color: var(--input-placeholder-color) !important;
    opacity: 0.3 !important;
}

.light-placeholder::-ms-input-placeholder {
    color: var(--input-placeholder-color) !important;
    opacity: 0.3 !important;
}

.light-placeholder::placeholder {
    color: var(--input-placeholder-color) !important;
    opacity: 0.3 !important;
}

@media (max-width: 575px) {
    .mobile-fs-12 {
        font-size: 12px !important;
    }
}

.search-result-product-button {
    width: 100%;
    display: grid;
    grid-template-columns: 1rem 1fr 2rem;
    gap: 0.5rem;
}

.search-bar-input {
    padding-right: 5rem !important;
}

@media (max-width: 767px) {
    .search-bar-input {
        padding-right: 1rem !important;
    }
}

#lightbox {
    display: flex;
    flex-direction: column-reverse;
}

.direction-ltr {
    direction: ltr !important;
}

.custom-cart-opacity-50 {
    opacity: 50%;
}

[dir="rtl"] .__chat-seller .aSend {
    transform: rotate(180deg);
}

.search-card.mobile-search-card {
    top: calc(100% - 1px);
    left: 0;
    position: absolute;
    background: white;
    z-index: 999;
    width: 100%;
    display: none;
}

[dir="rtl"] .category-wise-product-slider .owl-nav,
[dir="rtl"] .new-arrivals-product .owl-nav {
    display: flex !important;
}

.img-avatar-parent-element {
    aspect-ratio: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 77px;
}

.img-avatar-parent-element img {
    object-fit: cover;
    height: 100%;
    width: auto;
}
.owl-nav.disabled {
    display: none !important;
}

.alert--message-2 {
    border-left: 3px solid var(--base);
    border-radius: 6px;
    position: fixed;
    right: 20px;
    top: 80px;
    z-index: 9999;
    background: #fff;
    width: 80vw;
    display: flex;
    max-width: 330px;
    align-items: center;
    gap: 12px;
    padding: 16px;
    font-size: 12px;
    transition: all ease 0.5s;
    box-shadow: 0 0 2rem rgba(0, 0, 0, 0.075);
}

.alert--message-2 h6 {
    font-size: 14px;
}

.alert--message-2:not(.active) {
    transform: translateX(calc(100% + 40px));
}
.alert--container {
    position: fixed;
    right: 20px;
    top: 80px;
    z-index: 9999;
    width: 80vw;
    max-width: 330px;
}
.alert--container:not(.active) {
    opacity: 0;
    visibility: hidden;
}
.alert--container .alert {
    position: unset !important;
    top: unset !important;
    left: unset !important;
    right: unset !important;
    margin-bottom: 10px;
    width: 100% !important;
}

.alert--container .alert:not(.active) {
    display: none;
}
.w--0 {
    width: 0;
    flex-grow: 1;
}

.shop-head-check[type="checkbox"],
.shop-item-check[type="checkbox"] {
    cursor: pointer;
}

[dir="rtl"] .checkbox-color input {
    right: -9999px;
    left: auto;
    position: absolute;
}
[dir="rtl"] .checkbox-alphanumeric input {
    right: -9999px;
    left: auto;
    position: absolute;
}

.color-bs-primary-force,
.color-bs-primary-force:focus {
    color: var(--web-primary) !important;
}

.absolute-ltr {
    direction: ltr !important;
}

[dir="rtl"] input[type="tel" i] {
    direction: rtl;
}

body {
    word-break: break-word;
}

.rich-editor-html-content table {
    color: var(--title-color);
    max-width: 100% !important;
}

.rich-editor-html-content table > :not(caption) > * {
    border-width: var(--bs-border-width) 0;
}

.rich-editor-html-content table > :not(caption) > * > * {
    border-width: 0 var(--bs-border-width);
}

.rich-editor-html-content table {
    --bs-table-color: var(--bs-body-color);
    --bs-table-bg: transparent;
    --bs-table-border-color: var(--bs-border-color);
    --bs-table-accent-bg: transparent;
    --bs-table-striped-color: var(--bs-body-color);
    --bs-table-striped-bg: rgba(0, 0, 0, 0.05);
    --bs-table-active-color: var(--bs-body-color);
    --bs-table-active-bg: rgba(0, 0, 0, 0.1);
    --bs-table-hover-color: var(--bs-body-color);
    --bs-table-hover-bg: rgba(0, 0, 0, 0.075);
    width: 100%;
    margin-bottom: 1rem;
    color: var(--bs-table-color);
    vertical-align: top;
    border-color: var(--bs-table-border-color);
}

.rich-editor-html-content table > :not(caption) > * > * {
    padding: 0.5rem 0.5rem;
    background-color: var(--bs-table-bg);
    border-bottom-width: var(--bs-border-width);
    box-shadow: inset 0 0 0 9999px var(--bs-table-accent-bg);
}

.rich-editor-html-content table > tbody {
    vertical-align: inherit;
}

.rich-editor-html-content table > thead {
    vertical-align: bottom;
}

.rich-editor-html-content table {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.rich-editor-html-content li[data-list="bullet"] {
    list-style-type: disc !important;
}

.rich-editor-html-content li[data-list="unchecked"] {
    list-style-type: square !important;
}

.rich-editor-html-content p:has(img) {
    margin-bottom: 0;
}
.rich-editor-html-content img{
    max-width: 100%;
    min-width: 100px;
    height: auto;
    object-fit: cover;
    border-radius: 5px;
    border: 1px solid var(--bs-border-color, #EFF1F4);;
    /* margin-inline-end: 1rem; */
}

.rich-editor-html-content iframe {
    width: 100% !important;
    max-width: 50% !important;
    aspect-ratio: 16 / 9 !important;
    height: auto !important;
    border-radius: 5px;
    border: 1px solid var(--bs-border-color);
}

@media (max-width: 991px) {
    .rich-editor-html-content iframe {
        max-width: 100% !important;
    }
}

@media (max-width: 575px) {
    .rich-editor-html-content table {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    .rich-editor-html-content img {
        max-width: 100%;
    }
}

@media (max-width: 767px) {
    .rich-editor-html-content table {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}

@media (max-width: 991px) {
    .rich-editor-html-content table {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}

@media (max-width: 1199px) {
    .rich-editor-html-content table {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}

@media (max-width: 1399px) {
    .rich-editor-html-content table {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
}

.rich-editor-html-content table {
    table-layout: auto;
    width: 100%;
    border: 1px solid #e3e9ef;
}

.rich-editor-html-content table th, .rich-editor-html-content table td {
    border: 1px solid #e3e9ef;
}

.rich-editor-html-content table tbody tr td:first-child,
.rich-editor-html-content table tbody tr td:first-child strong {
    width: 1%;
    white-space: nowrap;
}

.embed-responsive {
    overflow: hidden;
}
.embed-responsive-16by9 {
    aspect-ratio: 16/9;
}

.embed-responsive-item {
    width: 100%;
}

.product-preview-modal-text {
    position: absolute;
    bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    z-index: 99;
    height: 76px;
    cursor: pointer;
    background: linear-gradient(
        180deg,
        rgba(255, 255, 255, 0) 0%,
        rgba(255, 255, 255, 0.5) 38%,
        rgba(255, 255, 255, 0.8) 69%,
        rgba(255, 255, 255, 0.9) 100%
    );
}

.product-preview-modal-text:hover span {
    transition: 0.5s ease-in-out all;
}

.product-preview-modal-text:hover span {
    scale: 1.05;
    font-weight: 700;
}

.digital-product-authors {
    display: flex;
    flex-wrap: wrap;
}

.digital-product-authors .digital-product-author-title {
    font-size: 14px;
    font-weight: 500;
    line-height: 18px;
    color: #828697;
    padding-inline-end: 10px;
}

.digital-product-authors .item-list a {
    font-size: 14px;
    font-weight: 600;
    line-height: 18px;
    text-align: center;
    color: #1e1e1e !important;
    position: relative;
    padding-inline-end: 10px;
    margin-inline-end: 5px;
}

.digital-product-authors .item-list a:after {
    content: "";
    width: 0;
    display: flex;
    height: 14px;
    border: 1px solid #b0c7e5;
    font-weight: 400 !important;
    position: absolute;
    bottom: 0;
    right: 0;
}

.digital-product-authors .item-list a:last-child:after {
    content: unset;
}

.product-categories-list {
    overflow: hidden scroll;
    max-height: 18rem;
}

.social-media-login-btn {
    background-color: #0000000a;
    width: 100%;
    gap: 0.85rem;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
    padding: 12px 15px 12px 15px;
}

.social-media-login-btn img {
    height: 30px;
    width: auto;
}

.social-media-login-btn .text {
    font-weight: 600;
    color: #334257;
}

.social-media-user-modal .image-box {
    display: flex;
    justify-content: center;
    margin-bottom: 1.5rem;
}
.social-media-user-modal .image-box img {
    --size: 80px;
    width: var(--size);
    height: var(--size);
    aspect-ratio: 1;
    object-fit: cover;
    border-radius: 100%;
    box-shadow: 0 2px 15px 0.1em #00000029;
}

.inset-inline-end-10px {
    inset-inline-end: 10px;
}

.grecaptcha-badge {
    display: none !important;
}
.request-restock-btn {
    position: relative;
    filter: brightness(1) !important;
    -webkit-filter: brightness(1) !important;
}
.request-restock-btn::before {
    position: absolute;
    content: "";
    inset: 0;
    background: var(--web-primary);
    opacity: 0.07;
    border-radius: inherit;
}

.input-required-icon {
    color: #d80000;
    vertical-align: middle;
    margin: 0;
    padding: 0;
}

.d--flex {
    display: flex;
}

@media (min-width: 576px) {
    .d--sm-flex {
        display: -ms-flexbox;
        display: flex;
    }

    .d--sm-block {
        display: block;
    }
}

.product-restock-request-section {
    display: flex;
    justify-content: center;
    gap: 1rem;
}

.custom-disabled {
    opacity: 0.65;
    box-shadow: none;
}

.clearance-sale-title-bg {
    background-size: contain;
    background-repeat: no-repeat;
    min-height: 83px;
    width: 220px;
    position: relative;
}

.clearance-sale-title-bg .title {
    position: absolute;
    bottom: 0.5rem;
    color: #fff;
    left: 20px;
    font-size: 18px;
    font-weight: 800;
    line-height: 21px;
}

.clearance-sale-title-bg .sub-title {
    position: absolute;
    bottom: 2.3rem;
    color: #1455ac;
    font-size: 12px;
    font-weight: 800;
    line-height: 19px;
    left: 1.25rem;
    text-align: center;
    width: 100px;
}

[dir="rtl"] .clearance-sale-title-bg {
    transform: scaleX(-1);
}

[dir="rtl"] .clearance-sale-title-bg .title,
[dir="rtl"] .clearance-sale-title-bg .sub-title {
    transform: scaleX(-1);
}

.fs-12 .discounted-unit-price,
.fs-12 .product-total-unit-price {
    font-size: 0.75rem !important;
}

.bg--light {
    background-color: #f8f8fa;
}
[theme="dark"].bg--light {
    background-color: #18181a;
}

.z-index-1 {
    z-index: -1;
}

.quantity-box-120 {
    width: 120px;
    min-width: 110px;
}

.clearance-sale-slider.owl-carousel .owl-stage {
    display: flex;
    height: 100%;
}
.clearance-sale-slider.owl-carousel.owl-drag .owl-item {
    display: grid;
    align-items: stretch;
}

.bg-count-light {
    background: rgba(236, 241, 246, 0.5);
}

.bg-count-light:focus,
.bg-count-light:hover {
    filter: none !important;
}

.max-height-420px {
    max-height: 420px;
}

.mt-80 {
    margin-top: 80px;
}

.mb-80 {
    margin-bottom: 80px;
}
.mb-50 {
    margin-bottom: 50px;
}

.mb-60 {
    margin-bottom: 60px;
}

.download-user-app {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 30px;
    border-radius: 5px;
    position: relative;
    overflow: hidden;
}

.download-user-app .download-user-main {
    position: relative;
    z-index: 2;
}
.download-user-app::after {
    position: absolute;
    content: "";
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(var(--primary-clr-rgb), 80%);
    z-index: 1;
}

.pe-5rem {
    padding-inline-end: 5rem;
}

@media (min-width: 992px) {
    .sticky-top-wrapper {
        position: sticky;
        top: 130px;
    }

    .sticky-top-wrapper.sticky-top-blog-details {
        top: 130px;
        margin-top: 150px;
    }
}

.aspect-2 {
    aspect-ratio: 2/1;
    object-fit: cover;
}

.border-top-before-after {
    position: relative;
}
.border-top-before-after::before,
.border-top-before-after::after {
    content: "";
    position: absolute;
    inset-inline-start: 0;
    inset-block-start: 0;
    border-top: 1px solid #d9d9d9;
    width: calc(50% - 140px);
    z-index: -1;
}
.border-top-before-after::after {
    inset-inline-start: unset;
    inset-inline-end: 0;
}

.blog-card {
    box-shadow: 0px 0px 6px 0px rgba(51, 66, 87, 0.07);
    border-radius: 15px;
}

.blog-card_image img {
    border-radius: 15px 15px 0 0;
}

.blog-card_footer {
    position: absolute;
    width: 100%;
    inset-inline-start: 0;
    padding-inline: 1rem;
    inset-block-end: 1rem;
}

.rounded-30 {
    border-radius: 30px;
}

.border-inline-end {
    border-inline-end: 1px solid rgba(38, 45, 52, 0.7);
}

@media (max-width: 575px) {
    .border-inline-end.pe-3 {
        border-inline-end: 0;
        padding-inline-end: 0;
    }
}

.ml-5 {
    margin-inline-start: 3rem !important;
}
@media (min-width: 991px) {
    .ml-lg-0 {
        margin-inline-start: 0 !important;
    }
}
.h-80px {
    height: 80px !important;
}

.article-nav-wrapper {
}
.article-nav-wrapper ul li {
    list-style: none;
}

.article-nav-wrapper ul li:not(:last-child) {
    margin-bottom: 20px;
}

.article-nav-wrapper ul li.active a {
    font-weight: 600;
    color: var(--base);
    border-bottom: 1px solid var(--base);
    padding: 0 0.5rem;
    margin-inline-start: 1rem;
    transition: all 0.3s ease-in-out;
}

.article-nav-wrapper_collapse {
    background-color: #fff;
    filter: drop-shadow(0px 10px 20px rgba(0, 0, 0, 0.1));
    width: 36px;
    height: 36px;
    transition: background 0.3s ease-in-out;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    display: none;
    position: fixed;
    inset-block-start: 190px;
    inset-inline-start: 1rem;
    z-index: 99;
}
.article-nav-wrapper_collapse:hover {
    border: 1px solid rgba(0, 0, 0, 0.1);
    background: #f6f6f6;
}
.article-nav-wrapper_collapse i {
    font-size: 1rem;
    line-height: 1;
    transition: all 0.3s ease-in-out;
}

@media (max-width: 991px) {
    .article-nav-wrapper_collapse {
        display: flex;
    }
    .article-nav-wrapper {
        position: fixed;
        width: 100%;
        inset-inline-start: 0;
        inset-block-start: 170px;
        z-index: 9;
    }
    .article-nav-wrapper ul {
        overflow-y: auto;
        max-height: 260px;
    }
}

.recent-post:not(:last-child) {
    margin-bottom: 20px;
}

.blog-top-nav {
    overflow-x: auto;
    white-space: nowrap;
    padding-inline-start: 0;
    padding-inline-end: 60px;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.blog-top-nav::-webkit-scrollbar {
    display: none;
}

.blog-top-nav li {
    list-style: none;
}
.blog-top-nav li.active a {
    color: #fff;
    background-color: var(--base);
}
.blog-top-nav li.active a span {
    opacity: 1 !important;
}

.blog-top-nav_next-btn,
.blog-top-nav_prev-btn {
    --justify-content: start;
    position: absolute;
    inset-block-start: 0;
    inset-inline-end: 0;
    width: 50px;
    height: 42px;
    padding: 0;
    display: none;
    justify-content: var(--justify-content);
    align-items: center;
    color: #fff;
    background-color: #f7f8fa;
    z-index: 100;
}

.blog-top-nav_next-btn {
    --justify-content: end;
    padding-inline-start: 0.75rem;
}

.blog-top-nav_prev-btn {
    --justify-content: start;
}

.blog-top-nav_next-btn button,
.blog-top-nav_prev-btn button {
    width: 39px;
    height: 39px;
    aspect-ratio: 1;
    background-color: var(--base);
    max-width: 39px;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.blog-top-nav_prev-btn {
    inset-inline-end: unset;
    inset-inline-start: 0;
}

.blog-top-nav_next-btn:hover,
.blog-top-nav_prev-btn:hover,
.blog-top-nav_next-btn:focus,
.blog-top-nav_prev-btn:focus,
.blog-top-nav_next-btn:active,
.blog-top-nav_prev-btn:active {
    color: #fff !important;
    background-color: #f7f8fa !important;
    border: none !important;
}

.blog-top-nav_next-btn button:hover,
.blog-top-nav_prev-btn button:hover,
.blog-top-nav_next-btn button:focus,
.blog-top-nav_prev-btn button:focus,
.blog-top-nav_next-btn button:active,
.blog-top-nav_prev-btn button:active {
    color: #fff !important;
    background-color: var(--base) !important;
    border: none !important;
}

.h-45px {
    height: 45px !important;
}

.blog-banner-search {
    margin-top: -40px;
    width: 70%;
}
@media (max-width: 575px) {
    .blog-banner-search {
        width: 90%;
        margin-top: 0;
    }
}

.text--primary {
    color: var(--base) !important;
}

.blog-banner-container {
    position: relative;
    overflow: hidden;
}
.blog-banner-svg {
    max-width: unset !important;
}

@media (min-width: 1400px) {
    .blog-banner-svg {
        width: 100%;
        height: auto;
    }
}

.blog-banner-content {
    position: absolute;
    inset-inline-start: 50%;
    inset-block-start: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
}

/* Transaction filter */
.transaction-filter_dropdown {
    min-width: 360px !important;
    transform: translate(0px, 45px) !important;
    right: 0 !important;
    left: auto !important;
}

[dir="rtl"] .transaction-filter_dropdown {
    right: auto !important;
    left: 0 !important;
}

@media (max-width: 575px) {
    .transaction-filter_dropdown {
        min-width: 100% !important;
    }
}

.max-h-290px {
    max-height: 290px;
}

.daterangepicker.show-calendar .drp-buttons {
    display: flex !important;
    align-items: center !important;
    justify-content: end !important;
}

.icon-absolute-on-right {
    position: absolute;
    font-size: 20px;
    opacity: 0.6;
    inset-inline-end: 15px;
    inset-block-start: 50%;
    transform: translateY(-50%);
    pointer-events: none;
}

.fs-20 {
    font-size: 20px !important;
}

#transactionFilterBtn .count {
    position: absolute;
    inset-inline-end: -4px;
    inset-block-start: -4px;
    width: 1rem;
    height: 1rem;
    font-size: 0.675rem;
    line-height: 1rem;
    border-radius: 50%;
    text-align: center;
    color: #fff;
}

.earn-checkbox {
    accent-color: var(--web-primary);
    width: auto;
}

#filterCloseBtn {
    width: 24px;
    height: 24px;
    background-color: #d9d9d9;
}

.gap-10 {
    gap: 10px !important;
}
.gap-30 {
    gap: 30px !important;
}


.letter-spacing-0 {
    letter-spacing: 0;
}

@media (max-width: 575px) {
    .fs-20-mobile {
        font-size: 1.25rem !important;
    }
    .fs-16-mobile {
        font-size: 1rem !important;
    }
    .fs-14-mobile {
        font-size: 0.875rem !important;
    }
    .fs-12-mobile {
        font-size: 0.75rem !important;
    }
}

/* Product page price range */
#price_range_slider {
    width: calc(100% - 16px);
    height: 3px;
    /* background: rgba(var(--primary-clr-rgb), 0.38); */
    position: relative;
}
[dir="rtl"] #price_range_slider {
    right: 16px;
}

#price_range_slider::after {
    content: "";
    inset-inline-start: 0;
    width: calc(100% + 15px);
    height: 100%;
    background: rgba(var(--primary-clr-rgb), 0.38);
    position: absolute;
}
[dir="rtl"] #price_range_slider::after {
    right: -15px;
}

#price_range_slider .slider-thumb {
    width: 1rem;
    height: 1rem;
    background: var(--base);
    border-radius: 50%;
    position: absolute;
    top: -5px;
    cursor: pointer;
}

#price_range_slider .slider-range {
    height: 3px;
    background: var(--base);
    position: absolute;
    top: 0;
}

.bg-black-09 {
    background-color: rgba(0, 0, 0, 0.09);
}

.form-control--sm {
    block-size: 1.875rem;
    font-size: 0.75rem;
}

.w-fit-content {
    width: fit-content !important;
}

.gap-12px {
    gap: 0.75rem !important;
}

.mb-12px {
    margin-bottom: 0.75rem !important;
}

.form-loading-button {
    transition: 1s ease-in-out all;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.form-loading-button .spinner-grow-sm,
.form-loading-button .loading {
    display: none;
}

.form-loading-button.active-loading .default {
    display: none;
}

.form-loading-button.active-loading .spinner-grow-sm,
.form-loading-button.active-loading .loading {
    display: block;
}

.form-loading-button.bg-primary {
    color: var(--primary-light);
}

.form-loading-button.bg-primary .spinner-grow {
    background-color: var(--web-primary);
}

.cursor-default {
    cursor: default !important;
}

.chatting-search-border {
    border: 2px solid #d3e8ff4d;
    border-radius: 5px;
}

.__color-9B9B9B {
    color: #9b9b9b;
}

.blog-single-card-item {
    cursor: pointer;
}

.business-pages-banner-section {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    --opacity: 0.5;
    --bg-color: 0, 0, 0;
    position: relative;
    z-index: 1;
    padding: 3rem;
    overflow: hidden;
    border-radius: 5px;
}

.business-pages-banner-section h1 {
    color: #ffffff;
    font-size: 1.75rem;
}

.business-pages-banner-section:after {
    inline-size: 100%;
    block-size: 100%;
    inset-inline-start: 0;
    inset-block-start: 0;
    position: absolute;
    z-index: -1;
    content: "";
    background-color: rgba(var(--bg-color), var(--opacity));
}

@media (max-width: 479px) {
    .business-pages-banner-section h1 {
        font-size: 1.5rem;
    }
}

.column-gap-5 {
    column-gap: 2rem !important;
}

.cz-countdown-value.fs-8{
    font-size: 0.5rem !important;
}

.h-40px{
    height: 40px !important;
}

.fs-15{
    font-size: 15px !important;
}
.product-card-shadow{
    box-shadow: 0 0 1.636px 0 rgba(145, 158, 171, 0.20), 0 8.179px 16.359px -2.454px rgba(145, 158, 171, 0.05) !important;
}

.border-black-50{
    border-color: rgba(0, 0, 0, 0.05) !important;
}

.product-with-bg .product-single-hover{
    background-color: #ffffff;
    padding: 0.5rem;
    border-radius: 5px;
    box-shadow: 0 0 1.636px 0 rgba(145, 158, 171, 0.20), 0 8.179px 16.359px -2.454px rgba(145, 158, 171, 0.05);
}

.product-with-bg img.border.border-black-50{
    border: none !important;
}

.search-rounded-10{
    --radius: 10px;
    border-radius: var(--radius);
}

.search-rounded-10 .search-page-button-input{
    border-radius: var(--radius);
}

.search-rounded-10 .search-page-button{
    border-radius: 0 var(--radius) var(--radius) 0;
}

[dir="rtl"] .search-rounded-10 .search-page-button {
    border-radius: var(--radius) 0 0 var(--radius);
}

.owl-theme .owl-nav .owl-prev,
.owl-theme .owl-nav .owl-next{
    --size: 40px;
    width: var(--size);
    height: var(--size);
    display: flex;
    justify-content: center;
    align-items: center;
}

.owl-theme .owl-nav .owl-prev i,
.owl-theme .owl-nav .owl-next i{
    font-size: 0.875rem !important;
    font-weight: 700;
    line-height: 1;
}

@media (max-width: 767px) {
    .owl-theme .owl-nav .owl-prev,
    .owl-theme .owl-nav .owl-next{
        --size: 30px;
    }

    .owl-theme .owl-nav .owl-prev i,
    .owl-theme .owl-nav .owl-next i{
        font-size: 0.75rem !important;
    }
}
@media (max-width: 539px) {

    #featured_products_list.owl-theme .owl-nav .owl-prev{
        transform: translateX(-30px);
    }
    #featured_products_list.owl-theme .owl-nav .owl-next {
        transform: translateX(30px);
    }
}

@media (max-width: 360px) {
        #featured_products_list {
        max-width: 200px;
    }
}

.__cart-total .order-summery-footer-image{
    width: 20px;
    height: 20px;
    margin: 0;
}

.shop-feature-faster{
    background-color: var(--light-box);
    padding: 12px 20px !important;
    gap: 10px;
}

.shop-feature-faster .inners{
    gap: 10px;
    font-size: 13px !important;
}

.select-wrap select{
    font-size: 14px;
}
.light-box{
    background-color: var(--light-box) !important;
}
.p-20{
    padding: 20px;
}
.min-height-74{
    min-height: 74px;
}
.w-24{
    width: 24px;
    min-width: 24px;
}
.offline_payment_button:hover,
.offline_payment_button.active{
    background-color: var(--web-primary) !important;
    color: var(--white-clr) !important;
    filter: brightness(1) !important;
}

.max-w-100px{
    max-width: 100px;
}
.p-xxl-4px{
    @media screen and (min-width: 1399px) {
        padding: 4px;
    }
}

.lh-19px{
    line-height: 19px;
}

.flash-deal-shadow{
    box-shadow: 0px 2px 8px rgba(0, 0, 0, 0.06) !important;
}
.h-24px{
    height: 24px;
}
.w-20px{
    width: 20px;
}
.h-20px{
    height: 20px;
}

.p-details-description p span{
    display: block;
    line-height: 24px;
}
.p-details-description h3 ul{
    padding-inline-start: 0;
}
.max-h-35vh {
    max-height: 35vh !important;
}

/*version 16.1*/

/* (Köhnə V1 :root silindi — tək mənbə aşağıdakı v4 :root, indi bənövşəyi) */

/* ---- Topbar gizlədilir ---- */
.topbar { display: none !important; }

/* ---- BODY ---- */
body { background-color: var(--sp-bg) !important; }


/* ---- DROPDOWN MENUS ---- */
.dropdown-menu { border: 1px solid var(--sp-border) !important; border-radius: var(--sp-radius) !important; }
.dropdown-item:hover, .dropdown-item:focus { background-color: var(--sp-accent-light) !important; color: var(--sp-primary) !important; }

/* ---- DÜYMƏLƏR ---- */
.btn--primary, button.btn--primary, a.btn--primary {
    background-color: var(--sp-primary) !important;
    border-color: var(--sp-primary) !important;
    border-radius: 5px !important;
}
.btn--primary:hover { background-color: var(--sp-primary-dark) !important; border-color: var(--sp-primary-dark) !important; }
.btn-primary { background-color: var(--sp-primary) !important; border-color: var(--sp-primary) !important; border-radius: 5px !important; }
.btn-primary:hover { background-color: var(--sp-primary-dark) !important; border-color: var(--sp-primary-dark) !important; }

/* ---- KARTLAR ---- */
.card { border-color: var(--sp-border) !important; border-radius: var(--sp-radius) !important; }
.section-card-margin, .__inline-62 {
    background-color: var(--sp-white) !important;
    border-radius: 5px !important;
    border: 1px solid var(--sp-border) !important;
    box-shadow: var(--sp-shadow) !important;
}
.__inline-62 .d-flex.justify-content-between {
    background: linear-gradient(90deg, var(--sp-primary) 0%, var(--sp-accent) 100%) !important;
    padding: 14px 16px 12px !important;
    border-radius: 5px 10px 0 0 !important;
}
.__inline-62 .feature-product-title, .__inline-62 h2 { color: #fff !important; }
.__inline-62 .view-all-btn-text { color: rgba(255,255,255,0.9) !important; }

/* ---- MƏHSUL KARTLARI (flash/featured deal, new arrivals — horizontal kart) ---- */
.flash_deal_product, .flash-deal-shadow {
    position: relative !important;
    background-color: #fff !important;
    border: 1px solid var(--sp-border) !important;
    border-radius: 5px !important;
    overflow: hidden !important;
    transition: box-shadow .2s, transform .2s, border-color .2s !important;
}
.flash_deal_product:hover {
    box-shadow: 0 6px 20px rgba(0,0,0,.10) !important;
    transform: translateY(-3px) !important;
    border-color: var(--sp-border-strong) !important;
}
.flash-product-title { font-size: 13.5px !important; font-weight: 600 !important; color: var(--sp-text) !important; }
.flash-product-price { color: var(--sp-text) !important; font-size: 16px !important; font-weight: 800 !important; }
.flash_deal_product del, .flash_deal_product .category-single-product-price {
    color: var(--sp-text-light) !important; font-weight: 400 !important;
}

/* Endirim tag — təmiz güclü qırmızı küncdə (sönük açıq-bənövşəyi əvəzinə) */
.for-discount-value {
    background-color: #EF4444 !important;
    color: #fff !important;
    border-radius: 6px 0 6px 0 !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
    padding: 3px 8px !important;
}
.flash_deal_product .for-discount-value {
    position: absolute !important;
    top: 0 !important;
    inset-inline-start: 0 !important;
    z-index: 2 !important;
}

/* ---- FOOTER ---- */
.page-footer.font-small, .custom-light-primary-color-20 { background-color: var(--sp-primary-dark) !important; }
.page-footer .footer-header { color: #fff !important; font-weight: 700 !important; border-bottom: 2px solid rgba(255,255,255,0.15) !important; padding-bottom: 8px !important; }
.page-footer a { color: rgba(255,255,255,0.72) !important; font-size: 13px !important; }
.page-footer a:hover { color: #fff !important; }
.page-footer p, .page-footer small, .page-footer li { color: rgba(255,255,255,0.72) !important; font-size: 13px !important; }
.page-footer h6 { color: #fff !important; }

/* ---- DİL SEÇİMİ (navbar-a əlavə edilmiş) ---- */
.sp-lang-dropdown { position: relative; }
.sp-lang-toggle {
    padding: 5px 8px !important;
    border-radius: 6px !important;
    background-color: rgba(255,255,255,0.12) !important;
    transition: background 0.18s;
    cursor: pointer;
    color: rgba(255,255,255,0.88) !important;
    font-size: 12px !important;
}
.sp-lang-toggle:hover { background-color: rgba(255,255,255,0.22) !important; }
.sp-lang-dropdown .dropdown-menu { min-width: 130px !important; padding: 6px 4px !important; }
.sp-lang-dropdown .dropdown-item { display: flex !important; align-items: center !important; gap: 8px !important; border-radius: 6px !important; padding: 7px 10px !important; }

/* ---- BREADCRUMB ---- */
.breadcrumb { background-color: transparent !important; }
.breadcrumb-item a { color: var(--sp-primary) !important; }

/* ---- PAGINATION ---- */
.page-link { color: var(--sp-primary) !important; border-color: var(--sp-border) !important; }
.page-link:hover { background-color: var(--sp-accent-light) !important; }
.page-item.active .page-link { background-color: var(--sp-primary) !important; border-color: var(--sp-primary) !important; color: #fff !important; }

/* ---- VIEW ALL linkləri ---- */
.view-all-btn-text, a.view-all-btn-text { color: var(--sp-primary) !important; font-weight: 600 !important; }
.view-all-btn-text:hover { color: var(--sp-accent) !important; }

/* ---- FOOTER FEATURE STRIP ---- */
.footer-slide-item { background-color: var(--sp-white) !important; border: 1px solid var(--sp-border) !important; border-radius: var(--sp-radius) !important; }
.footer-slide-item .text-primary { color: var(--sp-primary) !important; }

/* ---- MOBİL APP BAR ---- */
.app-bar, .__app-bar { background-color: var(--sp-white) !important; border-top: 1px solid var(--sp-border) !important; }
.app-bar .active, .__app-bar .active { color: var(--sp-primary) !important; }


/* ================================================================
   SP-HEADER v4: satasat.html → ağ + narıncı dizayn
================================================================ */

/* Rəng dəyişkənləri narıncıya yenilənir — satasat.html token sistemi */
:root {
    /* ============================================================
       MASTER BREND RƏNGİ — BÜTÜN SAYTI (header + home + hər şey)
       BURADAN DƏYİŞ. Aşağıdakı bütün rənglər bundan törəyir.
       ============================================================ */
    --brand:        #534AB7;                 /* əsas brend rəngi */
    --brand-dark:   #3D3498;                 /* hover / tünd */
    --brand-light:  #7F77DD;                 /* açıq accent */
    --brand-soft:   rgba(83,74,183,0.10);    /* yüngül fon */
    --brand-bar:    #e7e3f7;                  /* header zolağı (açıq lavanda) */

    /* Kontent eni — header + home + bütün sayt eyni endə (bir yerdən dəyiş).
       1470 = noon kontenti 1440 + 2×15px padding → real kontent sahəsi 1440 (noon ilə eyni). */
    --content-max:  1470px;

    /* --- aşағıdakılar master-dən törəyir, toxunma --- */
    --sp-primary:      var(--brand);
    --sp-primary-dark: var(--brand-dark);
    --sp-accent:       var(--brand-light);
    --sp-accent-light: var(--brand-soft);
    --sp-bg:           #F3F4F6;
    --sp-white:        #FFFFFF;
    --sp-border:       #E5E7EB;
    --sp-border-strong:#D1D5DB;
    --sp-text:         #111827;
    --sp-text-muted:   #4B5563;
    --sp-text-light:   #9CA3AF;
    --sp-shadow:       0 1px 3px rgba(0,0,0,0.08);
    --sp-shadow-hover: 0 4px 16px rgba(0,0,0,0.10);
    --sp-radius:       5px;
    --sp-radius-sm:    5px;
    --p:  var(--brand);
    --pd: var(--brand-dark);
    --pl: #EDEBF8;
    --pxl:#F6F5FC;
    --star: #F59E0B;
    --green: #22C55E;
}

/* ================================================================
   v4 GLOBAL FOUNDATION — satasat.html ölçü/şrift sistemi
================================================================ */

/* Şrift: Plus Jakarta Sans (bütün sayt) */
body,
.btn, button,
input, select, textarea,
h1, h2, h3, h4, h5, h6,
.nav-link, .dropdown-item,
.product-title, .product-name,
.feature-product-title {
    font-family: 'Nunito', system-ui, -apple-system, sans-serif !important;
}

/* Arxa fon: boz #F3F4F6 */
body { background-color: #F3F4F6 !important; }

/* Konteyner eni: 1280px (prototip kontent wrap) */
@media (min-width: 1280px) {
    .container { max-width: var(--content-max) !important; }
}

/* ================================================================
   HEADER · ÜST NAV  —  NOON KLON  (2026-06-22)
   ----------------------------------------------------------------
   noon.com/uae-en header-inin dəqiq ölçüləri (noon-ref/HEADER-SPEC.md).
   Rəng: noon sarısı → açıq lavanda zolaq + tünd mətn + bənövşəyi vurğu.
   RƏNG/ÖLÇÜ dəyişmək: yalnız aşağıdakı .sp-header token-ları.
   !important yalnız Figtree font üçün (qlobal foundation-u header daxilində əzir).
================================================================ */

.sp-header {
    /* dəyərlər master --brand-dən gəlir (:root). Rəngi :root-dan dəyiş. */
    --h-bar:           var(--brand-bar);       /* header zolağı (açıq lavanda) */
    --h-accent:        var(--brand);           /* bənövşəyi vurğu (logo, hover, focus) */
    --h-accent-dark:   var(--brand-dark);      /* hover tünd */
    --h-accent-soft:   var(--brand-soft);      /* yüngül hover fonu */
    --h-text:          #101628;                 /* əsas mətn (noon tünd) */
    --h-muted:         #5b5f6e;                 /* ikinci mətn / placeholder */
    --h-search-bg:     #ffffff;                 /* axtarış pill */
    --h-search-line:   rgba(14, 14, 14, .10);   /* axtarış haşiyəsi (noon #0e0e0e12) */
    --h-counter:       var(--brand);           /* sayğac nişanı */
    --h-hover-bg:      rgba(255, 255, 255, .55);/* lavanda üstündə yumşaq hover */
    --h-radius:        5px;                    /* noon: 12px */
    --h-bar-h:         60px;                    /* noon header hündürlüyü */
}

/* Figtree font (noon ilə eyni) — header daxilində qlobal foundation-u əzir.
   <i> və flaticon (fi-) elementləri çıxarılır ki, ikon font-ları (czi/tio/fi) qalsın. */
.sp-header,
.sp-header *:not(i):not([class*="fi-"]) { font-family: 'Nunito', "Helvetica Neue", Arial, sans-serif !important; }

/* ---- Sticky zolaq ---- */
/* BÜTÜN header (üst bar + kateqoriya barı) scroll-da FREEZE qalsın — sticky.
   .sp-header birbaşa <body> övladıdır, ancestor-da overflow yoxdur → sticky işləyir. */
.sp-header {
    position: sticky !important;
    top: 0;
    z-index: 1000;
    will-change: transform;              /* GPU layer — scroll-da flicker (yanıb-sönmə) olmasın */
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
.sp-header .sp-topnav {
    position: relative;   /* parent .sp-header sticky-dir; nested sticky flicker yaradırdı → relative */
    top: 0;
    z-index: 999;
    width: 100%;
    background: var(--h-bar);
}
.sp-header .sp-topnav-inner {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 8px;
    height: var(--h-bar-h);
    max-width: var(--content-max); /* site .container ilə eyni en (noon: 1440) */
    margin: 0 auto;
    padding: 0 15px;            /* site .container ilə eyni padding → logo hizada */
}

/* ---- Logo ---- */
.sp-header .sp-logo {
    flex-shrink: 0;
    margin-inline-end: 6px;
    text-decoration: none;
}
.sp-header .sp-logo-text {
    color: var(--h-accent);
    font-size: 24px;
    font-weight: 800;
    letter-spacing: -.5px;
    line-height: 1;
    white-space: nowrap;
}

/* ---- Location selector ("Deliver to") ---- */
.sp-header .sp-location {
    display: flex;
    align-items: center;
    gap: 6px;
    flex-shrink: 0;
    max-width: 190px;
    padding: 6px 8px;
    border-radius: 5px;
    color: var(--h-text);
    cursor: pointer;
    transition: background .15s;
}
.sp-header .sp-location:hover { background: var(--h-hover-bg); }
.sp-header .sp-location-pin { font-size: 19px; color: var(--h-accent); flex-shrink: 0; }
.sp-header .sp-location-text { display: flex; flex-direction: column; line-height: 1.15; min-width: 0; }
.sp-header .sp-location-label { font-size: 11px; font-weight: 500; color: var(--h-muted); }
.sp-header .sp-location-value {
    font-size: 14px;
    font-weight: 700;
    color: var(--h-text);
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}
.sp-header .sp-location-chev { font-size: 9px; opacity: .55; flex-shrink: 0; }

/* Location dropdown (məntəqə siyahısı + xəritədən seç) */
.sp-header .sp-location-drop { flex-shrink: 0; display: flex; align-items: center; }
.sp-header .sp-location-menu {
    width: 300px;
    margin-top: 6px;
    padding: 8px;
    border: 1px solid rgba(14, 14, 14, .08);
    border-radius: var(--h-radius);
    box-shadow: 0 8px 28px rgba(14, 14, 14, .16);
}
.sp-header .sp-loc-head {
    padding: 6px 10px 8px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .3px;
    text-transform: uppercase;
    color: var(--h-muted);
}
.sp-header .sp-loc-list { max-height: 320px; overflow-y: auto; }
.sp-header .sp-loc-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 9px 10px;
    border-radius: 5px;
    color: var(--h-text);
    text-decoration: none;
    cursor: pointer;
    transition: background .15s;
}
.sp-header .sp-loc-item:hover,
.sp-header .sp-loc-item.active { background: var(--h-accent-soft); }
.sp-header .sp-loc-item > i { font-size: 18px; color: var(--h-accent); flex-shrink: 0; }
.sp-header .sp-loc-info { display: flex; flex-direction: column; min-width: 0; }
.sp-header .sp-loc-name {
    font-size: 14px;
    font-weight: 600;
    color: var(--h-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.sp-header .sp-loc-item.active .sp-loc-name { color: var(--h-accent); }
.sp-header .sp-loc-company { font-weight: 500; color: var(--h-muted); }
.sp-header .sp-loc-sub {
    font-size: 12px;
    color: var(--h-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.sp-header .sp-loc-empty { padding: 12px 10px; font-size: 13px; color: var(--h-muted); }
.sp-header .sp-loc-map {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 6px;
    padding: 11px 10px;
    border-top: 1px solid rgba(14, 14, 14, .07);
    color: var(--h-accent);
    font-size: 14px;
    font-weight: 700;
    text-decoration: none;
}
.sp-header .sp-loc-map:hover { color: var(--h-accent-dark); }
.sp-header .sp-loc-map > i { font-size: 18px; }

/* ---- Axtarış (noon: ağ pill, ikon solda, 44px, radius 12) ---- */
.sp-header .sp-search-wrap { flex: 1 1 auto; min-width: 0; }
.sp-header .sp-search-wrap .search_form,
.sp-header .sp-search-wrap form { width: 100%; margin: 0; }
.sp-header .sp-search-bar {
    display: flex;
    align-items: center;
    height: 44px;
    width: 100%;
    background: var(--h-search-bg);
    border-radius: var(--h-radius);
    box-shadow: inset 0 0 0 1px var(--h-search-line);
    overflow: hidden;
    transition: box-shadow .15s;
}
.sp-header .sp-search-bar:focus-within { box-shadow: inset 0 0 0 1.5px var(--h-accent); }
.sp-header .sp-search-icon-btn {
    order: 0;
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    padding: 0 6px 0 16px;
    border: 0;
    background: transparent;
    color: var(--h-muted);
    font-size: 18px;
    cursor: pointer;
    transition: color .15s;
}
.sp-header .sp-search-icon-btn:hover { color: var(--h-accent); }
.sp-header .sp-search-icon-btn .czi-search { color: inherit; }
.sp-header .sp-search-bar .search-bar-input {
    order: 1;
    flex: 1 1 auto;
    min-width: 0;
    height: 100%;
    padding: 0 16px 0 4px;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    font-size: 16px;
    color: var(--h-text);
}
.sp-header .sp-search-bar .search-bar-input::placeholder { color: #8b8f9c; }
.sp-header .sp-search-bar .search-bar-input:focus { outline: 0; box-shadow: none; }
.sp-header .sp-search-bar .search-bar-input::-webkit-search-decoration,
.sp-header .sp-search-bar .search-bar-input::-webkit-search-cancel-button,
.sp-header .sp-search-bar .search-bar-input::-webkit-search-results-button {
    -webkit-appearance: none;
    display: none;
}
.sp-header .close-search-form-mobile { order: 2; color: var(--h-muted); }
.sp-header .search_button { display: none; }

/* ---- Sağ ikon qrupu ---- */
.sp-header .sp-actions {
    display: flex;
    align-items: center;
    flex-shrink: 0;
    gap: 2px;
}
.sp-header .sp-action,
.sp-header .sp-action .dropdown,
.sp-header .sp-cart-drop { display: flex; align-items: center; }
/* Səbət: klik shop-cart səhifəsinə gedir (data-toggle silindi); dropdown HOVER ilə açılır */
.sp-header .sp-cart-drop > .dropdown-menu { margin-top: 0; }
.sp-header .sp-cart-drop:hover > .dropdown-menu { display: block; }
.sp-header .sp-sep {
    width: 1px;
    height: 22px;
    margin: 0 6px;
    background: rgba(64, 69, 83, .22);
    flex-shrink: 0;
}

/* hər düymə: noon kimi horizontal (ikon + mətn yan-yana) */
.sp-header .sp-action-btn {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 6px;
    min-height: 44px;
    padding: 8px 10px;
    border: 0;
    border-radius: var(--h-radius);
    background: transparent;
    color: var(--h-text);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.2;
    white-space: nowrap;
    text-decoration: none;
    cursor: pointer;
    transition: background .15s, color .15s;
}
.sp-header .sp-action-btn:hover,
.sp-header .sp-action-btn:focus {
    background: var(--h-hover-bg);
    color: var(--h-accent);
    text-decoration: none;
}
.sp-header .sp-action-btn i {
    font-size: 22px;
    line-height: 1;
    color: var(--h-text);
    transition: color .15s;
}
.sp-header .sp-action-btn:hover i,
.sp-header .sp-action-btn:focus i { color: var(--h-accent); }
.sp-header .sp-action-btn .sp-avatar { width: 28px; height: 28px; border-radius: 50%; object-fit: cover; }
.sp-header .sp-action-btn .czi-arrow-down,
.sp-header .sp-action-btn .sp-chev { font-size: 9px; opacity: .55; }
.sp-header .sp-cart-btn.dropdown-toggle::after { display: none; }

/* ikon + sayğac nişanı (noon counter: 18px, top -8px) */
.sp-header .sp-ico { position: relative; display: inline-flex; align-items: center; }
.sp-header .sp-nav-badge {
    position: absolute;
    top: -8px;
    inset-inline-end: -9px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    border-radius: 100%;
    background: var(--h-counter);
    color: #fff;
    font-size: 10px;
    font-weight: 600;
    line-height: 1;
}

/* ---- Action dropdown-ları (dil / hesab) — noon: 240px, radius 12 ---- */
.sp-header .sp-action .dropdown-menu {
    min-width: 220px;
    border: 1px solid rgba(14, 14, 14, .08);
    border-radius: var(--h-radius);
    box-shadow: 0 4px 16px rgba(14, 14, 14, .12);
    padding: 8px 4px;
}
.sp-header .sp-action .dropdown-item {
    padding: 10px 16px;
    border-radius: 5px;
    font-size: 14px;
    font-weight: 600;
    color: var(--h-text);
}
.sp-header .sp-action .dropdown-item:hover,
.sp-header .sp-action .dropdown-item:focus {
    background: var(--h-accent-soft);
    color: var(--h-accent);
}
.sp-header .sp-action .dropdown-item.sp-logout { color: #f43333; }
.sp-header .sp-action .dropdown-item.sp-logout:hover { background: rgba(244, 51, 51, .08); color: #f43333; }

/* ---- Mobil ---- */
.sp-header .open-search-form-mobile a { color: var(--h-text); font-size: 22px; line-height: 1; }
.sp-header .navbar-toggler { border: 1px solid rgba(14, 14, 14, .15); }
.sp-header .navbar-toggler-icon {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%2816%2C22%2C40%2C0.9%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}
@media (max-width: 767px) {
    .sp-header .sp-topnav-inner { height: auto; padding: 10px 14px; gap: 10px; flex-wrap: wrap; }
    .sp-header .sp-location { display: none; }
    .sp-header .sp-action-btn .sp-action-label { display: none; }
    .sp-header .sp-search-wrap { order: 5; flex-basis: 100%; }
}

/* ================================================================
   KATEQORİYA NAV (2-ci sıra) — NOON SiteNavigation klonu
   noon: ağ zolaq, 44px, horizontal. Rəng: bənövşəyi vurğu (token-lər).
================================================================ */

/* Bar: ağ */
.sp-header .navbar.navbar-expand-md.navbar-stuck-menu,
.sp-header .navbar-stuck-menu {
    background-color: #fff !important;
    border-top: none !important;
    border-bottom: 1px solid var(--h-border) !important;
    box-shadow: none !important;
    padding: 0 !important;
    min-height: 44px !important;
}

/* Konteyner: header ilə eyni en/padding, horizontal */
.sp-header .navbar.navbar-expand-md .container,
.sp-header .navbar-stuck-menu .container,
.sp-header .navbar-stuck-menu .container.px-10px {
    display: flex !important;
    align-items: center !important;
    grid-template-columns: unset !important;
    max-width: var(--content-max) !important;   /* topnav + site .container ilə eyni en */
    width: 100% !important;
    margin: 0 auto !important;
    padding: 0 15px !important;     /* logo ilə eyni sol kənar */
}
.sp-header .navbar-stuck-menu .navbar-nav { align-items: center !important; }

/* Nav linklər: tünd mətn, accent hover (44px sıra) */
.sp-header .navbar-stuck-menu .navbar-nav > .nav-item > .nav-link,
.sp-header .navbar-stuck-menu .navbar-nav > .nav-item.active > .nav-link {
    color: var(--h-text) !important;
    font-size: 13.5px !important;
    font-weight: 500 !important;
    white-space: nowrap !important;
    padding: 9px 12px !important;
    border-radius: 5px !important;
    background: transparent !important;
    transition: background .15s, color .15s !important;
}
.sp-header .navbar-stuck-menu .navbar-nav > .nav-item > .nav-link:hover {
    color: var(--h-accent) !important;
    background: var(--h-accent-soft) !important;
}
.sp-header .navbar-stuck-menu .navbar-nav > .nav-item.active > .nav-link {
    color: var(--h-accent) !important;
    font-weight: 700 !important;
}

/* Dropdown trigger (Offers / Vendor Zone) */
.sp-header .navbar-stuck-menu .btn.dropdown-toggle {
    color: var(--h-text) !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    padding: 10px 14px !important;
    border: none !important;
    background: transparent !important;
    border-radius: 5px !important;
}
.sp-header .navbar-stuck-menu .btn.dropdown-toggle:hover {
    background: var(--h-accent-soft) !important;
    color: var(--h-accent) !important;
}

/* ---- noon-style sürüşən kateqoriya barı (catbar) ---- */
.sp-catbar {
    position: relative;
    display: flex;
    align-items: center;
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    height: 44px;
}
.sp-catbar-viewport {
    flex: 1 1 auto;
    min-width: 0;
    height: 44px;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.sp-catbar-viewport::-webkit-scrollbar { display: none; }
.sp-catbar-track {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    height: 44px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.sp-catbar-item { flex: 0 0 auto; }
.sp-catbar-link {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    height: 44px;
    padding: 0 12px;
    color: var(--h-text);
    font-size: 13.5px;
    font-weight: 500;
    white-space: nowrap;
    text-decoration: none;
    transition: color .15s;
}
.sp-catbar-link:hover,
.sp-catbar-item.has-children:hover > .sp-catbar-link { color: var(--h-accent); }
.sp-catbar-caret { font-size: 8px; opacity: .5; }
.sp-catbar-all { color: var(--h-accent); font-weight: 700; }
/* ilk kateqoriya logo ilə eyni sol kənardan başlasın (sol padding-i sıfırla) */
.sp-catbar-item:first-child .sp-catbar-link { padding-inline-start: 0; }

/* oxlar (gradient fade, yalnız lazım olanda görünür) */
.sp-catbar-arrow {
    position: absolute;
    top: 0;
    height: 44px;
    width: 44px;
    display: none;
    align-items: center;
    justify-content: center;
    border: 0;
    color: var(--h-text);
    cursor: pointer;
    z-index: 3;
    padding: 0;
}
.sp-catbar-prev { left: 0; justify-content: flex-start; background: linear-gradient(90deg, #fff 55%, rgba(255,255,255,0)); }
.sp-catbar-next { right: 0; justify-content: flex-end; background: linear-gradient(270deg, #fff 55%, rgba(255,255,255,0)); }
.sp-catbar-arrow.show { display: flex; }
.sp-catbar-arrow i { font-size: 13px; }
.sp-catbar-arrow:hover { color: var(--h-accent); }

/* DAŞMA FİKSİ: kateqoriya navbar flex zəncirinə min-width:0 — yoxsa .container flex item-i
   max-width-ini aşıb səhifəni enindən geniş edir (track çox olanda). Container öz max-width-ində
   qalır, daxili .sp-catbar-viewport overflow-x:auto ilə kəsir + oxlar görünür. */
.navbar.navbar-stuck-menu { min-width: 0; }
.navbar-stuck-menu > .container { min-width: 0; }
.navbar-stuck-menu .navbar-collapse { min-width: 0; overflow: visible; }
.sp-catbar { max-width: 100%; }
/* tutub sürüşdürmə üçün kursor + sürükləmədə mətn seçilməsin */
.sp-catbar-viewport { cursor: grab; }
.sp-catbar-viewport.sp-catbar-dragging { cursor: grabbing; }
.sp-catbar-dragging, .sp-catbar-dragging * { user-select: none; }
.sp-catbar-link { -webkit-user-drag: none; }

/* flyout (hover → alt kateqoriyalar, tam enli panel) */
.sp-catbar-flyout {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    z-index: 1001;
    display: none;
    background: #fff;
    border-top: 1px solid var(--h-border);
    box-shadow: 0 12px 28px rgba(14, 14, 14, .12);
    padding: 18px 24px;
}
.sp-catbar-flyout.show { display: block; }
.sp-catbar-flyout-inner {
    display: flex;
    flex-wrap: wrap;
    gap: 18px 36px;
    max-width: var(--content-max);
    margin: 0 auto;
}
.sp-catbar-col { display: flex; flex-direction: column; min-width: 140px; }
.sp-catbar-col-head {
    margin-bottom: 8px;
    color: var(--h-accent);
    font-size: 13.5px;
    font-weight: 700;
    text-decoration: none;
}
.sp-catbar-col-head:hover { text-decoration: underline; }
.sp-catbar-col-link {
    padding: 3px 0;
    color: var(--h-muted);
    font-size: 12.5px;
    text-decoration: none;
}
.sp-catbar-col-link:hover { color: var(--h-accent); }

/* mega-menyu brend zolağı (noon: kateqoriya altında loqolu brendlər) */
.sp-catbar-brands {
    max-width: var(--content-max);
    margin: 16px auto 0;
    padding-top: 14px;
    border-top: 1px solid var(--h-border);
}
.sp-catbar-brands-title {
    display: block;
    margin-bottom: 10px;
    color: var(--h-accent);
    font-size: 12.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .3px;
}
.sp-catbar-brands-row { display: flex; flex-wrap: wrap; gap: 6px; }
.sp-catbar-brand {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 200px;
    height: 100px;
    padding: 7px 10px;
    background: #fff;
    border: 1px solid var(--h-border);
    border-radius: 10px;
    transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.sp-catbar-brand:hover {
    border-color: var(--sp-primary, #534AB7);
    box-shadow: 0 4px 12px rgba(14, 14, 14, .1);
    transform: translateY(-1px);
}
.sp-catbar-brand img {
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    mix-blend-mode: multiply;   /* ağ fonlu loqolar kart-a təmiz otursun */
}

/* Məhsul səhifəsi — noon üslubu brend (başlığın üstündə, linkli) */
.sp-pd-brand {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
    font-size: 13px;
    font-weight: 600;
    color: var(--sp-primary, #534AB7);
    text-decoration: none;
    line-height: 1.2;
}
.sp-pd-brand:hover { color: var(--sp-primary, #534AB7); text-decoration: underline; }
.sp-pd-brand img {
    height: 24px;
    width: auto;
    max-width: 90px;
    object-fit: contain;
    mix-blend-mode: multiply;
}

/* ---- Mobil panel: ağ ---- */
@media (max-width: 767px) {
    .sp-header .navbar-expand-md .navbar-collapse {
        background-color: #fff !important;
        padding: 12px 16px 20px !important;
    }
    .sp-header .navbar-stuck-menu .container { padding: 0 14px !important; }
    .sp-header .navbar-stuck-menu .navbar-nav > .nav-item > .nav-link { color: var(--h-text) !important; }
}

/* ================================================================
   HOME · HERO BANNER SLIDER — noon AdBannerSlider klonu
   (tam enli, yuvarlaq künc, dairə oxlar, aşağı-mərkəz dot pill)
================================================================ */
/* Üst nazik sürüşkən banner (top strip) */
.sp-topstrip-section { margin-top: 4px; margin-bottom: -6px; }   /* navbar-a 4px; hero-ya: flex gap 10px - 6px = 4px (gap-20→10 dəyişəndən sonra düzəldildi, hero daşmasın) */
.sp-topstrip-item { display: block; border-radius: 5px; overflow: hidden; }
.sp-topstrip-item img { width: 100%; height: 50px; object-fit: cover; display: block; }
@media (max-width: 767px) { .sp-topstrip-item img { height: 28px; border-radius: 5px; } }

/* Hero sırası: sol slider + sağ yan reklam */
.sp-hero-row { display: flex; gap: 4px; align-items: stretch; }
.sp-hero-main { flex: 1; min-width: 0; }
.sp-hero-side { display: block; flex: 0 0 340px; border-radius: 5px; overflow: hidden; }
.sp-hero-side img { width: 100%; height: 250px; object-fit: cover; display: block; }
@media (max-width: 991px) {
    .sp-hero-row { flex-direction: column; }
    .sp-hero-side { flex-basis: auto; }
    .sp-hero-side img { height: 150px; }
}

.sp-hero .hero-slider { position: relative; }
/* yuvarlaqlığı KƏSƏN QUTUYA ver — slayd sürüşəndə də həmişə yuvarlaq qalır */
.sp-hero .hero-slider .owl-stage-outer { border-radius: 5px; }
.sp-hero .sp-hero-img {
    display: block;
    width: 100%;
    height: 250px;          /* hero hündürlüyü (dəyişmək üçün burada) */
    border-radius: 5px;
    object-fit: cover;
}
@media (max-width: 767px) {
    .sp-hero .hero-slider .owl-stage-outer { border-radius: 5px; }
    .sp-hero .sp-hero-img { height: 150px; border-radius: 5px; }
}

/* oxlar — təmiz ağ dairə + CSS şevron (font asılılığı yox) */
.sp-hero .owl-nav { margin: 0; }
.sp-hero .owl-nav button.owl-prev,
.sp-hero .owl-nav button.owl-next {
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;   /* sabit — hover-də tullanmasın */
    width: 38px;
    height: 38px;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, .6) !important;   /* 60% şəffaf */
    box-shadow: 0 2px 8px rgba(0, 0, 0, .18) !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    color: var(--sp-text) !important;
    transition: background .15s, color .15s !important;  /* transform animasiya olunmasın */
}
.sp-hero .owl-nav button.owl-prev { left: 24px; }
.sp-hero .owl-nav button.owl-next { right: 24px; }
.sp-hero .owl-nav button.owl-prev:hover,
.sp-hero .owl-nav button.owl-next:hover {
    background: rgba(255, 255, 255, .95) !important;   /* hover-də aydın */
    color: var(--sp-primary) !important;
    transform: translateY(-50%) !important;   /* hover-də pozisiya sabit */
}
/* czi çift-şevron ikonunu gizlə, əvəzinə təmiz CSS şevron */
.sp-hero .owl-nav button i { display: none !important; }
.sp-hero .owl-nav button::before {
    content: '';
    width: 9px;
    height: 9px;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
}
.sp-hero .owl-nav button.owl-prev::before { transform: rotate(-135deg); margin-inline-start: 3px; }
.sp-hero .owl-nav button.owl-next::before { transform: rotate(45deg); margin-inline-end: 3px; }

/* dots — yığcam qara pill, aktiv uzanmış ağ (noon) */
.sp-hero .owl-dots {
    position: absolute !important;
    bottom: 14px;
    left: 50%;
    transform: translateX(-50%);
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    width: auto !important;
    margin: 0 !important;
    padding: 6px 10px;
    background: rgba(0, 0, 0, .5);
    border-radius: 999px;
}
.sp-hero .owl-dots .owl-dot { margin: 0 !important; }
.sp-hero .owl-dots .owl-dot span {
    width: 6px !important;
    height: 6px !important;
    margin: 0 !important;
    background: rgba(255, 255, 255, .5) !important;
    border-radius: 50% !important;
    transition: width .25s, background .25s, border-radius .25s;
}
.sp-hero .owl-dots .owl-dot.active span {
    width: 14px !important;
    background: #fff !important;
    border-radius: 999px !important;
}

/* ================================================================
   HOME · təkrar-istifadəli təmiz BÖLMƏ BAŞLIĞI (noon) + KATEQORİYA STRIP
================================================================ */
.sp-section-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    margin: 18px 0 12px;
}
.sp-section-title {
    margin: 0;
    font-size: 20px;
    font-weight: 800;
    letter-spacing: -.3px;
    color: var(--sp-text);
    text-transform: capitalize;
}
.sp-section-link {
    flex-shrink: 0;
    font-size: 13.5px;
    font-weight: 700;
    color: var(--sp-primary);
    text-decoration: none;
    white-space: nowrap;
}
.sp-section-link:hover { color: var(--sp-primary-dark); text-decoration: underline; }

/* Kateqoriya strip — dairə ikonlar, üfüqi sürüşən */
.sp-catstrip {
    display: flex;
    gap: 6px;
    overflow-x: auto;
    scrollbar-width: none;
    -ms-overflow-style: none;
    padding-bottom: 6px;
}
.sp-catstrip::-webkit-scrollbar { display: none; }
.sp-catstrip-item {
    flex: 0 0 auto;
    width: 100px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 10px 6px;
    border-radius: 5px;
    color: var(--sp-text);
    text-decoration: none;
    transition: background .15s;
}
.sp-catstrip-item:hover { background: var(--sp-accent-light); }
.sp-catstrip-img {
    width: 76px;
    height: 76px;
    border-radius: 50%;
    background: #fff;
    border: 1px solid var(--sp-border);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.sp-catstrip-img img { width: 62%; height: 62%; object-fit: contain; }
.sp-catstrip-name {
    font-size: 12.5px;
    font-weight: 500;
    line-height: 1.25;
    text-align: center;
    color: var(--sp-text);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.sp-catstrip-item:hover .sp-catstrip-name { color: var(--sp-primary); }

/* ---- Category Tiles (noon curated tile karuseli) ---- */
.sp-tiles-section { margin-top: 10px; }
.sp-tiles { position: relative; }
.sp-tile { display: flex; flex-direction: column; align-items: center; gap: 8px; text-decoration: none; color: var(--sp-text); }
.sp-tile-img {
    width: 100%;
    aspect-ratio: 1 / 1;
    border-radius: 5px;
    overflow: hidden;
    background: linear-gradient(160deg, #efe9fb, #fbf7ff);
    display: block;
}
.sp-tile-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .25s; }
.sp-tile:hover .sp-tile-img img { transform: scale(1.05); }
.sp-tile-name {
    font-size: 13px;
    font-weight: 600;
    line-height: 1.25;
    text-align: center;
    color: var(--sp-text);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.sp-tile:hover .sp-tile-name { color: var(--sp-primary); }

/* tile oxlar — yan, dairə (şəklin mərkəzində) */
.sp-tiles .owl-nav { margin: 0; }
.sp-tiles .owl-nav button.owl-prev,
.sp-tiles .owl-nav button.owl-next {
    position: absolute !important;
    top: 42%;
    transform: translateY(-50%) !important;
    width: 36px;
    height: 36px;
    margin: 0 !important;
    padding: 0 !important;
    border-radius: 50% !important;
    background: #fff !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, .16) !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    color: var(--sp-text) !important;
    transition: color .15s !important;
}
.sp-tiles .owl-nav button.owl-prev { left: -6px; }
.sp-tiles .owl-nav button.owl-next { right: -6px; }
.sp-tiles .owl-nav button.owl-prev:hover,
.sp-tiles .owl-nav button.owl-next:hover { color: var(--sp-primary) !important; transform: translateY(-50%) !important; }
.sp-tiles .owl-nav button i { display: none !important; }
.sp-tiles .owl-nav button::before {
    content: '';
    width: 8px;
    height: 8px;
    border-top: 2px solid currentColor;
    border-right: 2px solid currentColor;
}
.sp-tiles .owl-nav button.owl-prev::before { transform: rotate(-135deg); margin-inline-start: 2px; }
.sp-tiles .owl-nav button.owl-next::before { transform: rotate(45deg); margin-inline-end: 2px; }

/* tile dots — altda */
.sp-tiles .owl-dots { text-align: center; margin-top: 10px; }
.sp-tiles .owl-dots .owl-dot span {
    width: 7px;
    height: 7px;
    margin: 0 3px;
    background: var(--sp-border);
    border-radius: 50%;
    transition: width .25s, background .25s, border-radius .25s;
}
.sp-tiles .owl-dots .owl-dot.active span {
    width: 18px;
    background: var(--sp-primary);
    border-radius: 999px;
}

/* ================================================================
   HOME · REKLAM / PROMO BANNERLƏRİ (noon — yuvarlaq, təmiz)
================================================================ */
.footer_banner_img,
.__inline-63 {
    border-radius: 5px !important;
}
/* promo banner slider — boşluq + noon dots */
.promotional-banner-slider .owl-item { padding: 0 6px; }
.promotional-banner-slider .owl-nav { display: none; }
.promotional-banner-slider .owl-dots { text-align: center; margin-top: 12px; }
.promotional-banner-slider .owl-dots .owl-dot span {
    width: 7px;
    height: 7px;
    margin: 0 3px;
    background: var(--sp-border);
    border-radius: 50%;
    transition: width .25s, background .25s, border-radius .25s;
}
.promotional-banner-slider .owl-dots .owl-dot.active span {
    width: 18px;
    background: var(--sp-primary);
    border-radius: 999px;
}

/* ================================================================
   HOME · PROMO ROW (3-sütun: reasons / mega deals / focus) — noon
================================================================ */
.sp-promo-row {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;  /* bərabər en */
    gap: 16px;
    align-items: stretch;                /* 3 sütun bərabər hündürlük */
    height: 480px;                       /* SABİT standart hündürlük (noon ~480) — uzanmır */
    margin-top: 10px;
}
.sp-promo-col { min-width: 0; min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
.sp-promo-head { margin: 0 0 10px; font-size: 17px; font-weight: 800; letter-spacing: -.3px; color: var(--sp-text); flex-shrink: 0; }

/* SOL — reasons 2×2 (sütunu sığışaraq doldurur) */
.sp-reasons-grid { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: minmax(0,1fr) minmax(0,1fr); gap: 12px; flex: 1; min-height: 0; }
.sp-reason {
    display: flex; flex-direction: column; gap: 6px; min-height: 0; overflow: hidden;
    background: #fff; border: 1px solid var(--sp-border); border-radius: 5px; padding: 8px;
    text-decoration: none; color: var(--sp-text);
    transition: box-shadow .2s, transform .2s;
}
.sp-reason:hover { box-shadow: 0 6px 18px rgba(0,0,0,.08); transform: translateY(-2px); }
.sp-reason-img { display: block; flex: 1; min-height: 0; border-radius: 5px; overflow: hidden; background: var(--pxl); }
.sp-reason-img img { width: 100%; height: 100%; object-fit: cover; }
.sp-reason-title { flex-shrink: 0; font-size: 13px; font-weight: 700; line-height: 1.2; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sp-reason-sub { flex-shrink: 0; font-size: 11.5px; line-height: 1.2; color: var(--sp-text-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* ORTA — mega deals temalı blok (sütunu sığışaraq doldurur) */
.sp-mega { height: 100%; min-height: 0; overflow: hidden; background: var(--brand-soft); border-radius: 5px; padding: 12px; display: flex; flex-direction: column; }
.sp-mega-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; flex-shrink: 0; }
.sp-mega-title { margin: 0; }
.sp-mega-shop {
    background: var(--sp-text); color: #fff; font-size: 12.5px; font-weight: 700;
    padding: 6px 12px; border-radius: 999px; text-decoration: none; white-space: nowrap;
    transition: background .15s;
}
.sp-mega-shop:hover { background: var(--sp-primary); color: #fff; }
.sp-mega-grid { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: minmax(0,1fr) minmax(0,1fr); gap: 10px; flex: 1; min-height: 0; }
.sp-mega-card {
    position: relative; display: flex; flex-direction: column; gap: 5px; min-height: 0; overflow: hidden;
    background: #fff; border-radius: 5px; padding: 8px;
    text-decoration: none; color: var(--sp-text); transition: box-shadow .2s;
}
.sp-mega-card:hover { box-shadow: 0 6px 18px rgba(0,0,0,.10); }
.sp-mega-tag {
    position: absolute; top: 8px; inset-inline-end: 8px; z-index: 2;
    background: var(--sp-text); color: #fff; font-size: 10px; font-weight: 700;
    padding: 2px 7px; border-radius: 5px;
}
.sp-mega-img { display: block; flex: 1; min-height: 0; border-radius: 5px; overflow: hidden; }
.sp-mega-img img { width: 100%; height: 100%; object-fit: cover; }
.sp-mega-name {
    flex-shrink: 0; font-size: 12px; font-weight: 500; line-height: 1.25; color: var(--sp-text);
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.sp-mega-price { flex-shrink: 0; display: flex; align-items: center; gap: 6px; }
.sp-mega-price del { font-size: 11.5px; color: var(--sp-text-light); }
.sp-mega-price b { font-size: 14px; font-weight: 800; color: var(--sp-text); }

/* SAĞ — focus banners (alt/üst, sütunu bərabər sığışaraq doldurur) */
.sp-focus-stack { display: flex; flex-direction: column; gap: 12px; flex: 1; min-height: 0; }
.sp-focus-banner { display: block; flex: 1; min-height: 0; border-radius: 5px; overflow: hidden; }
.sp-focus-banner img { width: 100%; height: 100%; object-fit: cover; display: block; }

@media (max-width: 991px) {
    .sp-promo-row { grid-template-columns: 1fr; height: auto; }
    .sp-promo-col { overflow: visible; }
    .sp-reasons-grid, .sp-mega-grid { grid-template-rows: auto auto; }
    .sp-reason-img, .sp-mega-img, .sp-focus-banner { min-height: 130px; }
}

/* ================================================================
   DEAL OF THE DAY — sol 1-kart deal modulu + sağ latest karusel
================================================================ */
/* stretch: sol deal kartı sağdakı karusel sütunu ilə EYNİ hündürlükdə olur (altı boş qalmır) */
.sp-dod-row { display: flex; gap: 16px; align-items: stretch; }
.sp-dod-deal {
    flex: 0 0 220px; display: flex; flex-direction: column; gap: 8px;
    background: #fff; border: 1px solid #ECEFF4; border-radius: 10px; padding: 10px;
}
/* şəkil sahəsi sabit nisbət yox, qalan bütün hündürlüyü doldurur → boşluğu şəkil udur */
.sp-dod-imgwrap {
    position: relative; display: flex; align-items: center; justify-content: center;
    flex: 1 1 auto; min-height: 220px;
    background: var(--brand-soft); border-radius: 8px; overflow: hidden;
}
.sp-dod-img { position: relative; z-index: 1; width: 100%; height: 100%; object-fit: contain; }
/* boşluq dolduran fon qatı: eyni şəklin blur-cover versiyası (scale blur kənarlarını gizlədir) */
.sp-dod-imgbg {
    position: absolute; inset: 0; width: 100%; height: 100%;
    object-fit: cover; filter: blur(16px) saturate(1.05);
    transform: scale(1.15); opacity: .6;
}
/* etiket: tam-enli bənövşəyi lent ƏVƏZİNƏ kiçik ağ pill (bənövşəyi tək düymədə qalsın) */
.sp-dod-label {
    position: absolute; left: 50%; transform: translateX(-50%); bottom: 8px; z-index: 2;
    background: rgba(255,255,255,.92); color: var(--sp-primary);
    font-size: 10px; font-weight: 700; padding: 4px 12px; border-radius: 999px;
    text-transform: uppercase; letter-spacing: .4px; white-space: nowrap;
    box-shadow: 0 1px 4px rgba(0,0,0,.08);
}
.sp-dod-imgwrap .for-discount-value {
    position: absolute; top: 0; inset-inline-start: 0; z-index: 2;
    background: #EF4444; color: #fff; font-size: 11px; font-weight: 700;
    padding: 3px 7px; border-radius: 5px 0 5px 0;
}
/* ad/qiymət qonşu məhsul kartları ilə eyni: sola hizalı */
.sp-dod-name {
    display: block; text-align: start; font-size: 13px; font-weight: 600; color: #212121;
    text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.sp-dod-price { text-align: start; }
.sp-dod-price del { font-size: 11px; color: #9CA3AF; margin-inline-end: 4px; }
.sp-dod-price b { font-size: 16px; font-weight: 700; color: #101628; }
.sp-dod-btn { width: 100%; border-radius: 5px !important; font-size: 13px !important; font-weight: 600 !important; padding: 8px !important; }
.sp-dod-latest { flex: 1; min-width: 0; }
.sp-dod-latest .sp-section-head { margin-top: 0; }
.sp-dod-carousel { position: relative; }
.sp-dod-carousel .owl-nav button.owl-prev,
.sp-dod-carousel .owl-nav button.owl-next {
    position: absolute !important; top: 36%; transform: translateY(-50%) !important;
    width: 34px; height: 34px; margin: 0 !important; padding: 0 !important; border-radius: 50% !important;
    background: #fff !important; box-shadow: 0 2px 8px rgba(0,0,0,.15) !important;
    display: flex !important; align-items: center; justify-content: center; color: var(--sp-text) !important;
}
.sp-dod-carousel .owl-nav button.owl-prev { left: -6px; }
.sp-dod-carousel .owl-nav button.owl-next { right: -6px; }
.sp-dod-carousel .owl-nav button:hover { color: var(--sp-primary) !important; transform: translateY(-50%) !important; }
.sp-dod-carousel .owl-nav button i { display: none !important; }
.sp-dod-carousel .owl-nav button::before { content: ''; width: 8px; height: 8px; border-top: 2px solid currentColor; border-right: 2px solid currentColor; }
.sp-dod-carousel .owl-nav button.owl-prev::before { transform: rotate(-135deg); }
.sp-dod-carousel .owl-nav button.owl-next::before { transform: rotate(45deg); }
@media (max-width: 991px) {
    .sp-dod-row { flex-direction: column; }
    .sp-dod-deal { flex-basis: auto; max-width: 240px; }
}

/* ================================================================
   FLASH DEAL — sol (countdown üstdə + banner altda) / sağ (4 məhsul)
================================================================ */
/* sağ: 4 sabit noon-eni məhsul; sol: qalan bütün en (countdown rahat) */
.sp-flash { display: grid; grid-template-columns: 1fr auto; gap: 16px; align-items: stretch; }
.sp-flash-left { display: flex; flex-direction: column; gap: 6px; min-height: 0; }   /* countdown↔banner boşluğu yarıya (12→6) */
.sp-flash-countdown { display: block; text-decoration: none; flex-shrink: 0; }
/* min-height:0 → sol blokun hündürlüyünü artıq KARTLAR təyin edir (countdown sabit, banner flex ilə qalanı doldurur)
   → sol blok ümumi hündürlük = yanındakı məhsul kartı boyda (align-items:stretch ilə) */
.sp-flash-banner { display: block; flex: 1; min-height: 0; border-radius: 5px; overflow: hidden; position: relative; }
.sp-flash-banner img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; }
.sp-flash-right { display: grid; grid-template-columns: repeat(4, 210px); gap: 12px; }
@media (max-width: 1199px) {
    .sp-flash { grid-template-columns: 1fr; }
    .sp-flash-right { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 767px) {
    .sp-flash-right { grid-template-columns: repeat(2, 1fr); }
}

/* ================================================================
   SP PRODUCT CARDS v4 — satasat.html pcard dizaynı
================================================================ */

/* Kart (noon): HAŞİYƏSİZ, boz portret şəkil sahəsi + altda mətn, düymə dibdə */
.product-single-hover {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;        /* konteyneri (owl-item / grid col) doldurur → düymə dibdə */
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 0 12px !important;   /* altda nəfəs payı — "Add to cart" konteyner kənarına yapışmasın */
    overflow: visible !important;
    box-shadow: none !important;
}
.product-single-hover:hover { transform: none !important; box-shadow: none !important; }
.product-single-hover > .overflow-hidden {
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    /* ƏSL KLİP SƏBƏBİ: theme.css:8913 .overflow-hidden{overflow:hidden} bu wrapper-i kəsirdi
       (uzadılmış kartlarda margin-top:auto düyməni kənara itələyib sub-piksel kəsirdi).
       Şaquli aç (düymə görünsün), üfüqi saxla (şəkil hover scale-i .inline_product ayrıca klip edir). */
    overflow-x: clip !important;
    overflow-y: visible !important;
}
/* "Add to cart" / "Select options" düyməsini kartın dibinə itələ (hamısı bir xətdə) */
.product-single-hover .single-product-details .product-cart-option-container,
.product-single-hover .single-product-details > a.btn--primary {
    margin-top: auto !important;
}

/* Şəkil sahəsi: açıq boz fon, PORTRET (3:4), yuvarlaq, məhsul mərkəzdə (contain) */
/* STANDART 3:4 portret (en 3 : hündür 4) — foto çəkilişdə hər cihazda rahat seçilən nisbət;
   noon-un 136.375%-indən cəmi ~2% fərqlənir. padding-bottom trick — flex-də UZANMAZ, sabit */
.product-single-hover .inline_product {
    position: relative !important;
    flex: 0 0 auto !important;
    width: 100% !important;
    height: 0 !important;
    padding-bottom: 133.333% !important;   /* standart 3:4 portret (en:hündür = 3:4) */
    background: #f0f0f0 !important;         /* noon --color-neutral-100 */
    border-radius: 5px !important;
    overflow: hidden !important;
}
.product-single-hover .inline_product > a {
    position: absolute !important;
    inset: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 100% !important;
}
/* MƏHSUL ŞƏKLİ — padding-trick qutusunu doldurur.
   "a img" scope-u: məhsul şəkli həmişə <a href=product> içindədir; icon-lar (h-16px svg,
   <a>-sız btn-circle) bu scope-a düşmür → təbii istisna, :not() lazım deyil.
   ABSOLUTE inset:0 → aradakı wrapper-lərdən (məs. div.d-flex.pb-0) asılı olmadan
   birbaşa .inline_product-u (yeganə position:relative) doldurur.
   BÜTÜN 5 kart şablonunda işləyir: feature / category / filter / inline. */
.product-single-hover .inline_product a img:not(.pcImgCarousel__img) {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: auto !important;
    object-fit: contain !important;
    border: none !important;
    border-radius: 0 !important;
    transition: transform .3s ease !important;
    z-index: 1 !important;
}
.product-single-hover:hover .inline_product a img:not(.pcImgCarousel__img) { transform: scale(1.05) !important; }
/* quick-view overlay — TƏK blok: qutunu doldurur (göz düyməsi düzgün yerləşsin) AMMA SÖNDÜRÜLÜB:
   şəffaf fon + pointer-events:none → mavi pərdə yox, kliklər şəkil/karuselə keçir. */
.product-single-hover .quick-view,
.product-single-hover:hover .quick-view {
    inset: 0 !important;
    width: auto !important;
    height: auto !important;
    background: transparent !important;
    pointer-events: none !important;
    z-index: 2 !important;
}

/* ===== noon-üslubu PER-KART ŞƏKİL KARUSELİ (CSS scroll-snap + delegated JS) =====
   padding-trick qutusunu doldurur (absolute inset:0). Slaydlar üfüqi sürüşür (scroll-snap). */
.product-single-hover .inline_product .pcImgCarousel {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    overflow: hidden !important;
    z-index: 1 !important;
}
.pcImgCarousel__slides {
    display: flex !important;
    width: 100%;
    height: 100%;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
    touch-action: pan-x;
}
.pcImgCarousel__slides::-webkit-scrollbar { display: none; }
.pcImgCarousel__slide {
    flex: 0 0 100%;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    scroll-snap-align: center;
}
/* noon: şəkil width:auto height:100% mərkəzdə, contain (yüksək specifity ilə absolute qaydanı əzir) */
.product-single-hover .inline_product .pcImgCarousel__img {
    position: static !important;
    inset: auto !important;
    width: auto !important;
    height: 100% !important;
    max-width: 100% !important;
    margin: auto !important;
    object-fit: contain !important;
    border: none !important;
    border-radius: 0 !important;
}
/* pagination nöqtələri — aktivdən uzaqlaşdıqca kiçilir (noon görüntüsü) */
.pcImgCarousel__pagination {
    position: absolute;
    left: 50%;
    bottom: 8px;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 4px 6px;
    background: rgba(255,255,255,.55);
    border-radius: 16px;
    z-index: 3;
}
.pcImgCarousel__bullet {
    width: 4px; height: 4px;
    border-radius: 20px;
    background-color: rgba(14,14,14,.28);
    transition: all .2s ease;
    cursor: pointer;
    flex: 0 0 auto;
}
.pcImgCarousel__bullet.is-active { width: 12px; background-color: #0e0e0e; border-radius: 16px; }
.pcImgCarousel__bullet.is-edge-1 { width: 3px; height: 3px; }
.pcImgCarousel__bullet.is-edge-2 { width: 2px; height: 2px; }
/* prev/next ox-lar — yalnız hover-da (desktop) */
.pcImgCarousel__arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 28px; height: 28px;
    padding: 0;
    display: flex; align-items: center; justify-content: center;
    border: none; border-radius: 50%;
    background: rgba(255,255,255,.92);
    box-shadow: 0 1px 4px rgba(0,0,0,.2);
    color: #0e0e0e;
    font-size: 12px;
    line-height: 1;
    cursor: pointer;
    opacity: 0; visibility: hidden;
    transition: opacity .15s ease, visibility .15s ease;
    z-index: 4;
}
/* ox ikonu düymə içində tam mərkəzdə */
.pcImgCarousel__arrow i { display: block; line-height: 1; margin: 0; }
.pcImgCarousel__arrow--prev { left: 6px; }
.pcImgCarousel__arrow--next { right: 6px; }
.inline_product:hover .pcImgCarousel__arrow { opacity: .65; visibility: visible; }  /* 65% şəffaflıq */
.inline_product:hover .pcImgCarousel__arrow:hover { opacity: 1; }                   /* ox üstündə tam görünsün */
@media (hover: none) { .pcImgCarousel__arrow { display: none; } }

/* mouse ilə tutub sürüşdürmə (desktop; touch onsuz da native scroll-snap ilə işləyir) */
.pcImgCarousel__slides { cursor: grab; }
.pcImgCarousel__slides.is-dragging { cursor: grabbing; scroll-behavior: auto; scroll-snap-type: none; }
.pcImgCarousel__slides.is-dragging .pcImgCarousel__slide { pointer-events: none; }
.pcImgCarousel__slide, .pcImgCarousel__slide img { -webkit-user-drag: none; user-drag: none; user-select: none; }

/* ===== Wishlist ürəyi (noon: sağ-üst) ===== */
.product-single-hover .sp-wish-btn {
    position: absolute !important;
    top: 8px; right: 8px;
    width: 30px; height: 30px;
    display: flex; align-items: center; justify-content: center;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: rgba(255,255,255,.85);
    box-shadow: 0 1px 4px rgba(0,0,0,.12);
    cursor: pointer;
    z-index: 5;
    transition: background .15s ease, transform .15s ease;
}
.product-single-hover .sp-wish-btn:hover { background: #fff; transform: scale(1.08); }
.product-single-hover .sp-wish-btn i { font-size: 15px; line-height: 1; color: var(--sp-primary); }
.product-single-hover .sp-wish-btn i.fa-heart { color: #EF4444; }

/* ===== Marketing tag badge — noon nudge kimi ANİMASİYALI növbələşmə (cycle) =====
   Konteyner sabit hündürlük + overflow:hidden; badge-lər absolute üst-üstə, yalnız .is-show görünür;
   JS (custom.js) hər ~2.6s növbəti badge-ə keçir. Tək badge-də statik qalır. */
.sp-mtags { position: relative; height: 16px; margin: 0; overflow: hidden; }
.sp-mtag {
    position: absolute; left: 0; top: 0;
    /* !important VACİB: style.css:115 `.product-single-hover .single-product-details a`
       (display:-webkit-box; font-size:.875rem; line-height:1.5rem) bu badge-i əzir →
       14px/24px edib 14px qutuda kəsirdi. Aşağıdakılar onu geri qaytarır. */
    display: inline-flex !important; align-items: center; gap: 3px;   /* icon + yazı EYNİ AXİS (mərkəzdə) */
    padding: 0 6px; border-radius: 4px;
    font-size: 10px !important; font-weight: 500; line-height: 16px !important;   /* qutu 16px — 1.5x ikon (13.5px) sığsın; mətn 10px qalır */
    -webkit-line-clamp: none !important;
    text-decoration: none !important; white-space: nowrap;
    opacity: 0; transform: translateY(6px);
    transition: opacity .45s ease, transform .45s ease;
    pointer-events: none;
}
.sp-mtag.is-show { opacity: 1; transform: translateY(0); pointer-events: auto; }
.sp-mtag:hover { text-decoration: none !important; filter: brightness(1.06); }
.sp-mtag-icon { height: 13.5px; width: auto; max-width: 18px; object-fit: contain; display: inline-block; }
/* tag səhifəsi başlığı: böyük + STATİK (cycle yox, .sp-mtags-dan kənarda) */
.sp-mtag--lg {
    position: static; opacity: 1; transform: none; pointer-events: auto;
    font-size: 14px; padding: 5px 12px; border-radius: 6px; line-height: 1.4;
}
.sp-mtag--lg .sp-mtag-icon { height: 16px; max-width: 20px; }

/* (quick-view söndürülməsi yuxarıdakı tək blokda birləşdirildi — təkrar qayda silindi) */
.product-single-hover .quick-view-tag { display: none !important; }
/* quick-view göz düyməsi — wishlist ürəyinin YANINDA (sağ-üst), həmişə görünür
   (Polad: bütün şəklə tünd hover pərdəsi lazım deyil) */
.product-single-hover .quick-view .action-product-quick-view {
    position: absolute !important;
    top: 8px !important;
    right: 44px !important;          /* ürəyin solunda: heart right:8 + 30 + 6 */
    left: auto !important;
    bottom: auto !important;
    width: 30px !important;
    height: 30px !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    background: rgba(255,255,255,.85) !important;
    border-radius: 50% !important;
    box-shadow: 0 1px 4px rgba(0,0,0,.12) !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    pointer-events: auto !important;  /* parent .quick-view pe:none-u ləğv et */
    z-index: 5 !important;
}
.product-single-hover:hover .quick-view .action-product-quick-view {
    transform: none !important;
    opacity: 1 !important;
}
.product-single-hover .quick-view .action-product-quick-view i {
    font-size: 15px !important;
    color: var(--sp-primary) !important;
    margin: 0 !important;
}
.product-single-hover .quick-view .action-product-quick-view:hover { background: #fff !important; transform: scale(1.08) !important; }

/* Detal sahəsi: şəkildən 8px, kiçik yan padding.
   flex-sütun + flex:1 → bütün artıq hündürlüyü BURA udur (ad↔düymə arası boş qalır), düymə dibdə */
.product-single-hover .single-product-details {
    padding: 0 2px !important;
    margin-top: 8px !important;
    display: flex !important;
    flex-direction: column !important;
    flex: 1 1 auto !important;
    min-height: 0 !important;
    gap: 3px !important;   /* bütün elementlər (ad/reytinq/rəy/badge/qiymət) arası bərabər 3px */
}
/* uşaq margin-larını sıfırla — yalnız yuxarıdakı gap boşluğu idarə etsin */
.product-single-hover .single-product-details > * { margin-top: 0 !important; margin-bottom: 0 !important; }
/* Reytinq sətri: hündürlük 12px, ulduzlar 12px, mətn (ulduz+bal) şaquli MƏRKƏZDƏ */
.product-single-hover .rating-show {
    height: 12px !important;
    display: flex !important;
    align-items: center !important;
    padding: 0 !important; margin: 0 !important;
}
.product-single-hover .rating-show > span { line-height: 1 !important; padding: 0 !important; margin: 0 !important; }
.product-single-hover .rating-show i { font-size: 12px !important; line-height: 1 !important; vertical-align: middle; }
.product-single-hover .rating-show .badge-style { font-size: 10px !important; padding: 0 !important; }
/* Qiymət bloku: sıx sətir; badge↔qiymət də digərləri kimi 3px (flex gap idarə edir, əlavə margin yox) */
.product-single-hover .product-price {
    height: 18px !important;            /* qiymət sətrinin hündürlüyü = 18px */
    display: flex !important;
    align-items: center !important;     /* del + cari qiymət şaquli mərkəzdə, tək sətir */
    gap: 4px !important;                /* köhnə ↔ cari qiymət arası */
    line-height: 1 !important;
    padding: 0 !important;
}
.product-single-hover .single-product-details > div:has(.product-price) { margin-top: 0 !important; padding: 0 !important; }

/* Məhsul adı: noon 16px / 500 / lh 20, 2 sətir */
.product-single-hover h3 a,
.product-single-hover h3 a:hover {
    font-size: 16px !important;
    font-weight: 500 !important;
    color: #212121 !important;
    line-height: 20px !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-decoration: none !important;
}

/* Rəy sayı sətri: hündürlük 13px, mətn şaquli MƏRKƏZDƏ; sığmasa kəsilir */
.product-single-hover .sp-review-count {
    margin-top: 0;
    height: 13px;
    display: flex;
    align-items: center;       /* mətn şaquli mərkəzdə */
    line-height: 1;
    font-size: 10px;
    color: var(--sp-text-muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Cari qiymət: kiçildildi (18→15px) + line-height:1 (slack/boşluq getsin, az yer tutsun) */
.product-single-hover .product-price .text-dark,
.product-single-hover .product-price .text-accent {
    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    color: #101628 !important;
}

/* Köhnə (üstüxətli) qiymət: noon 11px, açıq boz */
.product-single-hover .category-single-product-price,
.product-single-hover .product-price del {
    font-size: 11px !important;
    color: #9CA3AF !important;
    font-weight: 400 !important;
}

/* Endirim badge: qırmızı künc */
.product-single-hover .for-discount-value {
    background: #EF4444 !important;
    color: #fff !important;
    border-radius: 5px 0 5px 0 !important;
    font-size: 11.5px !important;
    font-weight: 700 !important;
    padding: 3px 7px !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    z-index: 2 !important;
}

/* Səbətə əlavə düyməsi: outline bənövşəyi, hover-da dolu */
.product-single-hover .btn--primary {
    background: var(--pxl) !important;
    color: var(--sp-primary) !important;
    border: 1.5px solid var(--sp-primary) !important;
    border-radius: 5px !important;
    font-size: 12.5px !important;
    font-weight: 600 !important;
    padding: 6px 10px !important;
}
.product-single-hover .btn--primary:hover {
    background: var(--sp-primary) !important;
    color: #fff !important;
}

/* Owl product karusellərində kartlar BƏRABƏR hündürlük — owl-un init height baqını həll edir
   (uzun kartın "Add to cart"-ı kəsilmir, hover-siz tam görünür).
   category-wise-product-slider = kateqoriya bölmələri + clearance (eyni class-ı paylaşır). */
.featured_products_listSlide .owl-stage,
.sp-dod-carousel .owl-stage,
.category-wise-product-slider .owl-stage,
.new-arrivals-product .owl-stage,
.flash-deal-slider .owl-stage { display: flex !important; }
.featured_products_listSlide .owl-item,
.sp-dod-carousel .owl-item,
.category-wise-product-slider .owl-item,
.new-arrivals-product .owl-item,
.flash-deal-slider .owl-item { display: flex !important; height: auto !important; }
.featured_products_listSlide .owl-item > div,
.sp-dod-carousel .owl-item > div,
.category-wise-product-slider .owl-item > div,
.new-arrivals-product .owl-item > div,
.flash-deal-slider .owl-item > div { width: 100% !important; }
/* (.product-single-hover height:100% kart base blokuna köçürüldü — təkrar selektor aradan qaldırıldı) */

/* ================================================================
   SP SECTION HEADERS v4 — bölmə başlıqları
================================================================ */

/* Bölmə kartı: ağ fon, yuvarlaq, kölgə */
.section-card-margin,
.__inline-62 {
    background: #ffffff !important;
    border-radius: 5px !important;
    border: 1px solid #E5E7EB !important;
    overflow: hidden !important;
}
/* Bölmə qutusu daxili boşluqlar = ~10px (üst və alt).
   Üst: feature-product üst 6px + carousel-wrap p-1 (4px) = 10px.
   Alt: bölmə kartının alt padding-i 6px + carousel-wrap p-1 (4px) = 10px (aşağıda scoped). */
.section-card-margin .feature-product,
.__inline-62 .feature-product {
    padding: 6px 20px 0 !important;
}
/* Section-card kartlarının alt nəfəs payı 6px (Latest/category öz universal 12px-ini saxlayır) */
.section-card-margin .product-single-hover,
.__inline-62 .product-single-hover {
    padding-bottom: 6px !important;
}

/* ===== DÜYMƏ KƏSİLMƏSİ (Latest + Category) — overflow:hidden şaquli kəsirdi =====
   Həll: üfüqi kəsməni saxla (clip), şaquli aç (visible). Tema da qonşu karusellərə eyni edib. */
/* Latest (sp-dod): owl-stage-outer overflow:hidden idi → şaquli aç (oxlar sibling, təsirlənmir) */
.sp-dod-carousel .owl-stage-outer {
    overflow-x: clip !important;
    overflow-y: visible !important;
}
/* Category + Clearance qutusu (.__p-20px overflow:hidden) → şaquli aç + 10px spacing.
   Üst 10px (başlıq üstü), alt 4px + kart 6px = 10px (kart altı). */
.__shadow-2 > .__p-20px {
    padding: 10px 20px 4px !important;
    overflow-x: clip !important;
    overflow-y: visible !important;
}
.__shadow-2 > .__p-20px .product-single-hover {
    padding-bottom: 6px !important;
}
/* Başlıq ALTI = ÜST (10px). Header align-center (başlıq sətri dolur, baseline asimmetriyası yoxdur);
   karusel wrapper margin-top = 10px (box padding-top 10px ilə eyni). */
.__shadow-2 > .__p-20px > .mt-2 {
    margin-top: 10px !important;
}
.__shadow-2 > .__p-20px > .d-flex.align-items-baseline {
    align-items: center !important;
}

/* Modullar arası şaquli boşluq yarıya endirildi (home gap-20 → 10px) */
.__inline-61 {
    gap: 10px !important;
}

/* Footer 3-blok (About/Contact/FAQ) wrapper-inə ÜST boşluq = ALT boşluq (pb-4 = 24px).
   4-blok gizlənəndən sonra üst buffer getmişdi ("footerə yapışırdı") → simmetrik etdik. */
.__inline-9 > .text-center {
    padding-top: 1.5rem !important;
}

/* ===== FOOTER: logo böyüt + Contact altı social ikonlar böyüt ===== */
/* Logo: 46px → 60px (QEYD: ağ qutu logo ŞƏKLİNİN öz fonudur — admin → Business Settings-də
   şəffaf fonlu (transparent) footer logo yüklə, CSS ilə silinmir) */
/* Logo şəkli ləğv edildi → ağ "Satasat" brend mətni, column başlıqları ilə eyni hizada (hər ikisi sütun yuxarısında) */
.sp-footer-brand {
    display: inline-block;
    color: #fff !important;
    font-size: 48px;
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: .3px;
}
.sp-footer-brand-link, .sp-footer-brand-link:hover { text-decoration: none !important; }
.sp-footer-brand-link:hover .sp-footer-brand { opacity: .9; }
/* copyright logo/brend altında, eyni hizada, dibdə (mt-auto); alt boşluq ~10px (row pb-3 16px-i -6px ilə azaldır) */
.footer-web-logo .sp-footer-copyright { margin-top: auto !important; margin-bottom: -6px !important; padding-top: 16px; opacity: .85; }

/* Contact sütununun altındakı social ikonlar — böyüdülmüş + 30px aşağı */
.sp-footer-social { gap: 8px; align-items: center; margin-top: 30px !important; }
.sp-footer-social .social-btn {
    width: 2.625rem !important;
    height: 2.625rem !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}
.sp-footer-social .social-btn > i,
.sp-footer-social .social-btn svg { font-size: 18px !important; width: 18px; height: 18px; line-height: 1 !important; }

/* Bölmə başlığı çubuğu */
.section-card-margin .d-flex.justify-content-between,
.__inline-62 > .d-flex.justify-content-between {
    background: var(--sp-primary) !important;
    border-radius: 11px 11px 0 0 !important;
    padding: 10px 16px !important;
    margin-bottom: 0 !important;
}

/* Başlıq mətni: ağ */
.section-card-margin .feature-product-title,
.section-card-margin h2,
.section-card-margin h3,
.__inline-62 .feature-product-title,
.__inline-62 h2,
.__inline-62 h3 {
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #ffffff !important;
    margin: 0 !important;
}

/* "Hamısına bax" linki: ağ */
.section-card-margin .view-all-btn-text,
.__inline-62 .view-all-btn-text {
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 600 !important;
}
.section-card-margin .view-all-btn-text:hover,
.__inline-62 .view-all-btn-text:hover {
    color: rgba(255,255,255,0.8) !important;
}

/* ============================================================
   Kateqoriya/axtarış filtr paneli — collapse + çox-seçim checkbox
   ============================================================ */
.sp-fbox-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    user-select: none;
    padding: 2px 0;
}
.sp-fbox-head h6 { transition: color .15s ease; }
.sp-fbox-head:hover h6 { color: #534AB7; }
.sp-fbox-caret {
    font-size: 12px;
    color: #9CA3AF;
    transition: transform .2s ease;
}
.sp-fbox.is-collapsed .sp-fbox-body { display: none; }
.sp-fbox.is-collapsed .sp-fbox-caret { transform: rotate(-90deg); }
.sp-fbox-body { margin-top: 10px; }
.sp-fbox-list { max-height: 220px; margin: 0; padding: 0; }
.sp-filter-check-item { list-style: none; padding: 3px 0; }
.sp-filter-check {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    color: #4B5563;
}
.sp-filter-check input[type="checkbox"] {
    width: 15px;
    height: 15px;
    accent-color: #534AB7;
    flex: 0 0 auto;
    cursor: pointer;
}
.sp-filter-check .line--limit-2 { line-height: 1.3; }
/* rəng filtri nöqtəsi (swatch) */
.sp-color-dot { display: inline-block; width: 14px; height: 14px; border-radius: 50%; border: 1px solid #d0d0d0; flex: 0 0 auto; }
/* "Tətbiq et" düyməsi — filtr panelinin altında həmişə görünsün */
.sp-apply-filters {
    position: sticky;
    bottom: 8px;
    z-index: 3;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    box-shadow: 0 4px 14px rgba(83, 74, 183, 0.25);
}

/* ============================================================
   SEBET (CART) — noon uslubu  [sp-cart-*]
   Sol: magaza qrupu kartlari + mehsul kartlari (sekil+qty, sagda qiymet)
   Sag: Order Summary sticky kart + Checkout + kupon
   ============================================================ */

/* ---------- Sol teref: magaza qrupu karti ---------- */
.sp-cart-list .sp-cart-group {
    background: var(--sp-white) !important;
    border: 1px solid var(--sp-border) !important;
    border-radius: 12px !important;
    box-shadow: var(--sp-shadow) !important;
    padding: 0 !important;
    overflow: hidden;
}
.sp-cart-list .sp-cart-group .card-header {
    background: var(--sp-white) !important;
    border: 0 !important;
    border-bottom: 1px solid var(--sp-border) !important;
    padding: 14px 16px !important;
    border-radius: 0 !important;
}
.sp-cart-list .sp-cart-group .card-header a.text-primary {
    color: var(--sp-primary) !important;
    font-weight: 600 !important;
}

/* ---------- Mehsul karti setri ---------- */
.sp-cart-items { padding: 4px 16px; }
.sp-cart-item {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 18px 0;
}
.sp-cart-item.sp-cart-item-sep { border-top: 1px solid var(--sp-border); }

.sp-cart-check {
    width: 18px;
    height: 18px;
    margin-top: 4px;
    flex: 0 0 auto;
    accent-color: var(--sp-primary);
    cursor: pointer;
}

.sp-cart-media {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    width: 156px;
}
.sp-cart-thumb {
    display: block;
    width: 156px;
    height: 156px;
    border: 1px solid var(--sp-border);
    border-radius: 8px;
    background: #fff;
}
.sp-cart-thumb img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    border-radius: 8px;
    padding: 6px;
}

/* qty stepper — noon pill */
.sp-cart-qty {
    border: 1px solid var(--sp-border);
    border-radius: 22px;
    height: 38px;
    width: 132px;
    gap: 0 !important;
    justify-content: space-between !important;
    padding: 0 4px;
    background: #fff;
}
.sp-cart-qty .qty_minus,
.sp-cart-qty .qty_plus,
.sp-cart-qty > span {
    width: 30px;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: var(--sp-primary);
    font-size: 15px;
}
.sp-cart-qty .qty_input {
    border: 0 !important;
    outline: 0 !important;
    text-align: center;
    width: 44px;
    height: 100%;
    padding: 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--sp-text);
    background: transparent;
}

.sp-cart-info {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.sp-cart-name {
    color: var(--sp-text) !important;
    font-size: 16px;
    font-weight: 500;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.sp-cart-name:hover { color: var(--sp-primary) !important; }
.sp-cart-variant { color: var(--sp-text-muted); font-size: 13px; }
.sp-cart-ship { color: var(--sp-text-muted); font-size: 13px; }

.sp-cart-price {
    flex: 0 0 auto;
    text-align: right;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 3px;
    min-width: 120px;
}
.sp-cart-price-now { font-size: 20px; font-weight: 700; color: var(--sp-text); }
.sp-cart-price-meta { display: flex; align-items: center; gap: 8px; }
.sp-cart-off { color: var(--green); font-size: 14px; font-weight: 600; }
.sp-cart-old { color: var(--sp-text-light); font-size: 14px; text-decoration: line-through; }
.sp-cart-line { color: var(--sp-text-muted); font-size: 13px; margin-top: 2px; }
.sp-cart-line b { color: var(--sp-text); }

/* ---------- Sag teref: Order Summary ---------- */
.sp-summary-card {
    background: var(--sp-white) !important;
    border: 1px solid var(--sp-border) !important;
    border-radius: 12px !important;
    box-shadow: var(--sp-shadow) !important;
    padding: 18px !important;
}
.sp-summary-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
}
.sp-summary-title { font-size: 18px; font-weight: 700; color: var(--sp-text); }
.sp-summary-badge {
    font-size: 12px;
    font-weight: 600;
    color: var(--sp-primary);
    background: var(--brand-soft);
    padding: 3px 10px;
    border-radius: 20px;
}
.sp-summary-saved {
    display: flex;
    align-items: center;
    gap: 8px;
    background: rgba(34, 197, 94, 0.08);
    color: #15803d;
    font-size: 13px;
    padding: 8px 10px;
    border-radius: 8px;
    margin-bottom: 12px;
}
.sp-summary-saved img { width: 18px; height: 18px; }
.sp-summary-rows { display: flex; flex-direction: column; gap: 10px; }
.sp-summary-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 14px;
}
.sp-summary-row .cart_title { color: var(--sp-text-muted); font-weight: 400 !important; font-size: 14px; }
.sp-summary-val { color: var(--sp-text); font-weight: 600 !important; font-size: 14px; }
.sp-summary-minus { color: #15803d; }
.sp-summary-free { color: var(--green); font-weight: 700; }
.sp-summary-divider { height: 1px; background: var(--sp-border); margin: 14px 0; }
.sp-summary-total {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.sp-summary-total-label { font-size: 15px; font-weight: 700; color: var(--sp-text); }
.sp-summary-total-label .sp-summary-vat { font-size: 11px; font-weight: 500; color: var(--sp-text-light); }
.sp-summary-total-val { font-size: 20px; font-weight: 800; color: var(--sp-primary); }

.sp-coupon-applied {
    display: flex;
    align-items: center;
    gap: 8px;
    background: var(--brand-soft);
    border: 1px dashed var(--sp-primary);
    border-radius: 8px;
    padding: 7px 10px;
    font-size: 13px;
    margin-top: 4px;
}
.sp-coupon-applied-code { flex: 1 1 auto; color: var(--sp-text); font-weight: 600; }
.sp-coupon-applied-amount { color: var(--sp-primary); font-weight: 400; }
.sp-coupon-remove { color: #dc2626; cursor: pointer; font-size: 18px; line-height: 1; padding: 0 4px; }

.sp-summary-cta { margin-top: 16px; }
.sp-checkout-btn {
    height: 48px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    font-size: 16px !important;
    font-weight: 700 !important;
    border-radius: 10px !important;
    text-transform: capitalize;
    width: 100%;
}

.sp-coupon-box {
    margin-top: 16px;
    background: var(--sp-white);
    border: 1px solid var(--sp-border);
    border-radius: 12px;
    box-shadow: var(--sp-shadow);
    padding: 14px 16px;
}
.sp-coupon-title { font-size: 14px; font-weight: 700; color: var(--sp-text); margin-bottom: 10px; }
.sp-coupon-form { display: flex; gap: 8px; align-items: stretch; }
.sp-coupon-input {
    flex: 1 1 auto;
    height: 42px;
    border: 1px solid var(--sp-border);
    border-radius: 8px;
    padding: 0 12px;
    font-size: 14px;
    color: var(--sp-text);
    outline: none;
    background: #fff;
    min-width: 0;
}
.sp-coupon-input:focus { border-color: var(--sp-primary); }
.sp-coupon-apply {
    flex: 0 0 auto;
    height: 42px;
    padding: 0 18px;
    border: 0;
    border-radius: 8px;
    background: var(--sp-primary);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
}
.sp-coupon-apply:hover { background: var(--sp-primary-dark); }

.sp-summary-why { margin-top: 16px; }

/* ---------- Mobil: magaza qrupu + mehsul setirleri noon kart ---------- */
@media (max-width: 991.98px) {
    #cart-summary .cart_information.d-lg-none {
        background: var(--sp-white) !important;
        border: 1px solid var(--sp-border) !important;
        border-radius: 12px !important;
        box-shadow: var(--sp-shadow) !important;
        padding: 0 !important;
        overflow: hidden;
    }
    #cart-summary .cart_information.d-lg-none .card-header {
        border: 0 !important;
        border-bottom: 1px solid var(--sp-border) !important;
        padding: 12px 14px !important;
    }
    #cart-summary .cart_information.d-lg-none .qty {
        border: 1px solid var(--sp-border);
        border-radius: 22px;
        padding: 2px;
        background: #fff;
    }
    #cart-summary .cart_information.d-lg-none .qty > span {
        color: var(--sp-primary);
        width: 28px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    #cart-summary .cart_information.d-lg-none .qty .qty_input {
        border: 0 !important;
        text-align: center;
        width: 38px;
        font-weight: 600;
    }
}

/* upload trigger 2026-07-01: noon cart + suggested styles */

/* Featured Stores - logo fallback (contain, centered on white) */
.sp-reason-img--logo { background: #fff; }
.sp-reason-img--logo img { object-fit: contain; padding: 12px; }

/* ===== PDP noon-style buy-box: qiymet+variasiya solda (core), qty + ATC/Buy Now sagda ===== */
.sp-pdp-form .sp-pdp-cols { display: flex; flex-direction: column; gap: 20px; }
.sp-pdp-main { display: flex; flex-direction: column; gap: 18px; min-width: 0; }
.sp-pdp-buybox { display: flex; flex-direction: column; gap: 14px; }
@media (min-width: 992px) {
    .sp-pdp-form .sp-pdp-cols { flex-direction: row; align-items: flex-start; gap: 24px; }
    .sp-pdp-main { flex: 1 1 auto; }
    .sp-pdp-buybox {
        flex: 0 0 300px; width: 300px;
        padding: 18px;
        border: 1px solid var(--sp-border);
        border-radius: 12px;
        background: var(--sp-white);
        box-shadow: var(--sp-shadow);
        position: sticky; top: 90px;
    }
}
/* buy-box daxilinde ATC + Buy Now stacked full-width (noon kimi) */
.sp-pdp-buybox .product-add-and-buy-section-parent { display: flex; flex-direction: column; gap: 10px; }
.sp-pdp-buybox .product-add-and-buy-section { flex-direction: column !important; width: 100%; gap: 10px !important; }
.sp-pdp-buybox .product-add-and-buy-section .btn { width: 100%; height: 46px; font-weight: 700; border-radius: 10px; }
.sp-pdp-buybox .product-action-add-wishlist { width: 100%; border-radius: 10px !important; }
.sp-pdp-buybox .btn-gap-right, .sp-pdp-buybox .btn-gap-left { margin: 0 !important; }
.sp-pdp-buybox .product-details-chosen-price-section { margin: 0; }
/* PDP buy-box: orta ekranlarda (992-1199) col dar olur -> yan-yana yox, alt-alta */
@media (min-width: 992px) and (max-width: 1199.98px) {
    .sp-pdp-form .sp-pdp-cols { flex-direction: column; }
    .sp-pdp-buybox { flex: 0 0 auto; width: 100%; position: static; }
}

/* ===== PDP: sag sutunda (col-lg-3) noon-style buy-box (Buy Now + Add to Cart) ===== */
.sp-side-buybox {
    background: var(--sp-white);
    border: 1px solid var(--sp-border);
    border-radius: 12px;
    box-shadow: var(--sp-shadow);
    padding: 16px;
    margin-bottom: 16px;
}
.sp-side-buybox .product-add-and-buy-section { flex-direction: column !important; width: 100%; gap: 10px !important; }
.sp-side-buybox .product-add-and-buy-section .btn { width: 100%; height: 48px; font-weight: 700; border-radius: 10px; margin: 0 !important; }
.sp-side-buybox .btn-gap-right, .sp-side-buybox .btn-gap-left { margin: 0 !important; }
.sp-side-buybox .product-restock-request-section { margin-top: 10px; }
.sp-side-buybox .product-restock-request-section .btn { width: 100%; }

/* ===== PDP sag sutun sirasi (noon): seller(1) > reliability(2) > buy-box(3) > more-from-store(4,5) ===== */
.sp-pdp-rightcol { display: flex; flex-direction: column; }
.sp-pdp-rightcol > .__inline-31 { order: 1; }
.sp-pdp-rightcol > .product-details-shipping-details { order: 2; }
.sp-pdp-rightcol > .sp-side-buybox { order: 3; }
.sp-pdp-rightcol > .sp-morefrom-head { order: 4; }
.sp-pdp-rightcol > .sp-morefrom-list { order: 5; }
/* Fast Delivery / Safe Payment ve s. yigcam */
.sp-pdp-rightcol .product-details-shipping-details .px-3.py-3 { padding-top: 7px !important; padding-bottom: 7px !important; }

/* PDP sag sutun: her blok arasinda 5px ara (bloklar bir-birine girmesin) */
.sp-pdp-rightcol { gap: 5px; }
.sp-pdp-rightcol > .sp-side-buybox { margin-bottom: 0; }
.sp-pdp-rightcol > .sp-morefrom-head { padding-top: 5px !important; }

/* PDP sag sutun: seller karti en yuxari -> ustundeki 10px margin-top-u sifirla */
.sp-pdp-rightcol > .__inline-31 { margin-top: 0 !important; }

/* ===== Kateqoriya tile-lari: davamli sola axin (CSS marquee) + hover-da dayanma ===== */
.sp-tiles-marquee { overflow: hidden; width: 100%; }
.sp-tiles-track {
    display: flex;
    direction: ltr;            /* hemise soldan-saga siralanir -> sola axin */
    width: max-content;
    animation: sp-tiles-scroll 45s linear infinite;   /* BOYUT = daha yavas */
    will-change: transform;
}
.sp-tiles-marquee:hover .sp-tiles-track { animation-play-state: paused; }   /* sican uste -> derhal dayanir */
.sp-tiles-track .sp-tile { flex: 0 0 120px; width: 120px; margin-inline-end: 12px; }
@keyframes sp-tiles-scroll {
    from { transform: translateX(0); }
    to   { transform: translateX(-50%); }   /* yari = bir dest (tile-lar 2 defe -> kesiksiz) */
}
@media (max-width: 575px) {
    .sp-tiles-track .sp-tile { flex-basis: 92px; width: 92px; margin-inline-end: 10px; }
    .sp-tiles-track { animation-duration: 30s; }
}

/* Kateqoriya marquee: JS idare edir (auto-scroll + tutub surusdurme) — CSS animasiyani sondur */
.sp-tiles-track { animation: none !important; }
.sp-tiles-marquee { cursor: grab; touch-action: pan-y; user-select: none; -webkit-user-select: none; }
.sp-tiles-marquee.dragging { cursor: grabbing; }
.sp-tiles-marquee.dragging .sp-tile { pointer-events: none; }   /* drag zamani hover/scale mane olmasin */
.sp-tiles-track a, .sp-tiles-track img { -webkit-user-drag: none; user-drag: none; }