/* ═══════════════════════════════════════════════════════════════ CRM ═══
   CRM modülünün TEK stil kaynağı. Sayfa içine <style> eklenmez.

   Görsel dil PROTOTİPİN AYNISIDIR: token değerleri ve bileşen anatomisi
   docs/moduller/crm/CRM_MODUL_PROTOTIP.html dosyasından bire bir alınmıştır
   (o da İşletme prototipleriyle aynı PSH token ailesini kullanır). Başka bir
   ürünün marka renkleri kullanılmaz.

   İki kural her yerde geçerlidir:
   · Değişen metin sabit yer kaplar — koşullu bir not göründüğünde altındaki
     hiçbir şey aşağı kaymaz (crm-hint, crm-tile .d, crm-lane-sum, bc .ft).
   · Renk tek başına anlam taşımaz — her renkli işaretin yanında metin/başlık
     vardır (kural rozetleri, gecikme, aşama çipleri).                      */

.crm-page,
.crm-dialog {
    /* ── PSH token'ları (prototiple aynı değerler) ──
       Pencereler (Radzen dialog) .crm-page'in DIŞINDA açılır; token'lar burada da
       tanımlanmazsa pencere içindeki çerçeve/renk/ölçü değişkenleri boş kalır. */
    --surface: #fff;
    --surface-2: #f4f7fa;
    --surface-3: #eef2f7;
    --ink: #111827;
    --ink-2: #34414b;
    --muted: #6b7280;
    --faint: #8b95a5;
    --line: #d5dbe3;
    --line-2: #e8edf1;
    --link: #1d4ed8;
    --focus: #2563eb;
    --primary: #2563eb;
    --primary-strong: #1d4ed8;
    --primary-soft: #eff6ff;
    --good: #15803d;
    --good-soft: #dcfce7;
    --warn: #92400e;
    --warn-soft: #fef3c7;
    --bad: #b91c1c;
    --bad-soft: #fee2e2;
    --info: #1d4ed8;
    --info-soft: #dbeafe;
    --shadow: 0 1px 2px rgba(16, 24, 40, .06);

    --fs: 13.5px;
    --fs-sm: 12.5px;
    --fs-xs: 11.5px;
    --fs-h1: 20px;
    --fs-h2: 16px;
    --row: 40px;
    --ctl: 32px;
    --gap: 12px;
    --r: 5px;
    --r-sm: 3px;
    --pill: 999px;

    font-size: var(--fs);
    color: var(--ink);
}

/* ─── Başlık şeridi ───────────────────────────────────────────────────── */

.crm-head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 8px;
    margin-bottom: var(--gap);
}

.crm-page h1 {
    font-size: var(--fs-h1);
    font-weight: 650;
    margin: 0;
    line-height: 1.25;
}

/* ─── Sayı kutuları (prototip .tile) ──────────────────────────────────── */

.crm-tiles {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: var(--gap);
}

.crm-tile {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: 12px 14px;
    background: var(--surface);
    border: 1px solid var(--line-2);
    border-radius: var(--r);
    box-shadow: var(--shadow);
}

.crm-tile-label {
    font-size: var(--fs-xs);
    color: var(--muted);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .05em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.crm-tile-value {
    font-size: 24px;
    font-weight: 650;
    margin-top: 2px;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.crm-tile-sub {
    font-size: var(--fs-xs);
    color: var(--muted);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    /* Alt satır boş kalsa da yer kaplar. */
    min-height: 1.2em;
}

.crm-tile-warn { border-color: var(--bad); }

/* ─── Kart kolonları ──────────────────────────────────────────────────── */

.crm-cols,
.crm-card-cols {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gap);
    align-items: flex-start;
}

.crm-col { flex: 1 1 320px; min-width: 300px; }
.crm-col-wide { flex: 2 1 480px; }
.crm-card-main { flex: 3 1 560px; min-width: 320px; }
.crm-card-side { flex: 1 1 300px; min-width: 280px; }

.crm-card-head {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 32px;
    margin-bottom: 8px;
    font-size: var(--fs);
}

.crm-card-head b { font-weight: 650; }

/* ─── Satır listeleri ─────────────────────────────────────────────────── */

.crm-list { display: flex; flex-direction: column; }

.crm-row {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 6px 2px;
    border-bottom: 1px solid var(--line-2);
    font-size: var(--fs-sm);
}

.crm-row:last-child { border-bottom: none; }
.crm-row:hover { background: var(--surface-2); }

.crm-row-main {
    display: flex;
    flex-direction: column;
    min-width: 0;
    flex: 1;
}

.crm-row-main small,
.crm-row-side small {
    font-size: var(--fs-xs);
    color: var(--muted);
}

.crm-row-side {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    text-align: right;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.crm-row-late { background: var(--bad-soft); }

.crm-row-done .crm-row-main > span:first-child,
.crm-done-text {
    text-decoration: line-through;
    color: var(--faint);
}

.crm-late-text { color: var(--bad); font-weight: 650; }

.crm-empty {
    padding: 28px;
    text-align: center;
    color: var(--muted);
    font-size: var(--fs-sm);
}

.crm-hint {
    font-size: var(--fs-xs);
    color: var(--muted);
    /* Koşullu ipucu satırı boşken de yer kaplar. */
    min-height: 17px;
}

.crm-hint-fixed { min-height: 17px; }
.crm-faint { color: var(--muted); }
.crm-sub { font-size: var(--fs-xs); color: var(--muted); }

.crm-code {
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: var(--fs-xs);
    color: var(--ink-2);
}

.crm-note {
    font-size: var(--fs-sm);
    color: var(--ink-2);
    line-height: 1.55;
    white-space: pre-wrap;
}

/* Künye listesi (prototip .kv) */
.crm-dl {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 6px 14px;
    font-size: var(--fs-sm);
    margin: 0;
}

.crm-dl dt { color: var(--muted); }
.crm-dl dd { margin: 0; font-weight: 600; min-width: 0; word-break: break-word; }

/* ─── Çipler (prototip .chip) ─────────────────────────────────────────── */

.crm-chips { display: flex; flex-wrap: wrap; gap: 6px; }

.crm-chip {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    height: 22px;
    padding: 0 8px;
    margin-right: 4px;
    border-radius: var(--pill);
    background: var(--surface-3);
    color: var(--ink-2);
    font-size: var(--fs-xs);
    font-weight: 600;
    white-space: nowrap;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    vertical-align: middle;
}

/* Renkli çip: arka plan rengin %16'sı, metin koyu tonu, ince iç çerçeve.
   Sayfa satır içinde --c değişkenini verir. */
.crm-chip-c {
    --c: #64748b;
    background: color-mix(in srgb, var(--c) 16%, var(--surface));
    color: color-mix(in srgb, var(--c) 62%, var(--ink));
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--c) 30%, transparent);
}

.crm-chip-tag { border-radius: var(--r-sm); }
.crm-chip-flag { border-radius: var(--r-sm); font-size: 10.5px; }
.crm-chip-good { background: var(--good-soft); color: var(--good); }
.crm-chip-bad { background: var(--bad-soft); color: var(--bad); }
.crm-chip-info { background: var(--info-soft); color: var(--info); }

.crm-dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--faint);
    flex: none;
}

/* ─── Zaman akışı (prototip .tla) ─────────────────────────────────────── */

.crm-timeline-head {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 12px 0 8px;
    flex-wrap: wrap;
}

.crm-tl-item {
    --c: var(--faint);
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 0 10px;
    padding: 10px 12px;
    margin-bottom: 8px;
    background: var(--surface);
    border: 1px solid var(--line-2);
    border-radius: var(--r);
    box-shadow: var(--shadow);
}

.crm-tl-item .crm-tl-ic {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    background: color-mix(in srgb, var(--c) 15%, var(--surface));
    color: var(--c);
}

.crm-tl-item .crm-tl-ic .rz-icon,
.crm-tl-item .crm-tl-ic .crm-ic { font-size: 17px; }

.crm-tl-pinned { border-color: var(--warn); box-shadow: inset 0 3px 0 var(--warn); }

.crm-tl-body { min-width: 0; }

.crm-tl-title {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    font-size: var(--fs-sm);
}

