/* Behavior & Attention insights (2026-06-03) — cool-only, light/dark aware. */
.bi-root { display: flex; flex-direction: column; gap: 14px; }
.bi-loading, .bi-empty { color: var(--text-muted, #8a93a3); font-size: 14px; padding: 24px 0; text-align: center; }
.bi-empty h3 { color: var(--text-primary, #e8ebf0); margin: 0 0 8px; font-size: 16px; }
.bi-empty p { max-width: 460px; margin: 0 auto; line-height: 1.6; font-size: 13px; }
.bi-empty code { background: rgba(22, 58, 107,0.12); color: var(--accent, #2e5aa0); padding: 1px 6px; border-radius: 5px; }

.bi-health { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.bi-chip { padding: 8px 13px; border-radius: 10px; font-size: 12.5px; border: 1px solid var(--border, rgba(22, 58, 107,0.18)); }
.bi-chip--ok { background: rgba(124,200,176,0.10); color: #4caf7d; border-color: rgba(124,200,176,0.3); }
.bi-chip--warn { background: rgba(235,160,60,0.12); color: #e0a23c; border-color: rgba(235,160,60,0.35); }
.bi-kpi { display: flex; flex-direction: column; padding: 6px 14px; border-radius: 10px; background: var(--bg-card, rgba(255,255,255,0.04)); border: 1px solid var(--border, rgba(22, 58, 107,0.14)); }
.bi-kpi__v { font-size: 18px; font-weight: 700; color: var(--text-primary, #e8ebf0); }
.bi-kpi__l { font-size: 11px; color: var(--text-muted, #8a93a3); }
.bi-days { margin-left: auto; padding: 7px 12px; border-radius: 9px; background: var(--bg-card, rgba(255,255,255,0.04)); border: 1px solid var(--border, rgba(22, 58, 107,0.18)); color: var(--text-secondary, #c7ccd4); font-size: 13px; }

.bi-grid { display: grid; grid-template-columns: minmax(300px, 380px) 1fr; gap: 14px; align-items: start; }
@media (max-width: 900px) { .bi-grid { grid-template-columns: 1fr; } }

.bi-list { background: var(--bg-card, rgba(255,255,255,0.03)); border: 1px solid var(--border, rgba(20,30,48,0.10)); border-radius: 14px; padding: 10px; max-height: 72vh; overflow-y: auto; }
.bi-list__head { font-size: 12px; font-weight: 700; color: var(--text-muted, #8a93a3); padding: 6px 8px 10px; }
.bi-row { padding: 10px 12px; border-radius: 11px; cursor: pointer; border: 1px solid transparent; transition: all .14s; }
.bi-row:hover { background: rgba(22, 58, 107,0.06); }
.bi-row.is-sel { background: rgba(22, 58, 107,0.10); border-color: var(--accent, #163a6b); }
.bi-row__name { font-size: 13.5px; font-weight: 600; color: var(--text-primary, #e8ebf0); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.bi-row__meta { display: flex; gap: 6px; margin-top: 5px; }
.bi-tag { font-size: 11px; padding: 2px 7px; border-radius: 6px; background: rgba(22, 58, 107,0.10); color: var(--accent, #2e5aa0); }
.bi-tag--hot { background: rgba(224,86,74,0.14); color: #e0564a; }
.bi-tag--mut { background: transparent; color: var(--text-muted, #8a93a3); }

.bi-detail { background: var(--bg-card, rgba(255,255,255,0.03)); border: 1px solid var(--border, rgba(20,30,48,0.10)); border-radius: 14px; padding: 16px 18px; min-height: 340px; }
.bi-detail__head h3 { margin: 0 0 8px; font-size: 16px; color: var(--text-primary, #e8ebf0); word-break: break-word; }
.bi-stats { display: flex; flex-wrap: wrap; gap: 12px; font-size: 12.5px; color: var(--text-secondary, #c7ccd4); }
.bi-section { margin-top: 18px; }
.bi-section__t { font-size: 12px; font-weight: 700; color: var(--text-muted, #8a93a3); margin-bottom: 10px; text-transform: uppercase; letter-spacing: 0.03em; }

.bi-heat__cap { font-size: 11px; color: var(--text-muted, #8a93a3); margin-top: 8px; }

/* ── Attention stage: product-page mockup + heat overlay + animated cursor ── */
.bi-mock {
  position: relative; border-radius: 14px; overflow: hidden; padding: 0;
  background: linear-gradient(180deg, rgba(255,255,255,0.03), rgba(22, 58, 107,0.02));
  border: 1px solid var(--border, rgba(22, 58, 107,0.16));
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.04), 0 8px 28px rgba(20,30,50,0.18);
  aspect-ratio: 16 / 11; max-width: 560px;
}
.bi-mock__bar { height: 30px; display: flex; align-items: center; gap: 8px; padding: 0 12px; border-bottom: 1px solid rgba(22, 58, 107,0.10); background: rgba(22, 58, 107,0.05); }
.bi-mock__logo { width: 46px; height: 9px; border-radius: 4px; background: rgba(22, 58, 107,0.35); }
.bi-mock__dots { margin-left: auto; width: 40px; height: 7px; border-radius: 4px; background: rgba(255,255,255,0.10); }
.bi-mock__body { display: grid; grid-template-columns: 1.05fr 1fr; gap: 14px; padding: 16px; height: calc(100% - 30px); box-sizing: border-box; }
/* heat-reactive zones: --heat (0..1) drives a glowing ring */
.bi-mock__img, .bi-mock__price, .bi-mock__size, .bi-mock__cart {
  position: relative; --heat: 0;
  box-shadow: 0 0 0 calc(1px + var(--heat) * 3px) rgba(224,120,60, calc(0.12 + var(--heat) * 0.6)),
              0 0 calc(var(--heat) * 26px) rgba(224,120,60, calc(var(--heat) * 0.5));
}
.bi-mock__img { border-radius: 10px; background: repeating-linear-gradient(135deg, rgba(255,255,255,0.05) 0 10px, rgba(255,255,255,0.02) 10px 20px); display: flex; align-items: flex-end; justify-content: center; }
.bi-mock__img > span { font-size: 10px; color: var(--text-muted, #8a93a3); padding: 6px; }
.bi-mock__col { display: flex; flex-direction: column; gap: 9px; }
.bi-mock__title { height: 12px; width: 80%; border-radius: 4px; background: rgba(255,255,255,0.12); }
.bi-mock__title--sm { width: 50%; height: 9px; background: rgba(255,255,255,0.07); }
.bi-mock__price { font-size: 13px; font-weight: 700; color: var(--accent, #2e5aa0); padding: 4px 0; }
.bi-mock__price em, .bi-mock__size em, .bi-mock__cart em, .bi-mock__img em { font-style: normal; font-size: 10px; opacity: 0.75; margin-left: 4px; }
.bi-mock__size { display: flex; align-items: center; gap: 5px; font-size: 11px; color: var(--text-muted, #8a93a3); border-radius: 8px; padding: 4px; }
.bi-mock__size i { font-style: normal; width: 20px; height: 20px; border-radius: 5px; border: 1px solid rgba(22, 58, 107,0.3); display: inline-flex; align-items: center; justify-content: center; font-size: 10px; color: var(--text-secondary, #c7ccd4); }
.bi-mock__cart { margin-top: 4px; text-align: center; padding: 9px; border-radius: 9px; background: linear-gradient(135deg, var(--accent, #163a6b), #2f7bb0); color: #fff; font-size: 12px; font-weight: 700; }
.bi-mock__desc { height: 7px; border-radius: 4px; background: rgba(255,255,255,0.05); }
.bi-mock__desc:last-child { width: 70%; }

.bi-heatlayer { position: absolute; inset: 30px 0 0 0; pointer-events: none; overflow: hidden; }
.bi-blob { position: absolute; width: 80px; height: 80px; border-radius: 50%;
  background: radial-gradient(circle, rgba(224,120,60,0.9), rgba(224,120,60,0.35) 45%, transparent 70%);
  filter: blur(9px); mix-blend-mode: screen; animation: bi-pulse 3.4s ease-in-out infinite; }
@keyframes bi-pulse { 0%,100% { opacity: var(--o, 0.5); } 50% { opacity: calc(var(--o, 0.5) * 0.55); } }

.bi-cursor { position: absolute; left: 0; top: 0; width: 16px; height: 16px; margin: -8px 0 0 -8px; pointer-events: none; z-index: 5;
  background: radial-gradient(circle, #fff 0 30%, rgba(47, 92, 168,0.9) 55%, transparent 72%);
  box-shadow: 0 0 12px rgba(47, 92, 168,0.9), 0 0 4px #fff; will-change: transform; }
.bi-cursor__trail { position: absolute; inset: -5px; border-radius: 50%; border: 1.5px solid rgba(47, 92, 168,0.5); animation: bi-ring 1.6s ease-out infinite; }
@keyframes bi-ring { 0% { transform: scale(0.6); opacity: 0.9; } 100% { transform: scale(2.4); opacity: 0; } }

.bi-scrollrail { position: absolute; right: 6px; top: 36px; bottom: 8px; width: 5px; border-radius: 3px; background: rgba(255,255,255,0.06); }
.bi-scrollrail i { position: absolute; top: 0; left: 0; right: 0; border-radius: 3px; background: linear-gradient(180deg, var(--accent, #2e5aa0), rgba(22, 58, 107,0.4)); }
.bi-scrollrail b { position: absolute; right: 8px; bottom: 0; font-size: 9px; color: var(--text-muted, #8a93a3); font-weight: 600; }

@media (prefers-reduced-motion: reduce) {
  .bi-blob, .bi-cursor__trail { animation: none; }
}

.bi-elems { display: flex; flex-direction: column; gap: 8px; }
.bi-elem { display: grid; grid-template-columns: 110px 1fr auto; gap: 10px; align-items: center; }
.bi-elem__l { font-size: 12.5px; color: var(--text-secondary, #c7ccd4); }
.bi-elem__bar { height: 8px; background: rgba(22, 58, 107,0.10); border-radius: 5px; overflow: hidden; }
.bi-elem__bar i { display: block; height: 100%; background: linear-gradient(90deg, var(--accent, #163a6b), #2f7bb0); }
.bi-elem__v { font-size: 11px; color: var(--text-muted, #8a93a3); white-space: nowrap; }

.bi-ai__body { font-size: 13px; line-height: 1.6; color: var(--text-secondary, #c7ccd4); background: rgba(22, 58, 107,0.05); border-left: 2px solid var(--accent, #163a6b); padding: 12px 14px; border-radius: 6px; }

/* Merged-page tab bar (2026-06-03) — shared by Müşteriler + Gelir Sızıntısı */
.merge-tabs { display: flex; gap: 6px; margin: 0 0 18px; border-bottom: 1px solid var(--border, rgba(22, 58, 107,0.16)); padding-bottom: 0; }
.merge-tab {
  padding: 9px 16px; border: none; background: transparent; cursor: pointer;
  font-size: 14px; font-weight: 600; color: var(--text-muted, #8a93a3);
  border-bottom: 2px solid transparent; margin-bottom: -1px; transition: color .15s, border-color .15s;
}
.merge-tab:hover { color: var(--text-primary, #e8ebf0); }
.merge-tab.is-active { color: var(--accent, #2e5aa0); border-bottom-color: var(--accent, #163a6b); }