/* ═══════════════════════════════════════════════════════════
   MTA ELEKTRİK — KAPSAMLI DÜZELTME PAKETI
   ═══════════════════════════════════════════════════════════ */

/* ── 1. HEADER BOŞLUK — KESİN ÇÖZÜM ───────────────────────
   #mta-main padding-top = 0
   İlk çocuk eleman kendi padding ile header+ticker'ı aşar  */
#mta-main { padding-top: 0 !important; margin-top: 0 !important; }

/* İlk içerik: banner veya mağaza banner */
.banner-wrap        { padding-top: 94px; }   /* 64+30 */
.mta-shop-banner    { padding-top: 94px; }
@media (max-width: 768px) {
  .banner-wrap      { padding-top: 86px; }   /* 56+30 */
  .mta-shop-banner  { padding-top: 86px; }
}
/* Admin bar: WP zaten html{margin-top} uygular, biz sadece
   header/ticker'ı kaydırıyoruz — main'e dokunmuyoruz */
.admin-bar #mta-header { top: 32px; }
.admin-bar #mta-ticker { top: 96px !important; }
@media screen and (max-width: 782px) {
  .admin-bar #mta-header { top: 46px; }
  .admin-bar #mta-ticker { top: 102px !important; }
}

/* ── 2. MOBİL TAŞMA — KESİN ÇÖZÜM ─────────────────────────  */
html, body { max-width: 100%; overflow-x: hidden; }
@media (max-width: 768px) {
  * { max-width: 100%; }
  img, video, iframe { max-width: 100% !important; }
  body { padding-bottom: 80px; }
  /* Header kompakt */
  #mta-header .header-inner { padding: 0 10px !important; gap: 8px !important; }
  .header-logo-text { font-size: 15px !important; }
  .header-logo-icon { width: 34px !important; height: 34px !important; }
  #btn-ai-open { display: none; }
  /* Grid taşmayı önle */
  .products-grid { grid-template-columns: repeat(2,1fr) !important; gap: 10px !important; }
  .cats-grid { grid-template-columns: repeat(3,1fr) !important; }
  .trust-bar-inner { gap: 12px; padding: 0 12px; }
  /* Tüm container'lar tam genişlik */
  .banner-wrap, .cats-section, .shop-toolbar, .products-section,
  .trust-bar-inner, .page-container, .breadcrumb-inner { 
    padding-left: 12px !important; padding-right: 12px !important; 
    max-width: 100% !important; width: 100% !important;
  }
  /* Banner */
  .banner-slider { height: 200px !important; border-radius: 14px !important; }
  .banner-title  { font-size: 22px !important; }
  .banner-content { padding: 0 16px !important; }
  /* Dock gizle */
  #mta-dock { display: none !important; }
}

/* ── 3. WooCommerce WRAPPER SIFIRLA ────────────────────────  */
.mta-woo-wrap { margin: 0 !important; padding: 0 !important; }
.woocommerce-notices-wrapper { min-height: 0 !important; margin: 0 !important; padding: 0 !important; }

/* ── 4. MOBİL BOTTOM NAV ───────────────────────────────────  */
@media (max-width: 768px) {
  #mobile-bottom-nav { display: block !important; }
  #scroll-to-top { bottom: 90px !important; right: 16px !important; }
}

