/* Mesajlarım — 2026-07-20 modernizasyonu (2. tur). İlk turda mz-* sistemi bileşenlere ayrılmıştı ama
   dış iskelet hâlâ eski "chat kutusu" kalıbıydı (yuvarlak köşeli, sabit yükseklikli, kendi içinde kayan 3
   sütun) — kullanıcı bunun "aynı tasarımın küçük değişikliği" olduğunu, gerçekten FARKLI bir düzen
   istediğini belirtti. Bu turda kutu tamamen kaldırıldı: sayfa artık doğal olarak kayıyor, sohbet listesi
   yapışkan (sticky) bir kart, topluluk sayfası kapak-fotoğraflı bir profil sayfası (Facebook/LinkedIn grup
   sayfası ailesinden, ama Balıkçısın'ın kendi marka diliyle — 'açık akış + yapışkan yan panel' yönü), sohbet
   ise kendi kartı içinde (pinlenmiş composer + kayan mesaj geçmişi — bu kısım gerçek sohbet UX'i gereği
   sabit yükseklikte kalmalı, ama artık ağır bir "kabuk" değil sade bir kart). Index sayfası artık boş bir
   "bir şey seç" değil, gerçek içerik: sohbet sekmesinde gelen-kutusu listesi, topluluklar sekmesinde
   keşfedilebilir bir kart ızgarası. */

@keyframes mzPop { 0% { transform:scale(.92) translateY(6px); opacity:0; } 100% { transform:scale(1) translateY(0); opacity:1; } }
@keyframes mzFade { from { opacity:0; } to { opacity:1; } }

/* ===== sayfa iskeleti ===== */
.mz-page { width:1320px; max-width:100%; margin:0 auto; padding:44px 28px 80px; }

/* Sayfa içi arama kutuları (Index gelen-kutusu/topluluk ızgarası üstü) — .mz-search'ün büyütülmüş hâli. */
.mz-toolbar { display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:22px; }
.mz-toolbar .mz-search { flex:1; min-width:220px; }
.mz-toolbar .mz-search input { padding:15px 0; font-size:15px; }

/* Mesajlar sekmesi liste/kart görünüm anahtarı — kullanıcı talebi: "hem liste hem card görünüm olsun".
   Tercih localStorage'da tutulur (bkz. Index.cshtml alt script), sayfa her açıldığında hatırlanır. */
