/* ============================================================
   STAR OYUNCAK DÜNYASI — Modern Oyuncak Mağazası Teması
   Bu dosya skin-demo-4.css ve demo-4.css SONRASINDA yüklenir;
   tüm görsel özelleştirme bu tek dosyadadır.
   Güncelleme yapınca temaheader.php'deki ?v= sürümünü artırın.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Baloo+2:wght@500;600;700;800&family=Nunito:ital,wght@0,400;0,600;0,700;0,800;1,400&display=swap&subset=latin-ext');

:root {
    --st-kirmizi:  #ff4d5a;
    --st-turuncu:  #ff8a00;
    --st-sari:     #ffc93c;
    --st-yesil:    #23b26d;
    --st-mavi:     #2196f3;
    --st-mor:      #7b4fd6;
    --st-pembe:    #ff5d9e;
    --st-lacivert: #2b2f4a;
    --st-lacivert-koyu: #23263c;
    --st-zemin:    #f7f8fc;
    --st-radius:   14px;
    --st-golge:    0 6px 24px rgba(43, 47, 74, .10);
    --st-golge-hover: 0 12px 32px rgba(43, 47, 74, .18);
}

/* ------------------------------------------------------------
   1. GENEL / TİPOGRAFİ
   ------------------------------------------------------------ */
body {
    font-family: 'Nunito', 'Poppins', sans-serif;
    color: #4a4e69;
    background-color: #fff;
}

h1, h2, h3, h4, h5, h6,
.product-title,
.heading .title,
.widget-title,
.icon-box-title,
.cta-title,
.btn,
.main-nav .menu > li > a,
.category-dropdown > .dropdown-toggle {
    font-family: 'Baloo 2', 'Nunito', sans-serif;
}

a {
    color: var(--st-mavi);
}
a:hover, a:focus {
    color: var(--st-kirmizi);
}

/* Seçim rengi */
::selection {
    background: var(--st-sari);
    color: var(--st-lacivert);
}

/* Geniş ekranlarda içerik alanını genişlet (ürün alanları dahil tüm sayfa) */
@media (min-width: 1200px) {
    .container {
        max-width: 1500px;
        width: 94%;
    }
}

/* Modern ince kaydırma çubuğu */
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #eef0f7; }
::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, var(--st-kirmizi), var(--st-mor));
    border-radius: 10px;
}

/* ------------------------------------------------------------
   2. HEADER — gökkuşağı şerit + lacivert üst bar
   ------------------------------------------------------------ */
.header::before {
    content: "";
    display: block;
    height: 5px;
    background: linear-gradient(90deg,
        var(--st-kirmizi) 0 16.6%,
        var(--st-turuncu) 16.6% 33.2%,
        var(--st-sari)    33.2% 49.8%,
        var(--st-yesil)   49.8% 66.4%,
        var(--st-mavi)    66.4% 83%,
        var(--st-mor)     83% 100%);
}

.header-top,
.header-4 .header-top,
.header-intro-clearance .header-top {
    background-color: var(--st-lacivert);
    color: #fff;
    font-size: 1.3rem;
    border-bottom: 0;
}
.header-top a,
.header-top .header-left,
.header-top .top-menu > li > a,
.header-top .top-menu ul a {
    color: #fff !important;
}
.header-top .top-menu ul a:hover,
.header-top a:hover {
    color: var(--st-sari) !important;
}
.header-top i {
    color: var(--st-sari);
}

.header-middle {
    background-color: #fff;
    border-bottom: 0;
}

/* Arama kutusu — hap biçimli, renkli çerçeve (büyüteç sade ikon, zeminsiz) */
.header-search-extended .header-search-wrapper {
    border: 2px solid var(--st-kirmizi);
    border-radius: 30px;
    overflow: hidden;
    background: #fff;
}
.header-search .form-control,
.header-search-extended .form-control {
    background: #fff;
    border: 0;
    border-radius: 0 30px 30px 0;
    font-family: 'Nunito', sans-serif;
}
.header-search-wrapper .btn,
.header-4 .header-search-extended .btn {
    background: transparent !important;
    border: 0 !important;
    color: var(--st-kirmizi) !important;
    box-shadow: none !important;
    border-radius: 0;
    min-width: auto;
}
.header-search-wrapper .btn:hover,
.header-4 .header-search-extended .btn:hover,
.header-4 .header-search-extended .btn:focus {
    background: transparent !important;
    color: var(--st-turuncu) !important;
}

