/* Genel Stiller */
body {
    background: #fff;
    color: #212529;
    font-family: 'Poppins', system-ui, sans-serif;
}

/* Duyuru Çubuğu */
.announcement-bar {
    background-color: #000;
    color: #fff;
    width: 100%;
    padding: 10px;
    overflow: hidden;
}

.scrolling-text {
    white-space: nowrap;
    animation: scroll 30s linear infinite;
    display: inline-block;
}

.scrolling-text span {
    padding: 0 2rem;
    font-size: 1.2rem;
    display: inline-block;
}

@keyframes scroll {
    0% { transform: translateX(0); }
    100% { transform: translateX(-100%); }
}

/* Header */
.header {
    z-index: 1000;
    background-color: #fff;
    width: 100%;
    transition: top .3s;
    top: 0;
    position: sticky;
}

/* Mobil Menü */
.mobile-sidebar {
    z-index: 1050;
    background-color: #fff;
    flex-direction: column;
    width: 300px;
    height: 100%;
    transition: right .3s;
    position: fixed;
    top: 0;
    right: -100%;
    box-shadow: -2px 0 10px #0000001a;
}

.mobile-sidebar.open {
    right: 0;
}

/* Ürün Kartı */
.product-card {
    border: 1px solid #e2e9e1;
    border-radius: 10px;
    overflow: hidden;
    transition: transform .3s, box-shadow .3s;
    margin-bottom: 20px;
}

.product-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 25px #00000026;
}

.product-card img {
    width: 100%;
    height: 250px;
    object-fit: cover;
}

/* Fiyat Stilleri */
.text-brand {
    font-size: 24px;
    font-weight: 700;
    color: #088178;
}

.old-price {
    color: #7f8c8d;
    text-decoration: line-through;
    font-size: 14px;
}

