/* ==========================================================================
   İletişim: bildirim zili, bildirim kartları, duyuru bandı/penceresi,
   ekip sohbeti (yüzen panel + Mesajlar), Bildirim Merkezi.
   Önek: cm-   Koyu tema: [data-bs-theme="dark"]
   ========================================================================== */
:root {
    --cm-surface: #ffffff;
    --cm-surface-2: #f8fafc;
    --cm-surface-3: #f1f5f9;
    --cm-line: #e2e8f0;
    --cm-line-strong: #cbd5e1;
    --cm-ink: #0f172a;
    --cm-ink-2: #334155;
    --cm-muted: #64748b;
    --cm-accent: #2563eb;
    --cm-accent-ink: #ffffff;
    --cm-accent-soft: #eff6ff;
    --cm-accent-line: #bfdbfe;
    --cm-info: #2563eb;
    --cm-info-soft: #eff6ff;
    --cm-important: #b45309;
    --cm-important-soft: #fffbeb;
    --cm-critical: #b91c1c;
    --cm-critical-soft: #fef2f2;
    --cm-ok: #047857;
    --cm-ok-soft: #ecfdf5;
    --cm-mine: #2563eb;
    --cm-mine-ink: #ffffff;
    --cm-theirs: #f1f5f9;
    --cm-shadow: 0 12px 32px rgba(15, 23, 42, .16), 0 2px 6px rgba(15, 23, 42, .08);
    --cm-shadow-sm: 0 2px 8px rgba(15, 23, 42, .08);
    --cm-radius: 12px;
}

[data-bs-theme="dark"] {
    --cm-surface: #1e293b;
    --cm-surface-2: #172033;
    --cm-surface-3: #243248;
    --cm-line: #334155;
    --cm-line-strong: #475569;
    --cm-ink: #e8eef6;
    --cm-ink-2: #cbd5e1;
    --cm-muted: #a8b8cc;
    --cm-accent: #60a5fa;
    --cm-accent-ink: #0b1220;
    --cm-accent-soft: #1e3a5f;
    --cm-accent-line: #2f5b8f;
    --cm-info: #86c9ef;
    --cm-info-soft: #163a50;
    --cm-important: #f3c36b;
    --cm-important-soft: #45371e;
    --cm-critical: #ff9c99;
    --cm-critical-soft: #472627;
    --cm-ok: #69d69d;
    --cm-ok-soft: #173e2d;
    --cm-mine: #2f5b8f;
    --cm-mine-ink: #f1f5f9;
    --cm-theirs: #243248;
    --cm-shadow: 0 12px 32px rgba(0, 0, 0, .45);
    --cm-shadow-sm: 0 2px 8px rgba(0, 0, 0, .35);
}

/* ---------- ortak ---------- */
.cm-muted { color: var(--cm-muted); font-size: .78rem; }
.cm-link { background: none; border: 0; padding: 0; color: var(--cm-accent); font-size: .78rem; font-weight: 600; cursor: pointer; white-space: nowrap; }
.cm-link:disabled { color: var(--cm-muted); cursor: default; opacity: .6; }
.cm-scrim { position: fixed; inset: 0; z-index: 1069; background: transparent; }
.cm-scrim--clear { z-index: 20; }
.cm-input { width: 100%; border: 1px solid var(--cm-line-strong); border-radius: 8px; background: var(--cm-surface); color: var(--cm-ink); padding: .45rem .65rem; font-size: .85rem; outline: none; transition: border-color .15s, box-shadow .15s; }
.cm-input:focus { border-color: var(--cm-accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--cm-accent) 18%, transparent); }
.cm-input--area { resize: vertical; min-height: 120px; line-height: 1.5; }
.cm-btn { display: inline-flex; align-items: center; gap: .4rem; border: 1px solid transparent; border-radius: 8px; padding: .42rem .8rem; font-size: .8rem; font-weight: 600; cursor: pointer; white-space: nowrap; transition: background .15s, border-color .15s, color .15s; }
.cm-btn:disabled { opacity: .5; cursor: not-allowed; }
.cm-btn--primary { background: var(--cm-accent); color: var(--cm-accent-ink); }
.cm-btn--primary:hover:not(:disabled) { filter: brightness(1.06); }
.cm-btn--quiet { background: var(--cm-surface); color: var(--cm-ink-2); border-color: var(--cm-line-strong); }
.cm-btn--quiet:hover:not(:disabled) { background: var(--cm-surface-3); }
.cm-btn--danger-quiet { background: transparent; color: var(--cm-critical); border-color: color-mix(in srgb, var(--cm-critical) 35%, transparent); }
.cm-btn--danger-quiet:hover:not(:disabled) { background: var(--cm-critical-soft); }
.cm-iconbtn { width: 32px; height: 32px; flex: 0 0 32px; display: inline-flex; align-items: center; justify-content: center; border: 0; border-radius: 8px; background: transparent; color: var(--cm-muted); cursor: pointer; font-size: .85rem; }
.cm-iconbtn:hover, .cm-iconbtn.is-active { background: var(--cm-surface-3); color: var(--cm-ink); }
.cm-chip { display: inline-flex; align-items: center; gap: .25rem; padding: .05rem .45rem; border-radius: 999px; font-size: .68rem; font-weight: 700; background: var(--cm-surface-3); color: var(--cm-ink-2); white-space: nowrap; }
.cm-chip.is-info { background: var(--cm-info-soft); color: var(--cm-info); }
.cm-chip.is-important { background: var(--cm-important-soft); color: var(--cm-important); }
.cm-chip.is-critical { background: var(--cm-critical-soft); color: var(--cm-critical); }
.cm-chip.is-ok { background: var(--cm-ok-soft); color: var(--cm-ok); }
.cm-count { min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--cm-accent); color: var(--cm-accent-ink); font-size: .7rem; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; }
.cm-count.is-soft { background: var(--cm-surface-3); color: var(--cm-muted); }
.cm-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--cm-accent); flex: 0 0 8px; align-self: center; }
.cm-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .5rem; padding: 2.5rem 1rem; color: var(--cm-muted); font-size: .85rem; text-align: center; }
.cm-empty > i { font-size: 1.6rem; opacity: .5; }
.cm-empty--soft { padding: 1.5rem 1rem; }
.cm-empty--hero { height: 100%; min-height: 320px; }
.cm-empty--hero strong { color: var(--cm-ink-2); font-size: .95rem; }
.cm-empty__art { width: 64px; height: 64px; border-radius: 50%; background: var(--cm-accent-soft); color: var(--cm-accent); display: flex; align-items: center; justify-content: center; font-size: 1.6rem; }
.cm-inline-error { margin: .4rem .75rem; padding: .45rem .65rem; border-radius: 8px; background: var(--cm-critical-soft); color: var(--cm-critical); font-size: .78rem; }
.cm-seg { display: inline-flex; gap: 2px; padding: 3px; border-radius: 10px; background: var(--cm-surface-3); }
.cm-seg > button { border: 0; background: transparent; color: var(--cm-muted); font-size: .78rem; font-weight: 600; padding: .32rem .7rem; border-radius: 8px; cursor: pointer; display: inline-flex; align-items: center; gap: .35rem; }
.cm-seg > button.is-active { background: var(--cm-surface); color: var(--cm-ink); box-shadow: var(--cm-shadow-sm); }
.cm-seg > button:disabled { opacity: .45; cursor: not-allowed; }
.cm-seg > button em { font-style: normal; min-width: 18px; padding: 0 5px; border-radius: 999px; background: var(--cm-accent); color: var(--cm-accent-ink); font-size: .65rem; }
.cm-seg > button em.is-soft { background: var(--cm-line); color: var(--cm-muted); }
.cm-seg > button.is-critical.is-active { color: var(--cm-critical); }
.cm-seg > button.is-important.is-active { color: var(--cm-important); }
.cm-seg > button.is-info.is-active { color: var(--cm-info); }
.cm-seg--tabs { display: flex; width: 100%; }
.cm-seg--tabs > button { flex: 1; justify-content: center; }

