:root{--primary-button-color: #15284b; --main-third-color: #8b5cf6; --main-fourth-color: #00c753; --main-second-color: #eff8ff; --border-radius: 12px; --product-card-bg: #FFFFFF; --product-card-border: #d2e4f6; --product-card-color: #15284b;} /* =========================================================
   BOŞ SEPET EKRANI (ŞİFRELİ VUE.JS KİLİDİNİ KIRAN KOD)
   ========================================================= */

/* 1. SEPET İKONU (Doğrudan kilitli etikete saldırır) */
div[data-v-4502f25e].empty-cart--image-wrapper svg path,
div[data-v-4502f25e] .empty-cart--image-wrapper svg path {
    fill: #C8A951 !important;
    color: #C8A951 !important;
}

div[data-v-4502f25e].empty-cart--image-wrapper svg,
div[data-v-4502f25e] .empty-cart--image-wrapper svg {
    filter: drop-shadow(0 15px 25px rgba(200, 169, 81, 0.4)) !important;
    width: 45px !important;
    height: 45px !important;
}

/* 2. BAŞLIK */
div[data-v-4502f25e].empty-cart--title,
div[data-v-4502f25e] .empty-cart--title {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 14px !important;
    font-weight: 300 !important;
    letter-spacing: 12px !important;
    text-transform: uppercase !important;
    margin-bottom: 40px !important;
}

/* 3. BUTONUN KENDİSİ (Mavi rengi ve satır içi CSS'i yok et) */
button[data-v-4502f25e].v-btn {
    background-color: transparent !important;
    background: transparent !important;
    border: 1px solid #C8A951 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    height: 60px !important;
    max-width: 320px !important;
    margin: 0 auto !important;
    display: flex !important;
    transition: all 0.5s ease !important;
}

/* Vuetify'ın görünmez katmanlarını kapat */
button[data-v-4502f25e].v-btn .v-btn__overlay,
button[data-v-4502f25e].v-btn .v-btn__underlay {
    display: none !important;
}

/* 4. BUTON YAZISI (Satır içi font sınıfını ez) */
span[data-v-4502f25e].text-white {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    letter-spacing: 5px !important;
    text-transform: uppercase !important;
    transition: color 0.4s ease !important;
}

/* 5. HOVER (Üzerine Gelince) Canlanması */
button[data-v-4502f25e].v-btn:hover {
    background-color: #C8A951 !important;
    background: #C8A951 !important;
    box-shadow: 0 15px 30px rgba(200, 169, 81, 0.2) !important;
    transform: translateY(-3px) !important;
}

button[data-v-4502f25e].v-btn:hover span[data-v-4502f25e].text-white {
    color: #000 !important;
    letter-spacing: 7px !important;
}





/* =========================================================
   THE TUVA VIP KULLANICI MENÜSÜ (MASAÜSTÜ + MOBİL KESİN ÇÖZÜM)
   ========================================================= */

/* 1. ANA KASA (Masaüstü açılır menüyü ve Mobil Modalı zifiri siyah yapar) */
html body div.modal-container[style],
html body div.modal-container,
html body div.usermenu-wrapper {
    background-color: #050505 !important;
    background: #050505 !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 0 !important; /* Lüks markaların keskin hatları */
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.9) !important;
    z-index: 9999 !important; /* Masaüstünde yazıların üstte kalmasını garantiye alır */
}

/* Kapatma X işaretini Altın Yap (Mobil Modal için) */
html body div.modal-header button svg {
    color: #C8A951 !important;
}

/* 2. KULLANICI ADI (Admin vb. Özel VIP Karşılama Hattı) */
html body div.usermenu-wrapper .username {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    font-weight: 300 !important;
    letter-spacing: 6px !important;
    text-transform: uppercase !important;
    text-align: center !important;
    border-bottom: 1px solid rgba(200, 169, 81, 0.2) !important;
    padding-bottom: 15px !important;
    margin-bottom: 10px !important;
}

/* 3. MENÜ LİSTESİ VE ÇİZGİLER (Standart boşlukları sıfırla) */
html body div.usermenu-wrapper ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}
html body div.usermenu-wrapper ul li {
    border-bottom: 1px solid rgba(200, 169, 81, 0.1) !important;
}
html body div.usermenu-wrapper ul li:last-child {
    border-bottom: none !important;
}

/* 4. MENÜ LİNKLERİ VE BUTONLARI (Asil Gümüş/Krem Tonu) */
html body div.usermenu-wrapper ul li a,
html body div.usermenu-wrapper ul li button {
    color: rgba(255, 255, 255, 0.6) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    font-weight: 300 !important;
    letter-spacing: 3px !important;
    text-transform: uppercase !important;
    background: transparent !important;
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    padding: 15px 10px !important;
    transition: all 0.5s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    text-decoration: none !important;
    border: none !important;
}

/* 5. İKONLAR (Sağ Oklar) */
html body div.usermenu-wrapper ul li span.mdi {
    color: rgba(200, 169, 81, 0.5) !important;
    font-size: 16px !important;
    margin-right: 12px !important;
    transition: all 0.5s ease !important;
}

/* 6. HOVER (Üzerine Gelince Canlanma: Elit Animasyon) */
html body div.usermenu-wrapper ul li a:hover,
html body div.usermenu-wrapper ul li button:hover {
    color: #C8A951 !important;
    background: rgba(200, 169, 81, 0.05) !important; /* Çok hafif altın rengi bir parlama */
    transform: translateX(5px) !important; /* Yazı zarifçe sağa kayar */
    letter-spacing: 4px !important;
}
html body div.usermenu-wrapper ul li a:hover span.mdi,
html body div.usermenu-wrapper ul li button:hover span.mdi {
    color: #C8A951 !important;
    transform: translateX(3px) !important; /* Ok işareti de sağa esner */
}

/* 7. ÇIKIŞ YAP (Log out) BUTONU (Özel zarif vurgu) */
html body div.usermenu-wrapper ul li button.logout {
    color: rgba(200, 100, 100, 0.6) !important; /* Mat, bağırmayan bir bordo */
}
html body div.usermenu-wrapper ul li button.logout:hover {
    color: rgba(255, 100, 100, 1) !important;
    background: rgba(200, 100, 100, 0.05) !important;
}


@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@200;300;400;500;600&display=swap');



/* =========================================================

   THE TUVA: HIGH-END LUXURY VUE.JS SEPET (EDİTÖRYAL SÜRÜM)

   ========================================================= */



/* 1. KUSURSUZ KARANLIK TEMA */

.v-application, .v-application__wrap, .basket-container-wrapper, .v-main { 

    background-color: #030303 !important; 

    color: #fff !important; 

    font-family: 'Montserrat', sans-serif !important; 

}



/* 2. BAŞLIKLAR VE TEMİZLE BUTONU */

.content-header--inner { 

    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important; 

    padding-bottom: 20px !important; 

    margin-bottom: 30px !important; 

}

.title-properties { 

    color: #fff !important; 

    font-weight: 400 !important; 

    letter-spacing: 5px !important; 

    text-transform: uppercase !important; 

    font-size: 18px !important; 

    border-bottom: 2px solid #C8A951 !important; 

    display: inline-block !important;

    padding-bottom: 5px !important;

}



button[data-cy="delete-basket-trigger"] { 

    color: #888 !important; 

    text-transform: uppercase !important; 

    letter-spacing: 3px !important; 

    font-size: 10px !important; 

    background: transparent !important; 

}

button[data-cy="delete-basket-trigger"] i { display: none !important; }

button[data-cy="delete-basket-trigger"]::after { content: '✕'; margin-left: 8px; font-size: 14px; }

button[data-cy="delete-basket-trigger"]:hover { color: #fff !important; }



/* 3. ÜCRETSİZ KARGO BİLGİSİ (Mobilde Kilitli ve Lüks) */

.free-cargo, .cargo-information { 

    background: rgba(200, 169, 81, 0.05) !important; 

    border: 1px solid #C8A951 !important; 

    color: #fff !important; 

    font-size: 11px !important; 

    letter-spacing: 2px !important; 

    text-transform: uppercase !important; 

    padding: 15px 20px !important; 

    justify-content: flex-start !important; 

    font-weight: 400 !important;

    border-radius: 2px !important;

    /* Mobilde Kayan Kutu Düzeltmesi (Sabitleyici Zırh) */

    position: relative !important;

    top: auto !important;

    bottom: auto !important;

    left: auto !important;

    right: auto !important;

    transform: none !important;

    margin-bottom: 30px !important;

    z-index: 10 !important;

    display: flex !important;

    width: 100% !important;

}

.free-cargo svg { width: 20px !important; height: 20px !important; margin-right: 15px !important; color: #C8A951 !important; }



/* 4. ÜRÜN LİSTESİ */

.basket-item { 

    background: transparent !important; 

    border: none !important; 

    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important; 

    padding: 40px 0 !important; 

    border-radius: 0 !important; 

    box-shadow: none !important; 

}

.basket-item-image img { border-radius: 2px !important; border: 1px solid rgba(255,255,255,0.05) !important;}





/* 5. MÜKEMMEL ADET SEÇİCİ (- 1 +) */

.counter { 

    background: transparent !important; 

    border: 1px solid rgba(255, 255, 255, 0.2) !important; 

    border-radius: 2px !important; 

    height: 40px !important; 

    padding: 0 !important; 

}

.counter-button { color: #aaa !important; width: 35px !important; background: transparent !important; }

.counter-button i { font-size: 16px !important; }

.counter-button:hover { color: #fff !important; background: rgba(255,255,255,0.05) !important; }

.counter-text { 

    color: #C8A951 !important; 

    font-weight: 600 !important; 

    font-family: 'Montserrat' !important; 

    font-size: 15px !important; 

    background: transparent !important; 

    border: none !important;

}

.counter-unit { display: none !important; }



.customize-basket-price span, .price-text { 

    color: #C8A951 !important; 

    font-size: 20px !important; 

    font-weight: 500 !important; 

    letter-spacing: 1px !important; 

}



/* =========================================================

   6. SİPARİŞ ÖZETİ (ORDER SUMMARY) - BEYAZ KUTU İPTALİ

   ========================================================= */

.order-summary { padding-left: 40px !important; }

@media (max-width: 960px) { .order-summary { padding: 30px 0 0 0 !important; } }



/* Beyaz olan tüm kartları karanlık temaya çekiyoruz */

.order-summary-card, .order-summary-list, .total-price-card {

    background-color: #080808 !important;

    border: 1px solid rgba(200, 169, 81, 0.15) !important;

    border-radius: 2px !important;

    box-shadow: none !important;

    margin-bottom: 20px !important;

    padding: 25px !important;

}



.order-summary-card-title {

    color: #C8A951 !important;

    font-size: 14px !important;

    letter-spacing: 4px !important;

    text-transform: uppercase !important;

    font-weight: 500 !important;

    border-bottom: none !important;

}



/* Toplam Tutar Kutusu Ekstra Vurgu */

.total-price-card { background-color: #050505 !important; border-color: #C8A951 !important; align-items: center !important;}

.total-price-card .order-summary-card-title { font-size: 12px !important; color: #fff !important; }

.total-price-card .basket-total-price { font-size: 24px !important; color: #C8A951 !important; font-weight: 400 !important; }



/* Satır Kalemleri (Ara Toplam, Kargo vb.) */

.order-summary-list-item { padding: 15px 0 !important; }

.list-item-key { color: #888 !important; font-size: 11px !important; letter-spacing: 2px !important; text-transform: uppercase !important; }

.list-item-value { color: #fff !important; font-size: 14px !important; font-weight: 400 !important; letter-spacing: 1px !important;}

.order-summary-divider { border-color: rgba(255,255,255,0.05) !important; margin: 0 !important;}

.free-text { color: #C8A951 !important; font-weight: 600 !important; letter-spacing: 3px !important; text-transform: uppercase !important;}



/* =========================================================

   7. HEDİYE ÇEKİ / KUPON ALANI ZIRHI

   ========================================================= */

.feature-button { 

    background: #080808 !important;

    border: 1px solid rgba(200, 169, 81, 0.15) !important;

    border-radius: 2px !important;

    padding: 25px 20px !important;

    margin-bottom: 15px !important;

    transition: all 0.4s ease !important;

}

.feature-button:hover { border-color: #C8A951 !important; background: #050505 !important;}

.feature-button-label { color: #aaa !important; font-size: 11px !important; letter-spacing: 2px !important; text-transform: uppercase !important; }

.feature-button-label span { color: #C8A951 !important; font-weight: 600 !important; letter-spacing: 3px !important; }

.feature-button .icon svg { color: #C8A951 !important; fill: #C8A951 !important; }

.feature-button-operation-wrapper i { color: #C8A951 !important; }



/* Kupon Girdi (Input) Kutuları Vuetify Override */

.v-input__control, .v-field { background: transparent !important; box-shadow: none !important; border-radius: 0 !important;}

.v-field__outline { display: none !important; } /* Çirkin kutuyu gizle */

.v-field__field input { 

    border-bottom: 1px solid #C8A951 !important; 

    color: #C8A951 !important; 

    font-family: 'Montserrat' !important; 

    font-size: 14px !important; 

    letter-spacing: 2px !important; 

    text-align: center !important; 

    padding: 10px !important;

}



/* =========================================================

   8. ANA SİPARİŞ BUTONU (Solid Gold)

   ========================================================= */

.mobile-order-summary { background: #080808 !important; border-top: 1px solid rgba(200, 169, 81, 0.3) !important; }

.total-text { color: #aaa !important; font-size: 11px !important; letter-spacing: 3px !important; text-transform: uppercase !important; }



.btn-success, .btn-primary {

    background: #C8A951 !important; 

    color: #000 !important; 

    font-family: 'Montserrat', sans-serif !important; 

    font-size: 13px !important; 

    font-weight: 600 !important; 

    letter-spacing: 4px !important; 

    text-transform: uppercase !important; 

    border-radius: 2px !important; 

    border: none !important; 

    box-shadow: 0 5px 15px rgba(200, 169, 81, 0.2) !important; 

    padding: 25px 0 !important; 

    width: 100% !important; 

    text-align: center !important; 

    transition: all 0.4s ease !important;

    margin-top: 15px !important;

    height: auto !important;

}

.btn-success:hover, .btn-primary:hover { 

    background: #e0be62 !important; 

    letter-spacing: 6px !important; 

    transform: translateY(-2px) !important;

}



/* Alışverişe Devam Et (Tamamen Gold) */

.cart-list--footer .continue-shopping { 

    color: #C8A951 !important; 

    font-size: 11px !important; 

    letter-spacing: 4px !important; 

    text-transform: uppercase !important; 

    text-decoration: none !important; 

    border-bottom: 1px solid #C8A951 !important; 

    padding-bottom: 5px !important; 

    transition: all 0.3s ease !important;

    font-weight: 500 !important;

}

.cart-list--footer .continue-shopping:hover { color: #fff !important; border-color: #fff !important; }





=========================================================
   THE TUVA: ELITE CONCIERGE CHECKOUT (KUSURSUZ LÜKS & UX)
   ========================================================= */

/* 1. ZEMİN: Derin Karbon Siyahı. Göz yormayan, en pahalı siyah tonu (#0A0A0C) */
:root, html, body, .v-application, .v-theme--light {
    --v-theme-background: 10, 10, 12 !important;
    --v-theme-surface: 15, 15, 18 !important;
}
html body #app .v-application .checkout-page,
html body #app .v-application .checkout-container,
html body #app .v-application .v-main {
    background: #0A0A0C !important;
    color: #E8E8E8 !important;
}

/* 2. YÖNLENDİRMELER VE LİNKLER: Şık ve İnteraktif */
/* Sepete Dön Butonu (Üzerine gelince ok işareti zarifçe sola kayar) */
html body #app .checkout-page .checkout-header .back-btn {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    display: flex !important;
    align-items: center !important;
    transition: color 0.3s ease !important;
}
html body #app .checkout-page .checkout-header .back-btn i {
    color: #C8A951 !important;
    margin-right: 6px !important;
    font-size: 16px !important;
    transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}
html body #app .checkout-page .checkout-header .back-btn:hover i {
    transform: translateX(-5px) !important; /* İkon sola kayarak yolu gösterir */
}

/* Hızlı Giriş Linki */
html body #app .checkout-page .buy-fast--header a {
    color: rgba(255, 255, 255, 0.4) !important;
    font-size: 10px !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    border-bottom: 1px solid transparent !important;
    transition: all 0.3s ease !important;
}
html body #app .checkout-page .buy-fast--header a:hover {
    color: #C8A951 !important;
    border-bottom: 1px solid #C8A951 !important;
}

/* 3. ADIM KUTULARI VE BAŞLIKLAR: Net Hiyerarşi */
html body #app .checkout-page .step-box,
html body #app .checkout-page .buy-fast {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    margin-bottom: 50px !important;
}
html body #app .checkout-page .step-box--header h2,
html body #app .checkout-page h3.info-box-title,
html body #app .checkout-page .buy-fast--header .title,
html body #app .checkout-page .address-inline-form p.title {
    color: rgba(255, 255, 255, 0.9) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    letter-spacing: 4px !important;
    text-transform: uppercase !important;
    padding-bottom: 12px !important;
    margin-bottom: 25px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
}

/* 4. PREMIUM FORM ALANLARI: Kullanışlı, net ve şık */
html body #app .checkout-page .v-field__outline { display: none !important; }
html body #app .checkout-page .v-field--variant-solo,
html body #app .checkout-page .vue-tel-input {
    background: rgba(255, 255, 255, 0.02) !important; /* Çok hafif bir derinlik */
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.15) !important;
    border-radius: 4px 4px 0 0 !important; /* Sadece üst köşeler çok hafif yumuşak */
    box-shadow: none !important;
    transition: all 0.4s ease !important;
}
/* Form Odaklanma (Focus) Efekti */
html body #app .checkout-page .v-field--focused,
html body #app .checkout-page .vue-tel-input:focus-within {
    background: rgba(200, 169, 81, 0.03) !important;
    border-bottom: 2px solid #C8A951 !important; /* Altın çizgi kalınlaşarak güven verir */
}
html body #app .checkout-page .v-field__input,
html body #app .checkout-page .vti__input {
    color: #fff !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    letter-spacing: 1px !important;
}
html body #app .checkout-page .textfield-label,
html body #app .checkout-page .v-label {
    color: rgba(255, 255, 255, 0.4) !important;
    font-size: 11px !important;
    letter-spacing: 1px !important;
}

/* 5. SEÇİM KARTLARI (Adres & Kargo): Premium Etkileşim */
html body #app .checkout-page .address-radio-item,
html body #app .checkout-page .cargo-list--item {
    background: rgba(255, 255, 255, 0.01) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 4px !important;
    padding: 22px 20px !important;
    margin-bottom: 15px !important;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    cursor: pointer !important;
}
html body #app .checkout-page .v-selection-control__wrapper i {
    color: rgba(255, 255, 255, 0.2) !important; /* İkonlar soluk başlar */
    font-size: 20px !important;
    transition: all 0.3s ease !important;
}
/* Aktif Seçim Durumu: Kutular parlar, ikon altına döner */
html body #app .checkout-page .active .address-radio-item,
html body #app .checkout-page .cargo-list--item:has(input:checked) {
    background: rgba(200, 169, 81, 0.04) !important;
    border: 1px solid rgba(200, 169, 81, 0.5) !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5) !important;
    transform: translateY(-2px) !important; /* Tıklanan kutu hafifçe havaya kalkar */
}
html body #app .checkout-page .active .address-radio-item .v-selection-control__wrapper i,
html body #app .checkout-page .cargo-list--item:has(input:checked) .v-selection-control__wrapper i {
    color: #C8A951 !important;
}
html body #app .checkout-page .address-radio-item-text,
html body #app .checkout-page .cargo-list--item_name {
    color: rgba(255, 255, 255, 0.8) !important;
    font-size: 12px !important;
    font-weight: 300 !important;
    line-height: 1.6 !important;
}

/* Sipariş Notu */
html body #app .checkout-page .order-note textarea {
    background: rgba(255, 255, 255, 0.02) !important;
    border: 1px solid rgba(255, 255, 255, 0.08) !important;
    border-radius: 4px !important;
    color: #fff !important;
    font-family: 'Montserrat', sans-serif !important;
    padding: 15px !important;
    font-size: 13px !important;
}
html body #app .checkout-page .order-note textarea:focus {
    border-color: rgba(200, 169, 81, 0.5) !important;
    outline: none !important;
}

/* 6. SİPARİŞ ÖZETİ (VIP Fiş) */
html body #app .checkout-page .order-summary-card {
    background: #0E0E12 !important; /* Sağ sütun bir tık daha aydınlık, kopuk durmasın diye */
    border: 1px solid rgba(255, 255, 255, 0.04) !important;
    border-radius: 6px !important;
    padding: 30px 25px !important;
}
html body #app .checkout-page .order-summary-card-title {
    color: #fff !important;
    font-size: 12px !important;
    letter-spacing: 3px !important;
    margin-bottom: 15px !important;
}
html body #app .checkout-page .list-item-key { color: rgba(255, 255, 255, 0.5) !important; font-size: 11px !important; }
html body #app .checkout-page .list-item-value { color: #fff !important; font-size: 12px !important; }
html body #app .checkout-page .order-summary-divider { border-color: rgba(255, 255, 255, 0.05) !important; margin: 15px 0 !important; }
html body #app .checkout-page .basket-total-price {
    color: #C8A951 !important;
    font-size: 22px !important;
    font-weight: 500 !important;
    letter-spacing: 1px !important;
}

/* 7. BUTONLAR: Mükemmel Oran, Otorite ve Animasyon */
/* Adres Ekle (İkincil) */
html body #app .checkout-page button.add-new-address-button {
    background: rgba(255, 255, 255, 0.03) !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 4px !important;
    height: 50px !important;
    transition: all 0.3s ease !important;
}
html body #app .checkout-page button.add-new-address-button span.v-btn__content {
    color: rgba(255, 255, 255, 0.7) !important;
    font-size: 10px !important;
    letter-spacing: 3px !important;
}
html body #app .checkout-page button.add-new-address-button:hover {
    background: rgba(255, 255, 255, 0.08) !important;
    border-color: rgba(255, 255, 255, 0.3) !important;
}

/* Ana "Ödemeye Geç" Butonu */
html body #app .checkout-page button.btn-success,
html body #app .checkout-page button.address-form-submit {
    background: #C8A951 !important;
    background: linear-gradient(135deg, #B5933C 0%, #D4AF37 100%) !important; /* Çok zarif, tok bir altın gradyanı */
    border: none !important;
    border-radius: 4px !important;
    height: 60px !important;
    box-shadow: 0 10px 25px rgba(200, 169, 81, 0.2) !important;
    margin-top: 20px !important;
    transition: all 0.4s ease !important;
}
html body #app .checkout-page button.btn-success span.v-btn__content,
html body #app .checkout-page button.address-form-submit span.v-btn__content {
    color: #0A0A0C !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: 4px !important;
    text-transform: uppercase !important;
}
html body #app .checkout-page button.btn-success:hover,
html body #app .checkout-page button.address-form-submit:hover {
    transform: translateY(-3px) !important; /* Kendinden emin bir şekilde yükselir */
    box-shadow: 0 15px 35px rgba(200, 169, 81, 0.4) !important; /* Işığı artar */
    filter: brightness(1.1) !important;
}
/* =========================================================
   THE TUVA: VIP SİPARİŞ ÖZETİ VE "GO TO PAYMENT" BUTONU
   ========================================================= */

/* 1. SAĞ PANEL KASASI (Ekrana sığacak ve taşmayacak şekilde sabitlenir) */
html body #app .checkout-page .sidebar-column > div {
    background: #0a0a0c !important; /* Derin antrasit/siyah */
    border: 1px solid rgba(200, 169, 81, 0.15) !important; /* İnce altın çerçeve */
    border-radius: 12px !important;
    padding: 25px !important;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.6) !important;
    max-height: calc(100vh - 40px) !important; /* Ekran boyunu aşmasını engeller */
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
}

/* 2. SEPET ÜRÜNLERİ (Taşmayı önleyen özel kaydırma çubuğu) */
html body #app .checkout-page .accordion-content {
    overflow-y: auto !important;
    flex: 1 !important; /* Kalan boşluğu doldurur */
    max-height: none !important; /* Orijinal kısıtlamayı kaldır */
    padding-right: 10px !important;
    margin-bottom: 15px !important;
}

/* Lüks, ince ve altın rengi özel kaydırma çubuğu (Scrollbar) */
html body #app .checkout-page .accordion-content::-webkit-scrollbar {
    width: 4px !important;
}
html body #app .checkout-page .accordion-content::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.02) !important; 
    border-radius: 4px !important;
}
html body #app .checkout-page .accordion-content::-webkit-scrollbar-thumb {
    background: rgba(200, 169, 81, 0.3) !important; 
    border-radius: 4px !important;
}
html body #app .checkout-page .accordion-content::-webkit-scrollbar-thumb:hover {
    background: rgba(200, 169, 81, 0.6) !important; 
}

/* 3. ÜRÜN KARTLARI (Mat ve Zarif Fiş Görünümü) */
html body #app .checkout-page .product-item.readonly-item {
    background: transparent !important;
    border-bottom: 1px dashed rgba(255, 255, 255, 0.08) !important;
    padding: 15px 0 !important;
    margin: 0 !important;
}
html body #app .checkout-page .basket-item-image img {
    border-radius: 8px !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
    filter: brightness(0.85) contrast(1.1) !important; /* Parlamayı alıp toklaştırır */
}
html body #app .checkout-page .basket-item-product-name span {
    color: rgba(255, 255, 255, 0.8) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    font-weight: 300 !important;
    line-height: 1.5 !important;
}
html body #app .checkout-page .basket-item-cargo-date span,
html body #app .checkout-page .basket-item-quantity {
    color: rgba(255, 255, 255, 0.4) !important;
    font-size: 10px !important;
}
html body #app .checkout-page .basket-item-cargo-date b {
    color: #C8A951 !important;
    font-weight: 400 !important;
}
html body #app .checkout-page .basket-item-variation-chip {
    background: rgba(200, 169, 81, 0.05) !important;
    color: #C8A951 !important;
    border: 1px solid rgba(200, 169, 81, 0.3) !important;
    border-radius: 6px !important;
    font-size: 9px !important;
    letter-spacing: 1px !important;
    padding: 4px 10px !important;
}
html body #app .checkout-page .basket-item-basket-price span {
    color: #C8A951 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    letter-spacing: 1px !important;
}

/* 4. SİPARİŞ ÖZETİ BÖLÜMÜ (Alt kısımdaki ara toplamlar) */
html body #app .checkout-page .order-summary-card {
    background: transparent !important;
    padding: 0 !important;
    margin-top: 10px !important;
}
html body #app .checkout-page .order-summary-card-title {
    color: rgba(255, 255, 255, 0.4) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 10px !important;
    letter-spacing: 4px !important;
    text-transform: uppercase !important;
    margin-bottom: 15px !important;
}
html body #app .checkout-page .list-item-key {
    color: rgba(255, 255, 255, 0.5) !important;
    font-size: 10px !important;
    letter-spacing: 1px !important;
}
html body #app .checkout-page .list-item-value {
    color: #E8E8E8 !important;
    font-size: 11px !important;
}
html body #app .checkout-page .order-summary-divider {
    border-color: rgba(255, 255, 255, 0.05) !important;
    margin: 12px 0 !important;
}

/* En Alt Toplam (Grand Total) */
html body #app .checkout-page .total-price-card {
    border-top: 1px solid rgba(200, 169, 81, 0.3) !important;
    padding-top: 20px !important;
    margin-top: 15px !important;
    align-items: center !important;
}
html body #app .checkout-page .total-price-card .order-summary-card-title {
    color: #C8A951 !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    letter-spacing: 3px !important;
    margin: 0 !important;
}
html body #app .checkout-page .basket-total-price {
    color: #C8A951 !important;
    font-size: 22px !important;
    font-weight: 500 !important;
    letter-spacing: 2px !important;
}

/* 5. GİZLENMEYİ REDDEDEN, ŞAHA KALKAN "GO TO PAYMENT" BUTONU */
html body #app .checkout-page #summary-operation {
    margin-top: 20px !important;
    padding-top: 15px !important;
    position: sticky !important;
    bottom: 0 !important; /* Her zaman en altta durmasını garanti eder */
    background: #0a0a0c !important; /* Üzerine kayan yazıları saklamak için arkaplanı var */
    z-index: 10 !important;
}
html body #app .checkout-page #summary-operation button.btn-success {
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.1) 0%, rgba(200, 169, 81, 0.25) 100%) !important;
    border: 1px solid #C8A951 !important;
    border-radius: 10px !important; /* Şık kavis */
    height: 65px !important;
    width: 100% !important;
    box-shadow: 0 4px 15px rgba(200, 169, 81, 0.1) !important;
    transition: all 0.5s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    position: relative !important;
    overflow: hidden !important;
}

/* Butonun üzerinden geçen bitmeyen altın ışık hüzmesi (Sonsuz Şıklık) */
html body #app .checkout-page #summary-operation button.btn-success::before {
    content: '';
    position: absolute;
    top: 0; left: -100%;
    width: 50%; height: 100%;
    background: linear-gradient(to right, transparent, rgba(255, 255, 255, 0.15), transparent);
    transform: skewX(-25deg);
    animation: premiumShine 4s infinite;
}
@keyframes premiumShine {
    0% { left: -100%; }
    20% { left: 200%; }
    100% { left: 200%; }
}

html body #app .checkout-page #summary-operation button.btn-success span {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    letter-spacing: 4px !important;
    text-transform: uppercase !important;
    transition: all 0.5s ease !important;
    position: relative;
    z-index: 2;
}

/* Hover (Fareyle Üzerine Gelme) Durumu: İçi altınla dolar */
html body #app .checkout-page #summary-operation button.btn-success:hover {
    background: #C8A951 !important;
    box-shadow: 0 10px 30px rgba(200, 169, 81, 0.4) !important;
    transform: translateY(-2px) !important;
}
html body #app .checkout-page #summary-operation button.btn-success:hover span {
    color: #0a0a0c !important;
    letter-spacing: 7px !important;
    font-weight: 600 !important;
}
/* =========================================================
   THE TUVA: AKIŞKAN VE İNTERAKTİF LÜKS DETAYLAR
   ========================================================= */

/* 1. SEÇİM KUTULARI (Kredi Kartı Yumuşaklığı ve Akışkan Hover) */
html body #app .checkout-page .address-radio-item,
html body #app .checkout-page .cargo-list--item,
html body #app .checkout-page .order-note textarea {
    border-radius: 12px !important; /* Jilet keskinliği yerine akışkan ve pahalı kavisler */
    transition: all 0.5s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

html body #app .checkout-page .address-radio-item:hover,
html body #app .checkout-page .cargo-list--item:hover {
    border-color: rgba(200, 169, 81, 0.4) !important;
    background: rgba(200, 169, 81, 0.02) !important;
    transform: translateY(-3px) !important; /* Üzerine gelince zarifçe yükselir */
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5) !important;
}

/* 2. SİSTEMİN MAVİ RADYO VE CHECKBOX İKONLARINI ALTINA ÇEVİRME */
html body #app .checkout-page .v-selection-control__wrapper,
html body #app .checkout-page .v-selection-control__input i,
html body #app .checkout-page .text-blue {
    color: rgba(200, 169, 81, 0.5) !important; /* Varsayılan maviyi ezer */
    transition: all 0.4s ease !important;
}

html body #app .checkout-page .active .v-selection-control__wrapper,
html body #app .checkout-page .active .v-selection-control__input i,
html body #app .checkout-page .cargo-list--item:has(input:checked) .v-selection-control__input i {
    color: #C8A951 !important; /* Seçildiğinde saf altına döner ve parlar */
    filter: drop-shadow(0 0 6px rgba(200, 169, 81, 0.5)) !important;
    transform: scale(1.1) !important;
}

/* "My billing address should be different" Yazısı ve Yuvarlağı */
html body #app .checkout-page .chekbox-mod .checkmark {
    border-color: rgba(200, 169, 81, 0.5) !important;
    border-radius: 50% !important;
    transition: all 0.4s ease !important;
}
html body #app .checkout-page .chekbox-mod input:checked ~ .checkmark {
    background-color: #C8A951 !important;
    border-color: #C8A951 !important;
    box-shadow: 0 0 10px rgba(200, 169, 81, 0.4) !important;
}
html body #app .checkout-page label.chekbox-mod {
    color: rgba(255, 255, 255, 0.4) !important;
    font-family: 'Montserrat', sans-serif !important;
    letter-spacing: 1px !important;
    transition: color 0.4s ease !important;
}
html body #app .checkout-page label.chekbox-mod:hover {
    color: #C8A951 !important;
}

/* 3. AÇIK MOR "EDIT" BUTONUNU ELİT BİR HAP (PILL) BUTONA ÇEVİRME */
html body #app .checkout-page .address-item-action button.address-radio-item-edit {
    background: rgba(200, 169, 81, 0.05) !important;
    border: 1px solid rgba(200, 169, 81, 0.3) !important;
    border-radius: 20px !important; /* Tam bir hap formu */
    padding: 0 16px !important;
    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}
html body #app .checkout-page .address-item-action button.address-radio-item-edit span,
html body #app .checkout-page .address-item-action button.address-radio-item-edit i {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 400 !important;
    letter-spacing: 1px !important;
    transition: all 0.4s ease !important;
}

/* Edit Butonu Hover: İçi altınla dolar */
html body #app .checkout-page .address-item-action button.address-radio-item-edit:hover {
    background: #C8A951 !important;
    border-color: #C8A951 !important;
    box-shadow: 0 5px 15px rgba(200, 169, 81, 0.3) !important;
    transform: translateY(-2px) !important;
}
html body #app .checkout-page .address-item-action button.address-radio-item-edit:hover span,
html body #app .checkout-page .address-item-action button.address-radio-item-edit:hover i {
    color: #000 !important;
}

/* 4. ÇÖP KUTUSU (DELETE) İKONU: Sessiz ve Derinden */
html body #app .checkout-page .address-item-action button.address-radio-delete-item {
    color: rgba(255, 255, 255, 0.3) !important;
    transition: all 0.4s ease !important;
}
html body #app .checkout-page .address-item-action button.address-radio-delete-item:hover {
    color: #e57373 !important; /* Tok bir bordo/kırmızı */
    transform: scale(1.15) rotate(5deg) !important; /* Hafifçe büyür ve eğilir */
    filter: drop-shadow(0 0 5px rgba(229, 115, 115, 0.4)) !important;
}

/* 5. FİYAT ETİKETİ (₺0,00 PİLL): Mavi silinip Altın Çerçeveye Döner */
html body #app .checkout-page .cargo-list--item_chip {
    background: transparent !important;
    color: #C8A951 !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 12px !important;
    padding: 4px 14px !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    letter-spacing: 1px !important;
    transition: all 0.4s ease !important;
}
html body #app .checkout-page .cargo-list--item:hover .cargo-list--item_chip {
    background: rgba(200, 169, 81, 0.1) !important;
    border-color: #C8A951 !important;
    box-shadow: 0 0 10px rgba(200, 169, 81, 0.2) !important;
}
/* =========================================================
   THE TUVA: CHECKOUT KUSURSUZLAŞTIRMA (BEYAZ ÇİZGİ & SEPET DÜZELTMESİ)
   ========================================================= */

/* 1. SAĞ PANEL - SEPET (MY BASKET) AKORDİYON DÜZELTMESİ */
/* Bembeyaz olan sepet arka planını zifiri siyaha çeviriyoruz */
html body #app .checkout-page .accordion,
html body #app .checkout-page .accordion-title-wrapper,
html body #app .checkout-page .accordion-content {
    background-color: #0A0A0C !important;
    background: #0A0A0C !important;
    border: none !important;
}

/* My Basket Başlığı ve İkonu */
html body #app .checkout-page .accordion-title {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 13px !important;
    letter-spacing: 4px !important;
    text-transform: uppercase !important;
}
html body #app .checkout-page .accordion-trigger-btn i {
    color: #C8A951 !important;
}

/* Sepet İçindeki Ürün İsimleri ve Detayları */
html body #app .checkout-page .basket-item {
    background: transparent !important;
}
html body #app .checkout-page .basket-item-product-name span {
    color: #E8E8E8 !important; /* Ürün isimleri artık net okunur */
    font-weight: 300 !important;
}
html body #app .checkout-page .basket-item-cargo-date span,
html body #app .checkout-page .basket-item-quantity {
    color: rgba(255, 255, 255, 0.4) !important;
}

/* 2. ADRES VE KARGO KUTULARI (Çift Çizgi ve Beyaz Çerçeve Hatasını Giderme) */
/* Vuetify'ın dışarıdan sarmaladığı o kaba beyaz çerçeveleri tamamen siliyoruz */
html body #app .checkout-page .v-input--radio-group .v-input__control,
html body #app .checkout-page .v-selection-control-group,
html body #app .checkout-page .address-wrapper,
html body #app .checkout-page .cargo-list {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
}
html body #app .checkout-page .v-field__outline {
    display: none !important;
}

/* Kutuların kendi tasarımı: Sadece altın ve siyah */
html body #app .checkout-page .address-radio-item,
html body #app .checkout-page .cargo-list--item {
    background: #0A0A0C !important;
    border: 1px solid rgba(200, 169, 81, 0.25) !important; /* Sönük Altın Çerçeve */
    border-radius: 12px !important;
    margin-bottom: 15px !important;
    transition: all 0.4s ease !important;
}

/* Seçili Kutu: Çerçeve saf altına döner ve parlar */
html body #app .checkout-page .active .address-radio-item,
html body #app .checkout-page .cargo-list--item:has(input:checked) {
    border: 1px solid #C8A951 !important;
    background: rgba(200, 169, 81, 0.03) !important;
    box-shadow: 0 0 20px rgba(200, 169, 81, 0.1) !important;
}

/* 3. YAZI RENKLERİ (Mor/Mavi tonları ezme) */
/* "Ev" ve "Yurtiçi Kargo" Başlıkları */
html body #app .checkout-page .address-radio-item-title,
html body #app .checkout-page .cargo-list--item_name {
    color: #C8A951 !important; 
    font-family: 'Montserrat', sans-serif !important;
    font-size: 14px !important;
    font-weight: 500 !important;
    letter-spacing: 2px !important;
    margin-bottom: 8px !important;
    text-transform: uppercase !important;
}
/* Adres detayı ve Kargo detayı */
html body #app .checkout-page .address-radio-item-text,
html body #app .checkout-page .cargo-list--item_description {
    color: rgba(255, 255, 255, 0.6) !important; /* Göz yormayan gümüş gri */
    line-height: 1.6 !important;
    font-weight: 300 !important;
}

/* Fiyat Çipi (₺0,00) */
html body #app .checkout-page .cargo-list--item_chip {
    background: transparent !important;
    color: #C8A951 !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 12px !important;
}

/* 4. SİPARİŞ NOTU (ORDER NOTE) DÜZELTMESİ */
/* Kaybolan başlığı aydınlatıyoruz */
html body #app .checkout-page .order-note-title {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    letter-spacing: 4px !important;
    text-transform: uppercase !important;
    margin-bottom: 15px !important;
}
/* Textarea (Metin Kutusu) beyaz çerçevesini altınla değiştiriyoruz */
html body #app .checkout-page .order-note textarea {
    background: #0A0A0C !important;
    border: 1px solid rgba(200, 169, 81, 0.3) !important;
    color: #E8E8E8 !important;
    border-radius: 12px !important;
    padding: 20px !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12px !important;
    font-weight: 300 !important;
    transition: all 0.4s ease !important;
}
html body #app .checkout-page .order-note textarea:focus {
    border-color: #C8A951 !important;
    box-shadow: 0 0 15px rgba(200, 169, 81, 0.15) !important;
    outline: none !important;
}

/* 5. DİĞER FATURA ADRESİ CHECKBOX'I */
html body #app .checkout-page label.chekbox-mod {
    color: rgba(255, 255, 255, 0.5) !important;
}
/* =========================================================
   THE TUVA: EDİT BUTONU KESİLME HATASI VE SİPARİŞ NOTU DÜZELTMESİ
   ========================================================= */

/* 1. EDİT BUTONU KESİLME HATASINI ÇÖZME */
/* Butonun üstten ezilmesini önlemek için Vuetify'ın kendi çerçeve hilelerini siliyoruz ve butona nefes aldırıyoruz */
html body #app .checkout-page .address-item-action button.address-radio-item-edit {
    border: 1px solid rgba(200, 169, 81, 0.4) !important; /* Gerçek, dört tarafı tam çerçeve */
    border-radius: 20px !important;
    background: transparent !important;
    height: auto !important;
    min-height: 34px !important;
    padding: 6px 18px !important;
    margin-top: 4px !important; /* Üst tavanla çarpışmasını engeller */
    overflow: visible !important;
    box-sizing: border-box !important;
    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

/* Vuetify'ın butonu bozan gizli katmanlarını yok et */
html body #app .checkout-page .address-item-action button.address-radio-item-edit::before,
html body #app .checkout-page .address-item-action button.address-radio-item-edit::after,
html body #app .checkout-page .address-item-action button.address-radio-item-edit .v-btn__overlay {
    display: none !important;
}

/* Edit Hover Akışkan Animasyon */
html body #app .checkout-page .address-item-action button.address-radio-item-edit:hover {
    background: #C8A951 !important;
    border-color: #C8A951 !important;
    box-shadow: 0 5px 15px rgba(200, 169, 81, 0.3) !important;
    transform: translateY(-2px) !important;
}
html body #app .checkout-page .address-item-action button.address-radio-item-edit:hover span,
html body #app .checkout-page .address-item-action button.address-radio-item-edit:hover i {
    color: #0A0A0C !important;
}

/* 2. ORDER NOTE (SİPARİŞ NOTU) BEYAZ ÇERÇEVE İPTALİ VE AKIŞKANLIK */
/* İnatçı beyazı eziyor ve yerine altın bir aura ekliyoruz */
html body #app .checkout-page .order-note textarea {
    background: #0A0A0C !important;
    border: 1px solid rgba(200, 169, 81, 0.3) !important; /* Beyazı altına çevirir */
    color: #C8A951 !important;
    border-radius: 12px !important;
    padding: 20px !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12px !important;
    font-weight: 300 !important;
    box-shadow: none !important;
    outline: none !important;
    transition: all 0.5s cubic-bezier(0.25, 0.8, 0.25, 1) !important; /* Akışkanlık efekti */
}

/* Fare ile üzerine gelince (Hover) kutu hafifçe yükselir */
html body #app .checkout-page .order-note textarea:hover {
    border-color: rgba(200, 169, 81, 0.6) !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.6) !important;
}

/* Kutuya tıklayıp yazmaya başlayınca (Focus) derin bir altın ışıltı yayar */
html body #app .checkout-page .order-note textarea:focus {
    border-color: #C8A951 !important;
    background: rgba(200, 169, 81, 0.03) !important;
    box-shadow: 0 0 20px rgba(200, 169, 81, 0.15) !important;
    transform: translateY(-3px) !important;
}

/* Yazı (Placeholder) rengini elit bir tona ayarlama */
html body #app .checkout-page .order-note textarea::placeholder {
    color: rgba(255, 255, 255, 0.3) !important;
    letter-spacing: 1px !important;
}
/* =========================================================
   THE TUVA: KESİK BUTON VE BEYAZ ÇERÇEVE KESİN ÇÖZÜM
   ========================================================= */

/* 1. EDİT BUTONU KESİLME HATASI (Gizli Katmanları Yok Et) */
html body #app .checkout-page .address-radio-item,
html body #app .checkout-page .inner,
html body #app .checkout-page .address-item-action {
    overflow: visible !important; /* Butonun kafasının kesilmesini engeller */
}

/* Vuetify'ın kendi hatalı çerçeve çizgisini tamamen siliyoruz */
html body #app .checkout-page .address-item-action button.address-radio-item-edit .v-btn__underlay,
html body #app .checkout-page .address-item-action button.address-radio-item-edit .v-btn__overlay,
html body #app .checkout-page .address-item-action button.address-radio-item-edit::before,
html body #app .checkout-page .address-item-action button.address-radio-item-edit::after {
    display: none !important;
    border: none !important;
}

/* Butonun kendisine saf altın çerçeve ve boşluk veriyoruz */
html body #app .checkout-page .address-item-action button.address-radio-item-edit {
    border: 1px solid rgba(200, 169, 81, 0.5) !important;
    border-radius: 20px !important;
    margin-top: 5px !important; /* Üste çarpmasını önlemek için */
    margin-bottom: 5px !important;
    padding: 5px 16px !important;
    height: auto !important;
    min-height: 32px !important;
    display: inline-flex !important;
    align-items: center !important;
    background: transparent !important;
}


/* 2. SİPARİŞ NOTU (ORDER NOTE) İNATÇI BEYAZ ÇİZGİ İPTALİ */
/* Tarayıcının kendi eklediği (outline/appearance) beyaz çizgiyi zorla kapatıyoruz */
html body #app .checkout-page .order-note textarea,
html body #app .checkout-page .order-note textarea:focus,
html body #app .checkout-page .order-note textarea:active,
html body #app .checkout-page .order-note textarea:focus-visible {
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    outline: none !important; /* İnatçı beyaz/mavi parlamayı yok eder */
    box-shadow: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    background: #0A0A0C !important;
    color: #C8A951 !important;
}

/* Hover (Üzerine gelince) ve Focus (Tıklayınca) Altın Parlaması */
html body #app .checkout-page .order-note textarea:hover,
html body #app .checkout-page .order-note textarea:focus {
    border: 1px solid #C8A951 !important;
    box-shadow: 0 5px 15px rgba(200, 169, 81, 0.15) !important;
    transform: translateY(-2px) !important;
}
/* =========================================================
   THE TUVA: İLK BUTON KESİĞİ VE BEYAZ ÇİZGİ KESİN ÇÖZÜM
   ========================================================= */

/* 1. "ADD NEW ADDRESS" İLK BUTONUN KESİLME HATASI */
/* Vuetify'ın butonu bozan gizli sahte katmanlarını acımasızca siliyoruz */
html body #app .checkout-page button.add-new-address-button .v-btn__underlay,
html body #app .checkout-page button.add-new-address-button .v-btn__overlay {
    display: none !important;
}

/* Butonun kendisine gerçek, kesilmeyen bir çerçeve ve alan veriyoruz */
html body #app .checkout-page button.add-new-address-button {
    overflow: visible !important; /* Kesilmeyi engeller */
    border: 1px solid rgba(200, 169, 81, 0.4) !important; /* Net altın çerçeve */
    background: transparent !important;
    border-radius: 12px !important; /* Lüks oval kavis */
    transition: all 0.4s ease !important;
}

/* Hover (Üzerine gelince parlaması) */
html body #app .checkout-page button.add-new-address-button:hover {
    background: rgba(200, 169, 81, 0.05) !important;
    border-color: #C8A951 !important;
    box-shadow: 0 5px 15px rgba(200, 169, 81, 0.15) !important;
    transform: translateY(-2px) !important;
}


/* 2. ORDER NOTE (SİPARİŞ NOTU) BEYAZ ÇİZGİ İPTALİ */
/* Dış kasadaki olası beyazlıkları sıfırla */
html body #app .checkout-page .order-note {
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* Tarayıcının kendi eklediği inatçı beyaz çizgiyi zorla kapatıyoruz */
html body #app .checkout-page .order-note textarea,
html body #app .checkout-page .order-note textarea:focus,
html body #app .checkout-page .order-note textarea:active {
    border: 1px solid rgba(200, 169, 81, 0.3) !important; /* Sadece altın çerçeve */
    outline: none !important; /* İnatçı beyaz parlamayı yok eder */
    box-shadow: none !important;
    -webkit-appearance: none !important; /* Chrome/Safari çizgilerini ezer */
    background: #0A0A0C !important;
    color: #C8A951 !important;
    border-radius: 12px !important;
    padding: 20px !important;
    transition: all 0.4s ease !important;
}

/* Kutuya tıklayıp yazmaya başlayınca Altın Aura yayar */
html body #app .checkout-page .order-note textarea:focus {
    border-color: #C8A951 !important;
    background: rgba(200, 169, 81, 0.03) !important;
    box-shadow: 0 0 15px rgba(200, 169, 81, 0.2) !important;
}
/* =========================================================
   THE TUVA: EDİT BUTONU KESİLME HATASI (KESİN ÇÖZÜM)
   ========================================================= */

/* 1. Kapsayıcıların (Container) Butonu Kesmesini Tamamen Engelle */
html body #app .checkout-page .address-radio-item,
html body #app .checkout-page .address-radio-item .inner,
html body #app .checkout-page .address-item-action {
    overflow: visible !important; 
    contain: none !important; /* Vuetify'ın kutuyu sıkıştıran kuralını iptal eder */
    align-items: center !important;
}

/* 2. Vuetify'ın Hatalı Sahte Çerçevelerini Yok Et */
html body #app .checkout-page .address-item-action button.address-radio-item-edit .v-btn__underlay,
html body #app .checkout-page .address-item-action button.address-radio-item-edit .v-btn__overlay,
html body #app .checkout-page .address-item-action button.address-radio-item-edit::before,
html body #app .checkout-page .address-item-action button.address-radio-item-edit::after {
    display: none !important;
    border: none !important;
}

/* 3. Edit Butonuna Gerçek Çerçeve ve Nefes Alma Boşluğu Ver */
html body #app .checkout-page .address-item-action button.address-radio-item-edit {
    border: 1px solid rgba(200, 169, 81, 0.5) !important;
    border-radius: 20px !important;
    background: transparent !important;
    height: 32px !important;
    box-sizing: border-box !important;
    margin-top: 4px !important; /* Üst tavanla çarpışmasını engeller */
    margin-bottom: 4px !important;
    overflow: visible !important;
}
/* =========================================================
   THE TUVA: VIP PAYMENT TYPES (ÖDEME SEÇENEKLERİ EKRANI)
   ========================================================= */

/* 1. ÖDEME SEÇENEKLERİ KARTLARI (Kaba Kutuları Siliyoruz) */
html body #app .checkout-page .payment-options-content .payment-option-card {
    background: transparent !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important; /* Hayalet Gümüş Çerçeve */
    border-radius: 8px !important; /* Hafif oval, tok hissiyat */
    padding: 20px !important;
    margin-bottom: 15px !important;
    transition: all 0.5s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    cursor: pointer !important;
}

/* 2. AKTİF (SEÇİLİ) ÖDEME KARTI (Şaha Kalkan Altın Aura) */
html body #app .checkout-page .payment-option-card.active,
html body #app .checkout-page .payment-option-card:hover {
    background: rgba(200, 169, 81, 0.02) !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.8) !important;
    transform: translateY(-2px) !important;
}

/* Sağ üste "SELECTED" yazısı ekliyoruz (Radyo butonları silindiği için) */
html body #app .checkout-page .payment-option-card.active::before {
    content: "SELECTED" !important;
    position: absolute !important;
    top: 15px !important;
    right: 20px !important;
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 8px !important;
    letter-spacing: 4px !important;
    text-transform: uppercase !important;
}

/* 3. RADYO BUTONLARI VE İKONLAR (Çirkin yuvarlakları yok ediyoruz) */
/* Yuvarlakları gizle */
html body #app .checkout-page .payment-options .v-selection-control__wrapper i {
    display: none !important;
}
/* Seçenek İsimleri (Transfer, Mobile Wallet vb.) */
html body #app .checkout-page .payment-options .v-label {
    color: rgba(255, 255, 255, 0.7) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 13px !important;
    font-weight: 300 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    opacity: 1 !important;
}
html body #app .checkout-page .payment-option-card.active .v-label {
    color: #C8A951 !important; /* Seçilince altına döner */
}

/* İkonları (Bank/Kart çizimleri) lüks altın/gümüş filtresi ile yıkama */
/* SVG'lerin içindeki lacivert dolguyu (fill=#15284B) CSS ile zorla eziyoruz */
html body #app .checkout-page .payment-option-icon {
    filter: invert(72%) sepia(18%) saturate(830%) hue-rotate(5deg) brightness(92%) contrast(87%) opacity(0.5) !important;
    transition: all 0.4s ease !important;
}
html body #app .checkout-page .payment-option-card.active .payment-option-icon {
    filter: invert(72%) sepia(18%) saturate(830%) hue-rotate(5deg) brightness(92%) contrast(87%) opacity(1) !important; /* Seçilince tam altın olur */
}

/* 4. AÇILIR MENÜ (SELECT BANK - DROPDOWN) ÖZELLEŞTİRMESİ */
/* Beyaz arka planlı sırıtan menüyü zifiri siyah ve altına çeviriyoruz */
html body #app .checkout-page .payment-option__wrapper .v-field--variant-solo {
    background: #0A0A0C !important;
    border: 1px solid rgba(200, 169, 81, 0.3) !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    margin-top: 15px !important;
    transition: all 0.4s ease !important;
}
html body #app .checkout-page .payment-option__wrapper .v-field--focused {
    border-color: #C8A951 !important;
    box-shadow: 0 0 15px rgba(200, 169, 81, 0.15) !important;
}

/* Menü İçi Yazılar (Select Bank, Vakıf Bank vb.) */
html body #app .checkout-page .payment-option__wrapper .v-select__selection-text,
html body #app .checkout-page .payment-option__wrapper .v-field__input {
    color: #E8E8E8 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12px !important;
    font-weight: 300 !important;
    letter-spacing: 1px !important;
}
html body #app .checkout-page .payment-option__wrapper .v-label {
    color: rgba(255, 255, 255, 0.3) !important;
    font-size: 9px !important;
    letter-spacing: 2px !important;
}

/* Temizleme (X) ve Aşağı Ok İkonları */
html body #app .checkout-page .payment-option__wrapper .v-field__clearable i,
html body #app .checkout-page .payment-option__wrapper .v-field__append-inner i {
    color: rgba(200, 169, 81, 0.5) !important;
}

/* 5. BANKA DETAYLARI (IBAN BİLGİLERİ VE KOPYALA BUTONU) */
html body #app .checkout-page .pay-transfer-selected-bank {
    background: transparent !important;
    border-left: 2px solid rgba(200, 169, 81, 0.5) !important; /* Şık bir sol çizgi */
    padding: 15px 0 15px 20px !important;
    margin-top: 20px !important;
}

/* IBAN, Şube Kodu gibi metinler */
html body #app .checkout-page .pay-transfer-selected-bank-text {
    color: rgba(255, 255, 255, 0.6) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    font-weight: 300 !important;
    line-height: 1.8 !important;
    letter-spacing: 1px !important;
    margin-bottom: 5px !important;
}
/* İlk Satır (Firma Adı) */
html body #app .checkout-page .pay-transfer-selected-bank-text:first-child {
    color: #C8A951 !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
}

/* Kopyala (Copy) Butonu (Sessiz ve derinden) */
html body #app .checkout-page .pay-transfer-selected-bank .copy-button {
    background: rgba(200, 169, 81, 0.05) !important;
    border: 1px solid rgba(200, 169, 81, 0.2) !important;
    border-radius: 4px !important;
    margin-left: 10px !important;
    transition: all 0.4s ease !important;
}
html body #app .checkout-page .pay-transfer-selected-bank .copy-button i {
    color: #C8A951 !important;
    font-size: 14px !important;
}
html body #app .checkout-page .pay-transfer-selected-bank .copy-button:hover {
    background: #C8A951 !important;
    transform: scale(1.1) !important;
}
html body #app .checkout-page .pay-transfer-selected-bank .copy-button:hover i {
    color: #0A0A0C !important; /* Altın zemin üstüne siyah ikon */
}
/* =========================================================
   THE TUVA: TAMAMLANMIŞ ADIMLAR (COMPLETED) VE İKON DÜZELTMELERİ
   ========================================================= */

/* 1. ÖDEME SEÇENEKLERİ (Mobile Wallet vb.) OKUNABİLİRLİK VE İKON DÜZELTMESİ */
/* Yazıların karanlıkta kaybolmasını kesin olarak engelliyoruz */
html body #app .checkout-page .v-radio label.v-label {
    color: rgba(255, 255, 255, 0.8) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    opacity: 1 !important;
    align-items: center !important;
    display: flex !important;
}

/* Seçili durumda yazı saf altına döner */
html body #app .checkout-page .v-radio:has(input:checked) label.v-label {
    color: #C8A951 !important;
    font-weight: 500 !important;
}

/* Lacivert (Karanlık) SVG İkonlarını Altına/Gümüşe Çevirme */
html body #app .checkout-page .payment-option-icon {
    filter: invert(72%) sepia(18%) saturate(830%) hue-rotate(5deg) brightness(92%) contrast(87%) !important;
    opacity: 0.5 !important;
    margin-right: 15px !important;
    transition: all 0.4s ease !important;
}
html body #app .checkout-page .v-radio:has(input:checked) .payment-option-icon {
    opacity: 1 !important; /* Seçildiğinde tam altın parlaklığına ulaşır */
    transform: scale(1.1) !important;
}


/* 2. TAMAMLANMIŞ ADIM KUTUSU (COMPLETED STEP) - SÖZLEŞME GÖRÜNÜMÜ */
/* Kapanmış kutuyu şık bir özet paneline dönüştürüyoruz */
html body #app .checkout-page .step-box.completed {
    background: rgba(200, 169, 81, 0.02) !important; /* Çok çok hafif bir altın aurası */
    border: 1px solid rgba(200, 169, 81, 0.15) !important;
    border-radius: 8px !important;
    padding: 30px !important;
    margin-bottom: 30px !important;
    opacity: 1 !important; /* Soluklaşmayı iptal et, asil dursun */
    transition: all 0.5s ease !important;
}

/* Kapanmış Kutunun Başlığı (Delivery Address ve Check İşareti) */
html body #app .checkout-page .step-box.completed .step-box--header {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    border-bottom: 1px solid rgba(200, 169, 81, 0.2) !important;
    padding-bottom: 15px !important;
    margin-bottom: 25px !important;
}

html body #app .checkout-page .step-box.completed .step-box--header h2 {
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
    color: #C8A951 !important;
    display: flex !important;
    align-items: center !important;
}

/* Onay Tikini (Check) Yeşilden Altına Çevir */
html body #app .checkout-page .step-box.completed .step-box--header h2 .mdi-check-circle {
    color: #C8A951 !important;
    margin-left: 12px !important;
    font-size: 18px !important;
}

/* Başlıktaki Edit Butonunun Konumu ve Lüks Görünümü */
html body #app .checkout-page .step-box.completed .step-box--header button.address-radio-item-edit {
    margin: 0 !important;
    height: 32px !important;
    background: transparent !important;
}

/* 3. TAMAMLANMIŞ ÖZET BİLGİLERİ (Adres ve Kargo Metinleri) */
/* Bilgi bloklarının soluna şık bir hiyerarşi çizgisi çekiyoruz */
html body #app .checkout-page .step-box.completed .info-block {
    background: transparent !important;
    border-left: 2px solid rgba(200, 169, 81, 0.3) !important;
    padding: 5px 0 5px 20px !important;
    margin-bottom: 20px !important;
}

/* "Ev" veya "İş" Başlığı */
html body #app .checkout-page .step-box.completed .info-block--title {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 10px !important;
    font-weight: 500 !important;
    letter-spacing: 4px !important;
    text-transform: uppercase !important;
    margin-bottom: 8px !important;
}

/* Tam Adres Metni ve Kargo Seçimi Metni */
html body #app .checkout-page .step-box.completed .address-full,
html body #app .checkout-page .step-box.completed .info-block-cargo--subtitle {
    color: rgba(255, 255, 255, 0.6) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12px !important;
    font-weight: 300 !important;
    line-height: 1.8 !important;
    letter-spacing: 1px !important;
}

/* "Shipping Options" Ara Başlığı */
html body #app .checkout-page .step-box.completed .cargo--title {
    color: rgba(255, 255, 255, 0.3) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 9px !important;
    letter-spacing: 4px !important;
    text-transform: uppercase !important;
    margin-top: 30px !important;
    margin-bottom: 15px !important;
}
/* =========================================================
   THE TUVA: KREDİ KARTI KUTU VE YAZI DÜZELTMESİ (NİHAİ LÜKS SÜRÜM)
   ========================================================= */

/* 1. ANA KUTUYU SİYAHA BOYAYIP ALTIN ÇERÇEVE EKLİYORUZ */
html body #app .checkout-page form.form-adv .cc-input .v-field,
html body #app .checkout-page form.form-adv .cc-input.v-theme--light {
    background-color: #0A0A0C !important;
    background: #0A0A0C !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 8px !important;
    min-height: 55px !important;
    box-shadow: none !important;
    margin-bottom: 12px !important;
    transition: all 0.4s ease !important;
    position: relative !important;
}

/* 2. KUTUNUN İÇİNDEKİ İNATÇI BEYAZ BOYALARI TAMAMEN ERİTİYORUZ (ŞEFFAF YAPIYORUZ) */
html body #app .checkout-page form.form-adv .cc-input .v-field__overlay,
html body #app .checkout-page form.form-adv .cc-input .v-field__field,
html body #app .checkout-page form.form-adv .cc-input .v-field__outline,
html body #app .checkout-page form.form-adv .cc-input .v-field__outline *,
html body #app .checkout-page form.form-adv .cc-input input {
    background-color: transparent !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* 3. KAYBOLAN YÖNLENDİRME YAZILARINI (LABEL) AÇIĞA ÇIKARTIYORUZ */
/* Üst üste binen çift yazı hatasını önlemek için Vue'nun kopyasını gizle */
html body #app .checkout-page form.form-adv .cc-input .v-field-label--floating {
    display: none !important;
}

/* Asıl yönlendirme yazılarını (Name and Surname, Card Number) gümüş rengiyle ortala */
html body #app .checkout-page form.form-adv .cc-input .v-label,
html body #app .checkout-page form.form-adv .cc-input .textfield-label {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    color: rgba(255, 255, 255, 0.5) !important; /* Lüks Gümüş Rengi */
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    z-index: 5 !important;
    width: 100% !important;
    pointer-events: none !important; /* Tıklamaların inputa geçmesini sağlar */
    transition: all 0.3s ease !important;
}

/* 4. KUTUYA TIKLANINCA YAZININ YUKARI KAYMASI VE ALTIN OLMASI */
html body #app .checkout-page form.form-adv .cc-input .v-field--active .textfield-label,
html body #app .checkout-page form.form-adv .cc-input .v-field--focused .textfield-label,
html body #app .checkout-page form.form-adv .cc-input .v-field--active .v-label,
html body #app .checkout-page form.form-adv .cc-input .v-field--focused .v-label {
    color: #C8A951 !important;
    font-size: 9px !important;
    transform: translateY(-22px) !important;
}

/* Kutunun kendisi tıklanınca parlasın */
html body #app .checkout-page form.form-adv .cc-input .v-field--focused,
html body #app .checkout-page form.form-adv .cc-input .v-field--active {
    border-color: #C8A951 !important;
    box-shadow: 0 5px 20px rgba(200, 169, 81, 0.15) !important;
}

/* 5. MÜŞTERİNİN YAZDIĞI RAKAMLAR (SIVI ALTIN EFEKTİ) */
html body #app .checkout-page form.form-adv .cc-input input.v-field__input {
    color: #C8A951 !important;
    -webkit-text-fill-color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    letter-spacing: 4px !important;
    padding-top: 15px !important; /* Kayan yazıyla çarpışmasını engeller */
    z-index: 10 !important;
    outline: none !important;
    width: 100% !important;
}

/* Chrome Otomatik Doldurma (Autofill) Sarı/Beyaz Kutu Engellemesi */
html body #app .checkout-page form.form-adv input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 100px #0A0A0C inset !important;
    -webkit-text-fill-color: #C8A951 !important;
    transition: background-color 5000s ease-in-out 0s !important;
}

/* 6. ANA BAŞLIK ("PAY VIA CREDIT CARD") */
html body #app .checkout-page form.form-adv .title {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 14px !important;
    font-weight: 400 !important;
    letter-spacing: 5px !important;
    text-transform: uppercase !important;
    text-align: center !important;
    border-bottom: 1px solid rgba(200, 169, 81, 0.2) !important;
    padding-bottom: 15px !important;
    margin-bottom: 30px !important;
}

/* 7. HATA / KIRMIZI UYARILAR VE CVV SORU İŞARETİ */
html body #app .checkout-page form.form-adv .bg-error { display: none !important; }
html body #app .checkout-page form.form-adv .v-field--error { border-color: #E57373 !important; }
html body #app .checkout-page form.form-adv .v-messages__message {
    color: #E57373 !important;
    font-size: 10px !important;
    letter-spacing: 1px !important;
    margin-top: 5px !important;
}
html body #app .checkout-page form.form-adv .mdi-help-circle-outline {
    color: rgba(200, 169, 81, 0.5) !important;
    position: absolute !important;
    right: 15px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    z-index: 15 !important;
}
/* =========================================================
   THE TUVA: KREDİ KARTI FORMU SON DOKUNUŞLAR (YAZILAR VE LOGO)
   ========================================================= */

/* 1. KAYIP YÖNLENDİRME YAZILARINI (ETİKETLERİ) GÖRÜNÜR YAP */
/* Sistemin opacity veya display ile sakladığı yazıları zorla ekrana basıyoruz */
html body #app .checkout-page form.form-adv .cc-input label.v-label.v-field-label,
html body #app .checkout-page form.form-adv .cc-input .textfield-label {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    color: rgba(255, 255, 255, 0.5) !important; /* Elit Gümüş Rengi */
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    z-index: 10 !important; /* Arka planın üstünde, net bir şekilde dursun */
    pointer-events: none !important; /* Tıklamaların alttaki input'a geçmesine izin ver */
    transition: all 0.3s ease !important;
    width: 100% !important;
}

/* Çift yazı (üst üste binme) hatasını önlemek için kopyayı gizle */
html body #app .checkout-page form.form-adv .cc-input .v-field-label--floating {
    display: none !important;
}

/* 2. KUTUYA TIKLANINCA YAZININ YUKARI KAYMASI VE PARLAMASI */
html body #app .checkout-page form.form-adv .cc-input .v-field--active label.v-label.v-field-label,
html body #app .checkout-page form.form-adv .cc-input .v-field--focused label.v-label.v-field-label,
html body #app .checkout-page form.form-adv .cc-input .v-field--active .textfield-label,
html body #app .checkout-page form.form-adv .cc-input .v-field--focused .textfield-label {
    color: #C8A951 !important; /* Saf Altın */
    font-size: 9px !important;
    transform: translateY(-22px) !important; /* Yukarıya zarif bir kayış */
    letter-spacing: 3px !important;
}

/* 3. PAYCELL LOGOSUNU İMHA EDİP "theTUVA" MÜHRÜNÜ BASMA */
/* Çirkin mavi logoyu HTML'den tamamen siliyoruz */
html body #app .checkout-page .pay-new-credit-card img.paycell-logo {
    display: none !important;
}

/* Logonun bulunduğu alana theTUVA imzasını altın rengiyle işliyoruz */
html body #app .checkout-page .pay-new-credit-card > div > div.mb-4 {
    position: relative !important;
    text-align: center !important;
    margin-top: 15px !important;
}
html body #app .checkout-page .pay-new-credit-card > div > div.mb-4::before {
    content: "theTUVA SECURE PAYMENT" !important;
    display: block !important;
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    letter-spacing: 6px !important;
    margin-bottom: 12px !important;
    text-shadow: 0 0 15px rgba(200, 169, 81, 0.2) !important; /* Hafif bir aura */
}

/* Orijinal Paycell alt metnini de markamıza uygun (küçük ve gümüş) hale getiriyoruz */
html body #app .checkout-page .pay-new-credit-card > div > div.mb-4 div {
    color: rgba(255, 255, 255, 0.3) !important;
    font-size: 9px !important;
    line-height: 1.6 !important;
    letter-spacing: 1px !important;
    text-align: center !important;
}

/* 4. ANA BAŞLIĞI (PAY VIA CREDIT CARD) ORTAYA ÇIKAR */
html body #app .checkout-page form.form-adv .title {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    letter-spacing: 5px !important;
    text-transform: uppercase !important;
    text-align: center !important;
    border-bottom: 1px solid rgba(200, 169, 81, 0.2) !important;
    padding-bottom: 15px !important;
    margin-bottom: 25px !important;
}
/* =========================================================
   THE TUVA: KREDİ KARTI KUTU YAZILARI (HAYALET METİNLER)
   ========================================================= */

/* 1. GİZLENEN ETİKETLERİ (LABEL) TAMAMEN DEVRE DIŞI BIRAK */
/* Madem sistem onları saklıyor, biz de onlarla uğraşmıyoruz */
html body #app .checkout-page form.form-adv .cc-input label.v-label.v-field-label,
html body #app .checkout-page form.form-adv .cc-input .textfield-label {
    display: none !important;
}

/* 2. KUTULARA DOĞRUDAN HAYALET (PLACEHOLDER) YAZILARI EKLİYORUZ */
/* Her bir kutunun ne işe yaradığını CSS ile içine yazıyoruz */

/* KART ÜZERİNDEKİ İSİM (1. Kutu) */
html body #app .checkout-page form.form-adv .cc-input:nth-of-type(1) .v-field__field::before {
    content: "NAME AND SURNAME ON THE CARD" !important;
}

/* KART NUMARASI (2. Kutu) */
html body #app .checkout-page form.form-adv .cc-input:nth-of-type(2) .v-field__field::before {
    content: "CARD NUMBER" !important;
}

/* SON KULLANMA TARİHİ (3. Kutu - Sol) */
html body #app .checkout-page form.form-adv .cc-input-row .cc-input:nth-child(1) .v-field__field::before {
    content: "EXPIRATION DATE" !important;
}

/* CVV (3. Kutu - Sağ) */
html body #app .checkout-page form.form-adv .cc-input-row .cc-input:nth-child(2) .v-field__field::before {
    content: "CVV" !important;
}

/* 3. HAYALET YAZILARIN TASARIMI (LÜKS GÜMÜŞ) */
html body #app .checkout-page form.form-adv .cc-input .v-field__field::before {
    display: flex !important;
    align-items: center !important;
    position: absolute !important;
    top: 0 !important;
    left: 15px !important;
    height: 100% !important;
    color: rgba(255, 255, 255, 0.4) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    pointer-events: none !important; /* Tıklamaların alttaki input'a geçmesine izin ver */
    transition: all 0.3s ease !important;
    z-index: 1 !important;
}

/* 4. KUTUYA TIKLANINCA VEYA İÇİ DOLUYKEN YAZININ YUKARI KAYMASI VE ALTIN OLMASI */
html body #app .checkout-page form.form-adv .cc-input .v-field--active .v-field__field::before,
html body #app .checkout-page form.form-adv .cc-input .v-field--focused .v-field__field::before {
    top: 8px !important;
    height: auto !important;
    font-size: 9px !important;
    color: #C8A951 !important;
    letter-spacing: 3px !important;
}

/* 5. GİRİLEN METİN / RAKAMLARIN HİZALAMASI */
/* Müşteri yazmaya başladığında yazıların üst üste binmemesi için padding ayarlıyoruz */
html body #app .checkout-page form.form-adv input.v-field__input {
    padding-top: 20px !important;
    padding-bottom: 5px !important;
    z-index: 5 !important;
}
/* =========================================================
   THE TUVA: KREDİ KARTI FORMU (AKIŞKAN LÜKS & HAYALET YAZILAR)
   ========================================================= */

/* 1. SİSTEMİN TÜM ETİKETLERİNİ (LABEL) VE ÇERÇEVELERİNİ KÖKTEN SİL */
html body #app .checkout-page form.form-adv .cc-input label.v-label,
html body #app .checkout-page form.form-adv .cc-input .textfield-label,
html body #app .checkout-page form.form-adv .cc-input .v-field__outline,
html body #app .checkout-page form.form-adv .cc-input .v-field__overlay {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    border: none !important;
}

/* 2. KUTU (INPUT) TASARIMI: AKIŞKAN VE LÜKS */
html body #app .checkout-page form.form-adv .cc-input .v-field,
html body #app .checkout-page form.form-adv .cc-input.v-theme--light {
    background-color: #0A0A0C !important;
    background: #0A0A0C !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 12px !important; /* Lüks, yumuşak kavis */
    min-height: 60px !important;
    padding: 0 20px !important;
    margin-bottom: 18px !important;
    box-shadow: none !important;
    position: relative !important;
    transition: all 0.5s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

/* Kutuya Tıklayınca (Focus) Akışkan Parlama */
html body #app .checkout-page form.form-adv .cc-input .v-field--focused,
html body #app .checkout-page form.form-adv .cc-input .v-field--active {
    border-color: #C8A951 !important;
    background: rgba(200, 169, 81, 0.03) !important;
    box-shadow: 0 10px 25px rgba(200, 169, 81, 0.15) !important;
    transform: translateY(-2px) !important; /* Zarifçe yükselir */
}

/* 3. İÇİNE YAZILAN YAZILAR (MÜŞTERİ VERİSİ - SIVI ALTIN) */
html body #app .checkout-page form.form-adv .cc-input input.v-field__input {
    background: transparent !important;
    color: #C8A951 !important;
    -webkit-text-fill-color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    letter-spacing: 4px !important;
    width: 100% !important;
    height: 100% !important;
    padding-top: 15px !important; /* Yazının ortalanması için boşluk */
    z-index: 10 !important;
    outline: none !important;
}

/* 4. HAYALET (PLACEHOLDER) YÖNLENDİRME YAZILARI */
/* Her kutuya ne yazılacağını CSS ile özel olarak basıyoruz */
html body #app .checkout-page form.form-adv .cc-input .v-field__field::before {
    display: flex !important;
    align-items: center !important;
    position: absolute !important;
    left: 20px !important;
    height: 100% !important;
    color: rgba(255, 255, 255, 0.4) !important; /* Soluk Gümüş */
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    pointer-events: none !important;
    transition: all 0.4s ease !important;
    z-index: 5 !important;
    top: 0 !important;
}

/* Kutuya Göre Özel Metinler (Sıralamayı Düzelttik) */
/* 1. Kutu: İsim Soyisim */
html body #app .checkout-page form.form-adv > .cc-input:nth-of-type(1) .v-field__field::before {
    content: "NAME AND SURNAME ON THE CARD" !important;
}
/* 2. Kutu: Kart Numarası */
html body #app .checkout-page form.form-adv > .cc-input:nth-of-type(2) .v-field__field::before {
    content: "CARD NUMBER" !important;
}
/* 3. Kutu (Sol): Son Kullanma Tarihi */
html body #app .checkout-page form.form-adv .cc-input-row .cc-input:nth-child(1) .v-field__field::before {
    content: "EXPIRATION DATE" !important;
}
/* 4. Kutu (Sağ): CVV */
html body #app .checkout-page form.form-adv .cc-input-row .cc-input:nth-child(2) .v-field__field::before {
    content: "CVV" !important;
}

/* Tıklayınca Hayalet Yazının Yukarı Kayması ve Altın Olması */
html body #app .checkout-page form.form-adv .cc-input .v-field--active .v-field__field::before,
html body #app .checkout-page form.form-adv .cc-input .v-field--focused .v-field__field::before {
    top: -12px !important; /* Yukarı kayar */
    font-size: 9px !important;
    color: #C8A951 !important;
    letter-spacing: 3px !important;
    height: auto !important;
}

/* 5. MAVİ CHECKBOX YAZILARINI ("REGISTER PAYCELL" VB.) ALTIN VE GÜMÜŞ YAPMA */
/* Yazıları (Kayıtlı Kart, Register Paycell vb.) Gümüş yap */
html body #app .checkout-page .pay-new-credit-card .description,
html body #app .checkout-page .pay-new-credit-card .description div,
html body #app .checkout-page .new-card-register-form .description div {
    color: rgba(255, 255, 255, 0.6) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    transition: all 0.3s ease !important;
}

/* Checkbox Yuvarlağını (Mavi Olan) Altına Çevir */
html body #app .checkout-page .pay-new-credit-card .chekbox-mod .checkmark {
    border: 1px solid rgba(200, 169, 81, 0.5) !important;
    background: transparent !important;
    border-radius: 4px !important;
    transition: all 0.3s ease !important;
}
html body #app .checkout-page .pay-new-credit-card .chekbox-mod:hover .description div {
    color: #C8A951 !important;
}
html body #app .checkout-page .pay-new-credit-card .chekbox-mod input:checked ~ .checkmark {
    background: #C8A951 !important;
    border-color: #C8A951 !important;
    box-shadow: 0 0 10px rgba(200, 169, 81, 0.4) !important;
}
html body #app .checkout-page .pay-new-credit-card .chekbox-mod input:checked ~ .checkmark i {
    color: #0A0A0C !important;
}

/* 6. DEVASA PAYCELL LOGOSUNU İMHA ET, "theTUVA" YAZ */
html body #app .checkout-page .pay-new-credit-card img.paycell-logo {
    display: none !important;
}
html body #app .checkout-page .pay-new-credit-card > div > div.mb-4 {
    position: relative !important;
    text-align: center !important;
    margin-top: 20px !important;
}
html body #app .checkout-page .pay-new-credit-card > div > div.mb-4::before {
    content: "theTUVA SECURE PAYMENT" !important;
    display: block !important;
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 16px !important;
    font-weight: 300 !important;
    letter-spacing: 6px !important;
    margin-bottom: 12px !important;
}
html body #app .checkout-page .pay-new-credit-card > div > div.mb-4 div {
    color: rgba(255, 255, 255, 0.3) !important;
    font-size: 9px !important;
    line-height: 1.6 !important;
    text-align: center !important;
}

/* 7. HATA (KIRMIZI) UYARILARIN DÜZELTİLMESİ */
html body #app .checkout-page form.form-adv .bg-error { display: none !important; }
html body #app .checkout-page form.form-adv .v-field--error { border-color: rgba(229, 115, 115, 0.6) !important; }
html body #app .checkout-page form.form-adv .v-messages__message {
    color: #E57373 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 10px !important;
    letter-spacing: 1px !important;
    padding-left: 10px !important;
    margin-top: 6px !important;
}
html body #app .checkout-page form.form-adv .mdi-help-circle-outline {
    color: rgba(200, 169, 81, 0.5) !important;
    position: absolute !important;
    right: 15px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    z-index: 15 !important;
}

/* Chrome Autofill Sarılık Hatası */
html body #app .checkout-page form.form-adv input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 100px #0A0A0C inset !important;
    -webkit-text-fill-color: #C8A951 !important;
}
/* =========================================================
   THE TUVA: KREDİ KARTI FORMU (NİHAİ AKIŞKAN LÜKS & KUSURSUZ SIRALAMA)
   ========================================================= */

/* 1. SİSTEMİN TÜM ETİKETLERİNİ (LABEL) VE ÇERÇEVELERİNİ KÖKTEN SİL */
html body #app .checkout-page form.form-adv .cc-input label.v-label,
html body #app .checkout-page form.form-adv .cc-input .textfield-label,
html body #app .checkout-page form.form-adv .cc-input .v-field__outline,
html body #app .checkout-page form.form-adv .cc-input .v-field__overlay {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    border: none !important;
}

/* 2. KUTU (INPUT) TASARIMI: AKIŞKAN VE LÜKS */
html body #app .checkout-page form.form-adv .cc-input .v-field,
html body #app .checkout-page form.form-adv .cc-input.v-theme--light {
    background-color: #0A0A0C !important;
    background: #0A0A0C !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 12px !important;
    min-height: 60px !important;
    padding: 0 20px !important;
    margin-bottom: 18px !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.3) !important; /* Hafif iç gölge derinliği */
    position: relative !important;
    transition: all 0.5s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

/* Kutuya Tıklayınca (Focus) Akışkan Parlama */
html body #app .checkout-page form.form-adv .cc-input .v-field--focused,
html body #app .checkout-page form.form-adv .cc-input .v-field--active {
    border-color: #C8A951 !important;
    background: rgba(200, 169, 81, 0.03) !important;
    box-shadow: 0 10px 30px rgba(200, 169, 81, 0.15), inset 0 0 10px rgba(200, 169, 81, 0.05) !important;
    transform: translateY(-2px) !important; /* Tablo gibi hafifçe yükselir */
}

/* 3. İÇİNE YAZILAN YAZILAR (MÜŞTERİ VERİSİ - SIVI ALTIN) */
html body #app .checkout-page form.form-adv .cc-input input.v-field__input {
    background: transparent !important;
    color: #C8A951 !important;
    -webkit-text-fill-color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 15px !important;
    font-weight: 500 !important;
    letter-spacing: 4px !important;
    width: 100% !important;
    height: 100% !important;
    padding-top: 15px !important;
    z-index: 10 !important;
    outline: none !important;
    transition: all 0.3s ease !important;
}

/* 4. HAYALET (PLACEHOLDER) YÖNLENDİRME YAZILARI (SIRALAMA DÜZELTİLDİ!) */
html body #app .checkout-page form.form-adv .cc-input .v-field__field::before {
    display: flex !important;
    align-items: center !important;
    position: absolute !important;
    left: 20px !important;
    height: 100% !important;
    color: rgba(255, 255, 255, 0.4) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    pointer-events: none !important;
    transition: all 0.5s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    z-index: 5 !important;
    top: 0 !important;
}

/* Kutuya Göre Özel Metinler (Kesin Seçiciler ile Sıralama Çözüldü) */
/* 1. Kutu: İsim Soyisim */
html body #app .checkout-page form.form-adv > div:nth-child(2) .v-field__field::before {
    content: "NAME AND SURNAME ON THE CARD" !important;
}
/* 2. Kutu: Kart Numarası */
html body #app .checkout-page form.form-adv > div:nth-child(3) .v-field__field::before {
    content: "CARD NUMBER" !important;
}
/* 3. Kutu (Sol): Son Kullanma Tarihi */
html body #app .checkout-page form.form-adv .cc-input-row > div:nth-child(1) .v-field__field::before {
    content: "EXPIRATION DATE" !important;
}
/* 4. Kutu (Sağ): CVV */
html body #app .checkout-page form.form-adv .cc-input-row > div:nth-child(2) .v-field__field::before {
    content: "CVV" !important;
}

/* Tıklayınca Hayalet Yazının Yukarı Kayması ve Altın Olması */
html body #app .checkout-page form.form-adv .cc-input .v-field--active .v-field__field::before,
html body #app .checkout-page form.form-adv .cc-input .v-field--focused .v-field__field::before {
    top: -14px !important;
    font-size: 9px !important;
    color: #C8A951 !important;
    letter-spacing: 4px !important;
    height: auto !important;
    opacity: 0.9 !important;
}

/* 5. MAVİ CHECKBOX YAZILARINI ALTIN VE GÜMÜŞ YAPMA */
html body #app .checkout-page .pay-new-credit-card .description,
html body #app .checkout-page .pay-new-credit-card .description div,
html body #app .checkout-page .new-card-register-form .description div {
    color: rgba(255, 255, 255, 0.6) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    transition: all 0.3s ease !important;
}

html body #app .checkout-page .pay-new-credit-card .chekbox-mod .checkmark {
    border: 1px solid rgba(200, 169, 81, 0.5) !important;
    background: transparent !important;
    border-radius: 4px !important;
    transition: all 0.3s ease !important;
}
html body #app .checkout-page .pay-new-credit-card .chekbox-mod:hover .description div {
    color: #C8A951 !important;
}
html body #app .checkout-page .pay-new-credit-card .chekbox-mod input:checked ~ .checkmark {
    background: #C8A951 !important;
    border-color: #C8A951 !important;
    box-shadow: 0 0 15px rgba(200, 169, 81, 0.3) !important; /* Altın parlama efekti */
}
html body #app .checkout-page .pay-new-credit-card .chekbox-mod input:checked ~ .checkmark i {
    color: #0A0A0C !important;
}

/* 6. DEVASA PAYCELL LOGOSUNU İMHA ET, "theTUVA" YAZ */
html body #app .checkout-page .pay-new-credit-card img.paycell-logo {
    display: none !important;
}
html body #app .checkout-page .pay-new-credit-card > div > div.mb-4 {
    position: relative !important;
    text-align: center !important;
    margin-top: 25px !important;
    margin-bottom: 25px !important; /* Formdan elit bir şekilde ayırmak için boşluk */
}
html body #app .checkout-page .pay-new-credit-card > div > div.mb-4::before {
    content: "theTUVA SECURE PAYMENT" !important;
    display: block !important;
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 16px !important;
    font-weight: 300 !important;
    letter-spacing: 6px !important;
    margin-bottom: 12px !important;
    text-shadow: 0 2px 10px rgba(200, 169, 81, 0.2) !important; /* Markaya elit bir ışık */
}
html body #app .checkout-page .pay-new-credit-card > div > div.mb-4 div {
    color: rgba(255, 255, 255, 0.3) !important;
    font-size: 9px !important;
    line-height: 1.6 !important;
    text-align: center !important;
}

/* 7. HATA (KIRMIZI) UYARILARIN DÜZELTİLMESİ VE CVV İKONU */
html body #app .checkout-page form.form-adv .bg-error { display: none !important; }
html body #app .checkout-page form.form-adv .v-field--error { 
    border-color: rgba(229, 115, 115, 0.6) !important; 
    box-shadow: 0 0 10px rgba(229, 115, 115, 0.1) !important;
}
html body #app .checkout-page form.form-adv .v-messages__message {
    color: #E57373 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 10px !important;
    letter-spacing: 1px !important;
    padding-left: 10px !important;
    margin-top: 6px !important;
}
html body #app .checkout-page form.form-adv .mdi-help-circle-outline {
    color: rgba(200, 169, 81, 0.5) !important;
    position: absolute !important;
    right: 15px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    z-index: 15 !important;
    transition: color 0.3s ease !important;
}
/* Odaklanınca CVV ikonunun da altına dönmesi */
html body #app .checkout-page form.form-adv .v-field--focused .mdi-help-circle-outline {
    color: #C8A951 !important;
}

/* Chrome Autofill Sarılık Hatası */
html body #app .checkout-page form.form-adv input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 100px #0A0A0C inset !important;
    -webkit-text-fill-color: #C8A951 !important;
}
/* =========================================================
   THE TUVA: KREDİ KARTI YAZI SIRALAMASI VE ALTIN DOKUNUŞLAR
   ========================================================= */

/* 1. İSİM VE KART NUMARASI YER DEĞİŞTİRME KESİN ÇÖZÜMÜ */
/* İlk Kutu: İsim Soyisim (Başlıktan hemen sonraki kutuya mühürler) */
html body #app .checkout-page form.form-adv .title + .cc-input .v-field__field::before {
    content: "NAME AND SURNAME ON THE CARD" !important;
}

/* İkinci Kutu: Kart Numarası (İsim kutusundan hemen sonraki kutuya mühürler) */
html body #app .checkout-page form.form-adv .title + .cc-input + .cc-input .v-field__field::before {
    content: "CARD NUMBER" !important;
}

/* 2. MAVİ "REGISTER" VE "KAYITLI KART" YAZILARINI THE TUVA ALTINI YAPMA */
html body #app .checkout-page .pay-new-credit-card .description,
html body #app .checkout-page .pay-new-credit-card .description div,
html body #app .checkout-page .new-card-register-form .description,
html body #app .checkout-page .new-card-register-form .description div {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    letter-spacing: 3px !important;
    text-transform: uppercase !important;
    font-weight: 500 !important;
    text-shadow: 0 0 10px rgba(200, 169, 81, 0.2) !important; /* Hafif elit parlama */
    transition: all 0.4s ease !important;
}

/* 3. CHECKBOX ÜZERİNE GELİNCE AKIŞKAN PARLAMA EFEKTİ */
html body #app .checkout-page .pay-new-credit-card label.chekbox-mod:hover .description div,
html body #app .checkout-page .new-card-register-form label.chekbox-mod:hover .description div {
    color: #fff !important; /* Gümüşe dönüşür */
    letter-spacing: 4px !important; /* Zarifçe esner */
}
/* =========================================================
   THE TUVA: KREDİ KARTI FORMU SON RÖTUŞLAR (CİLA)
   ========================================================= */

/* 1. HATA MESAJLARI (PREMIUM UYARI KARTLARI) */
/* Sadece kırmızı bir yazı yerine, lüks bir uyarı rozetine dönüştürüyoruz */
html body #app .checkout-page form.form-adv .v-messages__message {
    background: rgba(239, 68, 68, 0.08) !important; /* Hafif kırmızı saydam zemin */
    color: #ef4444 !important; /* Tok bir kiremit kırmızı */
    border: 1px solid rgba(239, 68, 68, 0.2) !important;
    border-radius: 8px !important;
    padding: 8px 12px !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 10px !important;
    font-weight: 500 !important;
    letter-spacing: 1.5px !important;
    display: inline-block !important; /* Metni rozet (hap) formuna sokar */
    margin-top: 8px !important;
    margin-bottom: 5px !important;
    box-shadow: 0 5px 15px rgba(239, 68, 68, 0.05) !important;
}

/* Hata veren kutunun (input) dış çerçevesi de zarifçe kırmızı parlasın */
html body #app .checkout-page form.form-adv .v-field--error {
    border-color: rgba(239, 68, 68, 0.5) !important;
    box-shadow: 0 0 15px rgba(239, 68, 68, 0.1) !important;
}

/* 2. TAKSİT SEÇENEKLERİ (LÜKS KART DİZİLİMİ) */
/* Eski tip beyaz çizgili alt alta listeyi sıfırlıyoruz */
html body #app .checkout-page .installment-radio .v-selection-control-group {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important; /* Kartlar arası boşluk (çizgiye gerek kalmaz) */
    margin-top: 15px !important;
}

/* Her Bir Taksit Seçeneğini Bağımsız Bir "Altın Kart" Yapıyoruz */
html body #app .checkout-page .installment-radio .v-radio {
    background: #0A0A0C !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important; /* Çok hafif gümüş sınır */
    border-radius: 12px !important;
    padding: 16px 20px !important;
    margin: 0 !important;
    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    cursor: pointer !important;
}

/* Taksit Kartının Üzerine Gelince (Hover) Akışkan Parlama */
html body #app .checkout-page .installment-radio .v-radio:hover {
    border-color: rgba(200, 169, 81, 0.4) !important;
    background: rgba(200, 169, 81, 0.02) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.5) !important;
}

/* 3. SEÇİLİ TAKSİT KARTI (VİTRİN YILDIZI) */
/* Müşterinin seçtiği taksit kartı altın rengiyle ön plana çıkar */
html body #app .checkout-page .installment-radio .v-selection-control--dirty {
    border-color: #C8A951 !important;
    background: rgba(200, 169, 81, 0.05) !important;
    box-shadow: 0 5px 25px rgba(200, 169, 81, 0.15) !important;
}

/* 4. TAKSİT İÇİNDEKİ YAZILAR (Taksit ve Toplam Tutar) */
html body #app .checkout-page .installment-radio-item {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    width: 100% !important;
}

/* Sol Taraf: Taksit Adedi (Örn: 3 Taksit x ₺14.546,25) */
html body #app .checkout-page .installment-radio-item > div:first-child {
    color: rgba(255, 255, 255, 0.7) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 13px !important;
    font-weight: 300 !important;
    letter-spacing: 1px !important;
    transition: all 0.3s ease !important;
}

/* Seçili İse Sol Taraf Saf Altın Olur */
html body #app .checkout-page .installment-radio .v-selection-control--dirty .installment-radio-item > div:first-child {
    color: #C8A951 !important;
    font-weight: 500 !important;
}

/* Sağ Taraf: Toplam Tutar (Örn: Total: ₺43.638,75) */
html body #app .checkout-page .installment-radio-item > div:last-child {
    color: rgba(255, 255, 255, 0.4) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    letter-spacing: 1.5px !important;
    text-transform: uppercase !important;
}

/* Seçili İse Sağ Taraf Daha Parlak Olur */
html body #app .checkout-page .installment-radio .v-selection-control--dirty .installment-radio-item > div:last-child {
    color: rgba(200, 169, 81, 0.8) !important;
}

/* 5. SEÇİM YUVARLAĞI (RADYO BUTONU İKONU) DÜZELTMESİ */
/* Varsayılan lacivert/beyaz yuvarlağı asil renklere çekiyoruz */
html body #app .checkout-page .installment-radio .v-selection-control__wrapper i {
    color: rgba(255, 255, 255, 0.2) !important;
    transition: color 0.3s ease !important;
}
html body #app .checkout-page .installment-radio .v-selection-control--dirty .v-selection-control__wrapper i {
    color: #C8A951 !important;
}
html body #app .checkout-page .installment-radio .v-label {
    flex: 1 !important;
    opacity: 1 !important;
}
/* =========================================================
   THE TUVA: SADECE MOBİL İÇİN VIP OPTİMİZASYON (MASAÜSTÜNÜ ETKİLEMEZ)
   ========================================================= */

@media (max-width: 960px) {
    /* 1. MOBİL ANA ZEMİN: Zifiri Siyah */
    html body #app .v-application, 
    html body #app .checkout-page,
    html body #app .checkout-container,
    html body #app .v-main {
        background-color: #0A0A0C !important;
        background: #0A0A0C !important;
    }

    /* 2. MOBİL KREDİ KARTI KUTULARI (Beyazlık İptali ve Altın Çerçeve) */
    html body #app .checkout-page form.form-adv .cc-input,
    html body #app .checkout-page form.form-adv .cc-input .v-field,
    html body #app .checkout-page form.form-adv .cc-input.v-theme--light,
    html body #app .checkout-page form.form-adv .cc-input .v-input__control {
        background-color: #0A0A0C !important;
        background: #0A0A0C !important;
        border: 1px solid rgba(200, 169, 81, 0.4) !important;
        border-radius: 12px !important;
        min-height: 55px !important;
        box-shadow: none !important;
        margin-bottom: 15px !important;
    }

    /* Mobildeki inatçı beyaz çerçeveleri sil */
    html body #app .checkout-page form.form-adv .cc-input .v-field__outline,
    html body #app .checkout-page form.form-adv .cc-input .v-field__overlay,
    html body #app .checkout-page form.form-adv .cc-input label.v-label {
        display: none !important;
        background: transparent !important;
    }

    /* 3. MOBİLDE İÇ YAZILAR VE SIVI ALTIN RAKAMLAR */
    html body #app .checkout-page form.form-adv .cc-input input.v-field__input {
        color: #C8A951 !important;
        -webkit-text-fill-color: #C8A951 !important;
        font-size: 14px !important;
        padding-top: 15px !important;
        background: transparent !important;
    }

    /* Mobil Hayalet Yazılar (Boyutları telefona uygun kalibre edildi) */
    html body #app .checkout-page form.form-adv .cc-input .v-field__field::before {
        font-size: 9px !important;
        left: 15px !important;
        top: 0 !important;
    }
    
    /* Mobilde tıklanınca kayan yazı */
    html body #app .checkout-page form.form-adv .cc-input .v-field--active .v-field__field::before,
    html body #app .checkout-page form.form-adv .cc-input .v-field--focused .v-field__field::before {
        top: -12px !important;
        font-size: 8px !important;
        color: #C8A951 !important;
        letter-spacing: 3px !important;
    }

    /* 4. EXPIRATION DATE VE CVV MOBİLDE YAN YANA BOZULMASIN */
    html body #app .checkout-page form.form-adv .cc-input-row {
        display: flex !important;
        flex-direction: row !important;
        gap: 10px !important;
    }
    html body #app .checkout-page form.form-adv .cc-input-row .cc-input {
        width: 50% !important;
        flex: 1 !important;
        margin-bottom: 0 !important;
    }

    /* 5. MOBİL TAKSİT VE ÖDEME SEÇENEKLERİ (Parmak dostu kartlar) */
    html body #app .checkout-page .installment-radio .v-selection-control-group {
        display: flex !important;
        flex-direction: column !important;
        gap: 10px !important;
        padding: 0 !important;
    }
    
    html body #app .checkout-page .installment-radio .v-radio,
    html body #app .checkout-page .payment-option-card {
        background-color: #0A0A0C !important;
        border: 1px solid rgba(200, 169, 81, 0.3) !important;
        border-radius: 12px !important;
        padding: 15px !important;
        margin-bottom: 10px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    
    /* Seçili kartın mobilde parlaması */
    html body #app .checkout-page .installment-radio .v-selection-control--dirty,
    html body #app .checkout-page .payment-option-card.active {
        border-color: #C8A951 !important;
        background: rgba(200, 169, 81, 0.05) !important;
    }

    /* Mobil taksit metinleri */
    html body #app .checkout-page .installment-radio-item { font-size: 11px !important; }
    html body #app .checkout-page .installment-radio-item > div:first-child { font-size: 11px !important; }
    html body #app .checkout-page .installment-radio-item > div:last-child { font-size: 9px !important; }

    /* 6. GO TO PAYMENT BUTONU MOBİLDE EKRANIN ALTINA SABİTLENSİN */
    html body #app .checkout-page #summary-operation {
        position: fixed !important;
        bottom: 0 !important;
        left: 0 !important;
        width: 100% !important;
        padding: 15px !important;
        background: #0A0A0C !important;
        border-top: 1px solid rgba(200, 169, 81, 0.3) !important;
        z-index: 999 !important;
        margin: 0 !important;
    }
    html body #app .checkout-page .sidebar-column {
        padding-bottom: 90px !important; /* Butonun altı kapatmasını engeller */
    }
}
/* =========================================================
   THE TUVA: MOBİL CHECKOUT (.checkout-page-mobile) UYUMU
   ========================================================= */

/* 1. MOBİL ZEMİN VE BAŞLIKLAR (Siyah & Altın) */
html body #app .checkout-page-mobile {
    background-color: #0A0A0C !important;
    background: #0A0A0C !important;
    color: #E8E8E8 !important;
    font-family: 'Montserrat', sans-serif !important;
}

/* Adım Başlıkları (Delivery address, Shipping Options vs) */
html body #app .checkout-page-mobile .step-box--header h2,
html body #app .checkout-page-mobile h3.info-box-title,
html body #app .checkout-page-mobile .order-note-title {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    letter-spacing: 5px !important;
    text-transform: uppercase !important;
    border-bottom: 1px solid rgba(200, 169, 81, 0.2) !important;
    padding-bottom: 12px !important;
    margin-bottom: 20px !important;
    background: transparent !important;
}

/* Soluk/Kapalı Adımlar (Örn: Payment Types sırası gelmeden önce) */
html body #app .checkout-page-mobile .step-box.disabled {
    opacity: 0.3 !important;
    pointer-events: none !important;
}

/* 2. BUTONLAR: YENİ ADRES EKLE VE DEĞİŞTİR (Add New Address & Change) */
/* "Add new address" Butonu */
html body #app .checkout-page-mobile button.add-new-address-button {
    background: transparent !important;
    border: 1px dashed rgba(200, 169, 81, 0.4) !important;
    border-radius: 12px !important;
    height: 50px !important;
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    letter-spacing: 3px !important;
    text-transform: uppercase !important;
    margin-bottom: 20px !important;
}
html body #app .checkout-page-mobile button.add-new-address-button i { color: #C8A951 !important; }
html body #app .checkout-page-mobile button.add-new-address-button .v-btn__overlay { display: none !important; }

/* "Change" (Değiştir) Hap Butonu */
html body #app .checkout-page-mobile button.address-radio-item-edit {
    border: 1px solid rgba(200, 169, 81, 0.5) !important;
    border-radius: 20px !important;
    background: transparent !important;
    color: #C8A951 !important;
    font-size: 10px !important;
    letter-spacing: 2px !important;
    height: 30px !important;
    padding: 0 12px !important;
    box-shadow: none !important;
}

/* 3. SEÇİLİ ADRES KUTUSU (VIP Kart Görünümü) */
html body #app .checkout-page-mobile .delivery-address {
    background: #0A0A0C !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 12px !important;
    padding: 20px !important;
    margin-bottom: 20px !important;
}
html body #app .checkout-page-mobile .delivery-address-content-text {
    color: rgba(255, 255, 255, 0.7) !important;
    font-size: 11px !important;
    line-height: 1.6 !important;
    font-weight: 300 !important;
}
/* Mobil Onay Tiki (Checkmark) */
html body #app .checkout-page-mobile .mobile-checkmark {
    border: 1px solid #C8A951 !important;
    background: #C8A951 !important; /* Aktif olduğunu belli eder */
    border-radius: 50% !important;
    width: 18px !important;
    height: 18px !important;
    margin-right: 15px !important;
    position: relative !important;
}
/* İçine tik ikonu çizimi */
html body #app .checkout-page-mobile .mobile-checkmark::after {
    content: ''; position: absolute; left: 5px; top: 2px; width: 5px; height: 10px; border: solid #0A0A0C; border-width: 0 2px 2px 0; transform: rotate(45deg);
}

/* 4. MOBİL CHECKBOX ("Fatura adresim farklı olsun") */
html body #app .checkout-page-mobile .chekbox-mod {
    color: rgba(255, 255, 255, 0.5) !important;
    font-size: 11px !important;
    letter-spacing: 1px !important;
}
html body #app .checkout-page-mobile .chekbox-mod .checkmark {
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    background: transparent !important;
    border-radius: 4px !important;
}
html body #app .checkout-page-mobile .chekbox-mod input:checked ~ .checkmark { background: #C8A951 !important; border-color: #C8A951 !important; }
html body #app .checkout-page-mobile .chekbox-mod input:checked ~ .checkmark i { color: #0A0A0C !important; }

/* 5. KARGO SEÇENEKLERİ (Shipping Options) */
html body #app .checkout-page-mobile .cargo-list--item {
    background: #0A0A0C !important;
    border: 1px solid #C8A951 !important; /* Seçili Kargo Altın Çerçeve */
    border-radius: 12px !important;
    padding: 15px !important;
    margin-bottom: 15px !important;
    box-shadow: 0 0 20px rgba(200, 169, 81, 0.1) !important;
}
html body #app .checkout-page-mobile .cargo-list--item_name {
    color: #C8A951 !important;
    font-size: 12px !important;
    text-transform: uppercase !important;
    letter-spacing: 3px !important;
    margin-bottom: 5px !important;
}
html body #app .checkout-page-mobile .cargo-list--item_description {
    color: rgba(255, 255, 255, 0.4) !important;
    font-size: 9px !important;
    line-height: 1.5 !important;
}
html body #app .checkout-page-mobile .cargo-list--item_chip {
    color: #C8A951 !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 12px !important;
    padding: 4px 12px !important;
    font-size: 10px !important;
    letter-spacing: 1px !important;
}
html body #app .checkout-page-mobile .v-selection-control__input i { color: #C8A951 !important; }

/* 6. SİPARİŞ NOTU (Order Note) */
html body #app .checkout-page-mobile .order-note textarea {
    background: #0A0A0C !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    color: #C8A951 !important;
    border-radius: 12px !important;
    padding: 15px !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12px !important;
    width: 100% !important;
    outline: none !important;
    transition: all 0.3s ease !important;
}
html body #app .checkout-page-mobile .order-note textarea:focus {
    border-color: #C8A951 !important;
    box-shadow: 0 0 15px rgba(200, 169, 81, 0.2) !important;
}
html body #app .checkout-page-mobile .order-note textarea::placeholder {
    color: rgba(255, 255, 255, 0.3) !important;
}

/* 7. MOBİL EKRANIN ALTINA SABİTLENEN "GO TO PAYMENT" ÇUBUĞU */
/* Beyaz barı zifiri siyaha çeviriyoruz */
html body #app .checkout-page-mobile .mobile-order-summary {
    background: #0A0A0C !important;
    border-top: 1px solid rgba(200, 169, 81, 0.3) !important;
    padding: 15px 20px !important;
    z-index: 999 !important;
    box-shadow: 0 -10px 30px rgba(0,0,0,0.8) !important;
}

/* Fiyat ve Başlık */
html body #app .checkout-page-mobile .total-text {
    color: rgba(255, 255, 255, 0.5) !important;
    font-size: 10px !important;
    letter-spacing: 3px !important;
    text-transform: uppercase !important;
}
html body #app .checkout-page-mobile .price-text {
    color: #C8A951 !important;
    font-size: 18px !important;
    font-weight: 500 !important;
    letter-spacing: 1px !important;
}

/* Yukarı Ok İkonu (Detayları Göster) */
html body #app .checkout-page-mobile .trigger-btn i {
    color: #C8A951 !important;
}

/* Ödemeye Geç Butonu (VIP Altın Parlama) */
html body #app .checkout-page-mobile button.btn-success {
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.1) 0%, rgba(200, 169, 81, 0.25) 100%) !important;
    border: 1px solid #C8A951 !important;
    border-radius: 10px !important;
    height: 50px !important;
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    text-transform: uppercase !important;
    letter-spacing: 4px !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    width: 100% !important;
    margin-top: 15px !important;
    box-shadow: 0 4px 15px rgba(200, 169, 81, 0.1) !important;
}
/* =========================================================
   THE TUVA: MOBİL ÖDEME EKRANI VIP OPTİMİZASYON KATMANI
   (MASAÜSTÜ İLE BİREBİR AYNI LÜKS DETAYLAR)
   ========================================================= */

@media (max-width: 960px) {
    /* 1. MOBİL ZEMİN VE KUTU ÇERÇEVELERİ */
    html body #app .v-application, html body #app .checkout-page-mobile, html body #app .checkout-container, html body #app .v-main { background-color: #0A0A0C !important; background: #0A0A0C !important; color: #E8E8E8 !important; }
    html body #app .checkout-page-mobile form.form-adv .cc-input, html body #app .checkout-page-mobile form.form-adv .cc-input .v-input__control, html body #app .checkout-page-mobile form.form-adv .cc-input .v-field, html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__field, html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__input, html body #app .checkout-page-mobile form.form-adv .cc-input.v-theme--light, html body #app .checkout-page-mobile form.form-adv .v-field__overlay { background-color: #0A0A0C !important; background: #0A0A0C !important; box-shadow: none !important; border-radius: 12px !important; }
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field { border: 1px solid rgba(200, 169, 81, 0.4) !important; min-height: 55px !important; padding: 0 15px !important; margin-bottom: 15px !important; }
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__outline, html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__overlay, html body #app .checkout-page-mobile form.form-adv .cc-input label.v-label { display: none !important; background: transparent !important; }
    html body #app .checkout-page-mobile form.form-adv input.v-field__input { color: #C8A951 !important; -webkit-text-fill-color: #C8A951 !important; font-size: 14px !important; padding-top: 15px !important; background: transparent !important; }

    /* 2. HAYALET YAZILAR VE KUSURSUZ SIRALAMA (İSİM / KART NO) */
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__field::before { font-size: 9px !important; left: 15px !important; top: 0 !important; color: rgba(255, 255, 255, 0.4) !important; font-family: 'Montserrat', sans-serif !important; letter-spacing: 2px !important; text-transform: uppercase !important; position: absolute !important; display: flex !important; align-items: center !important; height: 100% !important; pointer-events: none !important; transition: all 0.4s ease !important;}
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field--active .v-field__field::before, html body #app .checkout-page-mobile form.form-adv .cc-input .v-field--focused .v-field__field::before { top: -14px !important; font-size: 8px !important; color: #C8A951 !important; letter-spacing: 3px !important; height: auto !important; opacity: 0.9 !important;}

    /* Kutu Sıralaması (Masaüstüyle aynı mantık) */
    html body #app .checkout-page-mobile form.form-adv .title + .cc-input .v-field__field::before { content: "NAME AND SURNAME ON THE CARD" !important; }
    html body #app .checkout-page-mobile form.form-adv .title + .cc-input + .cc-input .v-field__field::before { content: "CARD NUMBER" !important; }
    html body #app .checkout-page-mobile form.form-adv .cc-input-row > div:nth-child(1) .v-field__field::before { content: "EXPIRATION DATE" !important; }
    html body #app .checkout-page-mobile form.form-adv .cc-input-row > div:nth-child(2) .v-field__field::before { content: "CVV" !important; }
    
    html body #app .checkout-page-mobile form.form-adv .cc-input-row { display: flex !important; flex-direction: row !important; gap: 10px !important; }
    html body #app .checkout-page-mobile form.form-adv .cc-input-row .cc-input { width: 50% !important; flex: 1 !important; margin-bottom: 0 !important; }

    /* 3. MAVİ CHECKBOX YAZILARINI THE TUVA ALTINI YAPMA */
    html body #app .checkout-page-mobile .pay-new-credit-card .description, html body #app .checkout-page-mobile .pay-new-credit-card .description div, html body #app .checkout-page-mobile .new-card-register-form .description, html body #app .checkout-page-mobile .new-card-register-form .description div { color: #C8A951 !important; font-family: 'Montserrat', sans-serif !important; font-size: 10px !important; letter-spacing: 3px !important; text-transform: uppercase !important; font-weight: 500 !important; text-shadow: 0 0 10px rgba(200, 169, 81, 0.2) !important; transition: all 0.4s ease !important; }
    html body #app .checkout-page-mobile .pay-new-credit-card label.chekbox-mod:hover .description div, html body #app .checkout-page-mobile .new-card-register-form label.chekbox-mod:hover .description div { color: #fff !important; letter-spacing: 4px !important; }
    html body #app .checkout-page-mobile .chekbox-mod .checkmark { border: 1px solid rgba(200, 169, 81, 0.4) !important; background: transparent !important; border-radius: 4px !important; }
    html body #app .checkout-page-mobile .chekbox-mod input:checked ~ .checkmark { background: #C8A951 !important; border-color: #C8A951 !important; box-shadow: 0 0 15px rgba(200, 169, 81, 0.3) !important;}
    html body #app .checkout-page-mobile .chekbox-mod input:checked ~ .checkmark i { color: #0A0A0C !important; }

    /* 4. HATA MESAJLARI (PREMIUM UYARI ROZETLERİ) */
    html body #app .checkout-page-mobile form.form-adv .bg-error { display: none !important; }
    html body #app .checkout-page-mobile form.form-adv .v-messages__message { background: rgba(239, 68, 68, 0.08) !important; color: #ef4444 !important; border: 1px solid rgba(239, 68, 68, 0.2) !important; border-radius: 8px !important; padding: 8px 12px !important; font-family: 'Montserrat', sans-serif !important; font-size: 9px !important; font-weight: 500 !important; letter-spacing: 1.5px !important; display: block !important; width: 100% !important; box-sizing: border-box !important; margin-top: 8px !important; margin-bottom: 5px !important; text-align: center !important; box-shadow: 0 5px 15px rgba(239, 68, 68, 0.05) !important; }
    html body #app .checkout-page-mobile form.form-adv .v-field--error { border-color: rgba(239, 68, 68, 0.5) !important; box-shadow: 0 0 15px rgba(239, 68, 68, 0.1) !important; }
    html body #app .checkout-page-mobile form.form-adv .mdi-help-circle-outline { color: rgba(200, 169, 81, 0.5) !important; position: absolute !important; right: 15px !important; top: 50% !important; transform: translateY(-50%) !important; z-index: 15 !important; transition: color 0.3s ease !important; }
    html body #app .checkout-page-mobile form.form-adv .v-field--focused .mdi-help-circle-outline { color: #C8A951 !important; }

    /* 5. TAKSİT SEÇENEKLERİ VE ÖDEME KARTLARI (LÜKS DİZİLİM) */
    html body #app .checkout-page-mobile .installment-radio .v-selection-control-group, html body #app .checkout-page-mobile .payment-options-content .v-selection-control-group { display: flex !important; flex-direction: column !important; gap: 10px !important; padding: 0 !important; margin-top: 10px !important; }
    html body #app .checkout-page-mobile .installment-radio .v-radio, html body #app .checkout-page-mobile .payment-option-card { background: #0A0A0C !important; border: 1px solid rgba(255, 255, 255, 0.05) !important; border-radius: 12px !important; padding: 14px 15px !important; margin-bottom: 0 !important; width: 100% !important; box-sizing: border-box !important; transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1) !important; }
    html body #app .checkout-page-mobile .installment-radio .v-selection-control--dirty, html body #app .checkout-page-mobile .payment-option-card.active { border-color: #C8A951 !important; background: rgba(200, 169, 81, 0.05) !important; box-shadow: 0 5px 20px rgba(200, 169, 81, 0.15) !important; }
    html body #app .checkout-page-mobile .installment-radio-item { display: flex !important; justify-content: space-between !important; align-items: center !important; width: 100% !important; font-size: 11px !important; }
    html body #app .checkout-page-mobile .installment-radio-item > div:first-child { color: rgba(255, 255, 255, 0.7) !important; font-size: 11px !important; font-weight: 300 !important; letter-spacing: 0.5px !important; transition: all 0.3s ease !important; }
    html body #app .checkout-page-mobile .installment-radio .v-selection-control--dirty .installment-radio-item > div:first-child { color: #C8A951 !important; font-weight: 500 !important; }
    html body #app .checkout-page-mobile .installment-radio-item > div:last-child { color: rgba(255, 255, 255, 0.4) !important; font-size: 9px !important; letter-spacing: 1px !important; text-transform: uppercase !important; }
    html body #app .checkout-page-mobile .installment-radio .v-selection-control--dirty .installment-radio-item > div:last-child { color: rgba(200, 169, 81, 0.8) !important; }
    html body #app .checkout-page-mobile .installment-radio .v-selection-control__wrapper i { color: rgba(255, 255, 255, 0.2) !important; transition: color 0.3s ease !important; }
    html body #app .checkout-page-mobile .installment-radio .v-selection-control--dirty .v-selection-control__wrapper i { color: #C8A951 !important; }
    html body #app .checkout-page-mobile .installment-radio .v-label { flex: 1 !important; opacity: 1 !important; }

    /* 6. "theTUVA SECURE PAYMENT" MOBİL MÜHRÜ */
    html body #app .checkout-page-mobile .pay-new-credit-card img.paycell-logo { display: none !important; }
    html body #app .checkout-page-mobile .pay-new-credit-card > div > div.mb-4 { position: relative !important; text-align: center !important; margin-top: 25px !important; margin-bottom: 25px !important; }
    html body #app .checkout-page-mobile .pay-new-credit-card > div > div.mb-4::before { content: "theTUVA SECURE PAYMENT" !important; display: block !important; color: #C8A951 !important; font-family: 'Montserrat', sans-serif !important; font-size: 14px !important; font-weight: 300 !important; letter-spacing: 4px !important; margin-bottom: 12px !important; text-shadow: 0 2px 10px rgba(200, 169, 81, 0.2) !important; }
    html body #app .checkout-page-mobile .pay-new-credit-card > div > div.mb-4 div { color: rgba(255, 255, 255, 0.3) !important; font-size: 9px !important; line-height: 1.6 !important; text-align: center !important; }
    html body #app .checkout-page-mobile form.form-adv .title { font-size: 12px !important; letter-spacing: 3px !important; color: #C8A951 !important; font-family: 'Montserrat', sans-serif !important; font-weight: 400 !important; text-transform: uppercase !important; text-align: center !important; border-bottom: 1px solid rgba(200, 169, 81, 0.2) !important; padding-bottom: 12px !important; margin-bottom: 20px !important; display: block !important;}

    /* 7. DİĞER KÜÇÜK MOBİL DÜZENLEMELER */
    html body #app .checkout-page-mobile .step-box--header h2, html body #app .checkout-page-mobile h3.info-box-title, html body #app .checkout-page-mobile .order-note-title { color: #C8A951 !important; font-family: 'Montserrat', sans-serif !important; font-size: 13px !important; font-weight: 400 !important; letter-spacing: 5px !important; text-transform: uppercase !important; border-bottom: 1px solid rgba(200, 169, 81, 0.2) !important; padding-bottom: 12px !important; margin-bottom: 20px !important; background: transparent !important; }
    html body #app .checkout-page-mobile .step-box.disabled { opacity: 0.3 !important; pointer-events: none !important; }
    html body #app .checkout-page-mobile button.add-new-address-button { background: transparent !important; border: 1px dashed rgba(200, 169, 81, 0.4) !important; border-radius: 12px !important; height: 50px !important; color: #C8A951 !important; font-family: 'Montserrat', sans-serif !important; font-size: 11px !important; letter-spacing: 3px !important; text-transform: uppercase !important; margin-bottom: 20px !important; }
    html body #app .checkout-page-mobile button.add-new-address-button i { color: #C8A951 !important; }
    html body #app .checkout-page-mobile button.add-new-address-button .v-btn__overlay { display: none !important; }
    html body #app .checkout-page-mobile button.address-radio-item-edit { border: 1px solid rgba(200, 169, 81, 0.5) !important; border-radius: 20px !important; background: transparent !important; color: #C8A951 !important; font-size: 10px !important; letter-spacing: 2px !important; height: 30px !important; padding: 0 12px !important; box-shadow: none !important; }
    html body #app .checkout-page-mobile .delivery-address { background: #0A0A0C !important; border: 1px solid rgba(200, 169, 81, 0.4) !important; border-radius: 12px !important; padding: 20px !important; margin-bottom: 20px !important; }
    html body #app .checkout-page-mobile .delivery-address-content-text { color: rgba(255, 255, 255, 0.7) !important; font-size: 11px !important; line-height: 1.6 !important; font-weight: 300 !important; }
    html body #app .checkout-page-mobile .mobile-checkmark { border: 1px solid #C8A951 !important; background: #C8A951 !important; border-radius: 50% !important; width: 18px !important; height: 18px !important; margin-right: 15px !important; position: relative !important; }
    html body #app .checkout-page-mobile .mobile-checkmark::after { content: ''; position: absolute; left: 5px; top: 2px; width: 5px; height: 10px; border: solid #0A0A0C; border-width: 0 2px 2px 0; transform: rotate(45deg); }
    html body #app .checkout-page-mobile .chekbox-mod { color: rgba(255, 255, 255, 0.5) !important; font-size: 11px !important; letter-spacing: 1px !important; }
    html body #app .checkout-page-mobile .cargo-list--item { background: #0A0A0C !important; border: 1px solid #C8A951 !important; border-radius: 12px !important; padding: 15px !important; margin-bottom: 15px !important; box-shadow: 0 0 20px rgba(200, 169, 81, 0.1) !important; }
    html body #app .checkout-page-mobile .cargo-list--item_name { color: #C8A951 !important; font-size: 12px !important; text-transform: uppercase !important; letter-spacing: 3px !important; margin-bottom: 5px !important; }
    html body #app .checkout-page-mobile .cargo-list--item_description { color: rgba(255, 255, 255, 0.4) !important; font-size: 9px !important; line-height: 1.5 !important; }
    html body #app .checkout-page-mobile .cargo-list--item_chip { color: #C8A951 !important; border: 1px solid rgba(200, 169, 81, 0.4) !important; border-radius: 12px !important; padding: 4px 12px !important; font-size: 10px !important; letter-spacing: 1px !important; }
    html body #app .checkout-page-mobile .v-selection-control__input i { color: #C8A951 !important; }
    html body #app .checkout-page-mobile .order-note textarea { background: #0A0A0C !important; border: 1px solid rgba(200, 169, 81, 0.4) !important; color: #C8A951 !important; border-radius: 12px !important; padding: 15px !important; font-family: 'Montserrat', sans-serif !important; font-size: 12px !important; width: 100% !important; outline: none !important; transition: all 0.3s ease !important; }
    html body #app .checkout-page-mobile .order-note textarea:focus { border-color: #C8A951 !important; box-shadow: 0 0 15px rgba(200, 169, 81, 0.2) !important; }
    html body #app .checkout-page-mobile .order-note textarea::placeholder { color: rgba(255, 255, 255, 0.3) !important; }

    /* 8. MOBİL EKRANIN ALTINA SABİTLENEN "GO TO PAYMENT" ÇUBUĞU */
    html body #app .checkout-page-mobile .mobile-order-summary { background: #0A0A0C !important; border-top: 1px solid rgba(200, 169, 81, 0.3) !important; padding: 15px 20px !important; z-index: 999 !important; box-shadow: 0 -10px 30px rgba(0,0,0,0.8) !important; }
    html body #app .checkout-page-mobile .total-text { color: rgba(255, 255, 255, 0.5) !important; font-size: 10px !important; letter-spacing: 3px !important; text-transform: uppercase !important; }
    html body #app .checkout-page-mobile .price-text { color: #C8A951 !important; font-size: 18px !important; font-weight: 500 !important; letter-spacing: 1px !important; }
    html body #app .checkout-page-mobile .trigger-btn i { color: #C8A951 !important; }
    html body #app .checkout-page-mobile button.btn-success { background: linear-gradient(135deg, rgba(200, 169, 81, 0.1) 0%, rgba(200, 169, 81, 0.25) 100%) !important; border: 1px solid #C8A951 !important; border-radius: 10px !important; height: 50px !important; color: #C8A951 !important; font-family: 'Montserrat', sans-serif !important; text-transform: uppercase !important; letter-spacing: 4px !important; font-size: 11px !important; font-weight: 600 !important; width: 100% !important; margin-top: 15px !important; box-shadow: 0 4px 15px rgba(200, 169, 81, 0.1) !important; }
    html body #app .checkout-page-mobile .payment-agreement-wrapper .checkmark { border: 1px solid rgba(200, 169, 81, 0.4) !important; background: transparent !important; border-radius: 4px !important; }
    html body #app .checkout-page-mobile .payment-agreement-wrapper input:checked ~ .checkmark { background: #C8A951 !important; border-color: #C8A951 !important; }
    html body #app .checkout-page-mobile .payment-agreement-wrapper input:checked ~ .checkmark i { color: #0A0A0C !important; }
    html body #app .checkout-page-mobile .payment-agreement-wrapper div { color: rgba(255, 255, 255, 0.5) !important; font-size: 10px !important; }
    html body #app .checkout-page-mobile .payment-agreement-wrapper a { color: #C8A951 !important; text-decoration: none !important;}
}
/* =========================================================
   THE TUVA: MOBİL ÖDEME EKRANI VIP OPTİMİZASYON KATMANI
   (MASAÜSTÜ İLE BİREBİR AYNI LÜKS DETAYLAR)
   ========================================================= */

@media (max-width: 960px) {
    /* 1. MOBİL ZEMİN VE KUTU ÇERÇEVELERİ (Kesin Beyazlık İptali) */
    html body #app .v-application, 
    html body #app .checkout-page-mobile, 
    html body #app .checkout-container, 
    html body #app .v-main { 
        background-color: #0A0A0C !important; 
        background: #0A0A0C !important; 
        color: #E8E8E8 !important; 
    }
    
    html body #app .checkout-page-mobile form.form-adv .cc-input, 
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-input__control, 
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field, 
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__field, 
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__input, 
    html body #app .checkout-page-mobile form.form-adv .cc-input.v-theme--light, 
    html body #app .checkout-page-mobile form.form-adv .v-field__overlay,
    html body #app .checkout-page-mobile form.form-adv .v-field--variant-solo { 
        background-color: transparent !important; 
        background: transparent !important; 
        box-shadow: none !important; 
        border-radius: 12px !important; 
    }
    
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field { 
        background-color: #0A0A0C !important; 
        background: #0A0A0C !important; 
        border: 1px solid rgba(200, 169, 81, 0.4) !important; 
        min-height: 55px !important; 
        padding: 0 15px !important; 
        margin-bottom: 15px !important; 
    }

    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__outline, 
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__outline *, 
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__overlay, 
    html body #app .checkout-page-mobile form.form-adv .cc-input label.v-label,
    html body #app .checkout-page-mobile form.form-adv .cc-input .textfield-label { 
        display: none !important; 
        background: transparent !important; 
        opacity: 0 !important;
        border: none !important;
    }

    html body #app .checkout-page-mobile form.form-adv input.v-field__input { 
        color: #C8A951 !important; 
        -webkit-text-fill-color: #C8A951 !important; 
        font-size: 14px !important; 
        padding-top: 15px !important; 
        background: transparent !important; 
        outline: none !important;
    }

    /* 2. HAYALET YAZILAR VE KUSURSUZ SIRALAMA (İSİM / KART NO) */
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__field::before { 
        font-size: 9px !important; 
        left: 15px !important; 
        top: 0 !important; 
        color: rgba(255, 255, 255, 0.4) !important; 
        font-family: 'Montserrat', sans-serif !important; 
        letter-spacing: 2px !important; 
        text-transform: uppercase !important; 
        position: absolute !important; 
        display: flex !important; 
        align-items: center !important; 
        height: 100% !important; 
        pointer-events: none !important; 
        transition: all 0.4s ease !important;
    }
    
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field--active .v-field__field::before, 
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field--focused .v-field__field::before { 
        top: -14px !important; 
        font-size: 8px !important; 
        color: #C8A951 !important; 
        letter-spacing: 3px !important; 
        height: auto !important; 
        opacity: 0.9 !important;
    }

    /* Kutu Sıralaması (Masaüstüyle aynı mantık, mobil seçicilerle) */
    html body #app .checkout-page-mobile form.form-adv .title + .cc-input .v-field__field::before { content: "NAME AND SURNAME ON THE CARD" !important; }
    html body #app .checkout-page-mobile form.form-adv .title + .cc-input + .cc-input .v-field__field::before { content: "CARD NUMBER" !important; }
    html body #app .checkout-page-mobile form.form-adv .cc-input-row > div:nth-child(1) .v-field__field::before { content: "EXPIRATION DATE" !important; }
    html body #app .checkout-page-mobile form.form-adv .cc-input-row > div:nth-child(2) .v-field__field::before { content: "CVV" !important; }
    
    html body #app .checkout-page-mobile form.form-adv .cc-input-row { display: flex !important; flex-direction: row !important; gap: 10px !important; }
    html body #app .checkout-page-mobile form.form-adv .cc-input-row .cc-input { width: 50% !important; flex: 1 !important; margin-bottom: 0 !important; }

    /* 3. MAVİ CHECKBOX YAZILARINI THE TUVA ALTINI YAPMA */
    html body #app .checkout-page-mobile .pay-new-credit-card .description, 
    html body #app .checkout-page-mobile .pay-new-credit-card .description div, 
    html body #app .checkout-page-mobile .new-card-register-form .description, 
    html body #app .checkout-page-mobile .new-card-register-form .description div { 
        color: #C8A951 !important; 
        font-family: 'Montserrat', sans-serif !important; 
        font-size: 10px !important; 
        letter-spacing: 3px !important; 
        text-transform: uppercase !important; 
        font-weight: 500 !important; 
        text-shadow: 0 0 10px rgba(200, 169, 81, 0.2) !important; 
        transition: all 0.4s ease !important; 
    }
    
    html body #app .checkout-page-mobile .pay-new-credit-card label.chekbox-mod:hover .description div, 
    html body #app .checkout-page-mobile .new-card-register-form label.chekbox-mod:hover .description div { 
        color: #fff !important; 
        letter-spacing: 4px !important; 
    }
    
    html body #app .checkout-page-mobile .chekbox-mod .checkmark { 
        border: 1px solid rgba(200, 169, 81, 0.4) !important; 
        background: transparent !important; 
        border-radius: 4px !important; 
    }
    
    html body #app .checkout-page-mobile .chekbox-mod input:checked ~ .checkmark { 
        background: #C8A951 !important; 
        border-color: #C8A951 !important; 
        box-shadow: 0 0 15px rgba(200, 169, 81, 0.3) !important;
    }
    
    html body #app .checkout-page-mobile .chekbox-mod input:checked ~ .checkmark i { 
        color: #0A0A0C !important; 
    }

    /* 4. HATA MESAJLARI (PREMIUM UYARI ROZETLERİ) */
    html body #app .checkout-page-mobile form.form-adv .bg-error { display: none !important; }
    html body #app .checkout-page-mobile form.form-adv .v-messages__message { 
        background: rgba(239, 68, 68, 0.08) !important; 
        color: #ef4444 !important; 
        border: 1px solid rgba(239, 68, 68, 0.2) !important; 
        border-radius: 8px !important; 
        padding: 8px 12px !important; 
        font-family: 'Montserrat', sans-serif !important; 
        font-size: 9px !important; 
        font-weight: 500 !important; 
        letter-spacing: 1.5px !important; 
        display: block !important; 
        width: 100% !important; 
        box-sizing: border-box !important; 
        margin-top: 8px !important; 
        margin-bottom: 5px !important; 
        text-align: center !important; 
        box-shadow: 0 5px 15px rgba(239, 68, 68, 0.05) !important; 
    }
    
    html body #app .checkout-page-mobile form.form-adv .v-field--error { 
        border-color: rgba(239, 68, 68, 0.5) !important; 
        box-shadow: 0 0 15px rgba(239, 68, 68, 0.1) !important; 
    }
    
    html body #app .checkout-page-mobile form.form-adv .mdi-help-circle-outline { 
        color: rgba(200, 169, 81, 0.5) !important; 
        position: absolute !important; 
        right: 15px !important; 
        top: 50% !important; 
        transform: translateY(-50%) !important; 
        z-index: 15 !important; 
        transition: color 0.3s ease !important; 
    }
    
    html body #app .checkout-page-mobile form.form-adv .v-field--focused .mdi-help-circle-outline { 
        color: #C8A951 !important; 
    }

    /* 5. TAKSİT SEÇENEKLERİ VE ÖDEME KARTLARI (LÜKS DİZİLİM) */
    html body #app .checkout-page-mobile .installment-radio .v-selection-control-group, 
    html body #app .checkout-page-mobile .payment-options-content .v-selection-control-group { 
        display: flex !important; 
        flex-direction: column !important; 
        gap: 10px !important; 
        padding: 0 !important; 
        margin-top: 10px !important; 
    }
    
    html body #app .checkout-page-mobile .installment-radio .v-radio, 
    html body #app .checkout-page-mobile .payment-option-card { 
        background: #0A0A0C !important; 
        border: 1px solid rgba(255, 255, 255, 0.05) !important; 
        border-radius: 12px !important; 
        padding: 14px 15px !important; 
        margin-bottom: 0 !important; 
        width: 100% !important; 
        box-sizing: border-box !important; 
        transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1) !important; 
    }
    
    html body #app .checkout-page-mobile .installment-radio .v-selection-control--dirty, 
    html body #app .checkout-page-mobile .payment-option-card.active { 
        border-color: #C8A951 !important; 
        background: rgba(200, 169, 81, 0.05) !important; 
        box-shadow: 0 5px 20px rgba(200, 169, 81, 0.15) !important; 
    }
    
    html body #app .checkout-page-mobile .installment-radio-item { 
        display: flex !important; 
        justify-content: space-between !important; 
        align-items: center !important; 
        width: 100% !important; 
        font-size: 11px !important; 
    }
    
    html body #app .checkout-page-mobile .installment-radio-item > div:first-child { 
        color: rgba(255, 255, 255, 0.7) !important; 
        font-size: 11px !important; 
        font-weight: 300 !important; 
        letter-spacing: 0.5px !important; 
        transition: all 0.3s ease !important; 
    }
    
    html body #app .checkout-page-mobile .installment-radio .v-selection-control--dirty .installment-radio-item > div:first-child { 
        color: #C8A951 !important; 
        font-weight: 500 !important; 
    }
    
    html body #app .checkout-page-mobile .installment-radio-item > div:last-child { 
        color: rgba(255, 255, 255, 0.4) !important; 
        font-size: 9px !important; 
        letter-spacing: 1px !important; 
        text-transform: uppercase !important; 
    }
    
    html body #app .checkout-page-mobile .installment-radio .v-selection-control--dirty .installment-radio-item > div:last-child { 
        color: rgba(200, 169, 81, 0.8) !important; 
    }
    
    html body #app .checkout-page-mobile .installment-radio .v-selection-control__wrapper i { 
        color: rgba(255, 255, 255, 0.2) !important; 
        transition: color 0.3s ease !important; 
    }
    
    html body #app .checkout-page-mobile .installment-radio .v-selection-control--dirty .v-selection-control__wrapper i { 
        color: #C8A951 !important; 
    }
    
    html body #app .checkout-page-mobile .installment-radio .v-label { 
        flex: 1 !important; 
        opacity: 1 !important; 
    }

    /* 6. "theTUVA SECURE PAYMENT" MOBİL MÜHRÜ */
    html body #app .checkout-page-mobile .pay-new-credit-card img.paycell-logo { display: none !important; }
    html body #app .checkout-page-mobile .pay-new-credit-card > div > div.mb-4 { position: relative !important; text-align: center !important; margin-top: 25px !important; margin-bottom: 25px !important; }
    html body #app .checkout-page-mobile .pay-new-credit-card > div > div.mb-4::before { content: "theTUVA SECURE PAYMENT" !important; display: block !important; color: #C8A951 !important; font-family: 'Montserrat', sans-serif !important; font-size: 14px !important; font-weight: 300 !important; letter-spacing: 4px !important; margin-bottom: 12px !important; text-shadow: 0 2px 10px rgba(200, 169, 81, 0.2) !important; }
    html body #app .checkout-page-mobile .pay-new-credit-card > div > div.mb-4 div { color: rgba(255, 255, 255, 0.3) !important; font-size: 9px !important; line-height: 1.6 !important; text-align: center !important; }
    html body #app .checkout-page-mobile form.form-adv .title { font-size: 12px !important; letter-spacing: 3px !important; color: #C8A951 !important; font-family: 'Montserrat', sans-serif !important; font-weight: 400 !important; text-transform: uppercase !important; text-align: center !important; border-bottom: 1px solid rgba(200, 169, 81, 0.2) !important; padding-bottom: 12px !important; margin-bottom: 20px !important; display: block !important;}

    /* 7. DİĞER KÜÇÜK MOBİL DÜZENLEMELER */
    html body #app .checkout-page-mobile .step-box--header h2, html body #app .checkout-page-mobile h3.info-box-title, html body #app .checkout-page-mobile .order-note-title { color: #C8A951 !important; font-family: 'Montserrat', sans-serif !important; font-size: 13px !important; font-weight: 400 !important; letter-spacing: 5px !important; text-transform: uppercase !important; border-bottom: 1px solid rgba(200, 169, 81, 0.2) !important; padding-bottom: 12px !important; margin-bottom: 20px !important; background: transparent !important; }
    html body #app .checkout-page-mobile .step-box.disabled { opacity: 0.3 !important; pointer-events: none !important; }
    html body #app .checkout-page-mobile button.add-new-address-button { background: transparent !important; border: 1px dashed rgba(200, 169, 81, 0.4) !important; border-radius: 12px !important; height: 50px !important; color: #C8A951 !important; font-family: 'Montserrat', sans-serif !important; font-size: 11px !important; letter-spacing: 3px !important; text-transform: uppercase !important; margin-bottom: 20px !important; }
    html body #app .checkout-page-mobile button.add-new-address-button i { color: #C8A951 !important; }
    html body #app .checkout-page-mobile button.add-new-address-button .v-btn__overlay { display: none !important; }
    html body #app .checkout-page-mobile button.address-radio-item-edit { border: 1px solid rgba(200, 169, 81, 0.5) !important; border-radius: 20px !important; background: transparent !important; color: #C8A951 !important; font-size: 10px !important; letter-spacing: 2px !important; height: 30px !important; padding: 0 12px !important; box-shadow: none !important; }
    html body #app .checkout-page-mobile .delivery-address { background: #0A0A0C !important; border: 1px solid rgba(200, 169, 81, 0.4) !important; border-radius: 12px !important; padding: 20px !important; margin-bottom: 20px !important; }
    html body #app .checkout-page-mobile .delivery-address-content-text { color: rgba(255, 255, 255, 0.7) !important; font-size: 11px !important; line-height: 1.6 !important; font-weight: 300 !important; }
    html body #app .checkout-page-mobile .mobile-checkmark { border: 1px solid #C8A951 !important; background: #C8A951 !important; border-radius: 50% !important; width: 18px !important; height: 18px !important; margin-right: 15px !important; position: relative !important; }
    html body #app .checkout-page-mobile .mobile-checkmark::after { content: ''; position: absolute; left: 5px; top: 2px; width: 5px; height: 10px; border: solid #0A0A0C; border-width: 0 2px 2px 0; transform: rotate(45deg); }
    html body #app .checkout-page-mobile .chekbox-mod { color: rgba(255, 255, 255, 0.5) !important; font-size: 11px !important; letter-spacing: 1px !important; }
    html body #app .checkout-page-mobile .cargo-list--item { background: #0A0A0C !important; border: 1px solid #C8A951 !important; border-radius: 12px !important; padding: 15px !important; margin-bottom: 15px !important; box-shadow: 0 0 20px rgba(200, 169, 81, 0.1) !important; }
    html body #app .checkout-page-mobile .cargo-list--item_name { color: #C8A951 !important; font-size: 12px !important; text-transform: uppercase !important; letter-spacing: 3px !important; margin-bottom: 5px !important; }
    html body #app .checkout-page-mobile .cargo-list--item_description { color: rgba(255, 255, 255, 0.4) !important; font-size: 9px !important; line-height: 1.5 !important; }
    html body #app .checkout-page-mobile .cargo-list--item_chip { color: #C8A951 !important; border: 1px solid rgba(200, 169, 81, 0.4) !important; border-radius: 12px !important; padding: 4px 12px !important; font-size: 10px !important; letter-spacing: 1px !important; }
    html body #app .checkout-page-mobile .v-selection-control__input i { color: #C8A951 !important; }
    html body #app .checkout-page-mobile .order-note textarea { background: #0A0A0C !important; border: 1px solid rgba(200, 169, 81, 0.4) !important; color: #C8A951 !important; border-radius: 12px !important; padding: 15px !important; font-family: 'Montserrat', sans-serif !important; font-size: 12px !important; width: 100% !important; outline: none !important; transition: all 0.3s ease !important; }
    html body #app .checkout-page-mobile .order-note textarea:focus { border-color: #C8A951 !important; box-shadow: 0 0 15px rgba(200, 169, 81, 0.2) !important; }
    html body #app .checkout-page-mobile .order-note textarea::placeholder { color: rgba(255, 255, 255, 0.3) !important; }

    /* 8. MOBİL EKRANIN ALTINA SABİTLENEN "GO TO PAYMENT" ÇUBUĞU */
    html body #app .checkout-page-mobile .mobile-order-summary { background: #0A0A0C !important; border-top: 1px solid rgba(200, 169, 81, 0.3) !important; padding: 15px 20px !important; z-index: 999 !important; box-shadow: 0 -10px 30px rgba(0,0,0,0.8) !important; }
    html body #app .checkout-page-mobile .total-text { color: rgba(255, 255, 255, 0.5) !important; font-size: 10px !important; letter-spacing: 3px !important; text-transform: uppercase !important; }
    html body #app .checkout-page-mobile .price-text { color: #C8A951 !important; font-size: 18px !important; font-weight: 500 !important; letter-spacing: 1px !important; }
    html body #app .checkout-page-mobile .trigger-btn i { color: #C8A951 !important; }
    html body #app .checkout-page-mobile button.btn-success { background: linear-gradient(135deg, rgba(200, 169, 81, 0.1) 0%, rgba(200, 169, 81, 0.25) 100%) !important; border: 1px solid #C8A951 !important; border-radius: 10px !important; height: 50px !important; color: #C8A951 !important; font-family: 'Montserrat', sans-serif !important; text-transform: uppercase !important; letter-spacing: 4px !important; font-size: 11px !important; font-weight: 600 !important; width: 100% !important; margin-top: 15px !important; box-shadow: 0 4px 15px rgba(200, 169, 81, 0.1) !important; }
    html body #app .checkout-page-mobile .payment-agreement-wrapper .checkmark { border: 1px solid rgba(200, 169, 81, 0.4) !important; background: transparent !important; border-radius: 4px !important; }
    html body #app .checkout-page-mobile .payment-agreement-wrapper input:checked ~ .checkmark { background: #C8A951 !important; border-color: #C8A951 !important; }
    html body #app .checkout-page-mobile .payment-agreement-wrapper input:checked ~ .checkmark i { color: #0A0A0C !important; }
    html body #app .checkout-page-mobile .payment-agreement-wrapper div { color: rgba(255, 255, 255, 0.5) !important; font-size: 10px !important; }
    html body #app .checkout-page-mobile .payment-agreement-wrapper a { color: #C8A951 !important; text-decoration: none !important;}
}
/* =========================================================
   MOBİL CHECKOUT - KUTU ÇÖKMESİ VE BEYAZ ÇİZGİ KESİN ÇÖZÜM
   ========================================================= */
@media (max-width: 960px) {
    /* 1. İNATÇI BEYAZ İÇ ÇİZGİYİ (VUETIFY OUTLINE) KÖKÜNDEN YOK ET */
    /* Çift çerçeve görünümü yaratan sistem iskeletini görünmez yapıyoruz */
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__outline,
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__outline *,
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__overlay {
        display: none !important;
        opacity: 0 !important;
        border: none !important;
        background: transparent !important;
    }

    /* 2. ANA KUTU ÇERÇEVESİ (SADECE SAF ALTIN ÇİZGİ KALSIN) */
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field {
        border: 1px solid rgba(200, 169, 81, 0.4) !important;
        background: #0A0A0C !important;
        border-radius: 12px !important;
        overflow: visible !important;
        width: 100% !important;
    }

    /* 3. EZİLEN (SÜZÜLEN) YAN YANA KUTULARI GENİŞLET (EXPIRATION & CVV) */
    /* Kutuların ince uzun bir sütuna dönüşmesini engelliyoruz */
    html body #app .checkout-page-mobile form.form-adv .cc-input-row {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        width: 100% !important;
        gap: 15px !important;
    }
    
    html body #app .checkout-page-mobile form.form-adv .cc-input-row .cc-input,
    html body #app .checkout-page-mobile form.form-adv .cc-input-row .form-field {
        flex: 1 1 50% !important; /* Kutuları tam olarak yarı yarıya paylaştırır */
        width: 100% !important;
        min-width: 0 !important; /* Flexbox'ın kutuyu içeriğe göre daraltmasını engeller */
        margin-bottom: 0 !important;
    }

    /* 4. İNCE UZUN HATA MESAJINI (KIRMIZI YAZI) DÜZELT */
    /* Hata yazılarının yukarıdan aşağı harf harf dizilmesini önleriz */
    html body #app .checkout-page-mobile form.form-adv .v-input__details {
        padding: 0 !important;
        width: 100% !important;
        min-width: 100% !important;
    }
    
    html body #app .checkout-page-mobile form.form-adv .v-messages__message {
        width: 100% !important;
        white-space: normal !important; /* Metnin kendi satırında akmasına izin verir */
        word-break: break-word !important;
        font-size: 8.5px !important;
        padding: 8px 5px !important;
        line-height: 1.4 !important;
    }

    /* 5. YÖNLENDİRME (HAYALET) YAZILARININ HİZASI */
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__field::before {
        left: 15px !important;
        white-space: nowrap !important; /* Başlıkların iki satıra düşmesini engeller */
        font-size: 8.5px !important; 
    }
}
/* =========================================================
       8. MOBİL TAMAMLANMIŞ ADIM (BEYAZ KUTU İMHASI VE LÜKS ÖZET)
       ========================================================= */
       
    /* Ana Kasa: Kesin Siyah Zemin ve Altın Çerçeve */
    html body #app .checkout-page-mobile .step-box.completed {
        background-color: #0A0A0C !important;
        background: #0A0A0C !important;
        border: 1px solid rgba(200, 169, 81, 0.4) !important;
        border-radius: 12px !important;
        padding: 20px !important;
        margin-bottom: 25px !important;
        box-shadow: 0 5px 20px rgba(0, 0, 0, 0.5) !important;
    }

    /* İÇTEKİ BEMBEYAZ KUTUYU (SELECTED-BOX) ŞEFFAFLAŞTIR */
    html body #app .checkout-page-mobile .step-box.completed .selected-box,
    html body #app .checkout-page-mobile .step-box.completed .info-block {
        background-color: transparent !important;
        background: transparent !important;
        box-shadow: none !important;
        border: none !important;
    }

    /* Üst Başlık Şeridi */
    html body #app .checkout-page-mobile .step-box.completed .step-box--header {
        border-bottom: 1px solid rgba(200, 169, 81, 0.15) !important;
        padding-bottom: 15px !important;
        margin-bottom: 15px !important;
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        background: transparent !important;
    }

    /* Başlık Yazısı (Delivery Address) ve Onay İkonu */
    html body #app .checkout-page-mobile .step-box.completed .step-box--header h2 {
        color: #C8A951 !important;
        font-family: 'Montserrat', sans-serif !important;
        font-size: 13px !important;
        font-weight: 500 !important;
        letter-spacing: 3px !important;
        margin: 0 !important;
        padding: 0 !important;
        border: none !important;
        display: flex !important;
        align-items: center !important;
        text-transform: uppercase !important;
    }
    
    html body #app .checkout-page-mobile .step-box.completed .step-box--header h2 .mdi-check-circle {
        color: #C8A951 !important;
        margin-left: 8px !important;
        font-size: 16px !important;
        filter: drop-shadow(0 0 5px rgba(200, 169, 81, 0.4)) !important;
    }

    /* EDIT (Değiştir) Hap Butonu */
    html body #app .checkout-page-mobile .step-box.completed .address-radio-item-edit {
        background: transparent !important;
        border: 1px solid rgba(200, 169, 81, 0.5) !important;
        border-radius: 20px !important;
        color: #C8A951 !important;
        height: 28px !important;
        padding: 0 12px !important;
        font-size: 9px !important;
        font-weight: 500 !important;
        letter-spacing: 2px !important;
        text-transform: uppercase !important;
        margin: 0 !important;
        box-shadow: none !important;
    }
    
    html body #app .checkout-page-mobile .step-box.completed .address-radio-item-edit .v-btn__overlay,
    html body #app .checkout-page-mobile .step-box.completed .address-radio-item-edit .v-btn__underlay {
        display: none !important;
    }

    /* Bilgi Blokları Hiyerarşisi (Sol Altın Çizgi) */
    html body #app .checkout-page-mobile .step-box.completed .info-block {
        border-left: 2px solid rgba(200, 169, 81, 0.4) !important;
        padding-left: 15px !important;
        margin-bottom: 15px !important;
    }

    /* Adres Başlığı ("ev", "iş" vb.) */
    html body #app .checkout-page-mobile .step-box.completed .info-block--title {
        color: #C8A951 !important;
        font-family: 'Montserrat', sans-serif !important;
        font-size: 10px !important;
        font-weight: 500 !important;
        letter-spacing: 3px !important;
        text-transform: uppercase !important;
        margin-bottom: 6px !important;
    }

    /* Adres Detayı ve Kargo Metni (Artık Siyah Zeminde Bembeyaz Okunacak) */
    html body #app .checkout-page-mobile .step-box.completed .address-full,
    html body #app .checkout-page-mobile .step-box.completed .info-block-cargo--subtitle {
        color: #E8E8E8 !important; /* Gümüşten daha net bir beyaz */
        font-family: 'Montserrat', sans-serif !important;
        font-size: 11px !important;
        line-height: 1.6 !important;
        letter-spacing: 0.5px !important;
        font-weight: 300 !important;
    }

    /* "Shipping Options" Ara Başlığı */
    html body #app .checkout-page-mobile .step-box.completed .cargo--title {
        color: rgba(255, 255, 255, 0.4) !important;
        font-family: 'Montserrat', sans-serif !important;
        font-size: 9px !important;
        font-weight: 400 !important;
        letter-spacing: 4px !important;
        text-transform: uppercase !important;
        margin-top: 25px !important;
        margin-bottom: 15px !important;
    }

    /* Fatura Adresi Checkbox'ı Düzenlemesi */
    html body #app .checkout-page-mobile .step-box.completed .chekbox-mod {
        color: rgba(255, 255, 255, 0.6) !important;
        font-size: 10px !important;
        letter-spacing: 1px !important;
        margin-top: 15px !important;
        display: flex !important;
        align-items: center !important;
    }
    html body #app .checkout-page-mobile .step-box.completed .chekbox-mod .checkmark {
        border: 1px solid rgba(200, 169, 81, 0.5) !important;
        background: transparent !important;
    }
    html body #app .checkout-page-mobile .step-box.completed .chekbox-mod input:checked ~ .checkmark {
        background: #C8A951 !important;
        border-color: #C8A951 !important;
    }
/* =========================================================
   THE TUVA: MOBİL ÖDEME EKRANI KESİN ÇÖZÜM 2.0
   (SIFIR BEYAZ ÇİZGİ, SAF ALTIN İKON VE YAZILAR)
   ========================================================= */

@media (max-width: 960px) {
    
    /* ---------------------------------------------------------
       1. İNATÇI BEYAZ ÇİZGİLERİ (OUTLINE) KÖKÜNDEN İMHA ET
       --------------------------------------------------------- */
    /* Vuetify'ın beyaz/gri çerçeve iskeletini ve arka planlarını tamamen siliyoruz */
    html body #app .checkout-page-mobile .v-field__outline, 
    html body #app .checkout-page-mobile .v-field__outline *,
    html body #app .checkout-page-mobile .v-field__overlay,
    html body #app .checkout-page-mobile .v-field--variant-solo,
    html body #app .checkout-page-mobile .v-input__control,
    html body #app .checkout-page-mobile .v-field { 
        border: none !important;
        background: transparent !important;
        background-color: transparent !important;
        box-shadow: none !important;
    }

    html body #app .checkout-page-mobile .v-field__outline {
        display: none !important;
        opacity: 0 !important;
        visibility: hidden !important;
    }

    /* Kendi theTUVA tasarımımızı (Siyah Zemin + Altın Çerçeve) Kutu Gövdesine Dayatıyoruz */
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field { 
        background-color: #0A0A0C !important; 
        background: #0A0A0C !important; 
        border: 1px solid rgba(200, 169, 81, 0.4) !important; 
        border-radius: 8px !important;
        min-height: 55px !important; 
        padding: 0 15px !important; 
        margin-bottom: 12px !important; 
    }
    
    /* Focus (Tıklanma) Durumunda Altın Parlaması */
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field--active,
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field--focused {
        border-color: #C8A951 !important;
        box-shadow: 0 5px 15px rgba(200, 169, 81, 0.15) !important;
    }

    /* Müşteri Yazısı (Sıvı Altın) */
    html body #app .checkout-page-mobile form.form-adv input.v-field__input { 
        color: #C8A951 !important; 
        -webkit-text-fill-color: #C8A951 !important; 
        font-family: 'Montserrat', sans-serif !important;
        font-size: 14px !important; 
        padding-top: 15px !important; 
        background: transparent !important; 
        outline: none !important;
    }

    /* ---------------------------------------------------------
       2. MAVİ İKONLARI VE YAZILARI "GOLD" YAPMA (SVG FİLTRESİ)
       --------------------------------------------------------- */
    /* SVG İkonlarındaki Laciverti (fill='#15284B') CSS Filtresiyle Altına Çevirme */
    html body #app .checkout-page-mobile .payment-option-icon {
        filter: invert(72%) sepia(18%) saturate(830%) hue-rotate(5deg) brightness(92%) contrast(87%) !important;
        opacity: 0.7 !important;
    }
    
    html body #app .checkout-page-mobile .payment-option-card.active .payment-option-icon,
    html body #app .checkout-page-mobile .v-radio:has(input:checked) .payment-option-icon {
        opacity: 1 !important;
    }

    /* Radyo Butonları, Tikler ve CVV İkonunu Saf Altın Yap */
    html body #app .checkout-page-mobile .v-selection-control__input i,
    html body #app .checkout-page-mobile .v-icon,
    html body #app .checkout-page-mobile form.form-adv .mdi-help-circle-outline { 
        color: #C8A951 !important; 
        opacity: 1 !important; 
    }

    /* Ödeme Seçeneği Başlıkları (Mobile Wallet vs.) Gold Yapma */
    html body #app .checkout-page-mobile .payment-option-card .v-label,
    html body #app .checkout-page-mobile .v-radio label.v-label {
        color: #C8A951 !important;
        font-family: 'Montserrat', sans-serif !important;
        font-size: 11px !important;
        font-weight: 400 !important;
        letter-spacing: 3px !important;
        text-transform: uppercase !important;
    }

    /* "Kayıtlı Kart", "Register Paycell" gibi mavi yazıları Gold yap */
    html body #app .checkout-page-mobile .pay-new-credit-card .description, 
    html body #app .checkout-page-mobile .pay-new-credit-card .description div, 
    html body #app .checkout-page-mobile .new-card-register-form .description, 
    html body #app .checkout-page-mobile .new-card-register-form .description div { 
        color: #C8A951 !important; 
        font-family: 'Montserrat', sans-serif !important; 
        font-size: 10px !important; 
        letter-spacing: 3px !important; 
        text-transform: uppercase !important; 
        font-weight: 500 !important; 
        text-shadow: 0 0 10px rgba(200, 169, 81, 0.2) !important; 
    }

    /* Checkbox Kutusu (Mavi tiki altın zeminle değiştir) */
    html body #app .checkout-page-mobile .chekbox-mod .checkmark { 
        border: 1px solid rgba(200, 169, 81, 0.5) !important; 
        background: transparent !important; 
        border-radius: 4px !important; 
    }
    html body #app .checkout-page-mobile .chekbox-mod input:checked ~ .checkmark { 
        background: #C8A951 !important; 
        border-color: #C8A951 !important; 
    }
    html body #app .checkout-page-mobile .chekbox-mod input:checked ~ .checkmark i { 
        color: #0A0A0C !important; /* Tik altın üzerinde siyah görünür */
    }

    /* ---------------------------------------------------------
       3. HAYALET YAZILAR VE KUTU SIRALAMASI
       --------------------------------------------------------- */
    /* Sistemin kendi etiketlerini (mavi/siyah olabilen) kapatıyoruz */
    html body #app .checkout-page-mobile form.form-adv .cc-input label.v-label,
    html body #app .checkout-page-mobile form.form-adv .cc-input .textfield-label,
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field-label--floating { 
        display: none !important; 
        opacity: 0 !important; 
        visibility: hidden !important;
    }

    /* Hayalet Yazılar (Placeholder) */
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__field::before { 
        font-size: 9px !important; 
        left: 15px !important; 
        top: 0 !important; 
        color: rgba(255, 255, 255, 0.4) !important; 
        font-family: 'Montserrat', sans-serif !important; 
        letter-spacing: 2px !important; 
        text-transform: uppercase !important; 
        position: absolute !important; 
        display: flex !important; 
        align-items: center !important; 
        height: 100% !important; 
        pointer-events: none !important; 
        transition: all 0.4s ease !important;
        z-index: 5 !important;
    }
    
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field--active .v-field__field::before, 
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field--focused .v-field__field::before { 
        top: -12px !important; 
        font-size: 8px !important; 
        color: #C8A951 !important; 
        letter-spacing: 3px !important; 
        height: auto !important; 
    }

    /* Kutu Sıralaması (İsim ve Kart No Doğru Sırayla) */
    html body #app .checkout-page-mobile form.form-adv .title + .cc-input .v-field__field::before { content: "NAME AND SURNAME ON THE CARD" !important; }
    html body #app .checkout-page-mobile form.form-adv .title + .cc-input + .cc-input .v-field__field::before { content: "CARD NUMBER" !important; }
    html body #app .checkout-page-mobile form.form-adv .cc-input-row > div:nth-child(1) .v-field__field::before { content: "EXPIRATION DATE" !important; }
    html body #app .checkout-page-mobile form.form-adv .cc-input-row > div:nth-child(2) .v-field__field::before { content: "CVV" !important; }
    
    /* Tarih ve CVV Mobilde Yan Yana Dursun */
    html body #app .checkout-page-mobile form.form-adv .cc-input-row { display: flex !important; flex-direction: row !important; gap: 10px !important; }
    html body #app .checkout-page-mobile form.form-adv .cc-input-row .cc-input { width: 50% !important; flex: 1 !important; margin-bottom: 0 !important; }

    /* ---------------------------------------------------------
       4. LOGO VE BAŞLIKLAR (theTUVA SECURE PAYMENT)
       --------------------------------------------------------- */
    html body #app .checkout-page-mobile .pay-new-credit-card img.paycell-logo { display: none !important; }
    html body #app .checkout-page-mobile .pay-new-credit-card > div > div.mb-4 { position: relative !important; text-align: center !important; margin-top: 25px !important; margin-bottom: 25px !important; }
    html body #app .checkout-page-mobile .pay-new-credit-card > div > div.mb-4::before { content: "theTUVA SECURE PAYMENT" !important; display: block !important; color: #C8A951 !important; font-family: 'Montserrat', sans-serif !important; font-size: 14px !important; font-weight: 300 !important; letter-spacing: 4px !important; margin-bottom: 12px !important; text-shadow: 0 2px 10px rgba(200, 169, 81, 0.2) !important; }
    html body #app .checkout-page-mobile .pay-new-credit-card > div > div.mb-4 div { color: rgba(255, 255, 255, 0.3) !important; font-size: 9px !important; line-height: 1.6 !important; text-align: center !important; }
    
    html body #app .checkout-page-mobile form.form-adv .title { font-size: 12px !important; letter-spacing: 3px !important; color: #C8A951 !important; font-family: 'Montserrat', sans-serif !important; font-weight: 400 !important; text-transform: uppercase !important; text-align: center !important; border-bottom: 1px solid rgba(200, 169, 81, 0.2) !important; padding-bottom: 12px !important; margin-bottom: 20px !important; display: block !important;}
}
/* =========================================================
   THE TUVA: KREDİ KARTI KUTULARI VE YAZI ONARIMI (WEB + MOBİL)
   ========================================================= */

/* 1. KUTU BOYUTLARINI BOZMADAN BEYAZ ÇİZGİLERİ ŞEFFAF YAP (İSKELETİ KORU) */
/* display:none KULLANMIYORUZ ki kutular çökmesin! Sadece görünmez yapıyoruz. */
html body #app .checkout-page form.form-adv .cc-input .v-field__outline,
html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__outline,
html body #app .checkout-page form.form-adv .cc-input .v-field__overlay,
html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__overlay {
    opacity: 0 !important;
    background: transparent !important;
    border: none !important;
}

/* 2. KENDİ SAF ALTIN ÇERÇEVEMİZİ (SİYAH ZEMİNLE) EKLİYORUZ */
html body #app .checkout-page form.form-adv .cc-input .v-field,
html body #app .checkout-page-mobile form.form-adv .cc-input .v-field,
html body #app .checkout-page form.form-adv .cc-input.v-theme--light,
html body #app .checkout-page-mobile form.form-adv .cc-input.v-theme--light {
    background-color: #0A0A0C !important;
    background: #0A0A0C !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 8px !important;
    box-shadow: none !important;
}

/* Odaklanınca Parlama */
html body #app .checkout-page form.form-adv .cc-input .v-field--active,
html body #app .checkout-page form.form-adv .cc-input .v-field--focused,
html body #app .checkout-page-mobile form.form-adv .cc-input .v-field--active,
html body #app .checkout-page-mobile form.form-adv .cc-input .v-field--focused {
    border-color: #C8A951 !important;
    box-shadow: 0 0 15px rgba(200, 169, 81, 0.2) !important;
}

/* 3. KAYBOLAN HAYALET YAZILARI GERİ GETİRME (KUSURSUZ ÇÖZÜM) */
/* Sistemin bozuk yazılarını kapat */
html body #app .checkout-page form.form-adv .cc-input label.v-label,
html body #app .checkout-page form.form-adv .cc-input .textfield-label,
html body #app .checkout-page-mobile form.form-adv .cc-input label.v-label,
html body #app .checkout-page-mobile form.form-adv .cc-input .textfield-label {
    display: none !important;
    opacity: 0 !important;
}

/* Kendi Lüks theTUVA Yazılarımızı Yerleştiriyoruz */
html body #app .checkout-page form.form-adv .cc-input .v-field__field::before,
html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__field::before {
    display: flex !important;
    align-items: center !important;
    position: absolute !important;
    left: 15px !important;
    height: 100% !important;
    color: rgba(255, 255, 255, 0.4) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    pointer-events: none !important;
    transition: all 0.3s ease !important;
    z-index: 5 !important;
    top: 0 !important;
    white-space: nowrap !important;
}

/* Tıklayınca Yukarı Kayan Altın Yazı */
html body #app .checkout-page form.form-adv .cc-input .v-field--active .v-field__field::before,
html body #app .checkout-page form.form-adv .cc-input .v-field--focused .v-field__field::before,
html body #app .checkout-page-mobile form.form-adv .cc-input .v-field--active .v-field__field::before,
html body #app .checkout-page-mobile form.form-adv .cc-input .v-field--focused .v-field__field::before {
    top: -12px !important;
    font-size: 9px !important;
    color: #C8A951 !important;
    letter-spacing: 3px !important;
    height: auto !important;
}

/* Yazı Sıralaması Eşleştirmesi */
html body #app .checkout-page form.form-adv > div:nth-child(2) .v-field__field::before,
html body #app .checkout-page-mobile form.form-adv > div:nth-child(2) .v-field__field::before { content: "NAME AND SURNAME ON THE CARD" !important; }

html body #app .checkout-page form.form-adv > div:nth-child(3) .v-field__field::before,
html body #app .checkout-page-mobile form.form-adv > div:nth-child(3) .v-field__field::before { content: "CARD NUMBER" !important; }

html body #app .checkout-page form.form-adv .cc-input-row > div:nth-child(1) .v-field__field::before,
html body #app .checkout-page-mobile form.form-adv .cc-input-row > div:nth-child(1) .v-field__field::before { content: "EXPIRATION DATE" !important; }

html body #app .checkout-page form.form-adv .cc-input-row > div:nth-child(2) .v-field__field::before,
html body #app .checkout-page-mobile form.form-adv .cc-input-row > div:nth-child(2) .v-field__field::before { content: "CVV" !important; }

/* 4. GİRİLEN RAKAMLAR VE MÜŞTERİ YAZISI (SIVI ALTIN) */
html body #app .checkout-page form.form-adv input.v-field__input,
html body #app .checkout-page-mobile form.form-adv input.v-field__input {
    color: #C8A951 !important;
    -webkit-text-fill-color: #C8A951 !important;
    background: transparent !important;
    font-size: 14px !important;
    padding-top: 15px !important;
    z-index: 10 !important;
}

/* 5. TÜM MAVİ İKONLARI VE METİNLERİ SAF ALTIN YAP */
html body #app .checkout-page-mobile .v-selection-control__input i,
html body #app .checkout-page-mobile .v-icon,
html body #app .checkout-page-mobile form.form-adv .mdi-help-circle-outline,
html body #app .checkout-page form.form-adv .mdi-help-circle-outline {
    color: #C8A951 !important;
    opacity: 1 !important;
}

html body #app .checkout-page-mobile .pay-new-credit-card .description,
html body #app .checkout-page-mobile .pay-new-credit-card .description div,
html body #app .checkout-page-mobile .new-card-register-form .description div {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
}

/* 6. EXPIRATION DATE VE CVV MOBİLDE YAN YANA BOZULMADAN DURSUN */
@media (max-width: 960px) {
    html body #app .checkout-page-mobile form.form-adv .cc-input-row {
        display: flex !important;
        flex-direction: row !important;
        gap: 15px !important;
    }
    html body #app .checkout-page-mobile form.form-adv .cc-input-row .cc-input {
        flex: 1 1 50% !important;
        margin-bottom: 0 !important;
    }
    /* Mobilde hayalet yazı boyutu bir tık ufak olsun ki sığsın */
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__field::before {
        font-size: 8.5px !important;
        left: 10px !important;
    }
}
/* =========================================================
   THE TUVA: MOBİL SON RÖTUŞLAR (BEYAZ ÇİZGİ VE MAVİ YAZI İMHASI)
   ========================================================= */

@media (max-width: 960px) {

    /* ---------------------------------------------------------
       1. KREDİ KARTI BEYAZ ÇİZGİLERİNİ (OUTLINE) YOK ET
       Kutu boyutunu (display) bozmadan, renkleri şeffaflaştırıyoruz.
       --------------------------------------------------------- */
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__outline,
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__outline::before,
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__outline::after,
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__outline *,
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__overlay {
        border-color: transparent !important;
        background-color: transparent !important;
        background: transparent !important;
        opacity: 0 !important;
        box-shadow: none !important;
    }

    /* Kendi Lüks Altın Çerçevemizi Kasaya Uyguluyoruz */
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field,
    html body #app .checkout-page-mobile form.form-adv .cc-input.v-theme--light {
        background-color: #0A0A0C !important;
        background: #0A0A0C !important;
        border: 1px solid rgba(200, 169, 81, 0.4) !important;
        border-radius: 8px !important;
        box-shadow: none !important;
    }

    /* Kutuya Tıklanınca Altın Işıltısı Artsın */
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field--active,
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field--focused {
        border-color: #C8A951 !important;
        box-shadow: 0 0 15px rgba(200, 169, 81, 0.2) !important;
    }

    /* ---------------------------------------------------------
       2. BANKA TRANSFERİ MAVİ YAZILARI ALTIN VE GÜMÜŞ YAP
       --------------------------------------------------------- */
    /* Ana Kasa (Siyah Zemin ve Sol Altın Çizgi) */
    html body #app .checkout-page-mobile .pay-transfer-selected-bank {
        background: #0A0A0C !important;
        border: 1px solid rgba(200, 169, 81, 0.3) !important;
        border-left: 3px solid #C8A951 !important;
        border-radius: 8px !important;
        padding: 15px !important;
        margin-top: 15px !important;
    }

    /* Genel Metin (Vakıfbank, IBAN vs. - Gümüş Rengi Olsun) */
    html body #app .checkout-page-mobile .pay-transfer-selected-bank-text,
    html body #app .checkout-page-mobile .pay-transfer-selected-bank-text span {
        color: #E8E8E8 !important; /* Mavi yerine lüks beyaz/gümüş */
        font-family: 'Montserrat', sans-serif !important;
        font-size: 11px !important;
        line-height: 1.6 !important;
        letter-spacing: 0.5px !important;
    }

    /* İlk Satır (Şirket Adı - THE TUVA ALTINI) */
    html body #app .checkout-page-mobile .pay-transfer-selected-bank-text:first-child {
        color: #C8A951 !important;
        font-size: 12px !important;
        font-weight: 500 !important;
        letter-spacing: 1px !important;
        margin-bottom: 8px !important;
    }

    /* Kopyala (Copy) Butonu ve İkonu (Altın Rengi) */
    html body #app .checkout-page-mobile .pay-transfer-selected-bank-text button.copy-button {
        background: rgba(200, 169, 81, 0.05) !important;
        border: 1px solid rgba(200, 169, 81, 0.3) !important;
        border-radius: 4px !important;
        margin-left: 10px !important;
    }
    
    html body #app .checkout-page-mobile .pay-transfer-selected-bank-text button.copy-button i,
    html body #app .checkout-page-mobile .pay-transfer-selected-bank-text button.copy-button span {
        color: #C8A951 !important;
        opacity: 1 !important;
    }
}
/* =========================================================
       THE TUVA: KREDİ KARTI KESİN VE TEK ODAKLI ÇÖZÜM
       (Sadece Çizgi Rengi ve CVV/Tarih Genişletmesi)
       ========================================================= */

    /* 1. BEYAZ ÇİZGİLERİ (OUTLINE) SİLMEDEN SAF ALTINA BOYA */
    /* Kutunun zeminini siyah, çizgilerini altın yapıyoruz */
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field {
        background-color: #0A0A0C !important;
    }

    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__outline,
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__outline::before,
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__outline::after,
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__outline * {
        color: rgba(200, 169, 81, 0.5) !important;
        border-color: rgba(200, 169, 81, 0.5) !important;
        opacity: 1 !important;
    }

    /* Kutuya Tıklanınca Çizgiler Parlak Altın Olsun */
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field--focused .v-field__outline,
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field--focused .v-field__outline * {
        color: #C8A951 !important;
        border-color: #C8A951 !important;
    }

    /* 2. TARİH VE CVV KUTULARINI YATAYDA BÜYÜT VE ÇAKIŞMAYI ÖNLE */
    html body #app .checkout-page-mobile form.form-adv .cc-input-row {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        width: 100% !important;
        gap: 15px !important; /* İki kutu arasına ferah bir boşluk */
    }

    html body #app .checkout-page-mobile form.form-adv .cc-input-row .cc-input,
    html body #app .checkout-page-mobile form.form-adv .cc-input-row .form-field {
        flex: 1 1 50% !important; /* Kutuları tam yarı yarıya eşit böler */
        min-width: 0 !important; /* İçindeki yazının taşıp kutuyu bozmasını / sıkıştırmasını kesin engeller */
        width: 100% !important;
        margin-bottom: 0 !important;
    }

    /* CVV Soru İşareti İkonunu da Altın Yapıyoruz */
    html body #app .checkout-page-mobile form.form-adv .mdi-help-circle-outline {
        color: rgba(200, 169, 81, 0.6) !important;
    }
/* =========================================================
       THE TUVA: KREDİ KARTI KUTULARI - DİNAMİK VE LÜKS TASARIM
       ========================================================= */

    /* 1. İNATÇI BEYAZ ÇİZGİLERİ (OUTLINE) TAMAMEN ŞEFFAF YAP */
    /* İskeleti çökertmeden sadece sınır renklerini siliyoruz */
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__outline,
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__outline::before,
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__outline::after,
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field__outline * {
        border-color: transparent !important;
        border-width: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }

    /* 2. KENDİ ALTIN ÇERÇEVEMİZ VE DİNAMİK HAREKET (LÜKS HİSSİYAT) */
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field {
        background-color: #0A0A0C !important;
        border: 1px solid rgba(200, 169, 81, 0.3) !important;
        transition: all 0.5s cubic-bezier(0.25, 0.8, 0.25, 1) !important; /* Akışkan, premium geçiş */
    }

    /* Kutuya Tıklanınca (Focus) Yükselme ve Altın Parlama Efekti */
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field--focused,
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field--active {
        border-color: #C8A951 !important;
        background-color: #0A0A0C !important;
        box-shadow: 0 10px 25px rgba(200, 169, 81, 0.15), inset 0 0 10px rgba(200, 169, 81, 0.05) !important;
        transform: translateY(-2px) !important; /* Dokunulduğunda zarifçe yukarı kalkar */
    }

    /* CVV İkonu ve Müşteri Yazılarının Altın Işıltısı */
    html body #app .checkout-page-mobile form.form-adv .mdi-help-circle-outline {
        color: rgba(200, 169, 81, 0.6) !important;
        transition: color 0.3s ease !important;
    }
    
    html body #app .checkout-page-mobile form.form-adv .cc-input .v-field--focused .mdi-help-circle-outline {
        color: #C8A951 !important;
    }
/* =========================================================
   THE TUVA: KREDİ KARTI FORMU NİHAİ VE KUSURSUZ TASARIM
   ========================================================= */

/* 1. VUETIFY'IN BEYAZ ÇİZGİLERİNİ VE ZEMİNİNİ KÖKTEN SIFIRLA */
/* Kutuların içindeki beyazlığı ve sınırları tamamen şeffaf yapıyoruz */
html body #app form.form-adv .cc-input {
    --v-field-border-width: 0px !important;
    --v-field-border-opacity: 0 !important;
    --v-border-color: transparent !important;
}

html body #app form.form-adv .cc-input .v-field__outline,
html body #app form.form-adv .cc-input .v-field__overlay,
html body #app form.form-adv .cc-input .v-field::before,
html body #app form.form-adv .cc-input .v-field::after {
    opacity: 0 !important;
    visibility: hidden !important;
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
}

/* 2. THE TUVA LÜKS KUTU TASARIMI (SİYAH VE ALTIN) */
/* Kutulara geniş, tıklanabilir premium bir zemin veriyoruz */
html body #app form.form-adv .cc-input .v-field,
html body #app form.form-adv .cc-input.v-theme--light .v-field {
    background-color: #0A0A0C !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 8px !important;
    min-height: 56px !important; /* Kutular asla ezilmez, ferah durur */
    box-shadow: none !important;
    transition: all 0.3s ease !important;
    overflow: hidden !important; /* Dışarı sızan beyazlıkları keser */
}

/* Kutuya Tıklanınca Altın Işıltısı */
html body #app form.form-adv .cc-input .v-field.v-field--focused,
html body #app form.form-adv .cc-input .v-field.v-field--active {
    border-color: #C8A951 !important;
    box-shadow: 0 0 15px rgba(200, 169, 81, 0.15) !important;
}

/* 3. MÜŞTERİ YAZILARI VE RAKAMLAR (SIVI ALTIN) */
html body #app form.form-adv .cc-input input.v-field__input {
    color: #C8A951 !important;
    -webkit-text-fill-color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 15px !important;
    letter-spacing: 2px !important;
    padding-top: 15px !important;
    outline: none !important;
    background: transparent !important;
}

/* 4. SİSTEM BAŞLIKLARI (Name on Card, CVV vb. GÜMÜŞ RENGİ) */
html body #app form.form-adv .cc-input label.v-label {
    color: rgba(255, 255, 255, 0.5) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    opacity: 1 !important;
}

/* Kutu Tıklanınca Başlık Altın Olur */
html body #app form.form-adv .cc-input .v-field--focused label.v-label,
html body #app form.form-adv .cc-input .v-field--active label.v-label {
    color: #C8A951 !important;
    font-weight: 500 !important;
}

/* 5. CVV İKONUNU ALTIN YAP VE HİZALA */
html body #app form.form-adv .mdi-help-circle-outline {
    color: rgba(200, 169, 81, 0.6) !important;
    opacity: 1 !important;
}
html body #app form.form-adv .cc-input .v-field--focused .mdi-help-circle-outline {
    color: #C8A951 !important;
}

/* =========================================================
   6. MOBİL İÇİN YATAY (CVV VE TARİH) KUSURSUZ YERLEŞİM
   ========================================================= */
@media (max-width: 960px) {
    html body #app form.form-adv .cc-input-row {
        display: flex !important;
        flex-direction: row !important;
        gap: 15px !important;
        width: 100% !important;
    }
    
    html body #app form.form-adv .cc-input-row .form-field {
        flex: 1 !important;
        width: 100% !important;
        margin-bottom: 0 !important;
    }
}
/* =========================================================
   THE TUVA: KREDİ KARTI - İNATÇI BEYAZ ÇİZGİLERİ TAMAMEN ŞEFFAF YAPMA
   (Kutu İskeletini ve Boyutları Asla Bozmaz)
   ========================================================= */

/* 1. VUETIFY CSS DEĞİŞKENLERİNİ SIFIRLAMA */
html body #app form.form-adv .cc-input .v-field,
html body #app form.form-adv .cc-input.v-theme--light {
    --v-field-border-width: 0px !important;
    --v-field-border-opacity: 0 !important;
    --v-border-color: transparent !important;
    --v-border-opacity: 0 !important;
    box-shadow: none !important;
    outline: none !important;
}

/* 2. TÜM ÇİZGİ, ÇERÇEVE VE GÖLGE KATMANLARINI ŞEFFAFLAŞTIRMA */
html body #app form.form-adv .cc-input .v-field__outline,
html body #app form.form-adv .cc-input .v-field__outline::before,
html body #app form.form-adv .cc-input .v-field__outline::after,
html body #app form.form-adv .cc-input .v-field__outline *,
html body #app form.form-adv .cc-input .v-field__overlay,
html body #app form.form-adv .cc-input .v-field__overlay::before,
html body #app form.form-adv .cc-input .v-field__overlay::after,
html body #app form.form-adv .cc-input .v-field::before,
html body #app form.form-adv .cc-input .v-field::after {
    border: none !important;
    border-color: transparent !important;
    background: transparent !important;
    background-color: transparent !important;
    box-shadow: none !important;
    color: transparent !important;
    opacity: 0 !important;
}
/* =========================================================
   THE TUVA: DOĞRUDAN INPUT (YAZI ALANI) BEYAZ ÇİZGİ İMHASI
   ========================================================= */

/* 1. GÖSTERDİĞİNİZ INPUT ETİKETİNİ TAMAMEN ÇIPLAK BIRAKIYORUZ */
html body #app form.form-adv .cc-input input.v-field__input {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
    -webkit-appearance: none !important; /* iOS/Safari varsayılan form çizgilerini yok eder */
    -moz-appearance: none !important;
    appearance: none !important;
}

/* 2. KUTUYA TIKLANDIĞINDA (FOCUS) ÇIKAN İNATÇI ÇİZGİLERİ SİLİYORUZ */
html body #app form.form-adv .cc-input input.v-field__input:focus,
html body #app form.form-adv .cc-input input.v-field__input:active,
html body #app form.form-adv .cc-input input.v-field__input:focus-visible {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
}

/* 3. INPUT'U SARAN İÇ HÜCREYİ (FIELD) TEMİZLİYORUZ */
html body #app form.form-adv .cc-input .v-field__field {
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    background: transparent !important;
}

/* Mobil Tıklama Efektini (Mavi/Beyaz parlama) Şeffaflaştır */
html body #app form.form-adv .cc-input input.v-field__input {
    -webkit-tap-highlight-color: transparent !important;
}
/* =========================================================
   THE TUVA: ANA ÖDEME PANELİ (DIŞ ÇERÇEVE VE ZEMİN DÜZELTMESİ)
   ========================================================= */

/* 1. ANA PANEL (PAYMENT TYPES) DIŞ KUTUSUNU SİYAH VE GOLD YAP */
html body #app .checkout-page .step-box,
html body #app .checkout-page-mobile .step-box {
    background-color: #0A0A0C !important;
    border: 1px solid rgba(200, 169, 81, 0.5) !important;
    border-radius: 12px !important;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5) !important; /* Elit bir derinlik katar */
    overflow: hidden !important; /* Dışarı taşan beyazlıkları traşlar */
}

/* 2. BAŞLIK ("Payment Types") ALTINDAKİ AYIRICI ÇİZGİYİ SOLUK GOLD YAP */
html body #app .checkout-page .step-box .step-box--header,
html body #app .checkout-page-mobile .step-box .step-box--header {
    border-bottom: 1px solid rgba(200, 169, 81, 0.2) !important;
    background-color: transparent !important;
}

/* 3. PANELİN İÇİNE SIZABİLECEK BEYAZ ZEMİNLERİ KÖKTEN ŞEFFAFLAŞTIR */
html body #app .checkout-page .step-box .step-box--inner,
html body #app .checkout-page-mobile .step-box .step-box--inner,
html body #app .checkout-page .payment-options,
html body #app .checkout-page-mobile .payment-options {
    background-color: transparent !important;
    background: transparent !important;
}
/* =========================================================
   THE TUVA: BANKA SEÇİM MENÜSÜ VE KOPYALA BUTONU REVİZYONU
   ========================================================= */

/* 1. BANKA SEÇİM AÇILIR MENÜSÜ (Vakıf Bank vs.) LÜKS KUTU TASARIMI */
html body #app .checkout-page .v-select .v-field,
html body #app .checkout-page-mobile .v-select .v-field {
    background-color: #0A0A0C !important;
    background: #0A0A0C !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    min-height: 55px !important;
}

/* Seçim Kutusundaki İnatçı Beyaz İskeleti Siliyoruz */
html body #app .checkout-page .v-select .v-field__outline,
html body #app .checkout-page-mobile .v-select .v-field__outline {
    opacity: 0 !important;
    display: none !important;
}

/* Seçili Banka Yazısı (Sıvı Altın) */
html body #app .checkout-page .v-select__selection-text,
html body #app .checkout-page-mobile .v-select__selection-text {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 14px !important;
    letter-spacing: 2px !important;
    font-weight: 500 !important;
    text-transform: uppercase !important;
}

/* Menü Aşağı Ok İkonunu Altın Yapma */
html body #app .checkout-page .v-select .v-field__append-inner i,
html body #app .checkout-page-mobile .v-select .v-field__append-inner i {
    color: #C8A951 !important;
    opacity: 1 !important;
}


/* 2. KOPYALA (COPY) BUTONU: GENİŞLETİLMİŞ, YAZILI VE PREMIUM */
/* Butonun sadece ikon boyutunda kalmasını engelleyip, dikdörtgen elit bir butona çeviriyoruz */
html body #app .checkout-page .pay-transfer-selected-bank .copy-button,
html body #app .checkout-page-mobile .pay-transfer-selected-bank .copy-button {
    width: auto !important; 
    padding: 0 12px !important;
    height: 28px !important;
    background: rgba(200, 169, 81, 0.1) !important;
    border: 1px solid rgba(200, 169, 81, 0.5) !important;
    border-radius: 6px !important;
    transition: all 0.3s ease !important;
    vertical-align: middle !important;
}

/* CSS Sihri: HTML'de olmamasına rağmen ikonun yanına "COPY" kelimesini ekliyoruz */
html body #app .checkout-page .pay-transfer-selected-bank .copy-button .v-btn__content::after,
html body #app .checkout-page-mobile .pay-transfer-selected-bank .copy-button .v-btn__content::after {
    content: "COPY" !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 9px !important;
    letter-spacing: 2px !important;
    color: #C8A951 !important;
    margin-left: 6px !important;
    font-weight: 600 !important;
    transition: all 0.3s ease !important;
}

/* İkonun Kendisi */
html body #app .checkout-page .pay-transfer-selected-bank .copy-button i,
html body #app .checkout-page-mobile .pay-transfer-selected-bank .copy-button i {
    color: #C8A951 !important;
    font-size: 13px !important;
    transition: all 0.3s ease !important;
}

/* Tıklanınca / Üzerine Gelinince Altın Parlama Efekti */
html body #app .checkout-page .pay-transfer-selected-bank .copy-button:hover,
html body #app .checkout-page-mobile .pay-transfer-selected-bank .copy-button:hover,
html body #app .checkout-page .pay-transfer-selected-bank .copy-button:active,
html body #app .checkout-page-mobile .pay-transfer-selected-bank .copy-button:active {
    background: #C8A951 !important;
    box-shadow: 0 0 10px rgba(200, 169, 81, 0.3) !important;
}

/* Butonun içi altın olunca yazılar ve ikon siyah (Zıtlık) olsun ki okunsun */
html body #app .checkout-page .pay-transfer-selected-bank .copy-button:hover .v-btn__content::after,
html body #app .checkout-page-mobile .pay-transfer-selected-bank .copy-button:hover .v-btn__content::after,
html body #app .checkout-page .pay-transfer-selected-bank .copy-button:hover i,
html body #app .checkout-page-mobile .pay-transfer-selected-bank .copy-button:hover i,
html body #app .checkout-page .pay-transfer-selected-bank .copy-button:active .v-btn__content::after,
html body #app .checkout-page-mobile .pay-transfer-selected-bank .copy-button:active .v-btn__content::after,
html body #app .checkout-page .pay-transfer-selected-bank .copy-button:active i,
html body #app .checkout-page-mobile .pay-transfer-selected-bank .copy-button:active i {
    color: #0A0A0C !important;
}
/* ---------------------------------------------------------
   2. BANKA SEÇİM KUTUSUNU (SELECT) SİYAH VE LÜKS YAP
   --------------------------------------------------------- */
html body #app .pay-transfer-selected-bank .v-select .v-field,
html body #app .checkout-page-mobile .v-select .v-field {
    background-color: #0A0A0C !important;
    background: #0A0A0C !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 8px !important;
}

html body #app .pay-transfer-selected-bank .v-select__selection-text,
html body #app .checkout-page-mobile .v-select__selection-text {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    letter-spacing: 2px !important;
}

html body #app .pay-transfer-selected-bank .v-select .v-field__outline,
html body #app .checkout-page-mobile .v-select .v-field__outline {
    display: none !important; /* Seçim kutusundaki beyaz çizgiyi imha et */
}


/* ---------------------------------------------------------
   3. KOPYALA BUTONUNA "COPY" METNİ VE TIKLAMA ANİMASYONU
   --------------------------------------------------------- */
/* Butonu yazının sığacağı kadar genişletiyoruz */
html body #app .pay-transfer-selected-bank .copy-button,
html body #app .checkout-page-mobile .pay-transfer-selected-bank .copy-button {
    width: 75px !important; 
    border-radius: 6px !important;
    background: rgba(200, 169, 81, 0.08) !important;
    border: 1px solid rgba(200, 169, 81, 0.3) !important;
    justify-content: center !important;
}

/* HTML'de olmamasına rağmen CSS ile ikonun yanına "COPY" ekliyoruz */
html body #app .pay-transfer-selected-bank .copy-button .v-btn__content::after,
html body #app .checkout-page-mobile .pay-transfer-selected-bank .copy-button .v-btn__content::after {
    content: "COPY" !important;
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 10px !important;
    font-weight: 600 !important;
    letter-spacing: 2px !important;
    margin-left: 6px !important;
}

/* KULLANICI TIKLADIĞINDA (ACTIVE) "COPIED" YAZACAK */
html body #app .pay-transfer-selected-bank .copy-button:active .v-btn__content::after,
html body #app .checkout-page-mobile .pay-transfer-selected-bank .copy-button:active .v-btn__content::after {
    content: "COPIED" !important;
    color: #0A0A0C !important; /* Altın zemin üzerinde siyah yazı */
}

html body #app .pay-transfer-selected-bank .copy-button:active,
html body #app .checkout-page-mobile .pay-transfer-selected-bank .copy-button:active {
    background: #C8A951 !important;
    border-color: #C8A951 !important;
}

/* Tıklanınca ikon da siyah olsun ki okunabilsin */
html body #app .pay-transfer-selected-bank .copy-button:active i,
html body #app .checkout-page-mobile .pay-transfer-selected-bank .copy-button:active i {
    color: #0A0A0C !important;
}
/* =========================================================
   THE TUVA: TESLİMAT ADRESİ FORMU - LÜKS VE KUSURSUZ YAPI
   ========================================================= */

@media (max-width: 960px) {

    /* 1. KUTU (INPUT) İSKELETİ: SİYAH ZEMİN VE ALTIN ÇERÇEVE */
    html body #app .checkout-page-mobile .address-inline-form .v-field,
    html body #app .checkout-page-mobile .input-wrapper .v-field {
        background-color: #0A0A0C !important;
        border: 1px solid rgba(200, 169, 81, 0.4) !important;
        border-radius: 8px !important;
        min-height: 56px !important; /* Kutuları büyük ve ferah yapar */
        box-shadow: none !important;
        margin-bottom: 10px !important;
    }

    /* Kutuya Tıklayınca Parlama */
    html body #app .checkout-page-mobile .address-inline-form .v-field--focused,
    html body #app .checkout-page-mobile .address-inline-form .v-field--active,
    html body #app .checkout-page-mobile .input-wrapper .v-field--focused,
    html body #app .checkout-page-mobile .input-wrapper .v-field--active {
        border-color: #C8A951 !important;
        box-shadow: 0 5px 15px rgba(200, 169, 81, 0.15) !important;
    }

    /* İnatçı Beyaz Çizgileri Görünmez Yapıyoruz (İskelet Çökmez) */
    html body #app .checkout-page-mobile .address-inline-form .v-field__outline,
    html body #app .checkout-page-mobile .input-wrapper .v-field__outline,
    html body #app .checkout-page-mobile .address-inline-form .v-field__overlay,
    html body #app .checkout-page-mobile .input-wrapper .v-field__overlay {
        opacity: 0 !important;
        visibility: hidden !important;
    }

    /* 2. ÇAKIŞAN YAZILARI ÇÖZME (EN ÖNEMLİ KISIM) */
    /* Müşterinin girdiği metin (Sıvı Altın) */
    html body #app .checkout-page-mobile .address-inline-form input.v-field__input,
    html body #app .checkout-page-mobile .input-wrapper input.v-field__input {
        color: #C8A951 !important;
        -webkit-text-fill-color: #C8A951 !important;
        font-family: 'Montserrat', sans-serif !important;
        font-size: 14px !important;
        padding-top: 18px !important; /* Yazıyı aşağı iter, başlıkla çakışmasını önler */
        z-index: 10 !important;
    }

    /* Sistemin Kendi Etiketleri (E-posta, Ad Soyad vb. - Gümüş) */
    html body #app .checkout-page-mobile .address-inline-form .v-label.v-field-label,
    html body #app .checkout-page-mobile .input-wrapper .v-label.v-field-label {
        color: rgba(255, 255, 255, 0.5) !important;
        font-family: 'Montserrat', sans-serif !important;
        font-size: 11px !important;
        letter-spacing: 1px !important;
        text-transform: uppercase !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        transition: all 0.3s ease !important;
        opacity: 1 !important;
    }

    /* Kutuya Tıklanınca Başlık Küçülüp YUKARI Çıkar (Altın Olur) */
    html body #app .checkout-page-mobile .address-inline-form .v-field--active .v-label.v-field-label,
    html body #app .checkout-page-mobile .address-inline-form .v-field--focused .v-label.v-field-label,
    html body #app .checkout-page-mobile .input-wrapper .v-field--active .v-label.v-field-label,
    html body #app .checkout-page-mobile .input-wrapper .v-field--focused .v-label.v-field-label {
        color: #C8A951 !important;
        font-size: 9px !important;
        transform: translateY(-20px) !important; /* Yazıdan tamamen kurtarır */
    }

    /* 3. TELEFON NUMARASI KUTUSU ÖZEL DÜZENLEMESİ */
    html body #app .checkout-page-mobile .vue-tel-input {
        background-color: #0A0A0C !important;
        border: 1px solid rgba(200, 169, 81, 0.4) !important;
        border-radius: 8px !important;
        min-height: 56px !important;
        margin-bottom: 10px !important;
    }
    html body #app .checkout-page-mobile .vti__input {
        background: transparent !important;
        color: #C8A951 !important;
        font-family: 'Montserrat', sans-serif !important;
    }
    html body #app .checkout-page-mobile .vti__dropdown-arrow { color: #C8A951 !important; }

    /* 4. AÇILIR MENÜ (SELECT) OKLARI */
    html body #app .checkout-page-mobile .address-inline-form .mdi-chevron-down {
        color: #C8A951 !important;
        opacity: 1 !important;
    }

    /* 5. FATURA TİPİ (BİREYSEL/KURUMSAL) SEÇİMİ */
    html body #app .checkout-page-mobile .bill-type-wrapper p.v-label {
        color: #C8A951 !important;
        font-weight: 500 !important;
        text-transform: uppercase !important;
        letter-spacing: 2px !important;
        font-size: 11px !important;
    }
    html body #app .checkout-page-mobile .bill-type-wrapper .v-selection-control__input i {
        color: #C8A951 !important;
    }
    html body #app .checkout-page-mobile .bill-type-wrapper .v-label--clickable {
        color: #E8E8E8 !important; /* Lüks Gümüş */
        font-size: 12px !important;
        letter-spacing: 1px !important;
    }

    /* 6. YEŞİL OLUŞTUR (CREATE) BUTONUNU ALTIN/SİYAH ZIRHINA SOKMA */
    html body #app .checkout-page-mobile button.address-form-submit {
        background: linear-gradient(135deg, rgba(200, 169, 81, 0.1) 0%, rgba(200, 169, 81, 0.3) 100%) !important;
        border: 1px solid #C8A951 !important;
        border-radius: 8px !important;
        height: 56px !important;
        box-shadow: 0 4px 15px rgba(200, 169, 81, 0.1) !important;
        margin-top: 10px !important;
    }
    html body #app .checkout-page-mobile button.address-form-submit .v-btn__content {
        color: #C8A951 !important;
        font-family: 'Montserrat', sans-serif !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        letter-spacing: 4px !important;
        text-transform: uppercase !important;
    }

    /* 7. HIZLI SATIN AL (BUY FAST) KUTUSU DÜZENLEMESİ */
    html body #app .checkout-page-mobile .buy-fast {
        background: rgba(200, 169, 81, 0.05) !important;
        border: 1px solid rgba(200, 169, 81, 0.2) !important;
        border-radius: 10px !important;
    }
    html body #app .checkout-page-mobile .buy-fast .title {
        color: #C8A951 !important;
        text-transform: uppercase !important;
        letter-spacing: 2px !important;
        font-size: 12px !important;
    }
    html body #app .checkout-page-mobile .buy-fast a {
        color: rgba(255, 255, 255, 0.6) !important;
    }

    /* 8. KIRMIZI HATA MESAJLARI ZARİFLEŞTİRME */
    html body #app .checkout-page-mobile .address-inline-form .v-field--error,
    html body #app .checkout-page-mobile .input-wrapper .v-field--error {
        border-color: rgba(239, 68, 68, 0.6) !important;
    }
    html body #app .checkout-page-mobile .address-inline-form .v-messages__message,
    html body #app .checkout-page-mobile .input-wrapper .v-messages__message {
        color: #ef4444 !important;
        padding-left: 5px !important;
        font-size: 10px !important;
        letter-spacing: 1px !important;
    }
}
/* =========================================================
   THE TUVA: METİN KAYBOLMASI ÇÖZÜMÜ VE FATURA TİPİ (BİREYSEL/KURUMSAL)
   ========================================================= */

/* ---------------------------------------------------------
   1. KAYBOLAN/ARKADA KALAN YAZILARI (INPUT) ÖNE ÇIKART VE HİZALA
   --------------------------------------------------------- */
/* İç iskeleti esnek yapıp yazıyı daima alt hizaya (görünür alana) çekiyoruz */
html body #app .checkout-page-mobile .address-inline-form .v-field__field,
html body #app .checkout-page-mobile .input-wrapper .v-field__field {
    display: flex !important;
    align-items: flex-end !important; /* Yazı her zaman görünür alt kısıma oturur */
    padding-bottom: 6px !important;
}

/* Müşterinin yazdığı alan */
html body #app .checkout-page-mobile .address-inline-form input.v-field__input,
html body #app .checkout-page-mobile .input-wrapper input.v-field__input {
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
    height: auto !important;
    min-height: unset !important;
    padding-top: 15px !important; 
    padding-bottom: 0 !important;
    color: #C8A951 !important;
    -webkit-text-fill-color: #C8A951 !important;
    z-index: 20 !important; /* Başlıkların üstünde/önünde kalmasını kesinleştirir */
}

/* Başlığın yukarı kayma mesafesini dengeliyoruz (Yazıyı ezmesin) */
html body #app .checkout-page-mobile .address-inline-form .v-field--active .v-label.v-field-label,
html body #app .checkout-page-mobile .address-inline-form .v-field--focused .v-label.v-field-label,
html body #app .checkout-page-mobile .input-wrapper .v-field--active .v-label.v-field-label,
html body #app .checkout-page-mobile .input-wrapper .v-field--focused .v-label.v-field-label {
    transform: translateY(-16px) !important;
}

/* ---------------------------------------------------------
   2. BİREYSEL / KURUMSAL FATURA ALANINI SİYAH-GOLD LÜKS TASARIMA ÇEVİR
   --------------------------------------------------------- */
/* Alanın genel beyaz/gri zeminini temizle */
html body #app .checkout-page-mobile .bill-type-wrapper,
html body #app .checkout-page-mobile .bill-type-wrapper .v-input__control,
html body #app .checkout-page-mobile .bill-type-wrapper .v-selection-control-group {
    background: transparent !important;
    background-color: transparent !important;
}

/* "Fatura Tipi" Ana Başlığı */
html body #app .checkout-page-mobile .bill-type-wrapper p.v-label {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    margin-bottom: 12px !important;
}

/* Bireysel ve Kurumsal butonlarını lüks kapsüllere (pill) dönüştürüyoruz */
html body #app .checkout-page-mobile .bill-type-wrapper .v-selection-control {
    background-color: #0A0A0C !important;
    border: 1px solid rgba(200, 169, 81, 0.3) !important;
    border-radius: 8px !important;
    padding: 6px 15px 6px 5px !important;
    margin-right: 12px !important;
    transition: all 0.3s ease !important;
}

/* Seçili Olan (Aktif) Butonun Altın Işıltısı */
html body #app .checkout-page-mobile .bill-type-wrapper .v-selection-control--dirty {
    border-color: #C8A951 !important;
    background-color: rgba(200, 169, 81, 0.05) !important;
    box-shadow: 0 0 10px rgba(200, 169, 81, 0.1) !important;
}

/* İkonlar (Yuvarlak Tik İşaretleri) */
html body #app .checkout-page-mobile .bill-type-wrapper .v-selection-control__input i {
    color: #C8A951 !important;
    opacity: 1 !important;
}

/* "Bireysel" / "Kurumsal" Metinleri (Gümüş) */
html body #app .checkout-page-mobile .bill-type-wrapper .v-label--clickable {
    color: #E8E8E8 !important; 
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    opacity: 1 !important;
}

/* Seçili olan seçeneğin metnini tam Altın yap */
html body #app .checkout-page-mobile .bill-type-wrapper .v-selection-control--dirty .v-label--clickable {
    color: #C8A951 !important;
}
/* =========================================================
   THE TUVA: YAZI GÖMÜLMESİ, HAYALET METİN VE BUTON TEMİZLİĞİ
   ========================================================= */
/* =========================================================
   THE TUVA: YAZI GÖMÜLMESİ, HAYALET METİN VE BUTON TEMİZLİĞİ
   ========================================================= */

/* 1. İSTENMEYEN ÇİZGİLERİ VE SİYAH PERDELERİ YOK ET (BAŞLIKLARI KORU) */
/* .v-field__field kısımlarını silmedik, böylece Name/Surname yazıları güvende kaldı! */
html body #app .v-field__outline,
html body #app .v-field__outline::before,
html body #app .v-field__outline::after,
html body #app .v-field__overlay {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* 2. YAZIYI EN ÖNE ÇIKAR (GÖMÜLMEYİ ENGELLE) VE HİZALA */
/* Yazıyı Z-Index ile en üst katmana çekiyoruz, artık hiçbir şey onu örtemez */
html body #app input.v-field__input {
    position: relative !important;
    z-index: 9999 !important; /* Yazı her şeyin üstünde olacak */
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
    color: #C8A951 !important;
    -webkit-text-fill-color: #C8A951 !important;
    background: transparent !important;
    height: auto !important;
    min-height: 25px !important;
    padding-top: 22px !important; /* Başlık ile çakışmayı önler */
    padding-bottom: 5px !important;
    box-shadow: none !important;
    border: none !important;
    outline: none !important;
}

/* İç Kutu Hizalaması (Yazının taşmasını engeller) */
html body #app .v-field__field {
    display: flex !important;
    align-items: flex-end !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* 3. ANA KUTU (DIŞ ÇERÇEVE VE ZEMİN) */
/* Tertemiz bir siyah zemin ve altın çerçeve */
html body #app .v-field {
    background-color: #0A0A0C !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 8px !important;
    overflow: hidden !important;
}

/* Aktif/Odaklanmış Kutu Işıltısı */
html body #app .v-field.v-field--active:not(.v-field--error),
html body #app .v-field.v-field--focused:not(.v-field--error) {
    border-color: #C8A951 !important;
    box-shadow: 0 5px 15px rgba(200, 169, 81, 0.1) !important;
}

/* Hata (Error) Durumundaki Çerçeve (Kırmızı) */
html body #app .v-field.v-field--error {
    border-color: rgba(239, 68, 68, 0.8) !important;
}

/* 4. NORMAL BUTONLARA BULAŞAN GOLD ÇİZGİLERİ TEMİZLE */
/* Eğer sistemin diğer butonlarına (Geri Dön, Kaydet vb.) gold çizgi eklendiyse bunu sıfırlar */
html body #app button.v-btn {
    outline: none !important;
}
html body #app .v-btn--variant-elevated, 
html body #app .v-btn--variant-flat {
    border: none !important; /* Butonların etrafındaki istem dışı çizgileri kaldırır */
}
/* 2. YAZIYI EN ÖNE ÇIKAR (GÖMÜLMEYİ ENGELLE) VE HİZALA */
/* Yazıyı Z-Index ile en üst katmana çekiyoruz, artık hiçbir şey onu örtemez */
html body #app input.v-field__input {
    position: relative !important;
    z-index: 9999 !important; /* Yazı her şeyin üstünde olacak */
    opacity: 1 !important;
    visibility: visible !important;
    display: block !important;
    color: #C8A951 !important;
    -webkit-text-fill-color: #C8A951 !important;
    background: transparent !important;
    height: auto !important;
    min-height: 25px !important;
    padding-top: 22px !important; /* Başlık ile çakışmayı önler */
    padding-bottom: 5px !important;
    box-shadow: none !important;
    border: none !important;
    outline: none !important;
}

/* İç Kutu Hizalaması (Yazının taşmasını engeller) */
html body #app .v-field__field {
    display: flex !important;
    align-items: flex-end !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* 3. ANA KUTU (DIŞ ÇERÇEVE VE ZEMİN) */
/* Tertemiz bir siyah zemin ve altın çerçeve */
html body #app .v-field {
    background-color: #0A0A0C !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 8px !important;
    overflow: hidden !important;
}

/* Aktif/Odaklanmış Kutu Işıltısı */
html body #app .v-field.v-field--active:not(.v-field--error),
html body #app .v-field.v-field--focused:not(.v-field--error) {
    border-color: #C8A951 !important;
    box-shadow: 0 5px 15px rgba(200, 169, 81, 0.1) !important;
}

/* Hata (Error) Durumundaki Çerçeve (Kırmızı) */
html body #app .v-field.v-field--error {
    border-color: rgba(239, 68, 68, 0.8) !important;
}

/* 4. NORMAL BUTONLARA BULAŞAN GOLD ÇİZGİLERİ TEMİZLE */
/* Eğer sistemin diğer butonlarına (Geri Dön, Kaydet vb.) gold çizgi eklendiyse bunu sıfırlar */
html body #app button.v-btn {
    outline: none !important;
}
html body #app .v-btn--variant-elevated, 
html body #app .v-btn--variant-flat {
    border: none !important; /* Butonların etrafındaki istem dışı çizgileri kaldırır */
}
/* =========================================================
   THE TUVA: YAZI SIKIŞMASI VE HAYALET METİN TEMİZLİĞİ
   ========================================================= */

/* 1. KUTUYU DARALTAN ESKİ HAYALET YAZILARI KÖKÜNDEN İMHA ET */
/* Bu elemanlar flexbox içinde yer kaplayıp yazdığınız yazıyı sağa itiyordu */
html body #app .v-field__field::before,
html body #app .v-field__field::after {
    display: none !important;
    content: none !important;
    width: 0 !important;
    height: 0 !important;
    position: absolute !important; /* Fiziksel alan kaplamasını kesin olarak engeller */
}

/* 2. MÜŞTERİNİN YAZDIĞI ALANI (INPUT) %100 GENİŞLİĞE YAY */
html body #app input.v-field__input {
    width: 100% !important;
    flex: 1 1 100% !important; /* Kutunun tüm boşluğunu kaplamasını sağlar */
    position: relative !important;
    z-index: 9999 !important;
    color: #C8A951 !important;
    -webkit-text-fill-color: #C8A951 !important;
    background: transparent !important;
    padding-top: 22px !important;
    padding-left: 0 !important; /* Sağa itilmeyi sıfırlar */
    margin: 0 !important;
    box-shadow: none !important;
    border: none !important;
}

/* 3. İÇ KUTUNUN (FIELD) ESNEMESİNİ GARANTİ ALTINA AL */
html body #app .v-field__field {
    display: flex !important;
    align-items: flex-end !important;
    width: 100% !important;
    position: relative !important;
}
/* =========================================================
   THE TUVA: MODAL ARAMA KUTUSU KESİN BEYAZLIK İMHASI VE TAM KAPLAMA
   ========================================================= */

/* 1. TÜM DIŞ VE İÇ TAŞIYICILARI ŞEFFAFLAŞTIR VE BEYAZI SİL */
html body .mobile-select-search,
html body .mobile-select-search .v-input,
html body .mobile-select-search .v-input__control {
    background: transparent !important;
    background-color: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

/* 2. THE TUVA ARAMA KUTUSUNU TAM EKRANA YAY VE SİYAH ZIRHLA KAPLA */
/* Bu katman, sızan tüm beyazlıkların üzerine oturup onları ezer */
html body .mobile-select-search .v-field {
    background-color: #0A0A0C !important;
    background: #0A0A0C !important; /* Vuetify'ın light temasını kesin olarak ezer */
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 8px !important;
    width: 100% !important; /* Kutuyu sağa sola tam yaslar */
    min-height: 52px !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden !important; /* Dışarı taşan ne varsa kesip atar */
    padding: 0 16px !important;
    box-shadow: inset 0 0 15px rgba(0, 0, 0, 0.8) !important; /* Lüks ve tok bir iç gölge */
}

/* Kutuya Tıklayınca (Focus) Altın Parlama */
html body .mobile-select-search .v-field.v-field--focused {
    border-color: #C8A951 !important;
    box-shadow: 0 0 15px rgba(200, 169, 81, 0.15), inset 0 0 15px rgba(0, 0, 0, 0.8) !important;
}

/* 3. VUETIFY'IN İNATÇI BEYAZ İSKELETLERİNİ (OVERLAY/OUTLINE) KÖKÜNDEN YOK ET */
html body .mobile-select-search .v-field__overlay,
html body .mobile-select-search .v-field__outline,
html body .mobile-select-search .v-field__outline::before,
html body .mobile-select-search .v-field__outline::after {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    content: none !important;
    background: transparent !important;
    border: none !important;
}

/* 4. İKON VE YAZI HİZALAMASI (KUSURSUZ MERKEZ) */
html body .mobile-select-search .v-field__prepend-inner {
    align-items: center !important;
    padding-right: 12px !important;
    margin-top: 0 !important;
}
html body .mobile-select-search .v-field__prepend-inner i {
    color: rgba(200, 169, 81, 0.8) !important;
    font-size: 22px !important;
}

/* Arama Metni */
html body .mobile-select-search input.v-field__input {
    color: #C8A951 !important;
    -webkit-text-fill-color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 14px !important;
    height: auto !important;
    align-self: center !important;
    padding: 0 !important;
}

/* "İl Seçiniz" Placeholder Rengi */
html body .mobile-select-search input.v-field__input::placeholder {
    color: rgba(255, 255, 255, 0.4) !important;
    -webkit-text-fill-color: rgba(255, 255, 255, 0.4) !important;
    font-weight: 400 !important;
}
/* =========================================================
   THE TUVA: MODAL (ÜLKE/İL) LİSTESİ LÜKS TASARIMI
   ========================================================= */

/* 1. LİSTENİN ARKASINDAKİ ZEMİNİ SİYAH YAP (BEYAZ SIZINTIYI KES) */
html body .mobile-select-body,
html body .mobile-select-list {
    background-color: #0A0A0C !important;
    background: #0A0A0C !important;
}

/* 2. ZARİF KAYDIRMA ÇUBUĞU (SCROLLBAR) */
html body .mobile-select-list::-webkit-scrollbar {
    width: 4px !important;
}
html body .mobile-select-list::-webkit-scrollbar-track {
    background: transparent !important;
}
html body .mobile-select-list::-webkit-scrollbar-thumb {
    background: rgba(200, 169, 81, 0.4) !important;
    border-radius: 10px !important;
}
html body .mobile-select-list::-webkit-scrollbar-thumb:hover {
    background: #C8A951 !important;
}

/* 3. LİSTEDEKİ STANDART ÜLKELER/İLLER (GÜMÜŞ YAZI, ZARİF ÇİZGİ) */
html body .mobile-select-item {
    color: rgba(255, 255, 255, 0.6) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 13px !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    padding: 12px 16px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    background: transparent !important;
    transition: all 0.3s ease !important;
    text-align: left !important;
    width: 100% !important;
}

/* En alttaki elemanın alt çizgisini kaldır */
html body .mobile-select-item:last-child {
    border-bottom: none !important;
}

/* 4. ÜZERİNE GELİNDİĞİNDE (HOVER/ACTIVE) HAFİF KAYMA VE ALTIN IŞILTI */
html body .mobile-select-item:hover,
html body .mobile-select-item:active {
    background-color: rgba(200, 169, 81, 0.05) !important;
    color: #C8A951 !important;
    padding-left: 24px !important; /* Lüks ve zarif bir sağa kayma hareketi */
    border-bottom-color: rgba(200, 169, 81, 0.2) !important;
}

/* 5. SEÇİLİ OLAN ÜLKE (KAPSÜL TASARIMI - ALTIN ZEMİN SİYAH YAZI) */
html body .mobile-select-item.is-selected {
    background-color: #C8A951 !important;
    color: #0A0A0C !important;
    font-weight: 600 !important;
    padding-left: 20px !important;
    border-radius: 6px !important;
    margin: 4px 8px !important;
    width: calc(100% - 16px) !important; /* Kenarlardan hafif boşluk */
    border-bottom: none !important;
    box-shadow: 0 4px 10px rgba(200, 169, 81, 0.3) !important;
}
/* =========================================================
   THE TUVA: ŞİFREMİ UNUTTUM SAYFASI (KATMANLI BEYAZLIK İMHASI)
   ========================================================= */

/* 1. TÜM MUHTEMEL BEYAZ ZEMİNLERİ KÖKÜNDEN SİYAHA ÇEVİR */
html body .pageSifremiUnuttum,
html body .pageForgetPass,
html body .divsifremiUnuttumTop,
html body #divSifremiUnuttum,
html body .sifremiUnuttumInputList {
    background-color: #0A0A0C !important;
    background: #0A0A0C !important;
}

/* 2. ANA LÜKS ÇERÇEVE (SİYAH/GOLD KART) */
html body .divsifremiUnuttumTop {
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 12px !important;
    padding: 40px !important;
    max-width: 500px !important;
    margin: 40px auto !important;
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.8) !important;
}

/* 3. BAŞLIK ("Şifremi Unuttum" - MAVİ RENGİ EZİYORUZ) */
html body .sifremiUnuttumInputList span.sifremiUnuttumTitle {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 24px !important;
    font-weight: 600 !important;
    letter-spacing: 3px !important;
    text-transform: uppercase !important;
    display: block !important;
    text-align: center !important;
    border-bottom: 1px solid rgba(200, 169, 81, 0.2) !important;
    padding-bottom: 15px !important;
    margin-bottom: 30px !important;
}

/* 4. INPUT (METİN) KUTULARINI LÜKS FORMATA SOKMA */
html body .sifremiUnuttumInputList .newUserWrapper {
    position: relative !important;
    margin-bottom: 25px !important;
    width: 100% !important;
}

/* Kutu Tasarımı */
html body .sifremiUnuttumInputList input.textbox {
    background-color: #0A0A0C !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 8px !important;
    width: 100% !important;
    height: 56px !important;
    padding: 22px 15px 6px 15px !important; /* Yazının aşağıdan başlamasını sağlar */
    color: #C8A951 !important;
    -webkit-text-fill-color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 15px !important;
    outline: none !important;
    box-shadow: none !important;
    transition: all 0.3s ease !important;
}

/* Kutu Aktifken Altın Parlama */
html body .sifremiUnuttumInputList input.textbox:focus {
    border-color: #C8A951 !important;
    box-shadow: 0 5px 15px rgba(200, 169, 81, 0.15) !important;
}

/* Yönlendirme Başlıkları (E-posta, Güvenlik Kodu) */
html body .sifremiUnuttumInputList label.placeholderLabel {
    position: absolute !important;
    left: 15px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    color: rgba(255, 255, 255, 0.5) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 13px !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    pointer-events: none !important;
    transition: all 0.3s ease !important;
}

/* Kutuya Tıklanınca Yukarı Kayan Altın Yazı */
html body .sifremiUnuttumInputList .newUserWrapper.focus label.placeholderLabel,
html body .sifremiUnuttumInputList input.textbox:focus ~ label.placeholderLabel,
html body .sifremiUnuttumInputList input.textbox:valid ~ label.placeholderLabel {
    top: 14px !important;
    font-size: 10px !important;
    color: #C8A951 !important;
    letter-spacing: 2px !important;
}

/* 5. GÜVENLİK KODU ALANI HİZALAMASI VE GÖRÜNÜMÜ */
html body .sifremiUnuttumInputList .xIDDiv {
    display: flex !important;
    align-items: center !important;
    gap: 15px !important;
}

html body .sifremiUnuttumInputList .sifremiUnuttumCaptcha {
    display: flex !important;
    align-items: center !important;
    background: #0A0A0C !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 8px !important;
    padding: 0 10px !important;
    height: 56px !important;
}

html body .sifremiUnuttumInputList .sifremiUnuttumCaptcha img {
    border-radius: 4px !important;
    height: 38px !important; /* Görseli orantılı tutar */
}

html body .sifremiUnuttumInputList .sifremiUnuttumCaptcha a {
    color: rgba(200, 169, 81, 0.6) !important;
    margin-left: 10px !important;
    transition: color 0.3s ease !important;
}
html body .sifremiUnuttumInputList .sifremiUnuttumCaptcha a:hover {
    color: #C8A951 !important;
}

html body .sifremiUnuttumInputList .CaptchaDiv {
    flex: 1 !important;
    position: relative !important;
}

/* 6. GÖNDER BUTONU LÜKS THE TUVA TASARIMI */
html body button.newUserLoginBtn {
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.1) 0%, rgba(200, 169, 81, 0.25) 100%) !important;
    border: 1px solid #C8A951 !important;
    border-radius: 8px !important;
    width: 100% !important;
    height: 56px !important;
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: 3px !important;
    text-transform: uppercase !important;
    margin-top: 10px !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
}

html body button.newUserLoginBtn:hover {
    background: #C8A951 !important;
    color: #0A0A0C !important;
    box-shadow: 0 5px 20px rgba(200, 169, 81, 0.3) !important;
}
/* =========================================================
   THE TUVA: LÜKS LİNKLER VE GERİ DÖNÜŞ (SEPETİM) BUTONU
   ========================================================= */

/* ---------------------------------------------------------
   1. "ÜYE OL VEYA GİRİŞ YAP" LİNKİ (Sıradan Maviden Saf Altına)
   --------------------------------------------------------- */
html body #app .buy-fast a.text-blue {
    color: #C8A951 !important; /* The TUVA Altını */
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    transition: all 0.3s ease !important;
    border-bottom: 1px solid transparent !important;
    padding-bottom: 2px !important;
}

/* Üzerine Gelinince Altın Çizgi Belirir ve Işıldar */
html body #app .buy-fast a.text-blue:hover,
html body #app .buy-fast a.text-blue:active {
    color: #E8E8E8 !important; /* Lüks Gümüşe Döner */
    border-bottom: 1px solid #C8A951 !important; /* Altı çizilir */
    text-shadow: 0 0 10px rgba(200, 169, 81, 0.4) !important;
}

/* ---------------------------------------------------------
   2. "SEPETİM" (GERİ DÖN) BUTONU ZARİFLEŞTİRME
   --------------------------------------------------------- */
html body #app button.back-btn {
    background: transparent !important;
    border: none !important;
    color: rgba(255, 255, 255, 0.6) !important; /* Soluk Gümüş Yazı */
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    display: inline-flex !important;
    align-items: center !important;
    padding: 5px 10px !important;
    border-radius: 6px !important;
    transition: all 0.3s ease !important;
    box-shadow: none !important;
}

/* Sepetim Butonunun İçindeki Ok İkonu */
html body #app button.back-btn i.mdi-chevron-left {
    color: rgba(200, 169, 81, 0.7) !important; /* Altın Ok */
    font-size: 18px !important;
    margin-right: 4px !important;
    transition: transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

/* Üzerine Gelinince (Hover) Lüks Efekt */
html body #app button.back-btn:hover,
html body #app button.back-btn:active {
    color: #C8A951 !important; /* Yazı Altın Olur */
    background: rgba(200, 169, 81, 0.05) !important; /* Çok hafif bir altın zemin belirir */
}

/* Üzerine Gelinince Ok Hafifçe Sola Kayar (Tıklamaya Teşvik Eder) */
html body #app button.back-btn:hover i.mdi-chevron-left,
html body #app button.back-btn:active i.mdi-chevron-left {
    color: #C8A951 !important;
    transform: translateX(-4px) !important;
}
/* =========================================================
   THE TUVA: WEB TARAFINDAKİ LÜKS DETAYLAR (EDİT & USER MENU)
   ========================================================= */

/* ---------------------------------------------------------
   1. "EDİT" (DÜZENLE) BUTONU - ZARİF KAPSÜL TASARIMI
   --------------------------------------------------------- */
/* Vuetify'ın standart çerçeve ve arkaplan efektlerini sil */
html body #app button.address-radio-item-edit .v-btn__overlay,
html body #app button.address-radio-item-edit .v-btn__underlay {
    display: none !important;
}

html body #app button.address-radio-item-edit {
    background: transparent !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 6px !important;
    padding: 0 14px !important;
    height: 32px !important;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    box-shadow: none !important;
}

/* Edit Yazısı ve Kalem İkonu (Altın) */
html body #app button.address-radio-item-edit .v-btn__content,
html body #app button.address-radio-item-edit i {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    transition: color 0.3s ease !important;
}

/* Kalem ikonunun boyutu ve aralığı */
html body #app button.address-radio-item-edit i {
    font-size: 14px !important;
    margin-left: 6px !important;
}

/* Üzerine Gelinince Altın Kapsüle Dönüşme Efekti */
html body #app button.address-radio-item-edit:hover,
html body #app button.address-radio-item-edit:active {
    background: #C8A951 !important;
    border-color: #C8A951 !important;
    box-shadow: 0 4px 15px rgba(200, 169, 81, 0.2) !important;
    transform: translateY(-2px) !important;
}

html body #app button.address-radio-item-edit:hover .v-btn__content,
html body #app button.address-radio-item-edit:hover i,
html body #app button.address-radio-item-edit:active .v-btn__content,
html body #app button.address-radio-item-edit:active i {
    color: #0A0A0C !important; /* Altın üzerinde siyah yazı */
}


/* ---------------------------------------------------------
   2. "ADMIN / USER" MENÜSÜ - ALTIN İKON VE LÜKS GÖRÜNÜM
   --------------------------------------------------------- */
html body #app .usermenu-dropdown-btn {
    background: transparent !important;
    border: none !important;
    outline: none !important;
    padding: 6px 12px !important;
    border-radius: 8px !important;
    transition: all 0.3s ease !important;
}

/* İsim Kısmı (Gümüş) */
html body #app .payment-usermenu {
    display: flex !important;
    align-items: center !important;
    color: rgba(255, 255, 255, 0.7) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    transition: all 0.3s ease !important;
}

/* Kullanıcı İkonu (SVG - Sıvı Altın) */
/* currentColor miras aldığı için doğrudan rengi altına çeviriyoruz */
html body #app .payment-usermenu svg {
    color: #C8A951 !important;
    width: 22px !important;
    height: 22px !important;
    transition: all 0.3s ease !important;
}

/* Üzerine Gelinince İsim Altına Döner ve İkon Işıldar */
html body #app .usermenu-dropdown-btn:hover .payment-usermenu {
    color: #C8A951 !important;
    transform: translateY(-2px) !important;
}

html body #app .usermenu-dropdown-btn:hover .payment-usermenu svg {
    filter: drop-shadow(0 0 6px rgba(200, 169, 81, 0.6)) !important;
}
/* =========================================================
   THE TUVA: SÖZLEŞME ONAYI (CHECKBOX) VE SÖZLEŞME PENCERESİ (MODAL)
   ========================================================= */

/* ---------------------------------------------------------
   1. SÖZLEŞME ONAY KUTUCUĞU VE LİNKLER
   --------------------------------------------------------- */
/* Ana Taşıyıcı ve Metin Rengi (Gümüş) */
html body #app label.payment-agreement {
    display: flex !important;
    align-items: center !important;
    color: rgba(255, 255, 255, 0.6) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 13px !important;
    cursor: pointer !important;
    margin-top: 15px !important;
}

/* Sistemin Kendi Çirkin Kutusunu Gizle */
html body #app label.payment-agreement input[type="checkbox"] {
    display: none !important;
}

/* Lüks Altın Onay Kutusu (Checkmark) */
html body #app label.payment-agreement .checkmark {
    width: 24px !important;
    height: 24px !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 6px !important;
    background: #0A0A0C !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-right: 12px !important;
    transition: all 0.3s ease !important;
    flex-shrink: 0 !important;
}

/* Tıklanınca Altın Işıltı ve Çerçeve Rengi */
html body #app label.payment-agreement input[type="checkbox"]:checked ~ .checkmark,
html body #app label.payment-agreement input[type="checkbox"]:checked + .checkmark {
    background: rgba(200, 169, 81, 0.1) !important;
    border-color: #C8A951 !important;
    box-shadow: 0 0 10px rgba(200, 169, 81, 0.2) !important;
}

/* Tik İşareti (Animasyonlu Altın Varak) */
html body #app label.payment-agreement .checkmark i {
    color: transparent !important;
    font-size: 18px !important;
    transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    transform: scale(0) !important;
}
html body #app label.payment-agreement input[type="checkbox"]:checked ~ .checkmark i,
html body #app label.payment-agreement input[type="checkbox"]:checked + .checkmark i {
    color: #C8A951 !important;
    transform: scale(1) !important;
}

/* "Distance Selling Agreement" gibi Linklerin Tasarımı */
html body #app label.payment-agreement a {
    color: #C8A951 !important;
    text-decoration: none !important;
    font-weight: 500 !important;
    border-bottom: 1px solid transparent !important;
    transition: all 0.3s ease !important;
}
html body #app label.payment-agreement a:hover {
    color: #E8E8E8 !important;
    border-bottom-color: #C8A951 !important;
}

/* ---------------------------------------------------------
   2. AÇILAN SÖZLEŞME PENCERESİ (MODAL) İÇİ
   --------------------------------------------------------- */
/* Bembeyaz Pencereyi Zifiri Siyah ve Altın Çerçeveli Yap */
html body .v-overlay__content .v-card {
    background-color: #0A0A0C !important;
    background: #0A0A0C !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 12px !important;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.9) !important;
}

/* Sistemin Beyaz İskelet Gölgelerini Yok Et */
html body .v-overlay__content .v-card__underlay,
html body .v-overlay__content .v-card__overlay {
    display: none !important;
}

/* Kapatma Butonu (Çarpı) ve Üst Çizgi */
html body .v-overlay__content .dialog-title-wrapper {
    border-bottom: 1px solid rgba(200, 169, 81, 0.2) !important;
}
html body .v-overlay__content .dialog-title-wrapper button i {
    color: rgba(200, 169, 81, 0.6) !important;
    transition: color 0.3s ease !important;
}
html body .v-overlay__content .dialog-title-wrapper button:hover i {
    color: #C8A951 !important;
}

/* Altın Renkli Sözleşme Başlıkları */
html body .v-overlay__content .modal-agreement-title {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    margin-bottom: 15px !important;
    border-bottom: 1px dashed rgba(200, 169, 81, 0.2) !important;
    padding-bottom: 10px !important;
}

/* İÇ METİNLER (Satıriçi Arial ve Siyah Renkleri Ez) */
html body .v-overlay__content .modal-agreement-body,
html body .v-overlay__content .modal-agreement-body span,
html body .v-overlay__content .modal-agreement-body div,
html body .v-overlay__content .modal-agreement-body td {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12px !important;
    color: rgba(255, 255, 255, 0.6) !important; /* Lüks Gümüş */
    line-height: 1.8 !important;
    background: transparent !important;
}

/* İnce ve Şık Scrollbar (Kaydırma Çubuğu) */
html body .v-overlay__content .modal-agreement-content::-webkit-scrollbar {
    width: 4px !important;
}
html body .v-overlay__content .modal-agreement-content::-webkit-scrollbar-thumb {
    background: rgba(200, 169, 81, 0.4) !important;
    border-radius: 10px !important;
}

/* Sözleşme İçindeki Ürün Tablosu (Zarif Çizgiler) */
html body .v-overlay__content .modal-agreement-body table {
    width: 100% !important;
    margin: 20px 0 !important;
    border-collapse: collapse !important;
}
html body .v-overlay__content .modal-agreement-body td {
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    padding: 12px 5px !important;
}

/* "I have read and approve" Alt Onay Metni */
html body .v-overlay__content .pa-4 p {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-align: center !important;
    margin-top: 15px !important;
}

/* ---------------------------------------------------------
   3. CAYIR CAYIR YEŞİL YANAN "CONFIRM" BUTONUNU ALTINA ÇEVİRME
   --------------------------------------------------------- */
html body .v-overlay__content button.modal-agreement-btn {
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.1) 0%, rgba(200, 169, 81, 0.3) 100%) !important;
    background-color: transparent !important; /* Satıriçi Yeşili Ezer */
    border: 1px solid #C8A951 !important;
    border-radius: 8px !important;
    height: 55px !important;
    transition: all 0.3s ease !important;
}

html body .v-overlay__content button.modal-agreement-btn .v-btn__content {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: 4px !important;
    text-transform: uppercase !important;
    transition: color 0.3s ease !important;
}

/* Butonun Üzerine Gelinince Altın Zemin ve Siyah Yazı */
html body .v-overlay__content button.modal-agreement-btn:hover {
    background: #C8A951 !important;
    background-color: #C8A951 !important;
    box-shadow: 0 5px 20px rgba(200, 169, 81, 0.3) !important;
}

html body .v-overlay__content button.modal-agreement-btn:hover .v-btn__content {
    color: #0A0A0C !important;
}
/* =========================================================
   THE TUVA: MOBİL SÖZLEŞME PENCERESİ (BOTTOM DRAWER) LÜKS TASARIM
   ========================================================= */

/* 1. ALTTAN AÇILAN ANA PANELİ ZİFİRİ SİYAH YAP VE ALTIN ÇİZGİ EKLE */
html body #app .v-navigation-drawer.tc-drawer {
    background-color: #0A0A0C !important;
    background: #0A0A0C !important;
    border-top: 1px solid rgba(200, 169, 81, 0.4) !important;
    box-shadow: 0 -10px 40px rgba(0, 0, 0, 0.9) !important;
}

/* =========================================================
   THE TUVA: MOBİL ÇEKMECE (DRAWER) ÇARPI (X) İKONU KESİLME DÜZELTMESİ
   ========================================================= */

/* 1. Üst Kısıma Nefes Aldır (Padding ile ikonu içeri it) */
html body #app .v-navigation-drawer.tc-drawer .drawer-title-wrapper {
    min-height: 55px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    padding: 15px 15px 10px 15px !important; /* Üstten ve sağdan ikonu güvenli alana iter */
    border-bottom: 1px solid rgba(200, 169, 81, 0.2) !important;
    overflow: visible !important; /* Genel kesilmeleri engeller */
}

/* 2. Kapatma Butonunu (X) Tam Merkezle ve Kesilmeyi Yasakla */
html body #app .v-navigation-drawer.tc-drawer .drawer-title-wrapper button {
    width: 32px !important;
    height: 32px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: transparent !important;
    overflow: visible !important; /* Buton sınırından taşan ikon kesilmez */
}

html body #app .v-navigation-drawer.tc-drawer .drawer-title-wrapper button i {
    font-size: 22px !important;
    line-height: 1 !important;
    margin: 0 !important;
    padding: 0 !important;
    color: rgba(200, 169, 81, 0.7) !important;
    transition: all 0.3s ease !important;
}

html body #app .v-navigation-drawer.tc-drawer .drawer-title-wrapper button:active i {
    color: #C8A951 !important;
    transform: scale(0.9) !important; /* Tıklayınca lüks bir küçülme efekti */
}
/* 3. SÖZLEŞME BAŞLIKLARI (ALTIN IŞILTI) */
html body #app .v-navigation-drawer.tc-drawer .modal-agreement-title {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: 1px !important;
    text-transform: uppercase !important;
    margin-bottom: 15px !important;
    border-bottom: 1px dashed rgba(200, 169, 81, 0.2) !important;
    padding-bottom: 10px !important;
}

/* 4. İÇ METİNLER VE TABLOLAR (Sıradan Arial'i Ez, Gümüş Yap) */
html body #app .v-navigation-drawer.tc-drawer .modal-agreement-body,
html body #app .v-navigation-drawer.tc-drawer .modal-agreement-body span,
html body #app .v-navigation-drawer.tc-drawer .modal-agreement-body div,
html body #app .v-navigation-drawer.tc-drawer .modal-agreement-body td {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    color: rgba(255, 255, 255, 0.6) !important;
    line-height: 1.8 !important;
    background: transparent !important;
}

html body #app .v-navigation-drawer.tc-drawer .modal-agreement-body td {
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    padding: 10px 4px !important;
}

/* Mobilde İnce Lüks Kaydırma Çubuğu */
html body #app .v-navigation-drawer.tc-drawer .modal-agreement-content::-webkit-scrollbar {
    width: 3px !important;
}
html body #app .v-navigation-drawer.tc-drawer .modal-agreement-content::-webkit-scrollbar-thumb {
    background: rgba(200, 169, 81, 0.3) !important;
    border-radius: 10px !important;
}

/* 5. ALT ONAY METNİ VE CONFIRM BUTONU */
html body #app .v-navigation-drawer.tc-drawer .pa-4 p {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    text-align: center !important;
    margin-top: 10px !important;
}

/* O Çirkin Yeşil Butonu Altın Kapsüle Çeviriyoruz */
html body #app .v-navigation-drawer.tc-drawer button.modal-agreement-btn {
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.1) 0%, rgba(200, 169, 81, 0.25) 100%) !important;
    background-color: transparent !important;
    border: 1px solid #C8A951 !important;
    border-radius: 8px !important;
    height: 50px !important;
    margin-top: 10px !important;
}

html body #app .v-navigation-drawer.tc-drawer button.modal-agreement-btn .v-btn__content {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    letter-spacing: 3px !important;
    text-transform: uppercase !important;
}

/* Mobilde Dokunulduğunda (Active) Parlama Efekti */
html body #app .v-navigation-drawer.tc-drawer button.modal-agreement-btn:active {
    background: #C8A951 !important;
    background-color: #C8A951 !important;
    box-shadow: 0 5px 20px rgba(200, 169, 81, 0.3) !important;
}
html body #app .v-navigation-drawer.tc-drawer button.modal-agreement-btn:active .v-btn__content {
    color: #0A0A0C !important;
}
/* =========================================================
   THE TUVA: SEPET ÜRÜN GÖRSELİ (EZİLMEYİ ÖNLEYEN LÜKS VİTRİN)
   ========================================================= */

/* 1. ANA RESİM KUTUSU (Altın Çerçeveli Premium Kapsül) */
html body #app .basket-item-image {
    width: 75px !important; /* Çok zarif ve dengeli bir boyut */
    height: 75px !important;
    background-color: #0A0A0C !important; /* Zifiri siyah zemin */
    border: 1px solid rgba(200, 169, 81, 0.5) !important; /* İnce altın çerçeve */
    border-radius: 8px !important; /* Modern yumuşak köşeler */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 5px !important; /* Resim çerçeveye yapışmasın, ferah dursun */
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.8) !important; /* Derinlik veren gölge */
    flex-shrink: 0 !important; /* ASLA SIKIŞMASIN: Ne olursa olsun bu boyutu korur */
    position: relative !important;
    z-index: 10 !important; /* Butonun altında kalıp ezilmesini kesin olarak yasaklar */
    overflow: hidden !important;
}

/* 2. ÜRÜN GÖRSELİNİN KENDİSİ (Bozulmadan Sığdırma) */
html body #app .basket-item-image img {
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important; /* Resmi uzatıp sündürmez, altın oranla kutuya oturtur */
    transition: transform 0.4s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

/* Üzerine Gelinince İçerideki Görselin Hafifçe Büyümesi (Elit Efekt) */
html body #app .basket-item-image:hover img {
    transform: scale(1.08) !important;
}
/* =========================================================
   THE TUVA: SEPET ÖZETİ (AÇILIR/KAPANIR ACCORDION VE SCROLL ÇÖZÜMÜ)
   ========================================================= */

/* 1. SEPET BAŞLIĞI VE AÇMA/KAPAMA BUTONU (MY BASKET) LÜKS TASARIMI */
html body #app .accordion-title-wrapper {
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
    padding: 10px 0 15px 0 !important;
    border-bottom: 1px solid rgba(200, 169, 81, 0.2) !important;
    margin-bottom: 15px !important;
    cursor: pointer !important; /* Tıklanabilir hissi verir */
}

/* My Basket Yazısı (Sıvı Altın) */
html body #app .accordion-title {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    letter-spacing: 3px !important;
    text-transform: uppercase !important;
}

/* Sepetteki Ürün Sayısı Parantezi (7) */
html body #app .accordion-title span {
    color: rgba(255, 255, 255, 0.4) !important;
    font-size: 13px !important;
    font-weight: 400 !important;
}

/* Açma/Kapama (Ok) İkonu */
html body #app .accordion-trigger-btn {
    background: transparent !important;
    border: none !important;
    color: #C8A951 !important; /* Altın Ok */
    transition: all 0.3s ease !important;
    box-shadow: none !important;
}
html body #app .accordion-trigger-btn i {
    font-size: 24px !important;
}

/* 2. KAYDIRILABİLİR (SCROLL) İÇERİK KUTUSU */
/* Sistemin kendi aç/kapat komutlarına müdahale etmeden sadece taşıma sınırlarını çizeriz */
html body #app .accordion-content {
    overflow-y: auto !important; /* Aşağı taşanı kaydırmaya zorlar */
    overflow-x: hidden !important;
    padding-right: 12px !important; /* Scrollbar çubuğu için alan */
}

/* Kutu sadece "aktif" (açık) olduğunda yüksekliği sabitleriz */
html body #app .accordion.active .accordion-content {
    max-height: 380px !important; 
}

/* 3. LÜKS KAYDIRMA ÇUBUĞU (SCROLLBAR) */
html body #app .accordion-content::-webkit-scrollbar {
    width: 4px !important;
}
html body #app .accordion-content::-webkit-scrollbar-track {
    background: transparent !important; 
}
html body #app .accordion-content::-webkit-scrollbar-thumb {
    background: rgba(200, 169, 81, 0.4) !important;
    border-radius: 10px !important;
}
html body #app .accordion-content::-webkit-scrollbar-thumb:hover {
    background: #C8A951 !important;
}

/* 4. ÜRÜNLERİN ARASINDAKİ ZARİF ÇİZGİLER */
html body #app .product-item.readonly-item {
    border-bottom: 1px dashed rgba(255, 255, 255, 0.1) !important;
    padding-bottom: 15px !important;
    margin-bottom: 15px !important;
}
/* Son üründe çizgi olmaz */
html body #app .product-item.readonly-item:last-child {
    border-bottom: none !important;
    margin-bottom: 0 !important;
    padding-bottom: 5px !important;
}
/* =========================================================
   THE TUVA: MOBİL SEPET LİSTESİ (AÇILIR/KAPANIR ACCORDION SİSTEMİ)
   ========================================================= */

/* 1. SEPET BAŞLIĞI VE AÇMA/KAPAMA BUTONU LÜKS TASARIMI (MOBİL İÇİN) */
@media (max-width: 768px) {
    html body #app .accordion-title-wrapper {
        display: flex !important;
        justify-content: space-between !important;
        align-items: center !important;
        padding: 12px 10px !important;
        background-color: rgba(200, 169, 81, 0.05) !important; /* Başlığı belirginleştiren hafif altın zemin */
        border: 1px solid rgba(200, 169, 81, 0.3) !important;
        border-radius: 8px !important;
        margin-bottom: 15px !important;
        cursor: pointer !important;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5) !important;
    }

    /* "My Basket" Metni */
    html body #app .accordion-title {
        color: #C8A951 !important;
        font-family: 'Montserrat', sans-serif !important;
        font-size: 14px !important;
        font-weight: 600 !important;
        letter-spacing: 2px !important;
        text-transform: uppercase !important;
    }

    /* (7) Sayısı */
    html body #app .accordion-title span {
        color: rgba(255, 255, 255, 0.6) !important;
        font-size: 12px !important;
        font-weight: 400 !important;
        margin-left: 5px !important;
    }

    /* Açma/Kapama (Ok) İkonu */
    html body #app .accordion-trigger-btn {
        background: transparent !important;
        border: none !important;
        color: #C8A951 !important;
        padding: 0 !important;
        min-width: unset !important;
        width: 30px !important;
        height: 30px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
    }
    
    html body #app .accordion-trigger-btn i {
        font-size: 24px !important;
    }

    /* 2. KAYDIRILABİLİR (SCROLL) MOBİL İÇERİK KUTUSU */
    html body #app .accordion-content {
        overflow-y: auto !important;
        overflow-x: hidden !important;
        padding-right: 8px !important;
        margin-bottom: 20px !important;
    }

    /* Liste AÇIK olduğunda maksimum yüksekliği mobilde biraz daha kısa tutuyoruz */
    html body #app .accordion.active .accordion-content {
        max-height: 280px !important; 
        border-bottom: 1px solid rgba(200, 169, 81, 0.2) !important; /* Listenin bittiğini gösteren ince çizgi */
        padding-bottom: 10px !important;
    }

    /* 3. LÜKS KAYDIRMA ÇUBUĞU (MOBİL SCROLLBAR) */
    html body #app .accordion-content::-webkit-scrollbar {
        width: 3px !important;
    }
    html body #app .accordion-content::-webkit-scrollbar-track {
        background: transparent !important;
    }
    html body #app .accordion-content::-webkit-scrollbar-thumb {
        background: rgba(200, 169, 81, 0.5) !important;
        border-radius: 10px !important;
    }
}
/* =========================================================
   THE TUVA: KARGO, UYARI MESAJI VE MOBİL SEPET OPTİMİZASYONU
   ========================================================= */

/* ---------------------------------------------------------
   1. KARGO SEÇİM LİSTESİ (Beyaz Çizgileri Sil, Premium Yap)
   --------------------------------------------------------- */
html body #app .cargo-list--item {
    background-color: #0A0A0C !important;
    background: #0A0A0C !important;
    border: 1px solid rgba(200, 169, 81, 0.3) !important;
    border-radius: 8px !important;
    margin-bottom: 12px !important;
    padding: 12px !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.5) !important;
    transition: all 0.3s ease !important;
}

/* Kargo Seçili Olduğunda Altın Parlama */
html body #app .v-selection-control--dirty.cargo-list--item {
    border-color: #C8A951 !important;
    box-shadow: 0 0 15px rgba(200, 169, 81, 0.15) !important;
}

/* Kargo İsmi ve Açıklaması */
html body #app .cargo-list--item_name {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: 1px !important;
}

html body #app .cargo-list--item_description {
    color: rgba(255, 255, 255, 0.5) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    margin-top: 4px !important;
}

/* Kargo Fiyat Etiketi (₺0,00) - Şık Kapsül */
html body #app .cargo-list--item_chip {
    background: rgba(200, 169, 81, 0.1) !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 6px !important;
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 600 !important;
    padding: 4px 10px !important;
}

/* O Çirkin Mavi Radyo Butonunu Altına Çevir */
html body #app .cargo-list--item .v-selection-control__input i {
    color: #C8A951 !important;
}

/* ---------------------------------------------------------
   2. TAKSİT SINIRLANDIRMA UYARISI (Premium Bilgi Panosu)
   --------------------------------------------------------- */
html body #app .basket-information {
    background: rgba(200, 169, 81, 0.05) !important;
    border: 1px solid rgba(200, 169, 81, 0.2) !important;
    border-left: 4px solid #C8A951 !important; /* Sol tarafta asil bir altın çizgi */
    border-radius: 6px !important;
    padding: 15px !important;
    margin-top: 15px !important;
    margin-bottom: 15px !important;
    color: rgba(255, 255, 255, 0.7) !important; /* Gümüş metin */
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12px !important;
    line-height: 1.6 !important;
}

html body #app .basket-information b {
    color: #C8A951 !important; /* Vurgulanan kelimeler (ürün adı, taksit sayısı) altın rengi */
    font-weight: 600 !important;
}

/* ---------------------------------------------------------
   3. MOBİL SEPET ERGONOMİSİ (Aşağı inmeyi kolaylaştıran kısıtlama)
   --------------------------------------------------------- */
@media (max-width: 768px) {
    /* Mobil ekranda ürün listesini maksimum yüksekliğe hapseder ve kaydırma (scroll) verir */
    html body #app .accordion-content,
    html body #app .product-item:parent {
        max-height: 300px !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
        padding-right: 8px !important;
        border-bottom: 1px solid rgba(200, 169, 81, 0.2) !important;
        margin-bottom: 15px !important;
    }

    /* Lüks İnce Kaydırma Çubuğu */
    html body #app .accordion-content::-webkit-scrollbar {
        width: 3px !important;
    }
    html body #app .accordion-content::-webkit-scrollbar-thumb {
        background: rgba(200, 169, 81, 0.4) !important;
        border-radius: 10px !important;
    }
}
/* =========================================================
   THE TUVA: SEPET (CART) SAYFASI ADET VE SİLME BUTONLARI LÜKS TASARIMI
   ========================================================= */

/* 1. Miktar (Counter) Kutusu - Lüks Çerçeve */
html body #app .basket-item-bottom-wrapper .counter {
    background-color: #0A0A0C !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 6px !important;
    height: 36px !important;
    display: flex !important;
    align-items: center !important;
    overflow: hidden !important;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.5) !important;
}

/* 2. Artı / Eksi ve Silme Butonları (Kare Çerçeveden Kurtar) */
html body #app .basket-item-bottom-wrapper .counter-button {
    color: #C8A951 !important;
    background: transparent !important;
    width: 32px !important;
    height: 36px !important;
    border-radius: 0 !important;
    transition: all 0.3s ease !important;
}

html body #app .basket-item-bottom-wrapper .counter-button:hover {
    background: rgba(200, 169, 81, 0.1) !important;
}

/* 3. Çöp Tenekesi Rengini Ucuz Kırmızıdan Tok Bir Kırmızı/Altın Tonuna Çekme */
html body #app .basket-item-bottom-wrapper .counter-button.text-red i {
    color: rgba(220, 53, 69, 0.8) !important; /* Lüks, mat bir kırmızı */
    transition: color 0.3s ease !important;
}
html body #app .basket-item-bottom-wrapper .counter-button.text-red:hover i {
    color: #ff4757 !important; /* Üzerine gelince parlasın */
}

/* 4. Rakam ve "Adet" Yazısı Arasındaki Bölmeler */
html body #app .basket-item-bottom-wrapper .counter-label {
    display: flex !important;
    align-items: center !important;
    padding: 0 8px !important;
    border-left: 1px solid rgba(200, 169, 81, 0.2) !important;
    border-right: 1px solid rgba(200, 169, 81, 0.2) !important;
    height: 100% !important;
}

/* Rakamın Kendisi (Gümüş) */
html body #app .basket-item-bottom-wrapper .counter-text {
    color: #E8E8E8 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 600 !important;
    font-size: 13px !important;
    text-align: center !important;
    background: transparent !important;
    outline: none !important;
}

/* "Adet" Birimi Yazısı */
html body #app .basket-item-bottom-wrapper .counter-unit {
    color: rgba(255, 255, 255, 0.5) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 10px !important;
    text-transform: uppercase !important;
    margin-left: 4px !important;
}

/* 5. Fiyat ile Adet Kutusunu Hizalama */
html body #app .basket-item-bottom-wrapper .action-wrapper {
    margin-right: auto !important; /* Fiyatı en sağa, sayacı sola iter */
}
/* =========================================================
   THE TUVA: TESLİMAT ADRESİ PANELİ (LÜKS ADRES KARTLARI)
   ========================================================= */

/* 1. ÜST BAŞLIK (Delivery Address) LÜKS TASARIMI */
html body #app .v-navigation-drawer__content .drawer-title {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
}

/* 2. ADRES KUTULARI (Zifiri Siyah Kapsüller) */
html body #app .address-radio-item {
    background-color: #0A0A0C !important;
    border: 1px solid rgba(200, 169, 81, 0.3) !important;
    border-radius: 10px !important;
    padding: 15px !important;
    margin-bottom: 15px !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.5) !important;
}

/* 3. SEÇİLİ (AKTİF) ADRESİN PARLAMASI */
html body #app .active .address-radio-item {
    border-color: #C8A951 !important;
    background: rgba(200, 169, 81, 0.05) !important;
    box-shadow: 0 0 15px rgba(200, 169, 81, 0.2) !important;
}

/* 4. ADRES BAŞLIĞI (Örn: "Ev") - Altın ve Çizgili */
html body #app .address-radio-item-title {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    margin-bottom: 12px !important;
    border-bottom: 1px dashed rgba(200, 169, 81, 0.2) !important;
    padding-bottom: 8px !important;
}

/* 5. RADYO BUTONU (Çirkin Maviyi Ez, Saf Altın Yap) */
html body #app .address-radio-item .v-selection-control__input i {
    color: #C8A951 !important;
}

/* 6. ADRES DETAY METNİ (Lüks Gümüş) */
html body #app .address-radio-item-text {
    color: rgba(255, 255, 255, 0.6) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12px !important;
    line-height: 1.6 !important;
    padding-left: 5px !important;
}

/* 7. AKSİYON BUTONLARI ALANI (Düzenle ve Sil) */
html body #app .address-item-action {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-end !important;
    gap: 15px !important;
    margin-top: 15px !important;
    border-top: 1px solid rgba(255, 255, 255, 0.05) !important;
    padding-top: 12px !important;
}

/* Çöp Tenekesi Butonu Rengi (Lüks Mat Kırmızı) */
html body #app .address-radio-delete-item {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
    min-width: auto !important;
    transition: all 0.3s ease !important;
}

html body #app .address-radio-delete-item i {
    color: rgba(220, 53, 69, 0.8) !important;
    font-size: 20px !important;
    transition: all 0.3s ease !important;
}

html body #app .address-radio-delete-item:hover i {
    color: #ff4757 !important;
    transform: scale(1.1) !important; /* Tıklamaya teşvik eden büyüme efekti */
}
/* =========================================================
   THE TUVA: ADRES DÜZENLEME PANELİ & LÜKS FORM KUTULARI
   ========================================================= */

/* =========================================================
   THE TUVA: ADRES FORMU KUSURSUZ HİZALAMA VE LÜKS GÖRÜNÜM
   ========================================================= */

/* ---------------------------------------------------------
   1. ÜST BAŞLIK VE ÇARPI (X) ÇAKIŞMASINA KESİN ÇÖZÜM
   --------------------------------------------------------- */
html body #app .v-navigation-drawer__content .drawer-title-wrapper {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important; /* Her şeyi sola dizmeye başla */
    padding: 15px 20px !important;
    width: 100% !important;
    background-color: #0A0A0C !important;
    border-bottom: 1px solid rgba(200, 169, 81, 0.2) !important;
}

html body #app .v-navigation-drawer__content .drawer-title {
    margin-right: auto !important; /* Başlık solda durur, Çarpı (X) butonunu en sağa iter */
    text-align: left !important;
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
}

html body #app .v-navigation-drawer__content .drawer-title-wrapper button {
    flex-shrink: 0 !important;
    color: rgba(200, 169, 81, 0.7) !important;
}

/* =========================================================
   THE TUVA: ADRES FORMU (İÇ İÇE GEÇEN YAZILARA KESİN ÇÖZÜM)
   ========================================================= */

/* ---------------------------------------------------------
   1. FORM KUTULARI TEMEL İSKELETİ
   --------------------------------------------------------- */
html body #app .form-adv .v-field {
    background-color: #111111 !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 8px !important;
    min-height: 60px !important;
    display: flex !important;
    align-items: center !important; /* Her şeyi dikeyde ortalar */
    position: relative !important;
    box-shadow: none !important;
    transition: all 0.3s ease !important;
}

html body #app .form-adv .v-field--focused {
    border-color: #C8A951 !important;
    box-shadow: 0 0 12px rgba(200, 169, 81, 0.15) !important;
}

/* ---------------------------------------------------------
   2. YAZILARIN ÇARPIŞMASINI ENGELLEME (EN ÖNEMLİ KISIM)
   --------------------------------------------------------- */
/* Sadece kutunun üstünde sabit duracak tek bir başlık bırakıyoruz */
html body #app .form-adv .v-field .v-label {
    position: absolute !important;
    top: 8px !important;
    left: 15px !important;
    transform: none !important; /* Vuetify hareketini tamamen durdurur */
    font-size: 10px !important;
    color: rgba(255, 255, 255, 0.5) !important;
    font-weight: 500 !important;
    letter-spacing: 1px !important;
    pointer-events: none !important;
    opacity: 1 !important; /* Her zaman görünür olsun */
}

html body #app .form-adv .v-field.v-field--active .v-label,
html body #app .form-adv .v-field.v-field--focused .v-label {
    color: #C8A951 !important;
    font-weight: 600 !important;
}

/* Çiftleyen Diğer Tüm Gereksiz Başlıkları GİZLE */
/* Eğer bir label ".v-field-label--floating" sınıfına sahip değilse, o kopyadır, yokediyoruz */
html body #app .form-adv .v-field .v-label.v-field-label:not(.v-field-label--floating) {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

/* ---------------------------------------------------------
   3. YAZILAN METİNLERİN (GİRDİLERİN) HİZASI
   --------------------------------------------------------- */
html body #app .form-adv .v-field__input {
    display: flex !important;
    align-items: flex-end !important; /* Yazıyı kutunun altına doğru iter */
    padding-top: 24px !important; /* Başlık ile asla çarpışmaz */
    padding-bottom: 8px !important;
    padding-left: 15px !important;
    color: #E8E8E8 !important; /* Gümüş metin */
    -webkit-text-fill-color: #E8E8E8 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 14px !important;
    min-height: unset !important;
    height: auto !important;
    width: 100% !important;
}

/* Kutuların içindeki Placeholder'ı (Örn: "Home, Business...") Gümüşe Boya */
html body #app .form-adv .v-field__input::placeholder {
    color: rgba(255, 255, 255, 0.2) !important;
    -webkit-text-fill-color: rgba(255, 255, 255, 0.2) !important;
}

/* ---------------------------------------------------------
   4. AÇILIR MENÜ (DROPDOWN) OK İŞARETLERİ
   --------------------------------------------------------- */
/* Select Country, Select City gibi yerlerin okları */
html body #app .form-adv .v-field__append-inner {
    display: flex !important;
    align-items: center !important;
    padding-right: 15px !important;
    margin-top: 0 !important; /* Okları dikeyde tam ortalar */
}

html body #app .form-adv .v-field__append-inner i {
    color: rgba(200, 169, 81, 0.7) !important;
    font-size: 20px !important;
    transition: color 0.3s ease !important;
}

html body #app .form-adv .v-field:hover .v-field__append-inner i {
    color: #C8A951 !important;
}

/* ---------------------------------------------------------
   5. OLUŞTUR (CREATE) / GÜNCELLE (UPDATE) BUTONU
   --------------------------------------------------------- */
html body #app .form-adv button.address-form-submit {
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.1) 0%, rgba(200, 169, 81, 0.25) 100%) !important;
    background-color: transparent !important; /* Yeşili yut */
    border: 1px solid #C8A951 !important;
    border-radius: 8px !important;
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: 3px !important;
    text-transform: uppercase !important;
    height: 56px !important;
    margin-top: 20px !important;
    transition: all 0.3s ease !important;
    box-shadow: none !important;
}

html body #app .form-adv button.address-form-submit:hover {
    background: #C8A951 !important;
    background-color: #C8A951 !important;
    color: #0A0A0C !important;
    box-shadow: 0 5px 20px rgba(200, 169, 81, 0.3) !important;
}

/* ---------------------------------------------------------
   3. TELEFON NUMARASI KUTUSU (.vue-tel-input) DÜZENLEMESİ
   --------------------------------------------------------- */
html body #app .form-adv .vue-tel-input {
    background-color: #111111 !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 8px !important;
    height: 60px !important;
    position: relative !important;
}
html body #app .form-adv .vue-tel-input:focus-within {
    border-color: #C8A951 !important;
    box-shadow: 0 0 12px rgba(200, 169, 81, 0.15) !important;
}

/* Telefon Başlığı */
html body #app .form-adv .floating-label {
    position: absolute !important;
    top: 8px !important;
    left: 15px !important;
    transform: none !important;
    pointer-events: none !important;
}
html body #app .form-adv .floating-label .textfield-label {
    color: rgba(255, 255, 255, 0.5) !important;
    font-size: 10px !important;
    letter-spacing: 1px !important;
}
html body #app .form-adv .vue-tel-input:focus-within .floating-label .textfield-label {
    color: #C8A951 !important;
}

/* Telefon Alanı Girdisi ve Ülke Kodu */
html body #app .form-adv .vti__input {
    background: transparent !important;
    color: #E8E8E8 !important;
    font-family: 'Montserrat', sans-serif !important;
    padding-top: 24px !important;
    padding-bottom: 6px !important;
    padding-left: 10px !important;
}
html body #app .form-adv .vti__dropdown {
    padding-top: 15px !important; /* Bayrağı aşağı iter */
    color: #C8A951 !important;
}

/* ---------------------------------------------------------
   4. FATURA TİPİ (BILL TYPE) RADYO BUTONLARI
   --------------------------------------------------------- */
html body #app .bill-type-wrapper p.v-label {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 1px !important;
    margin-bottom: 10px !important;
    position: static !important; /* Formlardaki gibi hareket etmesini engeller */
}

html body #app .bill-type-wrapper .v-selection-control__input i {
    color: #C8A951 !important;
}
html body #app .bill-type-wrapper label.v-label {
    color: rgba(255, 255, 255, 0.7) !important;
    font-size: 13px !important;
    position: static !important;
    transform: none !important;
}

/* ---------------------------------------------------------
   5. GÜNCELLE (UPDATE) BUTONU - YEMYEŞİLDEN SIVI ALTINA
   --------------------------------------------------------- */
html body #app .form-adv button.address-form-submit {
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.1) 0%, rgba(200, 169, 81, 0.25) 100%) !important;
    background-color: transparent !important; /* Satıriçi çirkin yeşili kesin ezer */
    border: 1px solid #C8A951 !important;
    border-radius: 8px !important;
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: 3px !important;
    text-transform: uppercase !important;
    height: 56px !important;
    transition: all 0.3s ease !important;
    box-shadow: none !important;
}

html body #app .form-adv button.address-form-submit:hover {
    background: #C8A951 !important;
    background-color: #C8A951 !important;
    color: #0A0A0C !important;
    box-shadow: 0 5px 20px rgba(200, 169, 81, 0.3) !important;
}
/* =========================================================
   THE TUVA: ADRES FORMU (SABİT BAŞLIKLAR VE LÜKS KUTULAR)
   ========================================================= */

/* =========================================================
   THE TUVA: ADRES FORMU (ORİJİNAL BAŞLIKLARI SABİTLEME)
   ========================================================= */

/* 1. FORM KUTULARI TEMEL İSKELETİ */
html body #app .form-adv .v-field {
    background-color: #111111 !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 8px !important;
    min-height: 60px !important;
    display: flex !important;
    align-items: center !important;
    position: relative !important;
    box-shadow: none !important;
    transition: all 0.3s ease !important;
}

html body #app .form-adv .v-field--focused {
    border-color: #C8A951 !important;
    box-shadow: 0 0 12px rgba(200, 169, 81, 0.15) !important;
}

/* Sistemin Çizgilerini Gizle */
html body #app .form-adv .v-field__outline,
html body #app .form-adv .v-field__overlay,
html body #app .form-adv .v-field__underlay {
    display: none !important;
}

/* ---------------------------------------------------------
   2. ORİJİNAL BAŞLIKLARI (LABELS) KÖŞEYE SABİTLEME
   --------------------------------------------------------- */
/* Sistemin "Kutu boşken başlığı ortaya al, tıklanınca yukarı taşı" mantığını eziyoruz. 
   Başlıklar her zaman yukarıda, küçülmüş (floating) halde duracak. */
html body #app .form-adv .v-field .v-label {
    position: absolute !important;
    top: 8px !important;
    left: 15px !important;
    transform: translateY(0) scale(1) !important; /* Animasyonla ortaya gelmesini yasaklar */
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: none !important;
    z-index: 5 !important;
}

/* Orijinal başlıkların içindeki yazının stili */
html body #app .form-adv .v-field .textfield-label {
    font-size: 10px !important;
    color: rgba(255, 255, 255, 0.5) !important; /* Boşken Gümüş */
    font-weight: 500 !important;
    letter-spacing: 1px !important;
    transition: color 0.3s ease !important;
    margin: 0 !important;
}

/* Kutuya Tıklanınca veya Doluysa Başlık Saf Altın Rengine Döner */
html body #app .form-adv .v-field.v-field--active .textfield-label,
html body #app .form-adv .v-field.v-field--focused .textfield-label {
    color: #C8A951 !important;
    font-weight: 600 !important;
}

/* ---------------------------------------------------------
   3. YAZILAN METİNLERİN (GİRDİLERİN) HİZASI
   --------------------------------------------------------- */
html body #app .form-adv .v-field__input {
    display: flex !important;
    align-items: flex-end !important;
    padding-top: 24px !important; /* Sabit duran başlığın altına yerleşir */
    padding-bottom: 8px !important;
    padding-left: 15px !important;
    color: #E8E8E8 !important; /* Lüks Gümüş */
    -webkit-text-fill-color: #E8E8E8 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 14px !important;
    min-height: unset !important;
    height: auto !important;
    width: 100% !important;
}

/* ---------------------------------------------------------
   4. TELEFON NUMARASI KUTUSU (VUE-TEL-INPUT)
   --------------------------------------------------------- */
/* Telefon kutusunun altyapısı farklı olduğu için ona özel sabitleme */
html body #app .form-adv .vue-tel-input {
    background-color: #111111 !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 8px !important;
    height: 60px !important;
    position: relative !important;
}

html body #app .form-adv .form-field:focus-within .vue-tel-input {
    border-color: #C8A951 !important;
    box-shadow: 0 0 12px rgba(200, 169, 81, 0.15) !important;
}

html body #app .form-adv .floating-label {
    position: absolute !important;
    top: 8px !important;
    left: 15px !important;
    transform: none !important; /* Sabitleme */
    pointer-events: none !important;
    z-index: 5 !important;
}

html body #app .form-adv .floating-label .textfield-label {
    color: rgba(255, 255, 255, 0.5) !important;
    font-size: 10px !important;
    letter-spacing: 1px !important;
    font-weight: 500 !important;
}

html body #app .form-adv .form-field:focus-within .floating-label .textfield-label {
    color: #C8A951 !important;
    font-weight: 600 !important;
}

html body #app .form-adv .vti__input {
    background: transparent !important;
    color: #E8E8E8 !important;
    font-family: 'Montserrat', sans-serif !important;
    padding-top: 24px !important;
    padding-bottom: 6px !important;
    padding-left: 10px !important;
}
html body #app .form-adv .vti__dropdown {
    padding-top: 15px !important; 
    color: #C8A951 !important;
}

/* ---------------------------------------------------------
   4. TELEFON KUTUSU DÜZENLEMESİ (GİZLENEN BAŞLIK ÇÖZÜMÜ)
   --------------------------------------------------------- */
html body #app .form-adv .form-field[data-cy="address-form-phone"] {
    position: relative !important;
}

html body #app .form-adv .vue-tel-input {
    background-color: #111111 !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 8px !important;
    height: 60px !important;
    position: relative !important;
}

html body #app .form-adv .form-field:focus-within .vue-tel-input {
    border-color: #C8A951 !important;
    box-shadow: 0 0 12px rgba(200, 169, 81, 0.15) !important;
}

/* Telefon başlığı boş olsa bile daima görünür */
html body #app .form-adv .floating-label {
    display: flex !important;
    opacity: 1 !important;
    visibility: visible !important;
    position: absolute !important;
    top: 8px !important;
    left: 15px !important;
    transform: none !important;
    pointer-events: none !important;
    z-index: 10 !important;
}

html body #app .form-adv .floating-label .textfield-label {
    color: rgba(255, 255, 255, 0.5) !important;
    font-size: 10px !important;
    letter-spacing: 1px !important;
    font-weight: 500 !important;
}

html body #app .form-adv .form-field:focus-within .floating-label .textfield-label {
    color: #C8A951 !important;
    font-weight: 600 !important;
}

html body #app .form-adv .vti__input {
    background: transparent !important;
    color: #E8E8E8 !important;
    font-family: 'Montserrat', sans-serif !important;
    padding-top: 24px !important;
    padding-bottom: 6px !important;
    padding-left: 10px !important;
}

html body #app .form-adv .vti__dropdown {
    padding-top: 15px !important; 
    color: #C8A951 !important;
}

/* ---------------------------------------------------------
   5. AÇILIR MENÜ (DROPDOWN) OK İŞARETLERİ
   --------------------------------------------------------- */
html body #app .form-adv .v-field__append-inner {
    display: flex !important;
    align-items: center !important;
    padding-right: 15px !important;
    margin-top: 0 !important;
}

html body #app .form-adv .v-field__append-inner i {
    color: rgba(200, 169, 81, 0.7) !important;
    font-size: 20px !important;
    transition: color 0.3s ease !important;
}

html body #app .form-adv .v-field:hover .v-field__append-inner i {
    color: #C8A951 !important;
}

/* ---------------------------------------------------------
   6. OLUŞTUR / GÜNCELLE BUTONU
   --------------------------------------------------------- */
html body #app .form-adv button.address-form-submit {
    background: linear-gradient(135deg, rgba(200, 169, 81, 0.1) 0%, rgba(200, 169, 81, 0.25) 100%) !important;
    background-color: transparent !important; 
    border: 1px solid #C8A951 !important;
    border-radius: 8px !important;
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: 3px !important;
    text-transform: uppercase !important;
    height: 56px !important;
    margin-top: 20px !important;
    transition: all 0.3s ease !important;
    box-shadow: none !important;
}

html body #app .form-adv button.address-form-submit:hover {
    background: #C8A951 !important;
    background-color: #C8A951 !important;
    color: #0A0A0C !important;
    box-shadow: 0 5px 20px rgba(200, 169, 81, 0.3) !important;
}
/* =========================================================
   THE TUVA: ADRES FORMU METİN ÇAKIŞMASI ÖZEL DÜZELTMESİ (YAMA)
   ========================================================= */

/* 1. Sadece Adres Formunu (.form-adv) Hedef Alıp Yazıyı Aşağı İter */
html body #app .form-adv .v-field__field {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important; /* İçeriği daima aşağı yaslar */
    width: 100% !important;
    height: 100% !important;
}

html body #app .form-adv .v-field__input {
    padding-top: 24px !important; /* Başlık ile yazı arasına kesin bir sınır çeker */
    padding-bottom: 6px !important;
    padding-left: 15px !important;
    display: flex !important;
    align-items: flex-end !important;
    min-height: unset !important;
    height: auto !important;
}

/* 2. Başlıkların Her Zaman Görünür ve Üstte Kalmasını Garantiler */
html body #app .form-adv .v-field .v-label {
    position: absolute !important;
    top: 8px !important;
    left: 15px !important;
    opacity: 1 !important; /* Kutu boş olsa bile başlığı zorla gösterir */
    visibility: visible !important;
    transform: none !important; /* Sistemin başlığı kaydırmasını iptal eder */
}

/* Telefon numarası girdisi için özel hizalama yaması */
html body #app .form-adv .vti__input {
    padding-top: 24px !important;
    padding-bottom: 6px !important;
    padding-left: 10px !important;
}
/* =========================================================
   THE TUVA: FATURA TİPİ VE TELEFON KUTUSU SON DOKUNUŞLAR
   ========================================================= */

/* ---------------------------------------------------------
   1. FATURA TİPİ (BILL TYPE) LÜKS KAPSÜL TASARIMI
   --------------------------------------------------------- */
/* Alanı siyah, altın çerçeveli şık bir kutuya hapsediyoruz */
html body #app .bill-type-wrapper {
    background-color: #111111 !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 8px !important;
    padding: 15px !important;
    margin-bottom: 15px !important;
    margin-top: 10px !important;
}

/* "Bill Type" Üst Başlığı */
html body #app .bill-type-wrapper p.v-label {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    margin-bottom: 15px !important;
    border-bottom: 1px dashed rgba(200, 169, 81, 0.2) !important;
    padding-bottom: 8px !important;
}

/* Sistemin Satıriçi (Inline) Çirkin Rengini Saf Altınla Ezme */
html body #app .bill-type-wrapper .v-selection-control__wrapper {
    color: #C8A951 !important;
    caret-color: #C8A951 !important;
}

html body #app .bill-type-wrapper .v-selection-control__input i {
    color: #C8A951 !important;
}

/* Individual / Institutional Metinleri */
html body #app .bill-type-wrapper label.v-label {
    color: #E8E8E8 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 13px !important;
    letter-spacing: 1px !important;
}

/* ---------------------------------------------------------
   2. TELEFON GİRDİSİ (VUE-TEL-INPUT) BEYAZLIK GİDERİCİ
   --------------------------------------------------------- */
/* Ana kutu beyazlığını kırıp lüks siyah zemin veriyoruz */
html body #app .vue-tel-input {
    background-color: #111111 !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    transition: all 0.3s ease !important;
}

/* Kutunun içine tıklanınca Altın parlama */
html body #app .vue-tel-input:focus-within {
    border-color: #C8A951 !important;
    box-shadow: 0 0 12px rgba(200, 169, 81, 0.15) !important;
}

/* Telefon içindeki sayılar (Lüks Gümüş) */
html body #app .vue-tel-input .vti__input {
    background-color: transparent !important;
    color: #E8E8E8 !important;
    font-family: 'Montserrat', sans-serif !important;
}

/* Sol Taraftaki Bayrak ve Ok (Dropdown) Alanı */
html body #app .vue-tel-input .vti__dropdown {
    background-color: transparent !important;
    border-right: 1px solid rgba(200, 169, 81, 0.2) !important;
}

html body #app .vue-tel-input .vti__dropdown-arrow {
    color: #C8A951 !important; /* Bayrağın yanındaki ok işaretini altın yap */
}

/* Tıklanınca Açılan Ülke Seçim Listesi (Eğer açılıyorsa beyaz kalmasın) */
html body #app .vue-tel-input .vti__dropdown-list {
    background-color: #0A0A0C !important;
    border: 1px solid rgba(200, 169, 81, 0.5) !important;
    color: #E8E8E8 !important;
    border-radius: 8px !important;
    font-family: 'Montserrat', sans-serif !important;
}

/* Ülke Listesinde Üzerine Gelinen Seçenek */
html body #app .vue-tel-input .vti__dropdown-item.highlighted {
    background-color: rgba(200, 169, 81, 0.2) !important;
}
/* =========================================================
   THE TUVA: WEB TARAFI TELEFON VE FATURA TİPİ GLOBAL YAMASI
   ========================================================= */

/* ---------------------------------------------------------
   1. TELEFON GİRDİSİ (VUE-TEL-INPUT) GLOBAL DÜZELTME
   --------------------------------------------------------- */
/* "body" etiketiyle başlayarak hiçbir kısıtlamaya takılmadan her yerde siyah yapar */
body .vue-tel-input {
    background-color: #111111 !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 8px !important;
    height: 60px !important;
    box-shadow: none !important;
}

body .vue-tel-input:focus-within {
    border-color: #C8A951 !important;
    box-shadow: 0 0 12px rgba(200, 169, 81, 0.15) !important;
}

body .vue-tel-input .vti__input {
    background-color: transparent !important;
    color: #E8E8E8 !important;
    font-family: 'Montserrat', sans-serif !important;
    padding-left: 10px !important;
}

body .vue-tel-input .vti__dropdown {
    background-color: transparent !important;
    border-right: 1px solid rgba(200, 169, 81, 0.2) !important;
}

body .vue-tel-input .vti__dropdown-arrow {
    color: #C8A951 !important;
}

/* ---------------------------------------------------------
   2. FATURA TİPİ (BILL TYPE) GLOBAL LÜKS KAPSÜL
   --------------------------------------------------------- */
body .bill-type-wrapper {
    background-color: #111111 !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 8px !important;
    padding: 15px !important;
    margin-top: 15px !important;
    margin-bottom: 15px !important;
}

/* Üst Başlık (Bill Type) */
body .bill-type-wrapper p.v-label {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    border-bottom: 1px dashed rgba(200, 169, 81, 0.2) !important;
    padding-bottom: 8px !important;
    margin-bottom: 15px !important;
}

/* Sistemin Satıriçi Rengini (--primary-button-color) Kökünden Ezme */
body .bill-type-wrapper .v-selection-control__wrapper {
    color: #C8A951 !important;
    caret-color: #C8A951 !important;
}

body .bill-type-wrapper .v-selection-control__input i {
    color: #C8A951 !important;
}

/* Individual / Institutional Yazıları */
body .bill-type-wrapper label.v-label {
    color: #E8E8E8 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 13px !important;
    letter-spacing: 1px !important;
}
/* =========================================================
   THE TUVA: MOBİL "COPY" BUTONU (MİNİMALİST VE LÜKS VERSİYON)
   ========================================================= */

@media (max-width: 768px) {
    html body #app .v-btn__overlay::after {
        content: "COPY" !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        height: 100% !important;
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        
        /* Alttaki ikonu tamamen yutan zifiri siyah zemin */
        background-color: #0A0A0C !important; 
        z-index: 10 !important; 
        
        /* Lüks Yazı Tasarımı (Daha ince, küçük ve aralıklı) */
        color: #C8A951 !important; 
        font-family: 'Montserrat', sans-serif !important;
        font-size: 10px !important; /* Kaba durmaması için font küçültüldü */
        font-weight: 500 !important; /* Kalınlık azaltıldı, zarifleştirildi */
        letter-spacing: 2px !important; /* Harflerin arası açılarak elit bir hava katıldı */
        text-transform: uppercase !important;
        border-radius: inherit !important;
    }
}
/* =========================================================
   THE TUVA: ALIŞVERİŞE DEVAM ET BUTONU LÜKS TASARIMI
   ========================================================= */

html body #app .cart-list--footer {
    display: flex !important;
    justify-content: center !important;
    margin-top: 20px !important;
    padding-bottom: 20px !important;
}

/* Standart link görünümünü ezip Premium Gümüş/Altın temasına sokma */
html body #app .continue-shopping {
    color: rgba(255, 255, 255, 0.6) !important; /* Lüks Gümüş */
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12px !important;
    font-weight: 500 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    text-decoration: none !important;
    border-bottom: 1px solid rgba(200, 169, 81, 0.4) !important; /* İncecik altın alt çizgi */
    padding-bottom: 4px !important;
    transition: all 0.3s ease !important;
}

/* Üzerine gelindiğinde The TUVA Altını parlaması */
html body #app .continue-shopping:hover {
    color: #C8A951 !important; 
    border-bottom-color: #C8A951 !important;
    transform: translateY(-2px) !important; /* Çok hafif ve elit bir yukarı kalkma efekti */
}
/* =========================================================
   THE TUVA: "DÜZENLE" (EDIT) BUTONU LÜKS MİNİMALİZMİ
   ========================================================= */

/* Ana Buton Gövdesi ve Metin (Lüks Gümüş) */
html body #app .edit-button {
    background-color: transparent !important;
    color: rgba(255, 255, 255, 0.6) !important; 
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    transition: all 0.3s ease !important;
    padding: 0 10px !important;
}

/* Sistemin varsayılan gri tıklama gölgesini (overlay) yok et */
html body #app .edit-button .v-btn__overlay {
    display: none !important;
}

/* Üzerine Gelindiğinde (Hover) Altın Işıltısı */
html body #app .edit-button:hover {
    color: #C8A951 !important;
    background-color: rgba(200, 169, 81, 0.05) !important; /* Arkada çok hafif elit bir altın parlaması */
}

/* Kalem İkonu (Daima Altın) */
html body #app .edit-button .v-btn__append i {
    color: #C8A951 !important; 
    font-size: 15px !important;
    margin-left: 5px !important;
    transition: transform 0.3s ease !important;
}

/* Üzerine gelindiğinde kalem ikonu tatlıca büyüsün */
html body #app .edit-button:hover .v-btn__append i {
    transform: scale(1.15) !important;
}





















@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@200;300;400;500;600&display=swap');

/* =========================================================
   THE TUVA: HIGH-END LUXURY VUE.JS SEPET (EDİTÖRYAL SÜRÜM)
   ========================================================= */

/* 1. KUSURSUZ KARANLIK TEMA */
.v-application, .v-application__wrap, .basket-container-wrapper, .v-main { 
    background-color: #030303 !important; 
    color: #fff !important; 
    font-family: 'Montserrat', sans-serif !important; 
}

/* 2. BAŞLIKLAR VE TEMİZLE BUTONU */
.content-header--inner { 
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important; 
    padding-bottom: 20px !important; 
    margin-bottom: 30px !important; 
}
.title-properties { 
    color: #fff !important; 
    font-weight: 400 !important; 
    letter-spacing: 5px !important; 
    text-transform: uppercase !important; 
    font-size: 18px !important; 
    border-bottom: 2px solid #C8A951 !important; 
    display: inline-block !important;
    padding-bottom: 5px !important;
}

button[data-cy="delete-basket-trigger"] { 
    color: #888 !important; 
    text-transform: uppercase !important; 
    letter-spacing: 3px !important; 
    font-size: 10px !important; 
    background: transparent !important; 
}
button[data-cy="delete-basket-trigger"] i { display: none !important; }
button[data-cy="delete-basket-trigger"]::after { content: '✕'; margin-left: 8px; font-size: 14px; }
button[data-cy="delete-basket-trigger"]:hover { color: #fff !important; }

/* 3. ÜCRETSİZ KARGO BİLGİSİ (Mobilde Kilitli ve Lüks) */
.free-cargo, .cargo-information { 
    background: rgba(200, 169, 81, 0.05) !important; 
    border: 1px solid #C8A951 !important; 
    color: #fff !important; 
    font-size: 11px !important; 
    letter-spacing: 2px !important; 
    text-transform: uppercase !important; 
    padding: 15px 20px !important; 
    justify-content: flex-start !important; 
    font-weight: 400 !important;
    border-radius: 2px !important;
    position: relative !important;
    top: auto !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;
    margin-bottom: 30px !important;
    z-index: 10 !important;
    display: flex !important;
    width: 100% !important;
}
.free-cargo svg { width: 20px !important; height: 20px !important; margin-right: 15px !important; color: #C8A951 !important; }

/* 4. ÜRÜN LİSTESİ */
.basket-item { 
    background: transparent !important; 
    border: none !important; 
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important; 
    padding: 40px 0 !important; 
    border-radius: 0 !important; 
    box-shadow: none !important; 
}
.basket-item-image img { border-radius: 2px !important; border: 1px solid rgba(255,255,255,0.05) !important;}

/* Karışıklığı Önleyen 2 Satır İsim Kısıtlaması */
.basket-item-product-name span { 
    color: #fff !important; 
    font-size: 13px !important; 
    font-weight: 500 !important; 
    letter-spacing: 1.5px !important; 
    line-height: 1.6 !important; 
    text-transform: uppercase !important; 
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important; 
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
}
.basket-item-product-name:hover span { color: #C8A951 !important; }

.basket-item-favorite-button i { color: #888 !important; }
.basket-item-favorite-button:hover i { color: #C8A951 !important; }

/* Detaylar */
.extra-informations, .basket-item-cargo-date { 
    color: #888 !important; 
    font-size: 10px !important; 
    letter-spacing: 2px !important; 
    text-transform: uppercase !important; 
    margin-top: 10px !important; 
}
.basket-item-variation-chip { 
    background: rgba(200, 169, 81, 0.05) !important; 
    color: #C8A951 !important; 
    border: 1px solid rgba(200, 169, 81, 0.4) !important; 
    font-size: 10px !important; 
    letter-spacing: 2px !important; 
    text-transform: uppercase !important; 
    border-radius: 2px !important; 
    padding: 6px 15px !important;
}

/* 5. MÜKEMMEL ADET SEÇİCİ (- 1 +) */
.counter { 
    background: transparent !important; 
    border: 1px solid rgba(255, 255, 255, 0.2) !important; 
    border-radius: 2px !important; 
    height: 40px !important; 
    padding: 0 !important; 
}
.counter-button { color: #aaa !important; width: 35px !important; background: transparent !important; }
.counter-button i { font-size: 16px !important; }
.counter-button:hover { color: #fff !important; background: rgba(255,255,255,0.05) !important; }
.counter-text { 
    color: #C8A951 !important; 
    font-weight: 600 !important; 
    font-family: 'Montserrat' !important; 
    font-size: 15px !important; 
    background: transparent !important; 
    border: none !important;
}
.counter-unit { display: none !important; }

.customize-basket-price span, .price-text { 
    color: #C8A951 !important; 
    font-size: 20px !important; 
    font-weight: 500 !important; 
    letter-spacing: 1px !important; 
}

/* =========================================================
   6. SİPARİŞ ÖZETİ (ORDER SUMMARY) - BEYAZ KUTU İPTALİ
   ========================================================= */
.order-summary { padding-left: 40px !important; }
@media (max-width: 960px) { .order-summary { padding: 30px 0 0 0 !important; } }

.order-summary-card, .order-summary-list, .total-price-card {
    background-color: #080808 !important;
    border: 1px solid rgba(200, 169, 81, 0.15) !important;
    border-radius: 2px !important;
    box-shadow: none !important;
    margin-bottom: 20px !important;
    padding: 25px !important;
}

.order-summary-card-title {
    color: #C8A951 !important;
    font-size: 14px !important;
    letter-spacing: 4px !important;
    text-transform: uppercase !important;
    font-weight: 500 !important;
    border-bottom: none !important;
}

.total-price-card { background-color: #050505 !important; border-color: #C8A951 !important; align-items: center !important;}
.total-price-card .order-summary-card-title { font-size: 12px !important; color: #fff !important; }
.total-price-card .basket-total-price { font-size: 24px !important; color: #C8A951 !important; font-weight: 400 !important; }

.order-summary-list-item { padding: 15px 0 !important; }
.list-item-key { color: #888 !important; font-size: 11px !important; letter-spacing: 2px !important; text-transform: uppercase !important; }
.list-item-value { color: #fff !important; font-size: 14px !important; font-weight: 400 !important; letter-spacing: 1px !important;}
.order-summary-divider { border-color: rgba(255,255,255,0.05) !important; margin: 0 !important;}
.free-text { color: #C8A951 !important; font-weight: 600 !important; letter-spacing: 3px !important; text-transform: uppercase !important;}

/* =========================================================
   7. HEDİYE ÇEKİ / KUPON ALANI ZIRHI
   ========================================================= */
.feature-button { 
    background: #080808 !important;
    border: 1px solid rgba(200, 169, 81, 0.15) !important;
    border-radius: 2px !important;
    padding: 25px 20px !important;
    margin-bottom: 15px !important;
    transition: all 0.4s ease !important;
}
.feature-button:hover { border-color: #C8A951 !important; background: #050505 !important;}
.feature-button-label { color: #aaa !important; font-size: 11px !important; letter-spacing: 2px !important; text-transform: uppercase !important; }
.feature-button-label span { color: #C8A951 !important; font-weight: 600 !important; letter-spacing: 3px !important; }
.feature-button .icon svg { color: #C8A951 !important; fill: #C8A951 !important; }
.feature-button-operation-wrapper i { color: #C8A951 !important; }

.v-input__control, .v-field { background: transparent !important; box-shadow: none !important; border-radius: 0 !important;}
.v-field__outline { display: none !important; } 
.v-field__field input { 
    border-bottom: 1px solid #C8A951 !important; 
    color: #C8A951 !important; 
    font-family: 'Montserrat' !important; 
    font-size: 14px !important; 
    letter-spacing: 2px !important; 
    text-align: center !important; 
    padding: 10px !important;
}

/* =========================================================
   8. ANA SİPARİŞ BUTONU (Solid Gold)
   ========================================================= */
.mobile-order-summary { background: #080808 !important; border-top: 1px solid rgba(200, 169, 81, 0.3) !important; }
.total-text { color: #aaa !important; font-size: 11px !important; letter-spacing: 3px !important; text-transform: uppercase !important; }

.btn-success, .btn-primary {
    background: #C8A951 !important; 
    color: #000 !important; 
    font-family: 'Montserrat', sans-serif !important; 
    font-size: 13px !important; 
    font-weight: 600 !important; 
    letter-spacing: 4px !important; 
    text-transform: uppercase !important; 
    border-radius: 2px !important; 
    border: none !important; 
    box-shadow: 0 5px 15px rgba(200, 169, 81, 0.2) !important; 
    padding: 25px 0 !important; 
    width: 100% !important; 
    text-align: center !important; 
    transition: all 0.4s ease !important;
    margin-top: 15px !important;
    height: auto !important;
}
.btn-success:hover, .btn-primary:hover { 
    background: #e0be62 !important; 
    letter-spacing: 6px !important; 
    transform: translateY(-2px) !important;
}

.cart-list--footer .continue-shopping { 
    color: #C8A951 !important; 
    font-size: 11px !important; 
    letter-spacing: 4px !important; 
    text-transform: uppercase !important; 
    text-decoration: none !important; 
    border-bottom: 1px solid #C8A951 !important; 
    padding-bottom: 5px !important; 
    transition: all 0.3s ease !important;
    font-weight: 500 !important;
}
.cart-list--footer .continue-shopping:hover { color: #fff !important; border-color: #fff !important; }


/* =========================================================
   9. ÖNERİLEN ÜRÜNLER (ELİT MÜZE GALERİSİ & GOLD ÇERÇEVELER)
   ========================================================= */

.section-title { 
    color: #C8A951 !important; 
    font-size: 15px !important; 
    font-weight: 300 !important; 
    letter-spacing: 10px !important; 
    text-transform: uppercase !important; 
    text-align: center !important; 
    border-bottom: none !important; 
    margin-bottom: 60px !important; 
}
.section-title::after { content: ''; display: block; width: 40px; height: 1px; background: #C8A951; margin: 20px auto 0 auto; opacity: 0.8; }

/* Swiper Slaytları Düzenlemesi */
.slider-wrapper .swiper-slide {
    padding: 10px !important; 
    box-sizing: border-box !important;
    height: auto !important; 
    min-width: 280px !important; 
}

/* GALERİ KASASI (Dış Altın Çerçeve) */
.product-card {
    background: #030303 !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important; 
    padding: 25px !important; 
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important; 
    height: 100% !important; 
    border-radius: 0 !important; 
    transition: all 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

.product-card:hover {
    border-color: #C8A951 !important;
    box-shadow: 0 20px 50px rgba(200, 169, 81, 0.15) !important;
    transform: translateY(-8px) !important;
}

/* FOTOĞRAF ALANI */
.product-card--image {
    display: block !important;
    width: 100% !important;
    border: 1px solid rgba(200, 169, 81, 0.2) !important; 
    padding: 5px !important; 
    background: #000 !important;
    overflow: hidden !important;
    border-radius: 0 !important;
}

.product-card--image img {
    width: 100% !important;
    aspect-ratio: 4/5 !important; 
    object-fit: cover !important;
    filter: brightness(0.85) contrast(1.1) grayscale(15%) !important; 
    transition: all 0.8s cubic-bezier(0.25, 1, 0.5, 1) !important;
    display: block !important;
}

.product-card:hover .product-card--image img {
    filter: brightness(1.05) contrast(1) grayscale(0%) !important;
    transform: scale(1.05) !important;
}

/* =========================================================
   VUE.JS İSİM KESME ZIRHI (TAŞMAYA KARŞI KESİN KİLİT)
   ========================================================= */
/* Orijinal uzun metni tamamen gizle, sınırlarını çerçeveye mühürle */
.product-card--title,
.basket-item-product-name span {
    font-size: 0 !important; 
    color: transparent !important;
    display: block !important;
    margin: 0 !important;
    line-height: normal !important; 
    position: relative !important;
    width: 100% !important; /* Kutu sınırlarına kilitler */
    max-width: 100% !important; /* Dışarı sarkmayı engeller */
}

/* Kısa imzayı (data-tuva-title) ekrana kusursuzca bas */
.product-card--title::after,
.basket-item-product-name span::after {
    content: attr(data-tuva-title) !important;
    text-transform: uppercase !important;
    display: block !important;
    font-size: 11px !important; /* Lüks bir denge için 1 punto küçüldü */
    line-height: 1.5 !important;
    width: 100% !important; 
    overflow: hidden !important; /* Çerçeveden taşan her şeyi acımasızca keser */
    white-space: nowrap !important; /* Yazının asabiyet yapıp yayılmasını engeller */
    text-overflow: ellipsis !important; /* Sığmayan kısmın sonuna zarifçe ... koyar */
    box-sizing: border-box !important;
}

/* Önerilen Ürün (Galeri) Başlık Görünümü */
.product-card--title::after {
    color: #fff !important; 
    font-weight: 500 !important;
    letter-spacing: 3px !important; /* Taşmayı önlemek için ferahlık 1 tık dengelendi */
    margin-top: 30px !important; 
    margin-bottom: 15px !important;
    text-align: center !important;
    transition: color 0.4s ease !important;
}
.product-card:hover .product-card--title::after { color: #C8A951 !important; }

/* Sepet İçi Başlık Görünümü */
.basket-item-product-name span::after {
    color: #C8A951 !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    letter-spacing: 2px !important;
}
.basket-item-product-name:hover span::after { color: #fff !important; }

/* FİYAT */
.product-card--price {
    color: rgba(200, 169, 81, 0.7) !important;
    font-size: 14px !important;
    font-weight: 300 !important;
    letter-spacing: 3px !important;
    text-align: center !important;
    margin-bottom: 30px !important;
}

/* ADD TO BASKET BUTONU */
.product-card_button {
    background: transparent !important;
    color: #C8A951 !important;
    border: 1px solid #C8A951 !important;
    font-size: 10px !important;
    font-weight: 500 !important;
    letter-spacing: 5px !important;
    text-transform: uppercase !important;
    padding: 16px 0 !important;
    width: 100% !important; 
    border-radius: 0 !important;
    margin-top: auto !important; 
    display: flex !important; 
    justify-content: center !important;
    align-items: center !important;
    white-space: nowrap !important; 
    transition: all 0.5s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    cursor: pointer !important;
}
.product-card_button:hover {
    background: #C8A951 !important;
    color: #000 !important;
    letter-spacing: 8px !important; 
    box-shadow: 0 10px 25px rgba(200, 169, 81, 0.3) !important;
}

.cargo-badge { display: none !important; } 
.swiper-button-prev, .swiper-button-next { color: #C8A951 !important; }


/* =========================================================
   10. HEDİYE ÇEKİ PENCERESİ (ULTRA-LUXURY DAVETİYE)
   ========================================================= */
.v-overlay__content .v-card {
    background-color: #030303 !important;
    border: none !important;
    border-radius: 0 !important; 
    box-shadow: 0 40px 100px rgba(0,0,0,1) !important;
    padding: 20px !important; 
}
.v-overlay__content .dialog-title-wrapper {
    border-bottom: none !important;
    padding: 30px 20px 10px 20px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
}
.v-overlay__content .dialog-title {
    color: #fff !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 14px !important;
    font-weight: 300 !important;
    letter-spacing: 8px !important; 
    text-transform: uppercase !important;
    text-align: center !important;
}
.v-overlay__content .dialog-title-wrapper::after {
    content: '';
    display: block;
    width: 30px;
    height: 1px;
    background: #C8A951;
    margin-top: 20px;
    opacity: 0.8;
}
.v-overlay__content .dialog-title-wrapper .v-btn {
    position: absolute !important;
    top: 5px !important;
    right: 5px !important;
    color: #444 !important;
    transition: all 0.5s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}
.v-overlay__content .dialog-title-wrapper .v-btn:hover {
    color: #C8A951 !important;
    transform: rotate(90deg) scale(1.2) !important;
    background: transparent !important;
}
.v-overlay__content .v-form {  padding: 20px 40px 40px 40px !important; }
.v-overlay__content .v-field {
    background-color: transparent !important; 
    border-radius: 0 !important;
    box-shadow: none !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important; 
    transition: all 0.5s ease !important;
    padding: 10px 0 !important;
    margin-bottom: 25px !important;
}
.v-overlay__content .v-field:hover, 
.v-overlay__content .v-field--focused {
    border-bottom-color: #C8A951 !important;
}
.v-overlay__content .v-field__outline { display: none !important; }
.v-overlay__content .v-input__control { background: transparent !important; }
.v-overlay__content .v-field-label {
    color: #555 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 10px !important;
    letter-spacing: 4px !important;
    text-transform: uppercase !important;
    font-weight: 300 !important;
}
.v-overlay__content .v-field__input, 
.v-overlay__content .v-field__input input {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 16px !important;
    letter-spacing: 4px !important;
    font-weight: 400 !important;
    text-align: center !important; 
}
.v-overlay__content .mdi-chevron-down { color: #C8A951 !important; opacity: 0.4; }
.v-overlay__container .v-list {
    background-color: #030303 !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
    color: #fff !important;
    border-radius: 0 !important;
}
.v-overlay__container .v-list-item:hover {
    background-color: rgba(200, 169, 81, 0.05) !important;
    color: #C8A951 !important;
}
.v-overlay__content button[type="submit"] {
    background: #C8A951 !important;
    color: #000 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: 6px !important;
    text-transform: uppercase !important;
    border-radius: 0 !important;
    padding: 25px 0 !important;
    margin-top: 20px !important;
    height: auto !important;
    box-shadow: 0 10px 20px rgba(200, 169, 81, 0.1) !important;
    transition: all 0.5s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    width: 100% !important;
}
.v-overlay__content button[type="submit"]:hover {
    background: #e0be62 !important;
    letter-spacing: 9px !important; 
    box-shadow: 0 15px 30px rgba(200, 169, 81, 0.3) !important;
    transform: translateY(-3px) !important;
}
.v-overlay__content button[type="submit"] .v-btn__overlay { display: none !important; }


/* =========================================================
   HEDİYE ÇEKİ PENCERESİ - LİSTE İPTALİ VE SADELEŞTİRME
   ========================================================= */
div[data-cy="gift-voucher-list"] {
    display: none !important; visibility: hidden !important; height: 0 !important; margin: 0 !important; padding: 0 !important; position: absolute !important;
}
div[data-cy="gift-voucher-input"] { margin-top: 20px !important; margin-bottom: 35px !important; }
div[data-cy="gift-voucher-input"] .v-field__field input {
    font-size: 16px !important; letter-spacing: 5px !important; text-align: center !important; padding-bottom: 15px !important;
}
div[data-cy="gift-voucher-input"] .v-field-label { letter-spacing: 4px !important; font-size: 11px !important; }


/* =========================================================
   10. HEDİYE ÇEKİ PENCERESİ (FROSTED GLASS & GOLD VURGULAR)
   ========================================================= */
.v-overlay__content .v-card {
    background: rgba(10, 10, 10, 0.7) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border: 1px solid rgba(200, 169, 81, 0.15) !important;
    border-radius: 0 !important; 
    box-shadow: 0 40px 100px rgba(0,0,0,0.9) !important;
    padding: 20px 30px !important; 
}


/* =========================================================
   12. ÜRÜN SİLME ONAY PENCERESİ (PREMIUM DELETE DRAWER)
   ========================================================= */
.v-navigation-drawer.tc-drawer, 
.v-navigation-drawer__content {
    background-color: #050505 !important;
    border-top: 1px solid rgba(200, 169, 81, 0.2) !important;
    color: #fff !important;
    font-family: 'Montserrat', sans-serif !important;
    box-shadow: 0 -30px 80px rgba(0,0,0,0.95) !important;
}

/* ADD TO BASKET BUTONU (Alta Kilitli, Şık Çerçeveli) */
.product-card_button {
    background: transparent !important;
    color: #C8A951 !important;
    border: 1px solid #C8A951 !important;
    font-size: 10px !important;
    font-weight: 500 !important;
    letter-spacing: 5px !important;
    text-transform: uppercase !important;
    padding: 16px 0 !important;
    width: 100% !important; 
    border-radius: 0 !important;
    margin-top: auto !important; /* Tüm butonları en alta hizalar */
    display: flex !important; 
    justify-content: center !important;
    align-items: center !important;
    white-space: nowrap !important; 
    transition: all 0.5s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    cursor: pointer !important;
}

.product-card_button:hover {
    background: #C8A951 !important;
    color: #000 !important;
    letter-spacing: 8px !important; 
    box-shadow: 0 10px 25px rgba(200, 169, 81, 0.3) !important;
}

.cargo-badge { display: none !important; } 
.swiper-button-prev, .swiper-button-next { color: #C8A951 !important; }
/* ADD TO BASKET BUTONU (Solid Gold Hayalet) */
.product-card_button {
    background: transparent !important;
    color: #C8A951 !important;
    border: 1px solid #C8A951 !important; /* Keskin altın çerçeve */
    font-size: 10px !important;
    font-weight: 500 !important;
    letter-spacing: 5px !important;
    text-transform: uppercase !important;
    padding: 18px 0 !important;
    width: 100% !important; 
    border-radius: 0 !important;
    margin-top: auto !important; 
    transition: all 0.5s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    cursor: pointer !important;
}

.product-card_button:hover {
    background: #C8A951 !important;
    color: #000 !important;
    letter-spacing: 8px !important; 
    box-shadow: 0 10px 25px rgba(200, 169, 81, 0.3) !important;
}

.cargo-badge { display: none !important; } 
.swiper-button-prev, .swiper-button-next { color: #C8A951 !important; }

/* =========================================================
   ADD TO BASKET BUTONU: İnce Çerçeveli Hayalet Buton (Ghost Button)
   ========================================================= */
.product-card_button {
    background: transparent !important;
    color: #fff !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important; /* Jilet gibi ince beyaz çerçeve */
    font-size: 9px !important;
    font-weight: 500 !important;
    letter-spacing: 4px !important;
    text-transform: uppercase !important;
    padding: 16px 0 !important;
    width: 100% !important; /* Kartın enini tamamen kaplar */
    border-radius: 0 !important;
    margin-top: auto !important; /* Fiyat ile buton arasını sonsuz açar, tüm butonları en alta kilitler! */
    transition: all 0.5s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    cursor: pointer !important;
}

/* Buton Üzerine Gelince: Tamamen Solid Gold'a dönüşür ve Parlar */
.product-card_button:hover {
    background: #C8A951 !important;
    color: #000 !important;
    border-color: #C8A951 !important;
    letter-spacing: 7px !important; /* Lüks davetkâr açılma efekti */
    box-shadow: 0 10px 25px rgba(200, 169, 81, 0.25) !important;
}

.cargo-badge { display: none !important; } 
.swiper-button-prev, .swiper-button-next { color: #C8A951 !important; }



/* Altın Çerçeveli Şık Sepet Butonu */

.product-card_button { 

    background: transparent !important; 

    color: #C8A951 !important; 

    border: 1px solid #C8A951 !important; 

    font-size: 9px !important; 

    font-weight: 500 !important;

    letter-spacing: 3px !important; 

    text-transform: uppercase !important; 

    padding: 15px 0 !important; 

    margin-top: 20px !important; 

    border-radius: 0 !important;

}

.product-card_button:hover { background: #C8A951 !important; color: #000 !important; letter-spacing: 5px !important;}



.cargo-badge { display: none !important; } 

.swiper-button-prev, .swiper-button-next { color: #C8A951 !important; }

/* =========================================================

   HEDİYE ÇEKİ / PAKET KUTULARI (BEYAZLIK İPTALİ)

   ========================================================= */

/* Ticimax'in gizli beyaz arka planlarını eziyoruz */

.basket-inner, .basket-actions {

    background: transparent !important;

    border: none !important;

    box-shadow: none !important;

}



/* Kutu Tasarımlarını Lüks Butonlara Çevir */

.basket-actions .feature-button { 

    background: #050505 !important;

    border: 1px solid rgba(200, 169, 81, 0.3) !important;

    border-radius: 2px !important;

    padding: 20px 25px !important;

    margin-bottom: 15px !important;

    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1) !important;

    display: flex !important;

    align-items: center !important;

}

.basket-actions .feature-button:hover { 

    border-color: #C8A951 !important; 

    background: rgba(200, 169, 81, 0.05) !important;

    transform: translateX(5px) !important; /* Üzerine gelince hafifçe sağa kayarak davet eder */

}

.feature-button-label { 

    color: #fff !important; 

    font-size: 11px !important; 

    letter-spacing: 3px !important; 

    text-transform: uppercase !important; 

    font-weight: 400 !important;

}

.basket-actions .feature-button .icon svg { fill: #C8A951 !important; width: 20px !important; height: 20px !important; margin-right: 15px !important;}

.feature-button-operation-wrapper i { color: #C8A951 !important; }



/* O çirkin yeşil "Free" yazısını Altın yap */

.feature-button-label span[style*="rgb(0, 199, 83)"],

.feature-button-label span[style*="color: rgb(0, 199, 83)"] {

    color: #C8A951 !important;

    font-weight: 600 !important;

    letter-spacing: 4px !important;

}



/* =========================================================

   ÖNERİLEN ÜRÜNLER (TAMAMEN GOLD BAŞLIKLAR)

   ========================================================= */

.product-card--title { 

    color: #C8A951 !important; /* İstediğiniz gibi direkt Gold */

    font-size: 11px !important; 

    font-weight: 500 !important; 

    letter-spacing: 3px !important; 

    text-transform: uppercase !important; 

    margin-top: 25px !important; 

    display: block !important;

    text-align: center !important;

    text-shadow: 0 0 10px rgba(200, 169, 81, 0.1) !important;

    /* Uzunluğu JS ile keseceğimiz için line-clamp'e gerek kalmadı, ama yedeğe alalım */

    white-space: nowrap !important;

    overflow: hidden !important;

    text-overflow: ellipsis !important;

}

.product-card--title:hover { color: #fff !important; }

(function() {
    // =========================================================
    // TUVA COLLECTION: VUE.JS KÖR EDİCİ (Data Attribute Hilesi)
    // =========================================================

    function setShortTitlesForVue() {
        var titles = document.querySelectorAll('.product-card--title, .basket-item-product-name span');
        
        titles.forEach(function(el) {
            var text = el.textContent || el.innerText;
            
            // Metin içinde | varsa
            if (text && text.indexOf('|') > -1) {
                var shortTitle = text.split('|')[0].trim();
                
                // Elemana özel bir 'data-short-title' etiketi tak.
                // Vue.js içi silinmediği için buna müdahale etmez.
                if (el.getAttribute('data-short-title') !== shortTitle) {
                    el.setAttribute('data-short-title', shortTitle);
                }
            }
        });
    }

    // Vue'nun her nefes alışında (DOM güncellemelerinde) rozetleri kontrol et
    var vueObserver = new MutationObserver(setShortTitlesForVue);
    vueObserver.observe(document.body, { childList: true, subtree: true, characterData: true });

    // Sayfa yüklenirken ve periyodik olarak garantiye al (Vue çok inatçıdır)
    document.addEventListener("DOMContentLoaded", setShortTitlesForVue);
    setInterval(setShortTitlesForVue, 250); // Saniyede 4 kez kontrol et, asla kaçırmaz!
})();

/* =========================================================
   10. HEDİYE ÇEKİ / KUPON PENCERESİ (ULTRA-LUXURY DAVETİYE)
   ========================================================= */

/* Kasa: Keskin Hatlar, Zifiri Siyah ve Derin Gölge (Çerçevesiz) */
.v-overlay__content .v-card {
    background-color: #030303 !important;
    border: none !important;
    border-radius: 0 !important; /* Jilet gibi keskin hatlar */
    box-shadow: 0 40px 100px rgba(0,0,0,1) !important;
    padding: 20px !important; 
}

/* Üst Başlık: Ortalanmış, Ferah, Dergi Kapağı Çizgisi */
.v-overlay__content .dialog-title-wrapper {
    border-bottom: none !important;
    padding: 30px 20px 10px 20px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
}

.v-overlay__content .dialog-title {
    color: #fff !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 14px !important;
    font-weight: 300 !important;
    letter-spacing: 8px !important; /* Ultra ferah aralık */
    text-transform: uppercase !important;
    text-align: center !important;
}

/* Başlığın Altındaki Şık Lüks Vurgu (Minimalist İmza) */
.v-overlay__content .dialog-title-wrapper::after {
    content: '';
    display: block;
    width: 30px;
    height: 1px;
    background: #C8A951;
    margin-top: 20px;
    opacity: 0.8;
}

/* Kapatma (X) İkonu: Sağ üstte özgür ve ince */
.v-overlay__content .dialog-title-wrapper .v-btn {
    position: absolute !important;
    top: 5px !important;
    right: 5px !important;
    color: #444 !important;
    transition: all 0.5s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}
.v-overlay__content .dialog-title-wrapper .v-btn:hover {
    color: #C8A951 !important;
    transform: rotate(90deg) scale(1.2) !important;
    background: transparent !important;
}

/* Form Alanı Nefes Alsın */
.v-overlay__content .v-form {
    padding: 20px 40px 40px 40px !important;
}

/* ------------------------------------- */
/* KUSURSUZ ŞEFFAF GİRİŞ (INPUT) ALANLARI */
/* ------------------------------------- */
.v-overlay__content .v-field {
    background-color: transparent !important; 
    border-radius: 0 !important;
    box-shadow: none !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important; /* Sadece incecik silik bir zemin çizgisi */
    transition: all 0.5s ease !important;
    padding: 10px 0 !important;
    margin-bottom: 25px !important;
}
/* Odaklanıldığında çizgi altına parlar */
.v-overlay__content .v-field:hover, 
.v-overlay__content .v-field--focused {
    border-bottom-color: #C8A951 !important;
}

/* Ticimax(Vuetify) Gri Arka Planları Kökten Siliniyor */
.v-overlay__content .v-field__outline { display: none !important; }
.v-overlay__content .v-input__control { background: transparent !important; }

/* Kılavuz Yazı (Label): Küçük, Zarif, Asil */
.v-overlay__content .v-field-label {
    color: #555 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 10px !important;
    letter-spacing: 4px !important;
    text-transform: uppercase !important;
    font-weight: 300 !important;
}

/* Müşterinin Yazdığı Metin (Merkezlenmiş Parlak Gold) */
.v-overlay__content .v-field__input, 
.v-overlay__content .v-field__input input {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 16px !important;
    letter-spacing: 4px !important;
    font-weight: 400 !important;
    text-align: center !important; /* Yazı ortadan başlar */
}

/* Açılır Ok Şeffaflığı */
.v-overlay__content .mdi-chevron-down { color: #C8A951 !important; opacity: 0.4; }

/* Dropdown Menü (Seçenekler İçeriği) */
.v-overlay-container .v-list {
    background-color: #030303 !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
    color: #fff !important;
    border-radius: 0 !important;
}
.v-overlay-container .v-list-item:hover {
    background-color: rgba(200, 169, 81, 0.05) !important;
    color: #C8A951 !important;
}

/* ------------------------------------- */
/* "APPLY / Ekle" BUTONU (Uçtan Uca Solid Gold) */
/* ------------------------------------- */
.v-overlay__content button[type="submit"] {
    background: #C8A951 !important;
    color: #000 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    letter-spacing: 6px !important;
    text-transform: uppercase !important;
    border-radius: 0 !important;
    padding: 25px 0 !important;
    margin-top: 20px !important;
    height: auto !important;
    box-shadow: 0 10px 20px rgba(200, 169, 81, 0.1) !important;
    transition: all 0.5s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    width: 100% !important;
}
.v-overlay__content button[type="submit"]:hover {
    background: #e0be62 !important;
    letter-spacing: 9px !important; /* Muazzam genişleme efekti */
    box-shadow: 0 15px 30px rgba(200, 169, 81, 0.3) !important;
    transform: translateY(-3px) !important;
}
.v-overlay__content button[type="submit"] .v-btn__overlay { display: none !important; }
/* =========================================================
   HEDİYE ÇEKİ PENCERESİ - LİSTE İPTALİ VE SADELEŞTİRME
   ========================================================= */

/* 1. Gereksiz "Gift Voucher List" (Açılır Menü) kısmını kökten yok et */
div[data-cy="gift-voucher-list"] {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    position: absolute !important;
}

/* 2. Kalan Tek Input Alanını (Kod Girme Yeri) Daha Ferah ve Odaklı Yap */
div[data-cy="gift-voucher-input"] {
    margin-top: 20px !important;
    margin-bottom: 35px !important;
}

/* 3. Input Yazılarını ve Çizgisini Kusursuzlaştır */
div[data-cy="gift-voucher-input"] .v-field__field input {
    font-size: 16px !important; /* Yazı boyutunu hafif büyüt */
    letter-spacing: 5px !important; /* Harf aralığını açarak lüks hissini artır */
    text-align: center !important;
    padding-bottom: 15px !important;
}

/* Kılavuz (Placeholder) Yazısı */
div[data-cy="gift-voucher-input"] .v-field-label {
    letter-spacing: 4px !important;
    font-size: 11px !important;
}


/* =========================================================
   10. HEDİYE ÇEKİ PENCERESİ (FROSTED GLASS & GOLD VURGULAR)
   ========================================================= */

/* Kasa: Yarı saydam füme cam ve ince altın yansıma */
.v-overlay__content .v-card {
    background: rgba(10, 10, 10, 0.7) !important;
    backdrop-filter: blur(20px) !important;
    -webkit-backdrop-filter: blur(20px) !important;
    border: 1px solid rgba(200, 169, 81, 0.15) !important;
    border-radius: 0 !important; 
    box-shadow: 0 40px 100px rgba(0,0,0,0.9) !important;
    padding: 20px 30px !important; 
}

/* Üst Başlık */
.v-overlay__content .dialog-title-wrapper {
    border-bottom: none !important;
    padding: 30px 20px 10px 20px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
}

.v-overlay__content .dialog-title {
    color: #fff !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 13px !important;
    font-weight: 300 !important; 
    letter-spacing: 7px !important; 
    text-transform: uppercase !important;
    text-align: center !important;
}

.v-overlay__content .dialog-title-wrapper::after {
    content: '';
    display: block;
    width: 20px;
    height: 1px;
    background: #C8A951;
    margin-top: 20px;
}

/* Kapatma İkonu */
.v-overlay__content .dialog-title-wrapper .v-btn {
    position: absolute !important;
    top: 5px !important;
    right: 5px !important;
    color: rgba(255, 255, 255, 0.4) !important;
    transition: all 0.5s ease !important;
}
.v-overlay__content .dialog-title-wrapper .v-btn:hover {
    color: #C8A951 !important;
    transform: rotate(90deg) scale(1.1) !important;
    background: transparent !important;
}

.v-overlay__content .v-form {
    padding: 20px 40px 40px 40px !important;
}

/* ------------------------------------- */
/* GİRİŞ ALANI (ÇAKIŞMA VE KUTU ÇÖZÜMÜ) */
/* ------------------------------------- */
/* Gereksiz Listeyi Gizle */
div[data-cy="gift-voucher-list"] {
    display: none !important; visibility: hidden !important; height: 0 !important; margin: 0 !important; padding: 0 !important; position: absolute !important;
}
div[data-cy="gift-voucher-input"] {
    margin-top: 20px !important; margin-bottom: 35px !important;
}

/* Çirkin beyaz kutuyu (outline) tamamen yok et */
.v-overlay__content .v-input__control,
.v-overlay__content .v-field,
.v-overlay__content .v-field__outline,
.v-overlay__content .v-field__outline::before,
.v-overlay__content .v-field__outline::after {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
}

/* Sadece en alta zarif bir gold çizgi bırak */
.v-overlay__content .v-field {
    border-bottom: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 0 !important;
    padding: 0 !important;
    transition: border-color 0.4s ease !important;
}
.v-overlay__content .v-field:hover, 
.v-overlay__content .v-field--focused {
    border-bottom-color: #C8A951 !important;
}

/* ÇAKIŞMA ÇÖZÜMÜ: Form doluyken veya tıklanınca "GIFT VOUCHER" yazısını tamamen GİZLE */
.v-overlay__content .v-field-label--floating {
    opacity: 0 !important;
    display: none !important;
    visibility: hidden !important;
}

/* Boşken görünen kılavuz yazı (Tam ortalanmış) */
.v-overlay__content .v-field-label {
    color: rgba(255, 255, 255, 0.4) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    letter-spacing: 5px !important;
    text-transform: uppercase !important;
    font-weight: 300 !important;
    width: 100% !important;
    text-align: center !important;
    left: 0 !important;
    transform: none !important;
}

/* Müşterinin Yazdığı Metin (TUVA15) */
.v-overlay__content .v-field__input, 
.v-overlay__content .v-field__input input {
    color: #fff !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 16px !important;
    letter-spacing: 5px !important;
    font-weight: 400 !important;
    text-align: center !important; 
    padding: 15px 0 !important;
    width: 100% !important;
}

/* ------------------------------------- */
/* "APPLY" BUTONU (Solid Gold Geri Döndü!) */
/* ------------------------------------- */
.v-overlay__content button[type="submit"] {
    background: #C8A951 !important;
    color: #000 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: 6px !important;
    text-transform: uppercase !important;
    border-radius: 0 !important;
    border: none !important;
    padding: 25px 0 !important;
    margin-top: 20px !important;
    height: auto !important;
    box-shadow: 0 10px 20px rgba(200, 169, 81, 0.15) !important;
    transition: all 0.5s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    width: 100% !important;
}
.v-overlay__content button[type="submit"]:hover {
    background: #e0be62 !important;
    letter-spacing: 9px !important; 
    box-shadow: 0 15px 30px rgba(200, 169, 81, 0.3) !important;
    transform: translateY(-3px) !important;
}
.v-overlay__content button[type="submit"] .v-btn__overlay { display: none !important; }


/* =========================================================
   11. SEPETE EKLE VARYASYON PENCERESİ (PREMIUM GRID MODAL)
   ========================================================= */

/* Ana Kasa */
.modal-container {
    background-color: #030303 !important;
    border: 1px solid rgba(200, 169, 81, 0.15) !important;
    border-radius: 0 !important;
    box-shadow: 0 40px 100px rgba(0,0,0,0.9) !important;
    color: #fff !important;
    font-family: 'Montserrat', sans-serif !important;
    padding: 30px !important;
}

/* Başlık Alanı */
.modal-header {
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    padding-bottom: 25px !important;
    margin-bottom: 25px !important;
    display: flex !important;
    justify-content: space-between !important;
    align-items: center !important;
}

.modal-title {
    color: #C8A951 !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    letter-spacing: 6px !important;
    text-transform: uppercase !important;
    margin: 0 !important;
}

/* Kapatma İkonu */
.modal-close-btn {
    background: transparent !important;
    color: #666 !important;
    border: none !important;
    transition: all 0.5s ease !important;
}
.modal-close-btn:hover {
    color: #C8A951 !important;
    transform: rotate(90deg) scale(1.1) !important;
}

/* Ürün Görseli ve Kasa Hizasını Düzeltme */
.variation-product-wrapper {
    display: flex !important;
    align-items: flex-start !important;
    gap: 25px !important;
}
@media (max-width: 768px) {
    .variation-product-wrapper { flex-direction: column !important; }
}

.variation-image { width: 120px !important; flex-shrink: 0 !important; }
.variation-image img {
    border-radius: 2px !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
    filter: grayscale(15%) brightness(90%) !important;
    transition: all 0.5s ease !important;
    width: 100% !important;
}
.variation-image img:hover { filter: grayscale(0%) brightness(100%) !important; }

/* Ürün İsmi (Kısa, Tok, Ferah) */
.variation-inner h3 {
    color: #fff !important;
    font-size: 11px !important;
    font-weight: 300 !important;
    letter-spacing: 3px !important;
    line-height: 1.8 !important;
    text-transform: uppercase !important;
    margin-bottom: 25px !important;
}

/* "COLOR" Başlığı */
[data-cy="variation-list"] h4 {
    color: #666 !important;
    font-size: 10px !important;
    font-weight: 400 !important;
    letter-spacing: 5px !important;
    text-transform: uppercase !important;
    margin-bottom: 15px !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    padding-bottom: 10px !important;
}

/* =========================================================
   YENİ TASARIM: GRID (YAN YANA MÜKEMMEL DİZİLİM)
   ========================================================= */
.variation-button-list {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important; /* 2 sütunlu kusursuz hizalama */
    gap: 12px !important;
}

.variation-handler-btn {
    background: transparent !important;
    color: #aaa !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 0 !important;
    padding: 15px 5px !important;
    text-align: center !important;
    font-size: 9px !important;
    font-weight: 400 !important;
    letter-spacing: 3px !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    width: 100% !important;
}

/* Üzerine Gelindiğinde Bir Eylem Butonu Gibi Parlar */
.variation-handler-btn:hover {
    border-color: #C8A951 !important;
    color: #050505 !important;
    background: #C8A951 !important; /* İçi dolarak tıklamaya davet eder */
    letter-spacing: 5px !important;
    box-shadow: 0 10px 20px rgba(200, 169, 81, 0.2) !important;
}


/* =========================================================
   12. ÜRÜN SİLME ONAY PENCERESİ (PREMIUM DELETE DRAWER)
   ========================================================= */

/* Ana Kasa (Aşağıdan Açılan Zifiri Siyah Çekmece) */
.v-navigation-drawer.tc-drawer, 
.v-navigation-drawer__content {
    background-color: #050505 !important;
    border-top: 1px solid rgba(200, 169, 81, 0.2) !important;
    color: #fff !important;
    font-family: 'Montserrat', sans-serif !important;
    box-shadow: 0 -30px 80px rgba(0,0,0,0.95) !important;
}

/* Başlık Alanı */
.drawer-title-wrapper {
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    padding: 25px 20px !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    position: relative !important;
}

/* Ortalanmış Asil Başlık */
.drawer-title {
    color: #C8A951 !important;
    font-size: 13px !important;
    font-weight: 300 !important;
    letter-spacing: 6px !important;
    text-transform: uppercase !important;
}

/* Kapatma (X) İkonu Sağ Köşede Serbest */
.drawer-title-wrapper .v-btn {
    position: absolute !important;
    right: 15px !important;
    color: #666 !important;
    background: transparent !important;
    transition: all 0.4s ease !important;
}
.drawer-title-wrapper .v-btn:hover {
    color: #C8A951 !important;
    transform: rotate(90deg) scale(1.1) !important;
}

/* İçerik Metni Alanı */
.delete-dialog-content {
    padding: 35px 25px 45px 25px !important;
    text-align: center !important;
}

.delete-dialog-text {
    color: #aaa !important;
    font-size: 12px !important;
    font-weight: 300 !important;
    letter-spacing: 2px !important;
    line-height: 1.8 !important;
    margin-bottom: 35px !important;
}

/* =========================================================
   BUTONLAR: AĞIR VE ŞIK (Kırmızı kutu iptal edildi)
   ========================================================= */
.delete-dialog-footer {
    display: flex !important;
    flex-direction: column !important; /* Mobilde alt alta çok daha asil durur */
    gap: 15px !important;
}
@media (min-width: 600px) {
    .delete-dialog-footer { flex-direction: row !important; }
}

.delete-dialog-footer .normalize-btn {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 10px !important;
    font-weight: 500 !important;
    letter-spacing: 4px !important;
    text-transform: uppercase !important;
    border-radius: 0 !important;
    height: auto !important;
    padding: 20px 10px !important;
    box-shadow: none !important;
    transition: all 0.5s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    flex: 1 !important;
}
.delete-dialog-footer .normalize-btn .v-btn__overlay { display: none !important; }

/* 1. BUTON: Sil ve Favorilere Ekle (Lüks Gold Çerçeve) */
.delete-dialog-footer .normalize-btn:not([data-cy="delete-basket-apply"]) {
    background: transparent !important;
    color: #C8A951 !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
}
.delete-dialog-footer .normalize-btn:not([data-cy="delete-basket-apply"]):hover {
    background: rgba(200, 169, 81, 0.05) !important;
    border-color: #C8A951 !important;
    letter-spacing: 6px !important;
}

/* 2. BUTON: Doğrudan Sil (Ucuz kırmızı dolgu yok edildi, sadece ince kırmızı hat) */
.delete-dialog-footer .normalize-btn[data-cy="delete-basket-apply"] {
    background: transparent !important; 
    color: #ef4444 !important; 
    border: 1px solid rgba(239, 68, 68, 0.2) !important;
}
.delete-dialog-footer .normalize-btn[data-cy="delete-basket-apply"]:hover {
    background: rgba(239, 68, 68, 0.05) !important;
    border-color: #ef4444 !important;
    letter-spacing: 6px !important;
}

/* =========================================================
   SEPET İÇİ KUSURSUZ GÖRÜNÜM VE BAŞLIK KURTARMA (PREMIUM)
   ========================================================= */

/* 1. BAŞLIK KURTARMA (Güvenlik Ağı Sistemi) */
/* Vue.js rozeti henüz takmadıysa bile orijinal yazıyı elit bir şekilde göster */
.basket-item-product-name span { 
    font-size: 14px !important; /* Gizliliği iptal et, yazıyı göster */
    color: #C8A951 !important; 
    line-height: 1.5 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important; 
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    font-weight: 500 !important;
    transition: all 0.3s ease !important;
}

/* Sadece JS rozeti taktığında orijinali gizle ve kısa olanı göster */
.basket-item-product-name span[data-tuva-title] { 
    font-size: 0 !important; 
    color: transparent !important; 
}
.basket-item-product-name span[data-tuva-title]::after {
    content: attr(data-tuva-title) !important;
    font-size: 15px !important;
    color: #C8A951 !important;
    font-weight: 500 !important;
    letter-spacing: 3px !important;
    line-height: 1.4 !important;
    display: block !important;
}

/* Üzerine gelince parlaması */
.basket-item-product-name:hover span,
.basket-item-product-name:hover span[data-tuva-title]::after { 
    color: #fff !important; 
    letter-spacing: 4px !important;
}

/* 2. SEPET İÇİ ÜRÜN FOTOĞRAFI (Müze Tablosu Efekti) */
.basket-item-image img { 
    border-radius: 0 !important; 
    border: 1px solid rgba(200, 169, 81, 0.3) !important;
    padding: 4px !important;
    background: #000 !important;
    filter: grayscale(10%) brightness(85%) !important;
    transition: all 0.5s ease !important;
}
.basket-item-image:hover img { 
    filter: grayscale(0%) brightness(100%) !important; 
    border-color: #C8A951 !important;
}

/* 3. GEREKSİZ GÜRÜLTÜLERİ TEMİZLE (Marka adı iptali) */
.extra-informations { display: none !important; }

/* 4. TAHMİNİ TESLİMAT SÜRESİ (Minimalist Form) */
.basket-item-cargo-date { 
    color: #888 !important; 
    font-size: 9px !important; 
    letter-spacing: 3px !important; 
    text-transform: uppercase !important; 
    margin-top: 10px !important; 
}
.basket-item-cargo-date b { color: #fff !important; font-weight: 400 !important; }

/* 5. RENK SEÇENEĞİ ETİKETİ (Haute Couture Kutu) */
.basket-item-variation-chip { 
    background: transparent !important; 
    color: #C8A951 !important; 
    border: 1px solid rgba(200, 169, 81, 0.4) !important; 
    font-size: 9px !important; 
    letter-spacing: 3px !important; 
    text-transform: uppercase !important; 
    border-radius: 0 !important; 
    padding: 6px 15px !important;
    margin-top: 5px !important;
}

/* 6. ÇÖP KUTUSU VE KALP İKONLARI (Zarif Veda) */
.basket-item-favorite-button i,
.counter-button[data-cy="counter-delete"] i { 
    color: #555 !important; 
    transition: all 0.3s ease !important; 
}
.basket-item-favorite-button:hover i,
.counter-button[data-cy="counter-delete"]:hover i { 
    color: #ef4444 !important; 
    transform: scale(1.1) !important; 
}

/* =========================================================
   ZARİF ŞAMPANYA/GOLD ÇİZGİ DOKUNUŞLARI
   ========================================================= */

/* Sepet Üst Başlık Çizgisi (Soğuk beyaz yerine transparan altın) */
.content-header--inner { 
    border-bottom: 1px solid rgba(200, 169, 81, 0.25) !important; 
    padding-bottom: 20px !important; 
    margin-bottom: 30px !important; 
}

/* Sepetteki Ürünleri Ayıran Alt Çizgi (Daha yumuşak, elit geçiş) */
.basket-item { 
    background: transparent !important; 
    border: none !important; 
    border-bottom: 1px solid rgba(200, 169, 81, 0.15) !important; 
    padding: 40px 0 !important; 
    border-radius: 0 !important; 
    box-shadow: none !important; 
}



/* =========================================================
   SON DOKUNUŞ: KESİN VE ZORUNLU GOLD ÇİZGİLER
   ========================================================= */

/* 1. Sepet Üstündeki Ana Çizgi (Basket (1) altı) */
.content-header,
.content-header--inner {
    border-bottom: 1px solid rgba(200, 169, 81, 0.25) !important;
}

/* 2. Her Bir Ürünü Ayıran Alt Çizgi */
.product-item,
.basket-item {
    border-bottom: 1px solid rgba(200, 169, 81, 0.15) !important;
}

/* 3. Varsa Liste Çizgilerini De Ez (Garanti Çözüm) */
div[data-v-8c0ca446].product-item,
div[data-v-8c0ca446].basket-item,
div[data-v-eb725b65].content-header--inner {
    border-color: rgba(200, 169, 81, 0.25) !important;
}


/* =========================================================
   ULTRA-PREMIUM "BASKET" BAŞLIĞI (HAUTE COUTURE DOKUNUŞ)
   ========================================================= */

.content-header--inner .title-wrapper {
    margin-bottom: 5px !important; 
}

.content-header--inner .title-properties {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12px !important; /* Lüks minimalizm: Küçük, kibar ve asil */
    font-weight: 300 !important; 
    letter-spacing: 12px !important; /* Ekstra geniş, ferah harf aralığı */
    text-transform: uppercase !important;
    
    /* Orijinal kaba çizgiyi tamamen yok ediyoruz */
    border-bottom: none !important; 
    padding-bottom: 15px !important;
    position: relative !important;
    display: inline-block !important;
    
    /* Saf Altın Metalik Efekti (Işık yansıması hissi verir) */
    background: linear-gradient(90deg, #b59238 0%, #F5D78D 50%, #C8A951 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
}

/* Kaba alt çizgi yerine, sadece baş harflerin altında kalan 25 piksellik jilet gibi bir imza çizgisi */
.content-header--inner .title-properties::after {
    content: '' !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 25px !important; 
    height: 1px !important;
    background: #C8A951 !important;
    box-shadow: 0 0 8px rgba(200, 169, 81, 0.4) !important;
}




/* =========================================================
   ÜST BİLGİ (HEADER): LÜKS LOGOTYPE VE ŞAMPANYA ÇİZGİ
   ========================================================= */

/* 1. Üst Kasa Çizgisini (Kaba Beyazı) Yumuşat ve Transparan Altın Yap */
.v-col.v-col-12.d-flex.justify-space-between.align-center {
    border-bottom: 1px solid rgba(200, 169, 81, 0.2) !important;
    padding-bottom: 25px !important;
    padding-top: 10px !important;
}

/* 2. Orijinal Küçük (Favicon) Görselini Tamamen Yok Et */
.logo img {
    display: none !important;
}

/* 3. Yerine Ultra-Lüks "TUVA" Yazısını CSS ile Yerleştir */
.logo::after {
    content: 'TUVA' !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 22px !important;
    font-weight: 300 !important;
    letter-spacing: 16px !important; /* Nefes kesen geniş harf aralığı */
    text-transform: uppercase !important;
    
    /* Saf Altın Metalik Işıltı (Derinlik katar) */
    background: linear-gradient(90deg, #b59238 0%, #F5D78D 50%, #C8A951 100%) !important;
    -webkit-background-clip: text !important;
    -webkit-text-fill-color: transparent !important;
    
    display: inline-block !important;
    margin-left: 8px !important; /* Ortalamayı kusursuzlaştırmak için */
}

/* 4. Kullanıcı (Profil) İkonunu da Vitrine Uydur */
.user-avatar-btn {
    color: rgba(200, 169, 81, 0.7) !important;
    font-size: 24px !important;
    transition: all 0.5s ease !important;
}

.user-avatar-btn:hover {
    color: #C8A951 !important;
    transform: scale(1.15) !important;
    text-shadow: 0 0 15px rgba(200, 169, 81, 0.4) !important;
}

/* Sağ taraftaki butonu barındıran çerçevenin etrafındaki olası gri çizgileri sil */
.usermenu-dropdown {
    border: none !important;
    background: transparent !important;
}





/* =========================================================
   HEADER VE SEPET ARASINDAKİ İNATÇI BEYAZ ÇİZGİYİ EZME
   ========================================================= */

/* Ana Üst Kapsayıcıdaki Kaba Çizgiyi ve Gölgeleri Yok Et */
.header {
    border-bottom: 1px solid rgba(200, 169, 81, 0.15) !important;
    box-shadow: none !important; /* Olası beyaz/gri gölgeleri kökten siler */
}

/* Kapsayıcı div'lerin etrafındaki tüm sınırları "Şampanya/Gold" rengine zorla */
.header-wrp, 
.basket-container-wrapper,
.v-main > div {
    border-color: rgba(200, 169, 81, 0.15) !important;
}




/* =========================================================
   ZIRHLI ÇERÇEVE (TİCİMAX KESİN ÇÖZÜM)
   ========================================================= */

/* Görseli çevreleyen linkin içine dalarak doğrudan img'ye hükmediyoruz */
.basket-item-image img { 
    border-radius: 0 !important; 
    border: 1px solid rgba(200, 169, 81, 0.4) !important; /* Daha baskın bir altın tonu */
    padding: 5px !important; 
    background: #000 !important;
    filter: grayscale(10%) brightness(90%) !important; 
    display: block !important;
    transition: all 0.5s ease !important;
    /* Çerçevenin varlığını kesinleştirmek için */
    box-sizing: border-box !important;
}

/* Linkin kendi çerçevesini sıfırla ki çakışma olmasın */
.basket-item-image {
    border: none !important;
    background: transparent !important;
}

/* Hover efekti */
.basket-item-image:hover img { 
    filter: grayscale(0%) brightness(100%) !important; 
    border-color: #C8A951 !important; 
}





/* =========================================================
   ULTRA-PREMIUM ÜRÜN ÇERÇEVESİ (MÜZE VİTRİNİ EFEKTİ)
   ========================================================= */

/* 1. Dış Kasa: Derinlik ve Asil Boşluk (Passepartout) */
.basket-item-image {
    display: block !important;
    position: relative !important;
    backgroundHarika! Madem işi bir adım daha öteye, "Ultra-Premium" seviyeye taşıyoruz, o zaman tek katmanlı basit bir çerçeve yerine **"Çift Katmanlı Galeri Çerçevesi" (Double Frame)** tasarlayacağız.

Gerçek sanat galerilerinde tablolar önce koyu renkli mat bir paspartuya (iç çerçeveye) oturtulur, ardından dışına asıl altın/ahşap çerçeve geçirilir. Biz de tam olarak bu derinliği kodlayacağız. Dışta şampanya gold bir sınır, içeride mat siyah bir boşluk ve ortasında loş bir filtreyle bekleyen ürününüz!

Lütfen önceki çerçeve kodunuzu silin ve **Özel CSS alanınızın en altına** bu "Haute Couture" çerçeve kodunu yapıştırın:

```css
/* =========================================================
   ULTRA-PREMIUM ÜRÜN ÇERÇEVESİ (ÇİFT KATMANLI GALERİ EFEKTİ)
   ========================================================= */

/* 1. Dış Çerçeve ve Mat Siyah Paspartu Zemin */
.basket-item-image {
    position: relative !important;
    display: block !important;
    padding: 8px !important; /* Mat siyah iç boşluğun kalınlığı */
    background: #050505 !important; /* Kadifemsi zifiri siyah zemin */
    border: 1px solid rgba(200, 169, 81, 0.5) !important; /* Dış Gold Çerçeve */
    border-radius: 0 !important; /* Jilet gibi keskin köşeler */
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.9) !important; /* Ağır ve oturaklı gölge */
    overflow: hidden !important;
    transition: all 0.6s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}

/* 2. İç Kanvas (Ürün Görseli) ve İnce Astar Çizgisi */
.basket-item-image img { 
    display: block !important;
    border-radius: 0 !important; 
    border: 1px solid rgba(255, 255, 255, 0.08) !important; /* Fotoğrafı saran buzlu gümüş/beyaz iç astar */
    padding: 0 !important; 
    background: #000 !important;
    filter: grayscale(15%) brightness(85%) contrast(1.1) !important; /* Müze aydınlatması filtresi */
    width: 100% !important;
    height: auto !important;
    box-sizing: border-box !important;
    transition: all 0.8s cubic-bezier(0.25, 1, 0.5, 1) !important;
}

/* 3. Hover (Üzerine Gelince) - Tablonun Canlanması */
.basket-item-image:hover {
    border-color: #C8A951 !important; /* Dış çerçeve saf altına dönüşür */
    box-shadow: 0 20px 50px rgba(200, 169, 81, 0.2) !important; /* Altın rengi ışıltı yayar */
    transform: translateY(-3px) !important; /* Tablo hafifçe size doğru yaklaşır */
}

.basket-item-image:hover img { 
    filter: grayscale(0%) brightness(105%) contrast(1) !important; /* Renkler aslına döner ve parlar */
    transform: scale(1.05) !important; /* Görsel çerçevenin içinde nefes alarak büyür */
}




/* =========================================================
   SEPET İÇİ FİYAT VİTRİNİ (VUE.JS'İ KÖR EDEN KESİN ÇÖZÜM)
   ========================================================= */

/* 1. BİRİM FİYAT BAŞLIĞI: Orijinal yazıyı görünmez yap, yerine elit olanı yansıt */
html body div.basket-item-unit-price-desc {
    visibility: hidden !important; /* Vue'nun yazısını tamamen siler ama alanını korur */
    position: relative !important;
    height: 15px !important;
    margin-bottom: 5px !important;
}

html body div.basket-item-unit-price-desc::after {
    content: "UNIT PRICE" !important; /* Bu CSS ile var olduğu için Vue silemez! */
    visibility: visible !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    text-align: center !important;
    color: rgba(255, 255, 255, 0.4) !important; /* Asil gümüş/krem */
    font-family: 'Montserrat', sans-serif !important;
    font-size: 10px !important;
    font-weight: 300 !important;
    letter-spacing: 4px !important;
    text-transform: uppercase !important;
}

/* 2. TOPLAM FİYAT BAŞLIĞI: Boşluğa "Total Price" yazısını CSS ile kazı */
html body div.basket-item-price-customize.price-wrapper {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-end !important;
    align-items: center !important;
    padding-top: 20px !important; /* Total Price yazısı için üstten yer açıyoruz */
}

html body div.basket-item-price-customize.price-wrapper::before {
    content: "TOTAL PRICE" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    text-align: center !important;
    color: rgba(255, 255, 255, 0.4) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 10px !important;
    font-weight: 300 !important;
    letter-spacing: 4px !important;
    text-transform: uppercase !important;
}

/* 3. BİRİM FİYAT RAKAMI (Geri planda şeffaf altın) */
html body div.unit-price-wrapper .customize-basket-price span {
    color: rgba(200, 169, 81, 0.6) !important; 
    font-family: 'Montserrat', sans-serif !important;
    font-size: 13px !important;
    font-weight: 300 !important;
    letter-spacing: 2px !important;
}

/* 4. TOPLAM FİYAT RAKAMI (Vitrin yıldızı: Saf Altın ve Büyük) */
html body div.price-wrapper .customize-basket-price span {
    color: #C8A951 !important; 
    font-family: 'Montserrat', sans-serif !important;
    font-size: 18px !important;
    font-weight: 500 !important;
    letter-spacing: 2px !important;
    text-shadow: 0 5px 15px rgba(200, 169, 81, 0.15) !important; 
}




/* =========================================================
   THE TUVA VIP KULLANICI MENÜSÜ (AÇILIR PANEL)
   ========================================================= */

/* 1. Kasa (Modal Arka Planı): Bembeyaz sıradanlığı zifiri karanlık yap */
html body div.modal-body,
html body div.usermenu-wrapper {
    background: #050505 !important;
    border: 1px solid rgba(200, 169, 81, 0.3) !important;
    border-radius: 0 !important; /* Lüks markaların keskin hatları */
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.9) !important;
    padding: 10px !important;
}

/* 2. Kullanıcı Adı ("Admin" vs): Özel VIP Karşılama Hattı */
html body div.usermenu-wrapper .username {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 10px !important;
    font-weight: 400 !important;
    letter-spacing: 6px !important;
    text-transform: uppercase !important;
    text-align: center !important;
    border-bottom: 1px solid rgba(200, 169, 81, 0.2) !important;
    padding-bottom: 15px !important;
    margin-bottom: 10px !important;
}

/* 3. Liste Düzeni: Standart boşlukları ve kaba çizgileri sıfırla */
html body div.usermenu-wrapper ul {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

html body div.usermenu-wrapper ul li {
    border-bottom: 1px solid rgba(255, 255, 255, 0.03) !important; /* Çok hafif, zarif bir ayrım çizgisi */
}
html body div.usermenu-wrapper ul li:last-child {
    border-bottom: none !important;
}

/* 4. Menü Linkleri ve Butonlar (Asil Gümüş/Krem Tonu) */
html body div.usermenu-wrapper ul li a,
html body div.usermenu-wrapper ul li button {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    background: transparent !important;
    border: none !important;
    color: rgba(255, 255, 255, 0.5) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    font-weight: 300 !important;
    letter-spacing: 3px !important;
    text-transform: uppercase !important;
    padding: 12px 10px !important;
    transition: all 0.5s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
    text-decoration: none !important;
}

/* 5. İkonlar (Chevron-Right Ok İşaretleri) */
html body div.usermenu-wrapper ul li span.mdi {
    color: rgba(200, 169, 81, 0.4) !important;
    font-size: 16px !important;
    margin-right: 8px !important;
    transition: all 0.5s ease !important;
}

/* 6. HOVER (Üzerine Gelince Canlanma: Elit Animasyon) */
html body div.usermenu-wrapper ul li a:hover,
html body div.usermenu-wrapper ul li button:hover {
    color: #C8A951 !important;
    background: rgba(200, 169, 81, 0.03) !important; /* Çok hafif altın rengi bir parlama */
    transform: translateX(6px) !important; /* Yazı zarifçe sağa kayar */
    letter-spacing: 4px !important;
}

html body div.usermenu-wrapper ul li a:hover span.mdi,
html body div.usermenu-wrapper ul li button:hover span.mdi {
    color: #C8A951 !important;
    transform: translateX(3px) !important; /* Ok işareti de sağa esner */
}

/* 7. Çıkış Yap (Log out) Butonu: Özel zarif vurgu */
html body div.usermenu-wrapper ul li button.logout {
    color: rgba(200, 100, 100, 0.5) !important; /* Mat, bağırmayan bir kırmızı/bordo */
}
html body div.usermenu-wrapper ul li button.logout:hover {
    color: #e57373 !important;
    background: rgba(200, 100, 100, 0.05) !important;
}











/* =========================================================
   THE TUVA VIP CHECKOUT (VUETIFY IŞIKLARINI KAPATAN KOD)
   ========================================================= */

/* 1. ANA ARKA PLAN: Vuetify'ın "v-theme--light" beyazlığını zifiri siyahla boğ */
html body #app .v-application .checkout-page,
html body #app .v-application .checkout-container,
html body #app .v-application .v-main {
    background-color: #030303 !important;
    background: #030303 !important;
    color: #fff !important;
}

/* 2. SOL KISIM (Adres ve Kargo Kutuları) */
html body #app .checkout-page .step-box,
html body #app .checkout-page .address-wrapper,
html body #app .checkout-page .cargo-wrapper {
    background-color: #050505 !important;
    background: #050505 !important;
    border: 1px solid rgba(200, 169, 81, 0.3) !important;
    border-radius: 0 !important; /* Jilet gibi lüks köşeler */
    box-shadow: 0 15px 40px rgba(0, 0, 0, 0.8) !important;
}
html body #app .checkout-page .step-box.disabled {
    opacity: 0.4 !important;
    border-color: rgba(255, 255, 255, 0.05) !important;
}

/* Adım Başlıkları */
html body #app .checkout-page .step-box--header h2,
html body #app .checkout-page h3.info-box-title {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 14px !important;
    font-weight: 300 !important;
    letter-spacing: 8px !important;
    text-transform: uppercase !important;
    border-bottom: 1px solid rgba(200, 169, 81, 0.2) !important;
    padding-bottom: 15px !important;
    margin-bottom: 20px !important;
    background: transparent !important;
}

/* 3. SAĞ KISIM (Sipariş Özeti VIP Fatura) */
html body #app .checkout-page .sidebar-column .accordion-title-wrapper,
html body #app .checkout-page .sidebar-column .accordion-content,
html body #app .checkout-page .order-summary-card {
    background-color: #050505 !important;
    background: #050505 !important;
    border: none !important;
    box-shadow: none !important;
}
html body #app .checkout-page .order-summary-card-title {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 12px !important;
    font-weight: 300 !important;
    letter-spacing: 6px !important;
    text-transform: uppercase !important;
}
html body #app .checkout-page .list-item-key,
html body #app .checkout-page .checkout-header .back-btn {
    color: rgba(255, 255, 255, 0.5) !important; 
    font-family: 'Montserrat', sans-serif !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
}
html body #app .checkout-page .list-item-value {
    color: rgba(200, 169, 81, 0.8) !important;
}
html body #app .checkout-page .basket-total-price {
    color: #C8A951 !important;
    font-size: 20px !important;
    font-weight: 500 !important;
    text-shadow: 0 5px 15px rgba(200, 169, 81, 0.2) !important;
}
html body #app .checkout-page .order-summary-divider {
    border-color: rgba(200, 169, 81, 0.1) !important;
}

/* 4. ADRES VE KARGO SEÇİM KUTULARI (Mavi Rengi Ezer) */
html body #app .checkout-page .v-selection-control__wrapper[style] {
    color: #C8A951 !important; /* Zorunlu mavi tiki altına çevirir */
    caret-color: #C8A951 !important;
}
html body #app .checkout-page .active .address-radio-item {
    background: rgba(200, 169, 81, 0.05) !important;
    border: 1px solid #C8A951 !important;
    border-radius: 0 !important;
}
html body #app .checkout-page .address-radio-item {
    background: #030303 !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    border-radius: 0 !important;
    color: rgba(255, 255, 255, 0.7) !important;
}
html body #app .checkout-page .address-radio-item-text,
html body #app .checkout-page .cargo-list--item_name,
html body #app .checkout-page .cargo-list--item_description,
html body #app .checkout-page .cargo-list--item_chip {
    color: rgba(255, 255, 255, 0.7) !important;
    font-family: 'Montserrat', sans-serif !important;
}

/* Sipariş Notu Alanı */
html body #app .checkout-page .order-note textarea {
    background-color: #030303 !important;
    border: 1px solid rgba(200, 169, 81, 0.3) !important;
    color: #C8A951 !important;
    border-radius: 0 !important;
    padding: 15px !important;
}

/* 5. BUTONLAR (Devam Et, Adres Ekle - Altın VIP Geçiş Kartları) */
html body #app .checkout-page button.btn-success,
html body #app .checkout-page button.add-new-address-button {
    background-color: transparent !important;
    background: transparent !important;
    border: 1px solid #C8A951 !important;
    border-radius: 0 !important;
    height: 60px !important;
    transition: all 0.5s ease !important;
    box-shadow: none !important;
}

html body #app .checkout-page button.btn-success span,
html body #app .checkout-page button.add-new-address-button span.v-btn__content {
    color: #C8A951 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    letter-spacing: 6px !important;
    text-transform: uppercase !important;
    transition: all 0.5s ease !important;
}

html body #app .checkout-page button.btn-success:hover,
html body #app .checkout-page button.add-new-address-button:hover {
    background-color: #C8A951 !important;
    background: #C8A951 !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 15px 30px rgba(200, 169, 81, 0.2) !important;
}

html body #app .checkout-page button.btn-success:hover span,
html body #app .checkout-page button.add-new-address-button:hover span.v-btn__content,
html body #app .checkout-page button.add-new-address-button:hover i {
    color: #000 !important;
    letter-spacing: 8px !important;
}




/* =========================================================
   THE TUVA: Hızlı Satın Al & Adres Formu (Ghost Form Design)
   ========================================================= */

/* 1. KASA ve BAŞLIKLAR: Kutu görünümünü yok edip siyah zeminle birleştir */
html body #app .checkout-page .buy-fast {
    background: transparent !important;
    border: 1px solid rgba(255, 255, 255, 0.03) !important;
    border-radius: 0 !important;
    padding: 0 !important; /* Kaba iç boşlukları siliyoruz */
    box-shadow: none !important;
}

html body #app .checkout-page .buy-fast--header .title,
html body #app .checkout-page .address-inline-form p.title {
    color: rgba(200, 169, 81, 0.8) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    font-weight: 400 !important;
    letter-spacing: 6px !important;
    text-transform: uppercase !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
    padding-bottom: 15px !important;
    margin-bottom: 25px !important;
}

html body #app .checkout-page .buy-fast--header a.text-blue {
    color: rgba(255, 255, 255, 0.5) !important; /* Standart maviyi asil gümüş yap */
    font-family: 'Montserrat', sans-serif !important;
    font-size: 10px !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    transition: all 0.4s ease !important;
}
html body #app .checkout-page .buy-fast--header a.text-blue:hover {
    color: #C8A951 !important;
    letter-spacing: 3px !important;
}

/* 2. FORM KUTULARI (Ghost Form): Beyaz kutuları sil, sadece ince alt çizgi bırak */
html body #app .checkout-page .v-field--variant-solo,
html body #app .checkout-page .v-field__field,
html body #app .checkout-page .vue-tel-input {
    background-color: transparent !important;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
    transition: all 0.5s ease !important;
}

/* Form içine tıklandığında alt çizgi parlar */
html body #app .checkout-page .v-field--active,
html body #app .checkout-page .v-field--focused,
html body #app .checkout-page .vue-tel-input:focus-within {
    border-bottom: 1px solid rgba(200, 169, 81, 0.8) !important;
}

/* 3. FORM ETİKETLERİ VE YAZILAR (Email, Name, vb.) */
html body #app .checkout-page .v-label,
html body #app .checkout-page .textfield-label,
html body #app .checkout-page .floating-label {
    color: rgba(255, 255, 255, 0.4) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 11px !important;
    font-weight: 300 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
}
html body #app .checkout-page .v-field__input,
html body #app .checkout-page .vti__input {
    color: #C8A951 !important; /* Müşteri yazarken harfler altın rengi çıkar */
    font-family: 'Montserrat', sans-serif !important;
    font-size: 13px !important;
    font-weight: 300 !important;
    letter-spacing: 2px !important;
}

/* Autofill (Otomatik Doldurma) sarılığını engelleme */
html body #app .checkout-page input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 50px #050505 inset !important;
    -webkit-text-fill-color: #C8A951 !important;
}

/* 4. AÇILIR MENÜ İKONLARI (Şehir/Ülke Seçim Okları) */
html body #app .checkout-page .v-field__append-inner i {
    color: rgba(200, 169, 81, 0.5) !important;
}

/* 5. BİREYSEL/KURUMSAL RADYO BUTONLARI (Fatura Tipi) */
html body #app .checkout-page .bill-type-wrapper p.v-label {
    color: rgba(200, 169, 81, 0.7) !important;
    font-size: 10px !important;
    letter-spacing: 5px !important;
    margin-top: 20px !important;
}
html body #app .checkout-page .v-radio .v-label {
    color: rgba(255, 255, 255, 0.6) !important;
    letter-spacing: 2px !important;
}
html body #app .checkout-page .v-selection-control__wrapper[style] {
    color: #C8A951 !important; /* İnatçı renk değişkenini ezer */
}

/* 6. CREATE (Oluştur) BUTONU: Çığlık atan yeşili, elit theTUVA Altınına Çevir */
html body #app .checkout-page button.address-form-submit[style] {
    background-color: transparent !important;
    background: transparent !important;
    border: 1px solid rgba(200, 169, 81, 0.4) !important;
    border-radius: 0 !important;
    height: 55px !important;
    box-shadow: none !important;
    margin-top: 20px !important;
    transition: all 0.8s cubic-bezier(0.25, 0.8, 0.25, 1) !important;
}
html body #app .checkout-page button.address-form-submit[style] span.v-btn__content {
    color: rgba(200, 169, 81, 0.9) !important;
    font-family: 'Montserrat', sans-serif !important;
    font-size: 10px !important;
    font-weight: 400 !important;
    letter-spacing: 8px !important;
    text-transform: uppercase !important;
    transition: all 0.8s ease !important;
}

html body #app .checkout-page button.address-form-submit[style]:hover {
    background: rgba(200, 169, 81, 0.9) !important;
    border-color: rgba(200, 169, 81, 0.9) !important;
}
html body #app .checkout-page button.address-form-submit[style]:hover span.v-btn__content {
    color: #000 !important;
    letter-spacing: 12px !important; /* Asil esneme efekti */
}