/* ════════════════════════════════════════════════════════════
 * channels.css — B2.3 Kanal Oluştur modalı + B2.4 Kanal Ayarları paneli
 * ════════════════════════════════════════════════════════════ */

/* ── Ortak toggle ── */
.chc-toggle, .chs-toggle {
  flex-shrink:0; width:44px; height:26px; border-radius:14px; border:none; cursor:pointer;
  background:#80848e; padding:0; position:relative; transition:background .15s;
}
.chc-toggle.on, .chs-toggle.on { background:#23a55a; }
.chc-knob, .chs-knob {
  position:absolute; top:3px; left:3px; width:20px; height:20px; border-radius:50%;
  background:#fff; transition:transform .15s; box-shadow:0 1px 2px rgba(0,0,0,.3);
}
.chc-toggle.on .chc-knob, .chs-toggle.on .chs-knob { transform:translateX(18px); }

/* ════ Kanal Oluştur modalı ════ */
.chc-overlay {
  position:fixed; inset:0; z-index:700; display:none;
  align-items:center; justify-content:center; background:rgba(0,0,0,.6);
}
.chc-overlay.open { display:flex; }
.chc-modal {
  width:460px; max-width:94vw; max-height:90vh; overflow-y:auto;
  background:#313338; border-radius:8px; box-shadow:0 8px 24px rgba(0,0,0,.4);
}
.chc-head { display:flex; align-items:flex-start; padding:18px 16px 0 18px; }
.chc-title { font-size:20px; font-weight:700; color:#f2f3f5; }
.chc-sub { font-size:12px; color:#949ba4; margin-top:2px; }
.chc-head > div:first-child { flex:1; }
.chc-x { background:none; border:none; color:#b5bac1; font-size:18px; cursor:pointer; padding:4px; }
.chc-x:hover { color:#fff; }
.chc-body { padding:14px 18px 4px; }
.chc-label { font-size:12px; font-weight:700; letter-spacing:.02em; color:#b5bac1; text-transform:uppercase; margin-bottom:8px; }
.chc-types { display:flex; flex-direction:column; gap:8px; }
.chc-type {
  display:flex; align-items:center; gap:12px; padding:12px;
  background:#2b2d31; border-radius:8px; cursor:pointer; transition:background .1s;
}
.chc-type:hover { background:#35373c; }
.chc-type.active { background:#3c3f45; }
.chc-type-ic {
  width:32px; height:32px; flex-shrink:0; display:flex; align-items:center; justify-content:center;
  font-size:20px; color:#b5bac1;
}
.chc-type-txt { flex:1; min-width:0; }
.chc-type-t { font-size:16px; font-weight:600; color:#f2f3f5; }
.chc-type-d { font-size:13px; color:#b5bac1; }
.chc-radio { width:24px; height:24px; flex-shrink:0; border-radius:50%; border:2px solid #80848e; }
.chc-radio.on { border-color:#5865f2; background:radial-gradient(circle, #5865f2 0 7px, transparent 8px); }
.chc-name-row { display:flex; align-items:center; background:#1e1f22; border-radius:4px; overflow:hidden; }
.chc-name-pre { padding:0 10px; color:#949ba4; font-size:18px; }
.chc-name { flex:1; background:none; border:none; outline:none; padding:10px 10px 10px 0; color:#dbdee1; font-size:15px; }
.chc-priv { display:flex; align-items:center; gap:12px; margin-top:18px; padding:4px 0; cursor:pointer; }
.chc-priv-ic { font-size:20px; color:#b5bac1; }
.chc-priv-txt { flex:1; }
.chc-priv-t { font-size:15px; font-weight:600; color:#f2f3f5; }
.chc-priv-d { font-size:13px; color:#b5bac1; }
.chc-foot { display:flex; justify-content:flex-end; gap:8px; padding:16px 18px; background:#2b2d31; border-radius:0 0 8px 8px; margin-top:12px; }
.chc-btn { padding:10px 16px; border:none; border-radius:3px; font-size:14px; font-weight:500; cursor:pointer; }
.chc-cancel { background:none; color:#fff; }
.chc-cancel:hover { text-decoration:underline; }
.chc-create { background:#5865f2; color:#fff; }
.chc-create:hover { background:#4752c4; }

/* ════ Kanal Ayarları paneli ════ */
.chs-overlay { position:fixed; inset:0; z-index:650; background:#313338; display:none; flex-direction:row; }
.chs-overlay.open { display:flex; }
.chs-sidebar { width:218px; flex-shrink:0; background:#2b2d31; display:flex; flex-direction:column; padding:60px 6px 20px 0; align-items:flex-end; overflow-y:auto; }
.chs-srv { width:192px; font-size:12px; font-weight:700; color:#949ba4; text-transform:uppercase; padding:0 10px 8px; letter-spacing:.02em; }
.chs-nav { width:192px; display:flex; flex-direction:column; gap:2px; }
.chs-nav-btn { display:flex; align-items:center; gap:8px; width:100%; text-align:left; background:none; border:none; cursor:pointer; padding:8px 10px; border-radius:4px; font-size:15px; font-weight:500; color:#b5bac1; }
.chs-nav-btn span { flex:1; }
.chs-nav-btn:hover { background:rgba(255,255,255,.04); color:#dbdee1; }
.chs-nav-btn.active { background:rgba(255,255,255,.08); color:#fff; }
.chs-nav-btn.chs-del { color:#f23f43; }
.chs-nav-btn.chs-del:hover { background:rgba(242,63,67,.12); }
.chs-sep { height:1px; background:rgba(255,255,255,.06); margin:8px 10px; }
.chs-main { flex:1; display:flex; overflow:hidden; }
.chs-content { flex:1; overflow-y:auto; padding:60px 40px 80px; max-width:660px; }
.chs-close { display:flex; flex-direction:column; align-items:center; gap:4px; margin:16px; cursor:pointer; color:#b5bac1; flex-shrink:0; }
.chs-close:hover { color:#fff; }
.chs-close-c { width:40px; height:40px; border-radius:50%; border:2px solid #b5bac1; display:flex; align-items:center; justify-content:center; font-size:18px; }
.chs-close-l { font-size:12px; font-weight:700; }
.chs-h1 { font-size:20px; font-weight:700; color:#f2f3f5; margin-bottom:20px; }
.chs-label { display:block; font-size:12px; font-weight:700; letter-spacing:.02em; text-transform:uppercase; color:#b5bac1; margin:20px 0 8px; }
.chs-input { width:100%; box-sizing:border-box; background:#1e1f22; border:1px solid rgba(0,0,0,.3); border-radius:3px; padding:10px 12px; font-size:15px; color:#dbdee1; outline:none; }
.chs-input:focus { border-color:#5865f2; }
.chs-input[readonly] { opacity:.7; cursor:not-allowed; }
.chs-name-row { display:flex; align-items:center; background:#1e1f22; border:1px solid rgba(0,0,0,.3); border-radius:3px; overflow:hidden; }
.chs-name-row .chs-name-pre { padding:0 10px; color:#949ba4; font-size:18px; }
.chs-name-row .chs-input { border:none; background:none; }
.chs-select { cursor:pointer; }
.chs-topic-tools { display:flex; gap:2px; background:#2b2d31; border:1px solid rgba(0,0,0,.3); border-bottom:none; border-radius:4px 4px 0 0; padding:4px; }
.chs-topic-tools button { background:none; border:none; color:#b5bac1; cursor:pointer; width:30px; height:28px; border-radius:3px; font-size:14px; }
.chs-topic-tools button:hover { background:rgba(255,255,255,.06); color:#fff; }
.chs-topic { width:100%; box-sizing:border-box; min-height:110px; resize:vertical; background:#1e1f22; border:1px solid rgba(0,0,0,.3); border-radius:0 0 4px 4px; padding:10px 12px; font-size:15px; color:#dbdee1; outline:none; font-family:inherit; }
.chs-counter { text-align:right; font-size:12px; color:#949ba4; margin-top:4px; }
.chs-hint { font-size:13px; color:#949ba4; margin-top:8px; }
.chs-nsfw { display:flex; align-items:center; gap:12px; margin-top:24px; padding-top:20px; border-top:1px solid rgba(255,255,255,.06); }
.chs-nsfw-txt { flex:1; }
.chs-nsfw-t { font-size:16px; font-weight:600; color:#f2f3f5; }
.chs-nsfw-d { font-size:13px; color:#b5bac1; }
.chs-save-row { margin-top:28px; }
.chs-save { background:#5865f2; color:#fff; border:none; border-radius:3px; padding:10px 18px; font-size:14px; font-weight:500; cursor:pointer; }
.chs-save:hover { background:#4752c4; }
.chs-empty { color:#949ba4; font-size:14px; padding:20px 0; }

/* B7.1: emoji yönetim ızgarası (Sunucu Ayarları) */
.sso-emoji-grid { display:flex; flex-wrap:wrap; gap:10px; padding:16px 20px; }
.sso-emoji-item { display:flex; flex-direction:column; align-items:center; gap:4px; width:84px; padding:8px; background:#2b2d31; border-radius:8px; position:relative; }
.sso-emoji-item img { width:40px; height:40px; object-fit:contain; }
.sso-emoji-name { font-size:11px; color:#b5bac1; max-width:76px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sso-emoji-del { position:absolute; top:2px; right:2px; width:20px; height:20px; border:none; border-radius:50%; background:#f23f43; color:#fff; cursor:pointer; font-size:11px; line-height:1; display:none; }
.sso-emoji-item:hover .sso-emoji-del { display:block; }

/* B7.1: emoji seçicide özel emoji hücresi */
.rc-ep-emoji.rc-ep-custom { display:inline-flex; align-items:center; justify-content:center; }
.rc-ep-emoji.rc-ep-custom img { width:24px; height:24px; object-fit:contain; }

/* B2.6: davetler paneli */
.chs-inv-form { background:#2b2d31; border-radius:8px; padding:16px; }
.chs-inv-row { display:flex; gap:12px; }
.chs-inv-f { flex:1; }
.chs-inv-list { display:flex; flex-direction:column; gap:8px; }
.chs-inv-item { display:flex; align-items:center; gap:10px; background:#2b2d31; border-radius:6px; padding:10px 12px; }
.chs-inv-main { flex:1; min-width:0; }
.chs-inv-code { font-size:14px; color:#00a8fc; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.chs-inv-meta { font-size:12px; color:#949ba4; margin-top:2px; }
.chs-inv-copy { background:#5865f2; color:#fff; border:none; border-radius:4px; padding:6px 12px; font-size:13px; cursor:pointer; flex-shrink:0; }
.chs-inv-copy:hover { background:#4752c4; }
.chs-inv-del { background:transparent; color:#949ba4; border:none; cursor:pointer; font-size:15px; width:28px; height:28px; border-radius:4px; flex-shrink:0; }
.chs-inv-del:hover { background:rgba(242,63,67,.16); color:#f23f43; }

/* B1.9: zaman aşımı modalı */
.um-to-bg { position:fixed; inset:0; z-index:760; display:flex; align-items:center; justify-content:center; background:rgba(0,0,0,.6); }
.um-to-modal { width:420px; max-width:94vw; background:#313338; border-radius:8px; padding:18px; box-shadow:0 8px 24px rgba(0,0,0,.4); }
.um-to-head { font-size:18px; font-weight:700; color:#f2f3f5; margin-bottom:4px; }
.um-to-sub { font-size:13px; color:#b5bac1; margin-bottom:14px; }
.um-to-list { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.um-to-opt { background:#2b2d31; color:#dbdee1; border:1px solid rgba(0,0,0,.3); border-radius:4px; padding:10px; font-size:14px; cursor:pointer; }
.um-to-opt:hover { background:#5865f2; color:#fff; }
.um-to-foot { display:flex; justify-content:space-between; gap:8px; margin-top:14px; }
.um-to-clear { background:none; border:none; color:#f23f43; cursor:pointer; font-size:14px; }
.um-to-clear:hover { text-decoration:underline; }
.um-to-cancel { background:none; border:none; color:#fff; cursor:pointer; font-size:14px; }
.um-to-cancel:hover { text-decoration:underline; }

/* kanal satırı hover dişli (B2.4) */
.room-item .room-gear {
  flex-shrink:0; width:18px; height:18px; display:none;
  align-items:center; justify-content:center; color:#b5bac1; cursor:pointer; margin-left:4px;
}
.room-item:hover .room-gear { display:flex; }
.room-item .room-gear:hover { color:#fff; }

@media (max-width:768px){
  .chs-sidebar { width:140px; }
  .chs-srv,.chs-nav { width:128px; }
  .chs-content { padding:18px 14px 80px; }
  .room-item .room-gear { display:flex; } /* mobilde hep görünür */
}
/* B2.2: kanal sürükle-bırak */
.room-item.dragging { opacity:.45; }
.room-item.drop-before { box-shadow: inset 0 2px 0 0 #5865f2; }
.cat-head.cat-drop { background: rgba(88,101,242,.22); border-radius:4px; }

/* B5.4: özel durum (profil kartı + modal) */
.pc-custom-status { font-size:13px; color:var(--muted,#b5bac1); margin-top:2px; }
.cs-modal-bg { position:fixed; inset:0; z-index:780; display:flex; align-items:center; justify-content:center; background:rgba(0,0,0,.6); }
.cs-modal { width:440px; max-width:94vw; background:#313338; border-radius:8px; padding:18px; box-shadow:0 8px 24px rgba(0,0,0,.4); }
.cs-title { font-size:18px; font-weight:700; color:#f2f3f5; margin-bottom:12px; }
.cs-input { width:100%; box-sizing:border-box; background:#1e1f22; border:1px solid rgba(0,0,0,.3); border-radius:4px; padding:10px 12px; font-size:15px; color:#dbdee1; outline:none; }
.cs-input:focus { border-color:#5865f2; }
.cs-foot { display:flex; align-items:center; gap:8px; margin-top:14px; }
.cs-clear { background:none; border:none; color:#f23f43; cursor:pointer; font-size:14px; }
.cs-cancel { background:none; border:none; color:#fff; cursor:pointer; font-size:14px; }
.cs-save { background:#5865f2; color:#fff; border:none; border-radius:4px; padding:8px 16px; font-size:14px; font-weight:500; cursor:pointer; }
.cs-save:hover { background:#4752c4; }

/* B1.8: denetim günlüğü */
.adm-audit { display:flex; flex-direction:column; }
.adm-audit-row { display:flex; align-items:center; gap:12px; padding:10px 16px; border-bottom:1px solid rgba(255,255,255,.04); }
.aa-main { flex:1; min-width:0; }
.aa-line { font-size:14px; color:#dbdee1; }
.aa-detail { font-size:12px; color:#949ba4; margin-top:2px; }
.aa-time { font-size:12px; color:#949ba4; flex-shrink:0; white-space:nowrap; }

/* B7.3: dosya sürükle-bırak overlay */
.upload-drop-ov { position:absolute; inset:0; z-index:400; display:none; align-items:center; justify-content:center;
  background:rgba(88,101,242,.18); backdrop-filter:blur(2px); pointer-events:none; }
.upload-drop-ov.show { display:flex; }
.upload-drop-ov .udo-box { border:3px dashed #5865f2; border-radius:14px; padding:40px 60px; text-align:center;
  color:#fff; background:rgba(30,31,34,.85); }
.upload-drop-ov .udo-emoji { font-size:44px; }
.upload-drop-ov .udo-text { font-size:18px; font-weight:700; margin-top:8px; }

.chat{position:relative} /* B7.3 overlay anchor */

/* B1.5: kanal izin override (İzinler sekmesi) */
.chp-wrap { display:flex; gap:16px; }
.chp-list { width:200px; flex-shrink:0; display:flex; flex-direction:column; gap:2px; }
.chp-target { display:flex; align-items:center; gap:8px; padding:8px 10px; border-radius:4px; cursor:pointer; font-size:14px; color:#dbdee1; }
.chp-target:hover { background:rgba(255,255,255,.05); }
.chp-target.active { background:rgba(255,255,255,.10); color:#fff; }
.chp-dot { width:12px; height:12px; border-radius:50%; flex-shrink:0; }
.chp-rows { flex:1; min-width:0; }
.chp-row { display:flex; align-items:center; gap:12px; padding:12px 0; border-bottom:1px solid rgba(255,255,255,.05); }
.chp-name { flex:1; font-size:15px; color:#f2f3f5; }
.chp-tri { display:flex; gap:0; background:#1e1f22; border-radius:6px; overflow:hidden; }
.chp-b { width:40px; height:32px; border:none; background:transparent; color:#949ba4; cursor:pointer; font-size:15px; font-weight:700; }
.chp-b:hover { background:rgba(255,255,255,.06); }
.chp-deny.on { background:#f23f43; color:#fff; }
.chp-neu.on { background:#4e5058; color:#fff; }
.chp-allow.on { background:#23a55a; color:#fff; }

/* B3.7: çoklu mesaj seçimi */
body.msg-select-mode .msg { cursor:pointer; }
body.msg-select-mode .msg:hover { background:rgba(88,101,242,.10); }
.msg.sel { background:rgba(88,101,242,.20) !important; box-shadow:inset 3px 0 0 0 #5865f2; }
.msgsel-bar {
  position:fixed; bottom:20px; left:50%; transform:translateX(-50%); z-index:600;
  display:flex; align-items:center; gap:14px; background:#1e1f22; border:1px solid rgba(255,255,255,.08);
  padding:10px 16px; border-radius:10px; box-shadow:0 8px 24px rgba(0,0,0,.45);
}
.msgsel-count { color:#dbdee1; font-size:14px; font-weight:600; }
.msgsel-btn { border:none; border-radius:5px; padding:8px 16px; font-size:14px; font-weight:500; cursor:pointer; }
.msgsel-cancel { background:transparent; color:#fff; }
.msgsel-cancel:hover { text-decoration:underline; }
.msgsel-fwd { background:#5865f2; color:#fff; }
.msgsel-fwd:hover { background:#4752c4; }