/* ── 5. GÜVEN BAR — HEADER ÜSTÜ ───────────────────────────  */
#mta-trust-topbar {
  background: #0f172a;
  padding: 5px 16px;
  display: flex; align-items: center; justify-content: center;
  gap: 24px; flex-wrap: wrap;
  font-size: 9px; font-weight: 700;
  color: rgba(255,255,255,0.7);
  text-transform: uppercase; letter-spacing: 1.5px;
  position: fixed; top: 0; left: 0; right: 0;
  z-index: 501; height: 28px;
}
#mta-trust-topbar span { display: flex; align-items: center; gap: 5px; }
@media (max-width: 480px) { #mta-trust-topbar { display: none; } }

/* Header'ı trust bar kadar aşağı kaydır (trust bar varsa) */
body.has-trust-bar #mta-header        { top: 28px; }
body.has-trust-bar #mta-ticker        { top: 92px; }  /* 28+64 */
body.has-trust-bar .banner-wrap       { padding-top: 122px; }  /* 28+64+30 */
body.has-trust-bar .mta-shop-banner   { padding-top: 122px; }
body.has-trust-bar.admin-bar #mta-header { top: 60px; }  /* 28+32 */
body.has-trust-bar.admin-bar #mta-ticker { top: 124px; } /* 28+32+64 */
@media (max-width: 768px) {
  body.has-trust-bar .banner-wrap     { padding-top: 114px; } /* 28+56+30 */
  body.has-trust-bar .mta-shop-banner { padding-top: 114px; }
}
@media (max-width: 480px) {
  /* Trust bar gizlendi, normal padding */
  body.has-trust-bar #mta-header        { top: 0; }
  body.has-trust-bar #mta-ticker        { top: 56px; }
  body.has-trust-bar .banner-wrap       { padding-top: 86px; }
  body.has-trust-bar .mta-shop-banner   { padding-top: 86px; }
}

/* ── 6. FOOTER GÜÇLENDİRME ────────────────────────────────  */
#mta-footer {
  background: #0f172a;
  color: rgba(255,255,255,0.8);
  padding: 48px 16px 24px;
  margin-top: 48px;
}
.footer-grid {
  max-width: 1280px; margin: 0 auto;
  display: grid; grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 40px; margin-bottom: 40px;
}
@media (max-width: 768px) {
  .footer-grid { grid-template-columns: 1fr 1fr; gap: 24px; }
}
@media (max-width: 480px) {
  .footer-grid { grid-template-columns: 1fr; gap: 20px; }
}
.footer-brand-logo {
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 16px;
}
.footer-brand-logo-icon {
  width: 40px; height: 40px; background: var(--color-primary);
  border-radius: 10px; display: flex; align-items: center; justify-content: center;
}
.footer-brand-name {
  font-size: 20px; font-weight: 900; color: #fff;
  font-style: italic; letter-spacing: -0.5px;
}
.footer-brand-desc {
  font-size: 12px; line-height: 1.7; color: rgba(255,255,255,0.5);
  margin-bottom: 20px; max-width: 280px;
}
.footer-contact-item {
  display: flex; align-items: flex-start; gap: 10px;
  font-size: 11px; color: rgba(255,255,255,0.6);
  margin-bottom: 10px; line-height: 1.5;
}
.footer-contact-item svg { flex-shrink: 0; margin-top: 2px; opacity: 0.6; }
.footer-col-title {
  font-size: 10px; font-weight: 900; color: #fff;
  text-transform: uppercase; letter-spacing: 2px;
  margin-bottom: 16px; padding-bottom: 8px;
  border-bottom: 1px solid rgba(255,255,255,0.1);
}
.footer-link {
  display: block; font-size: 11px; color: rgba(255,255,255,0.5);
  text-decoration: none; margin-bottom: 8px;
  transition: color 0.2s;
}
.footer-link:hover { color: var(--color-primary); }
.footer-hours-item {
  display: flex; justify-content: space-between;
  font-size: 11px; color: rgba(255,255,255,0.5);
  margin-bottom: 6px;
}
.footer-hours-item span:last-child { color: rgba(255,255,255,0.8); font-weight: 700; }
.footer-bottom {
  max-width: 1280px; margin: 0 auto;
  padding-top: 24px; border-top: 1px solid rgba(255,255,255,0.08);
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 16px;
}
.footer-copyright { font-size: 10px; color: rgba(255,255,255,0.3); }
.footer-payment-logos {
  display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
}
.footer-payment-badge {
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 6px; padding: 4px 10px;
  font-size: 9px; font-weight: 900;
  color: rgba(255,255,255,0.5);
  text-transform: uppercase; letter-spacing: 1px;
}
.footer-cert-row {
  display: flex; align-items: center; gap: 8px; margin-top: 16px; flex-wrap: wrap;
}
.footer-cert-badge {
  display: flex; align-items: center; gap: 5px;
  background: rgba(255,255,255,0.05); border-radius: 8px;
  padding: 6px 12px; font-size: 9px; font-weight: 900;
  color: rgba(255,255,255,0.4); text-transform: uppercase; letter-spacing: 1px;
}

