/* Haritayı Aç ve gündem kutusunu genişletme (5 Kasım, kullanıcının fikri; js/harita-genis.js, js/ana-sayfa.js). */

/* Bandın altındaki dil: sayfanın zemin renginde, banttan kesilmiş gibi; haritanın ortasında, soldaki yazılara binmez. Perde inerken bandın kenarıyla birlikte iner */
.harita-tut{position:absolute;left:max(calc(71% - 62px),calc(max(0px,(100% - 1300px)/2) + 676px));bottom:0;z-index:4;display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 14px 0 11px;border-radius:12px 12px 0 0;background:var(--zemin);color:var(--acc);font-weight:700;font-size:13px;text-decoration:none;white-space:nowrap;box-shadow:0 -2px 8px rgba(15,17,21,.14);transition:height .15s ease,left .45s cubic-bezier(.22,.8,.24,1)}
.harita-tut:hover{height:35px}
.bant.genis .harita-tut{left:calc(var(--hg-sol,42%) + (100% - var(--hg-sol,42%))/2 - 67px)}
body.cz-genis .harita-tut{display:none}   /* çözüm alanı açıkken bandın üstüne biner, dil başlığın üstünde kalıyordu */
.harita-tut .ti{font-size:16px}

/* Haritayı Aç: bandın kendisi aşağı uzar, gündem aşağı itilir */
.bant.hg-gecis{transition:height .45s cubic-bezier(.22,.8,.24,1)}
.bant-harita.hg-gecis{transition:margin-bottom .45s cubic-bezier(.22,.8,.24,1),clip-path .45s cubic-bezier(.22,.8,.24,1)}

.bant-harita .leaflet-tile-pane{transition:filter .5s ease}
/* Lacivertten haritaya geçiş tek parça (5 Kasım, kullanıcı: "çok sert"): kapalı bandın geçişi sola kayıp daralır, solundaki lacivert (kenarlık) haritanın genişleyen kısmını örter.
   Ayrı geçiş ve kırpmayla açılıp kapanırken dikey çizgi görünüyordu. Ölçüler --hg-sol, --hg-gw: harita-genis.js */