.crm-tl-title b {
    font-weight: 650;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.crm-tl-when {
    margin-left: auto;
    color: var(--muted);
    font-size: var(--fs-xs);
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.crm-tl-text {
    font-size: var(--fs-sm);
    color: var(--ink-2);
    margin-top: 4px;
    line-height: 1.55;
    white-space: pre-wrap;
}

.crm-tl-meta {
    display: flex;
    gap: 12px;
    margin-top: 6px;
    font-size: var(--fs-xs);
    color: var(--muted);
    flex-wrap: wrap;
    align-items: center;
    min-height: 26px;
}

/* Araçlar satır üstünde belirir; yer önceden ayrıldığı için düzen kaymaz. */
.crm-tl-tools { display: flex; gap: 2px; visibility: hidden; }
.crm-tl-item:hover .crm-tl-tools { visibility: visible; }

.crm-pin { font-size: 15px !important; color: var(--warn); }

/* ─── Pano (prototip .board / .lane / .bc) ────────────────────────────── */

.crm-board {
    display: flex;
    gap: 10px;
    overflow-x: auto;
    padding: 12px 2px 6px;
    align-items: stretch;
}

.crm-lane {
    --c: #64748b;
    flex: 0 0 288px;
    display: flex;
    flex-direction: column;
    background: var(--surface-2);
    border: 1px solid var(--line-2);
    border-top: 3px solid var(--c);
    border-radius: var(--r);
    min-height: 160px;
}

.crm-lane-over .crm-lane-body {
    background: color-mix(in srgb, var(--c) 10%, transparent);
    outline: 2px dashed color-mix(in srgb, var(--c) 60%, transparent);
    outline-offset: -4px;
}

.crm-lane-head {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 8px 10px 4px;
    height: 40px;
}

.crm-lane-head b {
    font-weight: 650;
    font-size: var(--fs-sm);
    text-transform: uppercase;
    letter-spacing: .04em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.crm-lane-count {
    min-width: 24px;
    text-align: center;
    font-size: var(--fs-xs);
    background: var(--surface-3);
    border-radius: var(--pill);
    padding: 0 6px;
    font-variant-numeric: tabular-nums;
}

/* Kulvar özeti: iki sütunlu; boş olsa da yüksekliği sabit. */
.crm-lane-sum {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 1px 8px;
    padding: 0 10px 8px;
    font-size: var(--fs-xs);
    color: var(--muted);
    border-bottom: 1px solid var(--line-2);
    min-height: 44px;
}

.crm-lane-sum b {
    color: var(--ink);
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.crm-lane-body {
    flex: 1;
    overflow-y: auto;
    padding: 8px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-height: 60px;
}

.crm-lane-empty {
    text-align: center;
    color: var(--faint);
    padding: 8px 0;
    font-size: var(--fs-xs);
}

/* Fırsat kartı: solda 4px kural şeridi, üst satırda ad, altında alan ızgarası. */
.crm-deal-card {
    --hl: transparent;
    position: relative;
    background: var(--surface);
    border: 1px solid var(--line-2);
    border-radius: var(--r);
    padding: 10px 10px 8px 13px;
    box-shadow: var(--shadow);
    cursor: grab;
    font-size: var(--fs-sm);
}

.crm-deal-card::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    border-radius: var(--r) 0 0 var(--r);
    background: var(--hl);
}

.crm-deal-card:hover { border-color: var(--faint); }
.crm-deal-card:active { cursor: grabbing; }
.crm-deal-tint { background: color-mix(in srgb, var(--hl) 9%, var(--surface)); }

.crm-deal-title {
    font-weight: 650;
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.crm-deal-title a { color: var(--link); }

.crm-deal-props {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 2px 8px;
    margin-top: 6px;
    color: var(--muted);
    font-size: var(--fs-xs);
}

.crm-deal-props b {
    color: var(--ink-2);
    font-weight: 600;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-variant-numeric: tabular-nums;
}

.crm-deal-tags {
    display: flex;
    gap: 4px;
    overflow: hidden;
    margin-top: 7px;
    height: 22px;
}

/* Kural metni: kart yüksekliği kural olsun olmasın aynı kalsın diye sabit. */
.crm-deal-rule {
    font-size: 10px;
    font-weight: 700;
    color: color-mix(in srgb, var(--hl) 70%, var(--ink));
    height: 14px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-top: 4px;
}

.crm-deal-foot {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-top: 8px;
    padding-top: 7px;
    border-top: 1px solid var(--line-2);
    font-size: var(--fs-xs);
    color: var(--muted);
    height: 30px;
}

.crm-deal-late { color: var(--bad); font-weight: 650; }

/* ─── Aşama çubuğu ────────────────────────────────────────────────────── */

.crm-stagebar {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
}

.crm-stagestep {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 1px;
    padding: 6px 14px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface);
    color: var(--ink-2);
    font-size: var(--fs-sm);
    font-weight: 600;
    cursor: pointer;
}

.crm-stagestep:hover:not(:disabled) { background: var(--surface-2); border-color: var(--faint); }
.crm-stagestep small { font-size: 10.5px; opacity: .75; font-weight: 600; }
.crm-stagestep:disabled { cursor: default; }
.crm-stagestep-on { font-weight: 700; }

/* ─── Pencere (dialog) ────────────────────────────────────────────────── */

.crm-dialog {
    display: flex;
    flex-direction: column;
    gap: 10px;
    font-size: var(--fs);
}

.crm-form-row { display: flex; flex-wrap: wrap; gap: 10px; }
.crm-field { display: flex; flex-direction: column; gap: 3px; }
.crm-field-grow { flex: 1 1 200px; min-width: 160px; }

.crm-label {
    display: block;
    font-size: var(--fs-xs);
    color: var(--muted);
    font-weight: 600;
    margin: 0 0 2px;
}

/* ─── Aramalı seçim alanı ve penceresi (cari · kişi · personel) ──────────
   Satın Alma'daki tedarikçi alanının kalıbı: okunur kutu + "Seç…" düğmesi; düğme büyük
   seçim penceresini açar. Açılır liste uzun listede aranamıyordu. */

.crm-pickf {
    display: flex;
    align-items: center;
    gap: 4px;
    height: var(--ctl);
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface);
    padding: 0 3px 0 4px;
    min-width: 0;
    max-width: 100%;
}
.crm-pickf-dis { background: var(--surface-2); }
.crm-pickf-v {
    flex: 1;
    min-width: 0;
    height: 100%;
    display: flex;
    align-items: center;
    gap: 6px;
    border: 0;
    background: transparent;
    padding: 0 5px;
    font: inherit;
    font-size: var(--fs-sm);
    color: var(--ink);
    text-align: left;
    cursor: pointer;
    white-space: nowrap;
    overflow: hidden;
}
.crm-pickf-v:disabled { cursor: not-allowed; color: var(--faint); }
.crm-pickf-empty { color: var(--faint); }
.crm-pickf-t { overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.crm-pickf .crm-btn-sm { flex: none; }

.crm-pk { height: 100%; min-height: 0; }
.crm-pk-filters { display: flex; align-items: center; gap: 8px; }
.crm-pk-count { font-size: var(--fs-sm); color: var(--muted); white-space: nowrap; min-width: 150px; text-align: right; font-variant-numeric: tabular-nums; }
.crm-pk-scroll { flex: 1; min-height: 240px; overflow: auto; border: 1px solid var(--line-2); border-radius: var(--r); }
.crm-pk-row { cursor: pointer; }
.crm-pk-row td { color: var(--ink); }
table.crm-t tbody tr.crm-pk-hi td { background: var(--info-soft); }
table.crm-t tbody tr.crm-pk-cur td:first-child { box-shadow: inset 3px 0 0 var(--primary); }
.crm-pk-name { display: inline-flex; align-items: center; gap: 8px; min-width: 0; }
.crm-pk-empty { text-align: center; color: var(--muted); height: 64px !important; }

.crm-dialog-foot {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 6px;
    padding-top: 10px;
    border-top: 1px solid var(--line-2);
}

.crm-followup,
.crm-gate-project {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    padding: 8px 10px;
    border: 1px dashed var(--line);
    border-radius: var(--r);
    background: var(--surface-2);
}

.crm-followup-fields { display: flex; align-items: center; gap: 6px; flex: 1 1 260px; }
.crm-followup-unit { font-size: var(--fs-sm); color: var(--muted); white-space: nowrap; }
.crm-gate-project .crm-hint { flex-basis: 100%; }

.crm-line-total {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 10px;
    border-radius: var(--r);
    background: var(--surface-2);
    font-size: var(--fs-sm);
    /* Tutar değişince pencere boyu oynamaz. */
    min-height: 38px;
    font-variant-numeric: tabular-nums;
}

.crm-preview { display: flex; align-items: center; min-height: 32px; }
.crm-flags { display: flex; flex-direction: column; gap: 4px; }

.crm-flag-row {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: var(--fs-sm);
}

.crm-flag-row .crm-faint { font-size: var(--fs-xs); }

.crm-gate-head {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--line-2);
    font-size: var(--fs);
}

/* ─── Tanımlar / ayarlar ekranı ───────────────────────────────────────── */

.crm-def-layout {
    display: flex;
    flex-wrap: wrap;
    gap: var(--gap);
    align-items: flex-start;
}

.crm-def-types { flex: 0 1 300px; min-width: 260px; }
.crm-def-items { flex: 3 1 560px; min-width: 320px; }

.crm-def-group {
    font-size: var(--fs-xs);
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--muted);
    font-weight: 700;
    margin: 12px 0 4px;
}

.crm-def-type {
    display: flex;
    align-items: center;
    width: 100%;
    gap: 8px;
    padding: 6px 8px;
    border: 0;
    border-radius: var(--r-sm);
    background: transparent;
    text-align: left;
    font-size: var(--fs-sm);
    color: var(--ink-2);
    cursor: pointer;
}

.crm-def-type:hover { background: var(--surface-2); }

.crm-def-type-on {
    background: var(--primary-soft);
    color: var(--primary-strong);
    font-weight: 650;
}

.crm-def-count {
    margin-left: auto;
    min-width: 22px;
    text-align: center;
    font-size: var(--fs-xs);
    color: var(--muted);
    background: var(--surface-3);
    border-radius: var(--pill);
    padding: 0 6px;
    font-variant-numeric: tabular-nums;
}

/* ═══════════════════ Radzen bileşenlerini prototipe uydurma ═══════════ */

/* Izgara: prototipteki table.t — başlık küçük/büyük harf, satır 40px,
   ince çizgiler, sayı kolonları tabular. */
:is(.crm-page, .crm-dialog) .rz-datatable,
:is(.crm-page, .crm-dialog) .rz-data-grid {
    border: 1px solid var(--line-2);
    border-radius: var(--r);
    box-shadow: none;
    font-size: var(--fs-sm);
}

:is(.crm-page, .crm-dialog) .rz-datatable-thead > tr > th,
:is(.crm-page, .crm-dialog) .rz-grid-table thead > tr > th {
    background: var(--surface-2);
    color: var(--ink-2);
    border-bottom: 1px solid var(--line);
    font-size: var(--fs-xs);
    font-weight: 650;
    text-transform: uppercase;
    letter-spacing: .04em;
    padding: 0 10px;
    height: 38px;
}

:is(.crm-page, .crm-dialog) .rz-grid-table tbody > tr > td,
:is(.crm-page, .crm-dialog) .rz-datatable-data > tr > td {
    border-bottom: 1px solid var(--line-2);
    padding: 0 10px;
    height: var(--row);
    font-size: var(--fs-sm);
    color: var(--ink);
}

:is(.crm-page, .crm-dialog) .rz-grid-table tbody > tr:hover > td { background: var(--surface-2); }
:is(.crm-page, .crm-dialog) .rz-datatable-even > td { background: var(--surface); }

/* Düğmeler */
:is(.crm-page, .crm-dialog) .rz-button {
    border-radius: var(--r-sm);
    font-size: var(--fs-sm);
    font-weight: 600;
    text-transform: none;
    box-shadow: none;
    letter-spacing: 0;
}

:is(.crm-page, .crm-dialog) .rz-button.rz-secondary,
:is(.crm-page, .crm-dialog) .rz-button.rz-light {
    background: var(--surface);
    border: 1px solid var(--line);
    color: var(--ink-2);
}

:is(.crm-page, .crm-dialog) .rz-button.rz-light:hover { background: var(--surface-2); border-color: var(--faint); }

:is(.crm-page, .crm-dialog) .rz-button.rz-primary {
    background: var(--primary);
    border: 1px solid var(--primary);
    color: #fff;
}

:is(.crm-page, .crm-dialog) .rz-button.rz-primary:hover { background: var(--primary-strong); border-color: var(--primary-strong); }

/* Girişler: yükseklik 32px, köşe 3px, ince çizgi */
:is(.crm-page, .crm-dialog) .rz-textbox,
:is(.crm-page, .crm-dialog) .rz-dropdown,
:is(.crm-page, .crm-dialog) .rz-spinner,
:is(.crm-page, .crm-dialog) .rz-datepicker,
:is(.crm-page, .crm-dialog) .rz-numeric {
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface);
    font-size: var(--fs-sm);
    min-height: var(--ctl);
}

