/* tema fontları — @import dosya başında olmalı */
/* v2 */
/* Kampanya sayacı — ecomus tf-countdown style-rectangle tabanlı */
.esc-kampanya-sayaci { display:inline-flex; flex-direction:column; align-items:flex-start; gap:12px; margin:20px 0; background:transparent !important; border-radius:0 !important; box-shadow:none !important; padding:0 !important; }
.esc-kampanya-sayaci .esc-ks-etiket { font-size:12px; letter-spacing:.08em; text-transform:uppercase; font-weight:700; color:var(--main,#111); line-height:1; }
.esc-kampanya-sayaci .esc-ks-grid { display:flex; align-items:center; gap:8px; }
.esc-kampanya-sayaci .esc-ks-hucre { display:flex; flex-direction:column; align-items:center; justify-content:center; width:61px; height:72px; background-color:var(--white,#fff); border:1px solid var(--line,#e8e8e8); border-radius:3px; }
.esc-kampanya-sayaci .esc-ks-deger { font-size:32px; font-weight:500; line-height:1.2; color:var(--main,#111); font-variant-numeric:tabular-nums; }
.esc-kampanya-sayaci .esc-ks-birim { font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; line-height:1; margin-top:4px; color:var(--main,#111); }
.esc-kampanya-sayaci .esc-ks-ayrac { font-size:28px; font-weight:400; color:var(--main,#111); opacity:.35; line-height:1; padding-bottom:16px; }
.esc-kampanya-sayaci.esc-ks-dark .esc-ks-etiket { color:#fff; }
.esc-kampanya-sayaci.esc-ks-dark .esc-ks-hucre { background:rgba(255,255,255,.15); border-color:rgba(255,255,255,.2); }
.esc-kampanya-sayaci.esc-ks-dark .esc-ks-deger,.esc-kampanya-sayaci.esc-ks-dark .esc-ks-birim { color:#fff; }
.esc-kampanya-sayaci.esc-ks-dark .esc-ks-ayrac { color:#fff; opacity:.4; }
.esc-kampanya-sayaci.esc-ks-bitti { display:none; }
@media(max-width:576px){.esc-kampanya-sayaci .esc-ks-hucre{width:50px;height:60px}.esc-kampanya-sayaci .esc-ks-deger{font-size:24px}.esc-kampanya-sayaci .esc-ks-birim{font-size:10px}.esc-kampanya-sayaci .esc-ks-ayrac{font-size:22px;padding-bottom:13px}.esc-kampanya-sayaci .esc-ks-grid{gap:5px}}
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400;1,500&family=Playfair+Display:wght@400;500;600;700&family=Jost:wght@300;400;500;600&family=Raleway:wght@300;400;500;600&family=Oswald:wght@400;500;600;700&family=Inter:wght@400;500;600;700&display=swap');

/* ===== EKSİK İKON EŞLEMELERİ ===== */
.icon-call:before { content: "\e95d"; }
.icon-phone:before { content: "\e95d"; }
.icon-check-circle:before { content: "\e911"; }
.icon-credit-card:before { content: "\e90f"; }
.icon-send:before { content: "\e903"; }
.icon-shield:before { content: "\e950"; }
.icon-map-pin:before { content: "\e947"; }
.icon-trash:before { content: "\e917"; }
.icon-truck:before { content: "\e953"; }
.icon-plus:before { content: "+"; font-family: inherit !important; font-weight: 700; }
.icon-tag:before { content: "\e93d"; }
.icon-info:before { content: "\e94b"; }
.icon-info-circle:before { content: "\e94b"; }
.icon-image:before { content: "\e943"; }
.icon-warning:before { content: "\e94b"; }
.icon-facebook:before { content: "\e921"; }

/* ===== BOOK STORE HEADER ===== */
#allCategoriesDropdown { position: relative; }
.bookstore-cat-dropdown {
    position: absolute; top: 100%; left: 0; min-width: 260px;
    background: #fff; box-shadow: 0 8px 30px rgba(0,0,0,.12); z-index: 1000;
    border-radius: 0 0 8px 8px; padding: 8px 0;
    opacity: 0; visibility: hidden; transform: translateY(8px);
    transition: all .25s ease;
}
#allCategoriesDropdown:hover .bookstore-cat-dropdown {
    opacity: 1; visibility: visible; transform: translateY(0);
}
.bookstore-cat-link {
    display: flex; align-items: center; padding: 8px 16px;
    font-size: 13px; color: #333; text-decoration: none; transition: all .2s;
}
.bookstore-cat-link:hover { background: #f8f8f8; color: #000; padding-left: 20px; }
.bookstore-cat-item.has-sub { position: relative; }
.bookstore-cat-sub {
    position: absolute; top: 0; left: 100%; min-width: 400px;
    background: #fff; box-shadow: 0 8px 30px rgba(0,0,0,.12);
    border-radius: 8px; padding: 16px 20px;
    opacity: 0; visibility: hidden; transition: all .2s ease;
}
.bookstore-cat-item.has-sub:hover > .bookstore-cat-sub {
    opacity: 1; visibility: visible;
}
.bookstore-sub-link:hover { color: #000 !important; padding-left: 4px; }
.bookstore-nav-link { position: relative; padding: 4px 0; transition: color .2s; white-space: nowrap; }
.bookstore-nav-link:hover { color: var(--primary, #000) !important; }
@media (max-width: 991px) {
    .bookstore-cat-dropdown, .bookstore-cat-sub { display: none !important; }
}

/* Header Dropdown Menü Düzeltme */
.box-nav-ul .menu-item { position: relative; }
.box-nav-ul .menu-item .sub-menu.submenu-default {
    position: absolute; top: 100%; left: 0; min-width: 220px;
    background: #fff; box-shadow: 0 5px 20px rgba(0,0,0,.1); z-index: 1000;
    padding: 10px 0; border-radius: 0 0 4px 4px;
    opacity: 0; visibility: hidden; transform: translateY(10px);
    transition: all .25s ease;
}
.box-nav-ul .menu-item:hover > .sub-menu.submenu-default {
    opacity: 1; visibility: visible; transform: translateY(0);
}
.sub-menu.submenu-default .menu-list { list-style: none; padding: 0; margin: 0; }
.sub-menu.submenu-default .menu-list li { padding: 0; }
.sub-menu.submenu-default .menu-list li a {
    display: block; padding: 6px 20px; color: #333; font-size: 14px;
    transition: color .2s, padding-left .2s;
}
.sub-menu.submenu-default .menu-list li a:hover { color: #000; padding-left: 25px; }

/* Ürün Açıklama Normalizasyonu */
.product-description { font-size: 14px; line-height: 1.7; color: #555; word-wrap: break-word; overflow-wrap: break-word; }
.product-description img { max-width: 100%; height: auto; }
.product-description h1, .tf-product-des-demo h1 { font-size: 1.15em; margin: 15px 0 10px; color: #333; }
.product-description h2, .tf-product-des-demo h2 { font-size: 1.1em; margin: 14px 0 8px; color: #333; }
.product-description h3, .tf-product-des-demo h3 { font-size: 1.05em; margin: 12px 0 8px; color: #333; }
.product-description h4, .product-description h5, .product-description h6,
.tf-product-des-demo h4, .tf-product-des-demo h5, .tf-product-des-demo h6 { font-size: 1em; margin: 10px 0 8px; color: #333; }
.tf-product-des-demo { font-size: 14px; line-height: 1.7; color: #555; word-wrap: break-word; }
.tf-product-des-demo img { max-width: 100%; height: auto; }
.tf-product-des-demo table { width: 100%; border-collapse: collapse; margin: 10px 0; }
.tf-product-des-demo table td, .tf-product-des-demo table th { padding: 8px; border: 1px solid #ddd; font-size: 13px; }
.tf-product-des-demo p { margin-bottom: 10px; }
.tf-product-des-demo ul, .tf-product-des-demo ol { padding-left: 20px; margin-bottom: 10px; }
.product-description table { width: 100%; border-collapse: collapse; margin: 10px 0; }
.product-description table td, .product-description table th { padding: 8px; border: 1px solid #ddd; font-size: 13px; }
.product-description p { margin-bottom: 10px; }
.product-description ul, .product-description ol { padding-left: 20px; margin-bottom: 10px; }
.product-description iframe { max-width: 100%; }

/* Hesabım sidebar — mobil offcanvas butonu */
.btn-sidebar-account { text-align: center; margin: 10px 0; }

/* Mega Menu */
/* Panel 1200px genişliğinde ve left:50% + translateX(-50%) ile ORTALANIYOR.
   Bu ölçü ancak tam genişlikte bir ataya göre anlamlı; oysa .box-nav-ul .menu-item
   position:relative olduğu için panel AÇILDIĞI ÖĞEYE göre ortalanıyordu. Mega menü
   taşıyan öğe menünün sağ yarısındaysa panel ekranın dışına taşıp sayfaya yatay
   kaydırma çubuğu ekliyor — üstelik panel gizliyken bile, çünkü visibility:hidden
   öğeler scrollWidth'e dahil. (Her Sepette'de menüye kategoriler eklenip "Ürünler"
   sağa kayınca 201px taşma oluştu.)

   Çözüm: mega menü taşıyan öğeyi static'e çekiyoruz; panel o zaman #header'a, yani
   sayfanın ortasına hizalanıyor. Dar (normal) alt menüler relative kalır, kendi
   öğelerinin altında açılmaya devam eder.

   !important şart: markup'ta öğe Bootstrap'in .position-relative utility'sini
   taşıyor ve o sınıf position'ı !important ile veriyor — normal kural yeniliyor. */
#header { position: relative; }
.box-nav-ul .menu-item:has(> .sub-menu.mega-menu) { position: static !important; }

.box-nav-ul .menu-item .sub-menu.mega-menu {
    position: absolute; top: 100%; left: 50%; transform: translateX(-50%) translateY(10px);
    width: 96vw; max-width: 1200px;
    background: #fff; box-shadow: 0 12px 40px rgba(0,0,0,.15); z-index: 1000;
    padding: 0; border-radius: 0 0 8px 8px;
    opacity: 0; visibility: hidden;
    transition: all .3s cubic-bezier(.4,0,.2,1);
}
.box-nav-ul .menu-item:hover > .sub-menu.mega-menu {
    opacity: 1; visibility: visible; transform: translateX(-50%) translateY(0);
}

/* Mega Menu Grid */
.mega-menu-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 0;
    padding: 24px 28px 16px;
}
.mega-menu-col {
    padding: 0 12px;
    border-right: 1px solid #f5f5f5;
}
.mega-menu-col:last-child { border-right: none; }

/* Kategori Header — görsel + başlık */
.mega-cat-header { margin-bottom: 12px; text-align: center; }
.mega-cat-img-wrap {
    display: block; width: 80px; height: 80px; margin: 0 auto 10px;
    border-radius: 50%; overflow: hidden;
    border: 2px solid #f0f0f0;
    transition: border-color .3s, transform .3s;
}
.mega-cat-img-wrap:hover { border-color: #000; transform: scale(1.05); }
.mega-cat-img { width: 100%; height: 100%; object-fit: cover; }
.mega-cat-title {
    display: block; font-size: 13px; font-weight: 700; color: #111;
    text-decoration: none; text-transform: uppercase; letter-spacing: .4px;
    transition: color .2s;
}
.mega-cat-title:hover { color: #555; }

/* Alt Kategori Listesi */
.mega-cat-list {
    list-style: none; padding: 0; margin: 8px 0 0;
    text-align: center;
}
.mega-cat-list li { padding: 0; }
.mega-cat-list li a {
    display: block; padding: 4px 0; color: #777; font-size: 12.5px;
    text-decoration: none; transition: color .2s, padding-left .15s;
}
.mega-cat-list li a:hover { color: #000; }
.mega-cat-more { font-weight: 600 !important; color: #333 !important; font-size: 12px !important; margin-top: 4px; }
.mega-cat-sub { font-size: 11px !important; color: #aaa !important; padding: 2px 0 !important; padding-left: 10px !important; }
.mega-cat-sub:hover { color: #555 !important; }

/* Mega Menü Footer */
.mega-menu-footer {
    border-top: 1px solid #f0f0f0;
    padding: 12px 28px;
    text-align: center;
    background: #fafafa;
    border-radius: 0 0 8px 8px;
}
.mega-menu-all-link {
    display: inline-flex; align-items: center;
    font-size: 13px; font-weight: 600; color: #333;
    text-decoration: none; transition: color .2s;
}
.mega-menu-all-link:hover { color: #000; }

/* Mobile Bottom Toolbar body spacing */
@media (max-width: 991px) {
    body { padding-bottom: 60px; }
}

/* Mobil yatay kayma engelle — sadece mobilde */
@media (max-width: 991px) {
    html, body { overflow-x: hidden; }
}

/* Slider */
.tf-slideshow { margin-bottom: 0 !important; }
.tf-slideshow .wrap-slider { position: relative; }
.tf-slideshow .wrap-slider img { border-radius: 0 !important; }
.tf-slideshow .swiper-slide { border-radius: 0 !important; }
.slider-video-wrap { border-radius: 0 !important; }
.slider-img { width: 100%; height: auto; min-height: 300px; max-height: 70vh; object-fit: cover; display: block; }
.slider-placeholder {
    width: 100%; min-height: 280px; display: flex; align-items: center; justify-content: center;
    background: linear-gradient(135deg, var(--primary, #3c71d7) 0%, #1a1a2e 100%);
    padding: 40px 20px;
}
/* Slider pagination — görselin üstünde */
.tf-slideshow .wrap-pagination { position: absolute !important; bottom: 14px !important; left: 0; right: 0; z-index: 10; }

/* Mobil Responsive Özelleştirmeler */
@media only screen and (max-width: 767px) {
    .tf-slideshow .wrap-slider { height: auto !important; }
    .slider-img { min-height: 180px !important; max-height: 250px !important; }
    .slider-placeholder { min-height: 180px !important; padding: 24px 16px !important; }
    .tf-slideshow .slider-video-wrap { padding-bottom: 56.25% !important; }
    .tf-slideshow .box-content .heading { font-size: 16px !important; }
    .tf-slideshow .box-content .subheading { font-size: 11px !important; }
    .tf-slideshow .wrap-pagination { bottom: 10px !important; }
    .tf-main-product-description .nav-tabs { flex-direction: column; border-bottom: none; }
    .tf-main-product-description .nav-tabs .nav-link { border: 1px solid #dee2e6; border-radius: 0; margin-bottom: -1px; text-align: left; padding: 12px 15px; }
    .tf-main-product-description .nav-tabs .nav-link.active { background: #f8f9fa; font-weight: 600; }
    #sepetDrawer { width: 100% !important; }
    #canliAramaSonuc { max-height: 300px; }
    .d-flex.justify-content-center .gap-3 { gap: 0.5rem !important; }
    .d-flex.justify-content-center .gap-3 span:not(.badge) { font-size: 12px; }
    .d-flex.justify-content-center div[style*="width:60px"] { width: 30px !important; }
    .collection-item-circle img,
    .collection-item-circle .rounded-circle { width: 100px !important; height: 100px !important; }
    .col-lg-4 .card { margin-top: 20px; }
    .yuvarlak-kat-link { width: 75px !important; height: 75px !important; }
    section .nav-tabs.justify-content-center { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
    section .nav-tabs.justify-content-center::-webkit-scrollbar { display: none; }
    section .nav-tabs.justify-content-center .nav-link { white-space: nowrap; flex-shrink: 0; }
}
@media only screen and (max-width: 991px) {
    .thumbs-slider .tf-product-media-thumbs { display: none; }
    .thumbs-slider .tf-product-media-main { width: 100%; }
}

/* ===================================================================
   TEMA-SANAT — Lüks Minimalizm (Sanat & El Sanatları)
   İlham: siyah/krem/altın palet, serif başlıklar, bol beyaz alan.
   renk_sinifi="tema-sanat" ile body'ye uygulanır.
   =================================================================== */
.tema-sanat {
    --primary: #b8965a;            /* sıcak altın — turcoelegante tonu */
    --main: #141414;               /* siyaha yakın */
    --backdrop: #f9f7f3;           /* krem zemin */
    background-color: #f9f7f3;
    font-family: 'Raleway', sans-serif;
    font-weight: 400;
    color: #1a1a1a;
    letter-spacing: .01em;
}

/* Başlıklar — zarif serif, editorial */
.tema-sanat h1, .tema-sanat h2, .tema-sanat h3,
.tema-sanat h4, .tema-sanat h5, .tema-sanat h6,
.tema-sanat .heading,
.tema-sanat .tf-cart-title,
.tema-sanat .product-name,
.tema-sanat .card-product .title {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-weight: 500;
    letter-spacing: .03em;
    color: #141414;
    line-height: 1.25;
}
.tema-sanat h1 { font-size: clamp(2.4rem, 5vw, 4rem); letter-spacing: .06em; font-weight: 400; }
.tema-sanat h2 { font-size: clamp(1.8rem, 3.5vw, 2.8rem); }
.tema-sanat h3 { font-size: clamp(1.4rem, 2.5vw, 2rem); }

/* Ürün kartı başlığı — italic serif (galeri etiket hissi) */
.tema-sanat .card-product .title {
    font-style: italic;
    font-size: 1.05rem;
    font-weight: 400;
    letter-spacing: .01em;
}

/* Butonlar — siyah zemin, keskin köşe, harf aralıklı */
.tema-sanat .tf-btn.btn-fill,
.tema-sanat .tf-btn.btn-dark,
.tema-sanat .btn-dark,
.tema-sanat button[type="submit"].tf-btn {
    background: #171717;
    border-color: #171717;
    color: #fff;
    border-radius: 0 !important;
    letter-spacing: .18em;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 500;
    transition: background .25s ease, color .25s ease;
}
.tema-sanat .tf-btn.btn-fill:hover,
.tema-sanat .tf-btn.btn-dark:hover {
    background: #a8852e;
    border-color: #a8852e;
    color: #fff;
}
.tema-sanat .tf-btn.btn-line {
    border-radius: 0 !important;
    letter-spacing: .14em;
    text-transform: uppercase;
    font-size: 12px;
}
.tema-sanat .tf-btn.btn-line:hover { color: #a8852e; }

/* Kartlar — galeri stili, keskin köşe, şeffaf zemin */
.tema-sanat .card-product,
.tema-sanat .card-product .card-product-wrapper,
.tema-sanat .card-product img,
.tema-sanat .wishlist-card,
.tema-sanat .collection-item,
.tema-sanat .img-box {
    border-radius: 0 !important;
}
.tema-sanat .card-product .card-product-wrapper {
    background: transparent;
    box-shadow: none;
}
/* Galeri hover — hafif opacity düşürme (zoom yerine) */
.tema-sanat .card-product .card-product-wrapper img {
    transition: opacity .5s ease;
}
.tema-sanat .card-product:hover .card-product-wrapper img {
    opacity: .88;
}
/* Ürün alt bilgi alanı — daha fazla boşluk */
.tema-sanat .card-product .card-product-info {
    padding-top: 14px;
    padding-bottom: 4px;
}
/* Grid arası boşluk — turcoelegante gibi havadar */
.tema-sanat .grid-layout,
.tema-sanat .tf-grid-layout {
    gap: 36px 28px !important;
}
/* Ürün listesi genel padding */
.tema-sanat .flat-animate-tab,
.tema-sanat .flat-tab-store {
    padding-top: 20px;
}

/* Fiyat — ince, altın ton */
.tema-sanat .price,
.tema-sanat .price-now,
.tema-sanat .current-price {
    color: #b8965a;
    font-weight: 400;
    font-family: 'Raleway', sans-serif;
    letter-spacing: .06em;
    font-size: .88rem;
}

/* Header — krem zemin, havadar, turcoelegante minimal */
.tema-sanat #header,
.tema-sanat header.header-default,
.tema-sanat .header-minimal,
.tema-sanat .header-style-2,
.tema-sanat .header-style-3 {
    background: #f9f7f3;
    border-bottom: 1px solid #e4ddd2;
    padding-top: 6px;
    padding-bottom: 6px;
}
/* Logo — daha büyük, serif karakter */
.tema-sanat .logo-header img,
.tema-sanat .header-logo img {
    max-height: 48px;
    width: auto;
}
/* Menü linkleri */
.tema-sanat .box-nav-ul .menu-item > a,
.tema-sanat nav .menu-item > a {
    letter-spacing: .16em;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 500;
    font-family: 'Raleway', sans-serif;
    color: #141414;
    padding-top: 8px;
    padding-bottom: 8px;
}
.tema-sanat .box-nav-ul .menu-item > a:hover,
.tema-sanat nav .menu-item > a:hover { color: #b8965a; }
/* Header ikonları */
.tema-sanat .nav-icon .icon,
.tema-sanat .header-action .action-icon {
    color: #141414;
}
.tema-sanat .nav-icon .icon:hover,
.tema-sanat .header-action .action-icon:hover { color: #b8965a; }

/* Top bar — siyah bant, Raleway */
.tema-sanat .tf-top-bar {
    background: #141414 !important;
    color: #f0ebe0;
}
.tema-sanat .tf-top-bar .top-bar-text {
    color: #f0ebe0;
    letter-spacing: .18em;
    text-transform: uppercase;
    font-size: 10px;
    font-family: 'Raleway', sans-serif;
    font-weight: 400;
}
.tema-sanat .tf-top-bar .tb-select { color: #f0ebe0; }

/* Footer — koyu zemin, krem metin */
.tema-sanat footer,
.tema-sanat .footer {
    background: #141414;
    color: #c8c0b0;
}
.tema-sanat footer a, .tema-sanat .footer a { color: #c8c0b0; }
.tema-sanat footer a:hover, .tema-sanat .footer a:hover { color: #b8965a; }
.tema-sanat footer h5, .tema-sanat footer h6,
.tema-sanat .footer h5, .tema-sanat .footer h6 {
    color: #f0ebe0;
    letter-spacing: .18em;
    text-transform: uppercase;
    font-size: 11px;
    font-family: 'Raleway', sans-serif;
    font-weight: 600;
}
/* Footer logo */
.tema-sanat footer .logo-footer img { filter: brightness(0) invert(1); opacity: .85; }
/* Footer alt çizgi */
.tema-sanat .footer-bottom {
    border-top: 1px solid #2a2a2a;
}

/* Form alanları — keskin köşe, ince çizgi */
.tema-sanat input.tf-field,
.tema-sanat .form-control,
.tema-sanat .form-checkout input,
.tema-sanat .form-checkout select,
.tema-sanat .form-checkout textarea {
    border-radius: 0 !important;
    border-color: #d8d2c4;
    background: #fff;
}
.tema-sanat input:focus, .tema-sanat select:focus, .tema-sanat textarea:focus {
    border-color: #a8852e !important;
    box-shadow: none !important;
}

/* Rozetler — altın çerçeveli, Raleway */
.tema-sanat .on-sale-item,
.tema-sanat .badge-yeni,
.tema-sanat .card-product .on-sale-wrap .on-sale-item {
    background: transparent;
    border: 1px solid #b8965a;
    color: #b8965a;
    border-radius: 0;
    letter-spacing: .14em;
    font-size: 9px;
    text-transform: uppercase;
    font-family: 'Raleway', sans-serif;
    font-weight: 500;
    padding: 2px 7px;
}

/* Slider metin — editorial büyük başlık */
.tema-sanat .banner-gr-title,
.tema-sanat .slider-title,
.tema-sanat .box-title-slider h2,
.tema-sanat .box-title-slider h1 {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-weight: 400;
    font-style: italic;
    letter-spacing: .04em;
    line-height: 1.15;
}
/* Marquee bant */
.tema-sanat .tf-marquee .marquee-item {
    font-family: 'Raleway', sans-serif;
    letter-spacing: .18em;
    font-size: 11px;
    font-weight: 500;
}

/* Newsletter alanı — krem zemin, ince çerçeve */
.tema-sanat .flat-newsletter,
.tema-sanat .newsletter-section {
    background: #f0ebe0;
    border-top: 1px solid #e4ddd2;
    border-bottom: 1px solid #e4ddd2;
}
.tema-sanat .flat-newsletter input[type="email"],
.tema-sanat .newsletter-section input[type="email"] {
    border-radius: 0 !important;
    border: 1px solid #c8bfb2;
    background: #fff;
    font-family: 'Raleway', sans-serif;
    font-size: 13px;
}

/* Breadcrumb */
.tema-sanat .tf-breadcrumb .breadcrumb-item,
.tema-sanat .breadcrumb li {
    font-family: 'Raleway', sans-serif;
    font-size: 11px;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #888;
}
.tema-sanat .tf-breadcrumb .breadcrumb-item.active { color: #141414; }

/* Mobil uyum — spacing küçültme */
@media (max-width: 767px) {
    .tema-sanat section,
    .tema-sanat .flat-spacing {
        padding-top: 48px !important;
        padding-bottom: 48px !important;
    }
    .tema-sanat .grid-layout,
    .tema-sanat .tf-grid-layout {
        gap: 24px 16px !important;
    }
    .tema-sanat h1 { font-size: 2rem; }
    .tema-sanat h2 { font-size: 1.6rem; }
}

/* Bölüm başlıkları — ortalanmış, altın ayraç, geniş üst boşluk */
.tema-sanat .flat-title {
    padding-top: 24px;
    padding-bottom: 8px;
}
.tema-sanat .flat-title .title,
.tema-sanat .heading-section {
    position: relative;
    padding-bottom: 18px;
}
.tema-sanat .flat-title .title::after,
.tema-sanat .heading-section::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    width: 36px;
    height: 1px;
    background: #b8965a;
}
/* Alt başlık/etiket — küçük uppercase Raleway */
.tema-sanat .flat-title .sub,
.tema-sanat .heading-section .sub {
    font-family: 'Raleway', sans-serif;
    font-size: 11px;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: #b8965a;
    font-weight: 500;
    display: block;
    margin-bottom: 10px;
}
/* Bölümler arası üst/alt padding */
.tema-sanat section,
.tema-sanat .flat-spacing {
    padding-top: 72px !important;
    padding-bottom: 72px !important;
}

/* Sepet drawer ve modallar — krem uyum */
.tema-sanat .offcanvas { background: #faf8f4; }
.tema-sanat .modal-content { border-radius: 0; background: #faf8f4; }

/* ===================================================================
   TEMA-ELEGANTE — Lüks Karanlık (Premium Dark)
   İlham: turcoelegante.com — siyaha yakın zemin, mat altın vurgu,
   krem metin, Playfair serif başlıklar, bol boşluk, keskin köşeler.
   renk_sinifi="tema-elegante" ile body'ye uygulanır.
   --- Renkler ---
   zemin #0d0d0d · panel #161616 · altın #c4a35a · metin #e6e0d4
   =================================================================== */
.tema-elegante {
    --main: #ece7da;
    --white: #161616;
    --primary: #c4a35a;
    --text: #cfc9bd;
    --text-2: #a59f92;
    --text-3: #a59f92;
    --text-secondary: #a59f92;
    --line: #2a2a2a;
    --line-2: #2a2a2a;
    --bg-1: #0d0d0d; --bg-2: #141414; --bg-7: #161616; --bg-8: #161616; --bg-9: #161616;
    /* EKSİK KALAN açık-gri token'lar — koyuya çevrildi (base'de #f2f2f2 vb. 12+ yerde) */
    --bg-10: #0d0d0d;
    --bg-11: #161616;            /* adet kutusu, sort dropdown, hesap menüsü, scrollbar... */
    --bg-load: #1a1a1a;
    --bg-scrollbar-track: #0d0d0d;
    --bg-scrollbar-thumb: #2e2e2e;
    --main-rgba-1: rgba(255,255,255,.10);  /* siyah-bazlı gölge/sınırları aydınlat */
    --main-rgba-2: rgba(255,255,255,.08);
    --backdrop: rgba(0,0,0,.65);
    /* Mobil kabuk renk skalası — net basamaklar (zemin→ayraç→sönük→metin→altın) */
    --el-mob-bg:      #0b0b0b;            /* tek tutarlı koyu zemin */
    --el-mob-panel:   #141414;            /* yükseltilmiş yüzey (aktif/footer) */
    --el-mob-line:    #262626;            /* görünür ayraç */
    --el-ink:         #ece7da;            /* birincil metin — parlak krem */
    --el-ink-dim:     #8f897b;            /* ikincil/pasif — okunur sönük */
    --el-gold:        #cba968;            /* aktif/hover — canlı altın */
    --el-gold-soft:   rgba(203,169,104,.12); /* aktif zemin tonu */
    background-color: #0d0d0d;
    font-family: 'Raleway', sans-serif;
    font-weight: 400;
    letter-spacing: .01em;
    color: #cfc9bd;
}

/* ===================================================================
   KÖPRÜ KATMANI — token DİNLEMEYEN kısımlar (Bootstrap utility + sık inline)
   Token'lar (yukarıda) base'in var(--..) kullandığı her yeri otomatik koyu
   yapar. Burası ise utility class'larını ve hardcoded açık zeminleri yakalar.
   Yeni bir bileşen açık çıkarsa önce buraya bir satır eklemek yeterli olmalı.
   =================================================================== */
/* Açık zeminler → koyu */
.tema-elegante .bg-white,
.tema-elegante .bg-light,
.tema-elegante .bg-surface,
.tema-elegante [style*="background:#fff"],
.tema-elegante [style*="background: #fff"],
.tema-elegante [style*="background-color:#fff"],
.tema-elegante [style*="background:#f"],
.tema-elegante [style*="background-color:#f"] {
    background-color: var(--bg-1) !important;
}
/* Koyu metin utility'leri → krem skala */
.tema-elegante .text-dark,
.tema-elegante .text-black { color: var(--el-ink) !important; }
.tema-elegante .text-white-50,
.tema-elegante .text-body-secondary { color: var(--el-ink-dim) !important; }
.tema-elegante .text-muted { color: var(--text-2) !important; }
/* Kartlar / paneller / modal / dropdown / accordion / tablo — koyu yüzey */
.tema-elegante .card,
.tema-elegante .modal-content,
.tema-elegante .dropdown-menu,
.tema-elegante .list-group-item,
.tema-elegante .accordion-item,
.tema-elegante .accordion-button {
    background-color: var(--bg-7) !important;
    color: var(--text) !important;
    border-color: var(--line) !important;
}
.tema-elegante .table { color: var(--text) !important; border-color: var(--line) !important; }
/* Form alanları — koyu zemin, krem metin */
.tema-elegante .form-control,
.tema-elegante .form-select,
.tema-elegante .input-group-text {
    background-color: var(--white) !important;
    color: var(--main) !important;
    border-color: var(--line) !important;
    border-radius: 0 !important;
}
.tema-elegante .form-control::placeholder { color: var(--text-2) !important; opacity: 1; }
.tema-elegante .form-control:focus,
.tema-elegante .form-select:focus { border-color: var(--el-gold) !important; box-shadow: none !important; }
/* Sınır utility'leri */
.tema-elegante .border,
.tema-elegante .border-top,
.tema-elegante .border-bottom,
.tema-elegante .border-start,
.tema-elegante .border-end { border-color: var(--line) !important; }

/* Genel zemin & bölümler — koyu */
.tema-elegante .main-content,
.tema-elegante #wrapper,
.tema-elegante .flat-spacing,
.tema-elegante section,
.tema-elegante .bg-surface,
.tema-elegante .flat-spacing-1,
.tema-elegante .flat-spacing-2 {
    background-color: #0d0d0d;
}

/* Metin renkleri — krem tonları */
.tema-elegante p,
.tema-elegante span,
.tema-elegante li,
.tema-elegante .text-secondary,
.tema-elegante .text-muted,
.tema-elegante .description { color: #b7b1a4; }

/* Başlıklar — Cormorant Garamond italic, editorial */
.tema-elegante h1, .tema-elegante h2, .tema-elegante h3,
.tema-elegante h4, .tema-elegante h5, .tema-elegante h6,
.tema-elegante .heading,
.tema-elegante .tf-cart-title,
.tema-elegante .product-name,
.tema-elegante .card-product .title,
.tema-elegante .card-product .title a {
    font-family: 'Cormorant Garamond', Georgia, serif;
    font-weight: 500;
    letter-spacing: .03em;
    color: #f3eee3;
    line-height: 1.25;
}
.tema-elegante h1 { font-size: clamp(2.4rem, 5vw, 4rem); letter-spacing: .06em; font-weight: 400; font-style: italic; }
.tema-elegante h2 { font-size: clamp(1.8rem, 3.5vw, 2.8rem); }
.tema-elegante h3 { font-size: clamp(1.4rem, 2.5vw, 2rem); }

/* Ürün kartı başlığı — italic serif */
.tema-elegante .card-product .title,
.tema-elegante .card-product .title a {
    font-style: italic;
    font-size: 1.05rem;
    font-weight: 400;
    letter-spacing: .01em;
}

/* Linkler — krem, altın hover */
.tema-elegante a { color: #d8d2c4; }
.tema-elegante a:hover { color: #c4a35a; }

/* Butonlar — altın dolgu / siyah metin, Raleway, keskin köşe */
.tema-elegante .tf-btn.btn-fill,
.tema-elegante .tf-btn.btn-dark,
.tema-elegante .btn-dark,
.tema-elegante button[type="submit"].tf-btn {
    background: #c4a35a;
    border-color: #c4a35a;
    color: #0d0d0d;
    border-radius: 0 !important;
    letter-spacing: .18em;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 600;
    font-family: 'Raleway', sans-serif;
    transition: background .25s ease, color .25s ease, border-color .25s ease;
}
.tema-elegante .tf-btn.btn-fill:hover,
.tema-elegante .tf-btn.btn-dark:hover {
    background: #d9bd7c;
    border-color: #d9bd7c;
    color: #0d0d0d;
}
/* Çizgili buton — altın çerçeve, krem metin */
.tema-elegante .tf-btn.btn-line,
.tema-elegante .tf-btn.btn-outline {
    border-radius: 0 !important;
    border-color: #c4a35a;
    color: #e6e0d4;
    letter-spacing: .14em;
    text-transform: uppercase;
    font-size: 12px;
    background: transparent;
}
.tema-elegante .tf-btn.btn-line:hover,
.tema-elegante .tf-btn.btn-outline:hover {
    background: #c4a35a;
    color: #0d0d0d;
}

/* Kartlar ve görseller — keskin köşe, koyu panel, zarif hover */
.tema-elegante .card-product,
.tema-elegante .card-product .card-product-wrapper,
.tema-elegante .card-product img,
.tema-elegante .wishlist-card,
.tema-elegante .collection-item,
.tema-elegante .img-box,
.tema-elegante .offcanvas,
.tema-elegante .modal-content {
    border-radius: 0 !important;
}
.tema-elegante .card-product .card-product-wrapper {
    background: #161616;
    border: 1px solid #222;
}
.tema-elegante .card-product:hover img {
    transform: scale(1.03);
    transition: transform .6s ease;
}
.tema-elegante .card-product .title a { color: #f3eee3; }
.tema-elegante .card-product .title a:hover { color: #c4a35a; }

/* Fiyat — altın vurgu */
.tema-elegante .price,
.tema-elegante .price-now,
.tema-elegante .current-price {
    color: #c4a35a;
    font-weight: 500;
    letter-spacing: .03em;
}
.tema-elegante .compare-at-price,
.tema-elegante .old-price { color: #6f6a60; }

/* Header — koyu zemin, ince altın çizgi */
.tema-elegante #header,
.tema-elegante header.header-default,
.tema-elegante .header-minimal,
.tema-elegante .header-wrap-1 {
    background: #0d0d0d;
    border-bottom: 1px solid #232323;
}
.tema-elegante .box-nav-ul .menu-item > a,
.tema-elegante .nav-ul-mb .menu-item > a {
    color: #d8d2c4;
    letter-spacing: .16em;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 500;
    font-family: 'Raleway', sans-serif;
}
.tema-elegante .box-nav-ul .menu-item > a:hover { color: #c4a35a; }
.tema-elegante .nav-icon-item,
.tema-elegante .header .nav-icon-item i { color: #e6e0d4; }

/* Top bar — siyah bant, Raleway */
.tema-elegante .tf-top-bar {
    background: #000 !important;
    color: #e6e0d4;
    border-bottom: 1px solid #1c1c1c;
}
.tema-elegante .tf-top-bar .top-bar-text {
    color: #e6e0d4;
    letter-spacing: .18em;
    text-transform: uppercase;
    font-size: 10px;
    font-family: 'Raleway', sans-serif;
    font-weight: 400;
}
.tema-elegante .tf-top-bar .tb-select { color: #e6e0d4; }

/* Footer — derin siyah, krem metin, Raleway */
.tema-elegante footer,
.tema-elegante .footer {
    background: #000;
    color: #b7b1a4;
    border-top: 1px solid #1c1c1c;
}
.tema-elegante footer a, .tema-elegante .footer a { color: #b7b1a4; }
.tema-elegante footer a:hover, .tema-elegante .footer a:hover { color: #c4a35a; }
.tema-elegante footer h5, .tema-elegante footer h6,
.tema-elegante .footer h5, .tema-elegante .footer h6,
.tema-elegante .footer-heading {
    color: #f3eee3;
    letter-spacing: .18em;
    text-transform: uppercase;
    font-size: 11px;
    font-family: 'Raleway', sans-serif;
    font-weight: 600;
}

/* Form alanları — koyu zemin, keskin köşe, altın odak */
.tema-elegante input.tf-field,
.tema-elegante .form-control,
.tema-elegante .form-checkout input,
.tema-elegante .form-checkout select,
.tema-elegante .form-checkout textarea {
    border-radius: 0 !important;
    border-color: #333;
    background: #161616;
    color: #e6e0d4;
}
.tema-elegante input::placeholder,
.tema-elegante textarea::placeholder { color: #6f6a60; }
.tema-elegante input:focus, .tema-elegante select:focus, .tema-elegante textarea:focus {
    border-color: #c4a35a !important;
    box-shadow: none !important;
    background: #1a1a1a;
}

/* Rozetler — kırmızı zemini beyaz yazıya çevir, köşe yok */
/* Rozet wrapper — sol üst köşe, inline */
.tema-elegante .card-product .on-sale-wrap {
    position: absolute !important;
    top: 10px !important;
    left: 10px !important;
    right: auto !important;
    width: auto !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
    z-index: 2;
}
/* Rozet — küçük pill */
.tema-elegante .on-sale-item,
.tema-elegante .badge-yeni,
.tema-elegante .card-product .on-sale-wrap .on-sale-item,
.tema-elegante .badge-sale,
.tema-elegante .sale-badge {
    display: inline-block !important;
    width: auto !important;
    background: #c4a35a !important;
    border: none !important;
    color: #0d0d0d !important;
    border-radius: 0 !important;
    letter-spacing: .1em;
    font-size: 9px;
    font-weight: 700;
    font-family: 'Raleway', sans-serif;
    text-transform: uppercase;
    padding: 4px 10px !important;
    white-space: nowrap;
}
/* İndirim yüzdesi — koyu zemin, altın yazı */
.tema-elegante .card-product .on-sale-wrap .on-sale-item:not(.on-new-item) {
    background: #1a1a1a !important;
    color: #c4a35a !important;
    border: 1px solid #333 !important;
}
/* Stokta Yok rozeti */
.tema-elegante .card-product .on-sale-wrap .sold-out-item,
.tema-elegante .card-product .on-sale-wrap [class*="sold-out"],
.tema-elegante .card-product .on-sale-wrap [class*="stok"] {
    background: #1a1a1a !important;
    color: #a59f92 !important;
    border: 1px solid #333 !important;
}

/* Bölüm başlıkları — ortalanmış, altın ayraç çizgisi */
.tema-elegante .flat-title .title,
.tema-elegante .heading-section {
    position: relative;
    padding-bottom: 14px;
}
.tema-elegante .flat-title .title::after,
.tema-elegante .heading-section::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    width: 48px;
    height: 1px;
    background: #c4a35a;
}

/* Sepet drawer ve modallar — koyu uyum */
.tema-elegante .offcanvas { background: #0d0d0d; color: #cfc9bd; }
.tema-elegante .modal-content { background: #0d0d0d; color: #cfc9bd; }
.tema-elegante .offcanvas .btn-close,
.tema-elegante .modal-content .btn-close { filter: invert(1) grayscale(1) brightness(1.4); }
.tema-elegante hr,
.tema-elegante .divider { border-color: #232323; background: #232323; }

/* ===================================================================
   ELEGANTE — BİLEŞEN KATMANI (koyu zemin tam kapsama)
   Açık zeminli her bileşen koyuya çekilir, üstündeki metin krem yapılır.
   Hepsi .tema-elegante ile sınırlı — diğer temalar etkilenmez.
   =================================================================== */

/* --- 1) Açık-zeminli panelleri nötrle (bg-white / bg_white / kartlar) --- */
.tema-elegante .bg-white,
.tema-elegante .bg_white,
.tema-elegante .bg-light,
.tema-elegante .bg-surface,
.tema-elegante .bg-surface-2,
.tema-elegante .widget-card,
.tema-elegante .checkout-box,
.tema-elegante .tf-page-cart-checkout,
.tema-elegante .fl-item,
.tema-elegante .card:not(.card-product) {
    background: #161616 !important;
    border-color: #262626 !important;
    color: #d6d0c3;
}

/* --- 2) Ürün kartı: hover bilgi paneli + butonlar --- */
/* Kartın alt bilgi alanı (başlık/fiyat/sepete-ekle) — beyaz panel yerine koyu */
.tema-elegante .card-product-info {
    background: #161616 !important;
    color: #d6d0c3;
}
/* "Sepete Ekle" / ana ürün butonu — altın dolgu, koyu metin */
.tema-elegante .btn-quick-add,
.tema-elegante .btn-main-product,
.tema-elegante .tf-btn.btn-fill {
    background: #c4a35a !important;
    border: 1px solid #c4a35a !important;
    color: #0d0d0d !important;
    border-radius: 0 !important;
    letter-spacing: .16em;
    text-transform: uppercase;
    font-weight: 600;
}
.tema-elegante .btn-quick-add:hover,
.tema-elegante .btn-main-product:hover,
.tema-elegante .tf-btn.btn-fill:hover {
    background: #d9bd7c !important;
    border-color: #d9bd7c !important;
    color: #0d0d0d !important;
}
/* Yuvarlak aksiyon ikonları (favori/karşılaştır/hızlı bakış) — beyaz daire yerine koyu */
.tema-elegante .box-icon.bg_white,
.tema-elegante .list-product-btn .box-icon {
    background: #1a1a1a !important;
    border: 1px solid #3a3a3a !important;
    color: #e6e0d4 !important;
    box-shadow: none !important;
}
.tema-elegante .box-icon.bg_white .icon,
.tema-elegante .list-product-btn .box-icon .icon { color: #e6e0d4 !important; }
.tema-elegante .box-icon.bg_white:hover,
.tema-elegante .list-product-btn .box-icon:hover {
    background: #c4a35a !important;
    border-color: #c4a35a !important;
}
.tema-elegante .box-icon:hover .icon { color: #0d0d0d !important; }
/* İkon tooltip baloncuğu */
.tema-elegante .box-icon .tooltip { background: #0d0d0d; color: #e6e0d4; }
/* Sadakat puan rozeti (inline açık zemin ezilir) */
.tema-elegante .puan-rozet {
    background: #1a1a1a !important;
    color: #c4a35a !important;
    border-color: #3a2f1a !important;
}
/* "Görsel Yok" placeholder'ı (inline #f5f5f5 ezilir) */
.tema-elegante .card-product-wrapper .product-img > div[style*="background"] { background: #161616 !important; }
.tema-elegante .card-product-wrapper .product-img .icon-image,
.tema-elegante .card-product-wrapper .product-img .text-muted { color: #6b665d !important; }

/* --- 3) Mağaza sidebar / filtre / breadcrumb / sayaç --- */
.tema-elegante .shop-filter,
.tema-elegante .widget-facet,
.tema-elegante .sidebar-filter,
.tema-elegante .canvas-filter { background: #0d0d0d; }
.tema-elegante .widget-facet .facet-title,
.tema-elegante .widget-title,
.tema-elegante .filtre-blok-baslik { color: #f3eee3; }
.tema-elegante .shop-sidebar a,
.tema-elegante .widget-facet a,
.tema-elegante .list-categories a,
.tema-elegante .kategori-liste a,
.tema-elegante .filtre-blok a,
.tema-elegante .breadcrumb a { color: #e2dccf; }
.tema-elegante .shop-sidebar a:hover,
.tema-elegante .widget-facet a:hover,
.tema-elegante .list-categories a:hover,
.tema-elegante .kategori-liste a:hover,
.tema-elegante .filtre-blok a:hover { color: #c4a35a; }
.tema-elegante .kategori-liste a.fw-6,
.tema-elegante .kategori-liste a.aktif { color: #c4a35a !important; }
.tema-elegante .breadcrumb span,
.tema-elegante .breadcrumb .active,
.tema-elegante .breadcrumb .breadcrumb-item.active { color: #9e988b !important; }
.tema-elegante .count-text,
.tema-elegante .text-count,
.tema-elegante .meta-filter-shop { color: #b7b1a4; }
.tema-elegante .nice-select,
.tema-elegante select.tf-dropdown-sort { background: #161616; border-color: #333; color: #d6d0c3; }
/* Fiyat aralığı slider rayı */
.tema-elegante .noUi-target { background: #232323; border-color: #232323; }
.tema-elegante .noUi-connect { background: #c4a35a; }
.tema-elegante .noUi-handle { background: #c4a35a; border-color: #c4a35a; box-shadow: none; }

/* --- 4) Bootstrap yardımcı sınıfları + genel metin kontrastı ---
   .text-dark/.text-body/.text-black koyu zeminde siyah-üstüne-siyah oluyordu. */
.tema-elegante .text-dark,
.tema-elegante a.text-dark,
.tema-elegante .text-body,
.tema-elegante .text-black,
.tema-elegante .link { color: #e2dccf !important; }
.tema-elegante a.text-dark:hover,
.tema-elegante .link:hover { color: #c4a35a !important; }
.tema-elegante,
.tema-elegante p,
.tema-elegante li,
.tema-elegante td,
.tema-elegante span,
.tema-elegante label,
.tema-elegante .fs-14, .tema-elegante .fs-13, .tema-elegante .fs-12 { color: #d6d0c3; }
.tema-elegante .text-muted,
.tema-elegante .text-secondary { color: #a59f92 !important; }
/* Kalın etiket/başlıkçıklar (checkout bölüm başlıkları dahil) parlasın */
.tema-elegante .fw-5,
.tema-elegante .fw-6,
.tema-elegante .fw-7 { color: #f3eee3; }

/* --- 5) Checkout / sipariş özeti --- */
.tema-elegante .tf-page-checkout .heading,
.tema-elegante .order-summary,
.tema-elegante .widget-content-tab,
.tema-elegante .checkout-order-summary { background: #161616; color: #d6d0c3; }
.tema-elegante .order-summary .title,
.tema-elegante .checkout-title,
.tema-elegante .order-summary h5,
.tema-elegante .order-summary h6 { color: #f3eee3 !important; }
.tema-elegante .form-checkout label,
.tema-elegante .checkout-box label { color: #d6d0c3 !important; }
.tema-elegante .total-value,
.tema-elegante .order-summary .price,
.tema-elegante .order-summary .total { color: #c4a35a !important; }
.tema-elegante .cart-item,
.tema-elegante .order-item { border-color: #262626 !important; }
/* Adım göstergesi: aktif = altın, ikon daireleri koyu */
.tema-elegante .checkout-step.active .step-circle { background: #c4a35a; color: #0d0d0d; }
.tema-elegante .checkout-step.active .step-label { color: #c4a35a; }
.tema-elegante .checkout-step.inactive .step-circle { background: #1f1f1f; color: #8a857a; }
.tema-elegante .checkout-card-head .icon-circle { background: #1f1f1f; color: #c4a35a; }
.tema-elegante .checkout-notice { background: #161616; border-color: #2a2a2a; }
.tema-elegante .adres-kart { background: #161616; border-color: #2a2a2a; }
/* Sipariş özeti kutusu — base CSS #fbfbfc veriyor, elegante metinleri fildişi olunca okunmuyordu */
.tema-elegante .widget-wrap-checkout {
    background-color: #161616 !important;
    border-color: #2a2a2a !important;
    border-radius: 0 !important;
}
/* Sözleşme onay kutusu (inline #fff8e1) ve puan kutusu (inline #f8f9fa) — altın tonlu koyu kutu */
.tema-elegante .widget-wrap-checkout div[style*="fff8e1"],
.tema-elegante .widget-wrap-checkout .puan-box {
    background: rgba(196,163,90,.08) !important;
    border-color: #c4a35a !important;
}
.tema-elegante .widget-wrap-checkout div[style*="fff8e1"] a { color: #c4a35a !important; }
/* Ödeme adımındaki açık zeminli kutular (havale bilgisi, kart formu) */
.tema-elegante .bank-info-box,
.tema-elegante .card-form-box {
    background: #161616 !important;
    border-color: #2a2a2a !important;
}
.tema-elegante .card-form-box input {
    background: #101010 !important;
    border-color: #2a2a2a !important;
    color: #e6e0d4 !important;
}
.tema-elegante .card-form-box label { color: #a59f92 !important; }
/* Sipariş onay (Başarılı) sayfası — info kartları ve sipariş kutuları açık zeminliydi */
.tema-elegante .order-info-card {
    background: #161616 !important;
    border-color: #2a2a2a !important;
    border-radius: 0 !important;
}
.tema-elegante .order-card {
    background: #141414 !important;
    border-color: #2a2a2a !important;
    border-radius: 0 !important;
}
.tema-elegante .order-card-header {
    background: #191919 !important;
    border-bottom-color: #2a2a2a !important;
}
.tema-elegante .order-item-row,
.tema-elegante .order-info-card .info-label { border-color: #262626 !important; }
.tema-elegante .order-item-img { border-color: #2a2a2a !important; }
.tema-elegante .totals-row { border-color: #262626 !important; }
.tema-elegante .totals-row.total-final { border-top-color: #c4a35a !important; }

/* --- 6) Hero slider (parallax) — overlay derinliği + altın buton --- */
.tema-elegante .esc-slider-parallax .parallax-overlay {
    background: linear-gradient(to bottom, rgba(0,0,0,.45) 0%, rgba(0,0,0,.68) 100%);
}
/* Slayt butonu inline background:#fff taşıyor — altına ez */
.tema-elegante .esc-slider-parallax .tf-btn.btn-fill,
.tema-elegante .esc-slider-parallax a.tf-btn[style*="background"] {
    background: #c4a35a !important;
    color: #0d0d0d !important;
    border: none !important;
}
.tema-elegante .esc-slider-parallax .parallax-content .inner { color: #f3eee3; }

/* Fiyat her zaman altın kalsın (fw-6 parlatmasını ez) */
.tema-elegante .price,
.tema-elegante .price .fw-6,
.tema-elegante .price-now,
.tema-elegante .current-price { color: #c4a35a !important; }
.tema-elegante .price .old-price { color: #6f6a60 !important; }

/* --- 7) Beyaz-metin yardımcıları (koyu zemin üstü) ---
   --white token'ı koyuya çekildiği için color:var(--white) kullanan
   .text_white / .text-white metinleri görünmez olmuştu — krem'e sabitle. */
.tema-elegante .text_white,
.tema-elegante .text-white { color: #e6e0d4 !important; }
/* Top bar (dark stil) metni ve linkleri */
.tema-elegante .tf-top-bar .top-bar-text,
.tema-elegante .tf-top-bar.bg_dark .top-bar-text,
.tema-elegante .tf-top-bar a,
.tema-elegante .tf-top-bar .tb-select { color: #e6e0d4 !important; }
.tema-elegante .tf-top-bar .box-icon { background: #1c1c1c !important; }

/* --- 8) İletişim sayfası (kendi <style> bloğu hardcoded açık renk taşıyor) --- */
.tema-elegante .contact-form-box {
    background: #161616 !important;
    border-color: #262626 !important;
    box-shadow: none !important;
}
.tema-elegante .contact-info-card {
    background: #161616 !important;
    border-color: #262626 !important;
}
.tema-elegante .contact-form-box label { color: #d6d0c3 !important; }
.tema-elegante .contact-info-text .label { color: #a59f92 !important; }
.tema-elegante .contact-info-text a { color: #e2dccf !important; }
.tema-elegante .contact-info-text a:hover { color: #c4a35a !important; }
.tema-elegante .map-placeholder {
    background: #121212 !important;
    color: #8a857a !important;
    border: 1px solid #262626;
}
.tema-elegante .working-hours-badge {
    background: #14241a !important;
    color: #6dd58f !important;
    border-color: #2c4a37 !important;
}
.tema-elegante .contact-form-box .form-control { border-color: #333 !important; background: #161616 !important; color: #e6e0d4 !important; }
.tema-elegante .contact-form-box .form-select { border-color: #333 !important; background: #161616 !important; color: #e6e0d4 !important; }

/* ===================================================================
   ELEGANTE — TURCOELEGANTE RAFINE + MOBİL UYUM
   =================================================================== */

/* Bölüm başlık — alt başlık Raleway uppercase altın */
.tema-elegante .flat-title .sub,
.tema-elegante .heading-section .sub {
    font-family: 'Raleway', sans-serif;
    font-size: 11px;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: #c4a35a;
    font-weight: 500;
    display: block;
    margin-bottom: 10px;
}

/* Bölüm başlıkları — geniş padding, altın ayraç */
.tema-elegante .flat-title {
    padding-top: 20px;
    padding-bottom: 8px;
}
.tema-elegante .flat-title .title,
.tema-elegante .heading-section {
    position: relative;
    padding-bottom: 18px;
}
.tema-elegante .flat-title .title::after,
.tema-elegante .heading-section::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    width: 36px;
    height: 1px;
    background: #c4a35a;
}

/* Marquee — Raleway, harf aralıklı */
.tema-elegante .tf-marquee .marquee-item {
    font-family: 'Raleway', sans-serif;
    letter-spacing: .18em;
    font-size: 11px;
    font-weight: 500;
}

/* Ürün kartı galeri stili — şeffaf bg, geniş gap, opacity hover */
.tema-elegante .card-product .card-product-wrapper {
    background: #111 !important;
    border: 1px solid #1e1e1e !important;
}
.tema-elegante .card-product .card-product-wrapper img {
    transition: opacity .5s ease;
}
.tema-elegante .card-product:hover .card-product-wrapper img {
    opacity: .85;
    transform: none !important;
}
.tema-elegante .card-product .card-product-info {
    padding-top: 12px;
}
.tema-elegante .grid-layout,
.tema-elegante .tf-grid-layout {
    gap: 32px 24px !important;
}

/* Fiyat — Raleway, ince */
.tema-elegante .price,
.tema-elegante .price-now,
.tema-elegante .current-price {
    font-family: 'Raleway', sans-serif !important;
    font-size: .88rem !important;
    letter-spacing: .06em !important;
}

/* Breadcrumb — küçük Raleway */
.tema-elegante .tf-breadcrumb .breadcrumb-item,
.tema-elegante .breadcrumb li {
    font-family: 'Raleway', sans-serif;
    font-size: 11px;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #6b665d;
}
.tema-elegante .tf-breadcrumb .breadcrumb-item.active { color: #a59f92; }

/* Mobil menü — koyu uyum, net skala */
.tema-elegante .offcanvas-menu,
.tema-elegante #mobileMenu,
.tema-elegante .mobile-menu-wrap {
    background: var(--el-mob-bg) !important;
}
/* 1. seviye link — parlak krem, görünür ayraç */
.tema-elegante .nav-ul-mb .nav-mb-item .mb-menu-link {
    font-family: 'Raleway', sans-serif;
    letter-spacing: .14em;
    font-size: 12px;
    font-weight: 500;
    text-transform: uppercase;
    color: var(--el-ink) !important;
    border-bottom: none !important;              /* ayraç <li>'de; link kenarlığı kaldırıldı (çift çizgi olmasın) */
    transition: color .2s ease;
}
/* Asıl ayraç — base styles.css <li>'ye parlak rgb(238,238,238) koyuyor; soluk hairline'a çevir */
.tema-elegante .nav-ul-mb .nav-mb-item:not(:last-child) {
    border-bottom: 1px solid rgba(255,255,255,.035) !important;
}
.tema-elegante .nav-ul-mb .nav-mb-item .mb-menu-link:hover,
.tema-elegante .nav-ul-mb .nav-mb-item .mb-menu-link.active { color: var(--el-gold) !important; }
.tema-elegante .nav-ul-mb .btn-open-sub::before { color: var(--el-ink-dim) !important; }
/* Alt seviye link — sönük krem (hiyerarşi netliği) */
.tema-elegante .nav-ul-mb .sub-nav-link {
    color: var(--el-ink-dim) !important;
    text-transform: none;
    letter-spacing: .04em;
}
.tema-elegante .nav-ul-mb .sub-nav-link.fw-6 { color: var(--el-ink) !important; }
.tema-elegante .nav-ul-mb .sub-nav-link:hover { color: var(--el-gold) !important; }
.tema-elegante .tf-mobile-title { color: var(--el-ink); }
.tema-elegante .canvas-mb-body,
.tema-elegante #mobileMenu .offcanvas-body { background: var(--el-mob-bg); }

/* Header ikonları (arama + sepet) her kırılımda okunur kalsın —
   kural önceden sadece mobil media query içindeydi, desktop'ta siyah kalıyordu */
.tema-elegante .nav-icon-item i,
.tema-elegante .header .icon { color: #e6e0d4 !important; }

/* Mobil ürün kartı — daha az gap */
@media (max-width: 767px) {
    .tema-elegante .grid-layout,
    .tema-elegante .tf-grid-layout {
        gap: 20px 12px !important;
    }
    .tema-elegante h1 { font-size: 2rem; }
    .tema-elegante h2 { font-size: 1.6rem; }
    .tema-elegante .card-product .title { font-size: .95rem; }
    /* Video slider mobilde de tam ekran (svh: adres çubuğunu hesaba katar) */
    .esc-slider-video { min-height: 100vh !important; min-height: 100svh !important; }
    .esc-slider-video .sv-content h2 { font-size: 2rem; }
}

/* Tablet */
@media (min-width: 768px) and (max-width: 991px) {
    .tema-elegante .grid-layout,
    .tema-elegante .tf-grid-layout {
        gap: 24px 16px !important;
    }
}

/* ===================================================================
   ELEGANTE — ADET STEPPER + ÜRÜN DETAY EK DÜZELTMELER
   =================================================================== */

/* Adet wrapper — ŞEFFAF (eski [class*="quantity"] tüm kutuyu dolduruyordu) */
.tema-elegante .tf-product-info-quantity,
.tema-elegante .quantity-wrap {
    background: transparent !important;
    border: none !important;
}
/* Stepper kutusunun kendisi (.wg-quantity) aşağıdaki rafine blokta stillenir */

/* "YENİ" rozeti — yeşil yerine altın çerçeve */
.tema-elegante .badge-new,
.tema-elegante .on-new-item,
.tema-elegante .card-product .on-sale-wrap .on-new-item {
    background: transparent !important;
    border: 1px solid #c4a35a !important;
    color: #c4a35a !important;
    border-radius: 0 !important;
    font-family: 'Raleway', sans-serif !important;
    font-size: 9px !important;
    letter-spacing: .14em !important;
    font-weight: 600 !important;
}

/* Beden seçici butonları — koyu, seçili altın */
.tema-elegante .tf-variant-btns .variant-btn,
.tema-elegante .size-list .size-item,
.tema-elegante .variant-size button,
.tema-elegante [class*="variant"] button,
.tema-elegante .list-color-product .list-color-item {
    background: #161616 !important;
    border: 1px solid #333 !important;
    color: #d6d0c3 !important;
    border-radius: 0 !important;
}
.tema-elegante .tf-variant-btns .variant-btn:hover,
.tema-elegante .size-list .size-item:hover,
.tema-elegante .tf-variant-btns .variant-btn.active,
.tema-elegante .size-list .size-item.active,
.tema-elegante .tf-variant-btns .variant-btn.is-checked {
    background: #c4a35a !important;
    border-color: #c4a35a !important;
    color: #0d0d0d !important;
}
/* Stokta yok beden — üstü çizgili */
.tema-elegante .tf-variant-btns .variant-btn.out-of-stock,
.tema-elegante .size-list .size-item.out-of-stock {
    opacity: .35 !important;
    text-decoration: line-through !important;
    cursor: not-allowed !important;
}

/* ===================================================================
   ELEGANTE — ÜRÜN DETAY: İNLINE STYLE EZİLMESİ
   =================================================================== */

/* Fiyat — inline color:#ef4444 veya color:#16a34a yerine altın */
.tema-elegante .price-on-sale,
.tema-elegante #detayFiyatText,
.tema-elegante .price-on-sale.fw-bold {
    color: #c4a35a !important;
}
/* Eski fiyat üstü çizili — soluk gri */
.tema-elegante .compare-at-price,
.tema-elegante del,
.tema-elegante s {
    color: #4a4540 !important;
}

/* YENİ rozeti — inline background:#22c55e eziyor */
.tema-elegante .badges,
.tema-elegante .tf-product-info-badges .badges {
    background: transparent !important;
    border: 1px solid #c4a35a !important;
    color: #c4a35a !important;
    border-radius: 0 !important;
    font-family: 'Raleway', sans-serif !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    letter-spacing: .14em !important;
    padding: 4px 10px !important;
}
/* İndirim rozeti — inline background:#ef4444 eziyor */
.tema-elegante .tf-product-info-badges .badges:nth-child(2),
.tema-elegante .tf-product-info-badges .badges:last-child {
    background: #1a1a1a !important;
    border: 1px solid #333 !important;
    color: #c4a35a !important;
}

/* Kart rozetleri — bg-main (kırmızı) ve bg-danger (kırmızı) ezi */
.tema-elegante .on-sale-item.bg-main,
.tema-elegante .on-sale-item.bg-primary {
    background: #c4a35a !important;
    color: #0d0d0d !important;
}
.tema-elegante .on-sale-item.bg-danger {
    background: #1a1a1a !important;
    color: #c4a35a !important;
    border: 1px solid #333 !important;
}
.tema-elegante .on-sale-item.bg-dark {
    background: #1a1a1a !important;
    color: #6b665d !important;
    border: 1px solid #2a2a2a !important;
}
.tema-elegante .on-sale-item.bg-warning {
    background: #c4a35a !important;
    color: #0d0d0d !important;
}

/* Adet stepper — daha rafine görünüm */
.tema-elegante .wg-quantity {
    display: inline-flex !important;
    align-items: center;
    border: 1px solid #2e2e2e !important;
    background: transparent !important;
    border-radius: 0 !important;
    overflow: hidden;
}
.tema-elegante .wg-quantity .btn-quantity,
.tema-elegante .wg-quantity button {
    width: 40px !important;
    height: 44px !important;
    background: transparent !important;
    color: var(--el-gold) !important;
    border: none !important;
    font-size: 18px !important;
    display: flex; align-items: center; justify-content: center;
    transition: all .2s ease;
}
.tema-elegante .wg-quantity .btn-quantity:hover,
.tema-elegante .wg-quantity button:hover {
    background: #c4a35a !important;
    color: #0d0d0d !important;
}
.tema-elegante .wg-quantity input {
    width: 56px !important;
    height: 44px !important;
    background: transparent !important;
    color: #f3eee3 !important;
    border: none !important;
    border-left: 1px solid #2e2e2e !important;
    border-right: 1px solid #2e2e2e !important;
    text-align: center;
    font-family: 'Raleway', sans-serif;
    font-size: 14px;
}

/* ===================================================================
   ELEGANTE — MOBİL & GENEL KAPSAMLI DÜZELTME
   =================================================================== */

/* 1) HEADER DROPDOWN MENÜ — beyaz zemin koyu olsun */
.tema-elegante .box-nav-ul .menu-item .sub-menu,
.tema-elegante .box-nav-ul .menu-item .sub-menu.submenu-default,
.tema-elegante .nav-sub-menu,
.tema-elegante .sub-menu {
    background: #0f0f0f !important;
    border: 1px solid #222 !important;
    box-shadow: 0 8px 32px rgba(0,0,0,.6) !important;
}
.tema-elegante .box-nav-ul .menu-item .sub-menu a,
.tema-elegante .sub-menu .menu-list li a,
.tema-elegante .nav-sub-menu a {
    color: #d8d2c4 !important;
    background: transparent !important;
}
.tema-elegante .box-nav-ul .menu-item .sub-menu a:hover,
.tema-elegante .sub-menu .menu-list li a:hover {
    color: #c4a35a !important;
    background: #161616 !important;
    padding-left: 24px !important;
}
/* Mega menu da koyu olsun */
.tema-elegante .sub-menu.mega-menu,
.tema-elegante .mega-menu {
    background: #0f0f0f !important;
    border: 1px solid #222 !important;
}
.tema-elegante .mega-menu-footer {
    background: #111 !important;
    border-top: 1px solid #222 !important;
}
.tema-elegante .mega-cat-title { color: #f3eee3 !important; }
.tema-elegante .mega-cat-list li a { color: #a59f92 !important; }
.tema-elegante .mega-cat-list li a:hover { color: #c4a35a !important; }

/* 2) MOBİL FİLTRE BARI + SIRALAMA DROPDOWN */
.tema-elegante .shop-filter-bar,
.tema-elegante .tf-shop-control,
.tema-elegante .toolbar-shop,
.tema-elegante .filter-bar,
.tema-elegante .meta-filter-shop,
.tema-elegante .grid-filter {
    background: #111 !important;
    border: 1px solid #222 !important;
    color: #d6d0c3 !important;
}
.tema-elegante .tf-dropdown-sort,
.tema-elegante select.tf-dropdown-sort,
.tema-elegante .nice-select,
.tema-elegante .sort-select,
.tema-elegante select[name*="sort"],
.tema-elegante select[name*="siralama"] {
    background: #161616 !important;
    border: 1px solid #2e2e2e !important;
    color: #d6d0c3 !important;
    border-radius: 0 !important;
}
.tema-elegante .nice-select .list {
    background: #0f0f0f !important;
    border: 1px solid #222 !important;
}
.tema-elegante .nice-select .option { color: #d6d0c3 !important; }
.tema-elegante .nice-select .option:hover,
.tema-elegante .nice-select .option.selected { color: #c4a35a !important; background: #161616 !important; }
/* Filtre butonu */
.tema-elegante .btn-filter,
.tema-elegante .filter-btn,
.tema-elegante button[data-bs-toggle="offcanvas"].btn-filter {
    background: #161616 !important;
    border: 1px solid #2e2e2e !important;
    color: #d6d0c3 !important;
    border-radius: 0 !important;
}
.tema-elegante .btn-filter:hover { border-color: #c4a35a !important; color: #c4a35a !important; }

/* Mobil filtre + sırala barı (.mobil-filtre-bar) — page-level #f8f8f8 beyazını ez */
.tema-elegante .mobil-filtre-bar {
    background: var(--el-mob-panel) !important;
    border: 1px solid var(--el-mob-line);
    border-radius: 0 !important;
}
/* Filtrele butonu (.tf-btn.btn-line) */
.tema-elegante .mobil-filtre-bar .tf-btn.btn-line {
    background: transparent !important;
    border-color: var(--el-mob-line) !important;
    color: var(--el-ink) !important;
    border-radius: 0 !important;
}
.tema-elegante .mobil-filtre-bar .tf-btn.btn-line i { color: var(--el-gold) !important; }
.tema-elegante .mobil-filtre-bar .tf-btn.btn-line:hover {
    border-color: var(--el-gold) !important;
    color: var(--el-gold) !important;
}
/* Aktif filtre sayacı — siyah yerine altın pul */
.tema-elegante .mobil-filtre-bar .filtre-aktif-sayac {
    background: var(--el-gold) !important;
    color: #0d0d0d !important;
    border-radius: 0 !important;
}
/* Sırala seçici (.form-select) — beyaz zemin + görünmez ok */
.tema-elegante .mobil-filtre-bar .form-select,
.tema-elegante .form-select {
    background-color: var(--el-mob-bg) !important;
    color: var(--el-ink) !important;
    border: 1px solid var(--el-mob-line) !important;
    border-radius: 0 !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23cba968' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e") !important;
    background-repeat: no-repeat !important;
    background-position: right .65rem center !important;
    background-size: 14px 12px !important;
}
.tema-elegante .mobil-filtre-bar .form-select option,
.tema-elegante .form-select option {
    background-color: var(--el-mob-bg) !important;
    color: var(--el-ink) !important;
}

/* 3) MOBİL ALT NAVİGASYON BARI (.tf-mobile-bottom) — net renk skalası
   Not: markup'ta inline style="background:#fff" var, !important ile eziyoruz. */
.tema-elegante .tf-mobile-bottom {
    background: var(--el-mob-bg) !important;
    border-top: 1px solid var(--el-mob-line) !important;
}
/* Pasif: okunur sönük krem (inline .text-dark'ı ez, zemine gömülmesin) */
.tema-elegante .tf-mobile-bottom a,
.tema-elegante .tf-mobile-bottom a.text-dark {
    color: var(--el-ink-dim) !important;
    position: relative;
    transition: color .2s ease;
}
.tema-elegante .tf-mobile-bottom a i,
.tema-elegante .tf-mobile-bottom a span { color: inherit !important; }
/* Aktif/hover: canlı altın + üst gösterge çizgisi */
.tema-elegante .tf-mobile-bottom a:hover,
.tema-elegante .tf-mobile-bottom a.active {
    color: var(--el-gold) !important;
}
.tema-elegante .tf-mobile-bottom a.active::before {
    content: "";
    position: absolute;
    top: -8px; left: 50%; transform: translateX(-50%);
    width: 22px; height: 2px;
    background: var(--el-gold);
}
/* Rozet (favori/sepet sayısı) — köşeli okunur altın pul */
.tema-elegante .tf-mobile-bottom .count-box {
    background: var(--el-gold) !important;
    color: #0d0d0d !important;
    border: none !important;
    border-radius: 0 !important;
    min-width: 16px;
    height: 16px;
    line-height: 16px;
    padding: 0 3px;
    font-size: 10px !important;
    font-weight: 700;
    text-align: center;
    top: -2px !important;
    right: calc(50% - 20px) !important;
}
.tema-elegante .tf-mobile-bottom span[style*="font-size:10px"] {
    font-family: 'Raleway', sans-serif !important;
    letter-spacing: .08em;
}

/* 4) MOBİL MENÜ — hesabım butonu + genel (net skala) */
.tema-elegante .canvas-mb,
.tema-elegante #mobileMenu,
.tema-elegante .offcanvas.offcanvas-start {
    background: var(--el-mob-bg) !important;
    border-right: 1px solid var(--el-mob-line) !important;
}
.tema-elegante .canvas-mb-body,
.tema-elegante #mobileMenu .offcanvas-body {
    background: var(--el-mob-bg) !important;
}
/* X kapat butonu */
.tema-elegante .canvas-mb .btn-close,
.tema-elegante #mobileMenu .btn-close,
.tema-elegante .offcanvas .btn-close {
    filter: invert(1) brightness(1.5) !important;
}
/* Drawer alt kısım (.mb-bottom) — yükseltilmiş yüzey + "Hesabım" linki */
.tema-elegante .canvas-mb .mb-bottom {
    background: var(--el-mob-panel) !important;
    border-top: 1px solid var(--el-mob-line) !important;
}
.tema-elegante .canvas-mb .site-nav-icon {
    background-color: transparent !important;
    border: 1px solid var(--el-gold) !important;
    border-radius: 0 !important;
    color: var(--el-ink) !important;
    transition: all .2s ease;
}
.tema-elegante .canvas-mb .site-nav-icon .icon,
.tema-elegante .canvas-mb .site-nav-icon i { color: var(--el-gold) !important; }
.tema-elegante .canvas-mb .site-nav-icon:hover {
    background-color: var(--el-gold) !important;
    border-color: var(--el-gold) !important;
    color: #0d0d0d !important;
}
.tema-elegante .canvas-mb .site-nav-icon:hover .icon,
.tema-elegante .canvas-mb .site-nav-icon:hover i { color: #0d0d0d !important; }
/* Drawer içi para birimi / dil seçici */
.tema-elegante .canvas-mb .tb-select {
    background: var(--el-mob-bg) !important;
    color: var(--el-ink) !important;
    border: 1px solid var(--el-mob-line) !important;
    border-radius: 0 !important;
}
/* Drawer içi olası buton */
.tema-elegante .canvas-mb .btn-account,
.tema-elegante .canvas-mb .tf-btn {
    background: var(--el-gold) !important;
    color: #0d0d0d !important;
    border-color: var(--el-gold) !important;
    border-radius: 0 !important;
    font-family: 'Raleway', sans-serif !important;
    letter-spacing: .14em !important;
}

/* 5) FOOTER (dark) — net koyu uyum (gerçek class'lar: .box-icon, .text-white-50) */
.tema-elegante #footer,
.tema-elegante footer.footer.background-black {
    background: var(--el-mob-bg) !important;
}
/* Metin tonları */
.tema-elegante footer .text-white,
.tema-elegante footer h6.text-white { color: var(--el-ink) !important; }
.tema-elegante footer .text-white-50 { color: var(--el-ink-dim) !important; }
.tema-elegante footer .footer-menu_item { color: var(--el-ink-dim) !important; }
.tema-elegante footer a.footer-menu_item:hover,
.tema-elegante footer .text-white-50 a:hover,
.tema-elegante footer a.text-white:hover { color: var(--el-gold) !important; }
.tema-elegante footer .footer-logo span { color: var(--el-ink) !important; }
/* Başlıklar — serif editorial */
.tema-elegante footer .footer-heading h6 {
    font-family: 'Cormorant Garamond', Georgia, serif;
    letter-spacing: .04em;
    color: var(--el-ink) !important;
}

/* İletişim butonu (.tf-btn.btn-line) — altın çerçeve */
.tema-elegante footer .tf-btn.btn-line {
    background: transparent !important;
    border: 1px solid var(--el-gold) !important;
    color: var(--el-ink) !important;
    border-radius: 0 !important;
}
.tema-elegante footer .tf-btn.btn-line i { color: var(--el-gold) !important; }
.tema-elegante footer .tf-btn.btn-line:hover { background: var(--el-gold) !important; color: #0d0d0d !important; }
.tema-elegante footer .tf-btn.btn-line:hover i { color: #0d0d0d !important; }

/* Sosyal ikonlar (.box-icon) — köşeli, görünür, altın hover (gri kare sorunu) */
.tema-elegante footer .tf-social-icon .box-icon,
.tema-elegante footer .box-icon {
    background: transparent !important;
    border: 1px solid var(--el-mob-line) !important;
    border-radius: 0 !important;
    color: var(--el-ink) !important;
    width: 38px !important;
    height: 38px !important;
}
.tema-elegante footer .box-icon i { color: inherit !important; }
.tema-elegante footer .box-icon:hover {
    background: var(--el-gold) !important;
    border-color: var(--el-gold) !important;
    color: #0d0d0d !important;
}

/* Newsletter input + buton */
.tema-elegante footer .subscribe-email {
    background: var(--el-mob-bg) !important;
    border: 1px solid var(--el-mob-line) !important;
    color: var(--el-ink) !important;
    border-radius: 0 !important;
}
.tema-elegante footer .subscribe-button { border-radius: 0 !important; }

/* Accordion mobil başlık + "+" göstergesi */
.tema-elegante footer .footer-heading-moblie,
.tema-elegante footer .footer-col-block .footer-heading {
    border-bottom: 1px solid var(--el-mob-line) !important;
}
.tema-elegante footer .footer-heading-moblie::after,
.tema-elegante footer .footer-col-block .footer-heading::after { color: var(--el-gold) !important; }

/* Alt çizgi + ödeme + ESC Medya linki */
.tema-elegante footer .footer-bottom { border-top: 1px solid var(--el-mob-line) !important; }
.tema-elegante footer img[src*="payment"],
.tema-elegante footer img[src*="Payment"] {
    filter: brightness(0) invert(.7) !important;
    opacity: .7 !important;
}
/* iyzico şeridi marka renkleriyle kalsın — koyu zeminde okunması için açık chip üzerinde */
.tema-elegante footer img[src*="iyzico"] {
    filter: none !important;
    opacity: 1 !important;
    background: #f3eee3;
    padding: 5px 10px;
    height: 34px !important;
}
.tema-elegante footer .footer-bottom a { color: var(--el-ink-dim) !important; }
.tema-elegante footer .footer-bottom a:hover { color: var(--el-gold) !important; }

/* 7) ÜRÜN DETAY — STICKY SEPETE EKLE BARI */
.tema-elegante .tf-sticky-btn-atc {
    background: var(--el-mob-panel) !important;
    border-top: 1px solid var(--el-mob-line) !important;
}
.tema-elegante .tf-sticky-atc-title {
    color: var(--el-ink) !important;
    font-family: 'Cormorant Garamond', Georgia, serif;
}
.tema-elegante .tf-sticky-btn-atc .tf-btn.btn-fill {
    background: var(--el-gold) !important;
    border-color: var(--el-gold) !important;
    color: #0d0d0d !important;
    border-radius: 0 !important;
}
/* Mobilde ürün adını da göster (base'de .tf-sticky-atc-product display:none) */
@media (max-width: 767px) {
    .tema-elegante .tf-sticky-btn-atc .tf-sticky-atc-product { display: flex !important; }
    .tema-elegante .tf-sticky-btn-atc .tf-sticky-atc-img { display: none !important; }
    .tema-elegante .tf-sticky-btn-atc .tf-sticky-atc-title {
        font-size: 13px;
        line-height: 1.25;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        max-width: 100%;
    }
    .tema-elegante .tf-sticky-btn-atc .tf-height-observer { gap: 12px; }
    .tema-elegante .tf-sticky-btn-atc .tf-btn { min-width: 130px !important; }
}

/* 8) SEPET SAYFASI — page-level <style> açık renklerini ez (token dinlemiyorlar) */
.tema-elegante .cart-summary-box {
    background: var(--bg-7) !important;
    border: 1px solid var(--line) !important;
    border-radius: 0 !important;
}
.tema-elegante .kupon-box {
    background: var(--bg-2) !important;
    border: 1px dashed var(--line) !important;
    border-radius: 0 !important;
}
.tema-elegante .cart-summary-row,
.tema-elegante .cart-summary-row.text-muted { color: var(--text) !important; }
.tema-elegante .cart-summary-row .text-dark,
.tema-elegante .satir-toplam { color: var(--el-ink) !important; }
.tema-elegante .cart-summary-total {
    border-top: 2px solid var(--line) !important;
    color: var(--el-ink) !important;
}
.tema-elegante .cart-price { color: var(--text) !important; }
.tema-elegante .cart-meta-variant { color: var(--text-2) !important; }
.tema-elegante .miktar-input {
    background: transparent !important;
    color: var(--el-ink) !important;
    border-left: 1px solid var(--line) !important;
    border-right: 1px solid var(--line) !important;
}
.tema-elegante .btn-quantity { color: var(--el-gold) !important; }
.tema-elegante .btn-quantity:hover { background: rgba(203,169,104,.12) !important; }
.tema-elegante .kargo-progress {
    background: rgba(203,169,104,.08) !important;
    border: 1px solid var(--line) !important;
    border-radius: 0 !important;
    color: var(--text) !important;
}
.tema-elegante .kargo-progress-bar { background: var(--line) !important; }
.tema-elegante .kargo-progress-fill { background: var(--el-gold) !important; }
.tema-elegante .trust-badges { border-top: 1px solid var(--line) !important; }
.tema-elegante .trust-badge { color: var(--text-2) !important; }

/* 6) GENEL: beyaz kalan arka planlar */
.tema-elegante .tf-page-content,
.tema-elegante .shop-sidebar .widget-facet,
.tema-elegante .sidebar-filter-overlay { background: #0d0d0d !important; }

/* Ürün listesi sayfası üst bar */
.tema-elegante .tf-shop-header,
.tema-elegante .shop-result-count { color: #a59f92 !important; }

/* 9) BLOG — liste + detay sayfaları koyu tema uyumu
   (BlogVitrin view'ları page-level <style> ile açık renk tanımlıyor, burada eziliyor) */
.tema-elegante .blog-hero-banner {
    background: #0d0d0d !important;
    border-bottom: 1px solid var(--el-mob-line) !important;
}
.tema-elegante .blog-hero-banner .heading { color: var(--el-ink) !important; }
.tema-elegante .blog-hero-banner .text-secondary { color: var(--text-2) !important; }
.tema-elegante .blog-filter-bar {
    background: #0d0d0d !important;
    border-bottom: 1px solid var(--el-mob-line) !important;
    box-shadow: none !important;
}
.tema-elegante .filter-pill {
    border-color: var(--el-mob-line) !important;
    color: var(--text) !important;
    border-radius: 0 !important;
}
.tema-elegante .filter-pill:hover { border-color: var(--el-gold) !important; color: var(--el-gold) !important; }
.tema-elegante .filter-pill.active {
    background: var(--el-gold) !important;
    border-color: var(--el-gold) !important;
    color: #0d0d0d !important;
}
/* Kartlar (liste, ilgili yazılar, featured, sidebar) */
.tema-elegante .blog-article-item,
.tema-elegante .sidebar-widget-card,
.tema-elegante .featured-blog-card .bg-white {
    background: #141414 !important;
    border-color: var(--el-mob-line) !important;
    border-radius: 0 !important;
}
.tema-elegante .sidebar-widget-header {
    background: #191919 !important;
    border-bottom-color: var(--el-mob-line) !important;
}
.tema-elegante .sidebar-widget-title { color: var(--el-ink) !important; }
.tema-elegante .blog-card-placeholder,
.tema-elegante .featured-img-placeholder,
.tema-elegante .recent-post-img-placeholder { background: #1e1e1e !important; }
.tema-elegante .article-title-clamp,
.tema-elegante .recent-post-title,
.tema-elegante .blog-nav-title { color: var(--el-ink) !important; }
.tema-elegante .featured-blog-card .text-dark,
.tema-elegante .blog-article-item .text-dark { color: var(--el-ink) !important; }
.tema-elegante .category-link {
    color: var(--text) !important;
    border-bottom-color: var(--el-mob-line) !important;
}
.tema-elegante .category-link:hover,
.tema-elegante .category-link.active { color: var(--el-gold) !important; }
.tema-elegante .tag-pill {
    border-color: var(--el-mob-line) !important;
    color: var(--text) !important;
    border-radius: 0 !important;
}
.tema-elegante .tag-pill:hover {
    background: var(--el-gold) !important;
    border-color: var(--el-gold) !important;
    color: #0d0d0d !important;
}
.tema-elegante .tf-pagination-item {
    border-color: var(--el-mob-line) !important;
    color: var(--text) !important;
}
.tema-elegante .tf-pagination-item:hover,
.tema-elegante .tf-pagination-item.active {
    background: var(--el-gold) !important;
    border-color: var(--el-gold) !important;
    color: #0d0d0d !important;
}
.tema-elegante .search-result-info {
    background: #141414 !important;
    border-color: var(--el-mob-line) !important;
}
.tema-elegante .blog-empty-state h4 { color: var(--el-ink) !important; }
.tema-elegante .blog-empty-state .empty-icon i { color: #3a3a3a !important; }
.tema-elegante .blog-sidebar .search-input {
    background: #141414 !important;
    border-color: var(--el-mob-line) !important;
    color: var(--el-ink) !important;
}
/* Blog detay */
/* Tema globalinde `header{position:sticky}` kuralı makale <header>'ına da uygulanıyordu —
   başlık scroll'da sabit kalıp içeriğin üstüne biniyordu (tüm temalar için geçerli düzeltme) */
.blog-detail-header {
    position: static !important;
    background: transparent !important;
    box-shadow: none !important;
    z-index: auto !important;
}
.tema-elegante .blog-detail-title {
    color: var(--el-ink) !important;
    font-size: clamp(1.5rem, 3vw, 2.3rem) !important;
    font-style: normal !important;
    line-height: 1.3 !important;
}
.tema-elegante .blog-meta-item { color: var(--text-2) !important; }
.tema-elegante .blog-meta-divider { color: var(--el-mob-line) !important; }
.tema-elegante .blog-meta-category { color: var(--el-gold) !important; }
.tema-elegante .category-badge-dark { background: var(--el-gold) !important; color: #0d0d0d !important; }
.tema-elegante .hero-category-badge { background: var(--el-gold) !important; color: #0d0d0d !important; }
.tema-elegante .blog-content-body { color: var(--text) !important; }
.tema-elegante .blog-content-body h1,
.tema-elegante .blog-content-body h2,
.tema-elegante .blog-content-body h3,
.tema-elegante .blog-content-body h4,
.tema-elegante .blog-content-body h5,
.tema-elegante .blog-content-body h6,
.tema-elegante .blog-content-body strong,
.tema-elegante .blog-content-body b { color: var(--el-ink) !important; }
.tema-elegante .blog-content-body h2 { border-bottom-color: var(--el-mob-line) !important; }
.tema-elegante .blog-content-body a { color: var(--el-gold) !important; }
.tema-elegante .blog-content-body a:hover { color: var(--el-ink) !important; }
.tema-elegante .blog-content-body blockquote {
    background: #141414 !important;
    border-left-color: var(--el-gold) !important;
    border-radius: 0 !important;
}
.tema-elegante .blog-content-body table th { background: #191919 !important; color: var(--el-ink) !important; }
.tema-elegante .blog-content-body table th,
.tema-elegante .blog-content-body table td { border-color: var(--el-mob-line) !important; }
.tema-elegante .blog-content-body table tr:nth-child(even) { background: #141414 !important; }
.tema-elegante .blog-content-body pre,
.tema-elegante .blog-content-body code { background: #141414 !important; }
.tema-elegante .blog-detail-footer { border-top-color: var(--el-mob-line) !important; }
.tema-elegante .blog-nav-row { border-top-color: var(--el-mob-line) !important; }
.tema-elegante .blog-nav-item {
    border-color: var(--el-mob-line) !important;
    border-radius: 0 !important;
}
.tema-elegante .blog-nav-item:hover { border-color: var(--el-gold) !important; box-shadow: none !important; }
.tema-elegante .share-icon-btn { border-color: var(--el-mob-line) !important; color: var(--text) !important; }
.tema-elegante .share-icon-btn:hover {
    background: var(--el-gold) !important;
    border-color: var(--el-gold) !important;
    color: #0d0d0d !important;
}

/* ===================================================================
   HERO YOUTUBE — branding/ikon gizleme (kırpma)
   YouTube logosu ve UI, video karesinin köşelerinde durur. İframe'i
   büyütüp merkezleyince bu köşeler görünür alanın DIŞINA taşar → ikonlar
   görünmez. pointer-events:none zaten hover UI'ını da engelliyor.
   =================================================================== */
.esc-slider-video .sv-video-wrap iframe {
    transform: translate(-50%, -50%) scale(1.35) !important;
    pointer-events: none;
}
/* Ekstra güvence: alt şeride (logo bölgesi) ince bir maske */
.esc-slider-video .sv-video-wrap::after {
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: 60px;
    background: linear-gradient(to top, rgba(10,10,10,.55), transparent);
    pointer-events: none;
    z-index: 1;
}

/* ===================================================================
   REDESIGN v1 — Tipografi + Ürün Kartı  (güçlü & karakterli)
   Başlıklar: Oswald (güçlü display) · Gövde/UI/ürün adı: Inter (okunur)
   Dosya sonunda → base + eski elegante kurallarını ezer.
   =================================================================== */
/* Gövde/UI — Inter (font-set 'Lato'yu !important ile ezer).
   NOT: span/li/td EKLENMEZ — bunlar body'den zaten Inter miras alır; span'a
   font zorlamak icomoon ikon fontunu ezip ürün kartı ikonlarını yok ediyordu. */
.tema-elegante,
.tema-elegante p,
.tema-elegante label,
.tema-elegante input,
.tema-elegante select,
.tema-elegante textarea,
.tema-elegante button { font-family: 'Inter', sans-serif !important; letter-spacing: 0; }

/* İkon fontunu koru — Inter override'ı .icon glyph'lerini bozmasın */
.tema-elegante .icon,
.tema-elegante [class^="icon-"],
.tema-elegante [class*=" icon-"],
.tema-elegante .icon::before,
.tema-elegante [class^="icon-"]::before,
.tema-elegante [class*=" icon-"]::before { font-family: 'icomoon' !important; }

/* Başlıklar — Oswald, güçlü, uppercase (font-set 'Cinzel'i ezer) */
.tema-elegante h1, .tema-elegante h2, .tema-elegante h3,
.tema-elegante h4, .tema-elegante h5, .tema-elegante h6,
.tema-elegante .heading,
.tema-elegante .flat-title .title,
.tema-elegante .banner-gr-title,
.tema-elegante .slider-title,
.tema-elegante .box-title-slider h1,
.tema-elegante .box-title-slider h2,
.tema-elegante .esc-slider-video .sv-content h1,
.tema-elegante .esc-slider-video .sv-content h2 {
    font-family: 'Oswald', sans-serif !important;
    font-style: normal !important;
    font-weight: 500;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: #f3eee3;
}
.tema-elegante h1,
.tema-elegante .banner-gr-title,
.tema-elegante .slider-title,
.tema-elegante .esc-slider-video .sv-content h1 { font-weight: 600; letter-spacing: .05em; }
/* Hero başlığını biraz küçült (Oswald geniş → aynı boyutta iri duruyordu) */
.tema-elegante .esc-slider-video .sv-content h1,
.tema-elegante .esc-slider-video .sv-content h2 {
    font-size: clamp(2rem, 4.6vw, 3.6rem) !important;
    line-height: 1.08 !important;
}
/* Bölüm başlıkları da bir tık küçülsün */
.tema-elegante .flat-title .title,
.tema-elegante h2 { font-size: clamp(1.5rem, 2.6vw, 2.2rem) !important; }

/* Menü / footer başlıkları da Oswald ile güçlensin */
.tema-elegante .box-nav-ul .menu-item > a,
.tema-elegante .box-nav-ul .item-link,
.tema-elegante .footer h5, .tema-elegante .footer h6,
.tema-elegante .footer-heading {
    font-family: 'Oswald', sans-serif !important;
    font-weight: 500;
}

/* --- Ürün kartı: okunur isim + isim/fiyat nefes payı + ferah alan --- */
.tema-elegante .card-product .card-product-info {
    padding: 16px 14px 16px !important;
    text-align: left;
}
.tema-elegante .card-product .title,
.tema-elegante .card-product .title a {
    font-family: 'Inter', sans-serif !important;
    font-style: normal !important;
    font-weight: 600 !important;
    font-size: .9rem !important;
    line-height: 1.4 !important;
    letter-spacing: .01em !important;
    text-transform: none !important;
    color: #efe9dd !important;
    /* DİKKAT: display:block, base'deki -webkit-line-clamp:2'yi iptal ediyordu; uzun
       ürün adları 3. satıra taşıp satırdaki kartı yükseltiyordu. Clamp -webkit-box ister. */
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 2.8em;            /* 2 satır × 1.4 — tek satırlık isimde de aynı yer tutar */
    margin-bottom: 9px;           /* ← isim ile fiyat artık yapışık değil */
}
.tema-elegante .card-product .title a:hover { color: #c4a35a !important; }
.tema-elegante .card-product .price {
    display: block;
    margin-top: 0;
    font-size: .95rem;
    letter-spacing: .02em;
    line-height: 1.3;
}
.tema-elegante .card-product .price .old-price { font-size: .82rem; }

/* Kart görsel çerçevesi — hafif, tutarlı; karışık zeminleri toparlar */
.tema-elegante .card-product .card-product-wrapper {
    border: 1px solid #242424;
    background: #121212;
}

/* "Sepete Ekle" (style-7 bilgi alanı butonu) her zaman görünür ve güçlü */
.tema-elegante .card-product .btn-quick-add {
    display: block;
    width: 100%;
    text-align: center;
    padding: 11px 14px;
    margin-bottom: 12px;
    font-family: 'Oswald', sans-serif;
    font-weight: 500;
    letter-spacing: .14em;
    text-transform: uppercase;
    font-size: 12px;
    background: transparent;
    color: #e6e0d4;
    border: 1px solid #c4a35a;
    transition: background .25s ease, color .25s ease;
}
.tema-elegante .card-product .btn-quick-add:hover {
    background: #c4a35a;
    color: #0d0d0d;
}

/* ===================================================================
   REDESIGN v1 — Düzeltmeler (kurumsal sayfalar + footer ödeme ikonları)
   =================================================================== */
/* Kurumsal/statik sayfa başlıkları koyu (rgb 24,24,24) → koyu zeminde
   görünmüyordu. Elegante'de aydınlat. Tüm .static-page-content sayfaları. */
.tema-elegante .static-page-content h1,
.tema-elegante .static-page-content h2,
.tema-elegante .static-page-content h3,
.tema-elegante .static-page-content h4,
.tema-elegante .static-page-content h5,
.tema-elegante .static-page-content h6 { color: #f3eee3 !important; }
.tema-elegante .static-page-content,
.tema-elegante .static-page-content p,
.tema-elegante .static-page-content li { color: #cfc9bd; }
.tema-elegante .static-page-content strong,
.tema-elegante .static-page-content b { color: #ece7da; }
.tema-elegante .static-page-content a { color: #c4a35a; }
/* "İçindekiler" (TOC) yan menü — koyu #555 linkler okunmuyordu */
.tema-elegante .page-sidebar-nav a { color: #b7b1a4 !important; }
.tema-elegante .page-sidebar-nav a:hover,
.tema-elegante .page-sidebar-nav a.active { color: #c4a35a !important; }
.tema-elegante .page-sidebar-nav .fw-6,
.tema-elegante .page-sidebar-nav .fw-7 { color: #f3eee3 !important; }

/* Footer ödeme kartı ikonları — cream/beyaz zemini kaldır (şeffaf) */
.tema-elegante .tf-payment img {
    background: transparent !important;
    padding: 2px 4px !important;
}

/* Ürünler filtresi — BEDEN/nitelik butonları görünmüyordu.
   Inline background:#fff köprüyle koyulaşınca color:#333 kalıp koyu-üstü-koyu
   olduğundan değerler kayboluyordu. Koyu zemin + açık yazı + görünür çerçeve. */
.tema-elegante .beden-btn.nitelik-filtre-btn,
.tema-elegante .nitelik-filtre-btn.btn-outline {
    background: #161616 !important;
    color: #e2dccf !important;
    border-color: #3a3a3a !important;
}
.tema-elegante .beden-btn.nitelik-filtre-btn:hover,
.tema-elegante .nitelik-filtre-btn.btn-outline:hover {
    border-color: #c4a35a !important;
    color: #c4a35a !important;
}
.tema-elegante .beden-btn.nitelik-filtre-btn.btn-fill,
.tema-elegante .nitelik-filtre-btn.btn-fill {
    background: #c4a35a !important;
    color: #0d0d0d !important;
    border-color: #c4a35a !important;
}

/* ===================================================================
   DİKEY (PORTRE) LOGO UYUMU — alparts gibi uzun logolar
   max-height ile ölçeklenir (yatay logoları bozmaz), width auto.
   Header'a göre responsive: anasayfa şeffaf header'da belirgin,
   scroll'da ve iç sayfalarda kompakt. Mobilde daha küçük.
   =================================================================== */
.tema-elegante .logo-header { display: inline-flex; align-items: center; }
.tema-elegante .logo-header .logo {
    width: auto;
    height: auto;
    object-fit: contain;
}
/* Anasayfa şeffaf header — hero üstünde belirgin dursun (ilk görünümde daha büyük) */
.tema-elegante #header.header-absolute .logo-header .logo {
    max-height: 104px;
    transition: max-height .3s ease;
}
/* Scroll edilince küçülen sabit header */
.tema-elegante #header.header-absolute.header-bg .logo-header .logo {
    max-height: 54px;
}
/* İç sayfa dolu header */
.tema-elegante #header.header-default:not(.header-absolute) .logo-header .logo {
    max-height: 66px;
}
@media (max-width: 991px) {
    .tema-elegante #header.header-absolute .logo-header .logo { max-height: 70px; }
    .tema-elegante #header.header-absolute.header-bg .logo-header .logo { max-height: 50px; }
    .tema-elegante #header.header-default:not(.header-absolute) .logo-header .logo { max-height: 54px; }
}

/* ===================================================================
   TEMA-ORGANIK — Doğal Minimalizm (Organik / Sürdürülebilir Moda)
   İlham: betisaco.com — beyaz zemin, kum (sand) bantlar, espresso metin,
   yüksek kontrastlı serif başlık + Inter gövde, keskin köşe, bol boşluk.
   renk_sinifi="tema-organik" ile body'ye uygulanır.
   --- Renkler ---
   zemin #ffffff · bant #f8f3ec · mürekkep #121212 · espresso #3e2c20 · çizgi #e7ded1
   NOT: DM Serif Display + Inter, font eklentisindeki "dmserif-inter" setiyle
   yüklenir. Eklenti kapalıysa temayla gelen Gloock / Albert Sans'a düşer.
   =================================================================== */
.tema-organik {
    --primary: #3e2c20;            /* espresso — vurgu */
    --main: #121212;               /* mürekkep */
    --backdrop: #f8f3ec;           /* kum bant */
    --org-ink: #121212;
    --org-sand: #f8f3ec;
    --org-espresso: #3e2c20;
    --org-line: #e7ded1;
    --org-dim: rgba(18,18,18,.62);
    --org-btn: #6b5443;            /* sıcak kahve — buton zemini (siyah değil) */
    --org-btn-hover: #4a382b;
    background-color: #fff;
    font-family: 'Inter', 'Albert Sans', sans-serif;
    font-weight: 400;
    color: rgba(18,18,18,.82);
    letter-spacing: 0;
}

/* Başlıklar — yüksek kontrastlı display serif */
.tema-organik h1, .tema-organik h2, .tema-organik h3,
.tema-organik h4, .tema-organik h5, .tema-organik h6,
.tema-organik .heading,
.tema-organik .tf-cart-title,
.tema-organik .product-name,
.tema-organik .card-product .title {
    font-family: 'DM Serif Display', 'Gloock', Georgia, serif;
    font-weight: 400;
    letter-spacing: .005em;
    color: #121212;
    line-height: 1.2;
}
.tema-organik h1 { font-size: clamp(2.4rem, 5vw, 4.2rem); }
.tema-organik h2 { font-size: clamp(1.8rem, 3.4vw, 2.9rem); }
.tema-organik h3 { font-size: clamp(1.35rem, 2.4vw, 1.9rem); }

/* Ürün kartı adı — serif ama küçük punto (etiket hissi) */
.tema-organik .card-product .title,
.tema-organik .card-product .title a {
    font-size: 1rem;
    letter-spacing: 0;
    color: #121212;
}

/* Butonlar — mürekkep zemin, keskin köşe, harf aralıklı uppercase */
.tema-organik .tf-btn.btn-fill,
.tema-organik .tf-btn.btn-dark,
.tema-organik .btn-dark,
.tema-organik button[type="submit"].tf-btn {
    background: var(--org-btn);
    border-color: var(--org-btn);
    color: #fff;
    border-radius: 0 !important;
    letter-spacing: .16em;
    text-transform: uppercase;
    font-size: 12px;
    font-weight: 500;
    font-family: 'Inter', 'Albert Sans', sans-serif;
    transition: background .25s ease, color .25s ease, border-color .25s ease;
}
.tema-organik .tf-btn.btn-fill:hover,
.tema-organik .tf-btn.btn-dark:hover {
    background: var(--org-btn-hover);
    border-color: var(--org-btn-hover);
    color: #fff;
}
.tema-organik .tf-btn.btn-line {
    border-radius: 0 !important;
    letter-spacing: .14em;
    text-transform: uppercase;
    font-size: 12px;
    border-color: var(--org-espresso);
    color: var(--org-espresso);
}
.tema-organik .tf-btn.btn-line:hover { color: #3e2c20; border-color: #3e2c20; }

/* Kartlar — keskin köşe, gölgesiz, şeffaf zemin */
.tema-organik .card-product,
.tema-organik .card-product .card-product-wrapper,
.tema-organik .card-product img,
.tema-organik .wishlist-card,
.tema-organik .collection-item,
.tema-organik .img-box,
.tema-organik .offcanvas,
.tema-organik .modal-content {
    border-radius: 0 !important;
}
.tema-organik .card-product .card-product-wrapper {
    background: transparent;
    box-shadow: none;
}
.tema-organik .card-product .card-product-wrapper img { transition: opacity .5s ease; }
.tema-organik .card-product:hover .card-product-wrapper img { opacity: .9; }
.tema-organik .card-product .card-product-info { padding-top: 14px; padding-bottom: 4px; }

/* Grid — havadar */
.tema-organik .grid-layout,
.tema-organik .tf-grid-layout { gap: 40px 24px !important; }

/* Fiyat — sade sans, mürekkep */
.tema-organik .price,
.tema-organik .price-now,
.tema-organik .current-price {
    color: #121212;
    font-weight: 400;
    font-family: 'Inter', 'Albert Sans', sans-serif;
    letter-spacing: .02em;
    font-size: .92rem;
}

/* Header — beyaz, ince alt çizgi */
.tema-organik #header,
.tema-organik header.header-default,
.tema-organik .header-minimal,
.tema-organik .header-style-2,
.tema-organik .header-style-3 {
    /* Beyaz — kum top bar'ın altında nefes alan bir şerit. Header da kum olunca
       üst blok tek parça ve ağır görünüyordu. */
    background: #fff;
    /* base tema header sınırı !important ile geliyor — ezmek için gerekli */
    border-bottom: 1px solid var(--org-line) !important;
    padding-top: 6px;
    padding-bottom: 6px;
}
.tema-organik .logo-header img,
.tema-organik .header-logo img { max-height: 46px; width: auto; }

/* Menü */
.tema-organik .box-nav-ul .menu-item > a,
.tema-organik nav .menu-item > a {
    letter-spacing: .14em;
    text-transform: uppercase;
    font-size: 11px;
    font-weight: 500;
    font-family: 'Inter', 'Albert Sans', sans-serif;
    color: #121212;
    padding-top: 8px;
    padding-bottom: 8px;
}
.tema-organik .box-nav-ul .menu-item > a:hover,
.tema-organik nav .menu-item > a:hover { color: #3e2c20; }
.tema-organik .nav-icon .icon,
.tema-organik .header-action .action-icon { color: #121212; }
.tema-organik .nav-icon .icon:hover,
.tema-organik .header-action .action-icon:hover { color: #3e2c20; }

/* Top bar — kum bant, espresso metin (siyah bant markanın havasını bozuyordu) */
.tema-organik .tf-top-bar {
    background: var(--org-sand) !important;
    color: var(--org-espresso);
    border-bottom: 1px solid var(--org-line);
}
/* .text_white gibi utility'ler kum bantta okunmaz hale getiriyor — ezilmesi gerek */
.tema-organik .tf-top-bar .top-bar-text {
    color: var(--org-espresso) !important;
    letter-spacing: .18em;
    text-transform: uppercase;
    font-size: 10px;
    font-family: 'Inter', 'Albert Sans', sans-serif;
    font-weight: 500;
}
.tema-organik .tf-top-bar a,
.tema-organik .tf-top-bar .icon,
.tema-organik .tf-top-bar .tb-select { color: var(--org-espresso); }
/* Sosyal ikonlar — koyu bant için siyah daire geliyordu; kum bantta ince çerçeve */
.tema-organik .tf-top-bar .tf-social-icon .box-icon {
    background: transparent !important;
    border: 1px solid var(--org-line);
    color: var(--org-espresso) !important;
}
.tema-organik .tf-top-bar .tf-social-icon .box-icon:hover {
    background: var(--org-espresso) !important;
    border-color: var(--org-espresso);
    color: #fff !important;
}

/* Footer — kum zemin, espresso metin (doğal his; koyu footer yok) */
.tema-organik footer,
.tema-organik .footer {
    background: var(--org-sand);
    color: rgba(62,44,32,.78);
    border-top: 1px solid var(--org-line);
}
.tema-organik footer a, .tema-organik .footer a { color: rgba(62,44,32,.78); }
.tema-organik footer a:hover, .tema-organik .footer a:hover { color: #121212; }
.tema-organik footer h5, .tema-organik footer h6,
.tema-organik .footer h5, .tema-organik .footer h6 {
    color: #3e2c20;
    letter-spacing: .16em;
    text-transform: uppercase;
    font-size: 11px;
    font-family: 'Inter', 'Albert Sans', sans-serif;
    font-weight: 600;
}
.tema-organik .footer-bottom { border-top: 1px solid var(--org-line); }

/* Form alanları — keskin köşe, kum çizgi */
.tema-organik input.tf-field,
.tema-organik .form-control,
.tema-organik .form-select,
.tema-organik .form-checkout input,
.tema-organik .form-checkout select,
.tema-organik .form-checkout textarea {
    border-radius: 0 !important;
    border-color: #ddd2c2 !important;
    background: #fff;
}
.tema-organik input:focus, .tema-organik select:focus, .tema-organik textarea:focus {
    border-color: #3e2c20 !important;
    box-shadow: none !important;
}

/* Rozetler — espresso çerçeve, keskin */
.tema-organik .on-sale-item,
.tema-organik .badge-yeni,
.tema-organik .card-product .on-sale-wrap .on-sale-item {
    background: transparent;
    border: 1px solid #3e2c20;
    color: #3e2c20;
    border-radius: 0;
    letter-spacing: .14em;
    font-size: 9px;
    text-transform: uppercase;
    font-family: 'Inter', 'Albert Sans', sans-serif;
    font-weight: 500;
    padding: 2px 7px;
}

/* Slider metni panelden seçilen renge uymalı (Slider → Metin Rengi).
   Skin'in koyu başlık rengi, koyu görsellerdeki beyaz metni eziyordu. */
.tema-organik .tf-slideshow .box-content .text-white,
.tema-organik .tf-slideshow .box-content .heading.text-white { color: #fff !important; }
.tema-organik .tf-slideshow .box-content .text-dark,
.tema-organik .tf-slideshow .box-content .heading.text-dark { color: #1c140e !important; }

/* Slider metni — büyük editorial serif */
.tema-organik .banner-gr-title,
.tema-organik .slider-title,
.tema-organik .box-title-slider h1,
.tema-organik .box-title-slider h2 {
    font-family: 'DM Serif Display', 'Gloock', Georgia, serif;
    font-weight: 400;
    letter-spacing: .01em;
    line-height: 1.12;
}

/* Marquee */
.tema-organik .tf-marquee .marquee-item {
    font-family: 'Inter', 'Albert Sans', sans-serif;
    letter-spacing: .18em;
    font-size: 11px;
    font-weight: 500;
}

/* Newsletter — kum bant */
.tema-organik .flat-newsletter,
.tema-organik .newsletter-section {
    background: var(--org-sand);
    border-top: 1px solid var(--org-line);
    border-bottom: 1px solid var(--org-line);
}
.tema-organik .flat-newsletter input[type="email"],
.tema-organik .newsletter-section input[type="email"] {
    border-radius: 0 !important;
    border: 1px solid #ddd2c2;
    background: #fff;
    font-family: 'Inter', 'Albert Sans', sans-serif;
    font-size: 13px;
}

/* Yorum bölümü — kum bant (beyaz akışı böler) */
.tema-organik .flat-testimonial,
.tema-organik .tf-testimonial,
.tema-organik section.bg-surface { background: var(--org-sand); }

/* Breadcrumb */
.tema-organik .tf-breadcrumb .breadcrumb-item,
.tema-organik .breadcrumb li {
    font-family: 'Inter', 'Albert Sans', sans-serif;
    font-size: 11px;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--org-dim);
}
.tema-organik .tf-breadcrumb .breadcrumb-item.active { color: #121212; }

/* Bölüm başlıkları — ortalanmış, ince espresso ayraç */
.tema-organik .flat-title { padding-top: 24px; padding-bottom: 8px; }
.tema-organik .flat-title .title,
.tema-organik .heading-section { position: relative; padding-bottom: 18px; }
.tema-organik .flat-title .title::after,
.tema-organik .heading-section::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translateX(-50%);
    width: 36px;
    height: 1px;
    background: #3e2c20;
}
.tema-organik .flat-title .sub,
.tema-organik .heading-section .sub {
    font-family: 'Inter', 'Albert Sans', sans-serif;
    font-size: 11px;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: #3e2c20;
    font-weight: 500;
    display: block;
    margin-bottom: 10px;
}

/* Bölüm boşlukları — bol beyaz alan */
.tema-organik section,
.tema-organik .flat-spacing {
    padding-top: 80px !important;
    padding-bottom: 80px !important;
}

/* Sepet drawer / modal — beyaz kalsın, keskin köşe */
.tema-organik .offcanvas { background: #fff; }
.tema-organik .modal-content { background: #fff; }

/* Mobil uyum */
@media (max-width: 767px) {
    .tema-organik section,
    .tema-organik .flat-spacing { padding-top: 52px !important; padding-bottom: 52px !important; }
    .tema-organik .grid-layout,
    .tema-organik .tf-grid-layout { gap: 26px 14px !important; }
    .tema-organik h1 { font-size: 2.1rem; }
    .tema-organik h2 { font-size: 1.6rem; }
}

/* ============================================================
   ÜRÜN KARTI HİZA DÜZELTMELERİ (12 Ağu 2026)
   Müşteri bildirimi: kartların alt kenarları hizalanmıyor, mobilde
   swiper noktaları puan rozetinin üstüne biniyor.
   ============================================================ */

/* 1) Koyu temada bilgi paneli görünür bir kutu (#161616). Grid hücresi
      stretch olsa da panel içeriği kadar kaldığından kısa isimli kartın
      kutusu yukarıda bitiyordu. Kartı flex kolon yapıp paneli esnetiyoruz. */
.tema-elegante .card-product {
    display: flex;
    flex-direction: column;
    height: 100%;
}
.tema-elegante .card-product .card-product-info {
    flex: 1 1 auto;
}

/* 2) Base ecomus'ta .wrap-sw-over swiper'a margin-bottom:-40px veriyor;
      dots'un margin-top'u 32px → net -8px, noktalar kartın son 8px'ine biniyor.
      Kart altına sadakat puan rozeti eklenince o boşluk doldu ve çakışma görünür
      oldu. Noktalar zaten yalnız mobilde (d-md-none) çıkıyor. */
@media (max-width: 767.98px) {
    .swiper.wrap-sw-over { margin-bottom: 0 !important; }
}

/* ===================================================================
   SHOP THE LOOK — kaplama düzeltmeleri (12 Ağu 2026)
   Paketteki demo iki görseli yan yana gösterdiği için tam genişlik kullanıyor;
   tek görselde ekranı kaplayan devasa bir blok oluşuyordu. Noktalar da beyaz
   yuvarlaktı, açık zeminli görsellerde kaybolup "eksik" görünüyordu.
   =================================================================== */
.esc-lookbook-tuval { position: relative; }
.esc-lookbook-tuval .wrap-lookbook { position: relative; }

/* Başlıkla kareler arasında nefes payı.
   TUZAK: base'de .tf-sw-lookbook'a margin-top:-70px veriliyor (pakette başlığı
   görselin üstüne bindirmek için). Bizim düzende bu, kareleri alt başlığın
   üstüne çıkarıyordu. Sıfırlanmalı. */
.esc-lookbook .flat-title { margin-bottom: 28px; }
.esc-lookbook .tf-sw-lookbook { margin-top: 0 !important; }

/* TEK KARE: container içinde, kendi en-boy oranında. Kırpma yok. */
.esc-lb-tekli .wrap-lookbook .image img {
    width: 100%;
    height: auto;
    display: block;
}

/* ÇOKLU KARE: yan yana duracakları için EŞİT YÜKSEKLİK şart; biri kısa kalırsa
   bozuk görünüyor. Sabit en-boy oranı + cover ile hizalanırlar. Kullanıcı farklı
   oranlarda görsel yüklese de düzen bozulmaz. */
.esc-lb-coklu .wrap-lookbook .image img {
    width: 100%;
    aspect-ratio: 16 / 10;
    height: auto;
    object-fit: cover;
    display: block;
}
@media (max-width: 767.98px) {
    /* Mobilde tek tek kaydırıldığı için kırpmaya gerek yok */
    .esc-lb-coklu .wrap-lookbook .image img { aspect-ratio: 4 / 3; }
}

/* Nokta düğmesi — paketin yumuşak dairesi korunur (kare yapılınca bozuk görsel
   ikonu gibi duruyordu). Tek fark: açık zeminli fotoğraflarda kaybolmasın diye
   beyaz dolgu + ince halka + yumuşak gölge. */
.esc-lookbook-tuval .tf-pin-btn {
    width: 26px;
    height: 26px;
    background-color: #fff !important;
    border: 0 !important;
    box-shadow: 0 0 0 1px rgba(0,0,0,.12), 0 2px 8px rgba(0,0,0,.22);
    transition: transform .2s ease, box-shadow .2s ease;
}
.esc-lookbook-tuval .tf-pin-btn span {
    width: 8px;
    height: 8px;
    background-color: #111 !important;
}
.esc-lookbook-tuval .tf-pin-btn:hover {
    transform: scale(1.12);
    box-shadow: 0 0 0 1px rgba(0,0,0,.2), 0 4px 14px rgba(0,0,0,.3);
}

/* Masaüstünde noktanın üzerine gelince ürün kartı açılsın — tıklamayı beklemeden
   hangi ürün olduğu görünsün. Mobilde dokunmayla (bootstrap dropdown) açılır. */
@media (hover: hover) and (min-width: 768px) {
    .esc-lookbook-tuval .lookbook-item .btn-group:hover > .dropdown-menu {
        display: block;
        opacity: 1;
        visibility: visible;
    }
}

/* Mobil ürün şeridi — dar ekranda balon zor okunuyor; ürünler görselin altında
   ayrıca listelenir. Masaüstünde gizli. */
.esc-lookbook-mobil { display: none; }
@media (max-width: 767.98px) {
    .esc-lookbook-mobil { display: block; margin-top: 14px; }
    .esc-lookbook-urunler {
        display: flex;
        gap: 10px;
        overflow-x: auto;
        padding-bottom: 6px;
        -webkit-overflow-scrolling: touch;
    }
    .esc-lookbook-urun {
        flex: 0 0 128px;
        display: block;
        text-decoration: none;
        color: inherit;
        border: 1px solid var(--line);
        padding: 8px;
        background: var(--white);
    }
    .esc-lookbook-urun img {
        width: 100%;
        aspect-ratio: 1/1;
        object-fit: cover;
        display: block;
        margin-bottom: 6px;
    }
    .esc-lookbook-urun .ad {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        font-size: .78rem;
        line-height: 1.35;
        min-height: 2.1em;
    }
    .esc-lookbook-urun .fiyat { display: block; font-weight: 600; font-size: .82rem; margin-top: 3px; }
}

/* Açılır ürün kartı — köşeli */
.esc-lookbook-tuval .dropdown-menu,
.esc-lookbook-tuval .lookbook-product,
.esc-lookbook-tuval .lookbook-product img { border-radius: 0 !important; }
.esc-lookbook-tuval .lookbook-product {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 10px;
    min-width: 240px;
    background: var(--white);
    border: 1px solid var(--line);
}
.esc-lookbook-tuval .lookbook-product img { width: 60px; height: 60px; object-fit: cover; }
.esc-lookbook-tuval .lookbook-product .product-title a { font-size: .9rem; line-height: 1.35; }
.esc-lookbook-tuval .lookbook-product .price { font-weight: 600; margin-top: 3px; }

/* ===================================================================
   TEMA: VİTRİN — Canlı Perakende  (12 Ağu 2026)
   Antrasit yapı + turuncu aksiyon. Turuncu YALNIZ aksiyonda kullanılır
   (sepete ekle, indirim rozeti, aktif durum); zemin ve tipografi nötr
   kalır ki ürün fotoğrafı önde dursun. Geniş katalog / pazaryeri tonu.
   Font: Oswald (kondens başlık) + Inter (gövde) — ikisi de zaten yüklü.
   =================================================================== */
.tema-vitrin {
    --main: #232323;              /* saf siyah değil; antrasit, logoyla aynı aile */
    --white: #ffffff;
    --primary: #ff7a00;
    --red_1: #ff7a00;
    --yellow: #ff7a00;
    --text: #4a4a4a;
    --text-2: #7d7d7d;
    --text-3: #7d7d7d;
    --line: #e6e6e6;
    --line-2: #ededed;
    --bg-1: #fafafa; --bg-2: #f5f5f5;
    --bg-7: #f7f7f7; --bg-8: #f7f7f7; --bg-9: #f7f7f7;
    --bg-10: #fafafa;
    --bg-11: #f2f2f2;
    --main-rgba-1: rgba(35,35,35,.14);
    --main-rgba-2: rgba(35,35,35,.12);
    font-family: 'Inter', sans-serif;
    color: #4a4a4a;
}

/* Başlıklar — logodaki ağır kondens grotesk dili */
.tema-vitrin h1, .tema-vitrin h2, .tema-vitrin h3,
.tema-vitrin h4, .tema-vitrin h5, .tema-vitrin h6,
.tema-vitrin .flat-title .title,
.tema-vitrin .heading {
    font-family: 'Oswald', 'Inter', sans-serif;
    font-weight: 600;
    letter-spacing: .02em;
    text-transform: uppercase;
    color: #232323;
}

/* Aksiyon butonları — turuncu dolgu, köşeli */
.tema-vitrin .tf-btn.btn-fill,
.tema-vitrin .btn-quick-add,
.tema-vitrin .btn-main-product {
    background-color: #ff7a00 !important;
    border: 1px solid #ff7a00 !important;
    color: #ffffff !important;
    border-radius: 0 !important;
    font-family: 'Oswald', sans-serif;
    font-weight: 500;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.tema-vitrin .tf-btn.btn-fill:hover,
.tema-vitrin .btn-quick-add:hover,
.tema-vitrin .btn-main-product:hover {
    background-color: #232323 !important;
    border-color: #232323 !important;
}
/* İkincil buton — antrasit çerçeve, dolgusuz */
.tema-vitrin .tf-btn.btn-outline {
    background: transparent !important;
    border: 1px solid #232323 !important;
    color: #232323 !important;
    border-radius: 0 !important;
}

/* İndirim rozeti — turuncunun asıl yeri */
.tema-vitrin .on-sale-item,
.tema-vitrin .product-sale {
    background-color: #ff7a00 !important;
    color: #fff !important;
    border-radius: 0 !important;
}

/* Ürün kartı — hairline çerçeve, köşesiz, fiyat antrasit */
.tema-vitrin .card-product { display: flex; flex-direction: column; height: 100%; }
.tema-vitrin .card-product .card-product-wrapper { border: 1px solid var(--line); }
.tema-vitrin .card-product .card-product-info { flex: 1 1 auto; padding-top: 14px; text-align: left; }
.tema-vitrin .card-product .title,
.tema-vitrin .card-product .title a {
    font-family: 'Inter', sans-serif;
    font-weight: 500;
    font-size: .9rem;
    line-height: 1.4;
    color: #232323;
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 2.8em;
    margin-bottom: 8px;
}
.tema-vitrin .card-product .price { font-family: 'Oswald', sans-serif; font-size: 1rem; color: #232323; }
.tema-vitrin .card-product .old-price { color: #9a9a9a; font-weight: 400; }

/* Yuvarlak kategori madalyonları — hover'da turuncu halka */
.tema-vitrin .collection-circle .img-style,
.tema-vitrin .collection-circle img { border: 2px solid transparent; transition: border-color .25s ease; }
.tema-vitrin .collection-circle:hover .img-style,
.tema-vitrin .collection-circle:hover img { border-color: #ff7a00; }

/* Turuncu topbar şeridi — marka enerjisi ince bir bantla sınırlı */
.tema-vitrin .tf-topbar.topbar-colored,
.tema-vitrin .topbar-colored { background-color: #ff7a00 !important; color: #fff !important; }
.tema-vitrin .topbar-colored a,
.tema-vitrin .topbar-colored span { color: #fff !important; }

/* Köşeli duruş — [[feedback_kod_stili]] */
.tema-vitrin .form-control,
.tema-vitrin .form-select,
.tema-vitrin .card,
.tema-vitrin .modal-content { border-radius: 0 !important; }
.tema-vitrin .form-control:focus,
.tema-vitrin .form-select:focus { border-color: #ff7a00 !important; box-shadow: none !important; }

/* Link ve aktif durumlar */
.tema-vitrin a:hover,
.tema-vitrin .menu-item.active > a { color: #ff7a00; }

/* LOGO — base'de .logo-header width:136px sabit. Yatay (geniş/alçak) logolarda
   yükseklik 12px'e düşüp okunmaz oluyor. Genişliği serbest bırakıp yükseklikten
   sınırlıyoruz; kolonda zaten ~300px yer var. */
.tema-vitrin .logo-header,
.tema-kuyum .logo-header { width: auto !important; max-width: 100%; }
.tema-vitrin .logo-header img,
.tema-kuyum .logo-header img {
    width: auto !important;
    height: auto !important;
    max-height: 40px;
    max-width: 100%;
    object-fit: contain;
}
@media (max-width: 767.98px) {
    .tema-vitrin .logo-header img,
    .tema-kuyum .logo-header img { max-height: 30px; }
}
/* Footer logosu base'de brightness(0) invert(1) ile komple beyaza çevriliyor;
   marka rengi yok oluyor. Açık temada gerek yok, koyuda da turuncuyu koruyalım. */
.tema-vitrin .footer img[src*="/uploads/"],
.tema-kuyum .footer img[src*="/uploads/"] { filter: none !important; }


/* ===================================================================
   TEMA: KUYUM — Siyah & Şampanya  (12 Ağu 2026)
   Sıcak koyu zemin (kahve-siyah, nötr siyah DEĞİL) + şampanya altını.
   tema-elegante'den kasıtlı ayrışır: orada Playfair/Cormorant serif ve
   nötr #0d0d0d var; burada geometrik Jost + geniş harf aralığı ve sıcak
   #100d0a zemin — çağdaş kuyumcu dili, klasik lüks değil.
   Koyu tema mimarisi 3 katman: token → köprü → bileşen.
   =================================================================== */
/* ---- 1) TOKEN KATMANI — base'in var(--..) kullandığı her yer otomatik döner ---- */
.tema-kuyum {
    --main: #f0e9dd;              /* base'de "koyu metin" rolü — koyuda açık olmalı */
    --white: #17130f;             /* panel/kart yüzeyi */
    --primary: #d9c08c;           /* şampanya altını */
    --red_1: #d9c08c;
    --yellow: #d9c08c;
    --text: #cfc6b6;
    --text-2: #9d9484;
    --text-3: #9d9484;
    --text-secondary: #9d9484;
    --line: #2c2419;
    --line-2: #2c2419;
    --bg-1: #100d0a; --bg-2: #17130f;
    --bg-7: #17130f; --bg-8: #17130f; --bg-9: #17130f;
    --bg-10: #100d0a;
    --bg-11: #17130f;             /* KRİTİK: adet kutusu, sort dropdown, hesap menüsü */
    --bg-load: #1d1811;
    --bg-scrollbar-track: #100d0a;
    --bg-scrollbar-thumb: #33291c;
    --main-rgba-1: rgba(255,255,255,.10);
    --main-rgba-2: rgba(255,255,255,.08);
    --backdrop: rgba(0,0,0,.7);
    --ky-ink: #f0e9dd;
    --ky-ink-dim: #8d8474;
    --ky-gold: #d9c08c;
    background-color: #100d0a;
    font-family: 'Raleway', sans-serif;
    color: #cfc6b6;
}

/* ---- 2) KÖPRÜ KATMANI — token dinlemeyen utility ve hardcoded açık zeminler ---- */
.tema-kuyum .bg-white,
.tema-kuyum .bg-light,
.tema-kuyum .bg-surface,
.tema-kuyum [style*="background:#fff"],
.tema-kuyum [style*="background: #fff"],
.tema-kuyum [style*="background-color:#fff"],
.tema-kuyum [style*="background:#f"],
.tema-kuyum [style*="background-color:#f"] { background-color: var(--bg-1) !important; }

.tema-kuyum .text-dark,
.tema-kuyum .text-black { color: var(--ky-ink) !important; }
.tema-kuyum .text-white-50,
.tema-kuyum .text-body-secondary { color: var(--ky-ink-dim) !important; }
.tema-kuyum .text-muted { color: var(--text-2) !important; }
/* Koyu topbar/footer'daki açık metinler — --white koyulaştığı için ezilmeli */
.tema-kuyum .text_white,
.tema-kuyum .text-white { color: var(--ky-ink) !important; }

.tema-kuyum .card,
.tema-kuyum .modal-content,
.tema-kuyum .dropdown-menu,
.tema-kuyum .list-group-item,
.tema-kuyum .accordion-item,
.tema-kuyum .accordion-button {
    background-color: var(--bg-7) !important;
    color: var(--text) !important;
    border-color: var(--line) !important;
    border-radius: 0 !important;
}
.tema-kuyum .table { color: var(--text) !important; border-color: var(--line) !important; }

.tema-kuyum .form-control,
.tema-kuyum .form-select,
.tema-kuyum .input-group-text {
    background-color: var(--white) !important;
    color: var(--ky-ink) !important;
    border-color: var(--line) !important;
    border-radius: 0 !important;
}
.tema-kuyum .form-control::placeholder { color: var(--text-2) !important; opacity: 1; }
.tema-kuyum .form-control:focus,
.tema-kuyum .form-select:focus { border-color: var(--ky-gold) !important; box-shadow: none !important; }

.tema-kuyum .border,
.tema-kuyum .border-top,
.tema-kuyum .border-bottom,
.tema-kuyum .border-start,
.tema-kuyum .border-end { border-color: var(--line) !important; }

.tema-kuyum .main-content,
.tema-kuyum #wrapper,
.tema-kuyum section,
.tema-kuyum .flat-spacing,
.tema-kuyum .flat-spacing-1,
.tema-kuyum .flat-spacing-2 { background-color: #100d0a; }

/* "Görsel Yok" placeholder — kartta inline açık gri geliyor */
.tema-kuyum .card-product-wrapper .product-img > div[style*="background"] { background: #17130f !important; }

/* TUZAK: base'de .bg_dark / .background-black zemini var(--main)'den alıyor.
   Koyu temada --main açık krem olduğu için topbar ve footer KREM çıkıyordu.
   Aynı sebeple header'ın bg_light-* varyantları da açık kalıyor. */
.tema-kuyum .tf-top-bar.bg_dark,
.tema-kuyum .bg_dark,
.tema-kuyum .footer.background-black,
.tema-kuyum .background-black { background-color: #0b0908 !important; }
.tema-kuyum .header-default,
.tema-kuyum .header-white,
.tema-kuyum [class*="bg_light"] { background-color: #100d0a !important; }

/* Kayan paneller (sepet, mobil menü, filtre) — base'de sabit beyaz */
.tema-kuyum .offcanvas,
.tema-kuyum .offcanvas-menu,
.tema-kuyum .offcanvas .offcanvas-body {
    background-color: #100d0a !important;
    color: var(--text) !important;
}
.tema-kuyum .offcanvas .btn-close { filter: invert(1) grayscale(1); opacity: .7; }

/* #f2f2f2'yi token'dan DEĞİL sabit yazan bileşenler (adet kutusu, mobil
   kabuk ikonu) — --bg-11'i çevirmek bunları yakalamıyor. */
.tema-kuyum .wg-quantity,
.tema-kuyum .site-nav-icon,
.tema-kuyum [style*="#f2f2f2"] { background-color: #17130f !important; }
.tema-kuyum .wg-quantity .btn-quantity,
.tema-kuyum .wg-quantity input { background: transparent !important; color: var(--ky-ink) !important; }

/* Breadcrumb linkleri — koyu zeminde koyu metin kalıyordu */
.tema-kuyum .tf-breadcrumb-list .item-link,
.tema-kuyum .item-link { color: var(--text-2) !important; }
.tema-kuyum .tf-breadcrumb-list .item-link:hover { color: var(--ky-gold) !important; }

/* Sayfa içi <style> bloğu olan görünümler — class tabanlı sabit renkler,
   köprünün [style*=] yakalayıcısı bunlara ulaşmıyor. Yeni sayfa eklenince
   kendi <style>'ına bakıp buraya bir satır eklemek gerekir. */
.tema-kuyum .contact-form-box,
.tema-kuyum .contact-info-card,
.tema-kuyum .cart-summary-box,
.tema-kuyum .kupon-box { background: #17130f !important; border-color: var(--line) !important; }
.tema-kuyum .working-hours-badge {
    background: rgba(217,192,140,.10) !important;
    color: var(--ky-gold) !important;
    border-color: #3a2f1a !important;
}
.tema-kuyum label,
.tema-kuyum .form-label { color: var(--text) !important; }
.tema-kuyum a:not(.tf-btn):not(.btn-quick-add) { color: inherit; }

/* Açılır menüler — mega menü dahil */
.tema-kuyum .sub-menu,
.tema-kuyum .sub-menu.mega-menu,
.tema-kuyum .mega-menu,
.tema-kuyum .nav-sub-menu {
    background-color: #17130f !important;
    border: 1px solid var(--line) !important;
}
.tema-kuyum .sub-menu a,
.tema-kuyum .mega-menu a,
.tema-kuyum .nav-sub-menu a { color: var(--text) !important; }
.tema-kuyum .sub-menu a:hover,
.tema-kuyum .mega-menu a:hover { color: var(--ky-gold) !important; }

/* ---- 3) BİLEŞEN KATMANI — temanın kendi karakteri ---- */
/* Başlıklar — geniş aralıklı geometrik sans; elegante'nin serifinden net ayrım */
.tema-kuyum h1, .tema-kuyum h2, .tema-kuyum h3,
.tema-kuyum h4, .tema-kuyum h5, .tema-kuyum h6,
.tema-kuyum .flat-title .title,
.tema-kuyum .heading {
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    letter-spacing: .16em;
    text-transform: uppercase;
    color: var(--ky-ink);
}
.tema-kuyum p, .tema-kuyum span, .tema-kuyum li,
.tema-kuyum .description { color: #bdb4a4; }

/* Altın butonlar — dolgu değil ince çerçeve; kuyumda daha pahalı durur */
.tema-kuyum .tf-btn.btn-fill,
.tema-kuyum .btn-quick-add,
.tema-kuyum .btn-main-product {
    background: transparent !important;
    border: 1px solid var(--ky-gold) !important;
    color: var(--ky-gold) !important;
    border-radius: 0 !important;
    font-family: 'Jost', sans-serif;
    font-weight: 400;
    letter-spacing: .12em;
    text-transform: uppercase;
}
.tema-kuyum .tf-btn.btn-fill:hover,
.tema-kuyum .btn-quick-add:hover,
.tema-kuyum .btn-main-product:hover {
    background: var(--ky-gold) !important;
    color: #100d0a !important;
}

/* Ürün kartı — sakin, çerçevesiz, fotoğraf öne çıksın */
.tema-kuyum .card-product { display: flex; flex-direction: column; height: 100%; }
.tema-kuyum .card-product .card-product-info {
    flex: 1 1 auto;
    background: transparent !important;
    padding: 14px 4px 0;
    text-align: center;
}
.tema-kuyum .card-product .title,
.tema-kuyum .card-product .title a {
    font-family: 'Jost', sans-serif;
    font-weight: 400;
    font-size: .86rem;
    letter-spacing: .06em;
    line-height: 1.45;
    color: var(--ky-ink);
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 2.9em;
    margin-bottom: 7px;
}
.tema-kuyum .card-product .title a:hover { color: var(--ky-gold); }
.tema-kuyum .card-product .price { font-family: 'Jost', sans-serif; letter-spacing: .05em; color: var(--ky-gold); }
.tema-kuyum .card-product .old-price { color: #7d7466; }
.tema-kuyum .card-product:hover .card-product-wrapper img { opacity: .88; transform: none !important; }

/* İndirim rozeti — altın çerçeve, dolgusuz */
.tema-kuyum .on-sale-item,
.tema-kuyum .product-sale {
    background: rgba(16,13,10,.72) !important;
    border: 1px solid var(--ky-gold) !important;
    color: var(--ky-gold) !important;
    border-radius: 0 !important;
}

/* Yuvarlak kategori madalyonları — altın hairline */
.tema-kuyum .collection-circle .img-style,
.tema-kuyum .collection-circle img { border: 1px solid var(--line); transition: border-color .25s ease; }
.tema-kuyum .collection-circle:hover .img-style,
.tema-kuyum .collection-circle:hover img { border-color: var(--ky-gold); }

/* Sadakat puan rozeti — inline açık zemin ezilir */
.tema-kuyum .puan-rozet {
    background: #17130f !important;
    color: var(--ky-gold) !important;
    border-color: #3a2f1a !important;
}

/* Grid nefes payı */
.tema-kuyum .grid-layout,
.tema-kuyum .tf-grid-layout { gap: 34px 22px !important; }

@media (max-width: 767.98px) {
    .tema-kuyum .grid-layout,
    .tema-kuyum .tf-grid-layout { gap: 24px 12px !important; }
    .tema-kuyum h1 { font-size: 1.9rem; }
    .tema-kuyum h2 { font-size: 1.5rem; }
    .tema-vitrin h1 { font-size: 2rem; }
    .tema-vitrin h2 { font-size: 1.55rem; }
}


/* ===================================================================
   TEMA: YAŞAR — Kırmızı & Yeşil  (15 Ağu 2026)
   yasarcorap.com için. Logo siyah kutu üzerinde kırmızı-yeşil YC
   monogramı; skin o üçlüyü net bir hiyerarşiyle kurar:
     • YEŞİL  = marka zemini — topbar, kategori şeridi, footer bandı.
                Sayfada UZUN yatay yüzeyleri kaplar, marka rengi olduğu
                ilk bakışta anlaşılsın diye. (Referans: market/bakkal
                düzeni — müşterinin istediği "sade olmasın" bu şerittir.)
     • KIRMIZI = aksiyon — sepete ekle, kategori açılır butonu, indirim
                rozeti, fiyat vurgusu, aktif link.
     • SİYAH  = tipografi ve çerçeve.
   İki marka rengi aynı bileşende yarışmaz: yeşil ZEMİN olur, kırmızı
   o zeminin ÜSTÜNDEKİ tıklanacak parçadır. Ürün alanı beyaz kalır ki
   çorap fotoğrafı (çoğu düz renk, yakın çekim) önde dursun.
   Header: tema.header_stili = style-4 (açık arama + kategori açılırı).
   Font: Jost (başlık) + Inter (gövde) — ikisi de zaten yüklü.
   =================================================================== */
.tema-yasar {
    --main: #141414;              /* logo kutusuyla aynı aile; saf siyah değil */
    --white: #ffffff;
    --primary: #d62027;           /* marka kırmızısı */
    --red_1: #d62027;
    --yellow: #d62027;
    --text: #4a4a4a;
    --text-2: #7c7c7c;
    --text-3: #7c7c7c;
    --line: #e7e7e7;
    --line-2: #efefef;
    --bg-1: #fafafa; --bg-2: #f6f6f6;
    --bg-7: #f7f7f7; --bg-8: #f7f7f7; --bg-9: #f7f7f7;
    --bg-10: #fafafa;
    --bg-11: #f2f2f2;
    --main-rgba-1: rgba(20,20,20,.14);
    --main-rgba-2: rgba(20,20,20,.12);
    --ys-kirmizi: #d62027;
    --ys-kirmizi-koyu: #b0161c;
    --ys-yesil: #009f4d;
    --ys-yesil-koyu: #00803e;
    --ys-siyah: #141414;
    font-family: 'Inter', sans-serif;
    color: #4a4a4a;
}

/* Başlıklar — logodaki geniş aralıklı, dik duruş */
.tema-yasar h1, .tema-yasar h2, .tema-yasar h3,
.tema-yasar h4, .tema-yasar h5, .tema-yasar h6,
.tema-yasar .flat-title .title,
.tema-yasar .heading {
    font-family: 'Jost', 'Inter', sans-serif;
    font-weight: 600;
    letter-spacing: .02em;
    color: var(--ys-siyah);
}

/* ---- AKSİYON = KIRMIZI ---------------------------------------------- */
.tema-yasar .tf-btn.btn-fill,
.tema-yasar .btn-quick-add,
.tema-yasar .btn-main-product,
.tema-yasar .btn-primary {
    background-color: var(--ys-kirmizi) !important;
    border: 1px solid var(--ys-kirmizi) !important;
    color: #ffffff !important;
    border-radius: 0 !important;
    font-family: 'Jost', sans-serif;
    font-weight: 500;
    letter-spacing: .04em;
    text-transform: uppercase;
}
.tema-yasar .tf-btn.btn-fill:hover,
.tema-yasar .btn-quick-add:hover,
.tema-yasar .btn-main-product:hover,
.tema-yasar .btn-primary:hover {
    background-color: var(--ys-kirmizi-koyu) !important;
    border-color: var(--ys-kirmizi-koyu) !important;
}
/* İkincil buton — siyah çerçeve, dolgusuz; hover'da kırmızıya döner */
.tema-yasar .tf-btn.btn-outline {
    background: transparent !important;
    border: 1px solid var(--ys-siyah) !important;
    color: var(--ys-siyah) !important;
    border-radius: 0 !important;
}
.tema-yasar .tf-btn.btn-outline:hover {
    border-color: var(--ys-kirmizi) !important;
    color: var(--ys-kirmizi) !important;
}
/* İndirim rozeti — kırmızının asıl yeri */
.tema-yasar .on-sale-item,
.tema-yasar .product-sale {
    background-color: var(--ys-kirmizi) !important;
    color: #fff !important;
    border-radius: 0 !important;
}
.tema-yasar a:hover,
.tema-yasar .menu-item.active > a { color: var(--ys-kirmizi); }

/* ---- MARKA ZEMİNİ = YEŞİL ------------------------------------------- */
/* 1) Topbar şeridi.
   DİKKAT: _TopBar.cshtml "colored" stilinde zemini INLINE style ile basıyor
   (topbar.renk ayarından) — sınıf yok. Burada sadece içindeki metinleri
   beyaza çekiyoruz, zemin ayardan gelir (topbar.renk = #009f4d). */
.tema-yasar .tf-top-bar[style*="background"] a,
.tema-yasar .tf-top-bar[style*="background"] p,
.tema-yasar .tf-top-bar[style*="background"] span,
.tema-yasar .tf-top-bar[style*="background"] i,
.tema-yasar .tf-top-bar[style*="background"] .text-muted { color: #ffffff !important; }
.tema-yasar .tf-top-bar[style*="background"] .box-icon { border-color: rgba(255,255,255,.45) !important; }

/* 2) KATEGORİ ŞERİDİ — style-4 header'ın alt barı komple yeşil.
   Sayfanın en geniş renk yüzeyi burası; marka rengini "net" yapan şey bu. */
.tema-yasar .header-style-4 .header-bottom,
.tema-yasar .header-style-2 .header-bottom,
.tema-yasar .header-default .header-bottom {
    background-color: var(--ys-yesil) !important;
    border: 0 !important;
}
.tema-yasar .header-bottom .box-nav-ul > li > a,
.tema-yasar .header-bottom .item-link,
.tema-yasar .header-bottom .box-right,
.tema-yasar .header-bottom .box-right a,
.tema-yasar .header-bottom .box-right span,
.tema-yasar .header-bottom .menu-item > a {
    color: #ffffff !important;
    font-family: 'Jost', sans-serif;
    font-weight: 500;
    letter-spacing: .02em;
}
.tema-yasar .header-bottom .box-nav-ul > li > a:hover,
.tema-yasar .header-bottom .menu-item.active > a { color: #ffe08a !important; }

/* Şeridi tek satırda tut. Ölçüm (1920px, kap 1440px): kategori butonu 267 +
   menü 876 + destek telefonu 290 = 1433px — sığmıyor sayılır, base 16px punto
   ve 30px aralıkla "Ana Sayfa" / "İç Giyim" gibi öğeler iki satıra kırılıyordu.
   Kelime kırmayı kapatıp aralığı ve puntoyu daraltınca menü 780px'e iniyor.
   (Telefon bloğu ayrıca tema.header_telefon=false ile kapatıldı.) */
/* Menü kategori butonunun hemen sağından başlasın, sağa savrulmasın.
   _HeaderStyle4'te .wrapper-header justify-content:between — üç çocuk
   varken (buton | menü | telefon) doğru çalışıyor ama telefon bloğu
   kapatılınca iki çocuk kalıyor ve menü sağ kenara yapışıyordu
   (buton ile menü arası 393px boşluk). Sola hizala. */
.tema-yasar .header-bottom .wrapper-header { justify-content: flex-start !important; }
.tema-yasar .header-bottom .box-navigation { margin-left: 28px; text-align: left !important; }
.tema-yasar .header-bottom .box-nav-ul { justify-content: flex-start !important; }

.tema-yasar .header-bottom .box-nav-ul { gap: 18px !important; flex-wrap: nowrap !important; }
.tema-yasar .header-bottom .box-nav-ul > li { padding: 18px 0 !important; }
.tema-yasar .header-bottom .box-nav-ul > li > a,
.tema-yasar .header-bottom .item-link { white-space: nowrap !important; font-size: 15px; }
.tema-yasar .tf-list-categories .categories-title { white-space: nowrap; }

/* Dar masaüstü / laptop — kap daralınca önce aralık, sonra punto kısılır */
@media (max-width: 1399.98px) {
    .tema-yasar .header-bottom .box-nav-ul { gap: 13px !important; }
    .tema-yasar .header-bottom .box-nav-ul > li > a,
    .tema-yasar .header-bottom .item-link { font-size: 14px; }
    .tema-yasar .tf-list-categories .categories-title { padding: 12px 14px !important; font-size: 12px; }
}
/* Açılır menüler yeşil şeridin üstüne binince beyaz zemine dönmeli */
.tema-yasar .header-bottom .sub-menu,
.tema-yasar .header-bottom .mega-menu {
    background-color: #ffffff !important;
    border-top: 3px solid var(--ys-kirmizi) !important;
}
.tema-yasar .header-bottom .sub-menu a,
.tema-yasar .header-bottom .mega-menu a { color: var(--ys-siyah) !important; }
.tema-yasar .header-bottom .sub-menu a:hover,
.tema-yasar .header-bottom .mega-menu a:hover { color: var(--ys-kirmizi) !important; }
.tema-yasar .mega-cat-title { color: var(--ys-siyah) !important; font-family: 'Jost', sans-serif; font-weight: 600; }

/* 3) "Tüm Kategoriler" açılırı — yeşil şeridin üstündeki KIRMIZI blok.
   Referanstaki sarı butonun karşılığı; marka çiftini tek bakışta kurar. */
.tema-yasar .tf-list-categories .categories-title {
    background-color: var(--ys-kirmizi) !important;
    color: #ffffff !important;
    border-radius: 0 !important;
    font-family: 'Jost', sans-serif;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    padding: 14px 22px !important;
}
.tema-yasar .tf-list-categories .categories-title:hover { background-color: var(--ys-kirmizi-koyu) !important; }
.tema-yasar .tf-list-categories .categories-title svg { color: #fff !important; }
.tema-yasar .list-categories-inner {
    border: 1px solid var(--line) !important;
    border-top: 3px solid var(--ys-kirmizi) !important;
    border-radius: 0 !important;
    background: #fff !important;
}
.tema-yasar .list-categories-inner .tf-category-link { color: var(--ys-siyah) !important; }
.tema-yasar .list-categories-inner .tf-category-link:hover { color: var(--ys-kirmizi) !important; }

/* 4) Arama kutusu — açık arama çubuğunun butonu yeşil */
.tema-yasar .tf-form-search .search-box { border: 2px solid var(--ys-yesil) !important; border-radius: 0 !important; }
.tema-yasar .tf-form-search input { border: 0 !important; border-radius: 0 !important; }
.tema-yasar .tf-form-search button,
.tema-yasar .tf-form-search .tf-btn {
    background-color: var(--ys-yesil) !important;
    border-color: var(--ys-yesil) !important;
    color: #fff !important;
    border-radius: 0 !important;
}
.tema-yasar .tf-form-search button:hover { background-color: var(--ys-yesil-koyu) !important; }

/* 5) Bölüm başlıkları — altında kısa yeşil vurgu çizgisi */
.tema-yasar .flat-title .title,
.tema-yasar .flat-title h2 { position: relative; padding-bottom: 12px; }
.tema-yasar .flat-title .title::after,
.tema-yasar .flat-title h2::after {
    content: "";
    position: absolute;
    left: 50%; bottom: 0; transform: translateX(-50%);
    width: 56px; height: 3px;
    background: var(--ys-yesil);
}

/* Stok / kargo / başarı bildirimleri */
.tema-yasar .badge-stok,
.tema-yasar .stok-var,
.tema-yasar .text-success,
.tema-yasar .kargo-ucretsiz { color: var(--ys-yesil) !important; }
.tema-yasar .badge.bg-success,
.tema-yasar .alert-success {
    background-color: var(--ys-yesil) !important;
    border-color: var(--ys-yesil) !important;
    color: #fff !important;
    border-radius: 0 !important;
}
/* "Yeni" rozeti — kırmızıyla karışmasın diye yeşil */
.tema-yasar .product-new,
.tema-yasar .on-new-item {
    background-color: var(--ys-yesil) !important;
    color: #fff !important;
    border-radius: 0 !important;
}

/* ---- ÜRÜN KARTI ------------------------------------------------------ */
.tema-yasar .card-product { display: flex; flex-direction: column; height: 100%; }
.tema-yasar .card-product .card-product-wrapper { border: 1px solid var(--line); }
.tema-yasar .card-product .card-product-info { flex: 1 1 auto; padding-top: 14px; text-align: left; }
.tema-yasar .card-product .title,
.tema-yasar .card-product .title a {
    font-family: 'Inter', sans-serif;
    font-weight: 500;
    font-size: .9rem;
    line-height: 1.4;
    color: var(--ys-siyah);
    display: -webkit-box !important;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    min-height: 2.8em;
    margin-bottom: 8px;
}
.tema-yasar .card-product .title a:hover { color: var(--ys-kirmizi); }
.tema-yasar .card-product .price { font-family: 'Jost', sans-serif; font-size: 1rem; font-weight: 600; color: var(--ys-siyah); }
.tema-yasar .card-product .old-price { color: #9a9a9a; font-weight: 400; }

/* Kategori madalyonları — hover'da kırmızı halka */
/* _KategoriYuvarlak.cshtml çemberi .yuvarlak-kat-link üzerinde INLINE
   border ile çiziyor (#f0f0f0) — ezmek için !important şart. */
.tema-yasar .yuvarlak-kat-link { border-color: var(--ys-yesil) !important; }
.tema-yasar .yuvarlak-kat-link:hover { border-color: var(--ys-kirmizi) !important; transform: translateY(-3px); }
.tema-yasar .collection-circle .img-style,
.tema-yasar .collection-circle img { border: 2px solid transparent; transition: border-color .25s ease; }
.tema-yasar .collection-circle:hover .img-style,
.tema-yasar .collection-circle:hover img { border-color: var(--ys-kirmizi); }

/* ---- KÖŞELİ DURUŞ — [[feedback_kod_stili]] --------------------------- */
.tema-yasar .form-control,
.tema-yasar .form-select,
.tema-yasar .card,
.tema-yasar .modal-content,
.tema-yasar .dropdown-menu { border-radius: 0 !important; }
.tema-yasar .form-control:focus,
.tema-yasar .form-select:focus { border-color: var(--ys-kirmizi) !important; box-shadow: none !important; }

/* ---- LOGO — yatay logo base'de 136px sabit genişlikte eziliyor -------- */
.tema-yasar .logo-header { width: auto !important; max-width: 100%; }
.tema-yasar .logo-header img {
    width: auto !important;
    height: auto !important;
    max-height: 44px;
    max-width: 100%;
    object-fit: contain;
}
/* Footer logosu base'de brightness(0) invert(1) ile beyaza çevriliyor;
   kırmızı-yeşil monogram yok oluyor — filtreyi kaldırıyoruz. */
.tema-yasar .footer img[src*="/uploads/"] { filter: none !important; }

@media (max-width: 767.98px) {
    .tema-yasar .logo-header img { max-height: 34px; }
    .tema-yasar h1 { font-size: 2rem; }
    .tema-yasar h2 { font-size: 1.55rem; }
}

/* =====================================================================
   ÜRÜN KARTI — UZUN İSİM TOLERANSI (tüm temalar için taban kural)
   =====================================================================
   Paket .card-product .title'ı 2 satıra clamp'liyor ama o iki satırın
   yerini REZERVE ETMİYOR. Tek satırlık isimle iki satırlık isim yan yana
   gelince fiyat ve "Sepete Ekle" satırları farklı hizada duruyor; ızgara
   kırık görünüyor. Uzun isimli katalogda bu her satırda tekrarlıyor.

   İki satırlık yeri her zaman ayırıyoruz: isim kısa olsa da fiyatlar aynı
   çizgide kalır. lh birimi tema font boyutu değişse de birebir 2 satır
   verir; desteklemeyen tarayıcı 2.4em fallback'ine düşer (line-height 1.2).

   Ayrıca taşan tek kelimelik uzun kodlar (ör. "KOLYE-ALTIN-18AYAR-45CM")
   kartı yatayda genişletip ızgarayı kaydırıyordu — satır sonunda kırılsın.
   ==================================================================== */
.card-product .card-product-info .title {
    min-height: 2.4em;
    min-height: 2lh;
    overflow-wrap: anywhere;
}