/* ========================================
   ÖDEME & SEPET SAYFALARI CSS
   style.css'ten ayrıldı — C4-4b
   Sadece sepet ve ödeme sayfalarında yüklenir.
   ======================================== */

/*========================================
  ÖDEME SAYFASI – PROFESYONEL YENİ TASARIM
  Modern Green Theme – Soft UI (Rootsuz)
=========================================*/

/*==============================
  GÜVEN KUTUSU
==============================*/
.payment-trust-pro1 {
    background: #ffffff;

}

.payment-trust-pro1 h3 {
    font-size: 20px;
    font-weight: 600;
    color: var(--th-color-success); /* modern yeşil */
    margin-bottom: 15px;
    display: flex;
    align-items: center;
    gap: 6px;
}

.payment-trust-pro1 h3 i {
    color: var(--th-color-success);
    font-size: 20px;
}

.payment-trust-pro1 .desc-pro1 {
    font-size: 14px;
    color: var(--th-color-text-muted);
    margin-bottom: 20px;
    line-height: 1.6;
}

/*==============================
  ÖDEME YÖNTEM LİSTESİ
==============================*/
.methods-list {
    list-style: none;
    padding: 0;
    margin: 0 0 20px;
}

.methods-list li {
    font-size: 14px;
    color: var(--th-color-text);
    padding: 10px 14px;
    border-bottom: 1px solid var(--th-color-border);
    display: flex;
    align-items: center;
    gap: 10px;
    transition: all .25s ease;
    background: #fff;
}

.methods-list li:last-child {
    border-bottom: none;
}

.methods-list li i {
    font-size: 16px;
    color: var(--th-color-success);
    min-width: 22px;
}

/* Hover efekti – modern yeşil */
.methods-list li:hover {
    background: var(--th-color-success-bg);
    color: var(--th-color-text);
}

/*==============================
  YEŞİL BİLGİ NOTU (note-pro1)
==============================*/
.note-pro1 {
    font-size: 14px;
    border-left: 4px solid var(--th-color-success);
    padding: 14px 15px;
    border-radius: var(--th-radius-xl);
    line-height: 1.55;
    background: var(--th-color-success-bg);
    color: var(--th-color-text);
    display: flex;
    gap: 10px;
    align-items: flex-start;
    box-shadow: 0 2px 6px rgba(0,0,0,0.05);
}

.note-pro1 i {
    color: var(--th-color-success);
    margin-top: 2px;
}