/* Sepet / favori rozetleri */
.cart-count,
.wishlist-count.badge {
    background-color: var(--st-kirmizi) !important;
    color: #fff !important;
    font-weight: 700;
}
.header .compare-dropdown .icon i,
.header .wishlist .icon i,
.header .cart-dropdown .icon i {
    color: var(--st-lacivert);
}
.header .compare-dropdown:hover .icon i,
.header .wishlist:hover .icon i,
.header .cart-dropdown:hover .icon i {
    color: var(--st-kirmizi);
}
.header-right p {
    font-weight: 700;
    color: var(--st-lacivert);
}

/* ------------------------------------------------------------
   3. ANA MENÜ — renkli blok menü (star-navblocks)
   ------------------------------------------------------------ */
.header-bottom {
    background-color: #fff;
    border-top: 1px solid #eee;
    border-bottom: 3px solid var(--st-kirmizi);
    padding: 8px 0;
}
.header-bottom.sticky-header.fixed {
    background-color: #fff;
    box-shadow: 0 4px 14px rgba(43, 47, 74, .18);
}

/* Kategori düğmesi — düz renkli blok (Yurdakul tarzı) */
.category-dropdown .dropdown-toggle {
    background: var(--st-kirmizi) !important;
    color: #fff !important;
    border-radius: 8px;
    font-weight: 700;
    text-transform: none;
    border: 0;
    box-shadow: none;
}
/* style.css'teki ".header-4 ... :not(:hover):not(:focus){color:#333!important}" kuralını ezmek için */
.header-4 .dropdown.category-dropdown .dropdown-toggle,
.header-4 .dropdown.category-dropdown .dropdown-toggle:not(:hover):not(:focus),
.header-4 .dropdown.category-dropdown .dropdown-toggle i,
.header-4 .dropdown.category-dropdown .dropdown-toggle:not(:hover):not(:focus) i {
    color: #fff !important;
}
.category-dropdown .dropdown-toggle:hover,
.category-dropdown.show .dropdown-toggle {
    background: var(--st-turuncu) !important;
}
.category-dropdown .dropdown-menu {
    border: 0;
    border-radius: 12px;
    box-shadow: var(--st-golge-hover);
    overflow: hidden;
}
.menu-vertical > li > a {
    font-weight: 600;
    color: var(--st-lacivert);
}
.menu-vertical > li > a:hover,
.menu-vertical > li:hover > a {
    color: var(--st-kirmizi);
    background-color: #fff4f5;
}

/* Kategori menüsü — Yurdakul tarzı: uzun listeyi çok sütuna böl (her sütun ~200px) */
.category-dropdown .dropdown-menu {
    width: auto !important;
    min-width: 860px !important;
    max-width: 94vw !important;
}
.category-dropdown .side-nav { width: auto !important; }
.category-dropdown .menu-vertical {
    display: block !important;
    column-width: 200px;
    -webkit-column-width: 200px;
    column-gap: 8px;
}
.category-dropdown .menu-vertical > li {
    width: 100%;
    break-inside: avoid;
    -webkit-column-break-inside: avoid;
    page-break-inside: avoid;
}
/* Alt kategoriler: fly-out (açılır) yerine ana kategorinin altında girintili göster */
.category-dropdown .menu-vertical ul {
    display: block !important;
    position: static !important;
    float: none !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    box-shadow: none !important;
    border: none !important;
    background: transparent !important;
    margin: 0 !important;
    padding: 2px 0 8px 14px !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    left: auto !important; top: auto !important; right: auto !important;
}
.category-dropdown .menu-vertical ul li a {
    font-size: 12px !important;
    color: #7a7a7a !important;
    padding: 2px 0 !important;
    line-height: 1.4 !important;
}
.category-dropdown .menu-vertical ul li a:hover {
    color: var(--st-kirmizi) !important;
    background: transparent !important;
}
/* fly-out ok işaretlerini gizle */
.category-dropdown .menu-vertical .sf-with-ul:after,
.category-dropdown .menu-vertical a.sf-with-ul:after,
.category-dropdown .menu-vertical .sf-arrows > li > .sf-with-ul:after {
    display: none !important;
    content: none !important;
}
@media (max-width: 767px) {
    .category-dropdown .dropdown-menu { min-width: 0 !important; }
    .category-dropdown .menu-vertical { column-width: auto; column-count: 1; }
}