:is(.crm-page, .crm-dialog) .rz-textarea {
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    font-size: var(--fs-sm);
}

/* Sekmeler: prototipteki .tabs — alt çizgi vurgusu, ŞERİT KAYDIRMAZ, sarar (#4). */
:is(.crm-page, .crm-dialog) .rz-tabview-nav {
    flex-wrap: wrap;
    overflow: visible;
    background: transparent;
    border-bottom: 1px solid var(--line);
    gap: 2px 4px;
}

:is(.crm-page, .crm-dialog) .rz-tabview-nav li {
    background: transparent;
    border: 0;
}

:is(.crm-page, .crm-dialog) .rz-tabview-nav li a,
:is(.crm-page, .crm-dialog) .rz-tabview-nav li .rz-tabview-title {
    padding: 9px 12px 8px;
    font-size: var(--fs-sm);
    font-weight: 600;
    color: var(--muted);
    border-bottom: 3px solid transparent;
    text-transform: none;
}

:is(.crm-page, .crm-dialog) .rz-tabview-nav li.rz-state-active a,
:is(.crm-page, .crm-dialog) .rz-tabview-nav li.rz-tabview-selected a {
    color: var(--ink);
    border-bottom-color: var(--primary);
    background: transparent;
}

:is(.crm-page, .crm-dialog) .rz-tabview-panels {
    background: transparent;
    padding: 12px 0 0;
}

/* Kartlar */
:is(.crm-page, .crm-dialog) .rz-card {
    background: var(--surface);
    border: 1px solid var(--line-2);
    border-radius: var(--r);
    box-shadow: var(--shadow);
    padding: 12px 14px;
}

/* Seçim çubuğu (Pano / Liste, Benim / Ekip) */
:is(.crm-page, .crm-dialog) .rz-selectbutton .rz-button {
    border: 1px solid var(--line);
    background: var(--surface);
    color: var(--ink-2);
}

:is(.crm-page, .crm-dialog) .rz-selectbutton .rz-button.rz-state-active {
    background: var(--surface-3);
    border-color: var(--faint);
    color: var(--ink);
}

/* Rozetler */
:is(.crm-page, .crm-dialog) .rz-badge {
    border-radius: var(--pill);
    font-size: var(--fs-xs);
    font-weight: 600;
    padding: 1px 8px;
}

/* Zaman akışında ay başlığı (prototip .tl-month) */
.crm-tl-month {
    display: flex;
    gap: 8px;
    align-items: center;
    margin: 16px 0 8px;
    font-size: var(--fs-xs);
    font-weight: 700;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: .07em;
}

.crm-tl-month::after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--line-2);
}

/* Kural penceresindeki kart önizlemesi */
.crm-preview-card {
    display: block;
    width: 220px;
    cursor: default;
}

.crm-preview-card .crm-deal-title { margin-bottom: 4px; }

/* ═══════════════════════════════════════════════════════ TAKVİM ═══════
   Anatomi prototipten alınmıştır: solda tür süzgeci, sağda ay ızgarası /
   hafta sütunları / gün / liste. Olay çipi (.crm-ev) türün rengini taşır,
   ama metni de yazar — renk tek başına anlatmaz. */

.crm-cal {
    display: grid;
    grid-template-columns: 250px minmax(0, 1fr);
    gap: 14px;
    align-items: start;
}

@media (max-width: 900px) {
    .crm-cal { grid-template-columns: minmax(0, 1fr); }
}