/*==============================
  TURUNCU UYARI NOTU (note-pro19)
==============================*/
.note-pro19 {
    font-size: 14px;
    border-left: 4px solid var(--th-color-warning);
    padding: 14px 15px;
    border-radius: var(--th-radius-xl);
    line-height: 1.55;
    background: var(--th-color-warning-bg);
    color: var(--th-color-warning-dark, #8a4b00);
    display: flex;
    gap: 10px;
    align-items: flex-start;
    box-shadow: 0 2px 6px rgba(0,0,0,0.05);
}

.note-pro19 i {
    color: var(--th-color-warning);
    margin-top: 2px;
}

.methods-list li:hover,
.note-pro19:hover {
    background: var(--th-color-warning-bg);
}

/*==============================
  ÖDEME TABS (KART / KAPIDA)
==============================*/
.payment-form-group-1 .nav-tabs {
    display: flex;
    justify-content: space-between;
    border: 0;
    margin: 0;
    padding: 0;
}

.payment-form-group-1 .nav-item {
    flex: 1;
    margin: 0;
}

.payment-form-group-1 .nav-tabs .nav-link {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    font-size: 14px;
    font-weight: 500;
    height: 50px;
    background: var(--th-color-bg-soft);
    border: 1px solid var(--th-color-border);
    border-radius: 0;
    color: var(--th-color-text);
    transition: all .25s ease;
    width: 100%;
}

.payment-form-group-1 .nav-item:first-child .nav-link {
    border-radius: var(--th-radius-lg) 0 0 8px;
}

.payment-form-group-1 .nav-item:last-child .nav-link {
    border-radius: 0 8px 8px 0;
}

/* Hover */
.payment-form-group-1 .nav-tabs .nav-link:hover {
    background: #ffffff;
    border-color: var(--th-color-border);
    color: var(--th-color-text);
}

/* Aktif olan */
.payment-form-group-1 .nav-tabs .nav-link.active {
    background: var(--th-color-success);
    border-color: var(--th-color-success);
    color: #fff;
    font-weight: 600;
    margin-top: 10px;
    box-shadow: 0 3px 8px rgba(16,185,129,0.3);
}

.payment-form-group-1 .nav-tabs .nav-link i {
    font-size: 16px;
    opacity: .8;
}

.payment-form-group-1 .nav-tabs .nav-link.active i {
    color: #fff;
    opacity: 1;
}

/*==============================
  MOBİL
==============================*/
@media (max-width: 768px) {
    .payment-trust-pro1 h3 {
        font-size: 18px;
    }

    .methods-list li {
        font-size: 13px;
        padding: 8px 10px;
    }

    .note-pro1,
    .note-pro19 {
        font-size: 13px;
        padding: 12px 12px;
    }

    .payment-form-group-1 .nav-tabs .nav-link {
        font-size: 13px;
        height: 48px;
    }
}

@media (max-width: 480px) {
    .note-pro1,
    .note-pro19 {
        flex-direction: column;
        align-items: flex-start;
    }

    .note-pro1 i,
    .note-pro19 i {
        margin-bottom: 6px;
    }
}


/* ======================================================
   SECTION: Payment Utilities & Logos
   Lines: approx 7210–7409
   Purpose: d-flex utility, payment logos, scroll ticker,
            banner motion, discount-success badge
   ====================================================== */

.d-flex {
    display: flex;
    justify-content: center;
    align-items: center
}

.payment-logos-874 {
    text-align: center;
    padding: 30px 0 5px;
    background-color: #fff
}

.payment-logos-874 img {
    max-width: 95%;
    height: auto
}

@media (max-width: 768px) {
    .payment-logos-874 {
        padding: 10px 0
    }

    .payment-logos-874 img {
        max-width: 100%
    }
}

.scroller--line.scroller--move {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 10px;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
    animation-duration: 60s;
    animation-play-state: running;
    width: max-content;
    will-change: transform,width;
    animation-name: scroll-left
}

.banner-motion-zone {
    margin-top: -20px;
    margin-bottom: 25px
}

.banner-motion-wrap {
    display: flex;
    align-items: center;
    overflow: hidden;
    justify-content: center;
    position: relative;
    gap: 10px;
    width: 100%
}

.scroll-items-inner {
    color: var(--th-color-text-muted);
    font-size: 14px;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: 10px;
    width: max-content
}

.scroll-items-inner img {
    width: 15px;
    height: 15px
}

.banner-motion-wrap:hover .scroller--move {
    animation-play-state: paused
}

.discount-success {
    color: #fff;
    font-size: 10px;
    background: linear-gradient(90deg,#f9e4b7 0,#e8c06c 100%);
    padding: 3px 8px;
    border-radius: var(--th-radius-md);
    margin: 10px 0 10px 10px;
    text-align: center;
    font-weight: 500;
    display: inline-block
}

.shopping-cart-1 .cart-product-row:hover {
    background-color: #fff
}

@media (min-width: 768px) {
    .masaustu-goster1 {
        display: block
    }
}

@media (max-width: 767px) {
    .masaustu-goster1 {
        display: none
    }
}

@media (min-width: 768px) {
    .masaustu-goster4 {
        display: block
    }
}

@media (max-width: 767px) {
    .masaustu-goster4 {
        display: none;
        padding-bottom: -40px
    }
}

@media (min-width: 768px) {
    .masaustu-gizle4 {
        display: none
    }
}

@media (max-width: 767px) {
    .masaustu-gizle4 {
        display: block
    }
}




/* ======================================================
   SECTION: Shipping Progress Bar
   Lines: approx 7412–7500
   Purpose: kargo bilgi container, progress bar,
            shipping message overlay
   ====================================================== */

.kargo-bilgi-container {
    padding: 15px;
    text-align: center;
    font-size: 14px;
    color: var(--th-color-text);
    margin-bottom: 20px;
    margin-top: 20px;
    background-color: #fff
}

.kargo-bilgi-container .progress-bar-p {
    font-size: 14px;
    color: var(--th-color-text-muted);
    margin-bottom: -4px
}

.progress-bar-container {
    border-radius: var(--th-cart-progress-radius);
    height: var(--th-cart-progress-height);
    width: 100%;
    margin-top: 10px;
    position: relative;
    box-shadow: inset 0 1px 3px rgba(0,0,0,.1);
    background-color: var(--th-cart-progress-bg)
}

.progress-bar {
    height: 100%;
    border-radius: 20px;
    transition: width .4s ease-in-out
}

.kargo-bilgi-mesaj {
    position: absolute;
    width: 100%;
    top: 1px;
    left: 20px;
    text-align: center;
    font-size: 12px;
    font-weight: 400;
    color: #fff;
    line-height: 20px
}

@media (max-width: 768px) {
    .kargo-bilgi-container {
        font-size: 14px;
        padding: 10px
    }

    .progress-bar-container {
        height: 18px
    }

    .progress-bar {
        height: 100%
    }

    .kargo-bilgi-mesaj {
        font-size: 12px;
        line-height: 16px
    }
}

@media (max-width: 480px) {
    .kargo-bilgi-container {
        font-size: 13px;
        padding: 8px
    }

    .progress-bar-container {
        height: 16px
    }

    .progress-bar {
        height: 100%
    }

    .kargo-bilgi-mesaj {
        font-size: 10px;
        line-height: 14px
    }

    .kargo-bilgi-container .progress-bar-p {
        font-size: 12px;
        color: var(--th-color-text-muted);
        margin-bottom: -3px
    }
}

/* ======================================================
   SECTION: Cart UI Components
   Lines: approx 7502–7627
   Purpose: remove button, cart quantity, homepage headline,
            loader overlay, discount counter, contract textarea,
            cart list product, sepet indirim mesaji
   ====================================================== */

.btn-remove {
    background: linear-gradient(90deg,#fef4eb 0,#fff0f4 100%);
    border: 0;
    padding: 16px;
    border-radius: var(--th-radius-sm);
    cursor: pointer;
    margin-bottom: 5px
}

.btn-remove i.fa-trash-alt {
    color: var(--th-color-danger);
    font-size: 20px;
    margin-top: 6px
}

@media (max-width: 768px) {
    .btn-remove {
        padding: 8px 16px;
        font-size: 14px
    }

    .btn-remove i.fa-trash-alt {
        color: var(--th-color-danger);
        font-size: 18px
    }

    .shopping-cart-1 .product-quantity {
        align-items: flex-start;
        display: flex;
        justify-content: flex-end;
        margin-right: 0;
        gap: 5px
    }
}

.home-headline19 {
    padding-top: 20px;
    padding-bottom: 20px
}

.loader-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
    opacity: 1;
    transition: opacity 1s ease-out
}

.logosss {
    width: 60vw;
    height: auto;
    max-width: 600px
}

body.loaded .loader-container {
    opacity: 0
}

@media (min-width: 992px) {
    .qk-app-discount-counter .dc-contents {
        left: auto;
        right: auto;
        top: auto;
        bottom: auto;
        transform: scale(1);
        transform-origin: center center;
        margin: 30px
    }
}

.sozleme-yazisi-9865 textarea {
    width: 100%;
    min-height: 100px;
    max-height: 400px;
    padding: 10px;
    box-sizing: border-box;
    resize: vertical;
    overflow: auto;
    border: 1px solid var(--th-color-border);
    border-radius: var(--th-radius-sm)
}


.card-list-product .card-list-product-inner .c-l-p-i-link {
    align-items: flex-start;
    color: var(--th-color-text);
    display: flex;
    font-weight: 400;
    justify-content: flex-start;
    flex-wrap: wrap
}

.card-list-product .card-list-product-inner .c-l-p-i-link>:last-child {
    width: 100%
}

.sepet-indirim-mesaji {
    background-color: var(--th-color-accent-subtle);
    text-align: center;
    margin-bottom: 15px
}

.sepet-indirim-mesaji.show {
    animation: fadeIn9d .4s ease-in-out
}

@media (max-width: 768px) {
    .sepet-indirim-mesaji {
        font-size: 13px;
        padding: 10px;
        border-radius: var(--th-radius-sm)
    }

    .show-category5,.show-category6 {
        top: 10px!important
    }
}


/* ======================================================
   SECTION: Checkout – Payment Methods & Installments
   Lines: approx 7628–8006
   Purpose: payment tabs, shipment methods, CC installments,
            payment methods container, secure payment message
   ====================================================== */

.payment-form-group-1 .nav-tabs {
    background: #fff;
    border-radius: var(--th-radius-md);
    flex-wrap: wrap
}



.shipment-methods .method .name .image {
    align-items: center;
    background: 0 0;
    border: 0;
    display: flex;
    height: 40px;
    justify-content: center;
    padding: 5px;
    width: 90px
}

.payment-methods-container {
    background-color: #fff;
    padding: 30px;
    margin-top: 50px;
    margin-left: auto;
    margin-right: auto;
    border-radius: var(--th-radius-xl);
    box-shadow: 0 10px 30px rgba(0,0,0,.05);
    font-family: "Poppins",sans-serif
}

.payment-methods-container1 .payment-security1 {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-bottom: 25px
}

.payment-methods-container1 .security-icon1 {
    width: 40px;
    height: 40px;
    margin-right: 15px;
    opacity: .8
}

.payment-methods-container1 .payment-message1 {
    font-size: 16px;
    color: var(--th-color-text);
    line-height: 1.6;
    max-width: 600px
}

.payment-methods-container1 .payment-message1 strong {
    font-size: 18px;
    color: var(--th-color-success)
}

.payment-methods-container1 .payment-methods-list1 {
    margin-top: 30px
}

.payment-methods-container1 .payment-methods-list1 h31 {
    font-size: 20px;
    color: var(--th-color-text);
    margin-bottom: 15px;
    font-weight: 600
}

.payment-methods-container1 .methods1 {
    display: flex;
    flex-direction: column;
    gap: 15px;
    align-items: flex-start
}

.payment-methods-container1 .method1 {
    display: flex;
    align-items: center;
    flex-direction: column;
    text-align: center;
    max-width: 200px
}

.payment-methods-container1 .method1 span {
    font-size: 16px;
    color: var(--th-color-text);
    font-weight: 600;
    text-transform: capitalize;
    padding: 8px 0;
    border-bottom: 1px solid #eee;
    width: 100%
}

.payment-methods-container1 .learn-more1 {
    margin-top: 20px;
    font-size: 14px;
    color: var(--th-color-success);
    text-align: center
}

.payment-methods-container1 .learn-more1 a {
    color: var(--th-color-success);
    text-decoration: none;
    margin: 0 10px
}

.payment-methods-container1 .learn-more1 a:hover {
    text-decoration: underline
}

.shipment-methods .method:last-child {
    overflow: hidden!important;
    border-bottom: 1px solid rgba(0,0,0,.07)!important
}

.shipment-methods .method .name .image img {
    max-height: 40px;
    max-width: 80px
}

.payment-form-group-1 .secure-payment-message {
    display: flex;
    align-items: center;
    padding: 10px 15px;
    width: 100%;
    margin: 20px auto;
    background-color: #fff;
    border: 1px solid var(--th-color-border);
    border-radius: var(--th-radius-lg);
    box-shadow: 0 1px 4px 0 rgba(0,0,0,.05)
}

.payment-form-group-1.secure-payment-message img {
    width: 40px;
    height: 40px;
    margin-right: 15px
}

.payment-form-group-1 .message-text {
    font-size: 12px;
    color: var(--th-color-text);
    padding-left: 15px
}

.payment-form-group-1 .message-text strong {
    color: var(--th-color-success);
    font-weight: 600;
    font-size: 12px
}

.cc-installments .head {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--th-color-bg-soft);
    border-bottom: 1px solid var(--th-color-border-light);
    font-size: 14px;
    font-weight: 500;
    color: var(--th-color-text-secondary);
    padding: 10px 14px;
    border-radius: var(--th-radius-md) 6px 0 0;
    text-transform: none;
    letter-spacing: .3px
}

.cc-installments {
    background-color: var(--th-color-bg-soft);
    border: 1px solid var(--th-color-border-light);
    border-radius: var(--th-radius-lg);
    padding: 12px
}

.cc-installments .method {
    display: flex;
    align-items: center;
    background: #fff;
    border: 1px solid var(--th-color-border-light);
    border-radius: var(--th-radius-md);
    padding: 10px;
    margin-bottom: 6px;
    transition: all .2s ease-in-out
}

.cc-installments .method:hover {
    background: var(--th-color-bg-soft)
}

.cc-installments .method .name {
    display: flex;
    align-items: center;
    flex: 3;
    font-size: 14px;
    color: var(--th-color-text-secondary);
    font-weight: 500
}

.btn-lightsss,.btn-lightsss:hover {
    display: inline-block;
    border: 2px solid var(--th-color-accent);
    color: var(--th-color-accent);
    padding: 12px 30px;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    border-radius: var(--th-radius-lg);
    background-color: #fff
}

.btn-lightsss:hover {
    color: #fff;
    background-color: var(--th-color-accent)
}

.container1 {
    padding: 20px;
    background: #fff;
    border: 1px solid var(--th-color-border-light);
    border-radius: var(--th-radius-xl);
    margin-bottom: 15px
}

.container1 h1 {
    text-align: center;
    color: var(--th-color-success);
    font-size: 20px;
    margin-bottom: 20px;
    font-weight: 400
}

.container1_section1 {
    margin-bottom: 10px;
    background-color: #fff
}

.container1_section1 h2 {
    color: var(--th-color-success);
    font-size: 14px;
    margin-bottom: 10px;
    font-weight: 600;
    display: flex;
    align-items: center
}

.container1_section1 h2 i,.etbis-section h2 i {
    margin-right: 8px;
    color: var(--th-color-success)
}

@media (max-width: 1366px) {
    .container1_section1 p,.container1_section1 ul,.etbis-text p {
        font-size: 12px
    }
}

.container1_section1 p,.container1_section1 ul,.etbis-text p {
    color: var(--th-color-text-muted);
    font-size: 12px;
    font-weight: 400;
    margin-bottom: 5px
}

.container1_section1 ul {
    padding-left: 20px;
    list-style-type: none
}

.container1_section1 ul li {
    margin-bottom: 3px;
    position: relative;
    padding-left: 20px
}

.container1_section1 ul li::before {
    content: "✔";
    position: absolute;
    left: 0;
    color: var(--th-color-success);
    font-weight: 700
}

.container1_button1 {
    display: inline-block;
    background-color: var(--th-color-success);
    color: #fff;
    padding: 8px 15px;
    text-decoration: none;
    font-size: 12px;
    font-weight: 400;
    border-radius: 30px;
    text-align: center;
    transition: background-color .3s ease
}

.container1_button1:hover {
    background-color: #43b15c
}

.container1_footer1 {
    text-align: center;
    font-size: 10px;
    margin-top: 20px;
    color: var(--th-color-text-muted)
}

.etbis-section,.payment-cart-summary-1 table tfoot tr {
    display: flex;
    justify-content: space-between;
    background-color: #fff
}

.etbis-section {
    border-radius: var(--th-radius-xl);
    align-items: center;
    flex-wrap: wrap
}

@media (max-width: 1366px) {
    .etbis-section h2 {
        margin-bottom: 3px;
        font-size: 14px
    }
}

.etbis-section h2 {
    display: flex;
    align-items: center;
    color: var(--th-color-success);
    font-size: 14px;
    font-weight: 600;
    line-height: normal;
    margin-bottom: 4px
}

.etbis-text {
    flex: 1 1 60%
}

.etbis-image {
    flex-shrink: 0
}

.etbis-image img {
    max-width: 60px;
    height: auto;
    border-radius: var(--th-radius-md);
    border: 1px solid var(--th-color-border);
    padding: 5px
}

.etbis-image img:hover {
    transform: scale(2.05)
}

.cc-installments .method .name .info {
    font-size: 12px;
    color: var(--th-color-text-muted)
}

.cc-installments .method .checkbox {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-left: 8px
}

.cc-installments .method .price-1,.cc-installments .method .price-2 {
    flex: 1;
    padding-right: 5px;
    text-align: center;
    font-weight: 500;
    color: var(--th-color-text-secondary)
}

.cc-installments .method.active {
    background: var(--th-color-bg-soft);
    color: var(--th-color-primary);
    font-weight: 600;
    border: 1px solid var(--th-color-border-light)
}

/* ======================================================
   SECTION: Checkout – Cart Summary Sidebar
   Lines: approx 8008–8196
   Purpose: payment cart summary, order totals, cart table,
            product quantity in cart, readmore component
   ====================================================== */

.payment-cart-summary-1 {
    background: var(--th-cart-summary-bg);
    border: 1px solid var(--th-cart-summary-border);
    border-radius: var(--th-cart-summary-radius);
    padding: 20px
}

.payment-cart-summary-1 .d12fg154dfg {
    font-weight: 600;
    font-size: 18px;
    line-height: 22px;
    letter-spacing: -.03em;
    color: var(--th-color-text)
}

.kargo-kampanya-sepet-pc {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #fff;
    border-radius: var(--th-radius-xl);
    border: 1px solid var(--th-color-border-light)
}

.kargo-kampanya-sepet-pc .kampanya-kutu {
    text-align: center;
    padding: 20px 10px 20px 15px
}

.kargo-kampanya-sepet-pc .kampanya-baslik {
    font-size: 18px;
    font-weight: 600;
    color: var(--th-color-text);
    display: flex;
    align-items: center;
    gap: 10px
}

.kargo-kampanya-sepet-pc .kampanya-img {
    text-align: right;
    height: 25px
}

.kargo-kampanya-sepet-pc .kampanya-aciklama {
    font-size: 14px;
    color: var(--th-color-text-muted);
    margin-top: 10px
}

.kargo-kampanya-sepet-pc .magaza-adi {
    font-weight: 700;
    color: #000
}

.kargo-kampanya-sepet-pc .eksik-tutar {
    color: var(--th-color-danger);
    font-weight: 700
}

.kargo-kampanya-sepet-pc .tebrikler {
    color: var(--th-color-success);
    font-weight: 700
}

.payment-cart-summary-1 .tilbe-sub {
    font-weight: 400;
    font-size: 13px;
    line-height: 16px;
    letter-spacing: -.03em;
    color: var(--th-color-text-muted);
    margin-top: 8px;
    margin-bottom: 11px;
    text-align: center
}

.payment-cart-summary-1 .summary span {
    padding-top: -10px
}

@media (max-width: 768px) {
    .pattern-group-body .th2-card .th2-card__inner .th2-card__badge--freecargo,.pattern-group-body .th2-card .th2-card__inner .hizli-teslimat {
        display: none!important
    }
}

.shopping-cart-1 .product-quantity {
    display: flex;
    align-items: center;
    gap: 10px
}

.shopping-cart-1 .product-quantity input {
    width: 30px;
    height: 30px;
    text-align: center;
    font-size: 14px;
    font-weight: 700;
    outline: 0;
    padding: 0;
    background-color: transparent;
    border: 1px solid var(--th-color-border-light);
    border-radius: var(--th-radius-md)
}

.shopping-cart-1 .product-quantity .btn {
    width: 30px;
    height: 30px;
    font-size: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: transparent
}

@media (max-width: 768px) {
    .shopping-cart-1 .product-quantity .btn,.shopping-cart-1 .product-quantity input {
        width: 25px;
        height: 25px
    }
}

.payment-cart-summary-1 table tfoot tr th,.payment-page-bodysection .p-g-b-c-1 .p-g-b-c-inner .payment-cart-summary-1 .table tfoot tr th {
    border: 0!important
}

.payment-cart-summary-1 h5 {
    color: var(--th-color-text);
    font-size: 14px;
    letter-spacing: -.28px;
    font-weight: 600;
    margin-bottom: 3px
}

.payment-cart-summary-1 span9 {
    font-size: 14px;
    color: var(--th-color-success);
    font-weight: 400
}

.payment-cart-summary-1 .span19 {
    font-size: 14px;
    color: var(--th-color-text);
    font-weight: 500
}

.payment-cart-summary-1 .span18 {
    font-size: 12px;
    color: var(--th-color-success);
    font-weight: 500
}

.payment-cart-summary-1 .span17 {
    font-size: 11px;
    color: var(--th-color-text-muted);
    font-weight: 500
}

.payment-cart-summary-1 .span16 {
    color: var(--th-color-success)
}

.payment-cart-summary-1 table tfoot tr {
    flex-direction: row;
    padding-bottom: 10px;
    padding-top: 10px;
    border-bottom: 1px solid var(--th-color-border-light);
    font-weight: 400
}

.readmore {
    margin: 40px 0
}

.readmore .p-g-mod-base-content {
    border: 0
}

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

.readmore .readmore-text.show {
    max-height: 100%
}

.readmore .p-g-mod-t-1 {
    display: flex;
    justify-content: center
}

/* ======================================================
   SECTION: Checkout – Form Inputs
   Lines: approx 8199–8342
   Purpose: payment form inputs, selects, textareas,
            gift pack, invoice info, corporate tooltip
   ====================================================== */

.payment-form-group-1 {
    background: #fff
}

.payment-form-group-1 .form-group input,.payment-form-group-1 .form-group select,.payment-form-group-1 .form-group textarea {
    letter-spacing: -.28px;
    width: 100%;
    height: 52px;
    padding: 14px 16px;
    font-size: 16px;
    font-weight: 500;
    color: var(--th-color-text);
    background-color: #fff;
    border: 1px solid var(--th-color-border);
    border-radius: var(--th-radius-lg);
    box-shadow: 0 1px 3px rgba(0,0,0,.05);
    outline: 0;
    transition: border .2s ease,box-shadow .2s ease,background-color .2s ease
}

.payment-form-group-1 .gift-pack-price {
    color: var(--th-color-success);
    font-weight: 500
}

.payment-form-group-1 .hediye-aciklama54 {
    align-items: center;
    gap: 10px;
    margin-bottom: 7px;
    padding: 1px 15px 5px
}

.payment-form-group-1 .form-group textarea {
    min-height: 150px;
    resize: vertical
}


.payment-form-group-1 .hediye-aciklama54 input[type=checkbox] {
    width: 18px;
    height: 18px;
    accent-color: #2563eb;
    cursor: pointer;
    transition: transform .2s;
    margin-bottom: 5px;
    padding-right: 20px
}

.payment-form-group-1 .hediye-aciklama54 input[type=checkbox]:hover {
    transform: scale(1.1)
}

.payment-form-group-1 .hediye-aciklama54 label {
    font-size: 14px;
    color: var(--th-color-text-secondary);
    cursor: pointer
}

.payment-form-group-1 .form-group input::placeholder,.payment-form-group-1 .form-group textarea::placeholder {
    color: var(--th-color-text-muted);
    font-weight: 400
}

.invoice-info-description {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    padding: 0;
    gap: 18px;
    background: 0 0
}

.kurumsal-etiket .kurumsal-span {
    text-align: center;
    font-size: 16px
}

.kurumsal-etiket {
    position: relative;
    border-bottom: 1px dotted #fff
}

.kurumsal-etiket .kumtext {
    visibility: hidden;
    width: 400px;
    background-color: #fff;
    color: var(--th-color-text);
    text-align: center;
    border-radius: var(--th-radius-md);
    border-width: 2px;
    border-style: solid;
    border-color: #4a90e2;
    padding: 5px 0;
    position: absolute;
    z-index: 1;
    bottom: 150%;
    left: 0;
    margin-left: -20px
}

.kurumsal-etiket .kumtext::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 10px;
    border-style: solid;
    border-color: #4a90e2 transparent transparent
}

.kurumsal-etiket:hover .kumtext {
    visibility: visible
}

