/* Muhtar Paneli ve muhtarın sitede görünen parçaları (js/muhtar-paneli.js; başlık sayfası, mahalle sayfası, pano, gönüllülük projesi). Muhtarın işareti lacivert rozet. */

/* Muhtarın Yanıtı: başlık sayfasında Durum'un üstünde */
.mh-yanit{margin:16px 0 18px;padding:16px 18px;border:1.5px solid var(--acc);border-radius:16px;background:var(--soft-acc)}
.mh-yanit header{display:flex;align-items:center;gap:12px}
.mh-rozet{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:12px;background:var(--btn);color:#fff;font-size:22px}
.mh-yanit h2,.mh-yanit header b{display:block;font:800 17px/1.2 var(--hf)}
.mh-yanit header p{margin:2px 0 0;color:var(--ink2);font-size:13px}
.mh-metin{margin:12px 0 0;line-height:1.55;white-space:pre-line;overflow-wrap:anywhere}
.mh-alt{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;margin-top:10px}
.mh-alt:empty{display:none}
.mh-bildir{display:inline-flex;align-items:center;gap:4px;padding:2px 0;border:0;background:none;color:var(--mut);font:inherit;font-size:13px;font-weight:600;cursor:pointer}
.mh-bildir:hover{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.mh-bildir .ti{font-size:15px}
.mh-yanit.bos{display:flex;align-items:center;justify-content:space-between;gap:12px;border-style:dashed}
.mh-yanit.bos b{display:flex;align-items:center;gap:6px}
.mh-yanit.bos b .ti{font-size:19px;color:var(--acc)}
.mh-yanit.bos p{margin:3px 0 0;color:var(--ink2);font-size:13.5px}
.mh-yanit.bos .btn{flex:none}
.nk-mh{margin:0 0 12px;padding:12px}
.nk-mh .mh-rozet{width:32px;height:32px;font-size:18px}
.nk-mh header b{font-size:14.5px}
.nk-mh header p{font-size:12px}
.nk-mh .mh-metin{margin-top:8px;font-size:13.5px}

/* Duyuru: mahalle sayfasında, panoda, panelde aynı */
.mh-duyuru{padding:12px 0;border-top:1px solid var(--line)}
.mh-duyuru:first-of-type{border-top:0;padding-top:0}
.mh-duyuru h3{margin:0;font-size:15.5px;font-weight:800;line-height:1.3;overflow-wrap:anywhere}
.mh-duyuru h3 a{color:inherit;text-decoration:underline;text-decoration-color:var(--line2);text-underline-offset:3px}
.mh-duyuru p{margin:5px 0 0;color:var(--ink2);font-size:14.5px;line-height:1.5;white-space:pre-line;overflow-wrap:anywhere}
.mh-duyuru-alt{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;margin-top:6px}
.mh-duyuru-alt small{color:var(--mut);font-size:12.5px}
.mh-arac{display:inline-flex;gap:12px}
.mh-kart h2 .ti,.mh-pano h2 .ti{margin-right:6px;color:var(--acc);vertical-align:-2px}
.mh-kart .mh-duyuru p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;white-space:normal}
.mh-kart>.btn{margin-top:10px}
.mh-pano{margin:0 0 16px}
.mh-pano header{margin-bottom:12px}

/* Panel */
.mh-panel{padding-top:20px;padding-bottom:32px}
.mh-sayilar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0 0 18px;padding:0;list-style:none}
.mh-sayilar li{display:flex;flex-direction:column;gap:2px;padding:14px 16px;border-radius:16px;background:var(--kart);box-shadow:var(--golge)}
.mh-sayilar b{font:800 28px/1.1 var(--hf)}
.mh-sayilar span{color:var(--mut);font-size:13.5px}
.mh-sayilar .vurgu b{color:var(--kir)}
.mh-iki{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);gap:18px;align-items:stretch;margin:0 0 18px}
.mh-kutu{min-width:0}
.mh-kutu .kutu-ust h2{white-space:normal}
.kutu-ust.mh-kehribar{background:#8A5A00}
.kutu-ust.mh-yesil{background:var(--cz-gecis)}
.mh-kehribar .kutu-btn{color:#8A5A00}
.mh-yesil .kutu-btn{color:#0A5C40}
#mh-sekmeler em{margin-left:2px;font-style:normal;font-weight:800}
.mh-dertler{flex:1 0 auto;margin:0;padding:0 18px;list-style:none}
.mh-dert{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;padding:13px 0;border-top:1px solid var(--line)}
.mh-dert:first-child{border-top:0}
.mh-dert-bas{font-weight:800;line-height:1.3;color:inherit;text-decoration:none;overflow-wrap:anywhere}
.mh-dert-bas:hover{text-decoration:underline;text-underline-offset:3px}
.mh-dert-meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;margin:5px 0 0;color:var(--mut);font-size:13px}
.mh-dert-meta span{display:inline-flex;align-items:center;gap:4px}
.mh-dert-meta .ti{font-size:15px}
.mh-dert-meta .rozet{color:inherit}
.mh-dert-yanit{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;margin:6px 0 0;padding-left:10px;border-left:3px solid var(--acc);color:var(--ink2);font-size:13.5px}
.mh-dert .btn{flex:none}
.mh-kutu .bos-yazi{padding:18px 0}
#mh-sayfa .sayfalayici{padding:0 18px 14px}
.mh-duyuru-liste{flex:0 0 auto;padding:14px 18px}
.mh-duyuru-liste+.kutu-dolgu{margin-top:0}
.mh-bos{display:flex;flex-direction:column;align-items:center;gap:6px;padding:18px 8px;text-align:center}
.mh-bos>.ti{font-size:30px;color:var(--mut)}
.mh-bos p{margin:0 0 6px;color:var(--mut);font-size:14px}
.mh-proje-ic{padding:16px 18px 18px}
.mh-proje-ic h3{margin:0;font-size:16px;font-weight:800}
.mh-not{margin:4px 0 12px;color:var(--mut);font-size:14px}
.mh-projeler{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:10px;margin:0 0 18px;padding:0;list-style:none}
.mh-proje{display:flex;flex-direction:column;gap:5px;height:100%;padding:13px 14px;border:1px solid var(--line2);border-radius:14px;color:inherit;text-decoration:none}
.mh-proje:hover{border-color:var(--cz)}
.mh-proje b{font-weight:800;overflow-wrap:anywhere}
.mh-proje small{display:flex;align-items:center;gap:4px;color:var(--mut);font-size:13px}
.mh-proje-alt{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px;margin-top:auto;font-size:13.5px;font-weight:700}
.rozet.mh-bekliyor{background:var(--keh-a);color:var(--keh-k)}
.rozet.mh-kapali{background:var(--soft);color:var(--mut)}
.mh-ornekler{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:0;padding:0;list-style:none}
.mh-ornekler.tanitim{grid-template-columns:repeat(3,minmax(0,1fr))}
.mh-ornek{display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:14px;border:1.5px solid var(--cz-bos);border-radius:14px;background:var(--cz-a);color:inherit;font:inherit;text-align:left}
button.mh-ornek{cursor:pointer;transition:transform .15s ease,border-color .15s ease}
button.mh-ornek:hover{border-color:var(--cz);transform:translateY(-2px)}
.mh-ornek>.ti{font-size:26px;color:var(--cz)}
.mh-ornek b{font-weight:800;line-height:1.25}
.mh-ornek p{margin:0;color:var(--ink2);font-size:13.5px;line-height:1.45}
.mh-ornek small{margin-top:4px;color:var(--mut);font-size:12.5px;line-height:1.4}
.mh-ornek.serbest{border-style:dashed;background:transparent}

/* Doğrulama penceresi: mesaj bekleniyor */
.mh-bekle{display:flex;align-items:center;gap:8px;margin:12px 0;padding:10px 12px;border-radius:12px;background:var(--soft);color:var(--ink2);font-weight:700;font-size:14px}
.mh-bekle .ti{flex:none;font-size:18px}
.mh-bekle .ti-loader-2{animation:mh-don 1s linear infinite}
.mh-bekle.uyari{background:var(--keh-a);color:var(--keh-k);font-weight:600}
.pencere .btn.yesil{margin:10px 0 0}
@keyframes mh-don{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.mh-bekle .ti-loader-2{animation:none}}

/* Proje penceresi */
.mh-is-bas{margin:12px 0 6px;font-weight:700}
.mh-is{display:grid;grid-template-columns:minmax(0,1fr) 74px 36px;align-items:end;gap:8px;margin-bottom:8px}
.mh-is label{display:flex;flex-direction:column;gap:2px;color:var(--mut);font-size:12.5px}
.mh-is input{width:100%;height:42px;padding:0 10px;border:1px solid var(--line2);border-radius:10px;background:var(--kart);color:var(--ink);font-weight:700}
.mh-p-iki{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.mh-p-iki input{width:100%}
#mh-p-aciklama,#mh-yanit-in,#mh-d-metin{font-weight:400}
.mh-is .ikon-btn{width:36px;height:42px}
.pencere .baglanti .ti{margin-right:4px;vertical-align:-2px}

/* Tanıtım */
.mh-tanitim{padding-top:22px;padding-bottom:32px}
.mh-faydalar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:0 0 18px;padding:0;list-style:none}
.mh-faydalar li{padding:18px;border-radius:var(--r);background:var(--kart);box-shadow:var(--golge)}
.mh-faydalar .ti{display:block;font-size:30px;color:var(--acc)}
.mh-faydalar b{display:block;margin:8px 0 4px;font:800 17px/1.25 var(--hf)}
.mh-faydalar p{margin:0;color:var(--ink2);font-size:14.5px;line-height:1.5}
.mh-bolum{margin:0 0 18px;padding:20px;border-radius:var(--r);background:var(--kart);box-shadow:var(--golge)}
.mh-bolum h2{margin:0 0 10px;font-size:19px;font-weight:800}
.mh-bolum .mh-not{margin-bottom:12px}
.mh-bolum ol+.mh-not{margin:12px 0 0}

/* Gönüllülük projesi sayfası (js/cozum.js projeSayfasi) */
.cz-muhtar-rol{display:inline-flex;align-items:center;gap:4px;font-weight:700;color:var(--acc)}
.cz-muhtar-rol .ti{font-size:17px}
.cz-proje-sayfa{display:block;padding-top:20px;padding-bottom:32px}
.cz-yapildi{display:inline-flex;align-items:center;gap:3px;color:var(--cz);font-weight:700}
.cz-yapildi .ti{font-size:15px}
.cz-proje-metin{margin:12px 0 0;line-height:1.55;overflow-wrap:anywhere}
.cz-proje-bilgi{display:flex;flex-wrap:wrap;gap:6px 18px;margin:10px 0 14px;padding:0;list-style:none;font-weight:700;font-size:14.5px}
.cz-proje-bilgi li{display:inline-flex;align-items:center;gap:5px}
.cz-proje-bilgi .ti{color:var(--cz);font-size:18px}
.cz-proje-durum{margin:16px 0 0}
.cz-proje-durum h4{display:flex;align-items:center;gap:6px;margin:0 0 8px}
.cz-proje-eylem{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px;margin:12px 0 0}
.hs-dugmeler{display:flex;flex-wrap:wrap;gap:8px}

@media (max-width:1000px){
  .mh-iki{grid-template-columns:minmax(0,1fr)}
  .mh-ornekler,.mh-ornekler.tanitim,.mh-faydalar{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .mh-p-iki{grid-template-columns:minmax(0,1fr)}
  .mh-is{grid-template-columns:minmax(0,1fr) 58px 30px;gap:6px}
  .mh-is input{padding:0 8px;font-weight:600}
  .mh-is .ikon-btn{width:30px}
  .mh-sayilar{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mh-sayilar b{font-size:24px}
  .mh-ornekler,.mh-ornekler.tanitim,.mh-faydalar{grid-template-columns:minmax(0,1fr)}
  .mh-dert{grid-template-columns:minmax(0,1fr)}
  .mh-dert .btn{justify-self:start}
  .mh-yanit.bos{flex-direction:column;align-items:flex-start}
  .mh-kutu .kutu-ust h2{font-size:19px}
  .mh-kutu .kutu-ust p{font-size:12.5px}
}