/* style.css - ALPPIN FINAL (V15 - YESIL BASLIK FIX) */
:root {
  --primary-color: #2c4c3b; /* Koyu Yeşil */
  --primary-dark: #1e3528;
  --primary-light: #3a644c;
  --secondary-color: #555555;
  --accent-color: #d4af37;  /* Altın */
  --accent-dark: #b8941f;
  --white: #ffffff;
  --light-bg: #fdfcf8;
  --cream: #f4f1ea;
  --text-dark: #2a2a2a;
  --text-light: #666666;
  --danger: #e74c3c; /* Kırmızı - Sepet için */
  --gold: #d4af37;
  --shadow-md: 0 8px 30px rgba(0, 0, 0, 0.08);
  --shadow-lg: 0 15px 40px rgba(0, 0, 0, 0.12);
  --border-radius: 12px;
  --transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; font-size: 16px; }

body {
  font-family: 'Segoe UI', system-ui, sans-serif;
  background-color: var(--light-bg);
  color: var(--text-dark);
  line-height: 1.6;
}

a { text-decoration: none; color: inherit; transition: var(--transition); }
img { max-width: 100%; height: auto; display: block; }
.container { width: 100%; max-width: 1200px; margin: 0 auto; padding: 0 1.5rem; }

/* --- HEADER & NAVIGATION (DÜZELTİLDİ: YEŞİL RENK GERİ GELDİ) --- */
.site-header {
  background-color: var(--primary-color); /* KESİN YEŞİL RENK */
  position: sticky;
  top: 0; 
  z-index: 1000;
  border-bottom: 1px solid rgba(212, 175, 55, 0.3);
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
  width: 100%;
}

.site-header .container { 
  display: flex; 
  justify-content: space-between; 
  align-items: center; 
  height: 80px; 
}

.logo img { height: 60px; width: auto; }

.main-navigation { display: flex; gap: 2rem; align-items: center; }

/* Linkler beyaz olsun ki yeşil üzerinde görünsün */
.main-navigation a { 
  color: var(--white); 
  font-weight: 500; 
  position: relative; 
  padding: 0.5rem 0; 
  opacity: 0.9;
  transition: opacity 0.3s;
}

.main-navigation a:hover { opacity: 1; color: var(--accent-color); }
.premium-link { color: var(--accent-color) !important; font-weight: 700; opacity: 1 !important; }

/* --- SEPET BADGE (KIRMIZI YUVARLAK BİLDİRİM) --- */
.alppin-cart-badge {
  background: rgba(255,255,255,0.1); 
  padding: 0.5rem 1rem; 
  border-radius: 50px;
  border: 1px solid rgba(212, 175, 55, 0.5); 
  display: flex; 
  align-items: center; 
  justify-content: center;
  position: relative;
  transition: all 0.3s ease;
  color: var(--white) !important; /* İkon rengi beyaz */
}

.alppin-cart-badge:hover {
  background: rgba(212, 175, 55, 0.2);
  border-color: var(--accent-color);
}

/* Kırmızı Sayı Yuvarlağı */
.count {
  position: absolute;
  top: -8px;
  right: -8px;
  background-color: var(--danger); /* Kırmızı */
  color: #fff;
  font-size: 0.75rem;
  font-weight: 800;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 5px rgba(0,0,0,0.3);
  border: 2px solid var(--primary-color); /* Yeşil kenarlık ile ayrım */
  z-index: 10;
}

/* --- HERO SECTIONS --- */
.hero, .products-hero, .premium-hero, .about-hero, .sss-hero {
  background-size: cover; background-position: center;
  display: flex; align-items: center; justify-content: center;
  text-align: center; color: var(--white); padding: 2rem;
  position: relative;
}
.hero { min-height: 80vh; background-image: linear-gradient(135deg, rgba(44,76,59,0.9), rgba(20,30,25,0.85)), url('images/hero-bg.jpg'); }
.products-hero { min-height: 40vh; background-image: linear-gradient(rgba(44,76,59,0.8), rgba(30,53,40,0.7)), url('images/urunler-hero.jpg'); }
.premium-hero { height: 400px; background-image: linear-gradient(rgba(20,30,25,0.8), rgba(44,76,59,0.9)), url('images/hero-bg.jpg'); }
.about-hero { min-height: 35vh; background-image: linear-gradient(rgba(74,103,65,0.7), rgba(74,103,65,0.5)), url('images/hakkimizda-banner.jpg'); }
.sss-hero { min-height: 30vh; background-image: linear-gradient(rgba(74,103,65,0.7), rgba(74,103,65,0.5)), url('images/sss-hero.jpg'); }

.hero-content h1, .products-hero h1, .premium-hero h1, .about-hero h1, .sss-hero h1 {
    font-size: clamp(2rem, 4vw, 3.5rem); margin-bottom: 1rem; font-weight: 800; text-shadow: 0 2px 10px rgba(0,0,0,0.3);
}

