/* ============================================================
   Dealerpack AI — Komut Merkezi
   Claude.ai esinli, minimal & estetik arayüz.
   colors_and_type.css token'larını kullanır; sıcak kağıt teması.
   ============================================================ */

:root {
  --c-page:       #f4f3ee;   /* sıcak uygulama zemini */
  --c-surface:    #ffffff;
  --c-sidebar:    #ecebe4;   /* krem yan menü */
  --c-sidebar-hov:#e2e0d6;
  --c-border:     #e6e3da;
  --c-border-2:   #dbd7cb;
  --c-text:       #2b2a27;
  --c-text-2:     #5c5a52;   /* WCAG AA: ~6.3:1 beyaz üstünde */
  --c-text-3:     #736f63;   /* WCAG AA: ~4.6:1 beyaz üstünde (eski #9a978d ~2.8:1 kalıyordu) */
  --c-accent:     #ff5722;   /* Dealerpack turuncu */
  --c-accent-600: #e8470f;
  --c-accent-soft:#fff0ea;
  --c-blue:       #4680ff;
  --c-ok:         #1f7c5b;
  --c-err:        #b91c1c;
  --r-lg:         20px;
  --r-md:         12px;
  --r-sm:         9px;
  --shadow-pop:   0 12px 40px rgba(43,42,39,.16), 0 2px 8px rgba(43,42,39,.08);
  --shadow-soft:  0 1px 2px rgba(43,42,39,.05), 0 6px 24px rgba(43,42,39,.05);
  --serif:        ui-serif, 'Iowan Old Style', 'Palatino Linotype', Georgia, 'Times New Roman', serif;
}

* { box-sizing: border-box; }
html, body { height: 100%; }
body { margin: 0; background: var(--c-page); color: var(--c-text); font-family: var(--dp-font-sans); }
::selection { background: var(--c-accent-soft); }

/* ---------- layout ---------- */
/* dvh: mobil tarayıcı adres çubuğu açılıp kapandığında yükseklik doğru kalsın (100vh mobilde taşıyor) */
.app { display: flex; height: 100vh; height: 100dvh; overflow: hidden; }

/* ---------- sidebar ---------- */
.sidebar {
  width: 264px; flex: 0 0 264px; background: var(--c-sidebar);
  display: flex; flex-direction: column; padding: 14px 12px;
  border-right: 1px solid var(--c-border); transition: margin .22s var(--dp-ease-out);
}
.side-top { display: flex; flex-direction: column; gap: 14px; }
.brand { display: flex; align-items: center; padding: 4px 6px; }
.brand-logo { height: 36px; width: auto; object-fit: contain; display: block; mix-blend-mode: multiply; }
.side-collapse { margin-left: auto; background: none; border: 0; color: var(--c-text-3); cursor: pointer; font-size: 19px; padding: 4px; border-radius: 7px; }
.side-collapse:hover { background: var(--c-sidebar-hov); color: var(--c-text); }

.new-task {
  display: flex; align-items: center; gap: 8px; width: 100%;
  background: var(--c-surface); border: 1px solid var(--c-border-2); color: var(--c-text);
  font: 600 14px var(--dp-font-sans); padding: 10px 12px; border-radius: var(--r-md);
  cursor: pointer; transition: all .14s var(--dp-ease-out); box-shadow: var(--shadow-soft);
}
.new-task i { font-size: 18px; color: var(--c-accent); }
.new-task:hover { border-color: var(--c-accent); transform: translateY(-1px); }

.side-nav { margin-top: 18px; flex: 1; overflow-y: auto; }
.side-sec { font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--c-text-3); padding: 14px 10px 6px; }
.side-item {
  display: flex; align-items: center; gap: 11px; padding: 9px 10px; border-radius: var(--r-sm);
  color: var(--c-text-2); font-size: 14px; font-weight: 500; cursor: pointer; text-decoration: none;
  transition: background .12s, color .12s; margin-bottom: 1px;
}
.side-item i { font-size: 19px; }
.side-item .ext { font-size: 14px; margin-left: auto; color: var(--c-text-3); }
.side-item:hover { background: var(--c-sidebar-hov); color: var(--c-text); }
.side-item.active { background: var(--c-surface); color: var(--c-text); font-weight: 600; box-shadow: var(--shadow-soft); }
.side-item.active i { color: var(--c-accent); }

.side-spacer { flex: 1; }

