/*
  Gefinity kurumsal tema katmanı — atlas.css'ten SONRA yüklenir.
  Nötrler: siyah · antrasit · beyaz. Renk aileleri: mor (marka / vurgu),
  mavi (bilgi / yeni), teal (başarı / tamamlandı). Kırmızı yalnızca hata ve kritik için.
  Ton sırası: 1 en koyu … 5 en açık (açık temada), koyu temada tablo sırası korunur.
*/

:root,
[data-theme="dark"] {
  --purple-1: #6d28d9;
  --purple-2: #7c3aed;
  --purple-3: #9333ea;
  --purple-4: #a855f7;
  --purple-5: #c4b5fd;
  --blue-1: #3f5fa8;
  --blue-2: #3b82f6;
  --blue-3: #2563eb;
  --blue-4: #6366f1;
  --blue-5: #93c5fd;
  --teal-1: #0f766e;
  --teal-2: #0d9488;
  --teal-3: #14b8a6;
  --teal-4: #2dd4bf;
  --teal-5: #5eead4;

  --brand-purple: var(--purple-2);
  --brand-navy: var(--blue-1);
  --brand-blue: var(--blue-2);
  --brand-teal: var(--teal-3);
  --brand-anthracite: #2a2b30;

  --bg: #0e0f11;
  --bg-elevated: #141518;
  --surface: #18191c;
  --surface-2: #212226;
  --border: rgba(255, 255, 255, 0.075);
  --border-strong: rgba(255, 255, 255, 0.13);
  --text: #f4f4f5;
  --text-muted: #a1a1aa;
  --accent: var(--purple-2);
  --accent-dim: rgba(124, 58, 237, 0.18);
  --accent-hover: var(--purple-3);
  --accent-text: var(--purple-4);
  --accent-soft: var(--purple-5);
  --navy: var(--blue-1);
  --blue: var(--blue-2);
  --indigo: var(--blue-4);
  --teal: var(--teal-3);
  --success: var(--teal-3);
  --warning: var(--blue-4);
  --danger: #e5484d;
  --info: var(--blue-2);
  --shadow: none;
  --input-bg: #111215;
  --input-text: #f4f4f5;
  --sidebar-bg: #0b0c0e;
  --panel-tint: #18191c;
  --radius: 6px;
  --radius-sm: 5px;
}

[data-theme="light"] {
  --purple-1: #4c1d95;
  --purple-2: #6d28d9;
  --purple-3: #9333ea;
  --purple-4: #c084fc;
  --purple-5: #e9d5ff;
  --blue-1: #1e3a8a;
  --blue-2: #1d4ed8;
  --blue-3: #2563eb;
  --blue-4: #6366f1;
  --blue-5: #93c5fd;
  --teal-1: #134e4a;
  --teal-2: #0f766e;
  --teal-3: #0d9488;
  --teal-4: #14b8a6;
  --teal-5: #5eead4;

  --brand-purple: var(--purple-2);
  --brand-navy: var(--blue-1);
  --brand-blue: var(--blue-2);
  --brand-teal: var(--teal-2);

  --bg: #f5f5f6;
  --bg-elevated: #ffffff;
  --surface: #ffffff;
  --surface-2: #f2f2f4;
  --border: #e4e4e7;
  --border-strong: #d4d4d8;
  --text: #17181b;
  --text-muted: #61616b;
  --accent: var(--purple-2);
  --accent-dim: rgba(109, 40, 217, 0.09);
  --accent-hover: var(--purple-1);
  --accent-text: var(--purple-2);
  --accent-soft: var(--purple-5);
  --navy: var(--blue-1);
  --blue: var(--blue-2);
  --indigo: var(--blue-4);
  --teal: var(--teal-2);
  --success: var(--teal-2);
  --warning: var(--blue-4);
  --danger: #c62828;
  --info: var(--blue-2);
  --shadow: none;
  --input-bg: #ffffff;
  --input-text: #17181b;
  --sidebar-bg: #0b0c0e;
  --panel-tint: #ffffff;
}