/* BUTONLAR */
.cta-button, .btn-primary, .buy-btn, .btn-checkout {
  background: linear-gradient(45deg, var(--primary-color), var(--primary-light));
  color: var(--white); padding: 1rem 2rem; border-radius: 50px; font-weight: 600;
  border: none; cursor: pointer; transition: var(--transition); display: inline-flex; align-items: center; gap: 0.5rem;
}
.premium-cta-main { background: linear-gradient(45deg, var(--accent-color), var(--accent-dark)); color: var(--text-dark); }
.btn-whatsapp { background: #25D366; width: 100%; justify-content: center; color: white; padding: 1.2rem; border-radius: 8px; font-weight: bold; border: none; cursor: pointer; font-size: 1.1rem; display: flex; align-items: center; gap: 10px; }
.btn-whatsapp:hover { background: #1ebc57; }

/* ÜRÜN KARTLARI */
.products-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 2rem;
    padding: 2rem 0;
    width: 100%; max-width: 1200px; margin: 0 auto;
}

.product-card {
    background: #ffffff;
    border: 2px solid rgba(44, 76, 59, 0.1); 
    border-radius: 24px;
    padding: 1.2rem;
    display: flex; flex-direction: column;
    transition: all 0.4s ease;
    position: relative;
    text-align: center;
    height: 100%;
}
.product-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 20px 40px rgba(44, 76, 59, 0.15);
    border-color: var(--primary-color);
}

.product-image-container {
    width: 100%; height: 260px;
    background: transparent;
    border-radius: 16px; overflow: hidden; margin-bottom: 1rem; position: relative;
}
.product-image {
    width: 100%; height: 100%; object-fit: contain; padding: 10px;
    transition: transform 0.6s ease; border-radius: 16px;
}
.product-card:hover .product-image { transform: scale(1.08); }

.product-badge {
    position: absolute; top: 10px; left: 10px;
    background: var(--primary-color); color: #fff;
    padding: 6px 14px; border-radius: 20px;
    font-size: 0.75rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: 1px;
    z-index: 2; box-shadow: 0 4px 10px rgba(0,0,0,0.1);
}