.discount-badge {
    background: linear-gradient(90deg, #ff6a00 0%, #ee0979 100%);
    color: #fff;
    padding: 3px 8px;
    border-radius: 3px;
    font-size: 12px;
}

/* Ürün Detay Galeri */
.gallery-container {
    flex-direction: column;
    align-items: center;
    max-width: 100%;
    display: flex;
}

.main-image-container {
    aspect-ratio: 1/1.5;
    width: 100%;
    min-height: 400px;
    overflow: hidden;
}

.main-image-container img {
    object-fit: contain;
    width: 100%;
    height: auto;
}

.thumbnail-wrapper {
    align-items: center;
    width: 100%;
    display: flex;
}

.thumbnail-container {
    scroll-behavior: smooth;
    flex: 1;
    gap: 10px;
    padding: 10px;
    display: flex;
    overflow-x: auto;
}

.thumbnail-container img {
    object-fit: cover;
    border: 2px solid #ddd;
    border-radius: 15px;
    flex-shrink: 0;
    width: 100px;
    height: 100px;
    cursor: pointer;
}

/* Çoklu Alım Seçeneği */
.product-option {
    cursor: pointer;
    background-color: #fff;
    border: 2px solid #a2a3a4;
    border-radius: 10px;
    min-height: 85px;
    padding: 10px;
    transition: border-color .3s;
}

.product-option.active {
    background-color: #fff7f2;
    border-color: #ff5722;
}

/* Flaş İndirim */
.flash-urunler {
    color: #fff;
    background: linear-gradient(90deg, #ff6a00 0%, #ee0979 100%);
    border-radius: 8px;
    padding: 10px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/* Mobil Sabit Footer */
.sticky-footer {
    z-index: 2;
    background-color: #fff;
    border-top: 1px solid #e0e0e0;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 10px;
    display: flex;
    position: fixed;
    bottom: 0;
    box-shadow: 0 -2px 5px #0000001a;
}

/* Responsive */
@media (max-width: 768px) {
    .mobile-sidebar { width: 280px; }
    .product-card img { height: 200px; }
}
@media (max-width: 991px) {
    .navbar-brand > div { display: none; }
    .mobile-sidebar { display: block; }
}
.social-icons a:hover { color: #f27a1a !important; }
/* Rozet stilleri */
.badge-indirim { background: #ff6a00; color: #fff; padding: 2px 8px; border-radius: 3px; font-size: 12px; }
.badge-flash { background: linear-gradient(90deg, #ff6a00, #ee0979); color: #fff; padding: 2px 8px; border-radius: 3px; font-size: 12px; }
.badge-coksatan { background: #28a745; color: #fff; padding: 2px 8px; border-radius: 3px; font-size: 12px; }
.badge-trend { background: #ff4757; color: #fff; padding: 2px 8px; border-radius: 3px; font-size: 12px; }
.badge-yeni { background: #007bff; color: #fff; padding: 2px 8px; border-radius: 3px; font-size: 12px; }
/* Carousel banner */
/* Banner */
.banner-section {
    width: 100%;
    max-width: 1200px; /* container genişliğiyle aynı */
    margin: 0 auto 2rem;
    overflow: hidden;
    border-radius: 10px;
}
.banner-section .swiper-slide img {
    width: 100%;
    height: auto;
    max-height: 400px;
    object-fit: cover;
}
@media (max-width: 768px) {
    .banner-section {
        border-radius: 0;
    }
    .banner-section .swiper-slide img {
        max-height: 250px;
    }
}

/* Ürün Kartı Rozetleri */
.product-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    color: #fff;
    padding: 3px 12px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    z-index: 2;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}
.badge-indirim { background: linear-gradient(135deg, #ff6a00, #ee0979); }
.badge-flash { background: linear-gradient(135deg, #f12711, #f5af19); }
.badge-coksatan { background: #28a745; }
.badge-trend { background: #ff4757; }
.badge-yeni { background: #007bff; }

.discount-badge-right {
    position: absolute;
    top: 10px;
    right: 10px;
    background: #ff6a00;
    color: #fff;
    padding: 3px 12px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    z-index: 2;
    box-shadow: 0 2px 8px rgba(0,0,0,0.15);
}

/* Product Card */
.product-card {
    border: 1px solid #e2e9e1;
    border-radius: 10px;
    overflow: hidden;
    transition: transform .3s, box-shadow .3s;
    margin-bottom: 20px;
    background: #fff;
}
.product-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.15);
}
.product-card a { text-decoration: none; }
.product-card img {
    width: 100%;
    height: 250px;
    object-fit: cover;
}
.text-brand {
    font-size: 1.2rem;
    font-weight: 700;
    color: #088178;
}
.old-price {
    color: #7f8c8d;
    text-decoration: line-through;
    font-size: 0.8rem;
}
.star-rating i { margin-right: 1px; font-size: 0.7rem; }

@media (max-width: 768px) {
    .product-card img { height: 180px; }
}
/* =========================
   ÜRÜN KARTLARI EŞİT BOY FIX
   index.php + urunler.php mevcut HTML yapısına göre
========================= */

.row > .col-6.col-md-4.col-lg-3 {
    display: flex;
    margin-bottom: 24px;
}

.row > .col-6.col-md-4.col-lg-3 > .product-card {
    width: 100%;
}

.product-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    margin-bottom: 0;
}

.product-card > a.position-relative {
    flex: 0 0 auto;
}

.product-card img {
    width: 100%;
    height: 250px;
    object-fit: cover;
}

.product-card > .p-3 {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.product-card-title {
    height: 42px !important;
    min-height: 42px;
    max-height: 42px;
    overflow: hidden;
    margin-bottom: 12px;
    line-height: 1.35;
    font-size: 15px;
    font-weight: 600;
}

.product-card-title a {
    color: #222 !important;
    text-decoration: none !important;
}

.product-card .d-flex.justify-content-between.align-items-center {
    margin-top: auto;
}

.product-card .btn.btn-sm.btn-success {
    width: 36px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

@media (max-width: 768px) {
    .product-card img {
        height: 180px;
    }

    .product-card-title {
        height: 40px !important;
        min-height: 40px;
        max-height: 40px;
        font-size: 13px;
    }

    .text-brand {
        font-size: 1rem;
    }
}
/* =========================
   BANNER OVERLAY
========================= */

.banner-section {
    position: relative;
}

.banner-overlay {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
    text-align: center;
    color: #fff;
    padding: 0 15px;
}

.banner-title {
    font-size: 32px;
    font-weight: 700;
    margin-bottom: 15px;
    text-shadow: 0 2px 10px rgba(0,0,0,0.6);
}

.banner-btn {
    display: inline-block;
    background: #ffc107;
    color: #000;
    padding: 10px 25px;
    border-radius: 6px;
    font-weight: 600;
    text-decoration: none;
}

.banner-btn:hover {
    background: #ffb300;
}

/* mobil */
@media (max-width: 768px) {
    .banner-title {
        font-size: 20px;
    }

    .banner-btn {
        padding: 8px 18px;
        font-size: 14px;
    }
}
/* =========================
   BAŞLIK GÜÇLENDİRME
========================= */

.section-title {
    font-size: 28px;
    font-weight: 700;
    margin-bottom: 20px;
    position: relative;
    padding-bottom: 8px;
}

.section-title::after {
    content: '';
    width: 60px;
    height: 3px;
    background: #ff6a00;
    position: absolute;
    left: 0;
    bottom: 0;
}
/* =========================
   TREND MARKET BENZER HEADER + HERO
========================= */

.announcement-bar {
    display: none;
}

.main-header {
    position: sticky;
    top: 0;
    background: #fff;
    z-index: 1000;
    border-bottom: 1px solid #eee;
}

.main-header-inner {
    height: 54px;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    padding: 0 22px;
}

.main-nav {
    gap: 26px;
    align-items: center;
}

.main-nav a {
    color: #111;
    text-decoration: none;
    font-size: 14px;
    font-weight: 800;
    letter-spacing: .3px;
}

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

.main-logo img {
    max-height: 42px;
    width: auto;
}

.main-header-icons {
    justify-content: flex-end;
    align-items: center;
    gap: 22px;
}

.main-header-icons a {
    color: #111;
    text-decoration: none;
    font-size: 18px;
    position: relative;
}

.cart-icon span {
    position: absolute;
    top: -9px;
    right: -12px;
    width: 18px;
    height: 18px;
    background: #000;
    color: #fff;
    border-radius: 50%;
    font-size: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hero-banner {
    position: relative;
    width: 100%;
    height: 620px;
    overflow: hidden;
    margin: 0;
}

.hero-banner .swiper,
.hero-banner .swiper-wrapper,
.hero-banner .swiper-slide {
    width: 100%;
    height: 100%;
}

.hero-banner .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hero-banner-content {
    position: absolute;
    left: 50%;
    top: 73%;
    transform: translate(-50%, -50%);
    z-index: 5;
    text-align: center;
    color: #fff;
}

.hero-slogan {
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 28px;
    text-shadow: 0 2px 10px rgba(0,0,0,.45);
}

.hero-button {
    display: inline-block;
    background: #000;
    color: #fff !important;
    text-decoration: none;
    padding: 16px 34px;
    font-size: 14px;
    font-weight: 800;
    border-radius: 0;
}

.hero-button:hover {
    background: #222;
}

.home-products-section {
    padding: 45px 0 30px;
}

.home-products-title-wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 22px 25px;
}

.home-products-title {
    font-size: 48px;
    line-height: 1;
    font-weight: 900;
    color: #000;
    margin: 0;
    letter-spacing: 1px;
}

.shop-all-link {
    color: #c94f4f;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
}

.shop-all-link:hover {
    color: #000;
}

.section-title {
    display: none;
}

@media (max-width: 991px) {
    .main-header-inner {
        display: flex;
        height: 58px;
        justify-content: center;
        position: relative;
        padding: 0 15px;
    }

    .main-logo img {
        max-height: 46px;
    }

    .navbar-toggler {
        position: absolute;
        right: 15px;
        border: 0;
    }

    .hero-banner {
        height: 430px;
    }

    .hero-banner-content {
        top: 70%;
        width: 90%;
    }

    .hero-slogan {
        font-size: 13px;
        margin-bottom: 18px;
    }

    .hero-button {
        padding: 12px 24px;
        font-size: 13px;
    }

    .home-products-title {
        font-size: 38px;
    }
}

@media (max-width: 576px) {
    .hero-banner {
        height: 330px;
    }

    .home-products-title-wrap {
        padding: 0 15px 20px;
    }

    .home-products-title {
        font-size: 34px;
    }

    .shop-all-link {
        font-size: 12px;
    }
}
/* HEADER ACİL DÜZELTME */
.announcement-bar {
    display: none !important;
}

.main-header {
    background: #fff !important;
    border-bottom: 1px solid #eee;
    position: sticky;
    top: 0;
    z-index: 999;
}

.main-header-inner {
    height: 54px;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    padding: 0 22px;
}

.main-nav {
    display: flex;
    gap: 24px;
    align-items: center;
}

.main-nav a {
    color: #111 !important;
    text-decoration: none !important;
    font-size: 14px;
    font-weight: 800;
}

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

.main-logo img {
    max-height: 42px;
    width: auto;
}

.main-header-icons {
    display: flex;
    justify-content: flex-end;
    gap: 20px;
}

.main-header-icons a {
    color: #111 !important;
    font-size: 18px;
    text-decoration: none;
}

.hero-banner {
    position: relative;
    width: 100%;
    height: 620px;
    overflow: hidden;
}

.hero-banner .swiper,
.hero-banner .swiper-wrapper,
.hero-banner .swiper-slide {
    height: 100%;
}

.hero-banner .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.hero-banner-content {
    position: absolute;
    left: 50%;
    top: 72%;
    transform: translate(-50%, -50%);
    z-index: 10;
    text-align: center;
    color: #fff;
}

.hero-slogan {
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 26px;
    text-shadow: 0 2px 10px rgba(0,0,0,.55);
}

.hero-button {
    display: inline-block;
    background: #000;
    color: #fff !important;
    padding: 16px 34px;
    text-decoration: none !important;
    font-weight: 800;
}

.home-products-section {
    padding: 45px 0 30px;
}

.home-products-title-wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 22px 25px;
}

.home-products-title {
    font-size: 48px;
    font-weight: 900;
    color: #000;
    margin: 0;
}

.shop-all-link {
    color: #c94f4f !important;
    text-decoration: none;
}

@media (max-width: 991px) {
    .main-header-inner {
        display: flex;
        justify-content: center;
        position: relative;
    }

    .navbar-toggler {
        position: absolute;
        right: 15px;
        border: 0;
    }

    .hero-banner {
        height: 380px;
    }

    .home-products-title {
        font-size: 36px;
    }
}
/* =========================
   DÜZELTME: DUYURU + 1200x400 BANNER + ÜRÜN GENİŞLİĞİ
========================= */

/* Kayan duyuru tekrar aktif */
.announcement-bar {
    display: block !important;
    background-color: #000;
    color: #fff;
}

/* Banner tam ekran değil, eski gibi 1200x400 */
.hero-banner {
    width: 100%;
    max-width: 1200px;
    height: 400px !important;
    margin: 18px auto 35px auto;
    border-radius: 10px;
    overflow: hidden;
}

/* Banner görseli */
.hero-banner .swiper,
.hero-banner .swiper-wrapper,
.hero-banner .swiper-slide {
    height: 100%;
}

.hero-banner .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Banner yazı + buton konumu */
.hero-banner-content {
    top: 55% !important;
}

/* Ürünler alanı da 1200 genişlikte kalsın */
.home-products-section {
    max-width: 1200px;
    margin: 0 auto;
    padding: 25px 0 30px;
}

/* İç container taşmasın */
.home-products-section .container-fluid {
    max-width: 1200px;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

/* ÜRÜNLER başlığı biraz daha kontrollü */
.home-products-title-wrap {
    padding: 0 0 25px 0 !important;
}

.home-products-title {
    font-size: 46px;
}

/* Ürün görselleri çok yakınlaşmasın */
.product-card img {
    height: 250px;
    object-fit: contain;
    background: #fff;
}

/* Mobil ayar */
@media (max-width: 768px) {
    .hero-banner {
        height: 240px !important;
        max-width: 100%;
        border-radius: 0;
        margin-top: 0;
    }

    .hero-banner-content {
        top: 58% !important;
        width: 90%;
    }

    .home-products-section {
        max-width: 100%;
        padding: 20px 12px 30px;
    }

    .home-products-title {
        font-size: 34px;
    }

    .product-card img {
        height: 180px;
    }
}
/* =========================
   GÜMRÜK DEPO HEADER + 1200 GENİŞLİK + ÜRÜN GÖRSEL FIX
========================= */

.announcement-bar {
    display: block !important;
    background: #000;
    color: #fff;
    width: 100%;
    padding: 8px 0;
}

.gd-header {
    background: #fff !important;
    border-bottom: 1px solid #eee;
    position: sticky;
    top: 0;
    z-index: 1000;
}

.gd-header-inner {
    max-width: 1200px;
    height: 58px;
    margin: 0 auto;
    padding: 0 12px;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
}

.gd-nav {
    align-items: center;
    gap: 24px;
}

.gd-nav a {
    color: #111 !important;
    text-decoration: none !important;
    font-size: 14px;
    font-weight: 900;
    letter-spacing: .2px;
    white-space: nowrap;
}

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

.gd-logo img {
    max-height: 46px;
    width: auto;
    display: block;
}

.gd-social {
    justify-content: flex-end;
    align-items: center;
    gap: 14px;
}

.gd-social a {
    width: 25px;
    height: 25px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none !important;
    font-size: 18px;
}

.gd-social .facebook { color: #1877f2 !important; }
.gd-social .instagram { color: #e1306c !important; }
.gd-social .youtube { color: #ff0000 !important; }
.gd-social .tiktok { color: #000 !important; }

/* Eski sağ ikonları kapat */
.main-header-icons,
.cart-icon {
    display: none !important;
}

/* Banner 1200px içinde */
.hero-banner,
.banner-section {
    width: 100%;
    max-width: 1200px;
    height: 400px !important;
    margin: 18px auto 35px auto !important;
    border-radius: 10px;
    overflow: hidden;
}

.hero-banner .swiper,
.hero-banner .swiper-wrapper,
.hero-banner .swiper-slide,
.banner-section .swiper,
.banner-section .swiper-wrapper,
.banner-section .swiper-slide {
    height: 100% !important;
}

.hero-banner .swiper-slide img,
.banner-section .swiper-slide img {
    width: 100%;
    height: 100% !important;
    object-fit: cover;
}

/* Ürün alanı 1200px içinde */
.home-products-section,
.container.mt-4 {
    max-width: 1200px !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

/* Ürün kart görseli kartı doldursun */
.product-card img {
    width: 100% !important;
    height: 250px !important;
    object-fit: cover !important;
    background: #fff;
}

.product-card {
    height: 100%;
}

.product-card > .p-3 {
    display: flex;
    flex-direction: column;
    flex: 1;
}

.product-card-title {
    height: 42px !important;
    min-height: 42px;
    max-height: 42px;
    overflow: hidden;
}

.product-card .d-flex.justify-content-between.align-items-center {
    margin-top: auto;
}

/* Mobil */
@media (max-width: 991px) {
    .gd-header-inner {
        display: flex;
        justify-content: center;
        position: relative;
        height: 58px;
    }

    .gd-logo img {
        max-height: 44px;
    }

    .gd-mobile-btn {
        position: absolute;
        right: 12px;
        border: 0;
    }

    .hero-banner,
    .banner-section {
        max-width: 100%;
        height: 260px !important;
        border-radius: 0;
        margin: 0 auto 24px auto !important;
    }
}

@media (max-width: 576px) {
    .product-card img {
        height: 180px !important;
    }
}
/* =========================
   FOOTER SOSYAL MEDYA İKONLARI
========================= */
/* Linklerin altındaki çirkin çizgiyi ve mavi rengi zorla kaldır */
footer a, .footer a, 
footer a:hover, .footer a:hover {
    text-decoration: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
}

/* İkonların arasına boşluk ver ve boyutlarını ayarla */
footer .fab, .footer .fab {
    font-size: 24px;
    margin: 0 10px;
    transition: transform 0.3s ease;
    text-decoration: none !important;
}

/* Üzerine gelince hafif büyüme efekti */
footer .fab:hover, .footer .fab:hover {
    transform: scale(1.15);
}

/* Koyu Zemin İçin Orijinal Marka Renkleri */
footer .fa-facebook { color: #1877F2 !important; }
footer .fa-instagram { color: #E1306C !important; }
footer .fa-youtube { color: #FF0000 !important; }
footer .fa-tiktok { color: #FFFFFF !important; } /* Zemin siyah/koyu olduğu için TikTok beyaz olmalı */