/* ---------- Kenar menü: her iki temada koyu ---------- */
.sidebar {
  --text: #f4f4f5;
  --text-muted: #9d9da6;
  --surface: #16171a;
  --surface-2: rgba(255, 255, 255, 0.06);
  --border: rgba(255, 255, 255, 0.08);
  --border-strong: rgba(255, 255, 255, 0.14);
  --accent-dim: rgba(124, 58, 237, 0.24);
  --accent-text: #c4b5fd;
  --input-bg: #111215;
  --input-text: #f4f4f5;
  background: var(--sidebar-bg);
  color: var(--text);
  border-right: 1px solid #000;
}
.brand-mark { background: var(--brand-purple); border-radius: 5px; }
.nav-label:not(:first-child) {
  margin-top: .45rem;
  padding-top: .85rem;
  border-top: 1px solid var(--border);
}
.nav-link.active { background: var(--accent-dim); color: #fff; }
.nav-link.active::before { background: #a855f7; }
.sidebar-foot { border-color: var(--border); }

/* ---------- Üst bar ---------- */
.app-navbar { background: var(--bg-elevated); border-bottom: 1px solid var(--border); }
.navbar-user { background: transparent; }
.user-avatar { background: var(--brand-anthracite); color: #fff; }
[data-theme="light"] .user-avatar { background: var(--text); }

/* ---------- Sayfa başlığı ve bölüm ayraçları ---------- */
.topbar {
  padding-bottom: .8rem;
  margin-bottom: 1.1rem;
  border-bottom: 1px solid var(--border);
}
.page-title h1 { font-size: 1.2rem; font-weight: 600; letter-spacing: -0.015em; }

.panel { border-color: var(--border); box-shadow: none; }
.panel > h3:first-child,
.panel > h2:first-child,
.panel > header:first-child {
  margin: 0 0 .8rem;
  padding-bottom: .6rem;
  border-bottom: 1px solid var(--border);
  font-size: .86rem;
  font-weight: 600;
  letter-spacing: 0;
}
.panel > h3:first-child + p.muted { margin-top: -.35rem !important; }
.ticket-side-card h3 { padding-bottom: .5rem; border-bottom: 1px solid var(--border); }
.widget-head { padding-bottom: .45rem; margin-bottom: .3rem; border-bottom: 1px solid var(--border); }
.kanban-col { background: var(--surface); }
.kanban-col h3 {
  padding-bottom: .5rem;
  margin-bottom: .6rem;
  border-bottom: 1px solid var(--border);
  text-transform: uppercase;
  letter-spacing: .05em;
  font-size: .7rem;
  color: var(--text-muted);
}
.side-form-sep,
.ticket-side-acc-body,
.add-panel-body { border-top-color: var(--border); }
.mt-2 { margin-top: 1.1rem; }

/* ---------- Talep özeti: kutusuz, başlıklı bölümler ---------- */
.ticket-summary-head { margin-bottom: 1.1rem; padding-bottom: .9rem; }
.ticket-summary-label { margin-bottom: .55rem; font-size: .68rem; letter-spacing: .06em; }
.ticket-summary-desc { max-width: 72ch; font-size: .92rem; }
.ticket-summary-desc ul,
.ticket-summary-desc ol { margin-top: .35rem; }
.ticket-summary-desc li + li { margin-top: .15rem; }
.ticket-summary-files { margin-top: 1.25rem; padding-top: 1rem; }
.ticket-summary-section {
  margin-top: 1.4rem;
  padding-top: 1rem;
  border-top: 1px solid var(--border);
}

.ticket-meta-grid,
.ticket-facts {
  gap: 1rem 1.75rem;
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}
.ticket-meta-item,
.ticket-fact {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  gap: .25rem;
}
.ticket-meta-item span,
.ticket-fact-label { font-size: .66rem; font-weight: 500; letter-spacing: .05em; }
.ticket-meta-item strong,
.ticket-fact strong { font-size: .88rem; font-weight: 600; }
.ticket-meta-item a { color: var(--text); }
.ticket-meta-item a:hover { color: var(--accent); }
.ticket-fact.is-breach {
  border: 0;
  background: transparent;
}
.ticket-fact.is-breach .ticket-fact-label { color: var(--danger); }

/* ---------- Bilgi bankası filtre çubuğu ---------- */
.kb-bar {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: .75rem 1.25rem;
  margin-bottom: .9rem;
  padding: .75rem .9rem;
}
.kb-search {
  display: flex;
  flex-direction: column;
  gap: .25rem;
  flex: 1 1 280px;
  max-width: 420px;
}
.kb-search label { font-size: .68rem; font-weight: 500; color: var(--text-muted); }
.kb-search input { width: 100%; padding: .42rem .6rem; font-size: .82rem; }
.kb-bar .kb-filters {
  flex: 0 1 auto;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: .35rem;
}
.kb-bar .kb-filters .btn { white-space: nowrap; }
.kb-article .widget-body p:last-child { margin-bottom: 0; }
@media (max-width: 640px) {
  .kb-search { max-width: none; }
  .kb-bar .kb-filters { justify-content: flex-start; }
}

/* ---------- İş kolu detay penceresi ---------- */
.stream-card > summary:hover { background: var(--surface-2); }
.wi-modal {
  width: min(960px, 94vw);
  max-height: 88vh;
  padding: 0;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius);
  background: var(--surface);
  color: var(--text);
  overflow: hidden;
}
.wi-modal[open] { display: flex; flex-direction: column; }
.wi-modal::backdrop { background: rgba(10, 11, 13, .55); }
.wi-modal-head {
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  padding: .85rem 1rem;
  border-bottom: 1px solid var(--border);
  background: var(--bg-elevated);
}
.wi-modal-summary {
  flex: 1;
  min-width: 0;
  display: flex;
  justify-content: space-between;
  gap: .75rem;
  align-items: flex-start;
}
.wi-modal-summary .stream-card-title strong { font-size: 1rem; }
.wi-modal-close { flex-shrink: 0; font-size: .9rem; line-height: 1; padding: .35rem .5rem; }
.wi-modal-body {
  flex: 1;
  overflow: auto;
  padding: 1rem;
}
.wi-modal-body > .stream-card-body {
  padding: 0;
  border-top: 0;
  gap: 1.1rem;
}
.wi-modal-body .wi-comments,
.wi-modal-body .wi-history,
.wi-modal-body .child-jobs {
  padding-top: 1rem;
  border-top: 1px solid var(--border);
}
@media (max-width: 640px) {
  .wi-modal { width: 100vw; max-width: 100vw; max-height: 100vh; height: 100vh; border-radius: 0; }
  .wi-modal-summary { flex-direction: column; }
}

/* ---------- Zaman çizelgesi: tek satır, az renk ---------- */
.gantt { gap: 0; }
.gantt-head { padding-bottom: .5rem; margin-bottom: .25rem; }
.gantt-head,
.gantt-row { grid-template-columns: minmax(200px, 260px) 1fr; gap: 1rem; }
.gantt-body { gap: 0; padding-top: 1.1rem; }
.gantt-row {
  padding: .55rem 0;
  border-bottom: 1px solid var(--border);
  cursor: default;
}
.gantt-row:hover { background: color-mix(in srgb, var(--surface-2) 70%, transparent); }
.gantt-label-col { overflow: hidden; }
.gantt-label-col strong {
  display: block;
  font-size: .86rem;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.gantt-row.is-overdue .gantt-label-col strong { color: var(--text); }
.gantt-row.is-child .gantt-label-col { padding-left: 1.1rem; position: relative; }
.gantt-row.is-child .gantt-label-col::before {
  content: "";
  position: absolute;
  left: .35rem;
  top: .1rem;
  bottom: .1rem;
  width: 1px;
  background: var(--border-strong);
}
.gantt-row.is-child .gantt-label-col strong { font-weight: 500; font-size: .82rem; }
.gantt-meta {
  flex-wrap: nowrap;
  gap: .35rem;
  margin-top: .15rem;
  font-size: .74rem;
  white-space: nowrap;
  overflow: hidden;
}
.gantt-sep { opacity: .5; }
.gantt-flag {
  margin-left: .2rem;
  padding: 0 .35rem;
  border: 1px solid color-mix(in srgb, var(--danger) 45%, transparent);
  border-radius: 3px;
  color: var(--danger);
  font-size: .68rem;
  font-weight: 500;
}
.gantt-flag.is-wait { border-color: var(--border-strong); color: var(--text-muted); border-style: dashed; }

.gantt-track {
  height: 22px;
  border: 0;
  border-radius: 4px;
  background:
    repeating-linear-gradient(90deg, transparent, transparent calc(12.5% - 1px), var(--border) 12.5%),
    transparent;
}
.gantt-span,
.gantt-span.span-done,
.gantt-span.span-wait,
.gantt-span.span-blocked {
  top: 2px;
  bottom: 2px;
  border-radius: 4px;
  background: var(--surface-2);
  border: 1px solid var(--border-strong);
}
.gantt-fill,
.gantt-span.span-wait .gantt-fill,
.gantt-span.span-blocked .gantt-fill { background: var(--accent); opacity: 1; }
.gantt-span.span-done .gantt-fill { background: var(--teal); }
.gantt-span.span-done { border-color: var(--teal); }
.gantt-span.span-blocked { border: 1.5px solid var(--danger); }
.gantt-span.span-wait { border-style: dashed; }
.gantt-pct { font-size: .66rem; font-weight: 600; color: var(--text); mix-blend-mode: normal; }
.gantt-span .gantt-fill[style*="width:100%"] + .gantt-pct,
.gantt-span.span-done .gantt-pct { color: #fff; }

.gantt-today { width: 1px; background: var(--text); opacity: .55; }
.gantt-today::after { content: "Bugün"; top: -1rem; color: var(--text-muted); font-weight: 500; }

.gantt-legend { gap: 1.1rem; margin-top: .85rem; font-size: .74rem; align-items: center; }
.gantt-legend i { width: 16px; height: 9px; border-radius: 2px; }
.gantt-leg-span { background: var(--surface-2); border: 1px solid var(--border-strong); }
.gantt-leg-fill { background: var(--accent); }
.gantt-leg-done { background: var(--teal); }
.gantt-leg-blocked { background: var(--surface-2); border: 1.5px solid var(--danger); }
.gantt-leg-wait { background: var(--surface-2); border: 1px dashed var(--border-strong); }
.gantt-leg-today { width: 1px !important; height: 12px; background: var(--text); opacity: .55; }
.gantt-leg-hint { margin-left: auto; font-style: italic; }

/* ---------- Portal proje bilgisi: eşit yükseklikte iki kart ---------- */
.project-info-split { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: stretch; }
@media (max-width: 900px) { .project-info-split { grid-template-columns: 1fr; } }
.project-info-split > .panel { display: flex; flex-direction: column; height: 100%; margin: 0; }
.project-info-split > .panel > .stack { gap: 0; flex: 1; }
.project-info-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: .55rem 0;
  border-bottom: 1px solid var(--border);
  font-size: .86rem;
}
.project-info-row:last-of-type { border-bottom: 0; }
.project-info-split .rich-content { margin-top: .75rem; padding-top: .75rem; border-top: 1px solid var(--border); font-size: .86rem; }
.project-info-stats {
  flex: 1;
  grid-template-columns: 1fr 1fr;
  grid-auto-rows: 1fr;
  margin: 0;
}

/* ---------- Butonlar ---------- */
.btn, .theme-toggle { background: transparent; border-color: var(--border-strong); }
.btn:hover, .theme-toggle:hover { background: var(--surface-2); border-color: var(--border-strong); color: var(--text); }
.btn-primary { background: var(--accent); border-color: var(--accent); color: #fff; }
.btn-primary:hover { background: var(--accent-hover); border-color: var(--accent-hover); color: #fff; }
.btn-ghost { border-color: transparent; }
.btn-ghost:hover { border-color: var(--border); }
.btn-danger { background: transparent; border-color: color-mix(in srgb, var(--danger) 45%, transparent); color: var(--danger); }

/* ---------- Tablolar ---------- */
table.data th {
  font-size: .7rem;
  letter-spacing: .05em;
  background: var(--surface-2);
  border-bottom: 1px solid var(--border-strong);
}
table.data tbody tr:hover { background: var(--surface-2); }
table.data tbody tr.row-link td:first-child { color: var(--text); font-weight: 600; }

/* ---------- Rozetler: dolgu yerine ince çerçeve ---------- */
.badge {
  background: transparent;
  border: 1px solid var(--border-strong);
  color: var(--text-muted);
  font-weight: 500;
}
.st-new { color: var(--blue); border-color: color-mix(in srgb, var(--blue) 45%, transparent); background: transparent; }
.st-progress { color: var(--accent-text); border-color: color-mix(in srgb, var(--accent) 45%, transparent); background: var(--accent-dim); }
.st-wait { color: var(--indigo); border-color: color-mix(in srgb, var(--indigo) 40%, transparent); background: transparent; }
.st-test { color: var(--navy); border-color: color-mix(in srgb, var(--navy) 50%, transparent); background: transparent; }
.st-done { color: var(--teal); border-color: color-mix(in srgb, var(--teal) 45%, transparent); background: transparent; }
[data-theme="dark"] .st-test { color: var(--blue-5); }
.st-hold { color: var(--text-muted); border-color: var(--border); background: transparent; }

.prio-critical { color: var(--danger); border-color: color-mix(in srgb, var(--danger) 45%, transparent); background: transparent; }
.prio-high { color: var(--accent-text); border-color: color-mix(in srgb, var(--accent) 45%, transparent); background: transparent; }
.prio-normal { color: var(--text); border-color: var(--border-strong); background: transparent; }
.prio-low { color: var(--text-muted); border-color: var(--border); background: transparent; }
.prio-planned { color: var(--blue); border-color: color-mix(in srgb, var(--blue) 45%, transparent); background: transparent; }

.alert {
  background: var(--surface);
  border: 1px solid var(--border-strong);
  border-left: 3px solid var(--accent);
}

/* ---------- Sohbet: 4 kurumsal ton, nötr baloncuklar ---------- */
.chat-thread,
.atlas-chat-room .chat-thread { background: var(--bg-elevated); }
.chat-avatar { box-shadow: none; }
.chat-avatar.tone-0, .atlas-chat-room .chat-avatar.tone-0, .atlas-meet-camoff-av.tone-0 { --tone: var(--purple-2); }
.chat-avatar.tone-1, .atlas-chat-room .chat-avatar.tone-1, .atlas-meet-camoff-av.tone-1 { --tone: var(--blue-3); }
.chat-avatar.tone-2, .atlas-chat-room .chat-avatar.tone-2, .atlas-meet-camoff-av.tone-2 { --tone: var(--teal-2); }
.chat-avatar.tone-3, .atlas-chat-room .chat-avatar.tone-3, .atlas-meet-camoff-av.tone-3 { --tone: var(--blue-1); }
.chat-avatar.tone-4, .atlas-chat-room .chat-avatar.tone-4, .atlas-meet-camoff-av.tone-4 { --tone: var(--purple-3); }
.chat-avatar.tone-5, .atlas-chat-room .chat-avatar.tone-5, .atlas-meet-camoff-av.tone-5 { --tone: var(--blue-4); }
.chat-avatar.tone-6, .atlas-chat-room .chat-avatar.tone-6, .atlas-meet-camoff-av.tone-6 { --tone: var(--teal-1); }
.chat-avatar.tone-7, .atlas-chat-room .chat-avatar.tone-7, .atlas-meet-camoff-av.tone-7 { --tone: var(--purple-1); }

.chat-row.is-other .chat-bubble,
.atlas-chat-room .chat-row.is-other .chat-bubble {
  background: var(--surface-2);
  border-color: var(--border);
  box-shadow: none;
}
.chat-row.is-other .chat-who { color: var(--text); }
.chat-row.is-mine .chat-bubble {
  background: color-mix(in srgb, var(--accent) 12%, var(--surface));
  border-color: color-mix(in srgb, var(--accent) 24%, var(--border));
  box-shadow: none;
}
.chat-row.is-internal .chat-bubble {
  background: color-mix(in srgb, var(--navy) 8%, var(--surface));
  border-color: color-mix(in srgb, var(--navy) 40%, var(--border));
}
.chat-tag {
  background: transparent;
  border: 1px solid color-mix(in srgb, var(--navy) 45%, transparent);
  color: var(--navy);
}

.atlas-chat-tag,
.atlas-chat-tag-chip { color: var(--blue); }
.atlas-chat-tag-chip {
  background: transparent;
  border-color: color-mix(in srgb, var(--blue) 40%, var(--border));
}
.atlas-chat-tag-chip:hover { background: var(--surface-2); }
.atlas-chat-voice-bar { background: var(--surface-2); }

/* ---------- Durum noktaları, ses ve toplantı göstergeleri: teal / mavi / mor ---------- */
.atlas-chat-dot.is-online { background: var(--teal-3); }
.atlas-chat-dot.is-away { background: var(--blue-4); }
.atlas-chat-voice-bar {
  background: linear-gradient(90deg, color-mix(in srgb, var(--blue) 12%, transparent), color-mix(in srgb, var(--teal) 8%, transparent));
}
.atlas-chat-voice-dot,
.atlas-meet-decisions-dot {
  background: var(--teal-3);
  box-shadow: 0 0 0 0 color-mix(in srgb, var(--teal-3) 55%, transparent);
}
.atlas-chat-voice-bar.is-ringing .atlas-chat-voice-dot { background: var(--purple-3); }
#chatVoiceBtn.is-active { color: var(--teal); border-color: color-mix(in srgb, var(--teal) 45%, transparent); }
.atlas-chat-pencil-tools [data-pen-color="#0d9488"] { color: #0d9488; }

.atlas-meet-waiting,
.atlas-meet-prejoin-waiting {
  background: color-mix(in srgb, var(--blue-4) 16%, transparent);
  color: var(--blue-5);
}
.atlas-meet-tabs button.is-attention {
  outline-color: color-mix(in srgb, var(--purple-4) 70%, transparent);
  color: var(--purple-5);
}
.atlas-meet-back-tag { color: var(--teal-4); }
.atlas-meet-prejoin-level span { background: linear-gradient(90deg, var(--teal-3), var(--blue-2)); }
.atlas-meet-level-fill { background: linear-gradient(to top, var(--teal-3), var(--blue-2) 55%, var(--purple-3) 80%, #e5484d); }
.atlas-meet-audio-meter-bar { background: linear-gradient(90deg, var(--teal-3), var(--purple-3) 70%, #e5484d); }
.atlas-meet-audio-bars span { background: color-mix(in srgb, var(--blue-2) 70%, var(--teal-3)); }

/* ---------- Giriş sayfası: mor / mavi ---------- */
.login-page {
  background:
    radial-gradient(ellipse 90% 70% at 22% 50%, color-mix(in srgb, var(--accent) 14%, transparent), transparent 62%),
    radial-gradient(ellipse 50% 40% at 70% 20%, color-mix(in srgb, var(--blue) 16%, transparent), transparent 55%),
    var(--bg);
}
[data-theme="light"] .login-page {
  background:
    radial-gradient(ellipse 90% 70% at 22% 50%, color-mix(in srgb, var(--accent) 10%, transparent), transparent 62%),
    radial-gradient(ellipse 50% 40% at 70% 20%, color-mix(in srgb, var(--blue) 8%, transparent), transparent 55%),
    var(--bg);
}