/* Renkli blok menü — Yurdakul tarzı: satırı dolduran eşit bloklar,
   renkler nth-child ile döngüsel atanır */
.main-nav .menu.star-navblocks {
    display: flex;
    align-items: stretch;
    gap: 6px;
    width: 100%;
}
.main-nav .menu.star-navblocks > li {
    margin: 0;
    flex: 1 1 auto;
    display: flex;
}
.main-nav .menu.star-navblocks > li > a {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: 100%;
    padding: 12px 14px !important;
    color: #fff !important;
    font-weight: 700;
    font-size: 13px;
    line-height: 1.25;
    letter-spacing: .2px;
    border-radius: 8px;
    transition: filter .18s, transform .18s, box-shadow .18s;
    white-space: normal;
    text-transform: none;
}
.main-nav .menu.star-navblocks > li > a:hover {
    filter: brightness(1.12);
    transform: translateY(-2px);
    box-shadow: 0 6px 14px rgba(0, 0, 0, .22);
    color: #fff !important;
}
.main-nav .menu.star-navblocks > li:nth-child(6n+1) > a { background: var(--st-kirmizi); }
.main-nav .menu.star-navblocks > li:nth-child(6n+2) > a { background: var(--st-mavi); }
.main-nav .menu.star-navblocks > li:nth-child(6n+3) > a { background: var(--st-yesil); }
.main-nav .menu.star-navblocks > li:nth-child(6n+4) > a { background: var(--st-mor); }
.main-nav .menu.star-navblocks > li:nth-child(6n+5) > a { background: var(--st-turuncu); }
.main-nav .menu.star-navblocks > li:nth-child(6n+6) > a { background: var(--st-pembe); }

/* Renkli bloklarda aşağı ok işaretini kaldır (yazının üstüne biniyor; menü hover ile yine açılır) */
.main-nav .menu.star-navblocks > li > a.sf-with-ul:after,
.header-bottom .menu.sf-arrows.star-navblocks > li > .sf-with-ul::after,
.header-intro-clearance .header-bottom .menu.sf-arrows.star-navblocks > li > .sf-with-ul::after {
    content: none !important;
    display: none !important;
}

.main-nav .menu.star-navblocks li .megamenu,
.main-nav .menu.star-navblocks li ul {
    border: 0;
    border-top: 3px solid var(--st-kirmizi);
    border-radius: 0 0 10px 10px;
    box-shadow: var(--st-golge-hover);
    margin-top: 6px;
}
.megamenu .menu-title a {
    color: var(--st-kirmizi);
    font-weight: 700;
}

@media (max-width: 991px) {
    .main-nav .menu.star-navblocks { flex-wrap: wrap; }
    .main-nav .menu.star-navblocks > li { flex: 1 1 46%; }
}

/* ------------------------------------------------------------
   4. SLIDER + BANNERLAR
   ------------------------------------------------------------ */
.intro-slider-container {
    background: var(--st-zemin);
}
/* Slider görseli: şablondaki sağa yaslamayı (justify-content-end) iptal et,
   ortala ve konteyner genişliğine yay — geniş ekranda solda boşluk kalmasın */