.kurumsal-etiket,.readmore .more {
    display: inline-block;
    font-size: 14px;
    text-align: center
}

.readmore .more {
    border-radius: var(--th-radius-md);
    color: #000;
    font-weight: 400;
    padding: 10px 20px;
    transition: all .2s ease-in-out;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    border: 1px solid #000
}

.product-badges-alert {
    border: 1px solid var(--th-color-border-light);
    border-radius: var(--th-radius-xl);
    padding: 25px;
    background: var(--th-color-danger);
    color: #fff;
    align-content: center;
    margin-top: 20px;
    font-size: 14px
}


/* ======================================================
   SECTION: Checkout – Page Layout & Shipment
   Lines: approx 13700–14099
   Purpose: payment-boxs-right sticky sidebar,
            payment-summary-box, discount-section responsive,
            shipment-methods, pattern-group page overrides,
            payment page title block
   ====================================================== */

.payment-boxs-right {
    position: sticky;
    top: 20px;
    display: flex;
    flex-direction: column;
    gap: 20px
}

.payment-security-block,.payment-summary-box {
    padding: 15px;
    border: 1px solid var(--th-color-border);
    border-radius: var(--th-radius-xl)
}

.payment-summary-box .p-g-mod-body {
    padding: 0!important
}

.payment-summary-box .p-g-mod:last-child {
    margin: 0
}

.payment-body .payment-summary-box .payment-final-buttons-1 {
    padding: 0
}

.payment-summary-box .p-list-button {
    padding: 0 0 6px
}

.payment-security-block .guvenlik-aciklama-h4 h4,.payment-security-block .title-b h4 {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    color: var(--th-color-success);
    font-size: 13px;
    font-weight: 600;
    line-height: normal;
    margin-bottom: 12px
}

.payment-security-block .title-b li,.payment-security-block .title-b p {
    color: var(--th-color-text-muted);
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%
}

.payment-security-block .title-b b,.payment-security-block .title-b span {
    font-size: 12px;
    font-style: normal;
    line-height: 150%;
    font-weight: 500;
    color: #000
}

.payment-final-buttons-1 {
    display: block
}

.payment-security-block .title-b span {
    color: var(--th-color-success);
    font-weight: 400
}

.paysec-methods .title {
    color: #000;
    font-size: 12px;
    font-weight: 500;
    line-height: normal;
    margin-bottom: 15px
}

/* ======================================================
   SECTION: Checkout – Payment Security Section
   Lines: approx 13400–13699
   Purpose: paysec-methods, payment security badges,
            shipment methods responsive, modal dialog
   ====================================================== */

.paysec-methods .items {
    display: flex;
    flex-direction: row;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px
}

.paysec-methods .item img {
    border-radius: 0
}

.payment-security-block .title-b ul {
    padding: 0 0 0 20px;
    margin: 12px 0 0
}

.paysec-methods {
    margin-bottom: 20px
}

.paysec-methods .item.small {
    color: #000;
    font-size: 9px;
    font-weight: 500;
    display: flex;
    flex-direction: row;
    align-items: center;
    border: 1px solid var(--th-color-border);
    border-radius: var(--th-radius-md);
    padding: 10px 15px;
    gap: 13px
}

.payment-security-block.basket-page {
    margin-top: 11px;
    border-color: var(--th-color-border-light)
}

@media (max-width: 991px) {
    .payment-security-block.basket-page {
        border-color: var(--th-color-border-light)
    }

    .payment-boxs-right {
        flex-direction: column-reverse;
        gap: 20px
    }
}

.basketp-stepalert {
    padding: 12px 20px;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: "Poppins",sans-serif;
    word-wrap: break-word;
    background-color: #fff;
    border: 1px solid var(--th-color-border);
    border-radius: var(--th-radius-lg);
    box-shadow: 0 1px 4px 0 rgba(0,0,0,.05)
}

.basketp-stepalert img {
    width: 24px;
    height: 24px;
    object-fit: contain;
    opacity: .9
}

.basketp-stepalert span {
    color: var(--th-color-text);
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: .2px;
    text-align: left
}

.basketp-stepalert b {
    color: var(--th-color-success);
    font-weight: 500
}

@media (max-width: 768px) {
    .basketp-stepalert {
        padding: 10px 15px;
        font-size: 13px;
        gap: 10px
    }

    .basketp-stepalert img {
        width: 20px;
        height: 20px
    }
}

.payment-page-title-block2 .payment-page-title-guvenh4 {
    font-weight: 600;
    font-size: 18px;
    line-height: 22px;
    letter-spacing: -.03em;
    color: var(--th-color-text)
}

.tilbe-sub9987 {
    font-size: 13px;
    font-weight: 400;
    color: var(--th-color-text-muted);
    text-align: center;
    margin-bottom: 10px
}

.payment-page-title-block {
    margin-top: 0;
    padding-bottom: 0
}

.payment-page-title-block,.payment-page-title-block2,.shipment-methods .method {
    display: flex;
    align-items: center;
    justify-content: space-between
}

.payment-page-title-block img,.payment-page-title-guven {
    margin-left: 10px;
    max-height: 25px;
    max-width: 100%;
    margin-top: -5px
}

.payment-page-title-block img {
    margin-top: 0
}

.payment-page-title-block h4 {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;
    gap: 8px;
    font-size: 20px;
    color: var(--th-color-text);
    letter-spacing: -.36px;
    font-weight: 500
}

@media (max-width: 1200px) {
    .payment-page-title-block h4 {
        font-size: 17px
    }
}

.pattern-group .p-g-mod .p-g-mod-header {
    border-bottom: none
}

.payment-page-bodysection .p-g-b-c-0 .p-g-mod-header .p-g-m-h-info {
    justify-content: flex-start!important;
    align-items: flex-start!important
}

.payment-page-bodysection .p-g-b-c-0 .p-g-mod-header {
    height: auto;
    padding: 0;
    border: 0
}

.shipment-methods .method .name .image {
    margin-right: 10px
}

.shipment-methods .method .checkbox {
    margin: 0
}

.shipment-methods .method .name {
    float: unset!important;
    width: 100%;
    max-width: fit-content;
    margin-right: 20px
}

.shipment-methods .method:hover {
    background: var(--th-color-bg-soft);
    box-shadow: 0 4px 12px rgba(0,0,0,.1)
}

.payment-page-bodysection .p-g-b-c-0 .p-g-mod-body {
    background: transparent !important;
    padding: 0
}

.shipment-methods {
    display: flex;
    gap: 10px
}

/* [C2-3] Collapsed 4 identical breakpoints into 1 root rule */
.discount-section {
    padding: 10px 5px 1px 20px;
    margin: 15px 0 20px
}

@media (max-width: 768px) {
    .shipment-methods {
        flex-direction: column
    }

    .kampanya-slider-container {
        width: 98%;
        border: 1px solid var(--th-color-border-light);
        padding: 1px;
        border-radius: var(--th-radius-xl);
        margin-top: -20px
    }

    .kampanya-item {
        max-width: 98%;
        padding: 5px 15px
    }

    .easy-autocomplete {
        width: 100%!important
    }
}

.shipment-methods .method {
    flex: 1 1 calc(50% - 10px);
    padding: 10px;
    border-radius: var(--th-radius-lg);
    margin-bottom: 10px;
    gap: 15px;
    box-shadow: 0 2px 6px rgba(0,0,0,.08);
    transition: background .3s ease;
    background: var(--th-color-bg-soft);
    border-bottom: 1px solid rgba(0,0,0,.07);
    cursor: pointer;
    justify-content: flex-start
}

.payment-steps-1 {
    align-items: center;
    background-color: #fff
}

.payment-steps-1 .step {
    flex: 1;
    text-align: center;
    position: relative;
    padding: 10px 0;
    transition: all .3s ease;
    color: var(--th-color-text)
}

.payment-steps-1 .step .circle {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: var(--th-color-bg-soft);
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 5px;
    padding: 5px
}

.payment-steps-1 .step .circle img {
    max-width: 30px;
    max-height: 30px
}

.payment-steps-1 .step.active .circle,.payment-steps-1 .step.completed .circle {
    background-color: var(--th-color-success-bg)
}

.payment-steps-1 .step.active,.payment-steps-1 .step.completed {
    color: var(--th-color-success)
}

.payment-steps-1 .step:last-child::after {
    display: none
}

@media (max-width: 768px) {
    .payment-steps-1 {
        flex-direction: row;
        flex-wrap: nowrap;
        padding: 8px
    }

    .payment-steps-1 .step {
        padding: 8px 4px
    }

    .payment-steps-1 .step .circle {
        width: 35px;
        height: 35px
    }

    .payment-steps-1 .step .circle img {
        max-width: 22px;
        max-height: 18px
    }
}

.swiper.swiper-sepet-kargo {
    width: 100%!important
}

.free-cargo .navigation-yk button {
    width: 20px;
    height: 20px
}

.free-cargo .navigation-yk button i,.tool-filter .filterCat .filter-wrap .filter-item label {
    font-size: 12px
}

.free-cargo .navigation-yk button.next {
    right: -10px
}

.yonkasoft-header .header-wrap .menu-group,header .head-menu {
    gap: 10px
}

.free-cargo .free-cargo-box {
    flex-direction: column
}

.yonkasoft-header .header-wrap .header-middle-item {
    flex: 1
}


/* ======================================================
   SECTION: Cart Page – Product Rows
   Lines: approx 14365–14781
   Purpose: cart-product-row layout, td-product/price/qty,
            promotion product cards, best-deal badge
   ====================================================== */

.ana-jssocial-sh a,.cart-product-row {
    display: flex;
    align-items: center;
    padding: 0
}

.cart-product-row {
    justify-content: space-between;
    margin-bottom: 20px;
    background-color: #fff;
    border: 1px solid var(--th-color-border);
    border-radius: var(--th-radius-xl);
    height: auto
}

.cart-product-row .td-product {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex: 0 1 auto
}

.cart-product-row .td-price,.cart-product-row .td-quantity,.cart-product-row .td-total-price {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 1 auto
}

@media (min-width: 1024px) {
    .cart-product-row .td-product {
        flex: 0 1 60%;
        max-width: 60%
    }

    .cart-product-row .td-price,.cart-product-row .td-quantity,.cart-product-row .td-total-price {
        flex: 0 1 20%;
        max-width: 20%;
        box-sizing: border-box
    }
}

.promotion-product-item-card-x123 {
    border-radius: 68px;
    border: solid 1px #e6e6e6;
    display: flex;
    flex-direction: row;
    box-sizing: border-box;
    transition: .5s;
    position: relative;
    background: #fff
}

