/* =============================================
   PAZARTIMI ÖZEL STİL
   ============================================= */

:root {
    --ana-renk: #1e40af;
    --ana-renk-koyu: #1e3a8a;
    --vurgu-renk: #f59e0b;
    --yesil: #10b981;
    --kirmizi: #ef4444;
    --gri: #f3f4f6;
    --metin: #1f2937;
}

body {
    font-family: 'Segoe UI', Tahoma, sans-serif;
    color: var(--metin);
    background: #fff;
}

/* ============ ÜST ŞERİT ============ */
.ust-serit {
    background: var(--ana-renk-koyu);
    color: #fff;
    font-size: 13px;
    padding: 8px 0;
}
.ust-serit a {
    color: #e0e7ff;
    text-decoration: none;
}
.ust-serit a:hover { color: #fff; }

/* ============ ANA MENÜ ============ */
.ana-menu {
    background: #fff;
    box-shadow: 0 2px 10px rgba(0,0,0,.08);
    padding: 12px 0;
}
.logo-metin {
    font-size: 26px;
    font-weight: 800;
    color: var(--ana-renk);
    letter-spacing: -0.5px;
}
.navbar-nav .nav-link {
    font-weight: 500;
    color: var(--metin) !important;
    padding: 8px 14px !important;
    transition: all .2s;
}
.navbar-nav .nav-link:hover {
    color: var(--ana-renk) !important;
}

.btn-arama {
    background: var(--ana-renk);
    color: #fff;
    border: none;
}
.btn-arama:hover { background: var(--ana-renk-koyu); color: #fff; }

.btn-giris {
    border: 1px solid var(--ana-renk);
    color: var(--ana-renk);
    background: #fff;
    font-weight: 600;
}
.btn-giris:hover { background: var(--ana-renk); color: #fff; }

.btn-uye {
    background: var(--vurgu-renk);
    color: #fff;
    border: none;
    font-weight: 600;
}
.btn-uye:hover { background: #d97706; color: #fff; }

.btn-hesap {
    background: var(--gri);
    color: var(--metin);
    border: none;
    font-weight: 600;
}

.btn-sepet {
    background: var(--ana-renk);
    color: #fff;
    position: relative;
    padding: 8px 14px;
}
.btn-sepet:hover { background: var(--ana-renk-koyu); color: #fff; }
.sepet-rozet {
    position: absolute;
    top: -6px;
    right: -6px;
    background: var(--kirmizi);
    color: #fff;
    border-radius: 50%;
    font-size: 11px;
    padding: 2px 6px;
    font-weight: 700;
}

/* ============ ÜRÜN KARTLARI ============ */
.urun-kart {
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
    transition: all .3s;
    height: 100%;
    background: #fff;
}
.urun-kart:hover {
    box-shadow: 0 10px 25px rgba(0,0,0,.1);
    transform: translateY(-4px);
    border-color: var(--ana-renk);
}
.urun-resim-kutu {
    position: relative;
    padding-top: 75%;
    background: var(--gri);
    overflow: hidden;
}
.urun-resim-kutu img {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    object-fit: cover;
}
.indirim-rozet {
    position: absolute;
    top: 10px;
    left: 10px;
    background: var(--kirmizi);
    color: #fff;
    padding: 4px 10px;
    border-radius: 6px;
    font-size: 12px;
    font-weight: 700;
}
.urun-baslik {
    font-size: 15px;
    font-weight: 600;
    color: var(--metin);
    text-decoration: none;
    display: block;
    min-height: 42px;
    line-height: 1.3;
}
.urun-baslik:hover { color: var(--ana-renk); }
.eski-fiyat {
    text-decoration: line-through;
    color: #9ca3af;
    font-size: 13px;
}
.yeni-fiyat {
    color: var(--kirmizi);
    font-size: 20px;
    font-weight: 800;
}
.normal-fiyat {
    color: var(--metin);
    font-size: 20px;
    font-weight: 800;
}
.btn-sepete-ekle {
    background: var(--ana-renk);
    color: #fff;
    border: none;
    width: 100%;
    padding: 10px;
    font-weight: 600;
    border-radius: 8px;
}
.btn-sepete-ekle:hover { background: var(--ana-renk-koyu); color: #fff; }
.stok-yok {
    background: #9ca3af !important;
    cursor: not-allowed;
}

/* ============ BÖLÜM BAŞLIKLARI ============ */
.bolum-baslik {
    font-size: 22px;
    font-weight: 700;
    color: var(--metin);
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--gri);
    position: relative;
}
.bolum-baslik::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 60px;
    height: 2px;
    background: var(--ana-renk);
}

/* ============ HERO / SLIDER ============ */
.hero-alan {
    background: linear-gradient(135deg, var(--ana-renk) 0%, var(--ana-renk-koyu) 100%);
    color: #fff;
    border-radius: 16px;
    padding: 50px 40px;
    margin-bottom: 40px;
}
.hero-alan h1 {
    font-size: 36px;
    font-weight: 800;
    margin-bottom: 15px;
}

/* ============ ALT BİLGİ ============ */
.site-alt {
    background: #111827;
    color: #d1d5db;
    margin-top: auto;
}
.alt-baslik {
    color: #fff;
    font-weight: 700;
    margin-bottom: 15px;
    font-size: 15px;
}
.alt-linkler li { margin-bottom: 8px; }
.alt-linkler a {
    color: #9ca3af;
    text-decoration: none;
    font-size: 14px;
    transition: color .2s;
}
.alt-linkler a:hover { color: var(--vurgu-renk); }
.ozellik-ikon {
    font-size: 32px;
    color: var(--vurgu-renk);
}
.ozellik-serit { border-color: #374151 !important; }
.telif-serit { border-color: #374151 !important; }
.odeme-ikonlari i {
    font-size: 30px;
    margin-right: 12px;
    color: #9ca3af;
}

/* ============ MOBİL ALT MENÜ ============ */
.mobil-alt-menu {
    position: fixed;
    bottom: 0; left: 0; right: 0;
    background: #fff;
    box-shadow: 0 -2px 10px rgba(0,0,0,.1);
    display: flex;
    justify-content: space-around;
    padding: 8px 0;
    z-index: 1000;
}
.mobil-alt-menu a {
    color: var(--metin);
    text-decoration: none;
    font-size: 11px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 4px 12px;
    position: relative;
}
.mobil-alt-menu a i { font-size: 20px; margin-bottom: 2px; }
.mobil-alt-menu a:hover { color: var(--ana-renk); }
.mobil-rozet {
    position: absolute;
    top: 0; right: 8px;
    background: var(--kirmizi);
    color: #fff;
    border-radius: 50%;
    font-size: 10px;
    padding: 1px 5px;
    font-weight: 700;
}
@media (max-width: 767px) {
    body { padding-bottom: 65px; }
    .hero-alan { padding: 30px 20px; }
    .hero-alan h1 { font-size: 24px; }
}

/* ============ FORM ============ */
.form-kutu {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 30px;
    box-shadow: 0 4px 15px rgba(0,0,0,.05);
}
.btn-ana {
    background: var(--ana-renk);
    color: #fff;
    border: none;
    font-weight: 600;
    padding: 10px 24px;
}
.btn-ana:hover { background: var(--ana-renk-koyu); color: #fff; }

/* ============ SEPET ============ */
.sepet-tablo th {
    background: var(--gri);
    font-weight: 600;
    font-size: 14px;
}
.sepet-toplam-kutu {
    background: var(--gri);
    border-radius: 12px;
    padding: 20px;
}

/* ============ BREADCRUMB ============ */
.breadcrumb-alan {
    background: var(--gri);
    padding: 15px 0;
    margin-bottom: 30px;
}
.breadcrumb { margin: 0; font-size: 14px; }

/* ============ ADMIN PANEL ============ */
.yonetim-govde {
    background: #f9fafb;
    min-height: 100vh;
    padding-bottom: 40px;
}
.yonetim-ust {
    background: var(--ana-renk-koyu);
    color: #fff;
    padding: 12px 0;
}
.yonetim-ust .logo-metin { color: #fff; font-size: 20px; }
.yan-menu {
    background: #fff;
    border-radius: 12px;
    padding: 15px;
    box-shadow: 0 2px 8px rgba(0,0,0,.05);
}
.yan-menu a {
    display: block;
    padding: 10px 15px;
    color: var(--metin);
    text-decoration: none;
    border-radius: 8px;
    margin-bottom: 4px;
    font-size: 14px;
    font-weight: 500;
}
.yan-menu a:hover, .yan-menu a.aktif {
    background: var(--ana-renk);
    color: #fff;
}
.istatistik-kart {
    background: #fff;
    border-radius: 12px;
    padding: 20px;
    box-shadow: 0 2px 8px rgba(0,0,0,.05);
    border-left: 4px solid var(--ana-renk);
}
.istatistik-kart h3 {
    font-size: 28px;
    font-weight: 800;
    margin: 0;
}
.istatistik-kart small { color: #6b7280; }
/* ============ KATEGORİ KARTI ============ */
.kategori-kart {
    display: block;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 20px 10px;
    text-align: center;
    text-decoration: none;
    color: var(--metin);
    transition: all .3s;
    height: 100%;
}
.kategori-kart:hover {
    border-color: var(--ana-renk);
    color: var(--ana-renk);
    transform: translateY(-3px);
    box-shadow: 0 6px 20px rgba(30,64,175,.12);
}
.kategori-kart i {
    font-size: 36px;
    color: var(--ana-renk);
    display: block;
    margin-bottom: 10px;
}
.kategori-kart h6 {
    font-size: 13px;
    font-weight: 600;
    margin: 0;
}

/* ============ AVANTAJ KARTI ============ */
.avantaj-kart {
    background: var(--gri);
    border-radius: 12px;
    padding: 30px 20px;
    text-align: center;
    height: 100%;
    transition: all .3s;
}
.avantaj-kart:hover {
    background: var(--ana-renk);
    color: #fff;
}
.avantaj-kart i {
    font-size: 42px;
    color: var(--ana-renk);
    margin-bottom: 15px;
    display: block;
}
.avantaj-kart:hover i { color: var(--vurgu-renk); }
.avantaj-kart h5 {
    font-weight: 700;
    font-size: 15px;
    letter-spacing: 1px;
    margin-bottom: 8px;
}
.avantaj-kart p { margin: 0; font-size: 14px; opacity: .85; }

/* ============ BLOG KARTI ============ */
.blog-kart {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    overflow: hidden;
    height: 100%;
    transition: all .3s;
}
.blog-kart:hover {
    box-shadow: 0 8px 20px rgba(0,0,0,.08);
    transform: translateY(-3px);
}
.blog-resim {
    height: 180px;
    background: var(--gri) center/cover no-repeat;
}
.blog-kart h6 a:hover { color: var(--ana-renk) !important; }
/* ============ FİLTRE KUTUSU ============ */
.filtre-kutu {
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 18px;
    position: sticky;
    top: 90px;
}
.filtre-baslik {
    font-weight: 700;
    margin-bottom: 15px;
    padding-bottom: 10px;
    border-bottom: 1px solid #e5e7eb;
}
.filtre-liste { list-style: none; padding: 0; margin: 0; }
.filtre-liste li { margin-bottom: 4px; }
.filtre-liste a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 8px 12px;
    border-radius: 8px;
    color: var(--metin);
    text-decoration: none;
    font-size: 14px;
    transition: all .2s;
}
.filtre-liste a:hover, .filtre-liste a.aktif {
    background: var(--ana-renk);
    color: #fff;
}
.filtre-liste a.aktif .badge { background: #fff !important; color: var(--ana-renk); }

/* ============ ÜRÜN DETAY ============ */
.urun-galeri .ana-resim-kutu {
    position: relative;
    padding-top: 90%;
    background: var(--gri);
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid #e5e7eb;
}
.urun-galeri .ana-resim-kutu img {
    position: absolute;
    top: 0; left: 0;
    width: 100%; height: 100%;
    object-fit: contain;
    padding: 15px;
}
.kucuk-resimler {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}
.kucuk-resimler img {
    width: 70px;
    height: 70px;
    object-fit: cover;
    border-radius: 8px;
    border: 2px solid #e5e7eb;
    cursor: pointer;
    transition: all .2s;
}
.kucuk-resimler img:hover, .kucuk-resimler img.aktif { border-color: var(--ana-renk); }

.urun-detay-baslik {
    font-size: 26px;
    font-weight: 800;
    line-height: 1.3;
    margin-bottom: 10px;
}
.urun-detay-fiyat-kutu {
    background: var(--gri);
    padding: 18px;
    border-radius: 12px;
}
.urun-detay-fiyat {
    font-size: 32px;
    font-weight: 800;
    color: var(--kirmizi);
}
.adet-kutu {
    display: flex;
    align-items: center;
    border: 1px solid #d1d5db;
    border-radius: 8px;
    overflow: hidden;
}
.adet-kutu button {
    background: #fff;
    border: none;
    width: 40px;
    height: 45px;
    font-size: 20px;
    font-weight: 700;
    cursor: pointer;
}
.adet-kutu button:hover { background: var(--gri); }
.adet-kutu input {
    width: 60px;
    height: 45px;
    border: none;
    text-align: center;
    font-weight: 700;
    font-size: 16px;
}
.guven-kutu {
    background: var(--gri);
    padding: 12px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 500;
    text-align: center;
}
.guven-kutu i { color: var(--ana-renk); margin-right: 5px; }
.nav-tabs .nav-link {
    color: var(--metin);
    font-weight: 600;
}
.nav-tabs .nav-link.active {
    color: var(--ana-renk);
    font-weight: 700;
}
/* ============ ÖDEME SEÇENEKLERİ ============ */
.odeme-secenek {
    margin-bottom: 12px;
}
.odeme-secenek input[type="radio"] {
    display: none;
}
.odeme-secenek label {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 15px;
    border: 2px solid #e5e7eb;
    border-radius: 10px;
    cursor: pointer;
    transition: all .2s;
}
.odeme-secenek label:hover { border-color: var(--ana-renk); }
.odeme-secenek input:checked + label {
    border-color: var(--ana-renk);
    background: #eff6ff;
}
.odeme-secenek label i {
    font-size: 28px;
    color: var(--ana-renk);
}
.odeme-secenek label strong { display: block; font-size: 15px; }
.odeme-secenek label small { color: #6b7280; font-size: 13px; }
.havale-bilgi { margin: 0 0 12px 0; }

/* ============ SEPET ADET KÜÇÜK ============ */
.adet-kucuk button { width: 32px; height: 36px; font-size: 16px; }
.adet-kucuk input { width: 45px; height: 36px; font-size: 14px; }

/* ============ SAYFALAMA ============ */
.pagination .page-link {
    color: var(--ana-renk);
    border-color: #e5e7eb;
}
.pagination .page-item.active .page-link {
    background: var(--ana-renk);
    border-color: var(--ana-renk);
}