/* ---------- avatar ve çevrimiçi ---------- */
.cm-avatar { position: relative; width: 38px; height: 38px; flex: 0 0 38px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: .78rem; font-weight: 700; letter-spacing: .02em; color: #fff; background: #64748b; }
.cm-avatar--sm { width: 30px; height: 30px; flex-basis: 30px; font-size: .66rem; }
.cm-avatar--xs { width: 22px; height: 22px; flex-basis: 22px; font-size: .58rem; margin-right: .4rem; vertical-align: middle; }
.cm-avatar--group { background: var(--cm-accent-soft); color: var(--cm-accent); font-size: .85rem; }
.cm-tone-0 { background: #2563eb; } .cm-tone-1 { background: #7c3aed; } .cm-tone-2 { background: #0891b2; } .cm-tone-3 { background: #059669; }
.cm-tone-4 { background: #c2410c; } .cm-tone-5 { background: #be185d; } .cm-tone-6 { background: #4f46e5; } .cm-tone-7 { background: #0f766e; }
.cm-ink-0 { color: #2563eb; } .cm-ink-1 { color: #7c3aed; } .cm-ink-2 { color: #0891b2; } .cm-ink-3 { color: #059669; }
.cm-ink-4 { color: #c2410c; } .cm-ink-5 { color: #be185d; } .cm-ink-6 { color: #4f46e5; } .cm-ink-7 { color: #0f766e; }
.cm-presence { position: absolute; right: -1px; bottom: -1px; width: 11px; height: 11px; border-radius: 50%; border: 2px solid var(--cm-surface); background: #94a3b8; }
.cm-avatar--sm .cm-presence { width: 9px; height: 9px; }
.cm-presence.is-online { background: #16a34a; }
.cm-presence.is-idle { background: #f59e0b; }
.cm-presence.is-away { background: #f97316; }
.cm-presence.is-offline { background: transparent; border-color: var(--cm-surface); box-shadow: inset 0 0 0 2px #94a3b8; }

/* ---------- üst çubuk: zil + sohbet ---------- */
.cm-bell { position: relative; display: inline-flex; gap: .4rem; }
.cm-topbtn { position: relative; border: 1px solid var(--bs-border-color, #6c757d); border-radius: .25rem; background: transparent; color: var(--bs-secondary-color, #6c757d); padding: .5rem .75rem; line-height: 1; font-size: 14px; cursor: pointer; }
.cm-topbtn:hover { background: var(--cm-surface-3); color: var(--cm-ink); }
.cm-badge { position: absolute; top: -7px; right: -8px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: #dc2626; color: #fff; font-size: .66rem; font-weight: 700; display: inline-flex; align-items: center; justify-content: center; box-shadow: 0 0 0 2px var(--cm-surface); }
.cm-badge--chat { background: var(--cm-accent); color: #fff; }
.cm-panel { position: absolute; top: calc(100% + 8px); right: 0; z-index: 1070; width: 400px; max-width: calc(100vw - 24px); max-height: min(560px, calc(100vh - 80px)); display: flex; flex-direction: column; background: var(--cm-surface); border: 1px solid var(--cm-line); border-radius: var(--cm-radius); box-shadow: var(--cm-shadow); overflow: hidden; }
.cm-panel__head { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding: .85rem 1rem .6rem; }
.cm-panel__head strong { display: block; color: var(--cm-ink); font-size: .95rem; }
.cm-panel > .cm-seg { margin: 0 1rem .5rem; }
.cm-panel__list { overflow-y: auto; flex: 1; border-top: 1px solid var(--cm-line); }
.cm-panel__foot { display: flex; gap: 1rem; align-items: center; padding: .6rem 1rem; border-top: 1px solid var(--cm-line); background: var(--cm-surface-2); font-size: .8rem; font-weight: 600; }
.cm-panel__foot a { color: var(--cm-accent); text-decoration: none; }
.cm-panel__foot a:last-child { margin-left: auto; color: var(--cm-muted); }

.cm-item { width: 100%; display: flex; gap: .7rem; align-items: flex-start; text-align: left; padding: .7rem 1rem; border: 0; border-bottom: 1px solid var(--cm-line); border-left: 3px solid transparent; background: var(--cm-surface); color: var(--cm-ink); cursor: pointer; }
.cm-item:hover { background: var(--cm-surface-2); }
.cm-item.is-unread { background: color-mix(in srgb, var(--cm-accent-soft) 55%, var(--cm-surface)); }
.cm-item.is-important { border-left-color: var(--cm-important); }
.cm-item.is-critical { border-left-color: var(--cm-critical); }
.cm-item__icon { width: 32px; height: 32px; flex: 0 0 32px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center; background: var(--cm-info-soft); color: var(--cm-info); font-size: .85rem; }
.is-important > .cm-item__icon, .cm-item__icon.is-important { background: var(--cm-important-soft); color: var(--cm-important); }
.is-critical > .cm-item__icon, .cm-item__icon.is-critical { background: var(--cm-critical-soft); color: var(--cm-critical); }
.cm-item__body, .cm-row__body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .15rem; }
.cm-item__top { display: flex; justify-content: space-between; gap: .5rem; align-items: baseline; }
.cm-item__title { font-weight: 600; font-size: .84rem; color: var(--cm-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.is-unread .cm-item__title { font-weight: 700; }
.cm-item__top time { color: var(--cm-muted); font-size: .7rem; white-space: nowrap; }
.cm-item__text { color: var(--cm-ink-2); font-size: .78rem; line-height: 1.4; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; white-space: pre-line; }
.cm-item__meta { display: flex; flex-wrap: wrap; gap: .35rem; align-items: center; color: var(--cm-muted); font-size: .7rem; }

/* ---------- bildirim kartları (toast) ---------- */
.cm-toasts { position: fixed; top: 62px; right: 16px; z-index: 1090; display: flex; flex-direction: column; gap: .6rem; width: 360px; max-width: calc(100vw - 24px); pointer-events: none; }
.cm-toast { pointer-events: auto; display: flex; gap: .65rem; align-items: flex-start; padding: .75rem .6rem .75rem .8rem; background: var(--cm-surface); border: 1px solid var(--cm-line); border-left: 4px solid var(--cm-info); border-radius: var(--cm-radius); box-shadow: var(--cm-shadow); animation: cm-in .22s ease-out; }
.cm-toast.is-important { border-left-color: var(--cm-important); }
.cm-toast.is-critical { border-left-color: var(--cm-critical); }
.cm-toast.is-chat { border-left-color: var(--cm-accent); }
.cm-toast--static { animation: none; box-shadow: var(--cm-shadow-sm); }
.cm-toast__icon { width: 34px; height: 34px; flex: 0 0 34px; border-radius: 9px; display: inline-flex; align-items: center; justify-content: center; background: var(--cm-info-soft); color: var(--cm-info); }
.cm-toast.is-important .cm-toast__icon { background: var(--cm-important-soft); color: var(--cm-important); }
.cm-toast.is-critical .cm-toast__icon { background: var(--cm-critical-soft); color: var(--cm-critical); }
.cm-toast__body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .1rem; border: 0; background: none; padding: 0; text-align: left; color: var(--cm-ink); cursor: pointer; }
.cm-toast__eyebrow { font-size: .68rem; font-weight: 700; color: var(--cm-muted); text-transform: uppercase; letter-spacing: .04em; }
.cm-toast__body strong { font-size: .85rem; }
.cm-toast__text { font-size: .78rem; color: var(--cm-ink-2); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; white-space: pre-line; }
.cm-toast__close { border: 0; background: none; color: var(--cm-muted); width: 24px; height: 24px; border-radius: 6px; cursor: pointer; }
.cm-toast__close:hover { background: var(--cm-surface-3); color: var(--cm-ink); }
@keyframes cm-in { from { transform: translateY(-6px); opacity: 0; } to { transform: none; opacity: 1; } }

/* ---------- onay isteyen pencere ---------- */
.cm-modal-backdrop { position: fixed; inset: 0; z-index: 1095; background: rgba(15, 23, 42, .45); backdrop-filter: blur(2px); }
.cm-modal { position: fixed; z-index: 1096; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 560px; max-width: calc(100vw - 24px); max-height: calc(100vh - 48px); display: flex; flex-direction: column; background: var(--cm-surface); border-radius: 14px; box-shadow: var(--cm-shadow); border-top: 5px solid var(--cm-info); overflow: hidden; }
.cm-modal.is-important { border-top-color: var(--cm-important); }
.cm-modal.is-critical { border-top-color: var(--cm-critical); }
.cm-modal--inline { position: static; transform: none; width: 100%; max-height: none; }
.cm-modal__head, .cm-detail__head { display: flex; gap: .85rem; align-items: flex-start; padding: 1.1rem 1.25rem .6rem; }
.cm-modal__head h2, .cm-detail__head h2 { margin: .15rem 0 .1rem; font-size: 1.1rem; font-weight: 700; color: var(--cm-ink); line-height: 1.3; }
.cm-detail__head > div { flex: 1; min-width: 0; }
.cm-modal__icon { width: 42px; height: 42px; flex: 0 0 42px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; font-size: 1.05rem; background: var(--cm-info-soft); color: var(--cm-info); }
.cm-modal.is-important .cm-modal__icon, .cm-modal__icon.is-important { background: var(--cm-important-soft); color: var(--cm-important); }
.cm-modal.is-critical .cm-modal__icon, .cm-modal__icon.is-critical { background: var(--cm-critical-soft); color: var(--cm-critical); }
.cm-modal__eyebrow { display: flex; flex-wrap: wrap; gap: .3rem; align-items: center; font-size: .72rem; font-weight: 700; color: var(--cm-muted); text-transform: uppercase; letter-spacing: .04em; }
.cm-modal__body, .cm-detail__body { padding: .4rem 1.25rem 1rem; color: var(--cm-ink-2); font-size: .9rem; line-height: 1.6; white-space: pre-wrap; overflow-y: auto; }
.cm-modal__foot, .cm-detail__foot { display: flex; justify-content: flex-end; gap: .5rem; padding: .8rem 1.25rem; border-top: 1px solid var(--cm-line); background: var(--cm-surface-2); }


/* ---------- yüzen sohbet düğmesi ve paneli ---------- */
.cm-dock { position: fixed; right: 18px; bottom: 18px; z-index: 1060; display: flex; align-items: center; gap: 6px; transition: transform .28s cubic-bezier(.22, 1, .36, 1); }
.cm-dock.is-hidden { transform: translateX(calc(100% - 16px)); }
.cm-dock__handle { width: 18px; height: 40px; border: 1px solid var(--cm-line-strong); border-right: 0; border-radius: 8px 0 0 8px; background: var(--cm-surface); color: var(--cm-muted); font-size: 10px; padding: 0; cursor: pointer; box-shadow: var(--cm-shadow-sm); opacity: 0; transition: opacity .2s; }
.cm-dock:hover .cm-dock__handle, .cm-dock.is-hidden .cm-dock__handle { opacity: 1; }
.cm-dock__fab { position: relative; width: 46px; height: 46px; border-radius: 50%; border: 0; background: var(--cm-accent); color: var(--cm-accent-ink); font-size: 1.05rem; cursor: pointer; box-shadow: 0 6px 18px color-mix(in srgb, var(--cm-accent) 40%, transparent); transition: transform .15s; }
.cm-dock__fab:hover { transform: scale(1.06); }
.cm-dock__fab .cm-badge { top: -4px; right: -4px; }
.cm-chatpanel { position: fixed; right: 18px; bottom: 74px; z-index: 1061; width: 390px; height: min(600px, calc(100vh - 120px)); max-width: calc(100vw - 24px); display: flex; flex-direction: column; background: var(--cm-surface); border: 1px solid var(--cm-line); border-radius: 14px; box-shadow: var(--cm-shadow); overflow: hidden; animation: cm-in .2s ease-out; }
.cm-chatpanel__head { display: flex; align-items: baseline; gap: .5rem; padding: .75rem .75rem .5rem 1rem; }
.cm-chatpanel__head strong { font-size: 1rem; color: var(--cm-ink); }
.cm-chatpanel__tools { margin-left: auto; display: inline-flex; gap: .15rem; }
body.mobile-menu-open .cm-dock, body.mobile-menu-open .cm-chatpanel, .page.mobile-menu-open ~ .cm-dock { display: none !important; }
@media (max-width: 576px) {
    .cm-dock { right: 12px; bottom: 12px; }
    .cm-chatpanel { right: 0; left: 0; bottom: 0; top: 56px; width: auto; height: auto; max-width: none; border-radius: 14px 14px 0 0; }
    .cm-toasts { left: 12px; right: 12px; width: auto; }
}

/* ---------- konuşma listesi ---------- */
.cm-inbox { display: flex; flex-direction: column; flex: 1; min-height: 0; }
.cm-inbox__search { position: relative; display: flex; align-items: center; gap: .35rem; padding: 0 .75rem .5rem; }
.cm-inbox__search > i { position: absolute; left: 1.35rem; color: var(--cm-muted); font-size: .78rem; pointer-events: none; }
.cm-inbox__search .cm-input { padding-left: 2rem; border-radius: 999px; background: var(--cm-surface-2); }
.cm-inbox > .cm-seg { margin: 0 .75rem .4rem; }
.cm-inbox__list { flex: 1; overflow-y: auto; padding: 0 .35rem .5rem; }
.cm-inbox__section { padding: .6rem .7rem .25rem; font-size: .68rem; font-weight: 700; color: var(--cm-muted); text-transform: uppercase; letter-spacing: .05em; }
.cm-conv { width: 100%; display: flex; align-items: center; gap: .65rem; padding: .55rem .6rem; border: 0; border-radius: 10px; background: transparent; color: var(--cm-ink); text-align: left; cursor: pointer; }
.cm-conv:hover { background: var(--cm-surface-2); }
.cm-conv.is-selected { background: var(--cm-accent-soft); }
.cm-conv:disabled { cursor: default; opacity: .6; }
.cm-conv__body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: .1rem; }
.cm-conv__top { display: flex; justify-content: space-between; gap: .5rem; align-items: baseline; }
.cm-conv__top strong { font-size: .85rem; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cm-conv.is-unread .cm-conv__top strong { font-weight: 800; }
.cm-conv__top time, .cm-status { font-size: .7rem; color: var(--cm-muted); white-space: nowrap; }
.cm-conv__preview { font-size: .76rem; color: var(--cm-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cm-conv.is-unread .cm-conv__preview { color: var(--cm-ink-2); font-weight: 600; }
.cm-conv__go { color: var(--cm-muted); opacity: 0; transition: opacity .15s; }
.cm-conv:hover .cm-conv__go { opacity: 1; }
.cm-newgroup { margin: 0 .75rem .6rem; padding: .65rem; border: 1px solid var(--cm-line); border-radius: 10px; background: var(--cm-surface-2); display: flex; flex-direction: column; gap: .5rem; }
.cm-newgroup__actions { display: flex; justify-content: flex-end; gap: .4rem; }

/* ---------- konuşma ---------- */
.cm-thread { display: flex; flex-direction: column; flex: 1; min-height: 0; height: 100%; background: var(--cm-surface); }
.cm-thread--empty { justify-content: center; }
.cm-thread__head { display: flex; align-items: center; gap: .6rem; padding: .6rem .6rem .6rem .75rem; border-bottom: 1px solid var(--cm-line); }
.cm-thread__title { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.cm-thread__title strong { font-size: .92rem; color: var(--cm-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cm-thread__title .cm-muted { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cm-thread__tools { display: inline-flex; gap: .1rem; }
.cm-typing { color: var(--cm-accent); font-weight: 600; }
.cm-typing__dots { display: inline-flex; gap: 2px; margin-left: 3px; }
.cm-typing__dots i { width: 4px; height: 4px; border-radius: 50%; background: currentColor; animation: cm-blink 1.2s infinite; }
.cm-typing__dots i:nth-child(2) { animation-delay: .2s; } .cm-typing__dots i:nth-child(3) { animation-delay: .4s; }
@keyframes cm-blink { 0%, 80%, 100% { opacity: .25; } 40% { opacity: 1; } }
.cm-thread__messages { flex: 1; overflow-y: auto; padding: .75rem .85rem; display: flex; flex-direction: column; gap: 2px; background: var(--cm-surface-2); }
.cm-loadmore { align-self: center; margin: .25rem 0 .5rem; border: 1px solid var(--cm-line); background: var(--cm-surface); color: var(--cm-ink-2); border-radius: 999px; padding: .25rem .8rem; font-size: .74rem; cursor: pointer; }
.cm-day { display: flex; justify-content: center; margin: .75rem 0 .4rem; }
.cm-day span { font-size: .7rem; font-weight: 600; color: var(--cm-muted); background: var(--cm-surface); border: 1px solid var(--cm-line); padding: .1rem .65rem; border-radius: 999px; }
.cm-sysline { align-self: center; margin: .35rem 0; font-size: .72rem; color: var(--cm-muted); text-align: center; }
.cm-msg { display: flex; gap: .4rem; max-width: 100%; }
.cm-msg.starts-run { margin-top: .45rem; }
.cm-msg.is-mine { justify-content: flex-end; }
.cm-msg__avatar { width: 30px; flex: 0 0 30px; display: flex; align-items: flex-end; }
.cm-msg__bubble { max-width: 78%; padding: .45rem .65rem .3rem; border-radius: 14px; background: var(--cm-theirs); color: var(--cm-ink); box-shadow: 0 1px 1px rgba(15, 23, 42, .05); display: flex; flex-direction: column; gap: .2rem; }
.cm-thread.is-compact .cm-msg__bubble { max-width: 84%; }
.cm-msg.is-theirs.starts-run .cm-msg__bubble { border-top-left-radius: 4px; }
.cm-msg.is-mine .cm-msg__bubble { background: var(--cm-mine); color: var(--cm-mine-ink); }
.cm-msg.is-mine.starts-run .cm-msg__bubble { border-top-right-radius: 4px; }
.cm-msg__delete { align-self: center; border: 0; background: none; color: var(--cm-muted); width: 26px; height: 26px; border-radius: 6px; opacity: 0; cursor: pointer; font-size: .72rem; }
.cm-msg:hover .cm-msg__delete, .cm-msg__delete:focus-visible { opacity: 1; }
.cm-msg__delete:hover { background: var(--cm-critical-soft); color: var(--cm-critical); }
.cm-msg__sender { font-size: .72rem; font-weight: 700; }
.cm-msg__text { font-size: .85rem; line-height: 1.45; white-space: pre-wrap; word-break: break-word; }
.cm-msg__meta { align-self: flex-end; display: inline-flex; gap: .3rem; align-items: center; font-size: .64rem; opacity: .75; }
.cm-receipt { font-size: .66rem; }
.cm-receipt.is-read { color: #86efac; opacity: 1; }
.cm-msg.is-theirs .cm-receipt.is-read { color: var(--cm-ok); }
.cm-seenby { align-self: flex-end; font-size: .66rem; color: var(--cm-muted); margin: .1rem .2rem 0; }
.cm-linkcard { display: flex; align-items: center; gap: .55rem; padding: .45rem .55rem; border-radius: 10px; background: var(--cm-surface); color: var(--cm-ink); text-decoration: none; border: 1px solid var(--cm-line); min-width: 210px; }
.cm-linkcard:hover { border-color: var(--cm-accent); color: var(--cm-ink); }
.cm-linkcard__icon { width: 30px; height: 30px; flex: 0 0 30px; border-radius: 8px; background: var(--cm-accent-soft); color: var(--cm-accent); display: inline-flex; align-items: center; justify-content: center; font-size: .8rem; }
.cm-linkcard__body { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.cm-linkcard__body strong { font-size: .8rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cm-linkcard__body span { font-size: .68rem; color: var(--cm-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cm-linkcard__go { color: var(--cm-accent); font-size: .75rem; }
.cm-attach { display: flex; align-items: center; gap: .5rem; margin: .4rem .75rem 0; padding: .4rem .5rem; border: 1px dashed var(--cm-accent-line); border-radius: 10px; background: var(--cm-accent-soft); }
.cm-attach__body { flex: 1; min-width: 0; display: flex; flex-direction: column; font-size: .75rem; }
.cm-attach__body span { color: var(--cm-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cm-composer { display: flex; align-items: flex-end; gap: .4rem; padding: .55rem .6rem; border-top: 1px solid var(--cm-line); background: var(--cm-surface); }
.cm-composer__share { position: relative; }
.cm-composer__input { flex: 1; resize: none; border: 1px solid var(--cm-line-strong); border-radius: 18px; padding: .5rem .85rem; font-size: .86rem; line-height: 1.4; max-height: 144px; background: var(--cm-surface-2); color: var(--cm-ink); outline: none; }
.cm-composer__input:focus { border-color: var(--cm-accent); background: var(--cm-surface); }
.cm-sendbtn { width: 38px; height: 38px; flex: 0 0 38px; border-radius: 50%; border: 0; background: var(--cm-accent); color: var(--cm-accent-ink); cursor: pointer; }
.cm-sendbtn:disabled { background: var(--cm-line-strong); color: var(--cm-surface); cursor: default; }
.cm-menu { position: absolute; bottom: calc(100% + 6px); left: 0; z-index: 30; width: 290px; max-height: 320px; overflow-y: auto; padding: .35rem; background: var(--cm-surface); border: 1px solid var(--cm-line); border-radius: 12px; box-shadow: var(--cm-shadow); }
.cm-menu button { width: 100%; display: flex; gap: .6rem; align-items: center; padding: .45rem .55rem; border: 0; background: none; border-radius: 8px; text-align: left; color: var(--cm-ink); cursor: pointer; }
.cm-menu button:hover { background: var(--cm-surface-3); }
.cm-menu button > i { width: 26px; color: var(--cm-accent); text-align: center; }
.cm-menu button span { display: flex; flex-direction: column; min-width: 0; }
.cm-menu button strong { font-size: .8rem; }
.cm-menu button small { font-size: .7rem; color: var(--cm-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cm-menu__empty { display: block; padding: .6rem; font-size: .78rem; color: var(--cm-muted); }
.cm-members { padding: .65rem .75rem; border-bottom: 1px solid var(--cm-line); background: var(--cm-surface-2); display: flex; flex-direction: column; gap: .5rem; max-height: 55%; overflow-y: auto; }
.cm-members__row { display: flex; gap: .4rem; align-items: center; }
.cm-members__row--end { justify-content: space-between; }
.cm-members__list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .3rem; }
.cm-members__list li { display: flex; align-items: center; gap: .5rem; font-size: .8rem; }
.cm-members__name { font-weight: 600; color: var(--cm-ink); }

/* ---------- kişi seçici ---------- */
.cm-picker { position: relative; }
.cm-picker__field { display: flex; flex-wrap: wrap; gap: .3rem; align-items: center; min-height: 38px; padding: .25rem .4rem; border: 1px solid var(--cm-line-strong); border-radius: 8px; background: var(--cm-surface); cursor: text; }
.cm-picker__input { flex: 1; min-width: 120px; border: 0; outline: none; background: transparent; color: var(--cm-ink); font-size: .82rem; padding: .2rem; }
.cm-picker__menu { position: absolute; z-index: 30; top: calc(100% + 4px); left: 0; right: 0; max-height: 260px; overflow-y: auto; padding: .3rem; background: var(--cm-surface); border: 1px solid var(--cm-line); border-radius: 10px; box-shadow: var(--cm-shadow); }
.cm-picker__menu button { width: 100%; display: flex; align-items: center; gap: .55rem; padding: .4rem .5rem; border: 0; border-radius: 8px; background: none; color: var(--cm-ink); text-align: left; cursor: pointer; }
.cm-picker__menu button:hover { background: var(--cm-surface-3); }
.cm-picker__menu button.is-selected { background: var(--cm-accent-soft); }
.cm-picker__menu button > i { color: var(--cm-accent); }
.cm-picker__text { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.cm-picker__text strong { font-size: .8rem; }
.cm-picker__text small { font-size: .7rem; color: var(--cm-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cm-token { display: inline-flex; align-items: center; gap: .3rem; padding: .12rem .2rem .12rem .55rem; border-radius: 999px; background: var(--cm-accent-soft); color: var(--cm-accent); font-size: .74rem; font-weight: 600; }
.cm-token button { border: 0; background: none; color: inherit; width: 18px; height: 18px; border-radius: 50%; font-size: .65rem; cursor: pointer; }
.cm-token button:hover { background: color-mix(in srgb, var(--cm-accent) 18%, transparent); }

/* ---------- Mesajlar sayfası ---------- */
.cm-workspace, .cm-center { padding: .75rem 0 1rem; color: var(--cm-ink); }
.cm-workspace__head, .cm-center__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: .85rem; }
.cm-workspace__head h1, .cm-center__head h1 { margin: 0; font-size: 1.3rem; font-weight: 700; display: flex; align-items: center; gap: .5rem; color: var(--cm-ink); }
.cm-workspace__head h1 i, .cm-center__head h1 i { color: var(--cm-accent); }
.cm-workspace__stats { display: flex; gap: 1.25rem; font-size: .8rem; color: var(--cm-muted); }
.cm-workspace__stats strong { color: var(--cm-ink); font-size: 1rem; margin-right: .2rem; }
.cm-workspace__body { display: grid; grid-template-columns: 340px 1fr; height: calc(100vh - 170px); min-height: 480px; border: 1px solid var(--cm-line); border-radius: 14px; overflow: hidden; background: var(--cm-surface); box-shadow: var(--cm-shadow-sm); }
.cm-workspace__inbox { border-right: 1px solid var(--cm-line); display: flex; flex-direction: column; min-height: 0; padding-top: .75rem; background: var(--cm-surface); }
.cm-workspace__thread { display: flex; flex-direction: column; min-height: 0; }
@media (max-width: 900px) {
    .cm-workspace__body { grid-template-columns: 1fr; }
    .cm-workspace__body.has-thread .cm-workspace__inbox { display: none; }
    .cm-workspace__body:not(.has-thread) .cm-workspace__thread { display: none; }
}

/* ---------- Bildirim Merkezi ---------- */
.cm-tabs { display: inline-flex; gap: .25rem; border-bottom: 1px solid var(--cm-line); }
.cm-tabs button { border: 0; background: none; padding: .55rem .9rem; color: var(--cm-muted); font-size: .85rem; font-weight: 600; border-bottom: 2px solid transparent; margin-bottom: -1px; cursor: pointer; display: inline-flex; gap: .4rem; align-items: center; }
.cm-tabs button.is-active { color: var(--cm-accent); border-bottom-color: var(--cm-accent); }
.cm-tabs button em { font-style: normal; min-width: 18px; padding: 0 5px; border-radius: 999px; background: var(--cm-accent); color: var(--cm-accent-ink); font-size: .65rem; }
.cm-center__grid { display: grid; grid-template-columns: 200px minmax(320px, 1fr) minmax(320px, 1.1fr); gap: .85rem; height: calc(100vh - 180px); min-height: 480px; }
.cm-filters { display: flex; flex-direction: column; gap: 2px; }
.cm-filters button { display: flex; align-items: center; gap: .55rem; padding: .5rem .7rem; border: 0; border-radius: 8px; background: none; color: var(--cm-ink-2); font-size: .84rem; text-align: left; cursor: pointer; }
.cm-filters button i { width: 16px; color: var(--cm-muted); }
.cm-filters button span { flex: 1; }
.cm-filters button em { font-style: normal; font-size: .7rem; font-weight: 700; color: var(--cm-accent); }
.cm-filters button:hover { background: var(--cm-surface-3); }
.cm-filters button.is-active { background: var(--cm-accent-soft); color: var(--cm-accent); font-weight: 600; }
.cm-filters button.is-active i { color: var(--cm-accent); }
.cm-list, .cm-detail, .cm-report, .cm-sent__list { min-height: 0; border: 1px solid var(--cm-line); border-radius: 12px; background: var(--cm-surface); display: flex; flex-direction: column; overflow: hidden; }
.cm-list__toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; padding: .6rem .7rem; border-bottom: 1px solid var(--cm-line); }
.cm-list__toolbar .cm-inbox__search { flex: 1; min-width: 180px; padding: 0; }
.cm-list__toolbar .cm-inbox__search > i { left: .7rem; }
.cm-list__rows { flex: 1; overflow-y: auto; }
.cm-row { display: flex; align-items: flex-start; gap: .5rem; padding: 0 0 0 .7rem; border-bottom: 1px solid var(--cm-line); border-left: 3px solid transparent; }
.cm-row > input { margin-top: 1.05rem; }
.cm-row.is-important { border-left-color: var(--cm-important); }
.cm-row.is-critical { border-left-color: var(--cm-critical); }
.cm-row.is-unread { background: color-mix(in srgb, var(--cm-accent-soft) 55%, var(--cm-surface)); }
.cm-row.is-selected { background: var(--cm-surface-3); }
.cm-row__main { flex: 1; min-width: 0; display: flex; gap: .65rem; align-items: flex-start; padding: .7rem .8rem .7rem .2rem; border: 0; background: none; text-align: left; color: var(--cm-ink); cursor: pointer; }
.cm-detail { overflow-y: auto; }
.cm-detail__facts { display: flex; flex-wrap: wrap; gap: 1.25rem; margin: 0; padding: 0 1.25rem 1rem; }
.cm-detail__facts dt { font-size: .7rem; color: var(--cm-muted); font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
.cm-detail__facts dd { margin: 0; font-size: .82rem; color: var(--cm-ink-2); }
.cm-detail__foot { margin-top: auto; }
@media (max-width: 1200px) { .cm-center__grid { grid-template-columns: 1fr; height: auto; } .cm-filters { flex-direction: row; flex-wrap: wrap; } .cm-list { max-height: 60vh; } }

.cm-compose { display: grid; grid-template-columns: minmax(420px, 1.4fr) minmax(300px, 1fr); gap: 1rem; align-items: start; }
.cm-compose__form { display: flex; flex-direction: column; gap: .9rem; padding: 1rem 1.1rem; border: 1px solid var(--cm-line); border-radius: 12px; background: var(--cm-surface); }
.cm-compose__preview { position: sticky; top: 70px; display: flex; flex-direction: column; gap: .5rem; padding: 1rem; border: 1px dashed var(--cm-line-strong); border-radius: 12px; background: var(--cm-surface-2); }
.cm-compose__actions { display: flex; justify-content: flex-end; gap: .5rem; padding-top: .25rem; }
.cm-field { display: flex; flex-direction: column; gap: .35rem; }
.cm-field__label { display: flex; justify-content: space-between; font-size: .74rem; font-weight: 700; color: var(--cm-ink-2); text-transform: uppercase; letter-spacing: .04em; }
.cm-field__label small { font-weight: 500; color: var(--cm-muted); text-transform: none; letter-spacing: 0; }
.cm-field-row { display: grid; grid-template-columns: 1fr 1fr; gap: .9rem; }
.cm-seg--inline { align-self: flex-start; }
.cm-routepick { display: flex; align-items: center; gap: .45rem; }
.cm-routepick > i { color: var(--cm-accent); width: 18px; text-align: center; }
.cm-check { display: inline-flex; align-items: center; gap: .5rem; font-size: .84rem; color: var(--cm-ink-2); }
.cm-switch { display: inline-flex; align-items: center; gap: .55rem; font-size: .84rem; font-weight: 600; color: var(--cm-ink); cursor: pointer; }
.cm-switch input { position: absolute; opacity: 0; width: 0; height: 0; }
.cm-switch__track { position: relative; width: 34px; height: 20px; border-radius: 999px; background: var(--cm-line-strong); transition: background .15s; }
.cm-switch__track::after { content: ""; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: transform .15s; box-shadow: 0 1px 2px rgba(0, 0, 0, .2); }
.cm-switch input:checked + .cm-switch__track { background: var(--cm-accent); }
.cm-switch input:checked + .cm-switch__track::after { transform: translateX(14px); }
.cm-audience { display: flex; flex-direction: column; gap: .55rem; padding: .7rem; border: 1px solid var(--cm-line); border-radius: 10px; background: var(--cm-surface-2); }
.cm-audience__search { position: relative; display: flex; align-items: center; gap: .5rem; }
.cm-audience__search > i { position: absolute; left: .7rem; color: var(--cm-muted); font-size: .78rem; }
.cm-audience__search .cm-input { padding-left: 2rem; }
.cm-audience__list { max-height: 240px; overflow-y: auto; border: 1px solid var(--cm-line); border-radius: 8px; background: var(--cm-surface); }
.cm-option { display: flex; align-items: center; gap: .55rem; padding: .4rem .6rem; border-bottom: 1px solid var(--cm-line); cursor: pointer; margin: 0; }
.cm-option:last-child { border-bottom: 0; }
.cm-option:hover { background: var(--cm-surface-2); }
.cm-option.is-selected { background: var(--cm-accent-soft); }
.cm-option__text { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.cm-option__text strong { font-size: .82rem; font-weight: 600; color: var(--cm-ink); }
.cm-option__text small { font-size: .7rem; color: var(--cm-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cm-audience__chips { display: flex; flex-wrap: wrap; gap: .3rem; align-items: center; }
.cm-audience__total { display: flex; align-items: center; gap: .45rem; font-size: .8rem; color: var(--cm-ink-2); }
.cm-audience__total i { color: var(--cm-accent); }
@media (max-width: 1100px) { .cm-compose { grid-template-columns: 1fr; } .cm-compose__preview { position: static; } .cm-field-row { grid-template-columns: 1fr; } }

.cm-sent { display: grid; grid-template-columns: minmax(320px, 1fr) minmax(420px, 1.5fr); gap: .85rem; height: calc(100vh - 180px); min-height: 480px; }
.cm-sent__list { overflow-y: auto; }
.cm-sentrow { width: 100%; display: flex; align-items: center; gap: .65rem; padding: .7rem .8rem; border: 0; border-bottom: 1px solid var(--cm-line); background: none; text-align: left; color: var(--cm-ink); cursor: pointer; }
.cm-sentrow:hover { background: var(--cm-surface-2); }
.cm-sentrow.is-selected { background: var(--cm-accent-soft); }
.cm-sentrow.is-withdrawn { opacity: .6; }
.cm-sentrow__ratio { display: flex; flex-direction: column; align-items: flex-end; min-width: 64px; }
.cm-sentrow__ratio strong { font-size: .95rem; color: var(--cm-ink); }
.cm-sentrow__ratio small { font-size: .7rem; color: var(--cm-muted); }
.cm-progress { display: block; height: 4px; margin-top: .3rem; border-radius: 999px; background: var(--cm-surface-3); overflow: hidden; }
.cm-progress__bar { display: block; height: 100%; background: var(--cm-ok); border-radius: 999px; }
.cm-report { overflow-y: auto; }
.cm-report__body { margin: 0 1.25rem .75rem; border: 1px solid var(--cm-line); border-radius: 8px; }
.cm-report__body summary { padding: .45rem .7rem; font-size: .78rem; font-weight: 600; color: var(--cm-ink-2); cursor: pointer; }
.cm-kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: .6rem; padding: 0 1.25rem .9rem; }
.cm-kpis > div { padding: .6rem .75rem; border: 1px solid var(--cm-line); border-radius: 10px; background: var(--cm-surface-2); display: flex; flex-direction: column; }
.cm-kpis span { font-size: .7rem; color: var(--cm-muted); font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
.cm-kpis strong { font-size: 1.35rem; color: var(--cm-ink); font-variant-numeric: tabular-nums; }
.cm-kpis .is-ok strong { color: var(--cm-ok); }
.cm-kpis .is-warn strong { color: var(--cm-important); }
.cm-table { width: 100%; border-collapse: collapse; font-size: .8rem; }
.cm-table th { position: sticky; top: 0; background: var(--cm-surface-2); color: var(--cm-muted); font-size: .7rem; text-transform: uppercase; letter-spacing: .04em; font-weight: 700; text-align: left; padding: .5rem .75rem; border-bottom: 1px solid var(--cm-line); }
.cm-table td { padding: .45rem .75rem; border-bottom: 1px solid var(--cm-line); color: var(--cm-ink-2); }
@media (max-width: 1100px) { .cm-sent { grid-template-columns: 1fr; height: auto; } }

/* ==========================================================================
   Duyurular: ortadaki duyuru penceresi (giriş), duyuru kartı, takvim,
   Duyuru Yönetimi, Yenilikler. Önek: an-
   ========================================================================== */
.an-tone-info { --an-tone: var(--cm-info); --an-tone-deep: #1d4ed8; }
.an-tone-important { --an-tone: #b45309; --an-tone-deep: #92400e; }
.an-tone-critical { --an-tone: #b91c1c; --an-tone-deep: #7f1d1d; }
.an-tone-release { --an-tone: #6d28d9; --an-tone-deep: #4c1d95; }
[data-bs-theme="dark"] .an-tone-important { --an-tone: #f3c36b; --an-tone-deep: #b45309; }
[data-bs-theme="dark"] .an-tone-critical { --an-tone: #ff9c99; --an-tone-deep: #b91c1c; }
[data-bs-theme="dark"] .an-tone-release { --an-tone: #c4b5fd; --an-tone-deep: #6d28d9; }
[data-bs-theme="dark"] .an-tone-info { --an-tone-deep: #1e40af; }

.an-ev-general { --an-ev: #475569; --an-ev-soft: #f1f5f9; }
.an-ev-meeting { --an-ev: #2563eb; --an-ev-soft: #eff6ff; }
.an-ev-training { --an-ev: #047857; --an-ev-soft: #ecfdf5; }
.an-ev-maintenance { --an-ev: #b45309; --an-ev-soft: #fffbeb; }
.an-ev-deadline { --an-ev: #b91c1c; --an-ev-soft: #fef2f2; }
.an-ev-milestone { --an-ev: #6d28d9; --an-ev-soft: #f5f3ff; }
[data-bs-theme="dark"] .an-ev-general { --an-ev: #a8b8cc; --an-ev-soft: #243248; }
[data-bs-theme="dark"] .an-ev-meeting { --an-ev: #86b7fe; --an-ev-soft: #1e3a5f; }
[data-bs-theme="dark"] .an-ev-training { --an-ev: #69d69d; --an-ev-soft: #173e2d; }
[data-bs-theme="dark"] .an-ev-maintenance { --an-ev: #f3c36b; --an-ev-soft: #45371e; }
[data-bs-theme="dark"] .an-ev-deadline { --an-ev: #ff9c99; --an-ev-soft: #472627; }
[data-bs-theme="dark"] .an-ev-milestone { --an-ev: #c4b5fd; --an-ev-soft: #2e2550; }

/* ── Pencere ── */
@keyframes an-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes an-pop { from { opacity: 0; transform: translate(-50%, -48%) scale(.98); } to { opacity: 1; transform: translate(-50%, -50%) scale(1); } }
.an-backdrop { position: fixed; inset: 0; z-index: 1095; background: rgba(15, 23, 42, .55); backdrop-filter: blur(3px); animation: an-fade .18s ease-out; }
.an-window { position: fixed; z-index: 1096; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 640px; max-width: calc(100vw - 32px); max-height: calc(100vh - 48px); display: flex; flex-direction: column; background: var(--cm-surface); color: var(--cm-ink); border-radius: 18px; box-shadow: 0 24px 64px rgba(15, 23, 42, .32), 0 4px 12px rgba(15, 23, 42, .12); overflow: hidden; animation: an-pop .22s cubic-bezier(.2, .8, .2, 1); }
.an-window__bar { display: flex; align-items: center; gap: .75rem; padding: .55rem .6rem .55rem 1rem; border-bottom: 1px solid var(--cm-line); background: var(--cm-surface); flex: 0 0 auto; }
.an-window__label { font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--cm-muted); display: inline-flex; align-items: center; gap: .45rem; margin-right: auto; }
.an-window__close { border: 0; background: transparent; color: var(--cm-muted); width: 32px; height: 32px; border-radius: 8px; cursor: pointer; }
.an-window__close:hover { background: var(--cm-surface-3); color: var(--cm-ink); }
.an-pager { display: inline-flex; align-items: center; gap: .35rem; font-size: .8rem; color: var(--cm-muted); }
.an-pager strong { color: var(--cm-ink); }
.an-pager button { border: 1px solid var(--cm-line); background: var(--cm-surface); color: var(--cm-ink-2); border-radius: 8px; padding: .25rem .6rem; font-size: .76rem; font-weight: 600; cursor: pointer; display: inline-flex; align-items: center; gap: .3rem; }
.an-pager button:disabled { opacity: .4; cursor: default; }
.an-pager button:hover:not(:disabled) { background: var(--cm-surface-3); }
.an-window > .an-card { flex: 1 1 auto; min-height: 0; overflow-y: auto; }

/* ── Kart ── */
.an-card { display: flex; flex-direction: column; background: var(--cm-surface); color: var(--cm-ink); container-type: inline-size; }
@container (max-width: 560px) { .an-event { grid-template-columns: auto 1fr; } .an-event__ics { grid-column: 1 / -1; justify-content: center; } }
.an-media { position: relative; flex: 0 0 auto; aspect-ratio: 16 / 7; background: var(--cm-surface-3); overflow: hidden; }
.an-media > img { display: block; width: 100%; height: 100%; object-fit: cover; animation: an-fade .25s ease-out; }
.an-media.is-band { aspect-ratio: auto; height: 120px; background:
    radial-gradient(circle at 85% -20%, rgba(255, 255, 255, .22) 0, rgba(255, 255, 255, 0) 55%),
    radial-gradient(rgba(255, 255, 255, .12) 1px, transparent 1.2px) 0 0 / 14px 14px,
    linear-gradient(135deg, var(--an-tone) 0%, var(--an-tone-deep) 100%); }
.an-band__icon { position: absolute; right: 1.6rem; top: 50%; transform: translateY(-50%); font-size: 3.4rem; color: rgba(255, 255, 255, .28); }
.an-media__tag { position: absolute; left: 1.4rem; bottom: .8rem; display: inline-flex; align-items: center; gap: .4rem; padding: .28rem .65rem; border-radius: 999px; background: rgba(255, 255, 255, .94); color: #0f172a; font-size: .72rem; font-weight: 700; box-shadow: 0 2px 8px rgba(15, 23, 42, .15); }
.an-media__tag i { color: var(--an-tone); }
.an-gallery__nav { position: absolute; top: 50%; transform: translateY(-50%); width: 36px; height: 36px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, .9); color: #0f172a; box-shadow: 0 2px 10px rgba(15, 23, 42, .2); cursor: pointer; }
.an-gallery__nav.is-prev { left: .75rem; }
.an-gallery__nav.is-next { right: .75rem; }
.an-gallery__dots { position: absolute; right: 1rem; bottom: .9rem; display: flex; gap: .3rem; }
.an-gallery__dots button { width: 8px; height: 8px; padding: 0; border-radius: 50%; border: 0; background: rgba(255, 255, 255, .55); cursor: pointer; }
.an-gallery__dots button.is-active { width: 20px; border-radius: 4px; background: #fff; }

.an-content { padding: 1.15rem 1.5rem .35rem; }
.an-eyebrow { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; font-size: .76rem; color: var(--cm-muted); }
.an-eyebrow > span + span::before { content: "·"; margin-right: .45rem; }
.an-priority { color: var(--an-tone); font-weight: 700; text-transform: uppercase; letter-spacing: .05em; font-size: .7rem; }
.an-title { font-size: 1.4rem; font-weight: 700; line-height: 1.25; margin: .3rem 0 .9rem; color: var(--cm-ink); letter-spacing: -.01em; }

.an-event { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 1rem; padding: .8rem 1rem; margin-bottom: 1rem; border: 1px solid var(--cm-line); border-radius: 12px; background: var(--cm-surface-2); }
.an-event__tile { width: 58px; border: 1px solid var(--cm-line); border-radius: 10px; overflow: hidden; text-align: center; background: var(--cm-surface); }
.an-event__tile span { display: block; background: var(--an-tone); color: #fff; font-size: .66rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; padding: 2px 0; }
.an-event__tile strong { display: block; font-size: 1.5rem; line-height: 1.6; color: var(--cm-ink); }
.an-event__facts { margin: 0; display: grid; gap: .2rem; }
.an-event__facts > div { display: flex; gap: .5rem; align-items: baseline; }
.an-event__facts dt { width: 62px; flex: 0 0 62px; font-size: .74rem; font-weight: 600; color: var(--cm-muted); }
.an-event__facts dt i { width: 14px; }
.an-event__facts dd { margin: 0; font-size: .88rem; font-weight: 600; color: var(--cm-ink); }

.an-body { font-size: .92rem; line-height: 1.62; color: var(--cm-ink-2); overflow-wrap: anywhere; }
.an-body > :first-child { margin-top: 0; }
.an-body p { margin: 0 0 .65rem; }
.an-body h2 { font-size: 1.05rem; font-weight: 700; color: var(--cm-ink); margin: 1rem 0 .4rem; }
.an-body h3, .an-body h4 { font-size: .95rem; font-weight: 700; color: var(--cm-ink); margin: .9rem 0 .35rem; }
.an-body ul, .an-body ol { margin: 0 0 .7rem; padding-left: 1.3rem; }
.an-body li { margin: .15rem 0; }
.an-body a { color: var(--cm-accent); text-decoration: underline; text-underline-offset: 2px; }
.an-body blockquote { margin: 0 0 .7rem; padding: .35rem .9rem; border-left: 3px solid var(--an-tone); background: var(--cm-surface-2); border-radius: 0 8px 8px 0; color: var(--cm-ink-2); }
.an-body hr { border: 0; border-top: 1px solid var(--cm-line); margin: .9rem 0; }

.an-action { display: inline-flex; align-items: center; gap: .5rem; margin: .2rem 0 .9rem; padding: .5rem .9rem; border: 1px solid color-mix(in srgb, var(--an-tone) 35%, transparent); border-radius: 10px; background: color-mix(in srgb, var(--an-tone) 8%, var(--cm-surface)); color: var(--an-tone); font-size: .86rem; font-weight: 650; cursor: pointer; }
.an-action i { transition: transform .15s; }
.an-action:hover i { transform: translateX(3px); }

.an-foot { position: sticky; bottom: 0; display: flex; justify-content: flex-end; flex-wrap: wrap; gap: .5rem; padding: .85rem 1.5rem 1.05rem; border-top: 1px solid var(--cm-line); background: var(--cm-surface); margin-top: auto; }
.an-btn { display: inline-flex; align-items: center; gap: .45rem; padding: .56rem 1.05rem; border-radius: 10px; border: 1px solid transparent; font-size: .85rem; font-weight: 650; cursor: pointer; text-decoration: none; white-space: nowrap; }
.an-btn:disabled { opacity: .55; cursor: not-allowed; }
.an-btn--primary { background: var(--an-tone, var(--cm-accent)); color: #fff; }
[data-bs-theme="dark"] .an-btn--primary { color: #0b1220; }
.an-btn--primary:hover:not(:disabled) { filter: brightness(1.07); color: #fff; }
.an-btn--quiet { background: var(--cm-surface); color: var(--cm-ink-2); border-color: var(--cm-line-strong); }
.an-btn--quiet:hover:not(:disabled) { background: var(--cm-surface-3); color: var(--cm-ink); }

.an-card.is-compact .an-media { aspect-ratio: 16 / 6; }
.an-card.is-compact .an-media.is-band { height: 84px; }
.an-card.is-compact .an-title { font-size: 1.12rem; }

@media (max-width: 640px) {
    .an-window { inset: 0; top: 0; left: 0; transform: none; width: 100%; max-width: 100%; max-height: 100%; height: 100%; border-radius: 0; animation: an-fade .18s ease-out; }
    .an-content { padding: 1rem 1.1rem .3rem; }
    .an-foot { padding: .75rem 1.1rem calc(.9rem + env(safe-area-inset-bottom)); }
    .an-foot .an-btn { flex: 1 1 0; justify-content: center; }
    .an-event { grid-template-columns: auto 1fr; }
    .an-event__ics { grid-column: 1 / -1; justify-content: center; }
    .an-pager button { padding: .25rem .45rem; }
}

/* ── Sayfalar ── */
.an-page { padding: .75rem 0 1rem; color: var(--cm-ink); }
.an-page__head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: .85rem; }
.an-page__head h1 { font-size: 1.3rem; font-weight: 700; margin: 0; display: flex; align-items: center; gap: .55rem; }
.an-page__actions { display: flex; gap: .5rem; flex-wrap: wrap; }
.an-page__grid { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: .85rem; align-items: start; }
.an-panel { background: var(--cm-surface); border: 1px solid var(--cm-line); border-radius: var(--cm-radius); padding: .75rem; min-width: 0; }
.an-upcoming h2 { font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--cm-muted); margin: .2rem .25rem .6rem; }
.an-upcoming__row { display: flex; align-items: center; gap: .7rem; width: 100%; padding: .55rem .4rem; border: 0; border-top: 1px solid var(--cm-line); background: transparent; color: inherit; text-align: left; cursor: pointer; border-radius: 0; }
.an-upcoming__row:hover { background: var(--cm-surface-2); }
.an-upcoming__date { width: 44px; flex: 0 0 44px; border-radius: 9px; overflow: hidden; text-align: center; border: 1px solid var(--cm-line); }
.an-upcoming__date small { display: block; background: var(--an-ev); color: #fff; font-size: .62rem; font-weight: 700; text-transform: uppercase; }
.an-upcoming__date strong { display: block; font-size: 1.1rem; line-height: 1.5; }
.an-upcoming__body { display: grid; min-width: 0; }
.an-upcoming__body strong { font-size: .84rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.an-upcoming__body span { font-size: .74rem; color: var(--cm-muted); }
.an-upcoming__body i { color: var(--an-ev); }

.an-calendar__legend { display: flex; flex-wrap: wrap; gap: .35rem; margin-bottom: .6rem; }
.an-legend, .an-chip { display: inline-flex; align-items: center; gap: .4rem; padding: .3rem .7rem; border-radius: 999px; border: 1px solid var(--cm-line); background: var(--cm-surface); color: var(--cm-muted); font-size: .76rem; font-weight: 600; cursor: pointer; }
.an-legend i, .an-chip i { color: var(--an-ev); }
.an-legend em { font-style: normal; font-size: .68rem; color: var(--cm-muted); }
.an-legend.is-on { background: var(--an-ev-soft); border-color: color-mix(in srgb, var(--an-ev) 40%, transparent); color: var(--cm-ink); }
.an-chip.is-active { background: var(--an-ev-soft); border-color: var(--an-ev); color: var(--an-ev); }
.an-chips { display: flex; flex-wrap: wrap; gap: .35rem; }
.an-calendar .e-schedule .e-appointment { border-radius: 6px; border: 0; border-left: 3px solid rgba(0, 0, 0, .18); }
.an-calendar .e-schedule .e-appointment.an-ev-general { background: #475569; }
.an-calendar .e-schedule .e-appointment.an-ev-meeting { background: #2563eb; }
.an-calendar .e-schedule .e-appointment.an-ev-training { background: #047857; }
.an-calendar .e-schedule .e-appointment.an-ev-maintenance { background: #b45309; }
.an-calendar .e-schedule .e-appointment.an-ev-deadline { background: #b91c1c; }
.an-calendar .e-schedule .e-appointment.an-ev-milestone { background: #6d28d9; }
.an-calendar .e-schedule .e-appointment.is-critical { box-shadow: inset 0 0 0 2px #fecaca; }
.an-calendar .e-schedule .e-appointment.is-unread { font-weight: 700; border-left-color: #fff; }
.an-calendar .e-schedule .e-appointment.is-scheduled { background-image: repeating-linear-gradient(135deg, rgba(255, 255, 255, .18) 0 6px, transparent 6px 12px); opacity: .85; }
.an-calendar .e-schedule .e-agenda-view .e-appointment { color: var(--cm-ink); background: var(--an-ev-soft) !important; border-left-color: var(--an-ev); }

/* ── Duyuru oluşturma ── */
.an-compose { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(360px, .85fr); gap: 1rem; align-items: start; }
.an-compose__form { display: grid; gap: .95rem; background: var(--cm-surface); border: 1px solid var(--cm-line); border-radius: var(--cm-radius); padding: 1rem 1.1rem; min-width: 0; }
.an-compose__preview { position: sticky; top: .75rem; display: grid; gap: .5rem; min-width: 0; }
.an-preview__head { display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.an-preview { padding: 1.2rem; border-radius: 14px; background: radial-gradient(var(--cm-line) 1px, transparent 1.2px) 0 0 / 16px 16px, var(--cm-surface-3); border: 1px solid var(--cm-line); }
.an-window--preview { position: static; transform: none; width: 100%; max-width: 100%; max-height: none; animation: none; box-shadow: var(--cm-shadow); }
.an-window--preview > .an-card { overflow: visible; }
.an-preview.is-phone .an-window--preview { width: 360px; margin: 0 auto; border-radius: 26px; border: 8px solid #0f172a; }
.an-preview.is-phone .an-content { padding: 1rem 1.1rem .3rem; }
.an-preview.is-phone .an-foot { padding: .75rem 1.1rem .9rem; }
.an-preview.is-phone .an-foot .an-btn { flex: 1 1 0; justify-content: center; }
.an-preview.is-phone .an-event { grid-template-columns: auto 1fr; }
.an-preview.is-phone .an-event__ics { grid-column: 1 / -1; justify-content: center; }
.an-fieldset { border: 1px solid var(--cm-line); border-radius: 10px; padding: .55rem .9rem .8rem; margin: 0; display: grid; gap: .6rem; min-width: 0; }
.an-fieldset legend { float: none; width: auto; font-size: .76rem; font-weight: 700; color: var(--cm-muted); padding: 0 .35rem; margin: 0; }
.an-field-row--3 { grid-template-columns: 1fr 1fr auto; align-items: end; }
.an-check--inline { padding-bottom: .5rem; white-space: nowrap; }
.an-input--title { font-size: 1rem; font-weight: 600; }
.an-field--narrow { max-width: 160px; }
.an-editor .e-richtexteditor { border-radius: 10px; overflow: hidden; border-color: var(--cm-line-strong); }
.an-notice { display: flex; align-items: center; gap: .5rem; padding: .5rem .75rem; border-radius: 8px; background: var(--cm-ok-soft); color: var(--cm-ok); font-size: .82rem; font-weight: 600; }

.an-images__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(128px, 1fr)); gap: .5rem; }
.an-thumb { position: relative; aspect-ratio: 4 / 3; margin: 0; border-radius: 10px; overflow: hidden; border: 1px solid var(--cm-line); background: var(--cm-surface-3); }
.an-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.an-thumb.is-cover { box-shadow: 0 0 0 2px var(--cm-accent); }
.an-thumb figcaption { position: absolute; left: .4rem; top: .4rem; padding: .1rem .45rem; border-radius: 999px; background: var(--cm-accent); color: #fff; font-size: .66rem; font-weight: 700; }
.an-thumb__tools { position: absolute; right: .35rem; bottom: .35rem; display: flex; gap: .25rem; opacity: 0; transition: opacity .15s; }
.an-thumb:hover .an-thumb__tools, .an-thumb:focus-within .an-thumb__tools { opacity: 1; }
.an-thumb__tools button { width: 28px; height: 28px; border: 0; border-radius: 7px; background: rgba(15, 23, 42, .78); color: #fff; font-size: .72rem; cursor: pointer; }
.an-thumb--add { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .2rem; border-style: dashed; border-color: var(--cm-line-strong); color: var(--cm-muted); font-size: .76rem; font-weight: 600; cursor: pointer; text-align: center; padding: .4rem; }
.an-thumb--add i { font-size: 1.3rem; color: var(--cm-accent); }
.an-thumb--add small { font-size: .66rem; font-weight: 500; }
.an-thumb--add input[type="file"] { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.an-thumb--add:hover { background: var(--cm-accent-soft); border-color: var(--cm-accent-line); }

.an-sent__filters { margin: .1rem .1rem .5rem; }
.an-report__actions { display: flex; flex-wrap: wrap; gap: .4rem; margin-left: auto; align-self: flex-start; }
.an-report__card { max-width: 560px; margin: .5rem 0; border: 1px solid var(--cm-line); border-radius: 12px; overflow: hidden; }
.cm-item__icon.an-ev-general, .cm-item__icon.an-ev-meeting, .cm-item__icon.an-ev-training, .cm-item__icon.an-ev-maintenance,
.cm-item__icon.an-ev-deadline, .cm-item__icon.an-ev-milestone, .cm-modal__icon[class*="an-ev-"] { background: var(--an-ev-soft); color: var(--an-ev); }
.cm-item__icon.an-tone-release { background: #f5f3ff; color: #6d28d9; }
.cm-item.is-release .cm-item__icon { background: #f5f3ff; color: #6d28d9; }
[data-bs-theme="dark"] .cm-item.is-release .cm-item__icon, [data-bs-theme="dark"] .cm-item__icon.an-tone-release { background: #2e2550; color: #c4b5fd; }
.cm-dot--inline { display: inline-block; vertical-align: middle; margin-left: .25rem; }

.an-release { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 1rem; align-items: start; }
.an-release__list { display: grid; gap: .35rem; background: var(--cm-surface); border: 1px solid var(--cm-line); border-radius: var(--cm-radius); padding: .5rem; }

@media (max-width: 1200px) {
    .an-compose { grid-template-columns: 1fr; }
    .an-compose__preview { position: static; }
}
@media (max-width: 1100px) {
    .an-page__grid, .an-release { grid-template-columns: 1fr; }
    .an-field-row--3 { grid-template-columns: 1fr; }
}