.crm-cal-side {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.crm-cal-check {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 3px 0;
    font-size: var(--fs-sm);
    cursor: pointer;
}

.crm-cal-check .crm-cal-n {
    margin-left: auto;
    color: var(--faint);
    font-size: var(--fs-xs);
    font-variant-numeric: tabular-nums;
    min-width: 20px;
    text-align: right;
}

.crm-cal-swatch {
    width: 12px;
    height: 12px;
    border-radius: 3px;
    background: var(--c, #64748b);
    flex: none;
}

.crm-cal-main {
    background: var(--surface);
    border: 1px solid var(--line-2);
    border-radius: var(--r);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.crm-cal-head {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    border-bottom: 1px solid var(--line-2);
    flex-wrap: wrap;
}

.crm-cal-title {
    margin: 0;
    font-size: var(--fs-h2);
    font-weight: 650;
    min-width: 200px;
    white-space: nowrap;
}

/* ── Ay ızgarası ── */

.crm-month {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
}

.crm-month .crm-dh {
    font-size: var(--fs-xs);
    color: var(--muted);
    text-align: center;
    padding: 6px 0;
    border-bottom: 1px solid var(--line-2);
    font-weight: 650;
    text-transform: uppercase;
}

.crm-month .crm-dc {
    border-right: 1px solid var(--line-2);
    border-bottom: 1px solid var(--line-2);
    padding: 4px;
    min-height: 104px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: 2px;
    cursor: pointer;
}

.crm-month .crm-dc:nth-child(7n) { border-right: 0; }
.crm-month .crm-dc-out { background: var(--surface-2); }
.crm-month .crm-dc-out .crm-dn { color: var(--faint); }
.crm-month .crm-dc-over { background: var(--primary-soft); }

.crm-month .crm-dn {
    font-size: var(--fs-xs);
    font-weight: 650;
    width: 24px;
    height: 24px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    font-variant-numeric: tabular-nums;
}

.crm-month .crm-dc-today .crm-dn { background: var(--primary); color: #fff; }

/* ── Olay çipi ── */

.crm-ev {
    --c: #2a78d6;
    font-size: 11px;
    border-radius: 4px;
    padding: 1px 6px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    cursor: grab;
    background: color-mix(in srgb, var(--c) 16%, var(--surface));
    color: color-mix(in srgb, var(--c) 55%, var(--ink));
    border-left: 3px solid var(--c);
    line-height: 18px;
}

.crm-ev:hover { filter: brightness(.95); }
.crm-ev-done { text-decoration: line-through; opacity: .75; }

.crm-more {
    font-size: 10.5px;
    color: var(--link);
    padding-left: 6px;
    cursor: pointer;
}

/* ── Hafta / gün sütunları ── */

.crm-week {
    display: grid;
    grid-template-columns: 56px repeat(var(--days, 7), minmax(0, 1fr));
    max-height: 640px;
    overflow-y: auto;
    position: relative;
}

.crm-week .crm-wh {
    position: sticky;
    top: 0;
    z-index: 3;
    background: var(--surface);
    border-bottom: 1px solid var(--line);
    text-align: center;
    padding: 6px 0;
    font-size: var(--fs-xs);
    color: var(--muted);
    height: 52px;
}

.crm-week .crm-wh b {
    display: block;
    font-size: 18px;
    color: var(--ink);
    font-weight: 600;
}

.crm-week .crm-wh-today b { color: var(--primary-strong); }

.crm-week .crm-gut { border-right: 1px solid var(--line-2); }

.crm-week .crm-gut div {
    height: 48px;
    font-size: 10.5px;
    color: var(--faint);
    text-align: right;
    padding-right: 6px;
    transform: translateY(-7px);
}

.crm-week .crm-dcol {
    position: relative;
    border-right: 1px solid var(--line-2);
    background-image: repeating-linear-gradient(to bottom, transparent 0, transparent 47px, var(--line-2) 47px, var(--line-2) 48px);
    min-height: 1152px;
}

.crm-week .crm-dcol-today { background-color: color-mix(in srgb, var(--primary) 4%, transparent); }
.crm-week .crm-dcol-over { background-color: var(--primary-soft); }

.crm-wev {
    --c: #2a78d6;
    position: absolute;
    left: 3px;
    right: 3px;
    border-radius: 5px;
    background: color-mix(in srgb, var(--c) 18%, var(--surface));
    border-left: 3px solid var(--c);
    padding: 3px 6px;
    font-size: 11px;
    overflow: hidden;
    cursor: grab;
    color: var(--ink);
    box-shadow: 0 0 0 1px var(--surface);
}

.crm-wev b {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: 650;
}

.crm-wev small { color: var(--muted); font-variant-numeric: tabular-nums; }

/* ── Liste (ajanda) ── */

.crm-agenda .crm-ag {
    display: grid;
    grid-template-columns: 110px 12px minmax(0, 1fr) auto;
    gap: 10px;
    align-items: center;
    padding: 9px 14px;
    border-bottom: 1px solid var(--line-2);
    font-size: var(--fs-sm);
}

.crm-agenda .crm-agd {
    padding: 10px 14px 4px;
    font-size: var(--fs-xs);
    font-weight: 700;
    color: var(--muted);
    text-transform: uppercase;
    letter-spacing: .06em;
    background: var(--surface-2);
}

/* Kayıtlı görünüm sekmeleri (prototip .tabs) */
.crm-viewtabs {
    display: flex;
    flex-wrap: wrap;
    gap: 2px 4px;
    border-bottom: 1px solid var(--line);
    margin-bottom: 10px;
}

.crm-viewtab {
    border: 0;
    background: transparent;
    padding: 8px 12px 7px;
    font-size: var(--fs-sm);
    font-weight: 600;
    color: var(--muted);
    cursor: pointer;
    border-bottom: 3px solid transparent;
    white-space: nowrap;
}

.crm-viewtab:hover { color: var(--ink); }
.crm-viewtab-on { color: var(--ink); border-bottom-color: var(--primary); }

/* ─── Veri kalitesi ve birleştirme ────────────────────────────────────── */

.crm-quality .crm-row-side b { font-size: var(--fs-h2); }

.crm-merge-head {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
}

.crm-merge-col {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 10px 12px;
    border: 1px solid var(--line-2);
    border-radius: var(--r);
    background: var(--surface-2);
}

.crm-merge-fields {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--line-2);
    border-radius: var(--r);
    overflow: hidden;
}

.crm-merge-row {
    display: grid;
    grid-template-columns: 160px 1fr 1fr;
    gap: 1px;
    border-bottom: 1px solid var(--line-2);
    background: var(--line-2);
}

.crm-merge-row:last-child { border-bottom: 0; }

.crm-merge-label {
    padding: 7px 10px;
    background: var(--surface-2);
    font-size: var(--fs-xs);
    color: var(--muted);
    font-weight: 600;
}

.crm-merge-val {
    text-align: left;
    border: 0;
    background: var(--surface);
    padding: 7px 10px;
    font-size: var(--fs-sm);
    cursor: pointer;
    color: var(--ink);
    min-height: 32px;
}

.crm-merge-val:hover { background: var(--surface-2); }

.crm-merge-on {
    background: var(--primary-soft);
    color: var(--primary-strong);
    font-weight: 650;
    box-shadow: inset 0 0 0 1px var(--primary);
}

/* Farklı olan satır işaretlenir; aynı olanlar sessiz kalır. */
.crm-merge-diff .crm-merge-label { color: var(--warn); }

/* ─── Görev odak kuyruğu ──────────────────────────────────────────────── */

.crm-focus-top { display: flex; align-items: center; gap: 8px; }

.crm-focus-card {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 14px 16px;
    border: 1px solid var(--line-2);
    border-radius: var(--r);
    background: var(--surface-2);
    /* Görevden göreve kart boyu değişmesin. */
    min-height: 132px;
}

.crm-focus-title { font-size: var(--fs-h2); font-weight: 650; }

.crm-focus-meta {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    font-size: var(--fs-xs);
    color: var(--muted);
}

.crm-focus-note {
    font-size: var(--fs-sm);
    color: var(--ink-2);
    white-space: pre-wrap;
    min-height: 40px;
}

.crm-focus-snooze { align-items: flex-end; }

.crm-focus-done {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    padding: 28px;
    color: var(--good);
}

.crm-focus-done b { font-size: var(--fs-h2); color: var(--ink); }

/* ═══════════════════════════════════ KAYIT DİZİN SAYFASI (prototip .ix) ═══
   Liste ekranları Radzen ızgarasıyla değil, prototipin düz tablosuyla çizilir:
   sıralama oku başlıkta, işlem düğmeleri satır üstünde belirir, ad hücresinde
   baş harf rozeti durur. Böylece prototiple aynı görünür. */

.crm-ix-head {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 10px;
}

.crm-ix-head h1 {
    font-size: var(--fs-h1);
    font-weight: 650;
    margin: 0;
}

.crm-ix-count {
    font-size: var(--fs-sm);
    color: var(--muted);
    font-variant-numeric: tabular-nums;
}

/* Araç şeridi: arama + hızlı süzgeç çipleri */
.crm-ix-tools {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    padding: 10px 12px;
    background: var(--surface);
    border: 1px solid var(--line-2);
    border-bottom: 0;
    border-radius: var(--r) var(--r) 0 0;
}

.crm-ix-tools-bulk { background: var(--info-soft); }

.crm-ix-q { position: relative; width: 240px; }

.crm-ix-q input {
    width: 100%;
    height: var(--ctl);
    padding: 0 9px 0 30px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface);
    font-size: var(--fs-sm);
    color: var(--ink);
}

.crm-ix-q .crm-ix-q-ic {
    position: absolute;
    left: 7px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--faint);
    font-size: 17px;
}

.crm-qf { position: relative; display: inline-flex; }

.crm-qf-btn {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    height: var(--ctl);
    padding: 0 10px;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface);
    font-size: var(--fs-sm);
    color: var(--ink-2);
    cursor: pointer;
    white-space: nowrap;
    max-width: 210px;
}