.mz-view-toggle { display:inline-flex; align-items:center; gap:4px; padding:4px; background:#F4F8FC; border:1px solid var(--border); border-radius:14px; flex-shrink:0; }
.mz-view-btn { display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:10px; border:none; background:transparent; color:var(--muted-2); cursor:pointer; transition:background .2s, color .2s; }
.mz-view-btn:hover { color:var(--ink); }
.mz-view-btn.is-active { background:#fff; color:var(--blue); box-shadow:0 6px 14px -8px rgba(10,37,64,.3); }

/* ===== hero (başlık + segment sekme + compose) — bkz. _MzHero.cshtml ===== */
.mz-hero { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; flex-wrap:wrap; margin-bottom:32px; }
.mz-hero-title { margin:0; font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:clamp(28px,4vw,40px); letter-spacing:-.5px; color:var(--ink); }
.mz-hero-sub { margin-top:8px; font:500 15px/1.4 'Hanken Grotesk',sans-serif; color:var(--muted); }
.mz-hero-controls { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }

.mz-segtabs { position:relative; display:inline-flex; padding:5px; gap:2px; background:#EAF0F7; border-radius:16px; }
.mz-segtab { position:relative; z-index:1; display:inline-flex; align-items:center; gap:7px; padding:11px 22px; border-radius:12px; font:700 14px/1 'Hanken Grotesk',sans-serif; color:var(--muted); text-decoration:none; white-space:nowrap; transition:color .3s; }
.mz-segtab.is-active { color:#fff; }
.mz-segtab-thumb { position:absolute; top:5px; bottom:5px; left:5px; width:calc(50% - 6px); border-radius:12px; background:linear-gradient(135deg,var(--blue),var(--blue-dark)); box-shadow:0 12px 24px -8px rgba(12,110,230,.55); transition:transform .4s cubic-bezier(.22,1,.36,1); }
.mz-segtabs[data-active="communities"] .mz-segtab-thumb { transform:translateX(100%); }

/* ===== buton sistemi ===== */
.mz-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; cursor:pointer; border:none; font:700 13.5px/1 'Hanken Grotesk',sans-serif; padding:13px 22px; border-radius:14px 14px 14px 5px; text-decoration:none; transition:transform .25s cubic-bezier(.22,1,.36,1), box-shadow .25s, background .2s; }
.mz-btn:hover { transform:translateY(-2px); }
.mz-btn--primary { background:linear-gradient(135deg,var(--blue),var(--blue-dark)); color:#fff; box-shadow:0 16px 30px -12px rgba(12,110,230,.55); }
.mz-btn--ghost { background:#F4F8FC; color:var(--muted); border:1px solid var(--border); }
.mz-btn--ghost:hover { background:#EAF1F8; }
.mz-btn--danger { background:linear-gradient(135deg,#FF6B57,#E5392B); color:#fff; box-shadow:0 16px 30px -12px rgba(229,57,43,.55); }
.mz-btn--glass { background:rgba(255,255,255,.16); color:#fff; border:1px solid rgba(255,255,255,.3); backdrop-filter:blur(10px); }
.mz-btn--glass:hover { background:rgba(255,255,255,.26); }
.mz-btn--sm { padding:10px 16px; font-size:12.5px; border-radius:11px 11px 11px 4px; }
.mz-btn--block { width:100%; }
.mz-btn:disabled { opacity:.5; cursor:default; transform:none; }

/* ===== avatar sistemi ===== */
.mz-avatar { --sz:44px; position:relative; flex-shrink:0; width:var(--sz); height:var(--sz); border-radius:calc(var(--sz) * .3); display:flex; align-items:center; justify-content:center; overflow:hidden; color:#fff; font-family:'Hanken Grotesk',sans-serif; font-weight:800; font-size:calc(var(--sz) * .37); line-height:1; user-select:none; }
.mz-avatar.mz-avatar--circle { border-radius:50%; }
.mz-avatar img { width:100%; height:100%; object-fit:cover; display:block; }
.mz-avatar--blue { background:linear-gradient(145deg,#2E8CFF,#0A2540); box-shadow:0 10px 22px -10px rgba(12,110,230,.65); }
.mz-avatar--coral { background:linear-gradient(145deg,#FF7A5C,#0A2540); box-shadow:0 10px 22px -10px rgba(255,90,60,.6); }
.mz-avatar--purple { background:linear-gradient(145deg,#9C82FF,#0A2540); box-shadow:0 10px 22px -10px rgba(124,92,255,.55); }
.mz-avatar--green { background:linear-gradient(145deg,#33D9AE,#0A2540); box-shadow:0 10px 22px -10px rgba(22,184,148,.55); }
.mz-avatar--ring { box-shadow:0 0 0 4px #fff, 0 18px 34px -14px rgba(10,37,64,.5); }

/* ===== rozet ===== */
.mz-badge { display:inline-flex; align-items:center; gap:4px; font:800 9.5px/1 'Space Mono',monospace; letter-spacing:.08em; padding:5px 8px; border-radius:7px; flex-shrink:0; }
.mz-badge--owner { color:var(--blue); background:#E7F1FF; }
.mz-badge--mod { color:var(--green); background:#E6F7F0; }

/* ===== ortak: arama kutusu / uyarı / boş durum ===== */
.mz-search { display:flex; align-items:center; gap:10px; background:#F4F8FC; border:1.5px solid #EAF0F6; border-radius:14px; padding:0 14px; transition:border-color .2s, box-shadow .2s, background .2s; }
.mz-search:focus-within { border-color:var(--blue) !important; box-shadow:0 0 0 4px rgba(12,110,230,.12); background:#fff !important; }
.mz-search input { flex:1; min-width:0; border:none; background:transparent; outline:none; padding:13px 0; font:500 14.5px/1 'Hanken Grotesk',sans-serif; color:var(--ink); }

.mz-alert { margin:0 0 20px; padding:14px 18px; border-radius:14px; font:500 14px/1.5 'Hanken Grotesk',sans-serif; }
.mz-alert--error { background:rgba(255,90,60,.08); border:1px solid rgba(255,90,60,.22); color:#D6483A; }
.mz-alert--warning { background:rgba(255,180,60,.12); border:1px solid rgba(255,180,60,.3); color:#8A6420; }

.mz-empty-card { text-align:center; color:var(--muted-2); padding:64px 28px; background:#fff; border:1px solid var(--border); border-radius:26px; }
.mz-empty-card .mz-empty-badge { width:76px; height:76px; margin:0 auto 20px; border-radius:24px; display:flex; align-items:center; justify-content:center; font-size:32px; background:linear-gradient(145deg,#fff,#EAF2FE); box-shadow:0 20px 40px -18px rgba(12,110,230,.3), inset 0 0 0 1px rgba(12,110,230,.12); }
.mz-empty-card .mz-empty-title { font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:18px; color:var(--ink); }
.mz-empty-card .mz-empty-text { margin-top:9px; font:500 14px/1.5 'Hanken Grotesk',sans-serif; color:var(--muted-2); }
.mz-empty-thread { margin:auto; text-align:center; color:var(--muted-2); font:500 14px/1.5 'Hanken Grotesk',sans-serif; }

/* ===================================================================================
   INDEX — tam genişlik içerik (gelen kutusu listesi / keşfedilebilir topluluk ızgarası)
   =================================================================================== */
.mz-invite-banner-row { display:flex; flex-direction:column; gap:10px; margin-bottom:22px; }
.mz-invite-card { display:flex; align-items:center; gap:16px; flex-wrap:wrap; padding:16px 20px; border-radius:18px; background:linear-gradient(135deg,#FFF7E6,#FFF1D6); border:1px solid #FCE6B0; }
.mz-invite-card-text { flex:1; min-width:200px; font:600 13.5px/1.4 'Hanken Grotesk',sans-serif; color:#0A2540; }
.mz-invite-card-actions { display:flex; gap:8px; }

/* Gelen kutusu — kullanıcı talebi: "hem liste hem card görünüm olsun, card seçilirse topluluk kısmındaki
   gibi olsun". İki ayrı panel render edilir (Index.cshtml'de #mz-index-list = liste, #mz-index-grid =
   kart) ve JS ile aralarında geçiş yapılır (bkz. sayfa altındaki görünüm anahtarı scripti) — önceki turda
   liste tamamen kart ile değiştirilmişti, kullanıcı bunun geri alınmasını ve ikisinin birlikte, seçilebilir
   olmasını istedi. Liste artık .mz-page ile aynı tam genişliği kullanır (eski max-width:920px kaldırıldı —
   "yarım kalıyor" şikayetinin asıl nedeni buydu, kart görünümüne özgü değildi). */
.mz-inbox { display:flex; flex-direction:column; gap:12px; }
.mz-inbox-row { position:relative; display:flex; align-items:center; gap:18px; padding:20px 24px; background:#fff; border:1px solid var(--border); border-radius:22px; text-decoration:none; color:inherit; transition:transform .22s, box-shadow .22s, border-color .22s; }
.mz-inbox-row:hover { transform:translateY(-3px); box-shadow:0 24px 48px -28px rgba(10,37,64,.34); border-color:transparent; }
.mz-inbox-row-body { flex:1; min-width:0; }
.mz-inbox-row-top { display:flex; align-items:baseline; justify-content:space-between; gap:10px; }
.mz-inbox-row-title { font:700 17px/1.25 'Hanken Grotesk',sans-serif; color:#122E4A; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mz-inbox-row-time { flex-shrink:0; font:600 12.5px/1 'Hanken Grotesk',sans-serif; color:var(--muted-2); }
.mz-inbox-row-sub { margin-top:7px; font:500 14px/1.4 'Hanken Grotesk',sans-serif; color:var(--muted-2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mz-inbox-row.is-unread { border-color:#0C6EE6; background:#F5F9FF; }
.mz-inbox-row.is-unread .mz-inbox-row-sub { color:#122E4A; font-weight:700; }
.mz-inbox-row .mz-inbox-unread-badge { position:static; box-shadow:none; }

/* Kart görünümü — Topluluklar sekmesindeki .mz-community-grid/.mz-community-card ile birebir aynı
   auto-fill ızgara + kapak şeridi/taşan avatar deseni. */
.mz-inbox-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:22px; }
.mz-inbox-card { position:relative; display:flex; flex-direction:column; background:#fff; border:1px solid var(--border); border-radius:24px; overflow:hidden; text-decoration:none; color:inherit; box-shadow:0 22px 44px -32px rgba(10,37,64,.4); transition:transform .3s cubic-bezier(.22,1,.36,1), box-shadow .3s, border-color .3s; }
.mz-inbox-card:hover { transform:translateY(-5px); box-shadow:0 32px 60px -30px rgba(10,37,64,.32); }
.mz-inbox-card-cover { position:relative; height:60px; flex-shrink:0; background:linear-gradient(120deg,#2E8CFF,#0A2540); }
.mz-inbox-card--group .mz-inbox-card-cover { background:linear-gradient(120deg,#FF7A5C,#0A2540); }
.mz-inbox-card-avatar-wrap { position:absolute; left:20px; bottom:-24px; }
.mz-inbox-card-body { padding:34px 20px 20px; flex:1; display:flex; flex-direction:column; }
.mz-inbox-card-top { display:flex; align-items:baseline; justify-content:space-between; gap:10px; }
.mz-inbox-card-name { font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:16.5px; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mz-inbox-card-time { flex-shrink:0; font:600 11.5px/1 'Hanken Grotesk',sans-serif; color:var(--muted-2); }
.mz-inbox-card-sub { margin-top:8px; font:500 13.5px/1.5 'Hanken Grotesk',sans-serif; color:var(--muted-2); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; flex:1; }

.mz-inbox-card.is-unread { border-color:#0C6EE6; box-shadow:0 26px 50px -30px rgba(12,110,230,.42); }
.mz-inbox-card.is-unread .mz-inbox-card-sub { color:#122E4A; font-weight:700; }
.mz-inbox-unread-badge { position:absolute; top:14px; right:16px; z-index:2; display:inline-flex; align-items:center; justify-content:center; flex-shrink:0; min-width:22px; height:22px; padding:0 6px; border-radius:11px; background:#FF5A3C; color:#fff; font:700 12px/1 'Hanken Grotesk',sans-serif; text-align:center; box-shadow:0 0 0 3px #fff; }

/* Topluluklar sekmesi liste görünümü — .mz-inbox/.mz-inbox-row'un topluluk eşdeğeri (kullanıcı talebi:
   "aynı şekilde topluluk kısmını da card/liste olarak ayarla"). Kart görünümü (.mz-community-grid, altta)
   ile aynı görünüm-anahtarı desenini paylaşır (bkz. Index.cshtml altındaki ortak script). */
.mz-community-list { display:flex; flex-direction:column; gap:12px; }
.mz-community-row { display:flex; align-items:center; gap:18px; padding:18px 22px; background:#fff; border:1px solid var(--border); border-radius:22px; text-decoration:none; color:inherit; transition:transform .22s, box-shadow .22s, border-color .22s; }
.mz-community-row:hover { transform:translateY(-3px); box-shadow:0 24px 48px -28px rgba(10,37,64,.34); border-color:transparent; }
.mz-community-row-body { flex:1; min-width:0; }
.mz-community-row-top { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.mz-community-row-title { font:700 17px/1.25 'Hanken Grotesk',sans-serif; color:#122E4A; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mz-community-row-chips { display:flex; gap:8px; flex-shrink:0; }
.mz-community-row-sub { margin-top:6px; font:500 13.5px/1.4 'Hanken Grotesk',sans-serif; color:var(--muted-2); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

.mz-community-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(292px,1fr)); gap:24px; }
.mz-community-card { display:flex; flex-direction:column; background:#fff; border:1px solid var(--border); border-radius:24px; overflow:hidden; text-decoration:none; color:inherit; box-shadow:0 22px 44px -32px rgba(10,37,64,.4); transition:transform .3s cubic-bezier(.22,1,.36,1), box-shadow .3s; }
.mz-community-card:hover { transform:translateY(-5px); box-shadow:0 32px 60px -30px rgba(10,37,64,.32); }
.mz-community-card-cover { position:relative; height:104px; background:linear-gradient(140deg,#9C82FF,#0A2540); background-size:cover; background-position:center; flex-shrink:0; }
.mz-community-card-avatar { position:absolute; left:20px; bottom:-26px; }
.mz-community-card-body { padding:38px 20px 20px; flex:1; display:flex; flex-direction:column; }
.mz-community-card-name { font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:16.5px; color:var(--ink); }
.mz-community-card-desc { margin-top:7px; font:500 13px/1.5 'Hanken Grotesk',sans-serif; color:var(--muted-2); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; flex:1; }
.mz-community-card-footer { margin-top:16px; display:flex; align-items:center; justify-content:space-between; gap:10px; }
.mz-chip { display:inline-flex; align-items:center; font:600 11.5px/1 'Hanken Grotesk',sans-serif; padding:7px 11px; border-radius:9px; background:#F4F8FC; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* ===================================================================================
   WORKSPACE — sohbet/topluluk DETAY sayfaları: yapışkan liste + içerik
   =================================================================================== */
.mz-workspace { display:grid; grid-template-columns:296px minmax(0,1fr); gap:24px; align-items:start; }

/* top: kullanıcı raporu "sağ ve sol panel sticky ama üst menü altında kalıyor" — _Layout.cshtml'in
   JS'le ölçtüğü GERÇEK banner+header yüksekliğine göre (bkz. --bs-sticky-h), sabit pikselin banner
   var/yokken hep yanlış çıkması yerine. Fallback 132px: JS henüz çalışmadan ilk boyanan kare için. */
.mz-switcher { position:sticky; top:calc(var(--bs-sticky-h, 132px) + 12px); display:flex; flex-direction:column; background:#fff; border:1px solid var(--border); border-radius:24px; box-shadow:0 30px 60px -40px rgba(10,37,64,.35); max-height:calc(100vh - var(--bs-sticky-h, 132px) - 24px); overflow:hidden; }
.mz-switcher-head { flex-shrink:0; padding:20px 18px 14px; }
.mz-switcher-eyebrow { font:700 11px/1 'Space Mono',monospace; letter-spacing:.16em; color:var(--muted-2); margin-bottom:14px; }
.mz-switcher-list { flex:1; overflow-y:auto; padding:4px 12px 16px; min-height:0; }
.mz-category-label { margin:16px 8px 8px; font:700 10.5px/1 'Space Mono',monospace; letter-spacing:.16em; color:var(--muted-2); }
.mz-empty-list { text-align:center; color:var(--muted-2); padding:40px 16px; font:500 13.5px/1.5 'Hanken Grotesk',sans-serif; }

.mz-row { position:relative; display:flex; align-items:center; gap:12px; padding:11px 12px; border-radius:16px; margin-bottom:2px; text-decoration:none; color:inherit; transition:background .2s; }
.mz-row:hover { background:#F4F8FC; }
.mz-row.is-active { background:linear-gradient(120deg,rgba(12,110,230,.09),rgba(22,184,148,.06)); }
.mz-row.is-active::before { content:''; position:absolute; left:1px; top:12px; bottom:12px; width:3.5px; border-radius:4px; background:linear-gradient(180deg,var(--blue),var(--green)); }
.mz-row-body { flex:1; min-width:0; }
.mz-row-top { display:flex; align-items:baseline; justify-content:space-between; gap:8px; }
.mz-row-title { font:700 14px/1.25 'Hanken Grotesk',sans-serif; color:#122E4A; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mz-row.is-active .mz-row-title { font-weight:800; }
.mz-row-time { flex-shrink:0; font:600 11px/1 'Hanken Grotesk',sans-serif; color:var(--muted-2); }
.mz-row-sub { margin-top:4px; font:500 12.5px/1.4 'Hanken Grotesk',sans-serif; color:var(--muted-2); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* ===== panel (yan panel kartları — sohbet/topluluk bilgisi) ===== */
.mz-panel { background:#fff; border:1px solid var(--border); border-radius:22px; padding:24px; }
.mz-panel-title { margin-bottom:14px; font:700 12px/1 'Space Mono',monospace; letter-spacing:.1em; text-transform:uppercase; color:var(--muted-2); }
.mz-panel-list { display:flex; flex-direction:column; gap:2px; }
.mz-panel-list--scroll { max-height:280px; overflow-y:auto; padding-right:4px; }

.mz-stats-row { display:flex; gap:10px; }
.mz-stat-tile { flex:1; padding:14px; border-radius:15px; text-align:center; border:1px solid transparent; }
.mz-stat-tile--blue { background:#F4F8FC; border-color:#EAF0F6; }
.mz-stat-tile--blue .mz-stat-num { color:var(--ink); }
.mz-stat-tile--blue .mz-stat-label { color:var(--muted-2); }
.mz-stat-tile--green { background:#E6F7F0; border-color:#CFEEE2; }
.mz-stat-tile--green .mz-stat-num { color:#0F9C78; }
.mz-stat-tile--green .mz-stat-label { color:#4FA98C; }
.mz-stat-num { display:block; font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:21px; }
.mz-stat-label { display:block; margin-top:3px; font:600 10.5px/1 'Hanken Grotesk',sans-serif; }

.mz-settings-trigger { cursor:pointer; display:flex; align-items:center; gap:10px; font:700 14px/1 'Hanken Grotesk',sans-serif; color:var(--blue); padding:4px 0; background:none; border:none; }
.mz-icon-chip { flex-shrink:0; width:30px; height:30px; border-radius:10px; background:#E7F1FF; display:flex; align-items:center; justify-content:center; font-size:14px; }

.mz-request-card { padding:13px; border-radius:15px; background:#F4F8FC; border:1px solid #EAF0F6; }
.mz-invite-result { display:flex; align-items:center; gap:10px; padding:8px 9px; border-radius:13px; background:#F4F8FC; }

.mz-rule-item { display:flex; gap:12px; align-items:flex-start; margin-bottom:10px; }
.mz-rule-item:last-child { margin-bottom:0; }
.mz-rule-num { flex-shrink:0; width:24px; height:24px; border-radius:8px; background:#E7F1FF; color:var(--blue); font:800 11.5px/24px 'Space Mono',monospace; text-align:center; }
.mz-rule-text { font:400 13.5px/1.55 'Hanken Grotesk',sans-serif; color:#3A566F; }

.mz-member-row { display:flex; align-items:center; gap:11px; padding:9px 8px; border-radius:14px; transition:background .15s; }
.mz-member-row:hover { background:#F4F8FC; }
.mz-member-name { flex:1; min-width:0; font:700 13.5px/1.25 'Hanken Grotesk',sans-serif; color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mz-icon-action { background:none; border:none; cursor:pointer; color:var(--muted-2); font-size:14px; padding:5px; border-radius:8px; transition:background .15s, color .15s; flex-shrink:0; }
.mz-icon-action:hover { background:#F2F7FC; }
.mz-icon-action.is-danger:hover { color:var(--coral); background:#FFE9E6; }
.mz-contributor-rank { flex-shrink:0; font:800 13px/1 'Space Mono',monospace; width:18px; text-align:center; }

/* ===================================================================================
   TOPLULUK — kapak (cover) profili + açık akış/yan panel bölünmesi
   =================================================================================== */
/* Kapak (cover) — kullanıcı talebi: "gri alanda olsun topluluk alanı geri işaretini kaldır yerine
   gelsin" — avatar/başlık artık kapağın ALTINDA değil, kapağın KENDİSİNİN içinde (gri/degrade alanın
   üzerinde) konumlanıyor; eski "geri" oku kaldırıldı, avatar+başlık tam onun bulunduğu sol-alt köşeye
   yerleşiyor. Önceki iki tasarım da ("üstüne taşan avatar" negatif-margin'i, sonra "kapağın altında düz
   satır") kullanıcı tarafından "kayık" bulunmuştu — bu üçüncü sürüm avatarı/başlığı kapağın SABİT bir
   köşesine mutlak konumla (position:absolute) oturtuyor, bu yüzden avatar/kapak boyutundan bağımsız
   olarak asla kayamaz. */
/* Kullanıcı talebi: "üst boşluğunu da düzelt eşit olsun" (ve sonrasında hâlâ "üstünde fazla boşluk var
   altı ile") — önceki flex-column deneme, .mz-cover-bar boş olsa BİLE (ör. zaten üye olan sahip için
   katıl butonu hiç render edilmez) kendi padding'i kadar üstten yer kaplamaya devam ediyor, bu da
   avatar'ı "üstten fazladan boşluklu" gösteriyordu. Kalıcı çözüm: bar artık akıştan tamamen çıkarılıp
   (position:absolute, yalnızca içerik varsa görünür) content KAPAĞIN TAMAMINA (inset:0) göre dikey
   ortalanıyor — bar'ın boş/dolu olması top/bottom simetrisini artık hiç etkilemiyor. */
.mz-cover { position:relative; border-radius:28px; overflow:hidden; min-height:176px; background:linear-gradient(150deg,#9C82FF,#0A2540); background-size:cover; background-position:center; box-shadow:0 40px 80px -44px rgba(10,37,64,.5); margin-bottom:24px; }
.mz-cover-scrim { position:absolute; inset:0; background:linear-gradient(190deg,rgba(6,20,36,.08) 0%,rgba(6,20,36,.68) 100%); }
.mz-cover-bar { position:absolute; top:0; left:0; right:0; z-index:2; display:flex; align-items:center; justify-content:flex-end; gap:10px; padding:20px 24px; }
.mz-cover-actions { display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end; }

.mz-cover-content { position:absolute; inset:0; z-index:1; display:flex; align-items:center; gap:16px; padding:0 24px; }
.mz-cover-avatar-wrap { flex-shrink:0; }
.mz-cover-text { min-width:0; }
.mz-cover-text h1 { margin:0; color:#fff; font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:clamp(22px,3vw,30px); letter-spacing:-.5px; line-height:1.2; text-shadow:0 2px 12px rgba(6,20,36,.4); }
.mz-cover-meta { margin-top:6px; color:rgba(255,255,255,.82); font:500 14px/1 'Hanken Grotesk',sans-serif; }

.mz-split { display:grid; grid-template-columns:minmax(0,1fr) 336px; gap:24px; align-items:start; }
.mz-feed { display:flex; flex-direction:column; min-width:0; }
/* Kullanıcı talebi: "sağ kısmı aynı sol kısım gibi sticky kayan olsun" (sayfa kaydıkça yerinde dursun)
   ama sonrasında "sağ kısım panel scroll olmasın" — .mz-switcher'ın aksine kendi içinde AYRI bir
   kaydırma kutusu YOK (max-height/overflow-y bilinçli olarak eklenmedi), yalnızca sticky; içerik
   viewport'tan uzunsa sayfanın kendisiyle birlikte doğal olarak kayar. */
.mz-sidebar { position:sticky; top:calc(var(--bs-sticky-h, 132px) + 12px); display:flex; flex-direction:column; gap:18px; }

/* ===== gönderi (topluluk akışı) ===== */
.mz-post-composer { display:flex; gap:14px; align-items:flex-start; padding:20px 22px; background:#fff; border:1px solid var(--border); border-radius:22px; margin-bottom:20px; box-shadow:0 18px 38px -28px rgba(10,37,64,.4); }
.mz-post-composer textarea { width:100%; border:none; background:transparent; outline:none; font:500 15px/1.5 'Hanken Grotesk',sans-serif; color:var(--ink); resize:none; padding-top:10px; }
.mz-attach-btn { display:flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:11px; background:#F2F7FC; border:1px solid var(--border); cursor:pointer; font-size:15px; transition:background .2s, transform .2s; }
.mz-attach-btn:hover { background:#E7F1FF; transform:translateY(-1px); }
.mz-emoji-panel { display:none; flex-wrap:wrap; gap:5px; margin:10px 0; padding:10px; background:#F4F8FC; border:1px solid var(--border); border-radius:15px; max-width:300px; }
.mz-emoji-panel span { width:34px; height:34px; display:flex; align-items:center; justify-content:center; font-size:19px; border-radius:9px; cursor:pointer; transition:background .15s; }
.mz-emoji-panel span:hover { background:#fff; }
.mz-preview-row { display:none; gap:12px; margin:12px 0 2px; flex-wrap:wrap; }
.mz-preview-chip { position:relative; width:118px; height:88px; border-radius:14px; overflow:hidden; background:#F2F7FC; border:1px solid var(--border); flex-shrink:0; }
.mz-preview-chip img, .mz-preview-chip video { width:100%; height:100%; object-fit:cover; display:block; }
.mz-preview-remove { position:absolute; top:6px; right:6px; width:22px; height:22px; border-radius:8px; background:rgba(10,37,64,.65); color:#fff; display:flex; align-items:center; justify-content:center; font-size:11px; cursor:pointer; }

.mz-post-card { background:#fff; border:1px solid var(--border); border-radius:22px; padding:22px 24px; margin-bottom:18px; box-shadow:0 18px 40px -30px rgba(10,37,64,.4); transition:box-shadow .5s ease; }
.mz-post-head { display:flex; align-items:center; gap:13px; margin-bottom:15px; }
.mz-post-author { display:flex; align-items:center; gap:8px; font:700 14.5px/1 'Hanken Grotesk',sans-serif; color:var(--ink); }
.mz-post-time { margin-top:5px; font:500 12.5px/1 'Hanken Grotesk',sans-serif; color:var(--muted-2); }
.mz-post-body { font:400 15.5px/1.65 'Hanken Grotesk',sans-serif; color:#26415C; }
.mz-post-media { display:block; width:100%; margin-top:15px; border-radius:16px; box-shadow:inset 0 0 0 1px rgba(10,37,64,.06); }
.mz-post-actions { display:flex; align-items:center; gap:10px; margin-top:17px; padding-top:16px; border-top:1px solid #F0F4F8; }
.mz-like-btn { display:inline-flex; align-items:center; gap:7px; padding:9px 15px; border-radius:12px; border:none; cursor:pointer; font:700 13px/1 'Hanken Grotesk',sans-serif; background:#F4F8FC; color:var(--muted); transition:transform .2s, background .2s; }
.mz-like-btn:hover { transform:translateY(-1px); }
.mz-like-btn.is-liked { background:#FFE9E6; color:var(--coral); }
.mz-post-link { cursor:pointer; font:600 12.5px/1 'Hanken Grotesk',sans-serif; color:var(--muted-2); padding:9px 6px; background:none; border:none; }

.mz-removed { position:relative; border-radius:16px; overflow:hidden; margin-top:4px; }
.mz-removed-lines { filter:blur(7px); opacity:.5; user-select:none; pointer-events:none; }
.mz-removed-line { height:13px; border-radius:7px; background:#D7E2EC; margin-bottom:9px; }
.mz-removed-overlay { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:9px; background:rgba(255,255,255,.72); backdrop-filter:blur(1px); }

/* ===================================================================================
   SOHBET — kart (pinlenmiş composer + kayan mesaj geçmişi doğal sohbet UX'i gereği)
   =================================================================================== */
.mz-chatcard { background:#fff; border:1px solid var(--border); border-radius:28px; box-shadow:0 40px 80px -46px rgba(10,37,64,.4); overflow:hidden; display:flex; flex-direction:column; height:min(74vh,720px); min-height:520px; }
.mz-chat-head { flex-shrink:0; display:flex; align-items:center; gap:16px; padding:20px 24px; background:rgba(255,255,255,.9); backdrop-filter:blur(14px); border-bottom:1px solid var(--border); }
.mz-chat-head-title { font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:18px; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mz-chat-head-sub { margin-top:3px; font:500 13px/1 'Hanken Grotesk',sans-serif; color:var(--muted-2); }
.mz-iconbtn { flex-shrink:0; display:flex; align-items:center; justify-content:center; width:40px; height:40px; border-radius:13px 13px 13px 5px; background:#F2F7FC; border:1px solid var(--border); color:var(--muted); cursor:pointer; transition:background .2s, color .2s; text-decoration:none; }
.mz-iconbtn:hover { background:#E7F1FF; color:var(--blue); }
.mz-back { display:none; }

.mz-thread { flex:1; overflow-y:auto; padding:24px 26px 8px; min-height:0; display:flex; flex-direction:column; }
.mz-scroll::-webkit-scrollbar { width:9px; }
.mz-scroll::-webkit-scrollbar-thumb { background:#D3E0EC; border-radius:9px; border:3px solid transparent; background-clip:padding-box; }
.mz-scroll::-webkit-scrollbar-thumb:hover { background:#B9CCDD; background-clip:padding-box; }

.mz-msg-row { display:flex; gap:10px; align-items:flex-end; margin-top:10px; }
.mz-msg-row.is-mine { justify-content:flex-end; }
.mz-msg-row.is-theirs { justify-content:flex-start; }
.mz-msg-col { max-width:min(72%,540px); display:flex; flex-direction:column; }
.mz-msg-row.is-mine .mz-msg-col { align-items:flex-end; }
.mz-msg-row.is-theirs .mz-msg-col { align-items:flex-start; }
.mz-msg-sender { margin:0 0 5px 4px; font:700 12px/1 'Hanken Grotesk',sans-serif; color:#7C5CFF; }
.mz-bubble { padding:12px 16px; border-radius:18px 18px 18px 6px; background:#F4F8FC; color:#122E4A; font:500 15px/1.55 'Hanken Grotesk',sans-serif; word-break:break-word; }
.mz-msg-row.is-mine .mz-bubble { border-radius:18px 18px 6px 18px; background:linear-gradient(135deg,var(--blue),var(--blue-dark)); color:#fff; box-shadow:0 12px 24px -12px rgba(12,110,230,.5); }
.mz-msg-time { margin:6px 5px 0; font:600 11px/1 'Hanken Grotesk',sans-serif; color:#A6B4C2; }

.mz-composer { flex-shrink:0; padding:14px 20px 18px; background:#fff; border-top:1px solid var(--border); }
.mz-composer-row { display:flex; align-items:flex-end; gap:12px; }
.mz-composer-field { flex:1; min-width:0; display:flex; align-items:flex-end; background:#F4F8FC; border:1.5px solid #EAF0F6; border-radius:18px; padding:7px 8px 7px 18px; transition:border-color .2s, box-shadow .2s, background .2s; }
.mz-composer-field:focus-within { border-color:var(--blue); box-shadow:0 0 0 4px rgba(12,110,230,.12); background:#fff; }
.mz-composer-field textarea { flex:1; min-width:0; resize:none; border:none; background:transparent; outline:none; padding:12px 0; font:500 15px/1.5 'Hanken Grotesk',sans-serif; color:var(--ink); max-height:130px; }
.mz-send-btn { flex-shrink:0; width:50px; height:50px; border-radius:16px 16px 16px 6px; background:linear-gradient(135deg,var(--blue),var(--blue-dark)); border:none; display:flex; align-items:center; justify-content:center; cursor:pointer; box-shadow:0 16px 30px -10px rgba(12,110,230,.45); transition:transform .25s; }
.mz-send-btn:hover { transform:translateY(-2px) scale(1.04); }
.mz-join-cta { flex:1; display:flex; align-items:center; justify-content:center; text-align:center; }

/* ===== form alanları (modal içi) ===== */
.mz-field { margin-bottom:14px; }
.mz-field label { display:block; font:800 10.5px/1 'Hanken Grotesk',sans-serif; letter-spacing:.05em; text-transform:uppercase; color:var(--muted-2); margin-bottom:7px; }
.mz-field input[type=text], .mz-field input:not([type]), .mz-field select, .mz-field textarea {
  width:100%; box-sizing:border-box; background:#fff; border:1.5px solid var(--border); border-radius:13px; padding:11px 14px;
  font:600 13.5px/1.4 'Hanken Grotesk',sans-serif; color:var(--ink); outline:none; font-family:inherit; transition:border-color .15s;
}
.mz-field input:focus, .mz-field select:focus, .mz-field textarea:focus { border-color:var(--blue); }
.mz-field-select-wrap { position:relative; }
.mz-field-select-wrap select { appearance:none; -webkit-appearance:none; padding-right:34px; cursor:pointer; }
.mz-field-select-wrap .mz-caret { position:absolute; right:13px; top:50%; transform:translateY(-50%); pointer-events:none; color:var(--muted-2); font-size:10px; }
.mz-file-drop { display:flex; align-items:center; gap:8px; background:#fff; border:1.5px dashed #C4D6EA; border-radius:13px; padding:11px 14px; cursor:pointer; font:600 12.5px/1 'Hanken Grotesk',sans-serif; color:var(--blue); }

/* ===== genel amaçlı modal ===== */
.mz-modal-overlay { display:none; position:fixed; inset:0; z-index:2000; background:rgba(8,22,40,.5); backdrop-filter:blur(10px) saturate(1.2); align-items:center; justify-content:center; padding:28px; }
.mz-modal-overlay.is-open { display:flex; animation:mzFade .2s ease; }
.mz-modal-card { width:100%; max-width:440px; max-height:88vh; overflow-y:auto; background:#FBFCFE; border:1px solid #E9EFF5; border-radius:26px; padding:28px; box-shadow:0 70px 140px -50px rgba(10,37,64,.55); animation:mzPop .22s cubic-bezier(.22,1,.36,1); }
.mz-modal-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:20px; }
.mz-modal-title-wrap { display:flex; align-items:center; gap:10px; }
.mz-modal-title { margin:0; font-family:'Bricolage Grotesque',sans-serif; font-weight:700; font-size:20px; color:var(--ink); }
.mz-modal-x { cursor:pointer; width:34px; height:34px; border-radius:11px; border:none; background:#F2F7FC; color:var(--muted); display:flex; align-items:center; justify-content:center; font-size:14px; flex-shrink:0; transition:background .15s; }
.mz-modal-x:hover { background:#E7F1FF; }

/* "+" popup (Kişiye Mesaj Gönder / Yeni Grup Oluştur / Yeni Topluluk Öner) — bkz. _MzLeftColumn.cshtml. */
.mz-compose-overlay { position:fixed; inset:0; background:rgba(6,24,44,.55); backdrop-filter:blur(5px); z-index:200; display:none; align-items:center; justify-content:center; padding:20px; }
.mz-compose-overlay.mz-open { display:flex; }
.mz-compose-card { width:100%; max-width:460px; max-height:88vh; overflow-y:auto; background:#fff; border-radius:28px; padding:32px; box-shadow:0 60px 130px -35px rgba(6,24,44,.6); animation:mzPop .22s cubic-bezier(.22,1,.36,1); }
.mz-eyebrow { font:700 10.5px/1 'Space Mono',monospace; letter-spacing:.16em; color:var(--muted-2); }
.mz-compose-x { cursor:pointer; width:34px; height:34px; border-radius:11px; border:none; background:#F2F7FC; color:var(--muted); font-size:15px; display:flex; align-items:center; justify-content:center; transition:background .15s; }
.mz-compose-x:hover { background:#E7F1FF; }
.mz-compose-back { cursor:pointer; background:none; border:none; color:var(--blue); font:700 12.5px/1 'Hanken Grotesk',sans-serif; padding:0 0 16px; display:flex; align-items:center; gap:5px; }

.mz-compose-choice { display:flex; align-items:center; gap:14px; width:100%; box-sizing:border-box; text-align:left; cursor:pointer; padding:17px; border-radius:19px; border:1.5px solid #EAF0F6; background:#fff; margin-bottom:12px; transition:transform .18s, box-shadow .18s, border-color .18s; }
.mz-compose-choice:hover { border-color:transparent; transform:translateY(-2px); box-shadow:0 18px 38px -18px rgba(10,37,64,.35); }
.mz-compose-choice-icon { flex-shrink:0; width:48px; height:48px; border-radius:15px; display:flex; align-items:center; justify-content:center; font-size:22px; box-shadow:0 10px 20px -8px rgba(10,37,64,.4); }
.mz-compose-choice-text { flex:1; min-width:0; display:flex; flex-direction:column; gap:3px; }
.mz-compose-choice-title { font:700 15px/1.2 'Hanken Grotesk',sans-serif; color:var(--ink); }
.mz-compose-choice-sub { font:500 12.5px/1.3 'Hanken Grotesk',sans-serif; color:var(--muted-2); }
.mz-compose-choice-arrow { flex-shrink:0; color:#C4D6EA; font-size:18px; transition:transform .18s, color .18s; }
.mz-compose-choice:hover .mz-compose-choice-arrow { transform:translateX(3px); color:var(--blue); }

.mz-compose-input { background:#F4F8FC; border:1.5px solid #EAF0F6; border-radius:13px; padding:13px 15px; font:500 14px/1.4 'Hanken Grotesk',sans-serif; color:var(--ink); width:100%; box-sizing:border-box; font-family:inherit; transition:border-color .15s, background .15s; }
.mz-compose-input:focus { outline:none; border-color:var(--blue); background:#fff; }
.mz-compose-submit { align-self:flex-start; margin-top:4px; background:linear-gradient(135deg,var(--blue),var(--blue-dark)); color:#fff; border:none; font:700 13.5px/1 'Hanken Grotesk',sans-serif; padding:13px 22px; border-radius:13px 13px 13px 5px; cursor:pointer; box-shadow:0 14px 28px -10px rgba(12,110,230,.55); transition:transform .15s; }
.mz-compose-submit:hover { transform:translateY(-2px); }

.mz-compose-results { display:flex; flex-direction:column; gap:2px; max-height:280px; overflow-y:auto; }
.mz-compose-result { display:flex; align-items:center; gap:10px; padding:9px 10px; border-radius:12px; cursor:pointer; transition:background .15s; }
.mz-compose-result:hover { background:#F1F6FB; }
.mz-compose-chip { display:inline-flex; align-items:center; gap:6px; background:#EAF2FE; color:var(--blue); font:700 12px/1 'Hanken Grotesk',sans-serif; padding:5px 10px 5px 6px; border-radius:999px; }
.mz-compose-chip button { border:none; background:none; cursor:pointer; color:var(--blue); font-size:14px; line-height:1; padding:0; }

/* ===== duyarlı davranış ===== */
@media (max-width:1180px) {
  .mz-split { grid-template-columns:1fr; }
  .mz-sidebar { position:static; }
}
@media (max-width:900px) {
  .mz-workspace { grid-template-columns:1fr; }
  .mz-switcher { display:none; }
  .mz-back { display:inline-flex !important; }
}
@media (max-width:560px) {
  .mz-page { padding-top:28px; }
  .mz-segtab { padding:10px 14px; font-size:13px; }
  .mz-cover-content { gap:12px; }
  .mz-cover-avatar-wrap span.mz-avatar { --sz:72px !important; }
}

/* style-hover portları */
.mz-join-btn { transition:transform .2s; }
.mz-join-btn:hover { transform:translateY(-2px); }
.mz-leave-btn { transition:transform .2s, box-shadow .2s; }
.mz-leave-btn:hover { transform:translateY(-2px); box-shadow:0 20px 38px -14px rgba(229,57,43,.6); }