.intro-slide .intro-content .row,
.intro-slide .intro-content .row.justify-content-end {
    justify-content: center !important;
    width: 100%;
    margin: 0;
}
.intro-slide .intro-content .row > a {
    display: block;
    width: 100%;
    padding: 0;
}
.intro-slide img {
    width: 100% !important;
    height: auto;
    border-radius: 0;
    display: block;
}
.banner {
    border-radius: var(--st-radius);
    overflow: hidden;
    box-shadow: var(--st-golge);
    transition: transform .25s ease, box-shadow .25s ease;
}
.banner:hover {
    transform: translateY(-4px);
    box-shadow: var(--st-golge-hover);
}
.cta img {
    border-radius: var(--st-radius);
}

/* ------------------------------------------------------------
   5. BÖLÜM BAŞLIKLARI
   ------------------------------------------------------------ */
.heading .title {
    color: var(--st-lacivert);
    font-weight: 700;
    font-size: 2.4rem;
    position: relative;
    padding-bottom: 12px;
}
.heading .title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 70px;
    height: 5px;
    border-radius: 5px;
    background: linear-gradient(90deg, var(--st-kirmizi), var(--st-sari), var(--st-mavi));
}

/* ------------------------------------------------------------
   6. ÜRÜN KARTLARI
   ------------------------------------------------------------ */
.product.product-2,
.product.product-7 {
    background: #fff;
    border: 1px solid #eef0f7;
    border-radius: var(--st-radius);
    overflow: hidden;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
    display: flex;
    flex-direction: column;
    height: 100%;
}
.product.product-2:hover,
.product.product-7:hover {
    transform: translateY(-6px);
    border-color: transparent;
    box-shadow: var(--st-golge-hover);
}

/* Görsel alanı SABİT yükseklikte: uzun/kısa tüm görseller aynı kutuya oranı bozulmadan sığar,
   böylece isim/fiyat/düğme her kartta aynı hizada başlar */
.product.product-2 .product-media,
.product.product-7 .product-media {
    background: #fff;
    height: 250px;
    flex: 0 0 auto;
    overflow: hidden;
}
.product.product-2 .product-media > a:first-of-type,
.product.product-7 .product-media > a:first-of-type {
    display: block;
    width: 100%;
    height: 100%;
}
.product.product-2 .product-media img,
.product.product-7 .product-media img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain;
}

/* Kart gövdesi esner, "Sepete Ekle" her kartta EN ALTA sabitlenir */
.product.product-2 .product-body,
.product.product-7 .product-body {
    padding: 1.2rem 1.4rem 1.6rem;
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    width: 100%;
}
.product.product-2 .product-body .ratings-container,
.product.product-7 .product-body .ratings-container {
    margin-top: auto;
    margin-bottom: 0;
    padding-top: 10px;
}
.product-cat a {
    color: #9aa0b5;
    font-size: 1.15rem;
}
.product-title a {
    color: var(--st-lacivert);
    font-weight: 600;
}
.product-title a:hover {
    color: var(--st-kirmizi);
}

