/* =============================================================================
   DUVAN MED — Menü
   1) Hover renkleri: GP şablonu hover'da arka planı maviye boyuyor, yazı lacivert
      kalıyordu (okunmuyordu). Açık zemin + mavi yazı kullanılır.
   2) "Ürünlerimiz" mega menüsü (bkz. layout/_mega-menu.php)
   ============================================================================= */
@media (min-width: 1200px) {
  .navmenu .dropdown ul a:hover,
  .navmenu .dropdown ul .active:hover,
  .navmenu .dropdown ul li:hover > a { background-color: #eef5fb; color: var(--accent-color); }
}
@media (max-width: 1199px) {
  .navmenu a:hover,
  .navmenu .active,
  .navmenu .active:focus { background-color: #eef5fb; color: var(--accent-color); }
}

.navmenu .mega-panel a { white-space: normal; }
.mega-mobil { display: none; }

@media (min-width: 1200px) {
  .navmenu .dropdown.mega { position: static; }

  .navmenu .mega-panel {
    position: absolute; left: 12px; right: 12px; top: calc(100% - 4px);
    min-height: 520px; padding-bottom: 52px;
    background: #fff; border-radius: 18px; overflow: hidden;
    box-shadow: 0 24px 60px rgba(7, 29, 49, .28);
    visibility: hidden; opacity: 0; transform: translateY(10px); pointer-events: none;
    /* Kapanırken gecikme yok; görünmez panel fareyi yakalamasın */
    transition: opacity .15s, transform .15s, visibility 0s linear .15s; z-index: 999;
  }
  /* Açılış: fare menü başlığında kısa süre durunca (üzerinden geçerken yanlışlıkla açılmasın) */
  .navmenu .dropdown.mega:hover > .mega-panel,
  .navmenu .dropdown.mega:focus-within > .mega-panel {
    visibility: visible; opacity: 1; transform: none; pointer-events: auto;
    transition: opacity .18s ease .12s, transform .18s ease .12s, visibility 0s linear .12s;
  }

  /* Şablonun iç içe liste kurallarını mega paneldeki listelerde sıfırla.
     visibility "inherit" olmalı: "visible" verilirse gizli panelin içi görünmez hâlde
     fareyi yakalar ve sayfa kaydırılırken menü kendiliğinden açılır. */
  .navmenu .mega-panel ul {
    position: static; visibility: inherit; opacity: 1; display: block; margin: 0;
    box-shadow: none; border-radius: 0; background: none; min-width: 0; padding: 0; transition: none;
  }
  .navmenu .mega-panel li { padding: 0; min-width: 0; }
  .navmenu .mega-panel .mega-sekme { position: static; }
  .navmenu .mega-panel .mega-mobil { display: none; }
  .navmenu .mega-panel .mega-ikon i { font-size: 19px; }
  .navmenu .mega-panel .mega-ok { font-size: 13px; }
  .navmenu .mega-panel a,
  .navmenu .mega-panel a:focus,
  .navmenu .mega-panel li:last-child a { padding: 0; font-size: 14px; font-weight: 400; color: var(--default-color); display: flex; }
  .navmenu .mega-panel a i { margin: 0; font-size: inherit; line-height: 1; }
  .navmenu .mega-panel .mega-urun, .navmenu .mega-panel .mega-grup, .navmenu .mega-panel .mega-cipler a { justify-content: flex-start; text-align: left; }
  .navmenu .mega-panel .mega-tumu, .navmenu .mega-panel .mega-alt a { justify-content: flex-start; }

  /* Sol: ana gruplar */
  .navmenu .mega-panel .mega-sekmeler {
    width: 300px; min-height: 468px; padding: 18px 14px; background: #f4f8fb; border-right: 1px solid var(--duvan-cizgi);
  }
  .navmenu .mega-panel .mega-sekme-baslik {
    align-items: center; gap: 12px; padding: 12px; border-radius: 12px; margin-bottom: 4px; color: var(--duvan-lacivert);
    transition: background .15s, box-shadow .15s;
  }
  .navmenu .mega-panel .mega-sekme-metin { flex: 1; line-height: 1.3; }
  .navmenu .mega-panel .mega-sekme-metin strong { display: block; font-size: 15px; font-weight: 600; font-family: var(--heading-font); }
  .navmenu .mega-panel .mega-sekme-metin small { color: #7a8894; font-size: 12px; }
  .navmenu .mega-panel .mega-ikon {
    width: 40px; height: 40px; flex: none; border-radius: 10px; display: flex; align-items: center; justify-content: center;
    background: #e1eefa; color: var(--accent-color); font-size: 19px;
  }
  .navmenu .mega-panel .mega-ok { color: #b6c4d0; font-size: 13px; }
  .navmenu .mega-sekmeler:not(:hover) .mega-sekme:first-child > .mega-sekme-baslik,
  .navmenu .mega-panel .mega-sekme:hover > .mega-sekme-baslik {
    background: #fff; box-shadow: 0 6px 18px rgba(11, 47, 79, .08); color: var(--accent-color);
  }
  .navmenu .mega-sekmeler:not(:hover) .mega-sekme:first-child .mega-ok,
  .navmenu .mega-panel .mega-sekme:hover .mega-ok { color: var(--accent-color); }

  /* Sağ: seçili grubun içeriği */
  .navmenu .mega-panel .mega-icerik {
    display: none; position: absolute; left: 300px; right: 0; top: 0; bottom: 52px; padding: 22px 26px; overflow-y: auto;
  }
  .navmenu .mega-sekmeler:not(:hover) .mega-sekme:first-child .mega-icerik,
  .navmenu .mega-panel .mega-sekme:hover .mega-icerik { display: block; }

  .navmenu .mega-icerik-ust {
    display: flex; justify-content: space-between; align-items: flex-start; gap: 20px;
    padding-bottom: 14px; margin-bottom: 16px; border-bottom: 1px solid var(--duvan-cizgi);
  }
  .navmenu .mega-icerik-ust h3 { font-size: 19px; font-weight: 700; margin: 0 0 4px; color: var(--duvan-lacivert); }
  .navmenu .mega-icerik-ust p { font-size: 13px; color: #6b7883; margin: 0; max-width: 520px; }
  .navmenu .mega-panel .mega-tumu { color: var(--accent-color); font-weight: 600; white-space: nowrap; gap: 6px; align-items: center; }

  .navmenu .mega-cipler { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
  .navmenu .mega-panel .mega-cipler a {
    padding: 6px 12px; border-radius: 50px; background: #eef5fb; color: var(--duvan-lacivert); font-weight: 500; font-size: 13px; gap: 6px;
  }
  .navmenu .mega-cipler a em { font-style: normal; color: #7a8894; }
  .navmenu .mega-panel .mega-cipler a:hover { background: var(--accent-color); color: #fff; }
  .navmenu .mega-panel .mega-cipler a:hover em { color: #d9ecfb; }

  .navmenu .mega-urunler { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .navmenu .mega-gruplar { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
  .navmenu .mega-panel .mega-urun,
  .navmenu .mega-panel .mega-grup {
    align-items: center; gap: 12px; padding: 8px 10px; border: 1px solid var(--duvan-cizgi); border-radius: 12px; line-height: 1.3;
    transition: border-color .15s, background .15s;
  }
  .navmenu .mega-panel .mega-urun img { width: 64px; height: 64px; flex: none; object-fit: contain; border-radius: 8px; background: #fff; }
  .navmenu .mega-grup-resim {
    width: 48px; height: 48px; flex: none; border-radius: 8px; background: #fff; border: 1px solid #eef2f6;
    display: flex; align-items: center; justify-content: center; overflow: hidden; color: var(--accent-color); font-size: 20px;
  }
  .navmenu .mega-grup-resim img { width: 100%; height: 100%; object-fit: contain; transform: scale(1.35); }
  .navmenu .mega-urun strong, .navmenu .mega-grup strong { display: block; font-size: 13px; font-weight: 600; color: var(--duvan-lacivert); }
  .navmenu .mega-urun small, .navmenu .mega-grup small { font-size: 12px; color: #7a8894; }
  .navmenu .mega-panel .mega-urun:hover,
  .navmenu .mega-panel .mega-grup:hover { border-color: var(--accent-color); background: #f5faff; }
  .navmenu .mega-panel .mega-urun:hover strong,
  .navmenu .mega-panel .mega-grup:hover strong { color: var(--accent-color); }

  .navmenu .mega-bos { text-align: center; padding: 40px 20px; color: #6b7883; }
  .navmenu .mega-bos > i { font-size: 44px; color: var(--accent-color); }
  .navmenu .mega-panel .mega-bos .btn-ana { display: inline-flex; padding: 10px 22px; color: #fff; }

  /* Alt şerit */
  .navmenu .mega-alt {
    position: absolute; left: 0; right: 0; bottom: 0; height: 52px; display: flex; align-items: center; gap: 26px;
    padding: 0 22px; background: var(--duvan-lacivert);
  }
  .navmenu .mega-panel .mega-alt a { color: rgba(255, 255, 255, .85); gap: 8px; align-items: center; font-weight: 500; }
  .navmenu .mega-panel .mega-alt a:hover { color: #5cc2ff; }
  .navmenu .mega-panel .mega-alt .mega-alt-vurgu { margin-left: auto; color: #5cc2ff; }
}

@media (max-width: 1199px) {
  .navmenu .mega-sekmeler,
  .navmenu .mega-alt { display: none !important; }
  .navmenu .dropdown > .mega-panel { display: none; margin: 6px 20px; border: 1px solid var(--duvan-cizgi); border-radius: 8px; }
  .navmenu .dropdown > .mega-panel.dropdown-active { display: block; }
  .navmenu .mega-panel .mega-mobil {
    display: block; position: static; inset: auto; box-shadow: none; margin: 0; padding: 6px 0; border: 0; background: none;
  }
  .navmenu .mega-mobil a { font-size: 15px; padding: 8px 16px; }
  .navmenu .mega-mobil li.alt a { font-size: 14px; padding: 6px 16px 6px 32px; font-weight: 400; color: #4e5b66; }
}