.promotion-product-item-card-x123.best-deal-x123 {
    border: 1px solid transparent;
    background-image: linear-gradient(#fff,#fff),linear-gradient(90deg,#ffad70,#ff4988);
    background-origin: border-box;
    background-clip: content-box,border-box
}

.best-deal-badge-x123 {
    background: linear-gradient(90deg,#f96 0,#ff5e62 100%);
    top: -6px;
    left: 185px;
    transform: translateY(-50%);
    border-radius: var(--th-radius-2xl);
    color: #fff;
    font-size: 10px;
    font-weight: 600;
    line-height: 10px;
    padding: 4px 8px;
    position: absolute;
    z-index: 2;
    display: flex;
    align-items: center
}

.best-deal-badge-x123 i {
    margin-right: 5px;
    margin-left: 5px
}


.static-badge-x123 {
    background: linear-gradient(90deg, #4fd1c5 0%, #38b2ac 100%);
    top: -6px;
    left: 20px; /* indirim badge’in soluna */
    transform: translateY(-50%);
    border-radius: var(--th-radius-2xl);
    color: #fff;
    font-size: 10px;
    font-weight: 600;
    line-height: 10px;
    padding: 4px 8px;
    position: absolute;
    z-index: 2;
    display: flex;
    align-items: center;
}

.static-badge-x123 i {
    margin-right: 5px;
    margin-left: 5px;
    color: #fff;
}



.kupon-kampanya-sade {
    background: var(--th-color-success-bg);
    box-shadow: inset 0 4px 8px rgba(0,0,0,.1);
    border-radius: var(--th-radius-lg);
    padding: 14px 24px;
    margin-bottom: 20px;
    color: var(--th-color-success);
    font-size: 16px;
    margin-left: auto;
    margin-right: auto
}

.kupon-kampanya-sade i {
    margin-right: 6px;
    color: var(--th-color-success)
}

.kupon-kampanya-sade small {
    display: block;
    margin-top: 6px;
    font-size: 13px;
    color: var(--th-color-success)
}

@media (max-width: 768px) {
    .kupon-kampanya-sade {
        padding: 12px 16px;
        font-size: 14px
    }

    kampanya-wrap-99x {
        border: 0;
        border-radius: 0;
        padding: 0;
        background: #fff
    }

    .kupon-kampanya-sade small {
        font-size: 12px
    }
}

.cart-product-row:hover {
    background-color: #fff
}

@media (max-width: 768px) {
    .shopping-cart-1 .table tr .td-total-price {
        float: right;
        width: 25%;
        position: relative;
        bottom: 50px;
        right: 0
    }

    .shopping-cart-1 .table tr .td-total-price .old-value {
        color: var(--th-color-text);
        font-size: 10px;
        padding-bottom: 0;
        margin-right: 20px;
        font-weight: 400
    }

    .shopping-cart-1 .table tr .td-total-price .value {
        font-size: 16px;
        color: var(--th-color-text)
    }
}

.shopping-cart-1 {
    border: 0;
    border-radius: var(--th-radius-md)
}

@media (max-width: 768px) {
    .shopping-cart-1 {
        background: transparent !important;
        border-radius: var(--th-radius-xl);
        box-shadow: none!important
    }
}

.shopping-cart-1 .table-responsive {
    width: 100%;
    overflow-x: inherit;
}

.shopping-cart-1 .table-hover {
    width: 100%;
    background: #fff;
    border-radius: var(--th-radius-xl)
}

.shopping-cart-1 .th-cargo,.shopping-cart-1 .th-price,.shopping-cart-1 .th-product,.shopping-cart-1 .th-quantity,.shopping-cart-1 .th-total-price {
    padding: 5px;
    text-align: center;
    border-right: 1px solid var(--th-color-border-light);
    font-weight: 600;
    color: var(--th-color-text);
    background: #fefefe;
    border-bottom: none
}

.shopping-cart-1 .td-product .product {
    display: flex;
    align-items: center;
    position: relative
}

@media (max-width: 767px) {
    .shopping-cart-1 .td-product .image img {
        border: 1px solid var(--th-color-border-light);
        border-radius: var(--th-radius-md)
    }
}

@media (max-width: 768px) {
    .shopping-cart-1 .td-product .product .p-info .name {
        color: var(--th-color-text)!important;
        font-size: 12px;
        font-weight: 400;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        margin-top: -22px;
        line-height: 20px
    }
}

.shopping-cart-1 .td-total-price .old-value {
    color: var(--th-color-text-muted);
    display: block;
    font-size: 12px;
    text-decoration: line-through;
    padding-bottom: 35px;
    margin-right: -57px
}

@media (max-width: 767px) {
    .td-total-price .value {
        font-weight: 600;
        font-size: 18px;
        line-height: 22px;
        color: var(--th-color-text);
        margin-top: -5px
    }
}

.shopping-cart-1 .td-product .image img {
    padding: 2px;
    margin-right: 10px;
    border: 1px solid var(--th-color-border-light);
    border-radius: var(--th-radius-md)
}

.shopping-cart-1 .shopping-buttons-1 {
    margin-top: 20px;
    display: flex;
    justify-content: space-between
}

.cart-body .td-price input.form-control {
    border-top: 1px solid var(--th-color-success)!important;
    border-bottom: 1px solid var(--th-color-success)!important
}

.cart-body a.btn.btn-minus,.cart-body a.btn.btn-plus {
    border-top: 2px solid var(--th-color-success)!important;
    border-bottom: 2px solid var(--th-color-success)!important
}

.cart-body a.btn.btn-plus {
    border-right: 1px solid var(--th-color-success)!important
}

.cart-body .btn.btn-minus,.cart-body .product-quantity .btn.btn-plus {
    background: var(--th-color-success)!important;
    color: #fff;
    border-color: var(--th-color-success)
}

.table-hover tbody tr {
    border-radius: var(--th-radius-xl);
    background-color: #fff!important
}

.tilbecartbody {
    display: flex;
    border: 1px solid var(--th-color-border)!important;
    border-radius: var(--th-radius-xl);
    margin-bottom: 10px
}

.table-hover {
    width: 100%
}

@media (max-width: 767px) {
    .table-hover tbody tr {
        display: block;
        padding: 1px;
        margin-bottom: 15px
    }

    .table-hover tbody td {
        display: block;
        width: 100%;
        text-align: left
    }
}

.table-hover tbody tr:hover {
    background-color: #fff!important;
    transition: background .3s ease-in-out
}

@media (max-width: 767px) {
    .product-quantity,.product-quantity-type {
        justify-content: flex-start
    }
}

.cart-body a.btn.btn-minus {
    border-left: 1px solid var(--th-color-success)!important
}

.cart-body .btn.btn-minus {
    border-color: var(--th-color-success)!important
}

@media (min-width: 768px) {
    .shopping-cart-1 .td-product .product .p-info .name {
        font-size: 14px;
        font-weight: 400;
        display: inline-block;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 55ch;
        line-height: 1.4
    }

    .paysec-methods .item.small {
        color: #000;
        font-size: 9px;
        font-weight: 500;
        display: flex;
        flex-direction: row;
        align-items: center;
        border: 1px solid var(--th-color-border);
        border-radius: var(--th-radius-md);
        padding: 10px 5px;
        gap: 13px
    }
}

.shopping-cart-1 .btn-continue {
    background: var(--th-color-success);
    color: #fff;
    padding: 10px 20px;
    border-radius: var(--th-radius-md);
    text-decoration: none
}

.shopping-cart-1 .btn-continue:hover {
    background: var(--th-color-success-dark)
}

.unique-info-container .icon-style {
    font-size: 18px;
    color: var(--th-color-accent)
}

@media (max-width: 768px) {
    .unique-info-container .unique-info-box span {
        display: block;
        width: 100%;
        font-size: 13px;
        font-weight: 500;
        color: var(--th-color-text);
        font-family: "Poppins",sans-serif
    }

    .product-profile-1 .product-reviews .review-icon {
        width: 17px;
        height: auto;
        margin-bottom: 0
    }
}

.ana-shareAge {
    position: absolute;
    right: 10px;
    top: -10px;
    box-shadow: rgba(0,0,0,.05)0 1px 2px 0;
    border-radius: 50%;
    padding: 10px;
    background: #fff
}

.ana-modal-box {
    position: absolute;
    z-index: 999;
    top: 10px;
    right: 20px
}

.ana-modal-inside {
    position: relative;
    left: 0
}

.ana-modal-box {
    display: none
}

.ana-overlayAge {
    display: none;
    position: fixed;
    width: 100%;
    background: #65656585;
    left: 0;
    top: 0;
    height: 100%;
    z-index: 123;
    cursor: pointer
}


/* ======================================================
   SECTION: Cart Page – Misc & Free Shipping
   Lines: approx 15000–15348
   Purpose: sepetteki-urunler-baslik, free-shipping-message,
            sepet-indirim-mesaji, shopping buttons,
            limited-time-offer
   ====================================================== */

.sepetteki-urunler-baslik {
    background-color: #fff;
    padding: 15px;
    border-radius: var(--th-radius-lg);
    display: flex;
    align-items: center;
    justify-content: flex-start;
    font-size: 20px;
    font-weight: 600;
    color: var(--th-color-text)
}

.sepetteki-urunler-baslik i {
    color: var(--th-color-text);
    margin-right: 15px;
    font-size: 24px
}

.sepetteki-urunler-baslik .mesaj {
    font-size: 18px
}

.free-shipping-message,.sepet-indirim-mesaji {
    display: flex;
    align-items: center;
    background: #fff;
    color: #000;
    font-size: 14px;
    font-weight: 400;
    padding: 15px 15px 15px 5px;
    border-radius: var(--th-radius-lg);
    margin-top: 11px
}

.free-shipping-message i,.sepet-indirim-mesaji i {
    font-size: 15px;
    margin-right: 8px;
    color: var(--th-color-success)
}

@media (max-width: 768px) {
    .extra-advantage,.limited-time-offer {
        order: -1;
        margin-top: 0
    }
}

/* ======================================================
   SECTION: Auth – Login, Password Reset & Register
   Lines: approx 15349–16207
   Purpose: checkout login form, checkout-title/subtitle,
            guest-checkout, password reset, register form,
            ana-register container
   ====================================================== */

.login-body .p-g-mod-t-4 .checkout-login-container {
    margin: 0 auto;
    padding: 15px;
    background: #fff;
    border-radius: var(--th-radius-xl);
    box-shadow: 0 4px 12px rgba(0,0,0,.08)
}

.login-body .p-g-mod-t-4 .checkout-title {
    font-size: 18px;
    font-weight: 600;
    color: var(--th-color-text);
    text-align: center
}

.checkout-header {
    margin-top: -8px
}

.login-body .p-g-mod-t-4 .checkout-subtitle {
    font-size: 15px;
    color: var(--th-color-text-muted);
    text-align: center;
    margin-bottom: 20px
}

.login-body .p-g-mod-t-4 .guest-checkout {
    text-align: center;
    margin-bottom: -5px;
    margin-top: 25px
}

.login-body .p-g-mod-t-4 .btn-without-login {
    font-size: 15px;
    padding: 12px 18px;
    border-radius: var(--th-radius-lg);
    background: #fff;
    color: var(--th-color-success);
    border: 2px solid var(--th-color-success);
    transition: all .3s ease-in-out;
    font-weight: 600
}

.login-body .p-g-mod-t-4 .btn-without-login:hover {
    background: var(--th-color-success);
    color: #fff;
    box-shadow: 0 3px 6px rgba(40,167,69,.2)
}

.login-body .p-g-mod-t-4 .guest-info {
    font-size: 13px;
    color: var(--th-color-text-muted);
    margin-top: 6px
}

.login-body .p-g-mod-t-4 .form-group {
    margin-bottom: 18px
}

.login-body .p-g-mod-t-4 .form-control {
    height: 60px;
    border: 1px solid var(--th-color-border);
    border-radius: var(--th-radius-lg);
    font-size: 15px;
    padding: 12px;
    transition: border .3s ease-in-out
}

.login-body .p-g-mod-t-4 .form-control:focus {
    border-color: var(--th-color-success);
    box-shadow: 0 0 6px rgba(40,167,69,.2);
    outline: 0
}

.login-body .p-g-mod-t-4 .login-form input,.login-body .p-g-mod-t-4 .register-form input {
    display: block;
    margin-bottom: 15px;
    background-color: #fff!important
}

.membership-info {
    margin: 40px auto;
    padding: 40px;
    background-color: #fff;
    border-radius: var(--th-radius-xl);
    border: 1px solid var(--th-color-border)
}

.membership-info h4 {
    font-size: 26px;
    color: var(--th-color-text);
    margin-bottom: 20px;
    font-weight: 700;
    text-align: left;
    border-bottom: 1px solid #007bff;
    padding-bottom: 10px
}

.membership-advantages ul {
    list-style-type: none;
    padding: 0;
    margin: 0;
    font-size: 18px;
    color: var(--th-color-text-muted)
}

.membership-advantages li {
    margin-bottom: 12px;
    display: flex;
    align-items: center
}

.payment-agreement-checbox-1.sozlesme-kenarlik {
    border: 1px solid var(--th-color-border);
    border-radius: var(--th-radius-xl);
    padding: 25px 15px
}

.payment-agreement-checbox-1 a {
    font-weight: 500;
    font-size: 12px;
    color: var(--th-color-text)
}

.form-check-inline.mesaj02 {
    display: -ms-inline-flexbox;
    display: inline-flex;
    align-items: center;
    padding-left: 0;
    margin-right: 0
}

.membership-advantages i {
    color: var(--th-color-success);
    margin-right: 12px;
    font-size: 20px
}

.easy-signup,.loyalty-program,.return-policy,.security-info,.special-offers {
    margin-bottom: 30px
}

.easy-signup p,.loyalty-program p,.return-policy p,.security-info p,.special-offers p {
    font-size: 16px;
    line-height: 1.5;
    color: var(--th-color-text-muted)
}

.customer-support {
    background-color: #f1f7fc;
    padding: 25px;
    border-radius: var(--th-radius-lg);
    border: 1px solid #c0d6e4;
    box-shadow: 0 4px 12px rgba(0,0,0,.05)
}

.customer-support h4 {
    font-size: 24px;
    color: #007bff;
    margin-bottom: 20px
}

.customer-support a,.whatsapp-link {
    color: #007bff;
    text-decoration: none
}

.customer-support a:hover,.login-body .p-g-mod-t-4 .forgot-password:hover,.login-body .p-g-mod-t-4 .forgot-passwords:hover,.whatsapp-link:hover {
    text-decoration: underline
}

.whatsapp-link {
    font-weight: 700;
    color: #25d366
}

@media (max-width: 768px) {
    .membership-info {
        padding: 20px
    }

    .membership-info h4 {
        font-size: 22px
    }

    .membership-advantages ul {
        padding-left: 20px
    }

    .customer-support {
        padding: 15px
    }
}

.login-body .p-g-mod-t-4 .forgot-password,.login-body .p-g-mod-t-4 .forgot-passwords {
    text-align: right;
    font-size: 13px;
    color: var(--th-color-success);
    text-decoration: none;
    margin-bottom: 15px
}

.forgot-password,.forgot-passwords {
    display: inline-block;
    margin-right: 15px
}

.login-body .p-g-mod-t-4 .forgot-passwords {
    text-align: left
}

.login-body .p-g-mod-t-4 .btn-success {
    background: var(--th-color-success);
    color: #fff;
    font-size: 16px;
    padding: 10px;
    border-radius: var(--th-radius-lg);
    transition: all .3s ease-in-out;
    font-weight: 600;
    width: 100%
}

.login-body .p-g-mod-t-4 .btn-success:hover {
    background: var(--th-color-success-dark);
    box-shadow: 0 3px 6px rgba(40,167,69,.2)
}

.login-body .p-g-mod-t-4 .checkout-tabs {
    margin-bottom: 25px
}

.login-body .p-g-mod-t-4 .nav-tabs {
    display: flex;
    justify-content: center;
    border: 0;
    gap: 0;
    padding: 1px 0 0
}

.login-body .p-g-mod-t-4 .nav-tabs .nav-link {
    padding: 12px 50px;
    font-size: 15px;
    font-weight: 600;
    color: var(--th-color-text)e48;
    border-radius: 13px;
    flex: 1;
    text-align: center;
    cursor: pointer;
    position: relative;
    background-color: var(--th-color-bg-soft);
    border: 1px solid var(--th-color-border)
}

.a4fgh-checkbox-group {
    display: flex;
    align-items: center;
    margin-bottom: 15px
}

.a4fgh-checkbox-group input[type=checkbox] {
    margin-right: 12px;
    width: 18px;
    height: 18px
}

.a4fgh-checkbox-group label {
    font-size: 14px;
    font-weight: 500;
    color: var(--th-color-text);
    margin: 0;
    cursor: pointer;
    display: inline-block
}

.login-body .p-g-mod-t-4 .nav-tabs .nav-link.active {
    background-color: #fff;
    z-index: 1;
    transform: scaleX(1.2);
    border: 1px solid var(--th-color-border)
}

.login-body .p-g-mod-t-4 .nav-tabs .nav-link:not(.active) {
    background-color: var(--th-color-bg-soft);
    border: 1px solid var(--th-color-border);
    position: relative
}

.x9sdfkfj {
    padding: 10px 0 30px;
    font-family: Arial,sans-serif;
    text-align: center
}

.login-title-3kfdks {
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 15px;
    color: var(--th-color-text-muted)
}

.social-buttons-sjkd9 {
    display: flex;
    justify-content: space-between;
    gap: 10px
}

.btn-78dfgj,.btn-89kfdg,.btn-98sfjd {
    align-items: center;
    justify-content: center;
    padding: 10px;
    font-size: 10px;
    font-weight: 500;
    border-radius: var(--th-radius-md);
    text-decoration: none;
    color: #fff;
    text-align: center;
    flex-grow: 1;
    transition: background-color .3s;
    background-color: #3b5998
}

.btn-78dfgj i,.btn-89kfdg i,.btn-98sfjd i {
    font-size: 20px
}

.btn-78dfgj:hover {
    background-color: #2d4373
}

.btn-89kfdg,.btn-98sfjd {
    background-color: #db4437
}

.btn-89kfdg:hover {
    background-color: #c1351d
}

.btn-98sfjd {
    background-color: #000
}

.btn-98sfjd:hover {
    background-color: var(--th-color-text)
}

.login-body .p-g-mod-t-4 .nav-tabs .nav-link:hover {
    background: #fff;
    color: var(--th-color-success)
}

.login-body .p-g-mod-t-4 .tab-content {
    padding: 20px
}

.login-body .p-g-mod-t-4 .social-login {
    text-align: center;
    margin-top: 18px
}

.login-body .p-g-mod-t-4 .social-login p {
    font-size: 14px;
    font-weight: 600;
    color: var(--th-color-text-muted);
    margin-bottom: 12px
}

.login-body .p-g-mod-t-4 .social-login .btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: 12px;
    border-radius: var(--th-radius-lg);
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 10px;
    transition: all .3s ease-in-out
}

.login-body .p-g-mod-t-4 .btn-facebook {
    background: #3b5998;
    color: #fff
}

.login-body .p-g-mod-t-4 .btn-facebook:hover {
    background: #2d4373
}

.login-body .p-g-mod-t-4 .btn-google {
    background: #db4437;
    color: #fff
}

.login-body .p-g-mod-t-4 .btn-google:hover {
    background: #c1351d
}

.login-body .p-g-mod-t-4 .social-login .btn i {
    font-size: 18px;
    margin-right: 8px
}

.forgot-password-container {
    margin: 2px;
    background: #fff;
    border-radius: var(--th-radius-xl);
    box-shadow: 0 4px 12px rgba(0,0,0,.08);
    text-align: center;
    padding: 30px
}

.forgot-password-title {
    font-size: 22px;
    font-weight: 600;
    color: var(--th-color-text);
    text-align: center;
    margin-bottom: 8px
}

.forgot-password-subtitle {
    font-size: 14px;
    color: var(--th-color-text-muted);
    text-align: center;
    margin-bottom: 20px
}

.forgot-password-form {
    display: flex;
    flex-direction: column;
    gap: 15px
}

.forgot-password-input {
    height: 48px;
    border: 1px solid var(--th-color-border);
    border-radius: var(--th-radius-lg);
    font-size: 15px;
    padding: 12px;
    transition: border .3s ease-in-out;
    width: 100%
}

.forgot-password-input:focus {
    border-color: var(--th-color-success);
    box-shadow: 0 0 6px rgba(40,167,69,.2);
    outline: 0
}

.forgot-password-btn {
    background: var(--th-color-success);
    color: #fff;
    font-size: 16px;
    padding: 14px;
    border-radius: var(--th-radius-lg);
    transition: all .3s ease-in-out;
    font-weight: 600;
    width: 100%;
    border: 0;
    cursor: pointer
}

.forgot-password-btn:hover {
    background: var(--th-color-success-dark);
    box-shadow: 0 3px 6px rgba(40,167,69,.2)
}

.forgot-password-info-boxes {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 20px
}

.forgot-password-info {
    width: 48%;
    text-align: center;
    padding: 10px;
    font-size: 14px;
    color: var(--th-color-text-muted);
    background: var(--th-color-bg-soft);
    border-radius: var(--th-radius-lg);
    margin: 5px;
    display: flex;
    align-items: center;
    justify-content: center
}

.forgot-password-info i,.password-reset-info i {
    font-size: 20px;
    color: var(--th-color-success);
    margin-right: 8px
}

@media (max-width: 768px) {
    .forgot-password-container {
        max-width: 100%;
        padding: 20px
    }

    .login-body .p-g-mod-t-4 .tab-content {
        padding: 0
    }

    .login-body .p-g-mod-t-4 .nav-tabs .nav-link {
        padding: 12px 46px;
        font-size: 15px
    }

    .forgot-password-info {
        width: 100%
    }
}

@media (min-width: 768px) {
    .login-body.p-g-mod-t-4 {
        background: #fff;
        border-radius: var(--th-radius-xl);
        padding: 20px;
        box-shadow: 0 4px 12px rgba(0,0,0,.1)
    }
}

.password-reset-container {
    max-width: 480px;
    margin: 0 auto;
    padding: 25px;
    background: #e3f2fd;
    border-radius: var(--th-radius-xl);
    box-shadow: 0 4px 12px rgba(0,0,0,.08);
    text-align: center
}

.password-reset-title {
    font-size: 22px;
    font-weight: 600;
    color: var(--th-color-text);
    text-align: center;
    margin-bottom: 8px
}

.password-reset-subtitle {
    font-size: 14px;
    color: var(--th-color-text-muted);
    text-align: center;
    margin-bottom: 20px
}

.password-reset-form {
    display: flex;
    flex-direction: column;
    gap: 15px
}

.password-reset-input {
    height: 48px;
    border: 1px solid var(--th-color-border);
    border-radius: var(--th-radius-lg);
    font-size: 15px;
    padding: 12px;
    transition: border .3s ease-in-out;
    width: 100%
}

.password-reset-input:focus {
    border-color: var(--th-color-success);
    box-shadow: 0 0 6px rgba(40,167,69,.2);
    outline: 0
}

.password-reset-btn {
    background: var(--th-color-success);
    color: #fff;
    font-size: 16px;
    padding: 14px;
    border-radius: var(--th-radius-lg);
    transition: all .3s ease-in-out;
    font-weight: 600;
    width: 100%;
    border: 0;
    cursor: pointer
}

.password-reset-btn:hover {
    background: var(--th-color-success-dark);
    box-shadow: 0 3px 6px rgba(40,167,69,.2)
}

.password-reset-info-boxes {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin-top: 20px
}

.password-reset-info {
    width: 48%;
    text-align: center;
    padding: 10px;
    font-size: 14px;
    color: var(--th-color-text-muted);
    background: var(--th-color-bg-soft);
    border-radius: var(--th-radius-lg);
    margin: 5px;
    display: flex;
    align-items: center;
    justify-content: center
}

@media (max-width: 768px) {
    .password-reset-container {
        max-width: 100%;
        padding: 20px
    }

    .password-reset-info {
        width: 100%
    }

    .login-body.p-g-mod-t-4 {
        background: #fff;
        border-radius: var(--th-radius-xl);
        padding: 20px 15px 25px;
        margin: 20px 5px 10px;
        border: 1px solid var(--th-color-border)
    }

    .pattern-group .p-g-mod .p-g-mod-body {
        padding: 1px
    }
}

.cat-responsive-buttons {
    display: flex;
    justify-content: center;
    width: 100%;
    padding-bottom: 10px;
    box-sizing: border-box;
    margin: 1px 0
}

.cat-responsive-buttons .btn-group {
    display: flex;
    width: 100%
}

.kategori-uclu-liste .owl-wrapper .th2-card .th2-card__inner .th2-card__prices .th2-card__price-wrap .th2-card__price-sale {
    font-size: 10px;
    font-weight: 600;
    color: #000;
    margin-left: 4px
}

@media (max-width: 767px) {
    .kategori-uclu-liste .th2-card .th2-card__inner .buttons .btn-cart {
        font-size: 10px
    }
}

@media (max-width: 768px) {
    .kategori-uclu-liste .owl-wrapper .th2-card .th2-card__inner .th2-card__prices .th2-card__price-wrap .th2-card__price-old {
        font-size: 9px;
        color: var(--th-color-text-muted);
        font-weight: 500;
        text-decoration: line-through!important
    }
}

.cat-responsive-buttons .btn-group .btn {
    flex: 1;
    font-size: 16px;
    padding: 8px 0;
    transition: all .3s ease
}

.cat-responsive-buttons .btn-group .btn:hover {
    background-color: var(--th-color-text);
    color: #fff
}

.cat-responsive-buttons .btn-group .btn:first-child {
    border-top-left-radius: 2px;
    border-bottom-left-radius: 2px
}

.cat-responsive-buttons .btn-group .btn:last-child {
    border-top-right-radius: 2px;
    border-bottom-right-radius: 2px
}

cat-responsive-buttons .cat-responsive-popup {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background: #fff;
    box-shadow: 0-2px 10px rgba(0,0,0,.1);
    padding: 15px;
    display: flex;
    flex-direction: column;
    align-items: center;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
    transition: transform .3s ease-in-out
}

cat-responsive-buttons .cat-responsive-popup.d-none {
    transform: translateY(100%)
}

cat-responsive-buttons .c-r-p-content {
    width: 100%
}

cat-responsive-buttons .c-r-p-bar {
    width: 50px;
    height: 4px;
    background: #ccc;
    border-radius: 2px;
    margin: 8px auto
}

.ana-register-container {
    max-width: 500px;
    margin: 40px auto;
    padding: 30px;
    background: #fff;
    border-radius: var(--th-radius-xl);
    box-shadow: 0 4px 10px rgba(0,0,0,.1);
    text-align: center
}

.ana-register-container h2 {
    font-size: 22px;
    margin-bottom: 15px;
    color: var(--th-color-text);
    font-weight: 700;
    text-align: center
}

.ana-register-container.cta-text {
    font-size: 16px;
    color: var(--th-color-text);
    margin-top: 10px;
    font-weight: 700;
    text-align: center
}

.ana-register-container .cta-offer {
    background-color: #f5faff;
    border-left: 5px solid #007bff;
    padding: 15px;
    margin: 20px 0;
    font-size: 16px;
    text-align: center;
    border-radius: var(--th-radius-lg)
}

.ana-register-container .cta-offer p {
    margin: 5px 0
}

.ana-register-container .cta-offer strong {
    color: #007bff;
    font-size: 18px
}

.ana-register-container .security-note {
    font-size: 12px;
    color: var(--th-color-text-muted);
    margin-top: 20px;
    font-style: italic;
    text-align: center
}

.ana-register-container .social-register {
    margin-top: 20px;
    text-align: center
}

.ana-register-container .social-register .social-btn {
    width: 48%;
    padding: 12px;
    margin: 5px;
    border-radius: var(--th-radius-lg);
    font-weight: 700;
    cursor: pointer;
    transition: background .3s ease
}

.ana-register-container .social-register .facebook-btn {
    background: #3b5998;
    color: #fff
}

.ana-register-container .social-register .facebook-btn:hover {
    background: #2d4373
}

.ana-register-container .social-register .google-btn {
    background: #db4437;
    color: #fff
}

.ana-register-container .social-register .google-btn:hover {
    background: #c1351d
}

.ana-register-container .ana-form-group {
    margin-bottom: 15px;
    text-align: left
}

.ana-register-container .ana-form-group label {
    font-weight: 600;
    display: block;
    margin-bottom: 5px
}

.ana-register-container .ana-form-group input {
    width: 100%;
    padding: 12px;
    border: 1px solid var(--th-color-border);
    border-radius: var(--th-radius-lg);
    font-size: 14px;
    transition: border .3s ease
}

.ana-register-container .ana-form-group input:focus {
    border-color: #007bff;
    outline: 0
}

.ana-register-container .ana-checkbox-group {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 10px
}

.ana-register-container .ana-register-btn {
    width: 100%;
    padding: 12px;
    background: var(--th-color-success);
    border: 0;
    border-radius: var(--th-radius-lg);
    color: #fff;
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    transition: background .3s ease;
    margin-top: 15px;
    margin-bottom: 15px;
    height: 50px
}

.ana-register-container .ana-register-btn:hover {
    background: var(--th-color-success-dark)
}


/* ======================================================
   SECTION: Cart Empty State & Payment Badges
   Lines: approx 17192–17299
   Purpose: cart-empty-alert, payment badge items,
            custom-tipara responsive, payment security
            mobile overrides
   ====================================================== */

.cart-empty-alert,.d-flex.pbi {
    display: flex;
    align-items: center
}

.cart-empty-alert {
    flex-direction: column;
    justify-content: center;
    font-size: 14px;
    min-height: 300px;
    background: var(--th-cart-bg);
    color: var(--th-cart-empty-text);
    width: fit-content;
    margin: 0 auto;
    padding: 60px;
    border-radius: var(--th-radius-2xl);
    box-shadow: 0 0 12px 4px #ededed
}

.d-flex.pbi {
    margin-bottom: 12px;
    gap: 8px
}

.product-detail-payment-badge-item {
    color: var(--th-color-text);
    font-size: 13px;
    letter-spacing: -.24px;
    width: 100%;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 8px
}

@media (max-width: 991px) {
    .cart-empty-alert {
        text-align: center;
        padding: 15px
    }
}

.cart-empty-alert .btn {
    font-size: 13px;
    font-weight: 500;
    margin-top: 15px;
    width: 80%;
    height: 50px
}

.cart-empty-alert .btn,.cart-empty-alert .btn a {
    align-items: center;
    justify-content: center
}

.cart-empty-alert .btn-success {
    color: var(--th-cart-empty-cta-text);
    background-color: var(--th-cart-empty-cta-bg);
    border-color: var(--th-cart-empty-cta-bg)
}

@media (max-width: 768px) {
    .custom-tipara-block {
        flex-direction: column;
        align-items: flex-start;
        padding: 10px;
        gap: 10px;
        display: flex;
        justify-content: flex-end
    }

    .payment-security-block,.payment-summary-box {
        padding: 20px 15px
    }

    .payment-security-block.basket-page {
        margin-top: -10px
    }

    .custom-tparab-left {
        display: none
    }

    .custom-col,.custom-font,.custom-product-detail-payment-badge-item,.custom-tt {
        font-size: 12px
    }

    .custom-age-tooltip img {
        width: 14px;
        height: 14px;
        margin-right: 18px;
        margin-top: -14px
    }

    .custom-age-tooltip {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: flex-end;
        cursor: pointer;
        margin-top: -20px;
        width: 100%
    }

    .custom-tool-side {
        width: 220px;
        font-size: 12px
    }
}

.product-shipping-badge {
    margin-top: 8px;
    padding: 6px 12px;
    background-color: var(--th-color-warning-bg);
    color: var(--th-color-warning);
    font-weight: 500;
    border-radius: var(--th-radius-md);
    display: inline-block
}

div#product-balance-block {
    color: var(--th-color-accent);
    font-size: 12px;
    font-style: normal;
    font-weight: 600;
    line-height: 14px
}

.product-profile-1 .product-reviews .stars .fa-star,.product-profile-1 .product-reviews .stars .fa-star-half {
    font-size: 14px
}

.product-profile-1 .product-reviews .stars {
    margin-top: -9px
}

.shopping-buttons-1 {
    padding: 0
}

.product-reviews .stars .star {
    color: #f0f0f0;
    font-size: 12px
}

.product-comment-list-v2 .score .stars .star {
    color: #f0f0f0;
    display: block;
    font-size: 30px;
    position: relative;
    width: 35px
}

.product-comment-list-v2 .comments .item .customer .stars i.fill {
    color: #fc0;
    font-size: 13px
}

.product-comment-list-v2 .score .stars .star.fill {
    color: #fc0
}

.product-comment-list-v2 .summary .item .stars .fill {
    color: #fc0;
    font-size: 14px
}

.product-comment-list-v2 .summary .item .rate .fill {
    background: #fc0;
    z-index: 1
}

.product-comment-list-v2 .score .stars .star.fill .dark {
    color: #f0f0f0
}

.product-comment-list-v2 .summary .item .stars i {
    margin-right: 2px;
    font-size: 14px
}

.product-comment-list-v2 .comments .item .customer .stars i,.product-comment-list-v2 .summary .item .stars {
    color: #d8d8d863;
    font-size: 14px
}

@media (max-width: 991px) {
    .product-comment-list-v2 .comments .item .customer .name {
        font-size: 12px
    }
}

.product-comment-list-v2 .comments .item .customer .date {
    color: var(--th-color-text-muted);
    font-size: 12px;
    margin-right: 10px;
    font-weight: 500
}

.discount-section .input-group {
    width: 100%;
    padding-right: 10px;
    padding-bottom: 15px
}

.payment-cart-summary-1 .summary tfoot th {
    font-size: 14px;
    letter-spacing: -.03em
}

@media (max-width: 1200px) {
    .final-vergi-dahil-text {
        font-size: 12px
    }
}

/* ======================================================
   SECTION: Checkout Responsive & Campaign Messages
   Lines: approx 17300–17613
   Purpose: payment-cart-summary responsive, final-vergi,
            blinking-text, kampanya messages, campaign
            slider, desktop-only-hr
   ====================================================== */

.final-vergi-dahil-text {
    font-weight: 400;
    font-size: 12px;
    line-height: 15px;
    letter-spacing: -.03em;
    color: var(--th-color-text-muted)
}

@media (max-width: 768px) {
    .payment-cart-summary-1 {
        padding: 20px 15px 0;
        margin-bottom: 15px;
        margin-top: -8px
    }
}

@media (max-width: 991px) {
    .payment-cart-summary-1 {
        margin-top: -10px;
        padding: 20px 15px 0;
        margin-bottom: 20px
    }
}

@media (max-width: 1200px) {
    .payment-cart-summary-1 {
        padding: 20px 15px 0;
        margin-bottom: 20px
    }
}

.payment-cart-summary-1 .summary tfoot .final {
    font-weight: 600;
    font-size: 16px;
    line-height: 19px;
    letter-spacing: -.03em;
    color: var(--th-color-success)
}

.blinking-text {
    animation: blink 1.5s infinite ease-in-out
}

.kampanya-container {
    margin-bottom: 20px;
    text-align: center
}

.kampanya-baslik {
    font-size: 14px;
    font-weight: 700;
    color: var(--th-color-accent);
    padding-bottom: -15px
}

.kampanya-mesaji {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 500;
    color: var(--th-color-success);
    margin-top: 10px;
    margin-bottom: 10px;
    padding-bottom: 10px;
    padding-top: 10px;
    border-radius: var(--th-radius-lg);
    background-color: var(--th-color-success)12;
    box-shadow: inset 0 1px 3px rgba(0,0,0,.1)
}

.kampanya-mesaji i,.kampanya-mesaji2 i {
    font-size: 20px;
    color: var(--th-color-success);
    margin-right: 8px;
    margin-left: 10px
}

.kampanya-mesaji span,.kampanya-mesaji2 span {
    color: var(--th-color-success);
    font-size: 12px;
    line-height: 1.7;
    text-align: left;
    font-weight: 400
}

.kampanya-mesaji-rengi,.order-detail-wrapper h2 {
    color: var(--th-color-text-muted);
    font-weight: 500
}

.kampanya-mesaji-rengi9 {
    color: var(--th-color-text-muted);
    font-weight: 700
}

.kampanya-mesaji2 {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 500;
    color: var(--th-color-text-muted);
    padding-bottom: 10px
}

.kampanya-mesaji2 i {
    color: var(--th-color-accent)
}

.kampanya-mesaji2 span {
    color: var(--th-color-text);
    font-weight: 500
}

@media (max-width: 767px) {
    .shopping-cart-1 .table tr .td-quantity {
        float: left;
        width: 50%;
        position: relative;
        top: -50px;
        left: 40px
    }
}

.kampanya-slider-container {
    width: 100%;
    background: 0 0;
    overflow: hidden;
    position: relative;
    scroll-snap-type: x mandatory;
    background-origin: border-box;
    background-clip: content-box,border-box
}

.kampanya-slider-wrapper {
    display: flex;
    gap: 0;
    animation: slideKampanya 30s infinite;
    scroll-behavior: smooth;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch
}

.kampanya-item {
    flex: 0 0 100%;
    max-width: 100%;
    background: 0 0;
    box-sizing: border-box;
    padding: 15px 5px 20px;
    display: flex;
    align-items: center;
    gap: 15px;
    scroll-snap-align: start;
    flex-wrap: nowrap
}

.kampanya-item i {
    font-size: 2.5rem;
    color: var(--th-color-danger);
    flex-shrink: 0
}

.kampanya-text {
    flex: 1 1 auto;
    min-width: 0;
    text-align: left
}

.kampanya-text h3 {
    color: var(--th-color-danger);
    font-size: 12px;
    font-weight: 600;
    margin-bottom: 6px;
    word-break: break-word
}

.kampanya-text p {
    color: var(--th-color-text-muted);
    font-size: 14px;
    line-height: 1.6;
    word-break: break-word;
    margin: -5px 0 0;
    font-weight: 400
}

.kampanya-text p span {
    font-weight: 600;
    color: #000
}

.kampanya-text p strong {
    font-weight: 600;
    color: var(--th-color-text)
}

.desktop-only-hr {
    display: block
}

@media (max-width: 768px) {
    .desktop-only-hr {
        display: none
    }
}


/* ============================================
   PREMIUM & MODERN VOUCHER CARD
   ============================================ */
.card-voucher {
    position: relative;
    background: #fff;
    border-radius: var(--th-radius-xl);
    padding: 22px 20px;
    border: 1px solid #eaeaea;
    box-shadow: 0 4px 14px rgba(0,0,0,0.05);
    max-width: 440px;
    margin: 20px auto;
    overflow: hidden;
    transition: .25s ease;
}

/* Hover – hafif premium hareket */
.card-voucher:hover {
    box-shadow: 0 8px 22px rgba(0,0,0,0.08);
    transform: translateY(-2px);
}

/* ============================================
   ÜST BİLGİ ALANI (KUPON ADI, TARİH, LİNK)
   ============================================ */
.card-voucher .meta {
    border-bottom: 1px dashed #d6d6d6;
    border-right: 0;
    flex: 1;
    flex-direction: column;
    margin-bottom: 10px;
    padding-bottom: 10px;
    text-align: center;
    width: 100%;
}

.card-voucher .meta .name {
    font-size: 17px;
    font-weight: 700;
    color: var(--th-color-text);
    letter-spacing: .3px;
}

.card-voucher .meta .date {
    font-size: 13px;
    margin-top: 4px;
    color: var(--th-color-text-muted);
}

.card-voucher .meta .link {
    margin-top: 5px;
    display: inline-block;
    font-size: 13px;
    color: #0072e6;
    font-weight: 600;
    text-decoration: none;
}

.card-voucher .meta .link:hover {
    text-decoration: underline;
}

/* ============================================
   İNDİRİM YAZISI
   ============================================ */
.card-voucher .info .discount {
    text-align: center;
    font-size: 28px;
    font-weight: 700;
    color: var(--th-color-accent);
    margin-bottom: 18px;
    letter-spacing: .5px;
}

/* ============================================
   KOD ALANI
   ============================================ */
.card-voucher .info .code {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #fafafa;
    border-radius: var(--th-radius-xl);
    padding: 12px 16px;
    border: 1px dashed #d5d5d5;
    transition: background .25s;
    cursor: pointer;
}

.card-voucher .info .code:hover {
    background: #f2f2f2;
}

/* Kod */
.card-voucher .info .value {
    font-size: 17px;
    font-weight: 700;
    color: var(--th-color-text);
    letter-spacing: 1px;
}

/* Kopyalama butonu */
.card-voucher .btn-copy {
    background: var(--th-color-accent);
    border: none;
    border-radius: var(--th-radius-lg);
    padding: 8px 14px;
    color: #fff;
    font-weight: 600;
    font-size: 13px;
    cursor: pointer;
    transition: .2s;
}

.card-voucher .btn-copy:hover {
    background: var(--th-color-accent-hover, #e44600);
}

/* ============================================
   ZARİF KUPON KESİK EFEKTİ (SADE & PROFESYONEL)
   ============================================ */

.card-voucher:before,
.card-voucher:after {
    content: "";
    position: absolute;
    width: 22px;
    height: 22px;
    background: #fff;
    border-radius: 50%;
    border: 1px solid var(--th-color-border);
    top: 50%;
    transform: translateY(-50%);
}

.card-voucher .info {
    align-items: center;
    display: flex;
    flex: 1;
    flex-direction: column;
    height: 100%;
    justify-content: center;
    width: 100%;
}

.card-voucher, .card-voucher .meta {
    align-items: center;
    display: flex;
    justify-content: center;
}

.card-voucher:before {
    left: -11px;
}

.card-voucher:after {
    right: -11px;
}

/* ============================================
   MOBİL
   ============================================ */
@media (max-width: 768px) {
    .card-voucher {
        padding: 18px 16px;
    }
    .card-voucher .meta .name {
        font-size: 15px;
    }
    .card-voucher .info .discount {
        font-size: 24px;
    }
    .card-voucher .info .value {
        font-size: 15px;
    }
}


.table-alt-cizgi {
    border-top: 1px solid var(--th-color-border-light)
}

.payment-cart-summary-1 .summary tfoot th .genel-toplam-ozet {
    font-size: 17px;
    font-weight: 600
}

.password-container {
    position: relative
}

.password-container .form-control {
    padding-right: 40px
}

.password-container .toggle-password {
    position: absolute;
    top: 50%;
    right: 10px;
    transform: translateY(-50%);
    cursor: pointer
}

.nav-tabs {
    margin-bottom: 20px
}

.nav-tabs .nav-item .nav-link {
    border-radius: 0
}

.new-cargo-class {
    margin-left: auto;
    margin-right: 0;
    border-left: 1px solid var(--th-color-border-light);
    padding-left: 10px
}

.new-cargo-class .cargo-details {
    display: flex;
    align-items: center;
    padding: 15px 0 0;
    gap: 10px
}

.new-cargo-class .cargo-details .cargo-icon {
    font-size: 18px;
    color: var(--th-color-success)
}

.new-cargo-class .cargo-details .countdown-text {
    font-size: 14px;
    color: #000
}

.new-cargo-class .cargo-details .countdown-text span {
    color: var(--th-color-success);
    font-size: 14px;
    font-weight: 500
}

.new-cargo-class .cargo-details .countdown-text b {
    color: #000
}

.invoice-info-fat {
    padding: 15px 20px;
    margin-top: 15px;
    background: var(--th-color-success-bg);
    border: 1px solid var(--th-color-success-border);
    border-radius: var(--th-radius-lg);
    color: var(--th-color-success);
    font-weight: 500
}

.order-detail-wrapper {
    margin: 60px auto;
    padding: 30px 25px;
    background: #fff;
    border-radius: var(--th-radius-2xl);
    box-shadow: 0 6px 24px rgba(0,0,0,.06);
    color: var(--th-color-text)
}

.order-detail-wrapper h1 {
    font-size: 24px;
    font-weight: 700;
    text-align: center;
    margin-bottom: 8px
}

.order-detail-wrapper h2 {
    font-size: 16px;
    text-align: center;
    margin-bottom: 18px
}

.product-profile-1 [style*="border-color:#AAAAAA"] {
    border-color: #fff!important
}

.order-detail-wrapper .explanation {
    font-size: 14px;
    color: var(--th-color-text-muted);
    background: var(--th-color-bg-soft);
    border-left: 4px solid var(--th-color-accent);
    padding: 12px 16px;
    border-radius: var(--th-radius-lg);
    margin-bottom: 25px
}

.order-detail-form label {
    font-weight: 500;
    margin-bottom: 6px;
    display: block;
    color: var(--th-color-text-secondary)
}

.order-detail-form .form-control {
    padding: 20px;
    font-size: 15px;
    border: 1px solid var(--th-color-border);
    border-radius: var(--th-radius-lg);
    transition: border-color .3s ease;
    height: 50px
}

.order-detail-form .form-control:focus {
    border-color: #0af;
    outline: 0
}

.order-detail-form .btn-success {
    width: 100%;
    padding: 12px;
    font-size: 15px;
    font-weight: 600;
    background-color: var(--th-color-success);
    border-color: var(--th-color-success);
    border-radius: var(--th-radius-xl);
    transition: background .3s ease
}

.order-detail-form .btn-success:hover {
    background-color: var(--th-color-success-dark);
    border-color: var(--th-color-success-dark)
}

.order-detail-response {
    margin-top: 20px;
    text-align: center;
    font-size: 15px;
    color: var(--th-color-text)
}



/* ==============================================
   PAYMENT METHOD MODAL (ty-*)
   Extracted from odeme.twig inline CSS
   ============================================== */

/* Payment modal tokens mapped to --th-* system */
    :root{
        --ty-surface: var(--th-color-surface);
        --ty-surface-2: var(--th-color-bg-secondary);
        --ty-border: var(--th-color-border);
        --ty-text: var(--th-color-text);
        --ty-muted: var(--th-color-text-muted);

        --ty-accent: var(--th-color-accent);
        --ty-accent-2: var(--th-color-accent-subtle);
        --ty-accent-3: var(--th-orange-50);

        --ty-shadow: var(--th-shadow-2xl);
        --ty-shadow-soft: var(--th-shadow-xl);
        --ty-radius: var(--th-radius-2xl);
    }

    .ty-modal{ position:fixed; inset:0; display:none; z-index:9999; }
    .ty-modal.is-open{ display:block; }

    .ty-modal__backdrop{
        position:absolute; inset:0;
        background: rgba(15, 23, 42, .58);
        backdrop-filter: blur(7px);
    }

    .ty-modal__dialog{
        position:relative;
        width:min(560px, calc(100vw - 28px));
        margin: 9vh auto 0 auto;
        background: var(--ty-surface);
        border: 1px solid rgba(233,233,239,.95);
        border-radius: var(--ty-radius);
        box-shadow: var(--ty-shadow);
        overflow:hidden;
        transform: translateY(10px);
        animation: tyPop .16s ease-out forwards;
    }
    @keyframes tyPop{ to { transform: translateY(0); } }

    .ty-modal__close{
        position:absolute;
        top:10px; right:10px;
        width:38px; height:38px;
        border-radius: var(--th-radius-xl);
        border: 1px solid rgba(233,233,239,.95);
        background:#fff;
        color: rgba(31,35,40,.75);
        font-size: 24px;
        line-height: 1;
        cursor:pointer;
        transition: transform .12s ease, box-shadow .12s ease, background .12s ease;
    }
    .ty-modal__close:hover{
        transform: translateY(-1px);
        box-shadow: var(--ty-shadow-soft);
    }

    .ty-modal__head{
        display:flex;
        gap:12px;
        align-items:flex-start;
        padding: 16px 16px 12px 16px;
        background:
            radial-gradient(1000px 240px at 20% -60%, rgba(242,122,26,.18), transparent 55%),
            radial-gradient(900px 260px at 95% 0%, rgba(242,122,26,.10), transparent 58%),
            linear-gradient(180deg, var(--ty-accent-3), var(--ty-surface));
        border-bottom: 1px solid rgba(233,233,239,.8);
    }

    .ty-modal__badge{
        width:40px; height:40px;
        border-radius: var(--th-radius-xl);
        display:flex; align-items:center; justify-content:center;
        background: var(--ty-accent-2);
        border: 1px solid rgba(242,122,26,.18);
        flex: 0 0 40px;
    }
    .ty-modal__badge svg{ fill: var(--ty-accent); }

    .ty-modal__titles{ min-width: 0; }
    .ty-modal__chips{ display:flex; gap:8px; margin-bottom: 6px; flex-wrap: wrap; }

    .ty-chip{
        display:inline-flex;
        align-items:center;
        padding: 4px 8px;
        border-radius: 999px;
        font-size: 11.5px;
        border: 1px solid rgba(233,233,239,.9);
        background: #fff;
        color: rgba(31,35,40,.78);
        user-select:none;
    }
    .ty-chip--info{
        border-color: rgba(242,122,26,.22);
        background: rgba(242,122,26,.08);
        color: rgba(31,35,40,.86);
    }
    .ty-chip--soft{
        border-color: rgba(233,233,239,.95);
        background: rgba(16,24,40,.03);
    }

    .ty-modal__title{
        margin:0;
        font-size: 15px;
        font-weight: 850;
        letter-spacing: .1px;
        color: var(--ty-text);
    }
    .ty-modal__subtitle{
       margin: 7px 0 0 0;
    font-size: 18px;
    color: var(--th-color-accent);
}

    .ty-modal__body{ padding: 14px 16px 16px 16px; background: var(--ty-surface); }
    .ty-modal__p{
        margin: 0 0 10px 0;
        font-size: 13.3px;
        line-height: 1.55;
        color: rgba(31,35,40,.92);
    }

    .ty-modal__note{
        background: var(--ty-surface-2);
        border: 1px solid rgba(233,233,239,.92);
        border-radius: var(--th-radius-xl);
        padding: 12px;
        margin: 10px 0 12px 0;
    }
    .ty-modal__noteTitle{
        font-size: 12.8px;
        font-weight: 750;
        color: var(--ty-text);
        margin-bottom: 8px;
    }
    .ty-modal__list{
        margin:0;
        padding: 0 0 0 18px;
        color: rgba(31,35,40,.88);
        font-size: 12px;
        line-height: 1.55;
    }
    .ty-modal__list li{ margin: 6px 0; }

    .ty-modal__faq{
        margin: 12px 0 10px 0;
        border: 1px solid rgba(233,233,239,.92);
        border-radius: var(--th-radius-xl);
        overflow:hidden;
        background: #fff;
    }
    .ty-faq__btn{
        width:100%;
        display:flex;
        justify-content: space-between;
        align-items:center;
        gap:12px;
        padding: 12px;
        background: #fff;
        border: 0;
        cursor:pointer;
        font-size: 13px;
        font-weight: 700;
        color: rgba(31,35,40,.9);
    }
    .ty-faq__chev{ opacity:.7; transition: transform .14s ease; }
    .ty-faq__btn[aria-expanded="true"] .ty-faq__chev{ transform: rotate(180deg); }

    .ty-faq__body{
        padding: 0 12px 12px 12px;
        background: var(--ty-surface-2);
        border-top: 1px solid rgba(233,233,239,.86);
    }
    .ty-faq__item{ padding-top: 10px; }
    .ty-faq__q{ font-size: 12.7px; font-weight: 750; color: rgba(31,35,40,.92); }
    .ty-faq__a{ margin-top: 4px; font-size: 12.7px; color: rgba(31,35,40,.78); line-height: 1.5; }

    .ty-modal__check{
      display: flex;
    gap: 10px;
    align-items: flex-start;
    margin-top: 10px;
    padding: 12px;
    border-radius: var(--th-radius-xl);
    background: rgb(59 242 26 / 7%);
    border: 1px solid rgb(23 69 0 / 18%);
    cursor: pointer;
    user-select: none;
    transition: transform .12s ease, box-shadow .12s ease;
}
    .ty-modal__check:hover{
        transform: translateY(-1px);
        box-shadow: 0 12px 26px rgba(242,122,26,.10);
    }
    .ty-modal__check input{
    margin-top: 2.5px;
    width: 17px;
    height: 25px;
    accent-color: var(--th-color-success);
    color: #fff;
}

    .ty-modal__actions{
        display:flex;
        gap:10px;
        justify-content:flex-end;
        margin-top: 14px;
    }

    .ty-btn{
        border-radius: var(--th-radius-xl);
        padding: 10px 12px;
        font-size: 13px;
        border: 1px solid rgba(233,233,239,.92);
        cursor:pointer;
        transition: transform .12s ease, box-shadow .12s ease, background .12s ease, opacity .12s ease;
        position: relative;
        display:inline-flex;
        align-items:center;
        gap:10px;
    }
    .ty-btn:hover{ transform: translateY(-1px); box-shadow: var(--ty-shadow-soft); }

    .ty-btn--ghost{
        background: #fff;
        color: rgba(31,35,40,.88);
    }

    .ty-btn--primary{
     background: var(--th-color-success);
    border-color: rgb(40 199 0 / 35%);
    color: #fff;
}
    .ty-btn--primary:disabled{
        opacity:.55;
        cursor:not-allowed;
        transform:none;
        box-shadow:none;
    }

    .ty-btn__spinner{
        width: 14px;
        height: 14px;
        border-radius: 50%;
        border: 2px solid rgba(255,255,255,.55);
        border-top-color: rgba(255,255,255,1);
        display:none;
        animation: tySpin .8s linear infinite;
    }
    @keyframes tySpin{ to { transform: rotate(360deg); } }

    .ty-btn.is-loading .ty-btn__spinner{ display:inline-block; }
    .ty-btn.is-loading .ty-btn__label{ opacity:.92; }

    @media (max-width: 480px) {
        .ty-modal__dialog{ margin-top: 3vh; border-radius: var(--th-radius-2xl); }
        .ty-modal__head, .ty-modal__body{ padding-left: 12px; padding-right: 12px; }
        .ty-modal__badge{ width: 38px; height: 38px; border-radius: 13px; }
    }

/* ═══════════════════════════════════════════════════════════════════
   CART PAGE — PREMIUM ENHANCEMENTS
   ═══════════════════════════════════════════════════════════════════ */

/* ── Cart Layout Grid ── */
.th2-cart-layout {
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: 24px;
  align-items: start;
  max-width: 1320px;
  margin: 0 auto;
  padding: 24px 16px;
}
@media (max-width: 991px) {
  .th2-cart-layout { grid-template-columns: 1fr; }
}

/* ── Cart Item Enhanced ── */
.th2-cart-item {
  display: flex;
  gap: 16px;
  padding: 20px 0;
  border-bottom: 1px solid var(--th-cart-item-border);
  position: relative;
  transition: background .2s ease, opacity .3s ease, transform .3s ease;
}
.th2-cart-item:hover {
  background: var(--th-cart-item-bg-hover);
  border-radius: var(--th-radius-lg);
}
.th2-cart-item.th2-cart-item--removing {
  opacity: 0;
  transform: translateX(-30px);
  max-height: 0;
  padding: 0;
  margin: 0;
  overflow: hidden;
  transition: all .4s ease;
}

.th2-cart-item__image {
  width: 100px;
  height: 100px;
  flex-shrink: 0;
  border-radius: var(--th-radius-lg);
  border: 1px solid var(--th-cart-item-border);
  overflow: hidden;
  background: var(--th-color-bg-secondary);
}
.th2-cart-item__image img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.th2-cart-item__body {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
}

.th2-cart-item__name {
  font-size: var(--th-text-sm);
  font-weight: 500;
  color: var(--th-color-text);
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-decoration: none;
  line-height: 1.4;
}
.th2-cart-item__name:hover { color: var(--th-color-primary); }

.th2-cart-item__variants {
  font-size: var(--th-text-xs);
  color: var(--th-color-text-muted);
}
.th2-cart-item__variant { display: inline; }
.th2-cart-item__variant + .th2-cart-item__variant::before { content: ' · '; }

.th2-cart-item__badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 11px;
  font-weight: 600;
  padding: 2px 8px;
  border-radius: var(--th-radius-full);
  width: fit-content;
}
.th2-cart-item__badge--promo {
  background: var(--th-color-accent-subtle);
  color: var(--th-color-accent);
}
.th2-cart-item__badge--freeship {
  background: var(--th-color-success-subtle);
  color: var(--th-color-success);
}

.th2-cart-item__bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: auto;
  gap: 12px;
}