/* Ürün etiketleri */
.product-label.label-circle {
    border-radius: 50px;
    width: auto;
    height: auto;
    padding: 5px 12px;
    font-weight: 700;
    font-size: 1.1rem;
    letter-spacing: .02em;
}
.product-label.label-new  { background-color: var(--st-yesil) !important; color: #fff; }
.product-label.label-top  { background-color: var(--st-mavi) !important;  color: #fff; }
.product-label.label-sale { background-color: var(--st-kirmizi) !important; color: #fff; }

/* Favori düğmesi */
.btn-product-icon {
    border-radius: 50%;
    color: var(--st-lacivert);
}
.btn-product-icon:hover,
.btn-product-icon:focus {
    background-color: var(--st-kirmizi) !important;
    color: #fff !important;
}

/* Ürünü incele bandı */
.btn-product.btn-cart {
    background: rgba(43, 47, 74, .92);
    color: #fff;
}
.btn-product.btn-cart:hover,
.btn-product.btn-cart:focus {
    background: var(--st-kirmizi);
}
.btn-product.btn-cart span {
    color: #fff;
    font-weight: 600;
}

/* Fiyat bloğu standart: birim sekmeleri ÜSTTE, fiyat her zaman ALTINDA
   (şablonun flex-wrap'i fiyatı bazen yana bazen alta atıyordu) */
.product.product-2 .product-price,
.product.product-7 .product-price {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    height: auto;
    min-height: 7rem;
    margin-bottom: 0;
}
.product.product-2 .product-price .nav-tabs,
.product.product-7 .product-price .nav-tabs {
    width: 100%;
    border-bottom: 1px solid #eef0f7;
    margin-bottom: 6px;
}
.product.product-2 .product-price .tab-content,
.product.product-7 .product-price .tab-content {
    width: 100%;
    text-align: left;
}
.product.product-2 .product-price .tab-content h6,
.product.product-7 .product-price .tab-content h6 {
    margin: 0;
}

/* Fiyat sekmeleri */
.product-price .nav-tabs .nav-link {
    color: var(--st-lacivert) !important;
    font-weight: 700;
    border-radius: 8px 8px 0 0;
}
.product-price .nav-tabs .nav-link.active {
    color: var(--st-kirmizi) !important;
    border-color: var(--st-kirmizi);
}
.product-price h6.text-primary {
    color: var(--st-kirmizi) !important;
    font-weight: 800;
    font-size: 1.6rem;
    font-family: 'Baloo 2', sans-serif;
}

/* Sepete Ekle düğmesi — degrade hap */
.custom-red-button {
    background: linear-gradient(135deg, var(--st-kirmizi), var(--st-turuncu)) !important;
    border-radius: 50px !important;
    padding: 9px 22px !important;
    font-weight: 700;
    font-family: 'Baloo 2', sans-serif;
    box-shadow: 0 4px 14px rgba(255, 77, 90, .35);
    transition: transform .2s ease, box-shadow .2s ease;
    display: inline-block;
}
.custom-red-button:hover {
    background: linear-gradient(135deg, var(--st-turuncu), var(--st-kirmizi)) !important;
    transform: translateY(-2px);
    box-shadow: 0 6px 18px rgba(255, 77, 90, .5);
}

/* ------------------------------------------------------------
   7. GENEL DÜĞMELER
   ------------------------------------------------------------ */
.btn-primary {
    background: linear-gradient(135deg, var(--st-kirmizi), var(--st-turuncu)) !important;
    border-color: transparent !important;
    color: #fff !important;
    border-radius: 50px;
    font-weight: 700;
    box-shadow: 0 4px 14px rgba(255, 77, 90, .3);
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active {
    background: linear-gradient(135deg, var(--st-turuncu), var(--st-kirmizi)) !important;
    border-color: transparent !important;
    color: #fff !important;
}
.btn-outline-primary-2 {
    color: var(--st-kirmizi) !important;
    border-color: var(--st-kirmizi) !important;
    border-radius: 50px;
    font-weight: 700;
}
.btn-outline-primary-2:hover, .btn-outline-primary-2:focus {
    background-color: var(--st-kirmizi) !important;
    color: #fff !important;
}
.btn-outline-primary-2 span { color: inherit; }

/* Form odak rengi */
.form-control:focus {
    border-color: var(--st-mavi);
    box-shadow: 0 0 0 .2rem rgba(33, 150, 243, .15);
}

/* ------------------------------------------------------------
   8. OWL CAROUSEL KONTROLLERİ
   ------------------------------------------------------------ */
.owl-theme .owl-dots .owl-dot span {
    background: #d7dbe8;
    border-color: #d7dbe8;
}
.owl-theme .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
    background: var(--st-kirmizi);
    border-color: var(--st-kirmizi);
}
/* Ürün karüsel okları — şablondaki tam-yükseklik şerit yerine ortalanmış yuvarlak düğme */
.owl-full .owl-nav [class*='owl-'] {
    top: 50% !important;
    transform: translateY(-50%);
    width: 44px;
    height: 44px !important;
    border-radius: 50%;
    color: var(--st-lacivert);
    background: #fff;
    font-size: 1.8rem;
    box-shadow: 0 4px 14px rgba(43, 47, 74, .22);
    border: 1px solid #eef0f7;
}
.owl-full.carousel-with-shadow .owl-nav [class*='owl-'] {
    height: 44px !important; /* calc(100% - 20px) kuralını ez */
}
/* Kenarlardaki gölge şeridi görsellerini kapat */
.owl-full .owl-nav [class*='owl-']:before {
    display: none !important;
    content: none !important;
}
.owl-full .owl-nav .owl-prev { left: -14px; }
.owl-full .owl-nav .owl-next { right: -14px; }
.owl-full .owl-nav [class*='owl-']:hover,
.owl-full .owl-nav [class*='owl-']:focus {
    color: #fff !important;
    background: var(--st-kirmizi) !important;
    border-color: var(--st-kirmizi);
}
.owl-nav-inside .owl-nav [class*='owl-'] {
    color: var(--st-lacivert);
    background: #fff;
    border-radius: 50%;
    box-shadow: var(--st-golge);
}
.owl-nav-inside .owl-nav [class*='owl-']:hover {
    color: #fff;
    background: var(--st-kirmizi);
}

/* Marka logoları */
.brand {
    border-radius: 10px;
    transition: transform .2s ease, box-shadow .2s ease;
}
.brand:hover {
    transform: translateY(-3px);
    box-shadow: var(--st-golge);
}

/* ------------------------------------------------------------
   9. AVANTAJ KUTULARI (kargo / iade / ödeme / destek)
   ------------------------------------------------------------ */
.icon-boxes-container {
    background: var(--st-zemin) !important;
    border-radius: var(--st-radius);
    margin: 0 12px 20px;
    padding: 2.4rem 0;
}
.icon-box-side .icon-box-icon {
    width: 58px;
    height: 58px;
    min-width: 58px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    font-size: 2.4rem;
    color: #fff !important;
    margin-right: 1.4rem;
}
.icon-boxes-container .col-sm-6:nth-child(1) .icon-box-icon { background: var(--st-kirmizi); }
.icon-boxes-container .col-sm-6:nth-child(2) .icon-box-icon { background: var(--st-yesil); }
.icon-boxes-container .col-sm-6:nth-child(3) .icon-box-icon { background: var(--st-mavi); }
.icon-boxes-container .col-sm-6:nth-child(4) .icon-box-icon { background: var(--st-mor); }
.icon-box-title {
    color: var(--st-lacivert);
    font-weight: 700;
}

/* ------------------------------------------------------------
   10. KAYAN YAZI ŞERİDİ
   ------------------------------------------------------------ */
#scroll-container, #scroll-container2 {
    box-shadow: none !important;
}
#scroll-text, #scroll-text2 {
    font-family: 'Baloo 2', sans-serif;
    font-weight: 600;
}

/* ------------------------------------------------------------
   11. FOOTER
   ------------------------------------------------------------ */
/* E-Bülten alanı — degrade zemin (inline bg görselini ezer) */
.footer .cta.bg-image {
    background-image: linear-gradient(135deg, var(--st-mor) 0%, var(--st-mavi) 100%) !important;
    background-color: var(--st-mor) !important;
}
.footer .cta .cta-title {
    font-weight: 700;
}
.footer .cta .form-control {
    border-radius: 50px 0 0 50px;
    border: 0;
}
.footer .cta .btn {
    border-radius: 0 50px 50px 0;
}

.footer-middle {
    background-color: var(--st-lacivert);
    border-top: 5px solid transparent;
    border-image: linear-gradient(90deg,
        var(--st-kirmizi), var(--st-turuncu), var(--st-sari),
        var(--st-yesil), var(--st-mavi), var(--st-mor)) 1;
    color: #b9bdd3;
}
.footer-middle .widget-title {
    color: #fff;
    font-weight: 700;
    position: relative;
    padding-bottom: 8px;
}
.footer-middle .widget-title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 34px;
    height: 3px;
    border-radius: 3px;
    background: var(--st-sari);
}
.footer-middle .widget-list a,
.footer-middle p,
.footer-middle .widget-about-info a {
    color: #b9bdd3;
}
.footer-middle .widget-list a:hover {
    color: var(--st-sari);
}
.footer-middle .widget-call {
    border-color: rgba(255, 255, 255, .15);
    color: #fff;
}
.footer-middle .widget-call i {
    color: var(--st-sari);
}
.footer-middle .widget-call a {
    color: #fff;
}