.product-info { display: flex; flex-direction: column; flex-grow: 1; justify-content: space-between; padding: 0.5rem 0; }
.product-info h3 { font-size: 1.3rem; color: var(--primary-color); font-weight: 700; margin-bottom: 0.5rem; line-height: 1.3; }
.product-description { font-size: 0.9rem; color: #777; margin-bottom: 1.5rem; line-height: 1.5; font-weight: 400; }
.product-price { font-size: 1.8rem !important; font-weight: 800 !important; color: var(--text-dark) !important; margin-bottom: 1rem !important; display: block; }

.buy-btn {
    width: 100%; padding: 14px !important; border-radius: 50px !important;
    background: var(--primary-color) !important; color: #fff !important;
    font-weight: 700 !important; font-size: 1rem !important; border: none !important;
    cursor: pointer; transition: all 0.3s ease !important;
    display: flex; align-items: center; justify-content: center; gap: 8px;
    box-shadow: 0 8px 20px rgba(44, 76, 59, 0.2);
}
.buy-btn:hover { background: var(--primary-dark) !important; transform: translateY(-2px); box-shadow: 0 12px 25px rgba(44, 76, 59, 0.3); }

/* Premium Kart Ayarları */
.premium-card { border: 2px solid var(--accent-color); }
.premium-card:hover { border-color: var(--accent-dark); box-shadow: 0 20px 40px rgba(212, 175, 55, 0.2); }
.premium-card .product-badge { background: var(--accent-color); color: #000; }
.premium-card .buy-btn { background: var(--accent-color) !important; color: #000 !important; box-shadow: 0 8px 20px rgba(212, 175, 55, 0.3); }
.premium-card .buy-btn:hover { background: #b8941f !important; color: #fff !important; }

/* MODAL (SEPET) */
.modal-overlay { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(30, 53, 40, 0.8); z-index: 9999; justify-content: center; align-items: center; backdrop-filter: blur(3px); }
.modal-container { background: #fff; width: 90%; max-width: 500px; max-height: 85vh; border-radius: 16px; display: flex; flex-direction: column; animation: slideUp 0.3s ease-out; }
@keyframes slideUp { from { transform: translateY(50px); opacity: 0; } to { transform: translateY(0); opacity: 1; } }
.modal-header { padding: 1.2rem; border-bottom: 1px solid #eee; display: flex; justify-content: space-between; align-items: center; background: #f8f4e9; border-radius: 16px 16px 0 0; }
.modal-body { flex: 1; overflow-y: auto; padding: 1.5rem; }
.modal-footer { padding: 1.5rem; border-top: 1px solid #eee; border-radius: 0 0 16px 16px; }
.cart-item-modal { display: flex; align-items: center; gap: 1rem; padding-bottom: 1rem; border-bottom: 1px solid #eee; margin-bottom: 1rem; }
.cart-item-img { width: 60px; height: 60px; object-fit: cover; border-radius: 8px; }
.cart-summary { display: flex; justify-content: space-between; margin-bottom: 1rem; font-size: 1.1rem; font-weight: bold; }
.btn-continue { width: 100%; background: transparent; border: none; color: #666; margin-top: 10px; cursor: pointer; }

/* FOOTER */
.site-footer { background-color: var(--primary-dark); color: var(--white); padding: 3rem 0 2rem; margin-top: auto; border-top: 4px solid var(--accent-color); }
.footer-wrapper { display: flex; flex-direction: column; align-items: center; gap: 1.5rem; text-align: center; }
.footer-links { display: flex; gap: 1.5rem; flex-wrap: wrap; justify-content: center; }
.footer-links a:hover { color: var(--accent-color); }
.footer-socials { display: flex; gap: 1rem; }
.footer-socials a { width: 40px; height: 40px; border: 1px solid rgba(212,175,55,0.3); border-radius: 50%; display: flex; align-items: center; justify-content: center; color: var(--accent-color); }
.footer-info { border-top: 1px solid rgba(255,255,255,0.1); padding-top: 1.5rem; width: 100%; max-width: 600px; }

/* CHECKOUT */
.checkout-container { max-width: 1100px; margin: 3rem auto; display: grid; grid-template-columns: 1.5fr 1fr; gap: 2rem; padding: 0 1.5rem; }
.checkout-card { background: #fff; border-radius: 12px; padding: 2rem; box-shadow: var(--shadow-md); border: 1px solid #eee; }
.form-group { margin-bottom: 1.2rem; }
.form-group input, .form-group textarea { width: 100%; padding: 0.9rem; border: 1px solid #ccc; border-radius: 8px; }
.order-table { width: 100%; border-collapse: collapse; }
.order-table td { padding: 1rem 0; border-bottom: 1px solid #eee; }

/* Responsive */
@media (max-width: 768px) {
    .site-header .container { flex-direction: column; height: auto; padding: 1rem; }
    .main-navigation { flex-wrap: wrap; justify-content: center; margin-top: 1rem; }
    .checkout-container { grid-template-columns: 1fr; }
    .origin-content { flex-direction: column; text-align: center; }
    .origin-action { text-align: center; }
}

/* ORIGIN BANNER */
.origin-banner {
    background: linear-gradient(135deg, #1e3528 0%, #2c4c3b 100%); color: var(--white);
    padding: 3rem 0; margin-top: 4rem; border-top: 1px solid rgba(212, 175, 55, 0.3); border-bottom: 1px solid rgba(212, 175, 55, 0.1);
    position: relative;
}
.origin-content { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 2rem; }
.origin-icon { font-size: 2.5rem; color: var(--accent-color); background: rgba(255, 255, 255, 0.05); width: 80px; height: 80px; display: flex; align-items: center; justify-content: center; border-radius: 50%; border: 1px solid rgba(212, 175, 55, 0.3); flex-shrink: 0; }
.origin-text { flex: 1; min-width: 300px; }
.origin-text h3 { font-size: 1.6rem; margin-bottom: 0.5rem; color: var(--white); font-weight: 700; }
.origin-text p { color: #e0e0e0; margin-bottom: 0.3rem; font-size: 1.05rem; }
.origin-text .highlight { color: var(--accent-color); font-weight: bold; }
.origin-note { font-size: 0.9rem !important; font-style: italic; opacity: 0.7; margin-top: 5px; }
.origin-action { text-align: right; min-width: 250px; }
.address-text { font-size: 0.95rem; color: #ccc; margin-bottom: 10px; }
.map-btn-link { display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 10px 20px; border: 1px solid var(--accent-color); border-radius: 30px; color: var(--accent-color); text-decoration: none; font-size: 0.95rem; font-weight: 600; transition: all 0.3s ease; background: rgba(212, 175, 55, 0.05); }
.map-btn-link:hover { background: var(--accent-color); color: #1e3528; transform: translateY(-3px); box-shadow: 0 5px 15px rgba(212, 175, 55, 0.3); }

/* =========================================
   YENİ EKLENEN KODLAR (Fiyat Hizalaması - KESİN ÇÖZÜM)
========================================= */

/* Ürün Detay Modalı Fiyat Alanı */
#productDetailModal #pd-price {
    display: inline-flex !important; /* inline-flex ile sarmalanmasını engeller */
    align-items: baseline !important; /* Metin taban çizgisine göre hizalar */
    gap: 2px;                      /* Tutar ile sembol arasındaki boşluk */
    white-space: nowrap;           /* Asla alt satıra geçmemesini sağlar */
    line-height: 1;                /* Satır yüksekliğini sıfırlayarak dikey boşlukları kaldırır */
}

/* ₺ Sembolünün Kendisine Özel Ayar (Gerekirse) */
/* Fiyatın içindeki son öğe genellikle ₺ sembolü olur */
#productDetailModal #pd-price:last-child {
    position: relative;
    top: 0px; /* Gerekirse 1-2px yukarı/aşağı oynatmak için bu değeri değiştirin */
    margin: 0 !important;
    padding: 0 !important;
}

/* Eğer indirimli fiyat varsa, eski fiyatın (üstü çizili) hizasını ayarlar */
#productDetailModal #pd-price span[style*="text-decoration:line-through"] {
    align-self: baseline !important;
    margin-right: 8px;
}