/* ── 7. WHATSAPP BUTONU ────────────────────────────────────  */
#mta-whatsapp-btn {
  position: fixed; bottom: 90px; right: 16px; z-index: 435;
  width: 48px; height: 48px; border-radius: 50%;
  background: #25d366; color: #fff; border: none;
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; text-decoration: none;
  box-shadow: 0 4px 16px rgba(37,211,102,0.4);
  transition: transform 0.2s, box-shadow 0.2s;
  animation: bounceIn 0.5s 1s both;
}
#mta-whatsapp-btn:hover { transform: scale(1.1); box-shadow: 0 8px 24px rgba(37,211,102,0.5); }
@media (min-width: 769px) {
  #mta-whatsapp-btn { bottom: 32px; right: 90px; }
}

/* ── 8. NEDEN BİZİ SEÇİN BÖLÜMÜ ───────────────────────────  */
.mta-why-section {
  background: var(--bg-card);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  padding: 48px 16px;
  margin: 32px 0;
}
.mta-why-inner { max-width: 1280px; margin: 0 auto; }
.mta-why-title {
  text-align: center; font-size: 26px; font-weight: 900;
  color: var(--text-main); letter-spacing: -1px;
  margin: 0 0 8px;
}
.mta-why-sub {
  text-align: center; font-size: 13px; color: var(--text-muted);
  margin: 0 0 40px; max-width: 500px; margin-left: auto; margin-right: auto;
}
.mta-why-grid {
  display: grid; grid-template-columns: repeat(4,1fr); gap: 24px;
}
@media (max-width: 768px) {
  .mta-why-grid { grid-template-columns: repeat(2,1fr); gap: 16px; }
}
@media (max-width: 400px) {
  .mta-why-grid { grid-template-columns: 1fr; }
}
.mta-why-card {
  text-align: center; padding: 24px 16px;
  background: var(--bg-app); border-radius: 16px;
  border: 1px solid var(--border);
  transition: all 0.2s;
}
.mta-why-card:hover {
  border-color: var(--color-primary);
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(var(--color-primary-rgb),0.1);
}
.mta-why-icon {
  width: 52px; height: 52px; border-radius: 14px;
  background: var(--color-primary-light);
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 16px; font-size: 24px;
}
.mta-why-card-title { font-size: 13px; font-weight: 900; color: var(--text-main); margin-bottom: 6px; }
.mta-why-card-desc  { font-size: 11px; color: var(--text-muted); line-height: 1.6; }

