/* =========================================================
   Siyasetçiler.com — Belediye sayfası
   (style.css, profile.css, party.css ve auth.css'ten sonra yüklenir)
   Vurgu rengi body üzerindeki --party değişkeninden gelir.
   ========================================================= */
.muni-cover{position:relative;height:190px;overflow:hidden;background:
  linear-gradient(180deg,rgba(8,15,29,.05),rgba(8,15,29,.45)),
  url('../assets/belediye-kapak.jpg') center/cover,
  linear-gradient(180deg,#7fb3e6 0%,#cfe4f7 100%)}
/* Kapak görseli yoksa basit şehir silüeti */
.skyline{position:absolute;left:0;right:0;bottom:0;height:70%;display:flex;align-items:flex-end;gap:3px;padding:0 2%}
.skyline span{flex:1 1 0;min-width:0;border-radius:2px 2px 0 0;background:
  repeating-linear-gradient(90deg,transparent 0 5px,rgba(255,255,255,.28) 5px 9px,transparent 9px 14px),
  repeating-linear-gradient(180deg,transparent 0 6px,rgba(8,15,29,.18) 6px 9px),
  color-mix(in srgb,var(--party) 70%,#0b1b33)}
.skyline span:nth-child(3n){flex-grow:1.8;background-color:color-mix(in srgb,var(--party) 50%,#0b1b33)}
.skyline span:nth-child(4n+1){flex-grow:.7;opacity:.85}
.muni-logo{width:120px;height:120px;flex-shrink:0;margin-top:-70px;align-self:flex-start;border-radius:50%;border:5px solid #fff;background:#fff;box-shadow:0 4px 18px rgba(24,35,52,.15);display:grid;place-items:center;position:relative;z-index:1}
.muni-logo div{width:100%;height:100%;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 30% 30%,color-mix(in srgb,var(--party) 70%,#fff),var(--party));color:#fff;font-size:40px}
.type-badge{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;color:var(--party);background:var(--party-soft);padding:3px 10px;border-radius:20px}

/* Başkan kartı ek bilgileri */
.mayor-meta{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:6px;font-size:11.5px;color:var(--muted)}
.mayor-meta a{color:var(--party);font-weight:700}

/* Meclis dağılımı */
.seats{display:grid;gap:10px}
.seat-row{display:grid;grid-template-columns:24px 1fr auto auto;gap:10px;align-items:center;font-size:12.5px}
.seat-row .party-dot{width:24px;height:24px;border-radius:6px;font-size:8px}
.seat-row strong{font-variant-numeric:tabular-nums}
.seat-row small{color:var(--muted);font-variant-numeric:tabular-nums;width:46px;text-align:right}
.seat-total{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:10px;margin-top:2px;font-size:12px;color:var(--muted)}
.seat-total strong{color:var(--ink)}

/* Hızlı bilgiler */
.facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.facts div{border:1px solid var(--line-soft);border-radius:9px;padding:12px}
.facts i{color:var(--party);font-size:15px}
.facts strong{display:block;font-size:16px;font-weight:850;margin-top:6px}
.facts small{font-size:11px;color:var(--muted)}

/* Hizmetler */
.services{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.service{display:flex;gap:12px;align-items:center;background:#fff;border:1px solid #eceef1;border-radius:var(--radius);box-shadow:var(--shadow);padding:14px;transition:.15s}
.service:hover{border-color:color-mix(in srgb,var(--party) 40%,#fff);transform:translateY(-2px)}
.service i{flex:0 0 40px;height:40px;border-radius:10px;display:grid;place-items:center;background:var(--party-soft);color:var(--party);font-size:16px}
.service strong{display:block;font-size:12.5px}
.service small{font-size:11px;color:var(--muted)}

/* Duyurular */
.notice{display:flex;gap:14px;align-items:flex-start;padding:12px 0;border-bottom:1px solid var(--line-soft)}
.notice:last-child{border-bottom:0}
.date-box{flex:0 0 52px;text-align:center;border-radius:9px;background:var(--party-soft);color:var(--party);padding:6px 0;line-height:1.1}
.date-box strong{display:block;font-size:18px;font-weight:850}
.date-box small{font-size:10px;font-weight:700;text-transform:uppercase}
.notice h4{font-size:13px}
.notice p{font-size:12px;color:#4e5661;margin-top:2px}
.notice .tag{display:inline-block;margin-top:6px;font-size:10px;font-weight:700;padding:2px 8px;border-radius:10px;background:#f1f2f5;color:#4a515b}
.notice .tag.urgent{background:#fdeef0;color:#a41c33}
.notice:hover h4{color:var(--party)}

/* Beyaz masa formu */
.form-field textarea{width:100%;min-height:110px;resize:vertical;border:1px solid #dfe2e7;border-radius:9px;padding:11px 13px;font:inherit;font-size:13.5px;outline:none;transition:border-color .15s,box-shadow .15s}
.form-field textarea:focus{border-color:var(--party);box-shadow:0 0 0 3px color-mix(in srgb,var(--party) 15%,transparent)}
.form-field.invalid textarea{border-color:#e0364f;background:#fffafa}
.muni-page .input-wrap input:focus,.muni-page .form-field select:focus{border-color:var(--party);box-shadow:0 0 0 3px color-mix(in srgb,var(--party) 15%,transparent)}
.muni-page .submit{background:var(--party)}
.muni-page .submit:hover{background:color-mix(in srgb,var(--party) 85%,#000)}
.hotline{display:flex;align-items:center;gap:12px;background:var(--party);color:#fff;border-radius:var(--radius);padding:14px 16px}
.hotline i{font-size:22px}
.hotline strong{display:block;font-size:22px;font-weight:900;line-height:1}
.hotline small{font-size:11px;opacity:.85}

/* ---------- Responsive ---------- */
@media (max-width:1100px){
  .services{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:720px){
  .muni-cover{height:130px}
  .muni-logo{width:96px;height:96px;margin-top:-50px;align-self:center}
  .muni-logo div{font-size:32px}
  .facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mayor-meta{justify-content:center}
}
@media (max-width:560px){
  .services{grid-template-columns:minmax(0,1fr)}
}

/* Hizmet kutuları: dış bağlantı ve henüz bağlantısı olmayan kutu (js/hizmetler.js) */
.service{position:relative}
.service .dis{position:absolute;top:9px;right:10px;flex:none;width:auto;height:auto;background:none;font-size:9px;color:var(--muted)}
.service.yakinda{opacity:.62;cursor:default;box-shadow:none}
.service.yakinda:hover{transform:none;border-color:#eceef1}
.service.yakinda em{position:absolute;top:8px;right:10px;font-style:normal;font-size:9px;font-weight:800;letter-spacing:.3px;text-transform:uppercase;color:#8a4b00}