.crm-qf-btn:hover { border-color: var(--faint); }

.crm-qf-on {
    border-color: var(--primary);
    color: var(--primary-strong);
    background: var(--primary-soft);
}

.crm-qf-v { overflow: hidden; text-overflow: ellipsis; max-width: 120px; }

/* Açılır liste MAT ve üstte durur (ARAYUZ_KURALLARI). */
.crm-qf-pop {
    position: absolute;
    top: calc(var(--ctl) + 4px);
    left: 0;
    z-index: 40;
    min-width: 210px;
    max-height: 320px;
    overflow-y: auto;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--r);
    box-shadow: 0 18px 40px rgba(15, 23, 42, .28);
    padding: 4px;
}

.crm-qf-item {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    border: 0;
    background: transparent;
    padding: 6px 8px;
    border-radius: var(--r-sm);
    font-size: var(--fs-sm);
    color: var(--ink);
    cursor: pointer;
    text-align: left;
}

.crm-qf-item:hover { background: var(--surface-2); }
.crm-qf-item-on { background: var(--primary-soft); color: var(--primary-strong); font-weight: 650; }

/* ── Tablo ── */

.crm-tbl-wrap {
    background: var(--surface);
    border: 1px solid var(--line-2);
    border-radius: 0 0 var(--r) var(--r);
    overflow: auto;
    max-height: calc(100vh - 320px);
}

table.crm-t {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0;
    font-size: var(--fs-sm);
}

table.crm-t th {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--surface-2);
    text-align: left;
    font-weight: 650;
    color: var(--ink-2);
    border-bottom: 1px solid var(--line);
    padding: 0 10px;
    height: 38px;
    white-space: nowrap;
    font-size: var(--fs-xs);
    text-transform: uppercase;
    letter-spacing: .04em;
}

table.crm-t th .crm-hd {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    cursor: pointer;
    border-radius: 4px;
    padding: 2px 4px;
    margin-left: -4px;
    border: 0;
    background: transparent;
    font: inherit;
    color: inherit;
    text-transform: inherit;
    letter-spacing: inherit;
}

table.crm-t th .crm-hd:hover { background: var(--surface-3); }
table.crm-t th .crm-hd-on { color: var(--primary-strong); }
table.crm-t th .crm-hd .rz-icon,
table.crm-t th .crm-hd .crm-ic { font-size: 15px; }

table.crm-t td {
    border-bottom: 1px solid var(--line-2);
    padding: 0 10px;
    height: var(--row);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 320px;
    background: var(--surface);
    color: var(--ink);
}

table.crm-t tbody tr:hover td { background: var(--surface-2); }
table.crm-t tbody tr.crm-tr-on td { background: var(--info-soft); }

table.crm-t .crm-chk { width: 38px; padding: 0 0 0 12px; }
table.crm-t .crm-acts { width: 92px; padding: 0 4px; }

/* İşlem düğmeleri satır üstünde belirir; yerleri baştan ayrıldığı için düzen kaymaz. */
.crm-acts .crm-iconbtn,
.crm-namecell .crm-peek { visibility: hidden; }

table.crm-t tbody tr:hover .crm-acts .crm-iconbtn,
table.crm-t tbody tr.crm-tr-on .crm-acts .crm-iconbtn,
table.crm-t tbody tr:hover .crm-namecell .crm-peek { visibility: visible; }

.crm-iconbtn {
    width: 26px;
    height: 26px;
    border: 1px solid transparent;
    border-radius: var(--r-sm);
    background: transparent;
    color: var(--muted);
    cursor: pointer;
    display: inline-grid;
    place-items: center;
    vertical-align: middle;
}

.crm-iconbtn:hover { background: var(--surface-3); color: var(--ink); border-color: var(--line); }
.crm-iconbtn-danger:hover { color: var(--bad); border-color: var(--bad); }
.crm-iconbtn .rz-icon,
.crm-iconbtn .crm-ic { font-size: 16px; }
.crm-iconbtn:disabled { opacity: .4; cursor: not-allowed; }

/* Ad hücresi: baş harf rozeti + bağlantı + önizleme düğmesi */
.crm-namecell {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}

.crm-namecell a {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 600;
}

.crm-peek {
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface);
    color: var(--ink-2);
    font-size: 10.5px;
    font-weight: 600;
    padding: 2px 7px;
    cursor: pointer;
    margin-left: auto;
}

.crm-peek:hover { border-color: var(--primary); color: var(--primary-strong); background: var(--primary-soft); }

.crm-av {
    --c: #6b7280;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    display: inline-grid;
    place-items: center;
    font-size: 11px;
    font-weight: 700;
    color: #fff;
    background: var(--c);
    flex: 0 0 auto;
    letter-spacing: .02em;
    vertical-align: middle;
}

.crm-av-sm { width: 22px; height: 22px; font-size: 9.5px; }
.crm-av-co { border-radius: 8px; }

.crm-owner {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
}

/* ── Sayfalama ── */

.crm-pager {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 2px;
    font-size: var(--fs-sm);
    color: var(--muted);
}

.crm-pager .crm-pg {
    min-width: 150px;
    text-align: center;
    font-variant-numeric: tabular-nums;
}

/* ── Önizleme paneli ── */

.crm-ix-layout {
    display: flex;
    gap: var(--gap);
    align-items: flex-start;
}

.crm-ix-main { flex: 1 1 auto; min-width: 0; }

.crm-pv {
    flex: 0 0 320px;
    background: var(--surface);
    border: 1px solid var(--line-2);
    border-radius: var(--r);
    box-shadow: var(--shadow);
    padding: 12px 14px;
    position: sticky;
    top: 8px;
}

.crm-pv-head {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--line-2);
}

.crm-pv-sect {
    border-top: 1px solid var(--line-2);
    padding: 10px 0;
}

.crm-pv-sect:first-of-type { border-top: 0; }

/* Görünüm sekmesinde silme çarpısı (yalnız kullanıcının kendi görünümünde) */
.crm-viewtab-wrap { position: relative; display: inline-flex; align-items: center; }

.crm-viewtab-x {
    border: 0;
    background: transparent;
    color: var(--faint);
    font-size: 15px;
    line-height: 1;
    cursor: pointer;
    padding: 0 4px;
    visibility: hidden;
}

.crm-viewtab-wrap:hover .crm-viewtab-x { visibility: visible; }
.crm-viewtab-x:hover { color: var(--bad); }
.crm-viewtab-add { color: var(--link); }

/* ═══════════════════ Ölçüler: prototipin kontrol boyutları ═══════════════
   Prototipte düğme ve giriş yüksekliği --ctl (32 px), küçük düğme 26 px,
   tablo satırı --row (40 px). Radzen'in kendi ölçüleri bunlardan büyüktür;
   .crm-page içinde eşitlenir ki ekran prototiple aynı yoğunlukta görünsün. */

:is(.crm-page, .crm-dialog) .rz-button {
    height: var(--ctl);
    min-height: var(--ctl);
    padding: 0 12px;
    gap: 6px;
}

:is(.crm-page, .crm-dialog) .rz-button.rz-button-sm,
:is(.crm-page, .crm-dialog) .rz-button.rz-button-xs {
    height: 26px;
    min-height: 26px;
    padding: 0 8px;
    font-size: var(--fs-xs);
}

:is(.crm-page, .crm-dialog) .rz-button .rz-button-text { line-height: 1; }