.footer-bottom {
    background-color: var(--st-lacivert-koyu);
    border-top: 1px solid rgba(255, 255, 255, .06);
}
.footer-bottom .footer-copyright,
.footer-bottom .footer-copyright b {
    color: #8f94ad;
}

/* Yukarı çık düğmesi */
#scroll-top {
    background: linear-gradient(135deg, var(--st-kirmizi), var(--st-turuncu));
    color: #fff;
    border-radius: 50%;
    box-shadow: 0 4px 14px rgba(255, 77, 90, .4);
}
#scroll-top:hover {
    background: var(--st-lacivert);
}

/* ------------------------------------------------------------
   12. MOBİL ALT BAR
   ------------------------------------------------------------ */
#footer-bar {
    background: #fff;
    border-radius: 18px 18px 0 0;
    box-shadow: 0 -6px 24px rgba(43, 47, 74, .16);
}
#footer-bar a {
    color: var(--st-lacivert);
}
#footer-bar a span {
    font-weight: 700;
}
#footer-bar a:nth-child(1) i { color: var(--st-kirmizi); }
#footer-bar a:nth-child(2) i { color: var(--st-mavi); }
#footer-bar a:nth-child(3) i { color: var(--st-mor); }
#footer-bar a:nth-child(4) i { color: var(--st-pembe); }
#footer-bar a:nth-child(5) i { color: var(--st-yesil); }

