/* =========================================================
   aliseriati.com — Başlık & Menü
   Beyribey Bilişim
   Ana menü sade tutulur; bütün bölümler sağdan açılan panelde.
   ========================================================= */

/* ---------- üst şerit ---------- */
.serit .kap{justify-content:space-between}
.tarih-serit{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ---------- başlık ---------- */
header.ust .kap{gap:1.25rem}
.ust-sag{display:flex;align-items:center;gap:.7rem;flex-shrink:0}
.ara-form{display:flex}
input.ara{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.13);color:#e6eaee;
  padding:.7rem .95rem;border-radius:var(--r);width:270px;font-size:15px;font-family:inherit;min-height:48px}
input.ara::placeholder{color:#95a0ab}
input.ara:focus{border-color:var(--altin-acik);outline:none;background:rgba(255,255,255,.1)}

/* ---------- hamburger (her ekranda görünür) ---------- */
.hamburger{display:inline-flex;align-items:center;gap:.65rem;height:48px;padding:0 1.05rem;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.16);border-radius:var(--r);
  color:#e6eaee;cursor:pointer;font-family:inherit;font-size:12.5px;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;transition:.16s}
.hamburger:hover{border-color:var(--altin-acik);color:var(--altin-acik);background:rgba(217,184,99,.1)}
.hamburger .cizgiler{display:grid;gap:4px;width:18px}
.hamburger .cizgiler i{display:block;height:1.5px;background:currentColor;border-radius:2px;transition:.16s}
.hamburger .cizgiler i:nth-child(2){width:13px;margin-left:auto}
.hamburger:hover .cizgiler i:nth-child(2){width:18px}
.hamburger[aria-expanded="true"] .cizgiler i:nth-child(2){width:18px}

/* ---------- ana menü: sade, taşmaz ---------- */
nav.menu{background:var(--murekkep);border-top:1px solid rgba(255,255,255,.07);position:sticky;top:0;z-index:40}
nav.menu .kap{display:flex;gap:0;align-items:stretch;justify-content:flex-start;
  overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
nav.menu .kap::-webkit-scrollbar{display:none}
nav.menu a{color:#c3cbd4;font-size:12.8px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;
  padding:1.05rem 1.1rem;white-space:nowrap;border-bottom:2px solid transparent;transition:.16s;
  min-height:48px;display:flex;align-items:center}
nav.menu a:first-child{padding-left:0}
nav.menu a:hover{color:#fff;background:rgba(255,255,255,.05)}
nav.menu a.aktif{color:var(--altin-acik);border-bottom-color:var(--altin-acik)}

/* ---------- sağdan açılan bölüm paneli ---------- */
.cekmece{position:fixed;inset:0;z-index:90;visibility:hidden}
.cekmece[data-acik="1"]{visibility:visible}
.cekmece .perde{position:absolute;inset:0;background:rgba(8,10,13,.66);opacity:0;transition:.24s;
  backdrop-filter:blur(2px)}
.cekmece[data-acik="1"] .perde{opacity:1}

.cekmece .panel{position:absolute;inset:0 0 0 auto;width:min(560px,92vw);background:var(--murekkep-2);
  transform:translateX(100%);transition:transform .26s cubic-bezier(.4,0,.2,1);
  display:flex;flex-direction:column;box-shadow:-24px 0 60px rgba(0,0,0,.4)}
.cekmece[data-acik="1"] .panel{transform:none}

.panel-bas{display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:1.35rem 1.6rem;border-bottom:1px solid rgba(255,255,255,.1)}
.panel-marka .ad{font-family:'Lora',serif;font-size:1.15rem;letter-spacing:.09em;color:#fff;display:block;line-height:1}
.panel-marka .alt{font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--altin-acik);
  margin-top:.4rem;display:block}
.panel .kapat{width:44px;height:44px;display:grid;place-items:center;background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.16);color:#e6eaee;border-radius:var(--r);cursor:pointer;transition:.16s}
.panel .kapat:hover{border-color:var(--altin-acik);color:var(--altin-acik)}

.panel-ara{display:flex;align-items:center;gap:.6rem;margin:1.1rem 1.6rem 0;padding:.75rem 1rem;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:var(--r);color:#8e99a5}
.panel-ara:focus-within{border-color:var(--altin-acik)}
.panel-ara input{flex:1;min-width:0;background:none;border:0;color:#e6eaee;font-family:inherit;font-size:15px;
  padding:.15rem 0;min-height:auto}
.panel-ara input::placeholder{color:#7d8792}
.panel-ara input:focus{outline:none}

.panel-govde{flex:1;overflow-y:auto;padding:1.5rem 1.6rem 1rem;scrollbar-width:thin}
.panel-grup{margin-bottom:1.9rem}
.panel-grup>h3{font-family:'Inter',sans-serif;font-size:10.5px;letter-spacing:.22em;text-transform:uppercase;
  color:var(--altin);font-weight:700;padding-bottom:.7rem;margin-bottom:.9rem;
  border-bottom:1px solid rgba(255,255,255,.1);display:flex;align-items:center;justify-content:space-between}
.panel-grup>h3 span{color:#6e7883;letter-spacing:.06em}

.bolum-izgara{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(255,255,255,.07)}
.bolum-izgara a{background:var(--murekkep-2);display:flex;align-items:center;justify-content:space-between;
  gap:.6rem;padding:.85rem .9rem;color:#c3cbd4;font-size:13.5px;line-height:1.35;transition:.14s;min-height:48px}
.bolum-izgara a:hover{background:rgba(217,184,99,.12);color:#fff}
.bolum-izgara a b{color:var(--altin);font-size:11.5px;font-weight:700;flex-shrink:0}
.bolum-izgara a:hover b{color:var(--altin-acik)}

.panel-liste{display:grid;grid-template-columns:1fr 1fr;gap:.15rem}
.panel-liste a{color:#c3cbd4;font-size:14px;padding:.65rem .5rem;border-radius:2px;transition:.14s;
  min-height:44px;display:flex;align-items:center}
.panel-liste a:hover{color:var(--altin-acik);background:rgba(255,255,255,.05)}

.panel-alt{display:flex;align-items:center;gap:.7rem;padding:1rem 1.6rem;
  border-top:1px solid rgba(255,255,255,.1);color:#6e7883;font-size:12px}
.panel-alt a{width:34px;height:34px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.14);
  border-radius:var(--r);color:#c3cbd4;transition:.14s}
.panel-alt a:hover{border-color:var(--altin);color:var(--altin-acik)}
.panel-alt span{margin-left:auto}

/* ---------- duyarlı ---------- */
@media(max-width:1100px){
  input.ara{width:200px}
}


@media(max-width:560px){
  .bolum-izgara,.panel-liste{grid-template-columns:1fr}
  .panel-bas,.panel-govde,.panel-alt{padding-left:1.15rem;padding-right:1.15rem}
  .panel-ara{margin-left:1.15rem;margin-right:1.15rem}
  .tarih-serit{font-size:12px}
}

/* ---------- canlı arama önerisi ---------- */
.ara-form,.panel-ara,.ara-buyuk{position:relative}
.oneri-kutu{position:absolute;left:0;right:0;top:calc(100% + .4rem);z-index:70;
  background:var(--yuzey);border:1px solid var(--cizgi);border-radius:var(--r);
  box-shadow:0 18px 46px -14px rgba(15,20,25,.45);overflow:hidden;max-height:60vh;overflow-y:auto}
.oneri-kutu[hidden]{display:none}
.oneri{display:flex;align-items:center;gap:.8rem;padding:.7rem .9rem;border-bottom:1px solid var(--cizgi);
  color:var(--metin);transition:.12s}
.oneri:last-child{border-bottom:0}
.oneri:hover,.oneri.etkin{background:var(--yuzey-2)}
.oneri-tur{flex:0 0 auto;font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;
  color:var(--altin);border:1px solid var(--cizgi);padding:.2rem .4rem;border-radius:2px;background:var(--yuzey-2)}
.oneri-tur.bolum{color:var(--zumrut);border-color:rgba(31,77,67,.35)}
.oneri-ic{min-width:0;display:block}
.oneri-ic b{display:block;font-size:14px;font-weight:600;line-height:1.35;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.oneri-ic span{display:block;font-size:11.5px;color:var(--metin-2);margin-top:.1rem;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ara-buyuk .oneri-kutu{top:calc(100% + .5rem)}

/* ---------- bölüm sayfasındaki serbest metin (Editörden, Kronoloji) ---------- */
.bolum-metni{background:var(--yuzey);border:1px solid var(--cizgi);padding:1.8rem 2rem;margin-bottom:2rem;
  font-family:'Lora',Georgia,serif;font-size:1.08rem;line-height:1.85;color:#252b31}
.bolum-metni table{width:100%;border-collapse:collapse;display:block;overflow-x:auto}
.bolum-metni td,.bolum-metni th{padding:.5rem .7rem;border-bottom:1px solid var(--cizgi);vertical-align:top}
.bolum-metni p{margin-bottom:1rem}
.bolum-metni strong{color:var(--altin)}
@media(max-width:600px){.bolum-metni{padding:1.2rem 1.1rem;font-size:1rem}}

/* =========================================================
   ANA MENÜ — MOBİL
   Sorun: flex öğeleri varsayılan olarak SIKIŞIR (flex-shrink:1).
   nowrap ile birleşince yazılar kutudan taşıp üst üste biniyordu.
   Çözüm: öğeler sıkışmaz (flex:0 0 auto) ve gerekirse alt satıra sarar.
   ========================================================= */
nav.menu a{flex:0 0 auto}

/* Mobilde uzun etiket yerine kısası görünür */
.m-kisa{display:none}

@media(max-width:1000px){
  nav.menu{display:block}       /* site.css'teki eski display:none kuralını ez */
}

@media(max-width:860px){
  .ara-form{display:none}
  .hamburger .etiket{display:none}
  .hamburger{width:48px;padding:0;justify-content:center}

  /* Tek satıra sığmayan öğeler ALT SATIRA GEÇER — kesilmez, üst üste binmez */
  nav.menu .kap{flex-wrap:wrap;overflow-x:visible;padding-right:0;
    row-gap:0;column-gap:0;border-top:1px solid rgba(255,255,255,.05)}
  nav.menu a{font-size:12.2px;letter-spacing:.05em;padding:.8rem .62rem;min-height:46px;
    border-bottom-width:2px}
  nav.menu a:first-child{padding-left:0}
  nav.menu::after{display:none}

  .m-uzun{display:none}
  .m-kisa{display:inline}
}

@media(max-width:600px){
  nav.menu a{font-size:11.8px;padding:.75rem .55rem;min-height:46px}
  .serit{font-size:12px}
  .serit .kap{height:36px}
  header.ust .kap{padding:1.1rem 0 1rem;gap:.8rem}
  .marka .ad{font-size:1.3rem}
  .marka .alt{font-size:10px;letter-spacing:.18em}
  .muhur{width:42px;height:42px;flex:0 0 42px}
}

/* ---------- arama önerisi: boş durum ve "tüm sonuçlar" satırı ---------- */
.oneri-bos{padding:.9rem;font-size:13.5px;color:var(--metin-2);text-align:center}
.oneri-tum{background:var(--yuzey-2);justify-content:space-between}
.oneri-tum b{font-size:13.5px;color:var(--altin);font-weight:600}
.oneri-tum:hover,.oneri-tum.etkin{background:var(--altin-acik)}
.oneri-tum:hover b,.oneri-tum.etkin b{color:#14181c}
.oneri-ok{color:var(--altin);font-weight:700;flex:0 0 auto}
.oneri-tum:hover .oneri-ok,.oneri-tum.etkin .oneri-ok{color:#14181c}