/* ── 9. ÜRÜN SAYFASI İYİLEŞTİRME ──────────────────────────  */
.mta-purchase-count {
  display: flex; align-items: center; gap: 6px;
  font-size: 10px; font-weight: 700; color: #f97316;
  background: rgba(249,115,22,0.08);
  border: 1px solid rgba(249,115,22,0.2);
  padding: 4px 10px; border-radius: 20px;
  width: fit-content;
}
.mta-cargo-today {
  display: flex; align-items: center; gap: 6px;
  font-size: 10px; font-weight: 700; color: #10b981;
  background: rgba(16,185,129,0.08);
  border: 1px solid rgba(16,185,129,0.2);
  padding: 4px 10px; border-radius: 20px;
  width: fit-content;
}
.mta-expert-box {
  background: linear-gradient(135deg, #0f172a, #1e293b);
  border-radius: 14px; padding: 16px;
  border: 1px solid rgba(99,102,241,0.2);
}
.mta-expert-title {
  font-size: 9px; font-weight: 900; color: var(--color-primary);
  text-transform: uppercase; letter-spacing: 2px; margin-bottom: 8px;
}
.mta-expert-text { font-size: 11px; color: rgba(255,255,255,0.7); line-height: 1.6; margin: 0; }

/* ── 10. PDF DÖKÜMAN ALANI ─────────────────────────────────  */
.mta-doc-box {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius-card); overflow: hidden;
}
.mta-doc-header {
  padding: 10px 14px; border-bottom: 1px solid var(--border);
  display: flex; align-items: center; gap: 8px;
}
.mta-doc-header span {
  font-size: 9px; font-weight: 900; color: var(--text-main);
  text-transform: uppercase; letter-spacing: 2px;
}
.mta-doc-item {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 14px; border-bottom: 1px solid var(--border);
  text-decoration: none; color: inherit;
  transition: background 0.15s;
}
.mta-doc-item:hover { background: var(--bg-input); }
.mta-doc-item:last-child { border-bottom: none; }
.mta-doc-icon {
  width: 32px; height: 32px; background: rgba(239,68,68,0.1);
  border-radius: 8px; display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.mta-doc-name { font-size: 11px; font-weight: 700; color: var(--text-main); flex: 1; }
.mta-doc-size { font-size: 9px; color: var(--text-muted); }
.mta-doc-download {
  font-size: 9px; font-weight: 900; color: var(--color-primary);
  text-transform: uppercase; letter-spacing: 1px;
}

/* ── 11. BLOG ALANI ────────────────────────────────────────  */
.mta-blog-section { max-width: 1280px; margin: 32px auto; padding: 0 16px 32px; }
.mta-blog-title {
  font-size: 22px; font-weight: 900; color: var(--text-main);
  letter-spacing: -0.5px; margin: 0 0 20px;
}
.mta-blog-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 20px; }
@media (max-width: 768px) { .mta-blog-grid { grid-template-columns: 1fr; } }
.mta-blog-card {
  background: var(--bg-card); border: 1px solid var(--border);
  border-radius: var(--radius-card); overflow: hidden;
  text-decoration: none; color: inherit; display: block;
  transition: all 0.2s;
}
.mta-blog-card:hover {
  border-color: var(--color-primary);
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(var(--color-primary-rgb),0.1);
}
.mta-blog-img {
  width: 100%; height: 160px; object-fit: cover;
  background: var(--bg-input);
}
.mta-blog-body { padding: 16px; }
.mta-blog-cat {
  font-size: 8px; font-weight: 900; color: var(--color-primary);
  text-transform: uppercase; letter-spacing: 2px; margin-bottom: 6px;
}
.mta-blog-post-title {
  font-size: 14px; font-weight: 900; color: var(--text-main);
  line-height: 1.4; margin-bottom: 8px;
}
.mta-blog-excerpt { font-size: 11px; color: var(--text-muted); line-height: 1.6; }
.mta-blog-date { font-size: 9px; color: var(--text-muted); margin-top: 10px; }

/* ── 12. ÜRÜN KARTINDA EKSİK DÜZELTME ─────────────────────  */
.product-card { cursor: pointer; }
.product-card a.product-name {
  display: block; text-decoration: none; color: inherit;
}
/* Resim orantısı mobilde */
@media (max-width: 768px) {
  .product-card-img-wrap { height: 160px !important; }
}

/* ── 13. SATIN ALMA BAR — MOBİL ─────────────────────────── */
#sticky-cart-bar {
  display: none;
}
@media (max-width: 768px) {
  body.single-product #sticky-cart-bar,
  body.mta-product    #sticky-cart-bar {
    display: flex;
    position: fixed;
    bottom: 65px; left: 0; right: 0;
    z-index: 430;
    background: var(--bg-card);
    border-top: 1px solid var(--border);
    padding: 10px 16px;
    gap: 10px; align-items: center;
    box-shadow: 0 -4px 20px rgba(0,0,0,0.1);
  }
  .sticky-price {
    flex: 1; font-size: 18px; font-weight: 900;
    color: var(--text-main); letter-spacing: -1px;
  }
  .sticky-add-btn {
    flex: 2; height: 48px;
    background: var(--color-primary); color: #fff;
    border: none; border-radius: 12px;
    font-size: 13px; font-weight: 900;
    cursor: pointer; display: flex;
    align-items: center; justify-content: center; gap: 8px;
    box-shadow: 0 4px 14px rgba(var(--color-primary-rgb),0.4);
    font-family: inherit;
  }
  .sticky-add-btn:disabled {
    background: #e2e8f0; color: #94a3b8;
    box-shadow: none; cursor: not-allowed;
  }
}

/* ── 14. KATEGORİLER TAŞMA ─────────────────────────────────  */
.cats-section { overflow: hidden; }
.cats-section h2 {
  white-space: nowrap; overflow: hidden;
  text-overflow: ellipsis; max-width: 100%;
}

/* ── 15. MAĞAZA BANNER ─────────────────────────────────────  */
.mta-shop-banner {
  padding-left: 16px; padding-right: 16px;
  padding-bottom: 0;
}
@media (max-width: 768px) {
  .mta-shop-banner h1 { font-size: 18px !important; }
}