.th2-cart-item__price {
  text-align: right;
  flex-shrink: 0;
}
.th2-cart-item__price .value {
  font-size: var(--th-text-base);
  font-weight: 700;
  color: var(--th-color-text);
  display: block;
}
.th2-cart-item__price .old-value {
  font-size: var(--th-text-xs);
  color: var(--th-color-text-muted);
  text-decoration: line-through;
  display: block;
}

/* ── Quantity Control Enhanced ── */
.th2-cart-qty {
  display: inline-flex;
  align-items: center;
  border: 1px solid var(--th-cart-quantity-border);
  border-radius: var(--th-radius-lg);
  overflow: hidden;
  background: var(--th-cart-quantity-bg);
  height: 36px;
}
.th2-cart-qty__btn {
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--th-cart-quantity-btn-bg);
  border: none;
  cursor: pointer;
  color: var(--th-color-text-secondary);
  font-size: 13px;
  transition: background .2s, color .2s;
  text-decoration: none;
}
.th2-cart-qty__btn:hover {
  background: var(--th-cart-quantity-btn-hover);
  color: var(--th-color-text);
}
.th2-cart-qty__input {
  width: 40px;
  height: 36px;
  text-align: center;
  border: none;
  background: var(--th-cart-quantity-bg);
  font-size: var(--th-text-sm);
  font-weight: 600;
  color: var(--th-color-text);
  -moz-appearance: textfield;
}
.th2-cart-qty__input::-webkit-outer-spin-button,
.th2-cart-qty__input::-webkit-inner-spin-button { -webkit-appearance: none; }