:is(.crm-page, .crm-dialog) .rz-button .rz-button-icon-left,
:is(.crm-page, .crm-dialog) .rz-button .rz-icon {
    font-size: 17px;
    margin: 0;
}

:is(.crm-page, .crm-dialog) .rz-button.rz-button-icon-only {
    width: var(--ctl);
    padding: 0;
}

:is(.crm-page, .crm-dialog) .rz-button.rz-button-sm.rz-button-icon-only,
:is(.crm-page, .crm-dialog) .rz-button.rz-button-xs.rz-button-icon-only {
    width: 26px;
}

/* Girişler: yükseklik ve iç boşluk */
:is(.crm-page, .crm-dialog) .rz-textbox,
:is(.crm-page, .crm-dialog) .rz-dropdown,
:is(.crm-page, .crm-dialog) .rz-datepicker,
:is(.crm-page, .crm-dialog) .rz-numeric input,
:is(.crm-page, .crm-dialog) .rz-spinner input {
    height: var(--ctl);
    min-height: var(--ctl);
    padding: 0 9px;
    line-height: var(--ctl);
}

:is(.crm-page, .crm-dialog) .rz-dropdown .rz-dropdown-label,
:is(.crm-page, .crm-dialog) .rz-dropdown .rz-inputtext {
    line-height: var(--ctl);
    padding: 0;
    font-size: var(--fs-sm);
}

:is(.crm-page, .crm-dialog) .rz-datepicker input { border: 0; padding: 0; height: 100%; }

:is(.crm-page, .crm-dialog) .rz-textarea { padding: 6px 9px; line-height: 1.5; }

/* Süzgeç tarih kutuları 150 px, tarih+saat 190 px (ARAYUZ_KURALLARI §6) —
   sayfa Style ile veriyor; burada iç input taşmasın diye genişlik serbest. */
:is(.crm-page, .crm-dialog) .rz-datepicker { max-width: 100%; }

/* Onay kutusu ve anahtar prototiptekiyle aynı boyda */
:is(.crm-page, .crm-dialog) .rz-checkbox-box {
    width: 16px;
    height: 16px;
    border-radius: 3px;
}

:is(.crm-page, .crm-dialog) .rz-checkbox-box .rz-chkbox-icon { font-size: 13px; }

:is(.crm-page, .crm-dialog) .rz-switch { width: 36px; height: 20px; }

/* Seçim çubuğu (Tablo/Pano, Gün/Hafta/Ay) */
:is(.crm-page, .crm-dialog) .rz-selectbutton .rz-button {
    height: var(--ctl);
    min-height: var(--ctl);
    padding: 0 10px;
    font-size: var(--fs-sm);
}

/* Etiketler ve yardımcı metinler */
:is(.crm-page, .crm-dialog) .rz-label,
:is(.crm-page, .crm-dialog) label { font-size: var(--fs-sm); }

/* Pencere başlığı ve gövdesi prototipteki ölçülerde */
.crm-page-dialog .rz-dialog-title { font-size: var(--fs-h2); font-weight: 650; }

/* Bildirim/uyarı kutuları */
:is(.crm-page, .crm-dialog) .rz-notification,
:is(.crm-page, .crm-dialog) .rz-alert {
    font-size: var(--fs-sm);
    border-radius: var(--r);
    padding: 8px 12px;
}

/* Bağlantılar prototipteki mavi tonda; Radzen'in kendi rengi kullanılmaz. */
:is(.crm-page, .crm-dialog) a,
:is(.crm-page, .crm-dialog) .rz-link {
    color: var(--link);
    text-decoration: none;
}

:is(.crm-page, .crm-dialog) a:hover,
:is(.crm-page, .crm-dialog) .rz-link:hover { text-decoration: underline; }

/* Hızlı eylem şeridi (prototip .qacts): yuvarlak simge + altında etiket. */
.crm-qacts {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 4px;
    margin: 10px 0 4px;
}

.crm-qacts button {
    border: 0;
    background: transparent;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    font-size: 10.5px;
    color: var(--muted);
    cursor: pointer;
    padding: 4px 0;
    border-radius: var(--r-sm);
}

.crm-qacts button .crm-qa-c {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 1px solid var(--line);
    display: grid;
    place-items: center;
    color: var(--ink-2);
    background: var(--surface);
}

.crm-qacts button:hover .crm-qa-c {
    border-color: var(--primary);
    color: var(--primary-strong);
    background: var(--primary-soft);
}

.crm-qacts button:disabled { opacity: .45; cursor: not-allowed; }
.crm-qacts button:disabled:hover .crm-qa-c { border-color: var(--line); color: var(--ink-2); background: var(--surface); }

/* Görev ekranının sayaçlı sekmeleri (prototip .tabs .cnt) */
.crm-tabcount {
    min-width: 20px;
    font-size: 10.5px;
    background: var(--surface-3);
    border-radius: var(--pill);
    padding: 0 6px;
    font-variant-numeric: tabular-nums;
    text-align: center;
    margin-left: 6px;
}

.crm-viewtab-on .crm-tabcount { background: var(--primary-soft); color: var(--primary-strong); }

/* ═══════════════ Prototip HTML bileşenleri (Radzen yerine) ═══════════════
   Düğme, giriş, seçici, kart, uyarı ve rozet prototipteki .btn / .in / .sel /
   .card / .chip ölçüleriyle birebir aynıdır. Radzen yalnız pencere yönetimi
   (DialogService) ve simge (material-icons) için kalır. */

/* ── Düğme (.btn) ── */

.crm-btn {
    height: var(--ctl);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 0 12px;
    border-radius: var(--r-sm);
    border: 1px solid var(--line);
    background: var(--surface);
    color: var(--ink-2);
    font-size: var(--fs-sm);
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
}

.crm-btn:hover:not(:disabled) { background: var(--surface-2); border-color: var(--faint); }
.crm-btn:disabled { opacity: .5; cursor: not-allowed; }
.crm-btn .rz-icon,
.crm-btn .crm-ic { font-size: 17px; }