/* geçmiş listesi */
.side-hist { flex: 1; overflow-y: auto; min-height: 0; margin-top: 12px; }
.gecmis-item { display: flex; align-items: center; justify-content: space-between; gap: 9px; padding: 8px 10px; border-radius: var(--r-sm); cursor: pointer; color: var(--c-text-2); font-size: 13px; margin-bottom: 1px; }
.gecmis-item .gecmis-link { display: flex; align-items: center; gap: 9px; flex: 1; overflow: hidden; }
.gecmis-item i { font-size: 16px; color: var(--c-text-3); flex: none; }
.gecmis-item .gt { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gecmis-item:hover { background: var(--c-sidebar-hov); color: var(--c-text); }
.gecmis-item.active { background: var(--c-surface); color: var(--c-text); font-weight: 500; box-shadow: var(--shadow-soft); }
.gecmis-item.active i { color: var(--c-accent); }
.gecmis-empty { padding: 8px 10px; font-size: 12px; color: var(--c-text-3); }
.gecmis-item .gecmis-sil { display: none; margin-left: auto; background: none; border: none; padding: 4px; cursor: pointer; border-radius: 4px; color: var(--c-text-3); line-height: 1; flex: none; }
.gecmis-item:hover .gecmis-sil { display: inline-flex; align-items: center; justify-content: center; }
.gecmis-item .gecmis-sil:hover { color: #e63946; background: rgba(230, 57, 70, 0.1); }

/* ——— Planlı görev bildirimi (2026-08-21)
   Planlı görev sonucu sohbete düştüğünde kayıt `okunmadi: true` ile işaretlenir ve liste
   `zaman`a göre sıralandığı için en üste çıkar. Rozet, kullanıcının o görevi gözden
   kaçırmamasını sağlar; sohbet açılınca /api/gecmis-okundu ile söner. */
.gecmis-item.okunmadi { color: var(--c-text); font-weight: 600; }
.gecmis-item.okunmadi i { color: var(--c-accent); }
.gecmis-item .yeni-nokta { width: 7px; height: 7px; border-radius: 50%; background: var(--c-accent);
  flex: none; margin-left: 6px; box-shadow: 0 0 0 3px var(--c-accent-soft); }
.gecmis-item:hover .yeni-nokta { display: none; }

/* Kenar çubuğu başlığındaki toplam sayaç */
.gecmis-baslik-sayac { display: inline-flex; align-items: center; justify-content: center;
  min-width: 18px; height: 18px; padding: 0 5px; margin-left: 6px; border-radius: 9px;
  background: var(--c-accent); color: #fff; font-size: 11px; font-weight: 700; line-height: 1; }

/* Sohbetin içindeki planlı görev balonu */
.plan-mesaj .plan-rozet { display: inline-flex; align-items: center; gap: 6px; margin-bottom: 8px;
  padding: 3px 9px; border-radius: 999px; background: var(--c-accent-soft); color: var(--c-accent-600);
  font-size: 11px; font-weight: 600; }
.plan-mesaj.plan-hata .plan-rozet { background: rgba(230, 57, 70, 0.1); color: #e63946; }
.plan-mesaj .plan-dosya-not { margin-top: 10px; font-size: 12px; color: var(--c-text-3); }
/* Planlı görev özetindeki tablo (sohbete-yaz.js kurar, marked.js'ten geçmez). */
.plan-mesaj .plan-tablo-sar { overflow-x: auto; max-width: 100%; margin: 10px 0; -webkit-overflow-scrolling: touch; }
.plan-mesaj .plan-tablo-sar table { border-collapse: collapse; width: 100%; font-size: 13px; }
.plan-mesaj .plan-tablo-sar th, .plan-mesaj .plan-tablo-sar td { border: 1px solid var(--c-border); padding: 6px 10px; text-align: left; }
.plan-mesaj .plan-tablo-sar th { background: var(--c-sidebar); font-weight: 600; white-space: nowrap; }

.side-bottom { padding-top: 8px; margin-top: 4px; border-top: 1px solid var(--c-border); }

.app.side-collapsed .sidebar { margin-left: -264px; }

/* ---------- main ---------- */
.main { flex: 1; display: flex; flex-direction: column; min-width: 0; position: relative; }
.topbar { height: 54px; display: flex; align-items: center; gap: 10px; padding: 0 20px; }
.topbar-title { font-size: 14px; font-weight: 600; color: var(--c-text-2); }
.icon-btn { background: none; border: 0; font-size: 22px; color: var(--c-text-2); cursor: pointer; padding: 4px; border-radius: 8px; }
.icon-btn:hover { background: var(--c-sidebar-hov); }
.only-mobile { display: none; }

.view { display: none; flex: 1; min-height: 0; }
.view.active { display: flex; flex-direction: column; }

/* ---------- chat (sohbet) ---------- */
.chat { flex: 1; display: flex; flex-direction: column; min-height: 0; }
.chat-scroll { flex: 1; overflow-y: auto; display: flex; flex-direction: column; }

/* greeting (yalnız sohbet boşken) */
.greet { margin: auto auto 0; padding: 6vh 24px 8px; text-align: center; max-width: 720px; }
.chat.has-convo .greet { display: none; }
.greet-mark { width: 46px; height: 46px; border-radius: 14px; margin: 0 auto 18px; display: grid; place-items: center;
  background: linear-gradient(135deg, var(--c-accent), #ff8a5c); color: #fff; font-size: 24px; box-shadow: 0 8px 24px rgba(255,87,34,.3); }
.greet h1 { font-family: var(--serif); font-size: 34px; font-weight: 500; letter-spacing: -.01em; color: var(--c-text); margin: 0 0 6px; }
.greet p { font-size: 16px; color: var(--c-text-2); margin: 0; }

/* feed (mesajlar) */
.feed { width: 100%; max-width: 760px; margin: 0 auto; padding: 16px 24px 8px; }
.chat:not(.has-convo) .feed { display: none; }

/* dock = composer alanı */
.dock { width: 100%; max-width: 760px; margin: 0 auto; padding: 4px 24px 18px; }
.chat:not(.has-convo) .dock { margin-top: auto; padding-top: 0; }
.chat.has-convo .dock { position: sticky; bottom: 0; background: linear-gradient(to top, var(--c-page) 72%, transparent); padding-top: 10px; }

/* composer */
.composer {
  background: var(--c-surface); border: 1px solid var(--c-border-2); border-radius: var(--r-lg);
  padding: 12px 12px 10px; box-shadow: var(--shadow-soft); transition: border-color .15s, box-shadow .15s;
}
.composer:focus-within { box-shadow: 0 0 0 4px rgba(255,87,34,.10), var(--shadow-soft); }
.composer-input {
  width: 100%; border: 0; outline: 0; resize: none; background: none; color: var(--c-text);
  font: 400 15.5px/1.5 var(--dp-font-sans); padding: 4px 6px; max-height: 220px; overflow-y: auto;
}
.composer-input::placeholder { color: var(--c-text-3); }

.composer-bar { display: flex; align-items: center; gap: 8px; margin-top: 8px; }
.bar-left { display: flex; align-items: center; gap: 8px; }
.bar-right { display: flex; align-items: center; gap: 8px; margin-left: auto; }

.round-btn { width: 34px; height: 34px; border-radius: 50%; border: 1px solid var(--c-border-2); background: var(--c-surface);
  color: var(--c-text-2); font-size: 19px; display: grid; place-items: center; cursor: pointer; transition: all .13s; flex: none; }
.round-btn:hover { border-color: var(--c-accent); color: var(--c-accent); background: var(--c-accent-soft); }

.ctx-pill { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 12px; border-radius: 999px;
  border: 1px solid var(--c-border-2); background: var(--c-surface); color: var(--c-text-2); font: 500 13px var(--dp-font-sans);
  cursor: pointer; transition: all .13s; max-width: 220px; }
.ctx-pill i { font-size: 16px; }
.ctx-pill span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ctx-pill:hover { border-color: var(--c-text-3); color: var(--c-text); background: var(--c-sidebar-hov); }
.ctx-pill.on { border-color: var(--c-accent); color: var(--c-accent-600); background: var(--c-accent-soft); }
.agent-pill .ti-chevron-down { font-size: 15px; opacity: .6; }
.ag-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--c-text-3); flex: none; }

.send-btn { width: 36px; height: 36px; border-radius: 50%; border: 0; background: var(--c-accent); color: #fff;
  font-size: 20px; display: grid; place-items: center; cursor: pointer; transition: all .14s; flex: none; }
.send-btn:hover:not(:disabled) { background: var(--c-accent-600); }
.send-btn:disabled { background: var(--c-border-2); color: #fff; cursor: default; }

/* eklenmiş dosya çipleri */
.attach-row { display: flex; flex-wrap: wrap; gap: 8px; padding: 2px 4px 10px; }
.attach-chip { display: inline-flex; align-items: center; gap: 8px; background: var(--c-sidebar); border: 1px solid var(--c-border-2);
  border-radius: 10px; padding: 6px 9px; font-size: 12.5px; color: var(--c-text); max-width: 230px; }
.attach-chip img { width: 30px; height: 30px; border-radius: 6px; object-fit: cover; }
.attach-chip i.ic { font-size: 22px; color: var(--c-text-3); }
.attach-chip .nm { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.attach-chip .x { cursor: pointer; color: var(--c-text-3); font-size: 16px; line-height: 1; }
.attach-chip .x:hover { color: var(--c-err); }

/* öneri çipleri */
.suggest { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; padding: 14px 8px 4px; }
.chat.has-convo .suggest { display: none; }
.s-chip { display: inline-flex; align-items: center; gap: 7px; padding: 8px 14px; border-radius: 999px;
  border: 1px solid var(--c-border-2); background: var(--c-surface); color: var(--c-text-2); font: 500 13px var(--dp-font-sans);
  cursor: pointer; transition: all .13s; }
.s-chip i { font-size: 16px; color: var(--c-accent); }
.s-chip:hover { border-color: var(--c-accent); color: var(--c-text); transform: translateY(-1px); }

.dock-hint { text-align: center; font-size: 11.5px; color: var(--c-text-3); padding: 10px 8px 0; }
.dock-hint kbd { font-family: var(--dp-font-mono); background: var(--c-sidebar); border: 1px solid var(--c-border-2);
  border-radius: 5px; padding: 0 5px; font-size: 11px; }

/* ---------- mesajlar ---------- */
.msg { margin-bottom: 22px; }
.msg-user { display: flex; justify-content: flex-end; }
.msg-user .ubub { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: 16px 16px 4px 16px;
  padding: 11px 15px; max-width: 90%; box-shadow: var(--shadow-soft); }
.msg-user .ubub .utags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 7px; }
.msg-user .ubub .utag { font-size: 11px; font-weight: 600; color: var(--c-accent-600); background: var(--c-accent-soft);
  padding: 2px 8px; border-radius: 999px; }
.msg-user .ubub .utxt { font-size: 14.5px; line-height: 1.5; white-space: pre-wrap; }
.msg-user .ubub .ufiles { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.msg-user .ubub .ufile { font-size: 12px; color: var(--c-text-2); background: var(--c-sidebar); border-radius: 8px; padding: 4px 8px; display: inline-flex; gap: 5px; align-items: center; }

.msg-agent .ahead { display: flex; align-items: center; gap: 9px; margin-bottom: 9px; }
.msg-agent .ahead .ic { width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center; color: #fff; font-size: 15px; flex: none; }
.msg-agent .ahead .nm { font-size: 13.5px; font-weight: 650; color: var(--c-text); }
.abody { font-size: 15px; line-height: 1.62; color: var(--c-text); padding-left: 35px; }

.ak-metin { white-space: pre-wrap; }
.ak-arac { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--c-text-2);
  background: var(--c-sidebar); border: 1px solid var(--c-border); border-radius: 8px; padding: 4px 9px; margin: 3px 6px 3px 0; }
.ak-arac i { font-size: 14px; color: var(--c-text-3); }
.ak-durum { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; color: var(--c-text-2); margin-top: 4px; }
.ak-durdur-btn { display: inline-flex; align-items: center; gap: 4px; margin-left: 6px; padding: 3px 10px; font-size: 12px; font-weight: 600;
  color: var(--c-err); background: #fdecec; border: 1px solid #f3c9c9; border-radius: 999px; cursor: pointer; transition: background .12s; }
.ak-durdur-btn:hover { background: #fadada; }
.ak-durdur-btn:disabled { opacity: .55; cursor: default; }
.ak-durduruldu { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--c-text-3); background: var(--c-sidebar); border-radius: 8px; padding: 4px 10px; margin-top: 8px; }
.ak-durum i, .ti-loader-2 { animation: spin 1s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.ak-bitti { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; color: var(--c-ok);
  background: #e6f5ee; border-radius: 8px; padding: 4px 10px; margin-top: 8px; }
.ak-gorevno { font-weight: 500; color: var(--c-text-3); font-variant-numeric: tabular-nums; cursor: help; }
.ak-hata { color: var(--c-err); font-size: 13px; background: #fdecec; border-radius: 8px; padding: 8px 11px; margin-top: 6px; }

/* inline file cards in chat feed */
.ak-dosyalar { margin-top: 12px; border-top: 1px solid var(--c-border); padding-top: 10px; }
.ak-dosyalar-baslik { font-size: 11px; font-weight: 700; color: var(--c-text-3); text-transform: uppercase; letter-spacing: .07em; margin-bottom: 8px; display: flex; align-items: center; gap: 6px; }
/* rapor / excel / video kart (yatay) */
.ak-dosya-kart { display: flex; align-items: center; gap: 10px; background: var(--c-surface); border: 1px solid var(--c-border); border-radius: 10px; padding: 9px 12px; margin-bottom: 6px; }
.ak-dosya-kart:last-child { margin-bottom: 0; }
.ak-dosya-thumb { width: 38px; height: 38px; border-radius: 7px; background: var(--c-border); flex: none; display: grid; place-items: center; overflow: hidden; }
.ak-dosya-thumb.doc { background: var(--c-accent-soft); color: var(--c-accent); font-size: 20px; }
.ak-dosya-info { flex: 1; min-width: 0; }
.ak-dosya-ad { font-size: 13px; font-weight: 600; color: var(--c-text); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ak-dosya-tip { font-size: 11.5px; color: var(--c-text-3); margin-top: 2px; }
.ak-dosya-eylem { display: flex; gap: 6px; flex: none; }
.ak-dosya-eylem .dp-btn { height: 30px; font-size: 12px; padding: 0 10px; }
/* görsel kart (dikey — resim üstte, butonlar altta) */
.ak-dosya-gorsel { flex-direction: column; align-items: stretch; padding: 0; overflow: hidden; cursor: pointer; }
.ak-dosya-gorsel:hover { box-shadow: 0 0 0 2px var(--c-accent); }
.ak-dosya-img { width: 100%; max-height: 480px; object-fit: contain; display: block; background: var(--c-border); }
.ak-dosya-footer { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 12px; }
.ak-dosya-footer .ak-dosya-ad { font-size: 12.5px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; flex: 1; min-width: 0; }
.ak-dosya-footer .ak-dosya-eylem { flex: none; }
/* modal markdown render */
.md-render { font-size: 14px; line-height: 1.7; color: var(--c-text); }
.md-render h1,.md-render h2,.md-render h3 { font-weight: 700; margin: 1.2em 0 .4em; color: var(--c-text); }
.md-render h1 { font-size: 1.4em; } .md-render h2 { font-size: 1.2em; } .md-render h3 { font-size: 1.05em; }
.md-render p { margin: .6em 0; }
.md-render ul,.md-render ol { padding-left: 1.4em; margin: .5em 0; }
.md-render li { margin: .25em 0; }
.md-render code { font-family: var(--dp-font-mono); font-size: 12.5px; background: var(--c-sidebar); padding: 2px 5px; border-radius: 4px; }
.md-render pre { background: var(--c-sidebar); border-radius: 8px; padding: 12px; overflow-x: auto; margin: .8em 0; }
.md-render pre code { background: none; padding: 0; }
/* Tablo yatay kaydırma sarmalayıcısı (guvenliMarked her <table>'ı bununla sarar):
   dar ekranda tablo KENDİ içinde kayar, tüm sayfayı yatay kaydırmaz. */
.md-render .md-tablo-sar { overflow-x: auto; max-width: 100%; margin: .8em 0; -webkit-overflow-scrolling: touch; }
.md-render table { border-collapse: collapse; width: 100%; margin: 0; font-size: 13px; }
.md-render .md-tablo-sar table { margin: 0; }
.md-render th,.md-render td { border: 1px solid var(--c-border); padding: 6px 10px; text-align: left; }
.md-render th { background: var(--c-sidebar); font-weight: 600; }
.md-render blockquote { border-left: 3px solid var(--c-accent); margin: .6em 0; padding: .4em 1em; color: var(--c-text-2); background: var(--c-accent-soft); border-radius: 0 6px 6px 0; }
.md-render hr { border: none; border-top: 1px solid var(--c-border); margin: 1em 0; }

.abody code { font-family: var(--dp-font-mono); font-size: 12.5px; background: var(--c-sidebar); padding: 7px 10px; border-radius: 8px; display: block; margin: 8px 0; white-space: pre-wrap; }

/* ---------- popmenu ---------- */
.popmenu { position: fixed; z-index: 80; background: var(--c-surface); border: 1px solid var(--c-border-2);
  border-radius: var(--r-md); box-shadow: var(--shadow-pop); padding: 6px; min-width: 220px; }
.pop-head { font-size: 10.5px; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; color: var(--c-text-3); padding: 8px 12px 4px; }
.pop-item { display: flex; align-items: center; gap: 12px; width: 100%; text-align: left;
  background: none; border: 0; padding: 9px 12px; border-radius: var(--r-sm); cursor: pointer; color: var(--c-text); font-family: var(--dp-font-sans); text-decoration: none; }
.pop-item > i { font-size: 19px; color: var(--c-accent); flex: none; width: 22px; text-align: center; }
.pop-tx { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.pop-t { font-size: 13.5px; font-weight: 600; line-height: 1.25; color: var(--c-text); }
.pop-t .pop-ext { font-size: 12px; color: var(--c-text-3); margin-left: 2px; }
.pop-sub { font-size: 11.5px; color: var(--c-text-3); font-weight: 400; line-height: 1.3; }
.pop-item:hover { background: var(--c-sidebar-hov); }
.pop-sep { height: 1px; background: var(--c-border); margin: 6px 8px; }

.pop-search { min-width: 300px; padding: 8px; }
.pop-search-box { display: flex; align-items: center; gap: 8px; border: 1px solid var(--c-border-2); border-radius: var(--r-sm);
  padding: 7px 10px; margin-bottom: 6px; }
.pop-search-box i { color: var(--c-text-3); }
.pop-search-box input { border: 0; outline: 0; flex: 1; font: 400 14px var(--dp-font-sans); background: none; color: var(--c-text); }
.pop-list { max-height: 320px; overflow-y: auto; }
.pop-row { display: flex; align-items: center; gap: 9px; padding: 8px 10px; border-radius: var(--r-sm); cursor: pointer; font-size: 14px; }
.pop-row:hover { background: var(--c-sidebar-hov); }
.pop-row.sel { background: var(--c-accent-soft); }
.pop-row.sel .pr-check { color: var(--c-accent); }
.pop-row .pr-dot { width: 9px; height: 9px; border-radius: 50%; flex: none; }
.pop-row .pr-tx { display: flex; flex-direction: column; line-height: 1.25; min-width: 0; }
.pop-row .pr-tx .pr-t { font-weight: 500; color: var(--c-text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pop-row .pr-tx .pr-s { font-size: 11.5px; color: var(--c-text-3); }
.pop-row .pr-check { margin-left: auto; color: transparent; font-size: 16px; }
.pop-empty { padding: 18px; text-align: center; color: var(--c-text-3); font-size: 13px; }

/* ---------- pages (muhasebe / asana / ciktilar) ---------- */
#view-muhasebe, #view-asana, #view-ciktilar { overflow-y: auto; }
.page { width: 100%; max-width: 880px; margin: 0 auto; padding: 8px 28px 48px; }
.page-head { padding: 16px 2px 20px; }
.page-head h2 { font-family: var(--serif); font-size: 26px; font-weight: 500; margin: 0 0 6px; }
.page-head p { color: var(--c-text-2); font-size: 14px; margin: 0; max-width: 640px; }
.page-head code, .page-head p code { font-family: var(--dp-font-mono); font-size: 12.5px; background: var(--c-sidebar); padding: 1px 5px; border-radius: 5px; }
.card { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--r-md); padding: 22px; margin-bottom: 22px; box-shadow: var(--shadow-soft); }
.card-h { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.card-h h3 { font-size: 16px; font-weight: 650; margin: 0; display: flex; align-items: center; gap: 8px; }
.card-h h3 i { color: var(--c-accent); }
.card-h-actions { margin-left: auto; display: flex; gap: 8px; }
.row-actions { display: flex; gap: 10px; margin-top: 16px; flex-wrap: wrap; }
.field { margin-bottom: 14px; }
.field label { display: block; font-size: 12px; font-weight: 600; color: var(--c-text-2); margin-bottom: 6px; }

/* mail modal */
.field { margin-bottom: 14px; }
.field label { display: block; font-size: 12px; font-weight: 600; color: var(--c-text-2); margin-bottom: 5px; text-transform: uppercase; letter-spacing: .04em; }
.mail-ek-onizle { margin-bottom: 14px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.mail-ek-chip { display: inline-flex; align-items: center; gap: 6px; background: var(--c-accent-soft); color: var(--c-accent); border: 1px solid var(--c-accent); border-radius: 20px; padding: 4px 10px 4px 12px; font-size: 12.5px; font-weight: 600; }
.mail-ek-sil { background: none; border: none; cursor: pointer; color: var(--c-accent); font-size: 16px; line-height: 1; padding: 0; margin-left: 2px; opacity: .7; }
.mail-ek-sil:hover { opacity: 1; }
.mail-ek-ekle-btn { padding: 3px 8px !important; height: auto !important; font-size: 12px !important; }
.mail-ek-picker { position: fixed; top: 50%; left: 50%; transform: translate(-50%,-50%); background: var(--c-surface); border: 1px solid var(--c-border-2); border-radius: var(--r-md); padding: 20px; z-index: 9999; min-width: 320px; max-width: 480px; box-shadow: 0 8px 32px rgba(0,0,0,.18); }
.mep-kapat { position: absolute; top: 12px; right: 14px; background: none; border: none; font-size: 18px; cursor: pointer; color: var(--c-text-2); }
.mep-baslik { font-weight: 700; font-size: 14px; margin-bottom: 12px; }
.mep-liste { max-height: 260px; overflow-y: auto; margin-bottom: 14px; display: flex; flex-direction: column; gap: 4px; }
.mep-item { display: flex; align-items: center; gap: 8px; font-size: 13px; cursor: pointer; padding: 4px 6px; border-radius: 6px; }
.mep-item:hover { background: var(--c-sidebar-hov); }
.mep-tamam { width: 100%; justify-content: center; }

/* form öğeleri */
.dp-input {
  width: 100%; border: 1px solid var(--c-border-2); border-radius: var(--r-sm); padding: 9px 12px;
  font: 400 14px var(--dp-font-sans); color: var(--c-text); background: var(--c-surface); outline: none;
}
.dp-input:focus { border-color: var(--c-accent); box-shadow: 0 0 0 3px rgba(255,87,34,.12); }

/* butonlar */
.dp-btn { display: inline-flex; align-items: center; gap: 7px; border: 1px solid transparent; border-radius: var(--r-sm);
  padding: 0 15px; height: 38px; font: 600 13.5px var(--dp-font-sans); cursor: pointer; transition: all .13s; text-decoration: none; }
.dp-btn i { font-size: 17px; }
.dp-btn-primary { background: var(--c-accent); color: #fff; }
.dp-btn-primary:hover { background: var(--c-accent-600); }
.dp-btn-light { background: var(--c-sidebar); color: var(--c-text); border-color: var(--c-border-2); }
.dp-btn-light:hover { background: var(--c-sidebar-hov); }
.dp-btn-danger { background: var(--c-surface); color: #c0392b; border-color: #e6c3bd; }
.dp-btn-danger:hover { background: #fbeae7; border-color: #d9a79e; }

/* eklentiler & bağlantılar */
.eklenti-grid { display: flex; flex-direction: column; gap: 12px; margin-top: 4px; }
.eklenti-card { display: flex; align-items: center; gap: 14px; padding: 16px; border: 1px solid var(--c-border); border-radius: var(--r-md); background: var(--c-surface); }
.ek-ikon { flex: none; width: 46px; height: 46px; border-radius: 11px; display: grid; place-items: center; font-size: 24px; color: var(--ek-renk, var(--c-accent)); background: color-mix(in srgb, var(--ek-renk, var(--c-accent)) 12%, transparent); }
.ek-body { flex: 1 1 auto; min-width: 0; }
.ek-ust { display: flex; align-items: center; gap: 10px; margin-bottom: 3px; }
.ek-ad { font-weight: 600; font-size: 15px; color: var(--c-text); }
.ek-aciklama { font-size: 13px; color: var(--c-text-2); line-height: 1.4; }
.ek-durum { display: inline-flex; align-items: center; gap: 4px; font-size: 11.5px; font-weight: 600; padding: 2px 9px; border-radius: 20px; }
.ek-durum i { font-size: 9px; }
.ek-durum.on { color: #1a7a4c; background: #e4f4ec; }
.ek-durum.off { color: var(--c-text-3); background: var(--c-sidebar); }
/* Hesap bağlı ama izin eksik/eskimiş — "bağlı değil"den ayrılsın diye uyarı rengi. */
.ek-durum.uyari { color: #8a5a00; background: #fdf1dc; }
.ek-aksiyon { flex: none; display: flex; gap: 8px; align-items: center; }
/* Kart içi yetenek satırları — bir eklentinin ayrı ayrı açık/kapalı olabilen alt yetenekleri
   (ör. Meta'da veri okuma vs. kampanya yönetimi). */
.ek-yetenek { display: flex; align-items: center; gap: 6px; margin-top: 5px; font-size: 12.5px; line-height: 1.35; }
.ek-yetenek i { font-size: 13px; flex: none; }
.ek-yetenek.on { color: #1a7a4c; }
.ek-yetenek.off { color: var(--c-text-3); }
.ek-yetenek em { font-style: normal; font-size: 11.5px; color: var(--c-text-3); margin-left: auto; padding-left: 8px; }
.ek-aksiyon .dp-btn { height: 34px; font-size: 12.5px; }
.ek-kilit { color: var(--c-text-3); font-size: 18px; display: grid; place-items: center; width: 34px; height: 34px; }
/* satır içi API-anahtarı formu */
.ek-anahtar-kutu { width: 300px; max-width: 100%; display: flex; flex-direction: column; gap: 8px; }
.ek-anahtar-input { width: 100%; height: 36px; }
.ek-anahtar-alt { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.ek-anahtar-link { font-size: 12px; color: var(--c-accent); text-decoration: none; display: inline-flex; align-items: center; gap: 4px; }
.ek-anahtar-link:hover { text-decoration: underline; }
.ek-anahtar-btns { display: flex; gap: 8px; }
.ek-anahtar-btns .dp-btn { height: 32px; font-size: 12.5px; }
.ek-anahtar-durum { font-size: 12px; color: var(--c-text-2); }
.ek-uyari { margin-top: 8px; font-size: 12.5px; color: #8a5a00; background: #fdf3df; border: 1px solid #f0dfb0; border-radius: 8px; padding: 8px 10px; line-height: 1.4; }
@media (max-width: 560px) {
  .eklenti-card { flex-wrap: wrap; }
  .ek-aksiyon, .ek-anahtar-kutu { width: 100%; }
  .ek-aksiyon > .dp-btn { flex: 1; justify-content: center; }
}

/* upload dropzone */
.dp-upload { display: flex; align-items: center; gap: 14px; border: 1.5px dashed var(--c-border-2); border-radius: var(--r-md);
  padding: 18px 20px; cursor: pointer; transition: all .14s; position: relative; }
.dp-upload:hover, .dp-upload.drag { border-color: var(--c-accent); background: var(--c-accent-soft); }
.dp-upload > i { font-size: 26px; color: var(--c-accent); }
.up-text { display: flex; flex-direction: column; }
.up-main { font-weight: 600; font-size: 14px; }
.up-sub { font-size: 12px; color: var(--c-text-3); }
.dp-filethumb { width: 46px; height: 46px; object-fit: cover; border-radius: 8px; margin-left: auto; }

/* fiş listesi */
.dp-fislist { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; }
.dp-fischip { display: flex; align-items: center; gap: 8px; background: var(--c-sidebar); border: 1px solid var(--c-border); border-radius: 10px; padding: 6px 10px; font-size: 12.5px; max-width: 240px; }
.dp-fischip img { width: 30px; height: 30px; object-fit: cover; border-radius: 6px; }
.dp-fischip .nm { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dp-fischip .x { cursor: pointer; color: var(--c-text-3); font-size: 16px; }
.dp-fischip .x:hover { color: var(--c-err); }

/* alt feed (muhasebe/asana içi) */
.sub-feed { max-width: 100%; padding: 0; margin-top: 18px; }
.sub-feed:empty { display: none; }
.dp-fisrow { display: flex; align-items: center; gap: 8px; padding: 9px 12px; border: 1px solid var(--c-border); border-radius: var(--r-sm); margin-bottom: 8px; font-size: 13px; background: var(--c-surface); }
.dp-fisrow .nm { font-weight: 500; }
.dp-fisrow a { color: var(--c-accent-600); }
.s-ok { color: var(--c-ok); } .s-err { color: var(--c-err); } .s-wait { color: var(--c-text-3); }

/* asana görev kartı */
.dp-asana-task { border: 1px solid var(--c-border); border-radius: var(--r-md); padding: 16px; margin-bottom: 12px; background: var(--c-surface); }
.dp-asana-task .t { font-weight: 650; font-size: 15px; margin-bottom: 4px; }
.dp-asana-task .m { font-size: 12px; color: var(--c-text-3); margin-bottom: 10px; }
.dp-asana-task .m a { color: var(--c-accent-600); }
.dp-asana-task .b { font-size: 13px; color: var(--c-text-2); background: var(--c-page); border-radius: var(--r-sm); padding: 10px 12px; margin-bottom: 12px; line-height: 1.5; }
.dp-asana-task .acts { display: flex; gap: 8px; }

/* çıktılar grid */
.dp-result-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 16px; }
.dp-result { background: var(--c-surface); border: 1px solid var(--c-border); border-radius: var(--r-md); overflow: hidden; box-shadow: var(--shadow-soft); transition: transform .14s, box-shadow .14s; }
.dp-result:hover { transform: translateY(-2px); box-shadow: var(--shadow-pop); }
.dp-thumb { position: relative; height: 150px; background: var(--c-sidebar) center/cover no-repeat; display: grid; place-items: center; }
.dp-thumb .tag { position: absolute; top: 8px; left: 8px; background: rgba(43,42,39,.78); color: #fff; font-size: 11px; font-weight: 600; padding: 3px 8px; border-radius: 999px; display: inline-flex; align-items: center; gap: 4px; }
.dp-thumb .doc { display: flex; flex-direction: column; align-items: center; gap: 6px; color: var(--c-text-3); }
.dp-thumb .doc i { font-size: 34px; }
.dp-thumb .doc span { font-size: 11px; font-weight: 600; letter-spacing: .04em; }
.dp-result .body { padding: 12px 14px 4px; }
.dp-result .body .t { font-weight: 600; font-size: 14px; line-height: 1.35; }
.dp-result .body .m { font-size: 12px; color: var(--c-text-3); margin-top: 3px; }
.dp-result .acts { display: flex; gap: 8px; padding: 12px 14px; }
.dp-result .acts .dp-btn { height: 34px; flex: 1; justify-content: center; font-size: 12.5px; }

/* boş durum */
.dp-empty { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 40px 20px; color: var(--c-text-3); font-size: 13.5px; text-align: center; }
.dp-empty i { font-size: 30px; opacity: .55; }

/* KPI + tablo (maliyet & gider) */
.dp-kpi { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 12px; margin-bottom: 18px; }
.dp-kpi .box { background: var(--c-page); border: 1px solid var(--c-border); border-radius: var(--r-md); padding: 16px; }
.dp-kpi .n { font-size: 24px; font-weight: 700; letter-spacing: -.01em; }
.dp-kpi .k { font-size: 12px; color: var(--c-text-3); margin-top: 2px; }
/* Admin paneli — kullanıcı ekleme çubuğu (kişi giriş yapmadan önce eklenebilsin diye). */
.admin-ekle-bar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-bottom: 14px; padding-bottom: 14px; border-bottom: 1px solid var(--c-border, #e6e6e6); }
.admin-ekle-bar .dp-input { flex: 1 1 200px; min-width: 0; }
.admin-ekle-bar .admin-ekle-not { flex: 1 1 100%; font-size: 12.5px; min-height: 0; }
.admin-ekle-bar .admin-ekle-not.hata { color: #c0392b; }
.admin-ekle-bar .admin-ekle-not.ok { color: #1a7a4c; }
/* Admin görev geçmişi: modalda yer var, başlıklar kırpılmak yerine alta sarsın. */
.admin-gecmis .pop-row { align-items: flex-start; }
.admin-gecmis .pr-tx { flex: 1 1 auto; }
.admin-gecmis .pr-tx .pr-t { white-space: normal; overflow: visible; overflow-wrap: anywhere; }
/* Çıktılar süzgeci — yalnız adminde görünür (benim / tüm ekip). */
.cikti-suzgec { display: flex; align-items: center; gap: 6px; margin: 0 0 12px; flex-wrap: wrap; }
.cikti-suzgec .cs-btn { border: 1px solid var(--c-border); background: transparent; color: var(--c-text-2);
  border-radius: 999px; padding: 5px 13px; font-size: 12.5px; font-weight: 500; cursor: pointer; min-height: 32px; }
.cikti-suzgec .cs-btn:hover { background: var(--c-sidebar-hov); }
.cikti-suzgec .cs-btn.aktif { background: var(--c-accent-soft); border-color: var(--c-accent); color: var(--c-accent); font-weight: 600; }
.cikti-suzgec .cs-sayi { margin-left: auto; font-size: 11.5px; color: var(--c-text-3); }
.dp-result .m .cikti-sahip { display: inline-flex; align-items: center; gap: 3px; margin-left: 6px;
  padding: 1px 7px; border-radius: 999px; background: var(--c-sidebar); color: var(--c-text-3); font-size: 11px; }
.dp-result .m .cikti-sahip i { font-size: 12px; }

/* Admin: oturum maliyeti rozeti + açılır konuşma içeriği. Maliyet YALNIZ admin panelinde görünür. */
.admin-gecmis .ag-maliyet { margin-left: auto; flex: none; font-family: var(--dp-font-mono); font-size: 12.5px;
  font-weight: 600; color: #b8860b; background: var(--c-sidebar); border-radius: var(--r-sm); padding: 3px 8px; }
.admin-gecmis .ag-maliyet.ag-yok { color: var(--c-text-3); font-weight: 400; }
.admin-gecmis .ag-ok { font-size: 13px; color: var(--c-text-3); }
.admin-gecmis .ag-icerik { margin: 2px 0 10px; padding: 4px 10px 4px 22px; border-left: 2px solid var(--c-border); }
.admin-gecmis .ag-mesaj { margin: 10px 0; }
.admin-gecmis .ag-rol { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em;
  color: var(--c-text-3); margin-bottom: 3px; }
.admin-gecmis .ag-user .ag-govde { background: var(--c-sidebar); border-radius: var(--r-sm); padding: 8px 10px;
  font-size: 13.5px; overflow-wrap: anywhere; }
.admin-gecmis .ag-agent .ag-govde { font-size: 13.5px; line-height: 1.65; overflow-wrap: anywhere; }
.admin-gecmis .ag-govde table { border-collapse: collapse; width: 100%; font-size: 12.5px; margin: .6em 0; }
.admin-gecmis .ag-govde th, .admin-gecmis .ag-govde td { border: 1px solid var(--c-border); padding: 5px 8px; text-align: left; }
.admin-gecmis .ag-govde th { background: var(--c-sidebar); font-weight: 600; }
.admin-gecmis .ag-govde pre { background: var(--c-sidebar); border-radius: 8px; padding: 10px; overflow-x: auto; }
.admin-gecmis .ag-govde img { max-width: 100%; height: auto; border-radius: var(--r-sm); }
/* Erişim düzenleme: uzun ajan/müşteri adları kutudan taşmasın. */
#erisim-agent-grid label span, #erisim-musteri-grid label span { overflow-wrap: anywhere; min-width: 0; }
#erisim-agent-grid input, #erisim-musteri-grid input { flex: none; }

/* Geniş tablo modalın içine SIĞDIRILIR — yatay kaydırma çubuğu istenmiyor.
   Dar ekranda sığmayan sütunlar (.col-ops → .col-ops2) sırayla gizlenir. */
.dp-tablo-sarici { width: 100%; max-width: 100%; overflow-x: hidden; }
.dp-mtable { width: 100%; border-collapse: collapse; font-size: 13px; }
.dp-mtable th { text-align: left; font-size: 10.5px; text-transform: uppercase; letter-spacing: .03em; color: var(--c-text-3); padding: 7px 8px; border-bottom: 1px solid var(--c-border); white-space: nowrap; }
.dp-mtable td { padding: 9px 8px; border-bottom: 1px solid var(--c-border); vertical-align: middle; }
.dp-mtable td.wrap { overflow-wrap: anywhere; }
.dp-mtable .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.dp-mtable .nowrap { white-space: nowrap; }
@media (max-width: 1120px) { .dp-mtable .col-ops  { display: none; } }
@media (max-width: 900px)  { .dp-mtable .col-ops2 { display: none; } }
.dp-note { display: flex; gap: 10px; margin-top: 18px; padding: 12px 14px; background: var(--c-accent-soft); border-radius: var(--r-sm); font-size: 12.5px; color: var(--c-text-2); }
.dp-note i { color: var(--c-accent); font-size: 18px; flex: none; }
.dp-note code { font-family: var(--dp-font-mono); }

/* ---------- modal ---------- */
.dp-modal { position: fixed; inset: 0; z-index: 100; display: none; align-items: center; justify-content: center; background: rgba(43,42,39,.45); padding: 24px; }
.dp-modal.open { display: flex; }
.dp-modal .box { background: var(--c-surface); border-radius: var(--r-md); width: min(720px, 100%); max-height: 86vh; display: flex; flex-direction: column; box-shadow: var(--shadow-pop); overflow: hidden; }
.dp-modal .box-lg { width: min(840px, 100%); }
/* Admin paneli 9 sütunlu tablo içeriyor — içerik sığsın diye daha geniş kutu. */
#admin-modal .box { width: min(1180px, 100%); }
#admin-modal .view-body { padding: 18px 16px; overflow-x: hidden; }
.modal-intro { font-size: 13px; color: var(--c-text-2); margin: 0 0 18px; line-height: 1.5; }
/* Meta karşılama modalı: "Bağla" birincil, "Şimdi değil" ikincil — atlamak serbest ama
   göz birincil eyleme gitsin diye sağa hizalı, aralarında net boşluk var. */
.meta-karsilama-aksiyon { display: flex; gap: 10px; justify-content: flex-end; flex-wrap: wrap; }
.modal-intro code { font-family: var(--dp-font-mono); font-size: 12px; background: var(--c-sidebar); padding: 1px 5px; border-radius: 5px; }
.dp-modal .head { display: flex; align-items: center; gap: 9px; padding: 16px 18px; border-bottom: 1px solid var(--c-border); font-weight: 650; }
.dp-modal .head i { color: var(--c-accent); }
.dp-modal .head .t { font-size: 15px; }
.dp-modal .head .x { margin-left: auto; background: none; border: 0; font-size: 24px; line-height: 1; color: var(--c-text-3); cursor: pointer; }
.dp-modal .head .x:hover { color: var(--c-text); }
.dp-modal .view-body { padding: 20px; overflow-y: auto; }
.dp-modal .view-body img { max-width: 100%; border-radius: 8px; display: block; margin: 0 auto; }
.dp-modal .view-body iframe { width: 100%; height: 60vh; border: 0; border-radius: 8px; }
.dp-modal .foot { display: flex; justify-content: flex-end; gap: 10px; padding: 14px 18px; border-top: 1px solid var(--c-border); }

/* scrim (popup arka kapatıcı) */
.scrim { position: fixed; inset: 0; z-index: 70; }

/* ---------- responsive ---------- */
@media (max-width: 820px) {
  .sidebar { position: fixed; z-index: 90; height: 100%; box-shadow: var(--shadow-pop); margin-left: -264px; }
  .app.side-open .sidebar { margin-left: 0; }
  .only-mobile { display: inline-grid; }
  .feed, .dock, .page { padding-left: 16px; padding-right: 16px; }
  /* iOS otomatik zoom'u önle: odaklanılan input'un font-size'ı <16px ise iOS sayfayı büyütür. */
  input, textarea, select, .dp-input, .ek-anahtar-input { font-size: 16px; }
  /* Dokunma hedefleri en az ~44px (Apple/Google erişilebilirlik önerisi). */
  .dp-btn, .pop-row, .gecmis-item, .dp-modal .head .x { min-height: 44px; }
  .dp-btn { display: inline-flex; align-items: center; }
}

/* ---------- Planlanmış görevler (Scheduled) ---------- */
/* Mevcut .popmenu/.pop-row iskeleti aynen kullanılır; buradakiler yalnız plan satırına özgü
   eklemeler: başlıktaki "Yeni" düğmesi, durum rozeti ve satır içi eylemler. */
.pop-plan { min-width: 340px; max-width: 420px; }
.pop-plan .pop-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.pop-head-btn {
  display: inline-flex; align-items: center; gap: 4px; border: 1px solid var(--c-border-2);
  background: var(--c-surface); color: var(--c-text-2); border-radius: var(--r-sm);
  padding: 3px 8px; font-size: 11px; font-weight: 600; letter-spacing: 0; text-transform: none; cursor: pointer;
}
.pop-head-btn:hover { background: var(--c-sidebar-hov); color: var(--c-text); }

.plan-row { display: flex; align-items: flex-start; gap: 9px; padding: 9px 10px; border-radius: var(--r-sm); }
.plan-row:hover { background: var(--c-sidebar-hov); }
.plan-row + .plan-row { border-top: 1px solid var(--c-border); }
.plan-row .pl-tx { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.plan-row .pl-t { font-weight: 500; color: var(--c-text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.plan-row .pl-s { font-size: 11.5px; color: var(--c-text-3); }
.plan-row.pasif .pl-t { color: var(--c-text-3); }

/* Durum rozeti — renk tek başına anlam taşımaz, metin de yazar (renk körlüğü). */
.pl-rozet { font-size: 10px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
  padding: 2px 6px; border-radius: 999px; white-space: nowrap; flex: none; }
.pl-rozet.aktif { background: var(--c-accent-soft); color: var(--c-accent); }
.pl-rozet.pasif { background: var(--c-sidebar-hov); color: var(--c-text-3); }
.pl-rozet.hata  { background: #fee2e2; color: #b91c1c; }

.pl-eylem { display: flex; gap: 2px; flex: none; }
.pl-eylem button {
  border: 0; background: none; color: var(--c-text-3); cursor: pointer;
  padding: 4px; border-radius: var(--r-sm); font-size: 15px; line-height: 1;
}
.pl-eylem button:hover { background: var(--c-border); color: var(--c-text); }
.pl-eylem button.sil:hover { background: #fee2e2; color: #b91c1c; }