.th2-cart-qty.th2-cart-qty--pulse {
  animation: th2CartQtyPulse .3s ease;
}
@keyframes th2CartQtyPulse {
  0% { transform: scale(1); }
  50% { transform: scale(1.08); }
  100% { transform: scale(1); }
}

/* ── Remove Button ── */
.th2-cart-item__remove {
  position: absolute;
  top: 12px;
  right: 8px;
  width: 28px;
  height: 28px;
  border-radius: var(--th-radius-full);
  border: none;
  background: transparent;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--th-cart-remove-color);
  font-size: 14px;
  transition: all .2s;
}
.th2-cart-item__remove:hover {
  background: var(--th-color-danger-subtle, #fef2f2);
  color: var(--th-cart-remove-hover);
}

/* ── Cart Undo Toast ── */
.th2-cart-undo {
  position: fixed;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%) translateY(100px);
  background: var(--th-neutral-800);
  color: #fff;
  padding: 12px 20px;
  border-radius: var(--th-radius-xl);
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: var(--th-text-sm);
  z-index: 9999;
  box-shadow: var(--th-shadow-xl);
  opacity: 0;
  transition: transform .3s ease, opacity .3s ease;
}
.th2-cart-undo.th2-cart-undo--visible {
  transform: translateX(-50%) translateY(0);
  opacity: 1;
}
.th2-cart-undo__btn {
  background: var(--th-color-accent);
  color: #fff;
  border: none;
  padding: 6px 14px;
  border-radius: var(--th-radius-lg);
  font-size: var(--th-text-xs);
  font-weight: 600;
  cursor: pointer;
  transition: background .2s;
}
.th2-cart-undo__btn:hover { opacity: .9; }
.th2-cart-undo__timer {
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border: 2px solid rgba(255,255,255,.3);
  border-top-color: var(--th-color-accent);
  animation: th2UndoSpin 3s linear;
}
@keyframes th2UndoSpin { to { transform: rotate(360deg); } }