/* ------------------------------------------------------------
   13. MOBİL MENÜ + MODAL
   ------------------------------------------------------------ */
.mobile-menu-container {
    background-color: var(--st-lacivert);
}
.mobile-menu li a {
    color: #d5d8e8;
}
.mobile-menu li a:hover,
.mobile-menu li.active > a {
    color: var(--st-sari);
}
.mobile-menu-toggler {
    color: var(--st-lacivert);
}

.modal-content {
    border: 0;
    border-radius: var(--st-radius);
    box-shadow: var(--st-golge-hover);
}
.modal .nav-pills .nav-link.active,
.modal .nav-pills .nav-link:hover {
    color: var(--st-kirmizi);
    border-bottom-color: var(--st-kirmizi);
}

/* ------------------------------------------------------------
   14. İÇ SAYFALAR
   ------------------------------------------------------------ */
.page-header {
    background: linear-gradient(135deg, #eef3ff 0%, #fff4f5 100%);
}
.page-header h1 {
    color: var(--st-lacivert);
    font-weight: 700;
}
.breadcrumb-nav {
    border-bottom-color: #eef0f7;
}
.breadcrumb-item a {
    color: var(--st-mavi);
}
.breadcrumb-item.active {
    color: #9aa0b5;
}

/* Sayfalama */
.pagination .page-link {
    border-radius: 8px;
    color: var(--st-lacivert);
    font-weight: 600;
}
.pagination .page-item.active .page-link {
    background: var(--st-kirmizi);
    border-color: var(--st-kirmizi);
    color: #fff;
}
.pagination .page-link:hover {
    color: var(--st-kirmizi);
}

/* Ürün detay fiyat */
.product-details .product-price,
.product-price {
    color: var(--st-kirmizi);
}

/* Sekme başlıkları (ürün detay vs.) */
.nav.nav-pills .nav-link.active,
.nav.nav-pills .nav-link:hover,
.nav.nav-pills .nav-link:focus {
    color: var(--st-kirmizi);
    border-bottom-color: var(--st-kirmizi);
}

/* Tablolar (sepet, hesabım) */
.table thead th {
    color: var(--st-lacivert);
    font-family: 'Baloo 2', sans-serif;
}