.crm-btn-pri { background: var(--primary); border-color: var(--primary); color: #fff; }
.crm-btn-pri:hover:not(:disabled) { background: var(--primary-strong); border-color: var(--primary-strong); }

.crm-btn-sec { background: var(--surface); border-color: var(--primary); color: var(--primary-strong); }
.crm-btn-sec:hover:not(:disabled) { background: var(--primary-soft); }

.crm-btn-ghost { border-color: transparent; background: transparent; color: var(--link); }
.crm-btn-ghost:hover:not(:disabled) { background: var(--surface-3); }

.crm-btn-danger { color: var(--bad); border-color: var(--bad); }
.crm-btn-danger:hover:not(:disabled) { background: var(--bad-soft); }

.crm-btn-on { background: var(--surface-3); border-color: var(--faint); color: var(--ink); }

.crm-btn-sm { height: 26px; padding: 0 8px; font-size: var(--fs-xs); }
.crm-btn-sm .rz-icon { font-size: 15px; }

.crm-btn-icon { width: var(--ctl); padding: 0; }
.crm-btn-sm.crm-btn-icon { width: 26px; }

/* ── Giriş (.in) ve seçici (.sel) ── */

.crm-in,
.crm-sel,
.crm-page input[type="text"].crm-in,
.crm-dialog input[type="text"].crm-in {
    height: var(--ctl);
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    background: var(--surface);
    padding: 0 9px;
    font-size: var(--fs-sm);
    color: var(--ink);
    width: 100%;
    font-family: inherit;
}

.crm-sel { cursor: pointer; }

textarea.crm-in {
    height: auto;
    padding: 6px 9px;
    line-height: 1.5;
    resize: vertical;
}

.crm-in:focus,
.crm-sel:focus {
    outline: 2px solid var(--focus);
    outline-offset: -1px;
    border-color: transparent;
}

.crm-in:disabled,
.crm-sel:disabled { background: var(--surface-2); color: var(--faint); cursor: not-allowed; }

/* Kural #7: süzgeç tarih kutusu 150 px, tarih+saat 190 px */
.crm-in-date { width: 150px; }
.crm-in-datetime { width: 190px; }

/* Kural #1: sayı alanında artır/azalt oku yok */
.crm-in[type="number"]::-webkit-inner-spin-button,
.crm-in[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.crm-in[type="number"] { -moz-appearance: textfield; }

/* ── Bölümlü seçici ── */

.crm-seg {
    display: inline-flex;
    border: 1px solid var(--line);
    border-radius: var(--r-sm);
    overflow: hidden;
    background: var(--surface);
}

.crm-seg button {
    height: var(--ctl);
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 0 10px;
    border: 0;
    border-right: 1px solid var(--line);
    background: transparent;
    color: var(--ink-2);
    font-size: var(--fs-sm);
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
}

.crm-seg button:last-child { border-right: 0; }
.crm-seg button:hover { background: var(--surface-2); }
.crm-seg button .rz-icon { font-size: 16px; }

.crm-seg .crm-seg-on {
    background: var(--surface-3);
    color: var(--ink);
}

/* ── Kart, uyarı, rozet, yükleniyor ── */

.crm-card {
    background: var(--surface);
    border: 1px solid var(--line-2);
    border-radius: var(--r);
    box-shadow: var(--shadow);
    padding: 12px 14px;
}

.crm-alert {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 9px 12px;
    border-radius: var(--r);
    font-size: var(--fs-sm);
    background: var(--info-soft);
    color: var(--info);
    border: 1px solid transparent;
}

.crm-alert-warn { background: var(--warn-soft); color: var(--warn); }
.crm-alert-bad { background: var(--bad-soft); color: var(--bad); }
.crm-alert-good { background: var(--good-soft); color: var(--good); }
.crm-alert b { color: inherit; }

.crm-badge {
    display: inline-flex;
    align-items: center;
    height: 20px;
    padding: 0 8px;
    border-radius: var(--pill);
    font-size: var(--fs-xs);
    font-weight: 600;
    background: var(--surface-3);
    color: var(--ink-2);
}

.crm-badge-good { background: var(--good-soft); color: var(--good); }
.crm-badge-muted { background: var(--surface-3); color: var(--muted); }

.crm-spin {
    width: 18px;
    height: 18px;
    border: 2px solid var(--line);
    border-top-color: var(--primary);
    border-radius: 50%;
    display: inline-block;
    animation: crm-spin 0.8s linear infinite;
}

@keyframes crm-spin { to { transform: rotate(360deg); } }

/* ── Onay kutusu ── */

.crm-chkbox {
    width: 16px;
    height: 16px;
    accent-color: var(--primary);
    cursor: pointer;
    margin: 0;
    vertical-align: middle;
}

.crm-chk-label {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: var(--fs-sm);
    color: var(--ink-2);
    cursor: pointer;
    white-space: nowrap;
}

/* ── Pencere kabuğu: prototipteki .modal ölçüleri ── */

.rz-dialog .crm-dialog { padding: 0; }

.rz-dialog-titlebar { padding: 10px 14px; border-bottom: 1px solid var(--line-2); }
.rz-dialog-title { font-size: var(--fs-h2); font-weight: 650; }
.rz-dialog-content { padding: 14px; }

/* Gecikmiş/riskli sayaç: sekmede sayı kırmızı zeminde durur (prototip TASK_TABS). */
.crm-tabcount-bad { background: var(--bad) !important; color: #fff !important; }

/* Sayı hücresi — prototipteki .num: sağa yaslı, eşit genişlikte rakam, satır kırılmaz. */
:is(.crm-page, .crm-dialog) .crm-num {
    text-align: right;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

/* Tıklanabilir çip (durum geçişi) — görünüm çiple aynı, imleç ve odak halkası eklenir. */
:is(.crm-page, .crm-dialog) button.crm-chip-btn { cursor: pointer; }
:is(.crm-page, .crm-dialog) button.crm-chip-btn:disabled { cursor: default; opacity: .6; }
:is(.crm-page, .crm-dialog) button.crm-chip-btn:not(:disabled):hover { filter: brightness(.96); }

/* Satır altındaki ikincil not: boşken de yer kaplar, satır yüksekliği oynamaz. */
:is(.crm-page, .crm-dialog) .crm-sub-fixed { min-height: 14px; }

/* Renk paleti — prototipteki .swatches / .sw. Seçili renk koyu halkayla belli olur;
   renksiz seçeneği çapraz tarama ile gösterilir (renk tek başına anlam taşımaz). */
:is(.crm-page, .crm-dialog) .crm-swatches { display: flex; gap: 6px; flex-wrap: wrap; }
:is(.crm-page, .crm-dialog) .crm-sw {
    width: 22px;
    height: 22px;
    padding: 0;
    border-radius: 50%;
    background: var(--c);
    cursor: pointer;
    border: 2px solid var(--surface);
    box-shadow: 0 0 0 1px var(--line);
}
:is(.crm-page, .crm-dialog) .crm-sw-on { box-shadow: 0 0 0 2px var(--ink); }
:is(.crm-page, .crm-dialog) .crm-sw-none {
    background: repeating-linear-gradient(45deg, var(--surface), var(--surface) 3px, var(--line) 3px, var(--line) 5px);
}

/* Radyo düğmesi — onay kutusuyla aynı ölçüde, aynı vurgu rengiyle. */
:is(.crm-page, .crm-dialog) .crm-radio {
    width: 15px;
    height: 15px;
    accent-color: var(--primary);
    cursor: pointer;
    margin: 0;
}

/* Simge — prototipteki ic(): Material Icons ligatürü, metinle aynı satırda hizalı.
   Boyut çevreleyen yazıdan gelir, böylece düğme ve satır yükseklikleri oynamaz. */
:is(.crm-page, .crm-dialog) .crm-ic {
    font-size: 17px;
    line-height: 1;
    vertical-align: middle;
    user-select: none;
}

/* ─── Sütun başlığı menüsü (prototip .hd + pop) ──────────────────────────────
   Başlık düğmesi tablonun kendi satır yüksekliğini değiştirmez; menü MAT zemindedir. */
:is(.crm-page, .crm-dialog) .crm-hd-wrap { position: relative; }

:is(.crm-page, .crm-dialog) .crm-hd-caret { opacity: 0; }
:is(.crm-page, .crm-dialog) th:hover .crm-hd-caret { opacity: .55; }

:is(.crm-page, .crm-dialog) .crm-hd-pop {
    position: absolute;
    top: 26px;
    left: 0;
    z-index: 40;
    width: 240px;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--r);
    box-shadow: 0 18px 40px rgba(15, 23, 42, .28);
    padding: 4px;
    text-transform: none;
    letter-spacing: 0;
}

:is(.crm-page, .crm-dialog) .crm-hd-title {
    padding: 5px 10px 3px;
    font-size: var(--fs-xs);
    color: var(--faint);
    font-weight: 700;
}

:is(.crm-page, .crm-dialog) .crm-hd-item {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    border: 0;
    background: transparent;
    padding: 6px 10px;
    border-radius: var(--r-sm);
    font-size: var(--fs-sm);
    color: var(--ink);
    font-weight: 400;
    text-align: left;
    cursor: pointer;
}

:is(.crm-page, .crm-dialog) .crm-hd-item:hover { background: var(--surface-2); }
:is(.crm-page, .crm-dialog) .crm-hd-item:disabled { color: var(--faint); cursor: default; background: transparent; }
:is(.crm-page, .crm-dialog) .crm-hd-list { max-height: 260px; overflow-y: auto; }
:is(.crm-page, .crm-dialog) .crm-hd-sep { height: 1px; background: var(--line); margin: 4px 0; }
:is(.crm-page, .crm-dialog) .crm-hd-clear { color: var(--primary-strong); font-weight: 600; }

/* "Şimdi" çizgisi — ajandada geçmiş ile gelecek arasındaki sınır.
   Satırların yüksekliğini değiştirmez, aralarına ince bir şerit olarak girer. */
:is(.crm-page, .crm-dialog) .crm-nowline {
    display: flex;
    align-items: center;
    gap: 6px;
    height: 16px;
    margin: 2px 0;
    color: var(--bad);
    font-size: var(--fs-xs);
    font-weight: 700;
}

:is(.crm-page, .crm-dialog) .crm-nowline::after {
    content: "";
    flex: 1;
    height: 2px;
    background: var(--bad);
    border-radius: 1px;
}

/* Saati geçmiş ajanda kaydı geri planda kalır ama okunur olmayı sürdürür. */
:is(.crm-page, .crm-dialog) .crm-row-past { opacity: .62; }

/* Öneri satırı: metin üstte, eylemler altta. Düğmeler satırın yüksekliğini
   değiştirmesin diye kendi şeridinde durur. */
:is(.crm-page, .crm-dialog) .crm-row-stack {
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
}

:is(.crm-page, .crm-dialog) .crm-row-acts { display: flex; gap: 6px; }

/* ─── Mini ay takvimi (yan panel) ────────────────────────────────────────
   Her zaman 6 hafta çizilir; ay değişince ızgara yüksekliği oynamaz. */
:is(.crm-page, .crm-dialog) .crm-mini {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 1px;
    padding: 4px 2px 2px;
}

:is(.crm-page, .crm-dialog) .crm-mini-h {
    text-align: center;
    font-size: 10.5px;
    color: var(--faint);
    font-weight: 700;
    padding-bottom: 2px;
}

:is(.crm-page, .crm-dialog) .crm-mini-d {
    position: relative;
    height: 26px;
    border: 0;
    background: transparent;
    border-radius: var(--r-sm);
    font-size: var(--fs-xs);
    color: var(--ink);
    cursor: pointer;
    font-variant-numeric: tabular-nums;
}

:is(.crm-page, .crm-dialog) .crm-mini-d:hover { background: var(--surface-2); }
:is(.crm-page, .crm-dialog) .crm-mini-out { color: var(--faint); }
:is(.crm-page, .crm-dialog) .crm-mini-today { font-weight: 800; color: var(--primary-strong); }
:is(.crm-page, .crm-dialog) .crm-mini-on { background: var(--primary-soft); color: var(--primary-strong); font-weight: 700; }

/* Kayıt olan gün noktayla işaretlenir — renk tek başına anlam taşımasın diye
   nokta sayının altında ayrı bir işarettir. */
:is(.crm-page, .crm-dialog) .crm-mini-dot {
    position: absolute;
    left: 50%;
    bottom: 3px;
    width: 4px;
    height: 4px;
    margin-left: -2px;
    border-radius: 50%;
    background: var(--primary);
}

/* Etkinlik balonu — ekranın ortasında, MAT zeminli. Kayıt açılmadan içeriği gösterir. */
:is(.crm-page, .crm-dialog) .crm-ev-pop-back {
    position: fixed;
    inset: 0;
    z-index: 60;
    background: rgba(15, 23, 42, .28);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
}

:is(.crm-page, .crm-dialog) .crm-ev-pop {
    width: min(420px, 96vw);
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--r);
    box-shadow: 0 24px 60px rgba(15, 23, 42, .32);
    padding: 12px 14px;
}

:is(.crm-page, .crm-dialog) .crm-ev-pop-head {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--line);
    margin-bottom: 8px;
}

/* Benzerlik puanı — çubuk ve yüzde birlikte durur: çubuk hızlı tarama,
   yüzde kesin karşılaştırma içindir. Renk tek başına anlam taşımaz. */
:is(.crm-page, .crm-dialog) .crm-score {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-variant-numeric: tabular-nums;
}

:is(.crm-page, .crm-dialog) .crm-score-bar {
    display: inline-block;
    width: 64px;
    height: 6px;
    background: var(--surface-3);
    border-radius: 3px;
    overflow: hidden;
}

:is(.crm-page, .crm-dialog) .crm-score-bar > span {
    display: block;
    height: 100%;
    background: var(--primary);
    border-radius: 3px;
}

/* ⋯ menüsü — düğme diğer başlık düğmeleriyle aynı yükseklikte, menü sağa hizalı. */
:is(.crm-page, .crm-dialog) .crm-more { position: relative; }
:is(.crm-page, .crm-dialog) .crm-more-btn { padding: 0 8px; }

:is(.crm-page, .crm-dialog) .crm-more-pop {
    position: absolute;
    top: calc(var(--ctl) + 4px);
    right: 0;
    z-index: 40;
    width: 220px;
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--r);
    box-shadow: 0 18px 40px rgba(15, 23, 42, .28);
    padding: 4px;
}