/* ── Free Shipping Progress Enhanced ── */
.th2-cart-progress {
  background: var(--th-color-bg-secondary);
  border-radius: var(--th-radius-xl);
  padding: 14px 16px;
  margin-bottom: 16px;
}
.th2-cart-progress__text {
  font-size: var(--th-text-sm);
  color: var(--th-cart-progress-text);
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.th2-cart-progress__text i { color: var(--th-cart-progress-fill); }
.th2-cart-progress__text strong { color: var(--th-color-text); font-weight: 700; }

.th2-cart-progress__bar {
  height: var(--th-cart-progress-height);
  background: var(--th-cart-progress-bg);
  border-radius: var(--th-cart-progress-radius);
  overflow: hidden;
}
.th2-cart-progress__fill {
  height: 100%;
  background: var(--th-cart-progress-fill);
  border-radius: var(--th-cart-progress-radius);
  transition: width .6s cubic-bezier(.4,0,.2,1);
}
.th2-cart-progress--complete .th2-cart-progress__text {
  color: var(--th-cart-progress-text-success);
  font-weight: 600;
}
.th2-cart-progress--complete .th2-cart-progress__fill {
  background: var(--th-cart-progress-complete);
}

/* ── Discount / Multi-Buy Banner ── */
.th2-cart-discount-banner {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  background: var(--th-color-accent-subtle);
  border-radius: var(--th-radius-xl);
  margin-bottom: 16px;
  font-size: var(--th-text-sm);
  font-weight: 600;
  color: var(--th-color-accent);
}
.th2-cart-discount-banner i { font-size: 18px; }

.th2-cart-discount-steps {
  display: flex;
  gap: 6px;
  margin-left: auto;
}
.th2-cart-discount-step {
  width: 32px;
  height: 6px;
  border-radius: var(--th-radius-full);
  background: var(--th-neutral-200);
  transition: background .3s ease;
}
.th2-cart-discount-step.completed { background: var(--th-color-accent); }

/* ── Cart Summary Enhanced ── */
.th2-cart-summary {
  position: sticky;
  top: 100px;
  background: var(--th-cart-summary-bg);
  border: 1px solid var(--th-cart-summary-border);
  border-radius: var(--th-cart-summary-radius);
  padding: 24px;
}
.th2-cart-summary__title {
  font-size: var(--th-text-lg);
  font-weight: 700;
  color: var(--th-color-text);
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 8px;
}
.th2-cart-summary__row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 0;
  font-size: var(--th-text-sm);
  color: var(--th-cart-summary-label);
}
.th2-cart-summary__row span:last-child {
  font-weight: 600;
  color: var(--th-cart-summary-value);
}
.th2-cart-summary__row--discount span:last-child {
  color: var(--th-cart-summary-discount);
}
.th2-cart-summary__row--shipping span:last-child {
  color: var(--th-cart-summary-shipping);
}
.th2-cart-summary__divider {
  border: none;
  border-top: 1px dashed var(--th-cart-summary-border);
  margin: 12px 0;
}
.th2-cart-summary__total {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 0 0;
}
.th2-cart-summary__total span:first-child {
  font-size: var(--th-text-base);
  font-weight: 600;
  color: var(--th-cart-summary-total-color);
}
.th2-cart-summary__total span:last-child {
  font-size: var(--th-cart-summary-total-font);
  font-weight: var(--th-cart-summary-total-weight);
  color: var(--th-cart-summary-total-color);
}
.th2-cart-summary__total small {
  font-size: var(--th-text-xs);
  color: var(--th-color-text-muted);
  font-weight: 400;
}