@media (min-width:861px){
  .bant.genis::after,.bant.hg-gecis::after{box-sizing:content-box;right:auto;left:calc(var(--hg-sol) - 3000px);width:var(--hg-gw);border-left:3000px solid #1E3A5F}
  .bant.hg-gecis::after{transition:left .45s cubic-bezier(.22,.8,.24,1),width .45s cubic-bezier(.22,.8,.24,1)}
}
.bant.genis .bant-harita{background:#DDE4E8}   /* kareler gelirken zemin lacivert değil, harita rengine yakın */
html[data-tema=gece] .bant.genis .bant-harita{background:#2A4466}
.bant.genis .bant-harita .leaflet-tile-pane{filter:saturate(.72) contrast(1.02)}
html[data-tema=gece] .bant.genis .bant-harita .leaflet-tile-pane{filter:saturate(.6) brightness(.82) contrast(1.05)}
.bant.genis .hareket{display:none}
.bant.genis .harita-ac{display:none}
.bant.genis .bant-harita .av-pin i{inset:5px;border-width:2.5px}
.bant.genis .av-pin.sinyal::after{display:none}
.bant-harita .av-pin-kap.leaflet-interactive{cursor:pointer}
@media (min-width:861px){
  /* Harita açılınca bilgiler sola yanaşır (5 Kasım, kullanıcı); kayma payı --hg-kay: harita-genis.js */
  .bant-sol{transition:transform .45s cubic-bezier(.22,.8,.24,1)}
  .bant.genis .bant-sol{gap:6px 18px;transform:translateX(calc(-1 * var(--hg-kay,0px)))}
  .bant.genis .olcek{margin:0}
  .bant.genis .yer-ust{margin-top:-2px}
  .bant.genis .sayilar{margin-top:6px}
}
/* Yazılar lacivertte kalsın, haritaya binmesin: sığmayan ölçek düğmeleri adın altına geçer, dar ekranda sayılar yerini listeye bırakır */
@media (min-width:1300px){.bant.genis .bant-sol{max-width:520px}}
@media (min-width:861px) and (max-width:1299px){.bant.genis .bant-sol{max-width:calc(42vw - 28px)}}
@media (min-width:861px) and (max-width:1180px){.bant.genis .sayilar{display:none}}
.hg-ic{position:absolute;inset:0;z-index:3;pointer-events:none}
.hg-kapat{display:none}
.hg-panel{position:absolute;left:24px;top:var(--hg-ust,190px);bottom:18px;display:flex;flex-direction:column;width:min(500px,calc(42% - 44px));border-radius:var(--r);background:var(--kart);color:var(--ink);box-shadow:var(--golge-b);overflow:hidden;pointer-events:auto;animation:hg-gir .36s .12s cubic-bezier(.22,.8,.24,1) both}
@keyframes hg-gir{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.hg-ust{padding:10px 10px 6px}
.hg-ad{display:none}
.hg-filtre{margin:0}
.hg-filtre em{min-width:20px;padding:0 6px;border-radius:10px;background:var(--line);color:var(--ink2);font-size:12px;font-style:normal;text-align:center}
.hg-liste{flex:1;min-height:0;margin:0;padding:2px 8px 8px;list-style:none;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
.hg-liste .bos-yazi{padding:18px 10px;text-align:center}
.hg-sat{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;border-radius:12px;transition:background .15s ease}
.hg-sat:hover{background:var(--soft)}
.hg-sat[aria-current=true]{background:var(--soft-acc)}
.hg-sec{display:grid;grid-template-columns:54px minmax(0,1fr);align-items:center;gap:10px;min-width:0;padding:7px;border:0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}
.hg-kucuk{display:grid;place-items:center;width:54px;height:54px;border-radius:10px;background:var(--soft);color:var(--mut);font-size:22px;overflow:hidden}
.hg-kucuk img{width:100%;height:100%;object-fit:cover}
.hg-sat-ic{display:flex;flex-direction:column;gap:3px;min-width:0}
.hg-sat-ic b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-weight:800;font-size:14.5px;line-height:1.25}
.hg-sat-ic small{display:flex;flex-wrap:wrap;gap:2px 10px;color:var(--mut);font-size:12.5px}
.hg-sat-ic small span{display:inline-flex;align-items:center;gap:3px}
.hg-sat-ic small .ti{font-size:14px}
.hg-git{display:grid;place-items:center;width:32px;height:54px;color:var(--mut);font-size:19px;text-decoration:none}
.hg-git:hover{color:var(--acc)}
.hg-isaret{display:flex;flex-wrap:wrap;gap:5px 9px;padding:9px 14px 10px;border-top:1px solid var(--line);color:var(--ink2);font-size:12px;font-weight:600}
.hg-isaret>span{display:inline-flex;align-items:center;gap:4px}
.hg-isaret .av-pin{flex:none;width:18px;height:18px}
.hg-isaret .av-pin i{inset:3px;border-width:2px}
.hg-isaret .harita-bulusma{flex:none;display:block;width:20px;height:20px}
.hg-isaret .harita-bulusma img{width:20px;height:20px;padding:2px;border-width:2px;box-shadow:0 1px 3px rgba(0,0,0,.3)}
.hg-isaret .harita-resmi{flex:none;width:20px;height:20px;border-width:2px;font-size:11px}
.hg-isaret small{width:100%;color:var(--mut);font-size:12px;font-weight:400}
.bant.genis .leaflet-control-zoom{margin:14px 14px 0 0;border:0;box-shadow:var(--golge-b)}
.bant.genis .leaflet-control-zoom a{width:36px;height:36px;border-color:var(--line);background:var(--kart);color:var(--ink);font-size:21px;line-height:34px}
.av-pin.secili i{box-shadow:0 0 0 4px rgba(30,58,95,.38),0 2px 6px rgba(0,0,0,.35)}
html[data-tema=gece] .av-pin.secili i{box-shadow:0 0 0 4px rgba(142,197,255,.55),0 2px 6px rgba(0,0,0,.35)}
.hg-popup .leaflet-popup-content-wrapper{padding:0;border-radius:16px;background:var(--kart);color:var(--ink);box-shadow:var(--golge-b);overflow:hidden}
.hg-popup .leaflet-popup-content{width:290px!important;margin:0;font:400 14px/1.4 var(--ff)}
.hg-popup .leaflet-popup-tip{background:var(--kart)}
.hg-popup a.leaflet-popup-close-button{top:8px;right:8px;width:28px;height:28px;border-radius:50%;background:rgba(15,23,42,.62);color:#fff;font:400 18px/27px var(--ff)}
.hg-foto{position:relative;display:block;height:158px;background:var(--soft)}
.hg-foto img{width:100%;height:100%;object-fit:cover}
.hg-foto .rozet{position:absolute;left:10px;bottom:10px;box-shadow:0 1px 4px rgba(0,0,0,.15)}
.hg-kart-ic{display:flex;flex-direction:column;gap:6px;padding:12px 14px 14px}
.hg-kart h3{margin:0;font-size:16.5px;font-weight:800;line-height:1.25}
.hg-kart h3 a{color:inherit;text-decoration:none}
.hg-kart h3 a:hover{text-decoration:underline;text-underline-offset:3px}
.leaflet-popup-content .hg-kart p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin:0;color:var(--ink2);font-size:13.5px;line-height:1.4}
.leaflet-popup-content .hg-kart .hg-sayi{display:flex;flex-wrap:wrap;gap:2px 10px;color:var(--mut);font-size:12.5px}
.hg-sayi span{display:inline-flex;align-items:center;gap:3px}
.hg-sayi .ti{font-size:14px}
.hg-eylem{display:flex;align-items:center;gap:6px;margin-top:4px}
.hg-eylem .oy-btn:not(.kare){flex:1;justify-content:center;min-width:0;height:38px;padding:0 8px;font-size:13px}
.hg-eylem .oy-btn b{font-size:14px}
.hg-kart .btn.cizgi{flex:none;height:38px;color:var(--ink);text-decoration:none}
.hg-eylem:not(:has(.oy-btn)) .btn{flex:1;justify-content:center}
.hg-eylem:has(.oy-btn) .btn{justify-content:center;width:38px;padding:0}   /* oy düğmesindeki sayı kesilmesin */
.hg-eylem:has(.oy-btn) .btn span{display:none}
#bk-oy>.btn.genis{margin-top:8px}

/* Genişlet: kutunun başlığında sessiz bir simge; basınca kutu yana açılır, öbür gündem kaybolmaz, dar hâliyle yan sütunun başına geçer */
.kutu-gen{display:inline-flex;align-items:center;justify-content:center;gap:5px;flex:none;width:32px;height:32px;margin-left:auto;border-radius:9px;background:rgba(255,255,255,.14);color:#fff;font-weight:700;font-size:13px;text-decoration:none;transition:background .15s ease}
.kutu-gen:hover{background:rgba(255,255,255,.26)}
.kutu-gen .ti{font-size:17px}
.kutu-gen+.kutu-btn{margin-left:8px}
.kutu-gen.daralt{width:auto;padding:0 12px 0 9px}
.dar-kutu{border-radius:var(--r);background:var(--kart);box-shadow:var(--golge);overflow:hidden}
.dar-ust{display:flex;align-items:center;gap:8px;padding:10px 10px 10px 14px;color:#fff}
.dar-ust.kirmizi{background:#C62828}
.dar-ust.lacivert{background:#1E3A5F}
.dar-ust>.ti{font-size:18px}
.dar-ust h2{font-size:15.5px;font-weight:800;white-space:nowrap}
.dar-ust .kutu-gen{width:28px;height:28px}
.dar-ust .kutu-gen .ti{font-size:15px}
.dar-liste{margin:0;padding:4px 10px;list-style:none}
.dar-liste li{border-bottom:1px solid var(--line)}
.dar-liste li:last-child{border-bottom:0}
.dar-liste a{display:grid;grid-template-columns:18px auto minmax(0,1fr) auto;align-items:center;gap:8px;padding:9px 0;color:inherit;text-decoration:none}
.dar-liste a:hover b{text-decoration:underline;text-underline-offset:3px}
.dar-no{color:var(--mut);font:800 14px var(--hf);text-align:center}
.dar-foto{display:block;width:36px;height:36px;border-radius:8px;background:var(--soft);overflow:hidden}
.dar-foto img{width:100%;height:100%;object-fit:cover}
.dar-kutu.yazili .dar-liste a{grid-template-columns:18px minmax(0,1fr) auto}
.dar-liste b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-weight:700;font-size:13.5px;line-height:1.25}
.dar-liste em{display:inline-flex;align-items:center;gap:2px;color:var(--acc);font-size:13px;font-style:normal;font-weight:800}
.dar-liste em .ti{font-size:14px}
.dar-tum{display:flex;align-items:center;justify-content:center;gap:4px;padding:9px;border-top:1px solid var(--line);color:var(--acc);font-weight:700;font-size:13px;text-decoration:none}
.dar-tum:hover{background:var(--soft)}
.dar-tum .ti{font-size:15px}
@media (min-width:861px){
  #duzen[data-genis=foto] .yazili-kutu,#duzen[data-genis=yazili] .foto-kutu{display:none}
  #duzen[data-genis=foto] .sutunlar,#duzen[data-genis=yazili] .sutunlar{grid-template-columns:minmax(0,1fr)}
  #duzen[data-genis=foto] .fk-izgara{grid-template-columns:repeat(3,minmax(0,1fr))}
  #duzen[data-genis=foto] .fk.bir{grid-column:span 2;grid-row:span 2}
  #duzen[data-genis=foto] .fk.bir .fk-foto{flex:1;aspect-ratio:auto;min-height:240px}
  #duzen[data-genis=foto] .fk.bir .fk-ic{flex:none}
  #duzen[data-genis=yazili] .yl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:30px}
  #duzen[data-genis=yazili] .yl li.bir{grid-column:1/-1}
}
/* Yan sütun gündemin altına indiğinde dar gündem kendi satırında dursun: yan yana beş kart sığmaz */
@media (min-width:861px) and (max-width:1120px){
  #duzen>.yan:has(.dar-kutu){flex-wrap:wrap}
  #duzen>.yan>.dar-kutu{flex:1 0 100%}
  .bk-alt{flex-wrap:wrap;gap:8px}   /* dört kart yan yanayken "Sen de Düzenle" kartın dışına taşıyordu */
  .dar-liste{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px}
}
/* Başlıkta simge de var, sığsın: iki kutunun başlığı aynı boyda kalır, sekmeler aynı hizada başlar */
@media (min-width:861px){
  .sutunlar:not(.tek) .kutu-ust{gap:10px;padding:14px 16px}
  .sutunlar:not(.tek) .kutu-ik{width:42px;height:42px;font-size:22px}
  .sutunlar:not(.tek) .kutu-ust h2{font-size:21px}
  .sutunlar:not(.tek) .kutu-ust p{white-space:nowrap}
  .sutunlar:not(.tek) .kutu-btn{height:38px;padding:0 13px;font-size:14px}
}
@media (min-width:861px) and (max-width:1280px){
  .sutunlar:not(.tek) .kutu-ust h2{font-size:19px}
  .sutunlar:not(.tek) .kutu-ust p{font-size:12.5px}
  .sutunlar:not(.tek) .kutu-btn{padding:0 12px;font-size:14px}
}
/* Açılıp kapanırken kutu yana doğru büyür, öbürü yan sütuna küçülür; fotoğraf ve yazı sündürülmez (çözüm kutusuyla aynı yöntem) */
html.gd-gecis #icerik>:not(.sayfa-hazirlik) :is(#foto-kutu,.dar-kutu.foto){view-transition-name:gd-foto}
html.gd-gecis #icerik>:not(.sayfa-hazirlik) :is(#yazili-kutu,.dar-kutu.yazili){view-transition-name:gd-yazili}
::view-transition-group(gd-foto),::view-transition-group(gd-yazili){border-radius:20px;overflow:hidden;background:var(--kart);animation-duration:.38s;animation-timing-function:cubic-bezier(.22,.8,.24,1)}
::view-transition-old(gd-foto),::view-transition-new(gd-foto),::view-transition-old(gd-yazili),::view-transition-new(gd-yazili){height:100%;object-fit:none;object-position:left top}
::view-transition-old(gd-foto),::view-transition-old(gd-yazili){animation-duration:.18s}
::view-transition-new(gd-foto),::view-transition-new(gd-yazili){animation-duration:.3s;animation-delay:.08s}

@media (max-width:860px){
  .harita-tut,.kutu-gen,.dar-kutu{display:none}

  .hg-ic{bottom:auto;height:var(--hg-h,100vh)}
  .hg-panel{display:contents}
  .hg-ust{position:absolute;top:10px;left:10px;right:60px;padding:8px 10px;border-radius:14px;background:var(--kart);color:var(--ink);box-shadow:var(--golge-b);pointer-events:auto}
  .hg-ad{display:flex;align-items:baseline;gap:8px;margin-bottom:6px}
  .hg-ad b{font:800 17px var(--hf);white-space:nowrap}
  .hg-ad small{color:var(--mut);font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .hg-filtre{padding:3px}
  .hg-filtre button{height:30px;font-size:13px}
  .hg-isaret{display:none}
  .bant.genis .leaflet-control-zoom{display:none}
  .bant.genis .leaflet-control-attribution{display:none}
  .hg-liste{position:absolute;left:0;right:0;bottom:22px;display:flex;flex:none;gap:10px;padding:0 12px;overflow:auto hidden;scroll-snap-type:x mandatory;scrollbar-width:none;pointer-events:auto}
  .hg-liste::-webkit-scrollbar{display:none}
  .hg-liste .bos-yazi{flex:1;padding:12px;border-radius:14px;background:var(--kart)}
  .hg-sat{flex:0 0 min(84%,330px);scroll-snap-align:center;background:var(--kart);box-shadow:var(--golge-b)}
  .hg-sat:hover{background:var(--kart)}
  .hg-sat[aria-current=true]{outline:2px solid var(--acc);outline-offset:-2px;background:var(--kart)}
  .hg-kapat{position:absolute;top:10px;right:10px;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--kart);color:var(--acc);font-size:21px;text-decoration:none;box-shadow:var(--golge-b);pointer-events:auto}
  .hg-ust,.hg-kapat,.hg-liste{animation:hg-gir .3s .24s cubic-bezier(.22,.8,.24,1) both}   /* perde inerken değil, indikten sonra gelir */
}
@media (prefers-reduced-motion:reduce){
  .bant.hg-gecis,.bant-harita.hg-gecis,.harita-tut,.bant-sol{transition:none}
  .hg-panel,.hg-ust,.hg-kapat,.hg-liste{animation:none}
}