:is(.crm-page, .crm-dialog) .crm-more-danger { color: var(--bad); }

/* Akış blok başlığı (Sabitlenmiş / Yaklaşan) — ay başlığıyla aynı ölçüde,
   ama vurgusu farklı ki karıştırılmasın. */
:is(.crm-page, .crm-dialog) .crm-tl-block {
    margin: 10px 0 4px;
    font-size: var(--fs-xs);
    font-weight: 800;
    color: var(--primary-strong);
    letter-spacing: .02em;
}

/* Akıştaki arama kutusu — şeridin yüksekliğini değiştirmesin diye kısa tutulur. */
:is(.crm-page, .crm-dialog) .crm-tl-q { width: 200px; }

/* ─── Komut paleti (Ctrl+K) ──────────────────────────────────────────────
   Ekranın üst üçte birinde açılır: göz zaten oraya bakar, aşağı inmez. */
.crm-pal-back {
    position: fixed;
    inset: 0;
    z-index: 80;
    background: rgba(15, 23, 42, .32);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 12vh 16px 16px;
}

.crm-pal {
    width: min(620px, 96vw);
    background: var(--surface);
    border: 1px solid var(--line);
    border-radius: var(--r);
    box-shadow: 0 28px 70px rgba(15, 23, 42, .38);
    overflow: hidden;
}

.crm-pal-q {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    border-bottom: 1px solid var(--line);
}

.crm-pal-q input {
    flex: 1;
    border: 0;
    outline: none;
    background: transparent;
    font-size: var(--fs);
    color: var(--ink);
}

.crm-pal-list { max-height: 52vh; overflow-y: auto; padding: 4px; }

.crm-pal-t { display: flex; flex-direction: column; line-height: 1.25; }
.crm-pal-t small { color: var(--faint); font-size: var(--fs-xs); }

.crm-pal-foot {
    padding: 6px 12px;
    border-top: 1px solid var(--line);
    background: var(--surface-2);
    font-size: var(--fs-xs);
}

.crm-pal-help { padding: 12px 14px; }

/* Yerinde düzenlenen alan — okuma ve düzenleme hâli aynı yüksekliktedir,
   satır tıklayınca yerinden oynamaz. Kalem yalnız üzerine gelince görünür. */
:is(.crm-page, .crm-dialog) .crm-inline {
    display: flex;
    align-items: center;
    gap: 4px;
    min-height: 24px;
}

:is(.crm-page, .crm-dialog) .crm-inline-v {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    border: 1px solid transparent;
    background: transparent;
    padding: 2px 4px;
    margin: -2px -4px;
    border-radius: var(--r-sm);
    font: inherit;
    color: inherit;
    text-align: left;
    cursor: pointer;
    min-height: 24px;
}

:is(.crm-page, .crm-dialog) .crm-inline-v:disabled { cursor: default; }
:is(.crm-page, .crm-dialog) .crm-inline-v:not(:disabled):hover { border-color: var(--line); background: var(--surface-2); }

:is(.crm-page, .crm-dialog) .crm-inline-pen { font-size: 14px; opacity: 0; color: var(--faint); }
:is(.crm-page, .crm-dialog) .crm-inline-v:hover .crm-inline-pen { opacity: .8; }

:is(.crm-page, .crm-dialog) .crm-inline-on { gap: 4px; }
:is(.crm-page, .crm-dialog) .crm-inline-on .crm-in { height: 24px; padding: 0 6px; font-size: var(--fs-sm); }
:is(.crm-page, .crm-dialog) .crm-inline-acts { display: inline-flex; gap: 2px; }

/* ─── Pano: katlanmış şerit (prototip .lane.fold) ────────────────────────
   Katlanınca kulvar 46px'e iner, başlık dikey yazılır. Kart gövdesi ve özet
   gizlenir; sayaç da gizlenir çünkü dar şeride sığmaz ve başlıkla çakışır. */
:is(.crm-page, .crm-dialog) .crm-lane-fold {
    flex: 0 0 46px;
    min-width: 46px;
}

:is(.crm-page, .crm-dialog) .crm-lane-fold .crm-lane-head {
    flex-direction: column;
    height: 100%;
    padding: 10px 0;
    align-items: center;
}

:is(.crm-page, .crm-dialog) .crm-lane-fold .crm-lane-t {
    writing-mode: vertical-rl;
    transform: rotate(180deg);
    white-space: nowrap;
}

:is(.crm-page, .crm-dialog) .crm-lane-fold .crm-lane-sum,
:is(.crm-page, .crm-dialog) .crm-lane-fold .crm-lane-body,
:is(.crm-page, .crm-dialog) .crm-lane-fold .crm-lane-count { display: none; }

/* Başlık katlama düğmesidir; imleç bunu söylesin. */
:is(.crm-page, .crm-dialog) .crm-lane-head { cursor: pointer; }
:is(.crm-page, .crm-dialog) .crm-lane-head:hover { background: var(--surface-3); }