/* ── Checkout CTA ── */
.th2-cart-cta {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 14px 24px;
  border: none;
  border-radius: var(--th-radius-xl);
  font-size: var(--th-text-base);
  font-weight: 700;
  cursor: pointer;
  text-decoration: none;
  text-align: center;
  transition: background .2s, transform .1s;
  margin-top: 16px;
}
.th2-cart-cta:active { transform: scale(.98); }
.th2-cart-cta--primary {
  background: var(--th-color-accent);
  color: #fff;
}
.th2-cart-cta--primary:hover { background: var(--th-color-accent-hover); color: #fff; }
.th2-cart-cta--primary i { font-size: 14px; }

/* ── Trust Icons (Cart Summary) ── */
.th2-cart-trust {
  display: flex;
  justify-content: center;
  gap: 16px;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--th-cart-summary-border);
}
.th2-cart-trust span {
  font-size: 11px;
  color: var(--th-color-text-muted);
  display: flex;
  align-items: center;
  gap: 4px;
}
.th2-cart-trust i { font-size: 13px; color: var(--th-color-success); }

/* ── Coupon Enhanced ── */
.th2-cart-coupon {
  margin-top: 16px;
}
.th2-cart-coupon__toggle {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: var(--th-text-sm);
  font-weight: 500;
  color: var(--th-color-text-secondary);
  cursor: pointer;
  padding: 10px 0;
  border: none;
  background: none;
  width: 100%;
  text-align: left;
}
.th2-cart-coupon__toggle i { transition: transform .2s; }
.th2-cart-coupon__toggle.active i { transform: rotate(180deg); }

.th2-cart-coupon__form {
  display: flex;
  gap: 8px;
  margin-top: 8px;
}
.th2-cart-coupon__input {
  flex: 1;
  padding: 10px 14px;
  border: 1px solid var(--th-cart-coupon-border);
  border-radius: var(--th-radius-lg);
  font-size: var(--th-text-sm);
  background: var(--th-cart-coupon-bg);
  transition: border-color .2s;
}
.th2-cart-coupon__input:focus {
  outline: none;
  border-color: var(--th-cart-coupon-border-focus);
}
.th2-cart-coupon__submit {
  padding: 10px 18px;
  background: var(--th-cart-coupon-btn-bg);
  color: var(--th-cart-coupon-btn-text);
  border: none;
  border-radius: var(--th-radius-lg);
  font-size: var(--th-text-sm);
  font-weight: 600;
  cursor: pointer;
  transition: opacity .2s;
}
.th2-cart-coupon__submit:hover { opacity: .9; }

.th2-cart-coupon.th2-cart-coupon--success .th2-cart-coupon__input {
  border-color: var(--th-color-success);
  background: var(--th-cart-coupon-success-bg);
}
.th2-cart-coupon.th2-cart-coupon--error .th2-cart-coupon__input {
  border-color: var(--th-color-danger);
  animation: th2CouponShake .4s ease;
}
@keyframes th2CouponShake {
  0%, 100% { transform: translateX(0); }
  20% { transform: translateX(-6px); }
  40% { transform: translateX(6px); }
  60% { transform: translateX(-4px); }
  80% { transform: translateX(4px); }
}

/* ── Cart Empty Premium ── */
.th2-cart-empty {
  text-align: center;
  padding: 60px 24px;
  max-width: 420px;
  margin: 0 auto;
}
.th2-cart-empty__icon {
  font-size: 64px;
  color: var(--th-cart-empty-icon-color);
  margin-bottom: 20px;
  display: block;
}
.th2-cart-empty__title {
  font-size: var(--th-text-xl);
  font-weight: 700;
  color: var(--th-color-text);
  margin-bottom: 8px;
}
.th2-cart-empty__desc {
  font-size: var(--th-text-sm);
  color: var(--th-cart-empty-text);
  margin-bottom: 24px;
  line-height: 1.5;
}
.th2-cart-empty__cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 32px;
  background: var(--th-cart-empty-cta-bg);
  color: var(--th-cart-empty-cta-text);
  border: none;
  border-radius: var(--th-radius-xl);
  font-size: var(--th-text-base);
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  transition: opacity .2s, transform .1s;
}
.th2-cart-empty__cta:hover { opacity: .9; color: var(--th-cart-empty-cta-text); }
.th2-cart-empty__cta:active { transform: scale(.97); }

/* ── Cross-sell on Cart Page ── */
.th2-cart-cross {
  margin-top: 32px;
  padding-top: 24px;
  border-top: 1px solid var(--th-color-border-light);
}
.th2-cart-cross__title {
  font-size: var(--th-text-base);
  font-weight: 700;
  color: var(--th-color-text);
  margin-bottom: 16px;
}
.th2-cart-cross__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 12px;
}

/* ── Mobile Sticky Bottom Bar ── */
.th2-cart-mobile-bar {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 999;
  background: var(--th-color-bg);
  border-top: 1px solid var(--th-color-border);
  padding: 12px 16px;
  box-shadow: 0 -4px 20px rgba(0,0,0,.08);
}
.th2-cart-mobile-bar__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  max-width: 600px;
  margin: 0 auto;
}
.th2-cart-mobile-bar__total {
  font-size: var(--th-text-sm);
  color: var(--th-color-text-muted);
}
.th2-cart-mobile-bar__total strong {
  display: block;
  font-size: var(--th-text-lg);
  font-weight: 700;
  color: var(--th-color-text);
}
.th2-cart-mobile-bar__btn {
  flex: 1;
  max-width: 220px;
  padding: 12px 20px;
  background: var(--th-color-accent);
  color: #fff;
  border: none;
  border-radius: var(--th-radius-xl);
  font-size: var(--th-text-sm);
  font-weight: 700;
  cursor: pointer;
  text-decoration: none;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}
.th2-cart-mobile-bar__btn:hover { color: #fff; }
@media (max-width: 991px) {
  .th2-cart-mobile-bar { display: block; }
  .th2-cart-summary { position: static; }
  body.th2-cart-page { padding-bottom: 80px; }
}

/* ── Exit Intent Popup ── */
.th2-exit-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.55);
  z-index: 10010;
  opacity: 0;
  visibility: hidden;
  transition: opacity .3s, visibility .3s;
  display: flex;
  align-items: center;
  justify-content: center;
}
.th2-exit-overlay.th2-exit--visible {
  opacity: 1;
  visibility: visible;
}
.th2-exit-dialog {
  background: var(--th-color-bg);
  border-radius: var(--th-radius-2xl);
  padding: 32px;
  max-width: 420px;
  width: 90%;
  text-align: center;
  box-shadow: var(--th-shadow-2xl);
  transform: scale(.9);
  transition: transform .3s ease;
}
.th2-exit--visible .th2-exit-dialog { transform: scale(1); }
.th2-exit-dialog__icon {
  font-size: 48px;
  margin-bottom: 16px;
  display: block;
}
.th2-exit-dialog__title {
  font-size: var(--th-text-xl);
  font-weight: 700;
  color: var(--th-color-text);
  margin-bottom: 8px;
}
.th2-exit-dialog__text {
  font-size: var(--th-text-sm);
  color: var(--th-color-text-secondary);
  margin-bottom: 24px;
  line-height: 1.5;
}
.th2-exit-dialog__cta {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 13px 28px;
  background: var(--th-color-accent);
  color: #fff;
  border: none;
  border-radius: var(--th-radius-xl);
  font-size: var(--th-text-base);
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  transition: opacity .2s;
  margin-bottom: 12px;
}
.th2-exit-dialog__cta:hover { opacity: .9; color: #fff; }
.th2-exit-dialog__close {
  display: block;
  background: none;
  border: none;
  color: var(--th-color-text-muted);
  font-size: var(--th-text-sm);
  cursor: pointer;
  margin: 0 auto;
  padding: 8px;
}
.th2-exit-dialog__close:hover { color: var(--th-color-text); }

/* ── Checkout Steps Enhanced ── */
.th2-checkout-steps {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0;
  padding: 24px 16px;
  max-width: 600px;
  margin: 0 auto;
}
.th2-checkout-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  flex: 1;
  position: relative;
  font-size: var(--th-text-xs);
  color: var(--th-color-text-muted);
  font-weight: 500;
  text-decoration: none;
}
.th2-checkout-step__circle {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--th-neutral-100);
  border: 2px solid var(--th-neutral-300);
  transition: all .3s ease;
  position: relative;
  z-index: 1;
}
.th2-checkout-step__circle img {
  width: 20px;
  height: 20px;
  opacity: .5;
  transition: opacity .3s;
}
.th2-checkout-step.active .th2-checkout-step__circle {
  background: var(--th-color-primary);
  border-color: var(--th-color-primary);
}
.th2-checkout-step.active .th2-checkout-step__circle img { opacity: 1; filter: brightness(10); }
.th2-checkout-step.active { color: var(--th-color-primary); font-weight: 600; }
.th2-checkout-step.completed .th2-checkout-step__circle {
  background: var(--th-color-success);
  border-color: var(--th-color-success);
}
.th2-checkout-step.completed .th2-checkout-step__circle img { opacity: 1; filter: brightness(10); }
.th2-checkout-step.completed { color: var(--th-color-success); }

/* Step connector line */
.th2-checkout-step:not(:last-child)::after {
  content: '';
  position: absolute;
  top: 20px;
  left: calc(50% + 24px);
  right: calc(-50% + 24px);
  height: 2px;
  background: var(--th-neutral-300);
  z-index: 0;
}
.th2-checkout-step.completed:not(:last-child)::after {
  background: var(--th-color-success);
}
@media (max-width: 576px) {
  .th2-checkout-step { font-size: 10px; }
  .th2-checkout-step__circle { width: 34px; height: 34px; }
  .th2-checkout-step__circle img { width: 16px; height: 16px; }
}