/* meserp ana stil — index.html'den ayrıldı (2026-08-22). Kaynak burası; index.html'e CSS EKLENMEZ. */
/* ═══ RESET & BASE ═══ */
*{margin:0;padding:0;box-sizing:border-box;}
:root{
/* ── Koyu Lacivert (varsayılan) ── */
--bg:#0a0f1e;
--panel:#0d1628;
--topbar-bg:#080d18;
--border:rgba(99,179,237,0.2);
--primary:#63b3ed;
--accent:#68d391;
--warn:#f6ad55;
--danger:#fc8181;
--text:#e2e8f0;
--muted:#8899aa;
--text-soft:rgba(226,232,240,0.75);
--placeholder:rgba(226,232,240,0.25);
--diff-sep:rgba(255,255,255,0.05);
--row-even:rgba(99,179,237,0.05);
--row-hover:rgba(99,179,237,0.1);
--input-bg:rgba(99,179,237,0.07);
}
/* ── Temalar ── */
/* 🧛 Dracula */
body[data-theme="dracula"]{
--bg:#282a36; --panel:#21222c; --topbar-bg:#191a21;
--border:rgba(98,114,164,0.45);
--primary:#bd93f9; --accent:#50fa7b; --warn:#f1fa8c; --danger:#ff5555;
--text:#f8f8f2; --muted:#9a9eb8;
--text-soft:rgba(248,248,242,0.72); --placeholder:rgba(248,248,242,0.22);
--diff-sep:rgba(255,255,255,0.05);
--row-even:rgba(98,114,164,0.1); --row-hover:rgba(189,147,249,0.12); --input-bg:rgba(98,114,164,0.15);
}
/* 🌆 Tokyo Night — NEON: saf siyah zemin, fosforlu cyan + neon yeşil, çarpıcı kontrast */
body[data-theme="tokyonight"]{
--bg:#000000; --panel:#050a08; --topbar-bg:#000000;
--border:rgba(0,255,224,0.42);
--primary:#00ffe1; --accent:#39ff14; --warn:#faff00; --danger:#ff1e6d;
--text:#caffef; --muted:#4fd6bd;
--text-soft:rgba(202,255,239,0.75); --placeholder:rgba(0,255,224,0.28);
--diff-sep:rgba(0,255,224,0.09);
--row-even:rgba(0,255,224,0.045); --row-hover:rgba(57,255,20,0.13); --input-bg:rgba(0,255,224,0.08);
}
/* Neon parıltı (glow) — yalnız bu temada, okunabilirliği bozmayan hedefli öğeler */
body[data-theme="tokyonight"] .topbar-brand{ text-shadow:0 0 10px rgba(0,255,225,0.8),0 0 20px rgba(0,255,225,0.35); }
body[data-theme="tokyonight"] .kpi-val,
body[data-theme="tokyonight"] .ap-ico,
body[data-theme="tokyonight"] .ai-kan-card-po,
body[data-theme="tokyonight"] .pgl-model,
body[data-theme="tokyonight"] .ai-kan-col-title{ text-shadow:0 0 7px rgba(0,255,225,0.55); }
body[data-theme="tokyonight"] .ai-kan-card-term,
body[data-theme="tokyonight"] .pgl-term{ text-shadow:0 0 7px rgba(57,255,20,0.6); }
body[data-theme="tokyonight"] .btn-primary{ box-shadow:0 0 12px rgba(0,255,225,0.45); border-color:rgba(0,255,225,0.6) !important; }
body[data-theme="tokyonight"] .btn-primary:hover{ box-shadow:0 0 18px rgba(0,255,225,0.7); }
body[data-theme="tokyonight"] .ai-kan-card:hover,
body[data-theme="tokyonight"] .pgl-card:hover{ box-shadow:0 0 14px rgba(0,255,225,0.35); }
body[data-theme="tokyonight"] .kpi-card:hover{ box-shadow:0 0 14px rgba(57,255,20,0.3); }
/* 🐱 Catppuccin Mocha */
body[data-theme="catppuccin"]{
--bg:#1e1e2e; --panel:#181825; --topbar-bg:#141420;
--border:rgba(108,112,134,0.35);
--primary:#89b4fa; --accent:#a6e3a1; --warn:#f9e2af; --danger:#f38ba8;
--text:#cdd6f4; --muted:#7c819e;
--text-soft:rgba(205,214,244,0.72); --placeholder:rgba(205,214,244,0.22);
--diff-sep:rgba(255,255,255,0.05);
--row-even:rgba(108,112,134,0.1); --row-hover:rgba(137,180,250,0.12); --input-bg:rgba(108,112,134,0.15);
}
/* ❄️ Nord */
body[data-theme="nord"]{
--bg:#2e3440; --panel:#272c38; --topbar-bg:#232730;
--border:rgba(76,86,106,0.6);
--primary:#88c0d0; --accent:#a3be8c; --warn:#ebcb8b; --danger:#bf616a;
--text:#eceff4; --muted:#8c95a5;
--text-soft:rgba(236,239,244,0.72); --placeholder:rgba(236,239,244,0.22);
--diff-sep:rgba(255,255,255,0.05);
--row-even:rgba(76,86,106,0.18); --row-hover:rgba(136,192,208,0.12); --input-bg:rgba(76,86,106,0.22);
}
/* 📋 Odoo */
body[data-theme="odoo"]{
--bg:#ffffff; --panel:#f9f9f9; --topbar-bg:#714b67;
--border:rgba(0,0,0,0.12);
--primary:#714b67; --accent:#017e84; --warn:#e07b39; --danger:#e74c3c;
--text:#1f1f1f; --muted:#666666;
--text-soft:rgba(31,31,31,0.7);
--placeholder:rgba(31,31,31,0.28);
--diff-sep:rgba(0,0,0,0.06);
--row-even:rgba(0,0,0,0.03); --row-hover:rgba(113,75,103,0.08); --input-bg:rgba(113,75,103,0.06);
}
body[data-theme="odoo"] .topbar { background:#714b67 !important; border-color:rgba(255,255,255,0.15) !important; }
body[data-theme="odoo"] .topbar * { color:#fff !important; }
body[data-theme="odoo"] .topbar .tnav-btn:hover,
body[data-theme="odoo"] .topbar .icon-btn:hover { background:rgba(255,255,255,0.15) !important; }
body[data-theme="odoo"] th { background:#f0f0f0 !important; color:#333 !important; font-weight:700 !important; border-bottom:2px solid #c0c0c0 !important; }
body[data-theme="odoo"] th.sortable:hover { background:#e4e4e4 !important; }
body[data-theme="odoo"] .table-toolbar { background:#e0e0e0 !important; }
body[data-theme="odoo"] td { border-bottom:1px solid #d5d5d5 !important; }
body[data-theme="odoo"] .ctx-item { color:#1f1f1f !important; }
body[data-theme="odoo"] .ctx-item:hover { background:rgba(113,75,103,0.1) !important; color:#1f1f1f !important; }
body[data-theme="odoo"] #userMenuDrop,
body[data-theme="odoo"] .ctx-submenu,
body[data-theme="odoo"] .fb-dropdown,
body[data-theme="odoo"] [class*="drop"]:not(.tnav-drop) { background:#fff !important; border-color:#d0d0d0 !important; }
body[data-theme="odoo"] .tnav-drop { background:#fff !important; border-color:#d0d0d0 !important; }
body[data-theme="odoo"] .tnav-drop * { color:#1f1f1f !important; }
body[data-theme="odoo"] .tnav-item { color:#1f1f1f !important; }
body[data-theme="odoo"] .tnav-item:hover { background:rgba(113,75,103,0.08) !important; }
/* ☀️ Aydınlık — koyu text-soft zorunlu */
body[data-theme="light"]{
--bg:#ffffff; --panel:#f6f8fa; --topbar-bg:#ffffff;
--border:rgba(31,35,40,0.15);
--primary:#0969da; --accent:#1a7f37; --warn:#9a6700; --danger:#cf222e;
--text:#1f2328; --muted:#57606a;
--text-soft:rgba(31,35,40,0.72); /* KOYU — açık zemin için */
--placeholder:rgba(31,35,40,0.3);
--diff-sep:rgba(0,0,0,0.06);
--row-even:rgba(31,35,40,0.04); --row-hover:rgba(9,105,218,0.07); --input-bg:rgba(9,105,218,0.06);
}
/* 🌸 Pastel — koyu text-soft zorunlu */
body[data-theme="pastel"]{
--bg:#f4f0fb; --panel:#ede8f8; --topbar-bg:#f4f0fb;
--border:rgba(107,70,193,0.2);
--primary:#6b46c1; --accent:#276749; --warn:#975a16; --danger:#9b2c2c;
--text:#1a202c; --muted:#5a5f72;
--text-soft:rgba(26,32,44,0.72); /* KOYU — açık zemin için */
--placeholder:rgba(26,32,44,0.3);
--diff-sep:rgba(0,0,0,0.06);
--row-even:rgba(107,70,193,0.06); --row-hover:rgba(107,70,193,0.1); --input-bg:rgba(107,70,193,0.07);
}
/* 🎀 Pastel Kontrast — yüksek kontrast pastel */
body[data-theme="pastelcontrast"]{
--bg:#faf5ff; --panel:#ede5fc; --topbar-bg:#faf5ff;
--border:rgba(88,28,180,0.3);
--primary:#5521b5; --accent:#145a32; --warn:#7c4a00; --danger:#7b1a1a;
--text:#12082e; --muted:#3d3558;
--text-soft:rgba(18,8,46,0.78); /* KOYU — açık zemin için */
--placeholder:rgba(18,8,46,0.35);
--diff-sep:rgba(0,0,0,0.08);
--row-even:rgba(88,28,180,0.07); --row-hover:rgba(88,28,180,0.14); --input-bg:rgba(88,28,180,0.08);
}
/* 🌿 Orman */
body[data-theme="forest"]{
--bg:#0d1f12; --panel:#0a1a0e; --topbar-bg:#08150b;
--border:rgba(72,187,120,0.25);
--primary:#68d391; --accent:#4fd1c5; --warn:#f6ad55; --danger:#fc8181;
--text:#e8f5e9; --muted:#7aaa85;
--text-soft:rgba(232,245,233,0.72); --placeholder:rgba(232,245,233,0.22);
--diff-sep:rgba(255,255,255,0.05);
--row-even:rgba(72,187,120,0.07); --row-hover:rgba(72,187,120,0.12); --input-bg:rgba(72,187,120,0.08);
}
/* ⬜ Mono */
body[data-theme="mono"]{
--bg:#0f0f0f; --panel:#1c1c1c; --topbar-bg:#111111;
--border:rgba(255,255,255,0.14);
--primary:#e8e8e8; --accent:#c0c0c0; --warn:#a8a8a8; --danger:#909090;
--text:#e8e8e8; --muted:#888888;
--text-soft:rgba(232,232,232,0.72); --placeholder:rgba(232,232,232,0.2);
--diff-sep:rgba(255,255,255,0.05);
--row-even:rgba(255,255,255,0.04); --row-hover:rgba(255,255,255,0.08); --input-bg:rgba(255,255,255,0.07);
}
/* 🛰️ JARVIS — HUD / ark reaktörü. Renk paleti + hedefli parıltı ve ızgara
katmanı. TAMAMEN EK: yalnız body[data-theme="jarvis"] altında çalışır,
başka hiçbir temayı ve düzeni etkilemez. */
body[data-theme="jarvis"]{
--bg:#020a12; --panel:#061523; --topbar-bg:#010710;
--border:rgba(94,214,255,0.30);
--primary:#5ed6ff; --accent:#7dffd4; --warn:#ffc247; --danger:#ff5f7e;
--text:#d6f2ff; --muted:#6fa3bd;
--text-soft:rgba(214,242,255,0.76); --placeholder:rgba(94,214,255,0.25);
--diff-sep:rgba(94,214,255,0.08);
--row-even:rgba(94,214,255,0.045); --row-hover:rgba(94,214,255,0.11); --input-bg:rgba(94,214,255,0.07);
}
/* Arka plan: ince ızgara + merkezden ark reaktörü aydınlanması.
::before KATMANI DEĞİL, doğrudan body zemini — böylece yapısal olarak
tüm içeriğin ALTINDA kalır; hiçbir öğeyi gölgeleme/tıklama riski yok. */
body[data-theme="jarvis"]{
background-image:
radial-gradient(circle at 50% 38%, rgba(94,214,255,0.10), transparent 62%),
linear-gradient(rgba(94,214,255,0.045) 1px, transparent 1px),
linear-gradient(90deg, rgba(94,214,255,0.045) 1px, transparent 1px);
background-size:100% 100%, 100% 34px, 34px 100%;
background-attachment:fixed;
}
body[data-theme="jarvis"] .topbar-brand{ text-shadow:0 0 10px rgba(94,214,255,0.85), 0 0 22px rgba(94,214,255,0.35); }
body[data-theme="jarvis"] .kpi-val,
body[data-theme="jarvis"] .ap-ico,
body[data-theme="jarvis"] .ai-kan-col-title,
body[data-theme="jarvis"] .pgl-model{ text-shadow:0 0 8px rgba(94,214,255,0.5); }
body[data-theme="jarvis"] .btn-primary{
box-shadow:0 0 14px rgba(94,214,255,0.45), inset 0 0 12px rgba(94,214,255,0.18);
border-color:rgba(94,214,255,0.6) !important;
}
body[data-theme="jarvis"] .btn-primary:hover{ box-shadow:0 0 22px rgba(94,214,255,0.75); }
body[data-theme="jarvis"] .kpi-card:hover,
body[data-theme="jarvis"] .ai-kan-card:hover,
body[data-theme="jarvis"] .pgl-card:hover{ box-shadow:0 0 16px rgba(94,214,255,0.32); }
/* Panel köşelerinde HUD ayracı — modal/kart üst kenarına ince tarama çizgisi */
body[data-theme="jarvis"] .modal-overlay > div,
body[data-theme="jarvis"] .kpi-card{ position:relative; }
body[data-theme="jarvis"] .modal-overlay > div::after{
content:''; position:absolute; left:14px; right:14px; top:0; height:1px; pointer-events:none;
background:linear-gradient(90deg, transparent, rgba(94,214,255,0.75), transparent);
}
/* ── JARVIS: ÇERÇEVESİZ ARAYÜZ ──────────────────────────────────────────
Kutucuk/tuş/panel kenar çizgileri YALNIZ Jarvis temasında kaldırılır;
başka hiçbir tema etkilenmez. Çoğu kenar satır-içi style ile yazıldığı
için (topbar düğmeleri, nabız çipi, asistan paneli) !important şart.
Ayırt edicilik zeminden ve parıltıdan gelir — hover'da arka plan koyulur. */
body[data-theme="jarvis"] .topbar,
body[data-theme="jarvis"] .topbar-badge,
body[data-theme="jarvis"] .topbar-user,
body[data-theme="jarvis"] .topbar-user:hover,
body[data-theme="jarvis"] .topbar-icon-btn,
body[data-theme="jarvis"] .topbar-icon-btn:hover,
body[data-theme="jarvis"] .topbar-icon-btn.active,
body[data-theme="jarvis"] .topbar-logo-img,
body[data-theme="jarvis"] .topbar-logout,
body[data-theme="jarvis"] .tnav-btn,
body[data-theme="jarvis"] .tnav-pdf,
body[data-theme="jarvis"] #mailNabiz,
body[data-theme="jarvis"] #navGeriBtn,
body[data-theme="jarvis"] #navIleriBtn,
body[data-theme="jarvis"] #asistanTopDurum{ border:none !important; }
/* Çerçeve gidince hover geri bildirimi kalmıyordu — zemin vurgusu eklenir */
body[data-theme="jarvis"] .topbar-icon-btn:hover,
body[data-theme="jarvis"] .topbar-user:hover,
body[data-theme="jarvis"] .tnav-btn:hover,
body[data-theme="jarvis"] #mailNabiz:hover{ background:rgba(94,214,255,0.13) !important; }
body[data-theme="jarvis"] .topbar-icon-btn.active{ background:rgba(94,214,255,0.16) !important; }
/* Topbar'daki 1px dikey ayraç çizgileri (ikonlar/kullanıcı arası) */
body[data-theme="jarvis"] .topbar-right > div[style*="width:1px"],
body[data-theme="jarvis"] #topbarUser > span[style*="width:1px"]{ display:none !important; }
/* Modül kutucukları (Ana Panel) — hover'da çerçeve yerine zemin vurgusu */
body[data-theme="jarvis"] .ap-tile,
body[data-theme="jarvis"] .ap-mini-tile{ border:none !important; }
body[data-theme="jarvis"] .ap-tile:hover,
body[data-theme="jarvis"] .ap-mini-tile:hover{ background:rgba(94,214,255,0.14) !important; }
/* Sohbet kutusu (GM Asistanı paneli) — dış çerçeve + başlık/alt ayraçları */
body[data-theme="jarvis"] #asistanPanel,
body[data-theme="jarvis"] #asistanPanel > div,
body[data-theme="jarvis"] #asistanPanel button,
body[data-theme="jarvis"] #asistanInput,
body[data-theme="jarvis"] .as-hizli-btn,
body[data-theme="jarvis"] .as-act,
body[data-theme="jarvis"] .as-form,
body[data-theme="jarvis"] .as-form-hdr,
body[data-theme="jarvis"] .as-row,
body[data-theme="jarvis"] .as-kural-oner{ border:none !important; }
/* Ekran altındaki tuşlar (modal/ekran alt şeridi) */
body[data-theme="jarvis"] .btn,
body[data-theme="jarvis"] .btn-primary,
body[data-theme="jarvis"] .btn-success,
body[data-theme="jarvis"] .btn-warn,
body[data-theme="jarvis"] .btn-danger,
body[data-theme="jarvis"] .btn-xs{ border:none !important; }
/* ── JARVIS KOMUTA MERKEZİ — Ana Panel'in alternatif düzeni ──────────────
YALNIZ Ana Panel'i etkiler. Modül tuşları klasik panelle AYNI fonksiyonları
çağırır; hiçbir iş ekranı değişmez. Tema Klasik'e alınınca panel de eski
hâline döner (jp-* sınıfları başka hiçbir yerde kullanılmaz). */
.jp-wrap{width:100%;height:100%;display:flex;gap:clamp(14px,2.2vw,34px);padding:clamp(10px,2vh,26px) clamp(14px,2.5vw,34px);box-sizing:border-box;overflow:auto;align-items:stretch;}
.jp-left{flex:0 0 clamp(230px,26vw,340px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;}
.jp-reactor{position:relative;width:clamp(180px,20vw,260px);aspect-ratio:1;display:grid;place-items:center;}
.jp-ring{position:absolute;inset:0;border-radius:50%;border:1px solid rgba(94,214,255,.35);}
.jp-ring.r2{inset:9%;border-style:dashed;border-color:rgba(94,214,255,.45);animation:jpSpin 18s linear infinite;}
.jp-ring.r3{inset:19%;border-color:rgba(125,255,212,.4);border-top-color:transparent;border-bottom-color:transparent;animation:jpSpin 9s linear infinite reverse;}
.jp-ring.r4{inset:29%;border-color:rgba(94,214,255,.25);box-shadow:0 0 26px rgba(94,214,255,.35) inset;}
@keyframes jpSpin{to{transform:rotate(360deg);}}
@keyframes jpPulse{0%,100%{opacity:.75;}50%{opacity:1;}}
.jp-core{position:relative;z-index:2;text-align:center;animation:jpPulse 3.4s ease-in-out infinite;}
.jp-core .n{font-size:clamp(26px,3.4vw,44px);font-weight:800;color:#5ed6ff;text-shadow:0 0 16px rgba(94,214,255,.75);line-height:1;}
.jp-core .l{font-size:10.5px;letter-spacing:1.6px;color:#6fa3bd;text-transform:uppercase;margin-top:5px;}
.jp-brand{font-size:clamp(15px,1.8vw,20px);font-weight:800;letter-spacing:2px;color:#d6f2ff;text-shadow:0 0 12px rgba(94,214,255,.6);}
.jp-brand small{display:block;font-size:9.5px;letter-spacing:2.4px;color:#6fa3bd;font-weight:600;margin-top:3px;}
.jp-logo{max-height:64px;max-width:180px;object-fit:contain;filter:drop-shadow(0 0 10px rgba(94,214,255,.5));}
.jp-stats{display:flex;flex-direction:column;gap:7px;width:100%;}
.jp-stat{display:flex;align-items:center;gap:9px;font-size:11.5px;padding:7px 11px;
border-radius:8px;background:rgba(94,214,255,.06);color:#d6f2ff;}
.jp-stat b{margin-left:auto;font-size:14px;color:#7dffd4;text-shadow:0 0 8px rgba(125,255,212,.5);}
.jp-right{flex:1;min-width:0;display:flex;flex-direction:column;gap:clamp(9px,1.5vh,16px);}
.jp-sec-h{font-size:10px;letter-spacing:2.2px;text-transform:uppercase;color:#6fa3bd;display:flex;align-items:center;gap:9px;margin-bottom:6px;}
.jp-sec-h::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,rgba(94,214,255,.45),transparent);}
.jp-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(clamp(118px,13vw,152px),1fr));gap:9px;}
.jp-tile{position:relative;cursor:pointer;padding:12px 11px;background:rgba(94,214,255,.05);
clip-path:polygon(9px 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%,0 9px);
transition:background .16s,box-shadow .16s,transform .16s;}
.jp-tile:hover{background:rgba(94,214,255,.14);box-shadow:0 0 18px rgba(94,214,255,.4);transform:translateY(-2px);}
.jp-tile .i{font-size:19px;line-height:1;}
.jp-tile .t{margin-top:7px;font-size:11.5px;font-weight:700;color:#d6f2ff;line-height:1.3;}
.jp-tile .o{margin-top:3px;font-size:10px;color:#7dffd4;}
.jp-mini{display:flex;flex-wrap:wrap;gap:7px;}
.jp-mini .m{cursor:pointer;font-size:11px;padding:6px 11px;border-radius:20px;
color:#a9d8ee;background:rgba(94,214,255,.05);transition:background .16s,box-shadow .16s;}
.jp-mini .m:hover{background:rgba(94,214,255,.15);box-shadow:0 0 12px rgba(94,214,255,.35);color:#d6f2ff;}
/* Tarama çizgisi — üstten aşağı süzülen ince ışık */
.jp-scan{position:absolute;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(94,214,255,.55),transparent);
animation:jpScan 7s linear infinite;pointer-events:none;}
@keyframes jpScan{0%{top:0;opacity:0;}8%{opacity:1;}92%{opacity:1;}100%{top:100%;opacity:0;}}
@media (max-width:820px){ .jp-wrap{flex-direction:column;} .jp-left{flex:none;} }
@media (prefers-reduced-motion:reduce){ .jp-ring.r2,.jp-ring.r3,.jp-core,.jp-scan{animation:none;} }
/* ── JARVIS YÖRÜNGE DÜZENİ — halka MERKEZDE, modüller ÇEVRESİNDE ────────
Sahne: ortada ark reaktörü (çentikli halka + dönen yay parçaları + çekirdek),
çevresinde ses seviyesi çubukları, en dışta modüller yörüngede.
Dar ekranda (≤980px veya alçak pencerede) yörünge otomatik olarak normal
ızgaraya döner — hiçbir şey ekran dışına taşmaz. */
.jr-stage{position:relative;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;
gap:10px;padding:10px 14px;box-sizing:border-box;overflow:hidden;}
.jr-stage > *{position:relative;z-index:1;} /* içerik dalgaların üstünde */
/* — Arka fon: RADAR (merkez reaktörden yayılan) —
Yatay sinüs dalgaları dairesel kompozisyonla kavga ediyordu; radyal desen
merkezi DESTEKLER: reaktör = radar merkezi, yörüngedeki modüller = temas.
Hepsi CSS (conic/radial gradient + transform) — canvas/JS döngüsü YOK. */
.jr-radar{position:absolute;left:50%;top:50%;width:150%;aspect-ratio:1;transform:translate(-50%,-50%);
z-index:0;pointer-events:none;border-radius:50%;overflow:hidden;}
/* Menzil halkaları + ışınsal kılavuz çizgiler (çok silik) */
.jr-radar::before{content:'';position:absolute;inset:0;border-radius:50%;
background:
repeating-radial-gradient(circle at 50% 50%, transparent 0 58px, rgba(94,214,255,.075) 58px 59px),
repeating-conic-gradient(from 0deg at 50% 50%, rgba(94,214,255,.055) 0 .35deg, transparent .35deg 15deg);
-webkit-mask:radial-gradient(circle at 50% 50%, #000 30%, transparent 72%);
mask:radial-gradient(circle at 50% 50%, #000 30%, transparent 72%);}
/* Süpürme ışını */
.jr-radar::after{content:'';position:absolute;inset:0;border-radius:50%;
background:conic-gradient(from 0deg at 50% 50%, rgba(94,214,255,.22), rgba(94,214,255,.07) 18deg, transparent 46deg);
-webkit-mask:radial-gradient(circle at 50% 50%, transparent 12%, #000 30%, transparent 70%);
mask:radial-gradient(circle at 50% 50%, transparent 12%, #000 30%, transparent 70%);
animation:jrSupur 8s linear infinite;}
@keyframes jrSupur{to{transform:rotate(360deg);}}
/* Sonar halkası — merkezden dışa doğru genişleyip sönen dalga */
.jr-ping{position:absolute;left:50%;top:50%;width:34%;aspect-ratio:1;border-radius:50%;
border:1px solid rgba(125,255,212,.4);transform:translate(-50%,-50%) scale(.2);
z-index:0;pointer-events:none;opacity:0;animation:jrPing 8s ease-out infinite;}
.jr-ping.p2{animation-delay:2.7s;border-color:rgba(94,214,255,.35);}
.jr-ping.p3{animation-delay:5.4s;border-color:rgba(94,214,255,.25);}
@keyframes jrPing{
0%{transform:translate(-50%,-50%) scale(.22);opacity:.55;}
70%{opacity:.14;}
100%{transform:translate(-50%,-50%) scale(2.6);opacity:0;}}
/* Işın modülün üzerinden geçerken kısa parlama — gecikme açıya göre JS'te verilir.
box-shadow YERİNE filter kullanılır: hover'ın kendi box-shadow'unu ezmesin. */
.jr-item{animation:jrTemas 8s linear infinite;animation-delay:var(--d,0s);}
/* Parlama döngünün BAŞINDA: gecikme formülü (kesir*T − T) tam bu ana denk
gelir, böylece ışının kutuya değdiği an ile parlama birebir çakışır. */
@keyframes jrTemas{
0%{filter:drop-shadow(0 0 10px var(--c,#5ed6ff)) brightness(1.4);}
9%{filter:none;}
100%{filter:none;}}
/* Yörünge kalan alana göre büyür/küçülür — konsol genişleyince daralır */
/* --jr-cekirdek: reaktörün DIŞ ÇAPI. Tek kaynaktan gelir çünkü çekirdeğin
boyu üç ayrı yeri birden belirler: küre kabı, parçacık yörüngesi ve
nöral ağın orta boşluğu. Ayrı ayrı yazılsaydı biri değişince diğerleri
kayar, sinir uçları çekirdeğin üstüne biner. */
.jr-orbit{position:relative;flex:1 1 0;min-width:0;width:auto;max-width:min(100%,760px);
aspect-ratio:1;max-height:100%;display:grid;place-items:center;margin:0 auto;
--jr-cekirdek:clamp(150px,26vmin,240px);}
/* — Merkez reaktör — */
.jr-core-wrap{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
width:var(--jr-cekirdek);aspect-ratio:1;display:grid;place-items:center;}
.jr-r{position:absolute;inset:0;border-radius:50%;}
/* Çentikli dış halka (resimdeki tırtıklı kadran) */
.jr-ticks{background:repeating-conic-gradient(from 0deg,rgba(94,214,255,.75) 0 .8deg,transparent .8deg 4.5deg);
-webkit-mask:radial-gradient(circle,transparent 0 45%,#000 45% 50%,transparent 50%);
mask:radial-gradient(circle,transparent 0 45%,#000 45% 50%,transparent 50%);
animation:jrSpin 46s linear infinite;}
/* Kesik yay parçaları */
.jr-arc1{inset:9%;border:2px solid transparent;border-top-color:#5ed6ff;border-right-color:#5ed6ff;
box-shadow:0 0 16px rgba(94,214,255,.45);animation:jrSpin 11s linear infinite;}
.jr-arc2{inset:17%;border:1.5px solid transparent;border-bottom-color:#7dffd4;border-left-color:rgba(125,255,212,.5);
animation:jrSpin 7s linear infinite reverse;}
.jr-arc3{inset:25%;border:1px dashed rgba(94,214,255,.45);animation:jrSpin 24s linear infinite;}
/* Parlayan çekirdek küre — DÜŞÜNEN ÇEKİRDEK: çift atımlı nabız (kalp gibi
"tık-tık … bekle") + içinde dönen plazma akıntıları. Küre statik bir top
değil, işlem yapan canlı bir organ gibi görünsün. */
/* HALE — küreyi saran yumuşak ışık bulutu. TÜM düzenlerde geçerli: çekirdek
işaretlemesinin parçası olduğu için yörünge/nöral/HUD hepsinde çıkar.
Nefes alır (ölçek+opaklık) ve dinleme modunda nane yeşiline döner. */
.jr-hale{position:absolute;left:50%;top:50%;width:235%;aspect-ratio:1;border-radius:50%;
transform:translate(-50%,-50%);pointer-events:none;z-index:0;filter:blur(7px);
background:radial-gradient(circle,rgba(94,214,255,.30) 0%,rgba(94,214,255,.13) 30%,
rgba(94,214,255,.045) 48%,transparent 66%);
animation:jrHale 4.6s ease-in-out infinite;}
@keyframes jrHale{
0%,100%{opacity:.72;transform:translate(-50%,-50%) scale(1);}
50%{opacity:1;transform:translate(-50%,-50%) scale(1.075);}}
.jr-core-wrap:hover .jr-hale{opacity:1;filter:blur(9px);}
.jr-core-wrap.on .jr-hale{
background:radial-gradient(circle,rgba(125,255,212,.34) 0%,rgba(125,255,212,.15) 30%,
rgba(125,255,212,.05) 48%,transparent 66%);
animation-duration:2.2s;}
/* Küresellik: dış parıltı + İÇ gölge (alt-sağ karanlık, üst-sol ışık) —
düz daireyi hacimli bir küreye çeviren şey bu iki inset gölge. */
.jr-glow{inset:33%;background:radial-gradient(circle at 50% 42%,#eafcff 0%,#7fe6ff 22%,#1b9fd6 55%,#063b56 78%,transparent 88%);
box-shadow:0 0 42px rgba(94,214,255,.75),0 0 90px rgba(94,214,255,.35),
inset -7px -9px 24px rgba(0,16,32,.85),
inset 5px 6px 18px rgba(200,248,255,.32);
animation:jrKalp 3.2s ease-in-out infinite;overflow:hidden;}
/* Parlama noktası (spekülar) — ışık kaynağını ele veren küçük ak leke */
.jr-spek{position:absolute;left:24%;top:17%;width:28%;height:21%;border-radius:50%;pointer-events:none;
background:radial-gradient(ellipse at 50% 50%,rgba(255,255,255,.92),rgba(255,255,255,0) 70%);
filter:blur(1.2px);z-index:2;}
/* Küre ızgarası + iç sinir lifleri (SVG, küreye kırpılır) */
.jr-kure{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1;
mix-blend-mode:screen;}
.jr-kure ellipse{fill:none;stroke:rgba(200,248,255,.3);stroke-width:.7;vector-effect:non-scaling-stroke;}
/* Boylamlar yatayda ezilip açılır → küre dönüyormuş yanılsaması (gerçek 3B yok,
maliyeti sıfır). Üç boylam farklı fazda: sürekli dönen bir tel küre gibi. */
.jr-boylamlar ellipse{transform-box:view-box;transform-origin:50% 50%;
animation:jrBoylam 7.2s ease-in-out infinite;}
.jr-boylamlar .m2{animation-delay:-2.4s;}
.jr-boylamlar .m3{animation-delay:-4.8s;}
@keyframes jrBoylam{0%,100%{transform:scaleX(1);}50%{transform:scaleX(.05);}}
/* Sinir lifleri: kürenin İÇİNDE yürüyen ışık darbeleri */
.jr-lifler path{fill:none;stroke:#eafcff;stroke-width:1;opacity:.8;stroke-linecap:round;
vector-effect:non-scaling-stroke;stroke-dasharray:5 27;
filter:drop-shadow(0 0 2px #7fe6ff);animation:jrLif 3.4s linear infinite;}
.jr-lifler path:nth-child(2){stroke:#a8ffe3;animation-duration:4.7s;animation-delay:-1.3s;}
.jr-lifler path:nth-child(3){animation-duration:2.9s;animation-delay:-2.2s;}
.jr-lifler path:nth-child(4){stroke:#a8ffe3;animation-duration:5.6s;animation-delay:-0.7s;}
@keyframes jrLif{to{stroke-dashoffset:-32;}}
/* İç plazma girdapları: iki zıt yönlü, farklı hızda enerji akıntısı */
.jr-glow::before{content:'';position:absolute;inset:-4%;border-radius:50%;
background:conic-gradient(from 0deg,transparent 0 38deg,rgba(234,252,255,.34) 62deg,transparent 98deg,
transparent 178deg,rgba(125,255,212,.22) 214deg,transparent 258deg);
mix-blend-mode:screen;animation:jrSpin 6.5s linear infinite;}
.jr-glow::after{content:'';position:absolute;inset:8%;border-radius:50%;
background:conic-gradient(from 140deg,transparent 0 26deg,rgba(94,214,255,.4) 52deg,transparent 92deg);
mix-blend-mode:screen;animation:jrSpin 4.1s linear infinite reverse;}
@keyframes jrSpin{to{transform:rotate(360deg);}}
@keyframes jrPulse{0%,100%{opacity:.88;transform:scale(1);}50%{opacity:1;transform:scale(1.035);}}
/* Çift atım: %6 ve %18'de iki vuruş, sonra dinlenme — EKG ritmi */
@keyframes jrKalp{
0%,100%{opacity:.86;transform:scale(1);}
6%{opacity:1;transform:scale(1.055);}
12%{opacity:.9;transform:scale(1.01);}
18%{opacity:1;transform:scale(1.04);}
32%{opacity:.87;transform:scale(1);}}
/* Nöron sinyalleri: çekirdek çevresinde farklı yarıçap/hız/yönde dolaşan
ışıklı parçacıklar. --rk = yarıçap katsayısı, --boy dar ekranda küçülür. */
.jr-e{--boy:var(--jr-cekirdek,240px);position:absolute;left:50%;top:50%;width:4px;height:4px;
margin:-2px 0 0 -2px;border-radius:50%;background:#bdefff;pointer-events:none;z-index:2;
box-shadow:0 0 7px #5ed6ff,0 0 14px rgba(94,214,255,.55);opacity:.9;
animation:jrEDon var(--t,6s) linear infinite;animation-delay:var(--d,0s);animation-direction:var(--yon,normal);}
@keyframes jrEDon{
from{transform:rotate(0deg) translateX(calc(var(--boy)/2*var(--rk,.8)));}
to{transform:rotate(360deg) translateX(calc(var(--boy)/2*var(--rk,.8)));}}
/* Sinaps çakması: uzun aralıklarla bir an parlayan ince yay — nöron ateşlemesi */
.jr-flash{position:absolute;inset:14%;border-radius:50%;border:1.5px solid transparent;
pointer-events:none;transform:rotate(var(--a,0deg));
animation:jrFlash var(--t,7s) ease-out infinite;animation-delay:var(--d,0s);}
@keyframes jrFlash{
0%,86%{border-top-color:transparent;filter:none;}
89%{border-top-color:rgba(234,252,255,.95);filter:drop-shadow(0 0 7px #5ed6ff);}
100%{border-top-color:transparent;filter:none;}}
/* Çekirdek = sesli mod anahtarı: tıklanabilir, hover'da güçlenir,
dinlerken nane yeşiline döner (mikrofon düğmesiyle aynı renk dili). */
.jr-core-wrap{cursor:pointer;}
.jr-core-wrap:hover .jr-glow{box-shadow:0 0 58px rgba(94,214,255,.95),0 0 120px rgba(94,214,255,.5),
inset -7px -9px 24px rgba(0,16,32,.8), inset 5px 6px 18px rgba(200,248,255,.4);}
.jr-core-wrap.on .jr-glow{
background:radial-gradient(circle at 50% 42%,#eafff7 0%,#8cf5d8 22%,#1bbd96 55%,#064d3e 78%,transparent 88%);
box-shadow:0 0 48px rgba(125,255,212,.8),0 0 100px rgba(125,255,212,.4),
inset -7px -9px 24px rgba(0,28,20,.85), inset 5px 6px 18px rgba(215,255,240,.35);
animation-duration:1.6s;} /* dinlerken nabız hızlanır */
.jr-core-wrap.on .jr-lifler path{stroke:#d7fff0;}
/* ── LUU KİMLİĞİ — çekirdeğin üstündeki ad (+ isteğe bağlı gözler) ───────
Sabit değil, AYARLI: bütün ölçüler CSS değişkeni; değerleri
platform_kimlik/luu dokümanından _luuUygula() basar, tasarımı da
/logodesign.html aracı yapar. Kayıt yoksa LUU_VARSAYILAN geçerlidir —
çekirdek hiçbir koşulda adsız kalmaz.
Ark reaktörünün HİÇBİR katmanı kapatılmaz (dönen yaylar, plazma, nabız,
tel küre hepsi yerinde); ad z-index:3 ile onların üstünde durur.
Ad .jr-glow'un değil .jr-core-wrap'ın çocuğudur: glow'da overflow:hidden
var, "kürenin altı"/"reaktörün altı" yerleşimleri orada kırpılırdı. */
.jr-luu{position:absolute;left:50%;top:50%;z-index:3;pointer-events:none;
line-height:1;white-space:nowrap;color:var(--luu-renk,#04283c);
font-size:calc(var(--jr-cekirdek,240px) * var(--luu-boyut,.115));
font-weight:var(--luu-agirlik,700);letter-spacing:var(--luu-aralik,.02em);
font-family:var(--luu-font,inherit);
transform:translate(-50%,calc(-50% + var(--luu-y,0%)));}
.jr-core-wrap.on .jr-luu{color:var(--luu-renk-on,#043329);}
/* Çizim modu: font yerine logonun birebir SVG kopyası. Genişlik aynı
--luu-boyut'tan türer ki font↔çizim geçişinde ad zıplamasın (1.65 =
çizimin en/boy oranından gelen düzeltme). */
.jr-luu.cizim{width:calc(var(--jr-cekirdek,240px) * var(--luu-boyut,.115) * 1.65);}
.jr-luu.cizim svg{width:100%;height:auto;display:block;}
.jr-luu.cizim path{fill:none;stroke:currentColor;stroke-width:calc(var(--luu-cizgi,7) * var(--luu-cizgi-k,1));
stroke-linecap:round;stroke-linejoin:round;}
/* Yerleşim — yüzde marj kapsayıcının GENİŞLİĞİNE göre çözülür, yani
çekirdek çapına: reaktör küçülünce ad da orantılı yaklaşır. */
.jr-luu[data-yer="bant"],.jr-luu[data-yer="imza"]{
transform:translate(-50%,var(--luu-y,0%));}
.jr-luu[data-yer="bant"]{margin-top:18%;}
.jr-luu[data-yer="imza"]{margin-top:52%;}
/* Parıltı: koyu ad ak kürede ince ışık kenarı, açık ad koyu gölge ister */
.jr-luu[data-parilti="koyu"]{text-shadow:0 1px 0 rgba(240,253,255,.5);}
.jr-luu[data-parilti="isik"]{text-shadow:0 0 4px rgba(6,59,86,.95),0 0 9px rgba(94,214,255,.75);}
.jr-core-wrap.on .jr-luu[data-parilti="isik"]{text-shadow:0 0 4px rgba(4,45,35,.95),0 0 9px rgba(125,255,212,.75);}
.jr-luu.cizim[data-parilti]{text-shadow:none;}
.jr-luu.cizim[data-parilti="koyu"] path{filter:drop-shadow(0 1px 0 rgba(240,253,255,.45));}
.jr-luu.cizim[data-parilti="isik"] path{filter:drop-shadow(0 0 3px rgba(6,59,86,.95));}
/* Gözler — isteğe bağlı, küre uzayında (viewBox 0-100) çizilir */
.jr-goz{position:absolute;inset:0;width:100%;height:100%;z-index:3;pointer-events:none;}
.jr-goz path{fill:none;stroke:var(--luu-renk,#04283c);stroke-linecap:round;
stroke-width:calc(var(--luu-goz-cizgi,8) * var(--luu-cizgi-k,1));}
.jr-core-wrap.on .jr-goz path{stroke:var(--luu-renk-on,#043329);}
/* ══ LUU ↔ GÖZ DÖNGÜSÜ ══════════════════════════════════════════════
Ad bir süre durur, aşağı kayıp kaybolur, yerine gözler iner ve kırpar,
sonra ad geri döner. Ark reaktörünün HİÇBİR katmanı kapatılmaz.
Sahne .jr-glow'un İÇİNDE: glow'da overflow:hidden var, yani ad da
gözler de küre kenarında KIRPILIR — yazı kenarın altına inip yok olur.
Tambur hissi buradan gelir, opaklıkla sönmekten çok daha inandırıcı.
Ad öğesi (#jrLuu) döngü açıkken .lb-ad'ın içine TAŞINIR (_luuUygula);
kapalıyken eski yerinde, .jr-core-wrap'ın çocuğu olarak kalır. */
.lb-sahne{position:absolute;inset:0;z-index:3;pointer-events:none;}
.lb-ad,.lb-goz{position:absolute;inset:0;width:100%;height:100%;
transition:transform var(--lb-gecis,420ms) var(--lb-eg,cubic-bezier(.4,0,.2,1)),
opacity var(--lb-gecis,420ms) linear;}
.lb-goz rect,.lb-goz path{fill:var(--luu-renk,#04283c);stroke:none;
filter:drop-shadow(0 1px 0 rgba(240,253,255,.45));}
.lb-goz .bebek{fill:#eafcff;}
/* Yay biçimi logonun çizgi dilinde: dolgu değil kontur */
.lb-goz path.ciz{fill:none;stroke:var(--luu-renk,#04283c);
stroke-width:calc(var(--luu-cizgi,7) * var(--luu-cizgi-k,1));stroke-linecap:round;vector-effect:non-scaling-stroke;}
.jr-core-wrap.on .lb-goz rect,.jr-core-wrap.on .lb-goz path{fill:var(--luu-renk-on,#043329);}
.jr-core-wrap.on .lb-goz path.ciz{fill:none;stroke:var(--luu-renk-on,#043329);}
/* Sahne dışı konumlar — --lb-mesafe kürenin YÜZDESİ: küre küçülünce yol da kısalır */
.lb-ad { transform:translateY(0); opacity:1; }
.lb-goz{ transform:translateY(calc(-1 * var(--lb-mesafe,55%))); opacity:0; }
.lb-sahne[data-faz="goz"] .lb-ad { transform:translateY(var(--lb-mesafe,55%)); opacity:0; }
.lb-sahne[data-faz="goz"] .lb-goz{ transform:translateY(0); opacity:1; }
/* Dönüş: gözler aşağı çıkar, ad üstten iner — tambur hep aynı yönde döner.
Ad transition'sız tepeye alınır (görünmez), sonra 'ad' fazında süzülür. */
.lb-sahne[data-faz="donus"] .lb-ad { transform:translateY(calc(-1 * var(--lb-mesafe,55%)));
opacity:0;transition:none; }
.lb-sahne[data-faz="donus"] .lb-goz{ transform:translateY(var(--lb-mesafe,55%)); opacity:0; }
/* Beliriş: gözler kaymadan yerinde büyüyerek gelir (en sakin) */
.lb-sahne[data-hareket="belirir"] .lb-goz{transform:scale(.78);opacity:0;
transform-box:fill-box;transform-origin:50% 50%;}
.lb-sahne[data-hareket="belirir"][data-faz="goz"] .lb-goz{transform:scale(1);opacity:1;}
.lb-sahne[data-hareket="belirir"][data-faz="donus"] .lb-ad{transform:translateY(0);
opacity:0;transition:none;}
.lb-sahne[data-hareket="belirir"][data-faz="donus"] .lb-goz{transform:scale(.78);opacity:0;}
/* Yerçekimi: ad hızlanarak düşer, gözler yaylanarak oturur (en oyuncu) */
.lb-sahne[data-hareket="yercekimi"] .lb-ad{--lb-eg:cubic-bezier(.55,0,.9,.25);}
.lb-sahne[data-hareket="yercekimi"] .lb-goz{--lb-eg:cubic-bezier(.34,1.5,.64,1);}
/* Blink: göz grubu KENDİ merkezinde dikeyde ezilir (transform-box:fill-box).
non-scaling-stroke sayesinde çizgi kalınlığı ezilmede bozulmaz. */
.lb-goz g{transform-box:fill-box;transform-origin:50% 50%;
transition:transform var(--lb-blink,130ms) cubic-bezier(.4,0,.6,1);}
.lb-goz.kirp g{transform:scaleY(.06);}
/* Döngü açıkken ad, sahnenin içindeki kaba göre ortalanır — .lb-ad kutusu
küreyle aynı olduğu için görünen yer DEĞİŞMEZ. */
.lb-ad .jr-luu{left:50%;top:50%;}
/* Arka katman sönümü: adın arkasına düşen tel küre ve parlama geri
çekilebilir. Varsayılan 1 = hiç dokunma; katman KAPATILMAZ, döner. */
.jr-kure,.jr-spek{opacity:var(--luu-sonum,1);}
@keyframes jrImlec{50%{opacity:0;}}
/* — Ses seviyesi çubukları (mikrofon) — halkanın hemen dışında ışın gibi — */
.jr-bars{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
width:clamp(190px,33vmin,300px);aspect-ratio:1;pointer-events:none;}
.jr-bar{position:absolute;left:50%;top:50%;width:2px;height:8px;margin-left:-1px;border-radius:2px;
background:linear-gradient(180deg,#7dffd4,#5ed6ff);transform-origin:50% 0;opacity:.85;
transform:rotate(var(--a)) translateY(calc(clamp(190px,33vmin,300px)/2 - 4px)) scaleY(var(--s,1));
transition:transform .07s linear;}
/* — Yörüngedeki modüller — */
/* Önce merkeze oturt (translate -50%), SONRA yörüngeye taşı — böylece kutu
yüksekliği (1 veya 2 satır metin) yarıçapı kaydırmaz, hepsi eşit uzaklıkta. */
/* Uydu kutuları büyütüldü. Genişlik artınca YARIÇAP da artmalı: yörünge
çevresi 2πr olduğundan 16 kutu ancak orantılı büyüyen halkaya sığar
(yarıçap sabit kalsaydı komşu kutular üst üste binerdi). */
/* Ölçü birimi cqmin: yarıçap/genişlik EKRANA değil YÖRÜNGE KUTUSUNA göre
ölçeklenir. vmin kullanılınca konsol yanda yer kaptığı için kutu küçülüp
halka aynı kalıyor ve uydular alanın dışına taşıyordu (9 kutu ölçüldü). */
.jr-orbit[data-duzen="yorunge"],.jr-orbit[data-duzen="noral"]{container-type:size;}
.jr-item{position:absolute;left:50%;top:50%;width:clamp(76px,15cqmin,108px);
transform:translate(-50%,-50%) rotate(var(--a)) translateY(calc(-1*var(--r))) rotate(calc(-1*var(--a)));
display:flex;flex-direction:column;align-items:center;gap:3px;cursor:pointer;text-align:center;
padding:7px 4px;background:rgba(3,18,30,.72);
clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);
transition:background .16s,box-shadow .16s;}
.jr-item:hover{background:color-mix(in srgb, var(--c,#5ed6ff) 22%, transparent);
box-shadow:0 0 20px color-mix(in srgb, var(--c,#5ed6ff) 60%, transparent);}
.jr-item .i{font-size:20px;line-height:1;}
.jr-item .t{font-size:10.6px;font-weight:700;color:#d6f2ff;line-height:1.22;}
/* — Alt araç şeridi + mikrofon düğmesi — */
.jr-tools{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;align-items:center;flex-shrink:0;}
.jr-tools .m{cursor:pointer;font-size:10.5px;padding:5px 10px;border-radius:20px;
color:#a9d8ee;background:rgba(94,214,255,.05);}
.jr-tools .m:hover{background:rgba(94,214,255,.15);color:#d6f2ff;}
.jr-mic{cursor:pointer;font-size:10.5px;padding:5px 12px;border-radius:20px;border:none;
background:rgba(125,255,212,.08);color:#7dffd4;font-weight:700;}
.jr-mic.on{background:rgba(125,255,212,.22);box-shadow:0 0 14px rgba(125,255,212,.5);}
.jr-hint{font-size:10px;color:#6fa3bd;text-align:center;}
/* — Sağdaki AI konsolu — */
.jr-main{display:flex;gap:clamp(10px,1.6vw,22px);align-items:center;justify-content:center;width:100%;flex:1;min-height:0;}
/* Konsol yandaki boşluğa göre esner: dar pencerede küçülür, geniş pencerede
büyür; ama hiçbir zaman yörüngeyi ezmez (flex-shrink serbest, taban 300px). */
/* ── LOG AKIŞI — sohbet kutusunun yerine geçen HUD telemetri şeridi ─────
Panel/çerçeve YOK: satırlar boşlukta durur. Yeni satır ALTTAN girer,
eskiler yukarı kayar, üstte taşan kırpılır (overflow:hidden + alta
hizalı flex). Böylece "silinerek üstten kaybolma" doğal olarak olur. */
.jr-log{flex:1 1 320px;min-width:230px;max-width:min(46%,460px);align-self:stretch;
display:flex;flex-direction:column;justify-content:flex-end;gap:5px;
padding:0 12px 6px;min-height:0;overflow:hidden;
font-family:'Consolas','SF Mono',ui-monospace,'Courier New',monospace;
pointer-events:none;} /* bilgi satırları tıklamayı YUTMAZ:
geniş halkalı düzenlerde altta kalan modül düğümü tıklanabilir kalır */
.jr-log-giris,.jr-log-satir a,.jr-log-satir button{pointer-events:auto;}
.jr-log-akis{display:flex;flex-direction:column;gap:5px;min-height:0;}
.jr-log-satir{font-size:11px;line-height:1.5;color:#7dffd4;
text-shadow:0 0 8px rgba(125,255,212,.35);animation:jrLogGir .3s ease-out;}
@keyframes jrLogGir{from{opacity:0;transform:translateY(7px);}to{opacity:1;transform:none;}}
/* Kademeli silikleşme JS'ten satır içi opaklıkla verilir; geçişler burada.
max-height/margin de sönerek kapanır, yoksa satır kaybolurken altındakiler
bir anda zıplardı (max-height'ın geçiş yapabilmesi için başlangıç şart). */
.jr-log-satir{max-height:200px;
transition:opacity .55s linear,filter .55s linear,transform .6s ease-in,
max-height .6s ease-in,margin-top .6s ease-in;}
.jr-log-satir.solan{pointer-events:none;overflow:hidden;}
.jr-log-satir.t{color:rgba(125,255,212,.42);} /* telemetri: sönük */
.jr-log-satir.u{color:#ffc247;} /* kullanıcı komutu */
.jr-log-satir.u::before{content:'› ';opacity:.65;}
.jr-log-satir.a{color:#d6f2ff;text-shadow:0 0 8px rgba(94,214,255,.3);}
.jr-log-satir.s{color:#6fa3bd;text-shadow:none;font-size:10.5px;}
/* Komut cevapları (2026-08-22): radar düğümleri sağ sütuna taşabildiği için kullanıcı
sorusu ve Luu cevabı OKUNUR BİR KART içinde; uzun cevap 46vh'de kaydırılır. Sütun
düğümlerin ÜSTÜNDE durur (z-index), kart dışı alan tıklamayı yine yutmaz. */
.jr-log{position:relative;z-index:3;}
.jr-log-satir.u,.jr-log-satir.a{pointer-events:auto;background:rgba(6,12,24,.86);
border:1px solid rgba(94,214,255,.18);border-radius:9px;padding:7px 10px;
backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);text-shadow:none;
box-shadow:0 4px 18px rgba(0,0,0,.35);}
.jr-log-satir.a{max-height:46vh;overflow:auto;scrollbar-width:thin;}
.jr-log-satir.u{background:rgba(40,28,6,.82);border-color:rgba(255,194,71,.28);}
.jr-cevap-aksiyon{margin-top:8px;padding-top:7px;border-top:1px dashed rgba(94,214,255,.22);display:flex;flex-wrap:wrap;gap:5px;align-items:center;font-family:'Segoe UI',system-ui,sans-serif;}
.jr-cevap-aksiyon .jr-ca-adres{font-size:10.5px;color:#7dffd4;margin-right:3px;}
.jr-cevap-aksiyon .btn{pointer-events:auto;}
.jr-log-satir table{width:100%;border-collapse:collapse;margin:4px 0;font-size:10px;}
.jr-log-satir th{color:#eafcff;font-weight:700;text-align:left;padding:2px 5px;
background:rgba(94,214,255,.14);white-space:nowrap;}
.jr-log-satir td{padding:2px 5px;color:#c8e8f7;}
.jr-log-satir code{color:#7dffd4;}
.jr-log-satir b{color:#eafcff;}
/* Etkin satır: yazılmakta olan düşünce YA DA durum ("Dinliyor") — imleç burada */
.jr-log-aktif{font-size:11px;line-height:1.5;min-height:17px;color:#7dffd4;
text-shadow:0 0 9px rgba(125,255,212,.45);}
.jr-log-aktif.dinle{color:#ffc247;text-shadow:0 0 9px rgba(255,194,71,.5);}
.jr-log-aktif.dusun{color:#5ed6ff;text-shadow:0 0 9px rgba(94,214,255,.5);}
.jr-log-aktif .im{animation:jrImlec 1s steps(1) infinite;}
/* Komut satırı: kutu değil, düz terminal istemi */
.jr-log-giris{display:flex;align-items:center;gap:7px;flex-shrink:0;}
.jr-log-giris .ok{color:#7dffd4;font-size:12px;font-weight:700;text-shadow:0 0 8px rgba(125,255,212,.6);}
.jr-k-inp{flex:1;min-width:0;background:transparent;border:none;outline:none;color:#d6f2ff;
font-size:11.5px;padding:4px 0;font-family:inherit;}
.jr-k-inp::placeholder{color:rgba(125,255,212,.32);}
.jr-ptt{background:transparent;border:none;color:#7dffd4;font-size:13px;cursor:pointer;
padding:2px 4px;opacity:.75;transition:opacity .15s,text-shadow .15s;}
.jr-ptt:hover,.jr-ptt.on{opacity:1;text-shadow:0 0 10px #7dffd4;}
/* Onaylı komut düğmeleri (log satırı içinde) */
.jr-k-btn{cursor:pointer;background:rgba(94,214,255,.16);border:none;color:#d6f2ff;
font-size:12px;padding:3px 11px;font-family:inherit;}
.jr-k-btn:hover{background:rgba(94,214,255,.3);}
/* ══ ARAYÜZ DÜZENLERİ ═══════════════════════════════════════════════════
Modül alanı: çekirdeğin ÜSTÜNDE duran ama tıklamayı GEÇİREN katman
(pointer-events:none) — yalnız modül öğeleri tıklanabilir; böylece
ortadaki reaktörün sesli-mod anahtarı her düzende erişilebilir kalır. */
.jr-modul-alan{position:absolute;inset:0;z-index:2;pointer-events:none;}
.jr-modul-alan > *{pointer-events:auto;}
.jr-modul-alan svg{pointer-events:none;} /* hatlar tıklamayı yutmasın */
.jr-modul-alan svg path[onclick]{pointer-events:auto;}
/* Akıllı rozet: işi olan modül sayı + parıltı alır (tüm düzenlerde ortak).
Kutuların clip-path'i taşan öğeyi keseceği için rozet kutu İÇİNDE durur. */
.jr-rozet{position:absolute;top:2px;right:2px;min-width:15px;height:15px;padding:0 4px;border-radius:9px;
background:#ff5f7e;color:#fff;font-size:8.5px;font-weight:800;line-height:1;
display:flex;align-items:center;justify-content:center;z-index:4;pointer-events:none;
box-shadow:0 0 9px rgba(255,95,126,.85);}
.jr-item.dikkat,.ji-item.dikkat,.jh-cell.dikkat,.jn-node.dikkat{filter:drop-shadow(0 0 9px rgba(255,95,126,.45));}
.jn-node .jr-rozet{top:-3px;left:57%;right:auto;}
.jh-cell .jr-rozet{top:19%;right:15%;}
.jk-satir .jr-rozet{top:50%;right:5px;transform:translateY(-50%);}
/* ── A) NÖRAL AĞ ──────────────────────────────────────────────────────
Çekirdekten her gruba bir gövde, gövdeden modüllere dallar. Kesikli
çizgiler yürüyerek (dashoffset) hatlarda veri akışı izlenimi verir. */
/* ORTA BOŞLUK — ağın tamamı (lifler + çatal kabarcıkları) tek bir katmanda
toplanır ve bu katmana dairesel maske uygulanır: çekirdeğin dış çapının
içinde kalan HER ŞEY silinir. Böylece sinir uçları küreye dokunmaz,
tam çevre sınırında biter; orta yuvarlak boş kalır.
Maske px yarıçaplı: yörünge kutusu kare olmasa bile daire GERÇEK daire
kalır ve çekirdekle birebir aynı ölçüde küçülüp büyür. Dış kenar %13
yumuşatılır (sabit px değil — küçük çekirdekte kalın bir tül olurdu):
lifler kesilmiş gibi değil, çekirdekten çıkıyormuş gibi görünsün.
Düğümler (jn-node) bu katmanın DIŞINDA: maske tıklamayı yer. */
/* Nöral düzende reaktör EKRANA değil YÖRÜNGE KUTUSUNA göre ölçülür (cqmin).
vmin ile ölçülünce alçak/geniş pencerede kutu 58vh'ye inerken çekirdek
26vmin'de kalıyor, oran %13'ten %22'ye fırlıyor ve ilk çatal boşluğun
içinde kalıyordu. cqmin oranı her pencerede sabit tutar.
(cqmin burada .jr-orbit'in KENDİ bildiriminde değil, değişkeni KULLANAN
torunlarda çözülür — kapsayıcı zaten .jr-orbit'tir.) */
.jr-orbit[data-duzen="noral"]{--jr-cekirdek:clamp(84px,27cqmin,240px);}
.jn-kat{position:absolute;inset:0;pointer-events:none;
--jn-bosluk:calc(var(--jr-cekirdek,240px)/2 + 4px);
-webkit-mask:radial-gradient(circle at 50% 50%,transparent 0 var(--jn-bosluk),
#000 calc(var(--jn-bosluk)*1.13) 100%);
mask:radial-gradient(circle at 50% 50%,transparent 0 var(--jn-bosluk),
#000 calc(var(--jn-bosluk)*1.13) 100%);}
/* Çekirdek sinir uçlarının ÜSTÜNDE: maske bir pay bıraksa bile küre
hiçbir koşulda lifin altında kalmaz (modül alanı z-index:2). */
.jr-orbit[data-duzen="noral"] .jr-core-wrap{z-index:3;}
.jn-svg{position:absolute;inset:0;width:100%;height:100%;}
/* SVG kare olmayan orana esnediği için (preserveAspectRatio:none) çizgi
kalınlığı EKRAN PİKSELİNE sabitlenir — yoksa yatay/dikey life göre
kalınlık değişirdi. Satır içi stroke-width px cinsindendir. */
.jn-taban,.jn-govde,.jn-dal,.jn-diken{vector-effect:non-scaling-stroke;}
/* Lifin SÜREKLİ tabanı — ağın iskeleti; üstündeki kesikli katman darbedir */
.jn-taban{fill:none;opacity:.24;stroke-linecap:round;}
/* stroke-width satır içinde verilir (uca doğru incelme) — buradaki değer
yalnız yedek. Kesikli desen yürüyerek veri akışını gösterir. */
.jn-govde{fill:none;stroke-width:3px;opacity:.6;stroke-linecap:round;
stroke-dasharray:2.2 3.8;animation:jnAkis 2.4s linear infinite;animation-delay:var(--d,0s);}
.jn-dal{fill:none;stroke-width:1.6px;opacity:.42;stroke-linecap:round;
stroke-dasharray:1.4 3.6;animation:jnAkis 3.1s linear infinite;animation-delay:var(--d,0s);}
/* Çıkmaz diken: sönük ve DÜZ (akış yok) — canlı doku hissi veren detay */
.jn-diken{fill:none;stroke-width:1.1px;opacity:.3;stroke-linecap:round;}
/* Çatal noktalarındaki soma kabarcığı — HTML noktası (SVG dairesi esneyince
elipse dönüyordu), düğümlerle aynı yüzde uzayında konumlanır */
.jn-soma{position:absolute;transform:translate(-50%,-50%);border-radius:50%;
background:var(--c,#5ed6ff);opacity:.6;pointer-events:none;
box-shadow:0 0 8px color-mix(in srgb,var(--c,#5ed6ff) 70%,transparent);}
@keyframes jnAkis{to{stroke-dashoffset:-6;}}
.jn-node{position:absolute;transform:translate(-50%,-50%);width:clamp(70px,14cqmin,104px);
display:flex;flex-direction:column;align-items:center;gap:3px;cursor:pointer;text-align:center;}
.jn-node .i{width:clamp(30px,6cqmin,42px);aspect-ratio:1;border-radius:50%;display:grid;place-items:center;
font-size:clamp(14px,3cqmin,19px);
background:radial-gradient(circle at 50% 38%,color-mix(in srgb,var(--c) 32%,rgba(3,18,30,.94)),rgba(3,18,30,.96));
box-shadow:0 0 13px color-mix(in srgb,var(--c) 45%,transparent);transition:box-shadow .16s,transform .16s;}
.jn-node:hover .i{box-shadow:0 0 24px var(--c);transform:scale(1.13);}
.jn-node .t{font-size:9.8px;font-weight:700;color:#cfeaf8;line-height:1.22;text-shadow:0 0 6px rgba(2,10,18,.95);}
.jn-node:hover .t{color:#eafcff;}
/* Grup panellerinin ortak satırı */
.jh-satir{position:relative;display:flex;align-items:center;gap:8px;
padding:4px 7px;font-size:10.5px;color:#cfeaf8;cursor:pointer;
transition:background .14s,color .14s,padding-left .14s;
animation:jhSatirGir .32s ease-out backwards;animation-delay:var(--g,0s);}
.jh-satir:hover{background:color-mix(in srgb,var(--c) 20%,transparent);
color:#eafcff;padding-left:11px;}
.jh-satir .i{font-size:13px;line-height:1;flex-shrink:0;}
.jh-satir .t{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.jh-satir .ok{color:var(--c);opacity:0;transition:opacity .14s;font-size:12px;}
.jh-satir:hover .ok{opacity:.85;}
@keyframes jhSatirGir{from{opacity:0;transform:translateX(-9px);}to{opacity:1;transform:none;}}
/* Panel başlığı: kutu çerçevesi YOK — grubun rengiyle yazı + sönümlenen alt çizgi */
.jh-bas{font-size:8.5px;letter-spacing:1.9px;text-transform:uppercase;color:var(--c);
padding:0 7px 5px;position:relative;flex-shrink:0;
text-shadow:0 0 9px color-mix(in srgb,var(--c) 60%,transparent);}
.jh-bas::after{content:'';position:absolute;left:0;right:0;bottom:0;height:1px;
background:linear-gradient(90deg,var(--c),transparent);opacity:.55;}
/* ── B) J.A.R.V.I.S. HUD ──────────────────────────────────────────────
Tam komuta ekranı: üstte durum şeridi, yanlarda modül sütunları, ortada
küre (orta hücre BOŞ bırakılır ki küre görünsün ve tıklanabilsin),
altta hedef panosu. Orbit bu düzende kareliğini bırakır, alanı doldurur. */
/* Sahne TAMAMINI kaplar ki küre EKRANIN ortasına otursun; log akışı ise
bulunduğu yerde (sağ alt) mutlak konumla kalır. Yan yana esnek kutu
olsalardı küre sürekli sola kaçardı — kullanıcı bunu fark etti.
Yörünge/nöral için log biraz daha dar: halka sağa doğru genişlediğinden
geniş bir log uyduların üstüne biniyordu (ölçüldü). */
.jr-main[data-duzen="hud"],
.jr-main[data-duzen="yorunge"],
.jr-main[data-duzen="noral"]{position:relative;}
.jr-orbit[data-duzen="hud"]{aspect-ratio:auto;max-width:none;width:100%;
height:100%;display:block;}
.jr-orbit[data-duzen="yorunge"],
.jr-orbit[data-duzen="noral"]{max-width:none;width:100%;margin:0 auto;}
.jr-main[data-duzen="hud"] .jr-log{position:absolute;right:0;bottom:0;
width:min(42%,430px);max-width:none;flex:none;}
.jr-main[data-duzen="yorunge"] .jr-log,
.jr-main[data-duzen="noral"] .jr-log{position:absolute;right:0;bottom:0;
width:min(31%,340px);max-width:none;flex:none;}
.jr-orbit[data-duzen="hud"] .jr-radar{width:auto;height:150%;}
.jr-modul-alan[data-duzen="hud"]{display:grid;
grid-template-columns:minmax(124px,26%) 1fr minmax(124px,26%);
grid-template-rows:auto 1fr auto;gap:8px;padding:8px 10px 6px;}
/* HUD'da küre sahnenin merkezi — büyür */
.jr-orbit[data-duzen="hud"]{--jr-cekirdek:clamp(150px,32vmin,290px);}
.jr-orbit[data-duzen="hud"] .jr-bars{width:clamp(186px,39vmin,350px);}
/* Sütunlar dar: etiket KESİLMEZ, iki satıra sarar */
.jh-panel .jh-satir{align-items:flex-start;}
.jh-panel .jh-satir .t{white-space:normal;text-overflow:clip;line-height:1.2;}
.jh-panel .jh-satir .ok{display:none;}
.jh-ust{grid-column:1/4;grid-row:1;display:flex;align-items:center;gap:9px;flex-wrap:wrap;
font-size:9px;letter-spacing:1.6px;text-transform:uppercase;color:#6fa3bd;}
.jh-marka{font-weight:800;letter-spacing:2.6px;color:#d6f2ff;
text-shadow:0 0 10px rgba(94,214,255,.6);}
.jh-marka b{color:#c8902b;}
.jh-cip{padding:2px 8px;background:rgba(94,214,255,.10);color:#9fd4ee;
font-size:8.2px;letter-spacing:1.3px;white-space:nowrap;
clip-path:polygon(4px 0,100% 0,100% calc(100% - 4px),calc(100% - 4px) 100%,0 100%,0 4px);}
.jh-saat{margin-left:auto;font-family:'Consolas',ui-monospace,monospace;font-size:14px;
letter-spacing:2px;color:#eafcff;text-shadow:0 0 12px rgba(94,214,255,.75);}
.jh-sol{grid-column:1;grid-row:2;}
.jh-sag{grid-column:3;grid-row:2;}
.jh-sol,.jh-sag{display:flex;flex-direction:column;gap:10px;min-height:0;overflow:hidden;}
.jh-panel{display:flex;flex-direction:column;gap:1px;padding:8px 5px;
background:linear-gradient(160deg,rgba(11,36,58,.62),rgba(3,13,23,.42));
animation:jhPanelGir .45s ease-out backwards;animation-delay:var(--g,0s);}
@keyframes jhPanelGir{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:none;}}
/* Kürenin çevresindeki derece işaretleri. Izgara hücresine konursa küreyle
EŞMERKEZLİ olmuyor (üst şerit/pano hücreyi kaydırıyor) ve alan kare
olmadığı için halka elipse dönüyor — bu yüzden ortalanmış KARE katman. */
.jh-derece-kat{position:absolute;left:50%;top:50%;height:82%;aspect-ratio:1;
transform:translate(-50%,-50%);pointer-events:none;}
.jh-derece{position:absolute;transform:translate(-50%,-50%);font-size:7px;letter-spacing:1px;
color:rgba(159,212,238,.45);font-family:'Consolas',ui-monospace,monospace;}
/* Sağ sütun yukarıda toplanır: alt-sağ bölge log akışına ayrıldı */
.jh-sag{align-self:start;}
/* Alttaki hedef panosu — sayılar GERÇEK veriden. Sağ alt köşeye taşmaz
(orası log akışının yeri), bu yüzden genişliği sınırlı. */
/* Alt boşluk: pano dipten 26px yukarı kalkar, açılan şerit sürüm rozetinin
yeri olur (index.html · _apSurumRozetHizala). 2026-09-03 kullanıcı isteği. */
.jh-pano{grid-column:1/3;grid-row:3;max-width:min(620px,56%);margin-bottom:26px;
padding:8px 12px;display:flex;flex-direction:column;gap:5px;
background:linear-gradient(180deg,rgba(11,36,58,.55),rgba(3,13,23,.4));
animation:jhPanelGir .5s ease-out backwards;animation-delay:.34s;}
.jh-pano-bas{font-size:8px;letter-spacing:2.2px;color:#ffc247;
text-shadow:0 0 9px rgba(255,194,71,.5);}
.jh-pano-govde{display:flex;align-items:flex-end;gap:clamp(12px,3vw,40px);flex-wrap:wrap;}
.jh-buyuk b{font-size:clamp(22px,3.4vmin,34px);color:#eafcff;line-height:1;
text-shadow:0 0 16px rgba(94,214,255,.7);}
.jh-buyuk span,.jh-kucuk span{display:block;font-size:8px;letter-spacing:1.4px;
text-transform:uppercase;color:#6fa3bd;margin-top:3px;}
.jh-kucuk b{font-size:15px;color:#7dffd4;line-height:1;
text-shadow:0 0 10px rgba(125,255,212,.45);}
.jh-bar{height:5px;background:rgba(94,214,255,.12);overflow:hidden;}
.jh-bar i{display:block;height:100%;width:0;transition:width .6s ease-out;
background:linear-gradient(90deg,#5ed6ff,#7dffd4);box-shadow:0 0 12px rgba(94,214,255,.8);}
.jh-pano-alt{font-size:8.5px;letter-spacing:1.1px;color:#6fa3bd;}
/* animZorla (2026-08-28): OS "animasyonları azalt" sinyali pil tasarrufu/
tablet kipiyle kendiliğinden gelebiliyor ve çekirdeği donduruyordu.
html.animZorla varken (varsayılan) bu blok uygulanmaz — bkz. index.html. */
@media (prefers-reduced-motion:reduce){
html:not(.animZorla) .jn-govde,html:not(.animZorla) .jn-dal,html:not(.animZorla) .jn-taban,
html:not(.animZorla) .jh-panel,html:not(.animZorla) .jh-satir,html:not(.animZorla) .jh-pano{animation:none;} }
/* Dar/alçak ekran: yörünge KORUNUR (Jarvis ortada kalsın), kutular ikon
dairelerine iner, konsol ALTA açılır. Etiketler title ile erişilebilir. */
@media (max-width:980px),(max-height:620px){
.jr-main{flex-direction:column;gap:8px;}
.jr-orbit{flex:0 0 auto;width:min(94vw,58vh);max-width:none;margin:0 auto;}
.jr-log{flex:1 1 auto;width:100%;max-width:none;min-height:clamp(120px,22vh,200px);}
.jr-item{width:clamp(40px,12.5vmin,54px);aspect-ratio:1;border-radius:50%;padding:0;gap:0;
justify-content:center;clip-path:none;--r:clamp(96px,25vmin,180px);}
.jr-item .t{display:none;} /* etiket gizlenir, ikon kalır */
.jr-item .i{font-size:clamp(15px,4.6vmin,20px);}
/* Tek değişken: küre, parçacık yörüngesi ve nöral boşluk birlikte küçülür */
.jr-orbit{--jr-cekirdek:clamp(104px,26vmin,150px);}
.jr-bars{width:clamp(132px,33vmin,196px);}
/* Diğer düzenler de daralır: etiketler düşer, ikon kalır (title erişilebilir) */
.jn-node{width:clamp(34px,10vmin,46px);} .jn-node .t{display:none;}
/* HUD dar ekranda: yan sütunlar tek sütuna iner, derece halkası gizlenir */
.jr-modul-alan[data-duzen="hud"]{grid-template-columns:1fr 1fr;
grid-template-rows:auto auto auto;gap:6px;padding:6px;}
.jh-sol{grid-column:1;grid-row:2;} .jh-sag{grid-column:2;grid-row:2;}
.jh-ust,.jh-pano{grid-column:1/3;}
.jh-derece-kat{display:none;}
/* Dar ekranda düzenler tekrar dikey yığılır: log mutlak konumdan çıkar */
.jr-main[data-duzen="hud"] .jr-log,
.jr-main[data-duzen="yorunge"] .jr-log,
.jr-main[data-duzen="noral"] .jr-log{position:static;width:100%;flex:1 1 auto;}
.jr-orbit[data-duzen="yorunge"],
.jr-orbit[data-duzen="noral"]{width:min(94vw,58vh);}
.jh-pano{grid-column:1/3;max-width:none;}
.jh-sag{align-self:stretch;}
.jh-satir{font-size:9px;padding:3px 5px;gap:5px;}
.jh-satir .ok{display:none;}
.jh-bas{font-size:7.6px;letter-spacing:1.2px;padding:0 5px 4px;}
.jh-panel{padding:6px 4px;}
.jh-saat{font-size:11px;}
.jr-tools{gap:5px;}
.jr-tools .m{font-size:9.5px;padding:4px 8px;}
}
/* ── HAFİF MOD (tablet/mobil): körlemesine tespit değil — dokunmatik (pointer:coarse) cihaz
ya da elle açılan tercih. Masaüstünde HİÇBİR ŞEY değişmez. Pahalı olanlar kalkar,
görünüm korunur: blur/drop-shadow filtreleri, animasyonlu büyük gölgeler, karışım katmanı. */
body.jr-hafif .jr-hale{filter:none;} /* blur kalkar; degrade zaten yumuşak, nefes animasyonu aynı */
body.jr-hafif .jr-core-wrap:hover .jr-hale{filter:none;}
body.jr-hafif .jr-glow{will-change:transform,opacity;} /* kalp atışı kalır (transform/opaklık ucuz); katman terfisiyle gölge bir kez rasterize */
body.jr-hafif .jr-lifler path{filter:none;stroke-width:1.6;opacity:.9;}
body.jr-hafif .jr-kure{mix-blend-mode:normal;}
body.jr-hafif .jr-spek{filter:none;}
body.jr-hafif .jr-item.dikkat,body.jr-hafif .ji-item.dikkat,body.jr-hafif .jh-cell.dikkat,body.jr-hafif .jn-node.dikkat{filter:none;box-shadow:0 0 9px rgba(255,95,126,.45);}
body.jr-hafif .jr-ticks,body.jr-hafif .jr-arc1,body.jr-hafif .jr-arc2,body.jr-hafif .jr-arc3,body.jr-hafif .jr-hale{will-change:transform,opacity;}
body.jr-hafif .jr-arc1{box-shadow:none;}
body.jr-hafif .jr-item{animation-duration:12s;}
/* Hafif mod: telemetri/iletişim akışı ve daktilo satırı KAPALI (yazı akışı tablette yoruyordu);
komut girişi kalır. İkincil animasyonlar (nöron temas, radar süpürme, ping, imleç) kapalı. */
/* iletişim akışı: hafif modda sürekli telemetri YOK (yordu); yalnız brifing satırları */
/* ── LUU YÜZÜ: kaş + ağız (2026-08-16, araclar/luu-ifade.html testinden). İfade CSS d geçişiyle morf eder. */
.lb-goz path.kas,.lb-goz path.agiz{fill:none;stroke:var(--luu-renk,#04283c);stroke-linecap:round;stroke-linejoin:round;
vector-effect:non-scaling-stroke;stroke-width:calc(var(--luu-yuz-cizgi,3) * var(--luu-cizgi-k,1));filter:drop-shadow(0 1px 0 rgba(240,253,255,.45));
transition:d .42s cubic-bezier(.4,0,.2,1),stroke .3s;}
.jr-core-wrap.on .lb-goz path.kas,.jr-core-wrap.on .lb-goz path.agiz{stroke:var(--luu-renk-on,#043329);}
.lb-goz.kirp-sag g:last-of-type{transform:scaleY(.06);}
body.jr-hafif .lb-goz path.kas,body.jr-hafif .lb-goz path.agiz{filter:none;}
body.jr-hafif #jrLogAktif{display:none;} /* hafif: daktilo satırı kapalı; brifing satırları (statik, seyrek) görünür */
/* ── LUU DUYGU ETİKETİ: kürenin hemen altında "Luu Mutlu 😊" — sempatik nane; ifadeyle birlikte değişir */
.jr-duygu{position:absolute;left:50%;top:calc(50% + var(--jr-cekirdek) * .5 - 4px);transform:translateX(-50%);z-index:4;pointer-events:none;white-space:nowrap;
font-size:11.5px;font-weight:700;letter-spacing:.4px;color:var(--luu-duygu-renk,#7dffd4);text-shadow:0 0 10px rgba(125,255,212,.45);
background:none;border:none;padding:0;opacity:0;transition:color .4s,opacity .7s ease;} /* çerçevesiz, zeminsiz; fade in/out — sürekli durmaz */
.jr-duygu.goster{opacity:1;}
.jr-duygu.degisti{animation:luuDuyguPop .5s ease-out;}
@keyframes luuDuyguPop{0%{transform:translateX(-50%) scale(.85);opacity:.4;}100%{transform:translateX(-50%) scale(1);opacity:1;}}
body.jr-hafif .jr-duygu{text-shadow:none;}
/* ── LUU: BAKIŞ + UYKU (2026-08-16) ── söz söyleyince gözler iletişim kutusuna kayar, satır bir an parlar;
90 sn iş yoksa uyku: gözler yarı kapanır, nefes yavaşlar; yeni sözle uyanır. */
.lb-goz g{transition:transform var(--lb-blink,130ms) cubic-bezier(.4,0,.6,1);}
/* Bakış = KÜRE DÖNÜŞÜ: yüz (göz+kaş+ağız) tek katman olarak perspektifle sağ alta döner — 3B küre hissi */
.lb-goz{transform-origin:50% 50%;backface-visibility:hidden;}
.lb-sahne .lb-goz.bakis{transform:perspective(700px) translate(var(--luu-tx,5px),var(--luu-ty,4px)) rotateY(var(--luu-ry,14deg)) rotateX(var(--luu-rx,-9deg)) scale(var(--luu-sx,.92),var(--luu-sy,.96)) !important; /* küre yüzeyi: az açı + geniş perspektif + hafif daralma — biçim bozulmaz */
transition:transform .6s cubic-bezier(.4,0,.2,1),opacity .3s !important;}
.lb-sahne .lb-goz{transition:transform .6s cubic-bezier(.4,0,.2,1),opacity var(--lb-gecis,420ms) linear;}
.lb-sahne.uyku .lb-goz g{transform:scaleY(.14);transition:transform 1.4s ease-in-out;}
.lb-sahne.uyku ~ .jr-hale,.jr-core-wrap.uyku .jr-hale{animation-duration:9s;}
.jr-core-wrap.uyku .jr-glow{animation-duration:6.5s;}
.jr-log-satir.isaret{text-shadow:0 0 12px rgba(125,255,212,.9),0 0 22px rgba(125,255,212,.5);color:#eafff7;transition:text-shadow .35s,color .35s;}
body.jr-hafif .jr-log{justify-content:flex-end;}
body.jr-hafif .jr-item,body.jr-hafif .jr-radar::after,body.jr-hafif .jr-ping,body.jr-hafif .jr-log-aktif .im{animation:none;} /* radar süpürmesi de kapalı — tablette denendi, yordu (2026-08-16) */
body.jr-hafif .jr-ping{opacity:0;}
/* animZorla: bkz. üstteki not — html.animZorla varken OS sinyali çekirdeği durduramaz. */
@media (prefers-reduced-motion:reduce){
html:not(.animZorla) .jr-ticks,html:not(.animZorla) .jr-arc1,html:not(.animZorla) .jr-arc2,
html:not(.animZorla) .jr-arc3,html:not(.animZorla) .jr-glow,html:not(.animZorla) .jr-radar::after,
html:not(.animZorla) .jr-ping,html:not(.animZorla) .jr-item,html:not(.animZorla) .jr-glow::before,
html:not(.animZorla) .jr-glow::after,html:not(.animZorla) .jr-e,html:not(.animZorla) .jr-flash,
html:not(.animZorla) .jr-log-aktif .im,html:not(.animZorla) .jr-hale,
html:not(.animZorla) .jr-boylamlar ellipse,html:not(.animZorla) .jr-lifler path,
html:not(.animZorla) .jr-log-satir{animation:none;} }
/* ✨ MODERN — sade, ferah, yumuşak gölgeli aydınlık düzen (renk bloğu, ek efekt yok) */
body[data-theme="modern"]{
--bg:#f4f7fb; --panel:#ffffff; --topbar-bg:#ffffff;
--border:rgba(15,35,70,0.11);
--primary:#2f6bff; --accent:#12b886; --warn:#f08c00; --danger:#e03131;
--text:#16233a; --muted:#6b7a90;
--text-soft:rgba(22,35,58,0.72); --placeholder:rgba(22,35,58,0.32);
--diff-sep:rgba(15,35,70,0.06);
--row-even:rgba(47,107,255,0.035); --row-hover:rgba(47,107,255,0.08); --input-bg:rgba(15,35,70,0.045);
}
body[data-theme="modern"] .modal-overlay > div,
body[data-theme="modern"] .kpi-card{ box-shadow:0 8px 28px rgba(15,35,70,0.10) !important; }
html{overflow-x:hidden;}
body{font-family:'Segoe UI',system-ui,sans-serif;background:var(--bg);color:var(--text);min-height:100vh;overflow-x:hidden;}
*{scrollbar-width:none;}
*::-webkit-scrollbar{width:0;height:0;}
/* Plan tablosu — yatay/dikey scrollbar görünür olsun */
#aiPlanTableWrap{scrollbar-width:thin !important;scrollbar-color:rgba(99,179,237,0.5) transparent;}
#aiPlanTableWrap::-webkit-scrollbar{width:10px !important;height:10px !important;}
#aiPlanTableWrap::-webkit-scrollbar-track{background:rgba(255,255,255,0.05);border-radius:5px;}
#aiPlanTableWrap::-webkit-scrollbar-thumb{background:rgba(99,179,237,0.5);border-radius:5px;}
#aiPlanTableWrap::-webkit-scrollbar-thumb:hover{background:rgba(99,179,237,0.75);}
select{background:var(--panel);color:var(--text);border:1px solid var(--border);border-radius:6px;outline:none;}
select option{background:var(--panel);color:var(--text);}
/* ═══ LOGIN ═══ */
#loginScreen{
display:flex;align-items:center;justify-content:center;
min-height:100vh;
background:radial-gradient(ellipse at 30% 30%, rgba(99,179,237,0.06) 0%, transparent 60%),
radial-gradient(ellipse at 70% 70%, rgba(104,211,145,0.04) 0%, transparent 60%),
var(--bg);
}
.login-box{
background:var(--panel);border:1px solid var(--border);
border-radius:20px;padding:44px 40px;width:360px;
box-shadow:0 20px 60px rgba(0,0,0,0.5);
}
.login-logo{text-align:center;margin-bottom:32px;}
.login-logo-mark{
width:56px;height:56px;border-radius:14px;
background:linear-gradient(135deg,#63b3ed,#4299e1);
display:inline-flex;align-items:center;justify-content:center;
font-size:26px;margin-bottom:12px;
}
.login-brand{font-size:22px;font-weight:800;color:var(--text);letter-spacing:1px;}
.login-sub{font-size:12px;color:var(--muted);margin-top:4px;}
.login-field{margin-bottom:16px;}
.login-label{font-size:11px;font-weight:600;color:var(--muted);letter-spacing:1px;text-transform:uppercase;display:block;margin-bottom:6px;}
.login-input{
width:100%;padding:11px 14px;border-radius:10px;
background:rgba(99,179,237,0.06);border:1px solid rgba(99,179,237,0.2);
color:var(--text);font-size:14px;outline:none;transition:border-color .2s;
}
.login-input:focus{border-color:var(--primary);}
.login-btn{
width:100%;padding:13px;border-radius:10px;
background:linear-gradient(135deg,#4299e1,#3182ce);
color:#fff;font-size:14px;font-weight:700;letter-spacing:.5px;
cursor:pointer;border:none;margin-top:8px;transition:opacity .2s;
}
.login-btn:hover{opacity:.9;}
.login-error{
background:rgba(252,129,129,0.1);border:1px solid rgba(252,129,129,0.3);
color:#fc8181;border-radius:8px;padding:10px 14px;font-size:12px;
margin-bottom:14px;display:none;
}
/* ═══ APP LAYOUT ═══ */
#app{display:none;flex-direction:column;height:100vh;overflow:hidden;}
/* ── Topbar ── */
.topbar{
height:44px;display:flex;align-items:center;justify-content:space-between;
padding:0 16px;
background:var(--topbar-bg);
border-bottom:1px solid var(--border);
position:sticky;top:0;z-index:500;
}
.topbar-left{display:flex;align-items:center;gap:12px;min-width:0;flex-shrink:1;}
.topbar-logo{
width:32px;height:32px;border-radius:8px;
background:linear-gradient(135deg,#63b3ed,#4299e1);
display:flex;align-items:center;justify-content:center;font-size:16px;
}
.topbar-logo-img{height:36px;width:auto;display:block;object-fit:contain;cursor:pointer;
background:#fff;border-radius:8px;padding:2px 6px;border:1px solid rgba(255,255,255,0.15);
box-shadow:0 1px 3px rgba(0,0,0,0.2);}
body[data-theme="odoo"] .topbar-logo-img{border-color:rgba(255,255,255,0.35);}
body.compact-mode .topbar-logo-img{height:24px;padding:1px 4px;border-radius:6px;}
.topbar-brand{font-size:16px;font-weight:800;color:var(--text);letter-spacing:.5px;}
/* ── MARKA ANİMASYONU (topbar solundaki Luu-ai işareti) ──────────────────
Sınıf/keyframe adları "aia-" ile AD-ALANLI: uygulamada zaten `.bar`
sınıfı ve `@keyframes pulse` var, çıplak adlar onları ezerdi.
SVG id'leri de "mrk-" önekli — id'ler belge genelinde tekildir. */
.marka-anim{width:30px;height:30px;flex-shrink:0;display:block;}
.aia-spin-slow { animation: aiaSpin 24s linear infinite; transform-origin: 150px 150px; }
.aia-spin-rev { animation: aiaSpinRev 18s linear infinite; transform-origin: 150px 150px; }
.aia-spin-orbit { animation: aiaSpin 30s linear infinite; transform-origin: 150px 150px; }
.aia-upright { animation: aiaSpinRev 30s linear infinite; }
.aia-sweep { animation: aiaSpin 8s linear infinite; transform-origin: 150px 150px; }
.aia-flow { stroke-dasharray: 6 10; animation: aiaDash 1.6s linear infinite; }
.aia-pulse { animation: aiaPulse 2.4s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
.aia-d1 { animation-delay: .4s; } .aia-d2 { animation-delay: .8s; } .aia-d3 { animation-delay: 1.2s; }
.aia-core { animation: aiaCoreGlow 3s ease-in-out infinite; }
.aia-bar { transform-box: fill-box; transform-origin: bottom; animation: aiaBarGrow 2s ease-in-out infinite; }
@keyframes aiaSpin { to { transform: rotate(360deg); } }
@keyframes aiaSpinRev { to { transform: rotate(-360deg); } }
@keyframes aiaDash { to { stroke-dashoffset: -32; } }
@keyframes aiaPulse { 0%,100% { opacity:.35; transform: scale(.85); } 50% { opacity:1; transform: scale(1.15); } }
@keyframes aiaCoreGlow { 0%,100% { opacity:.55; } 50% { opacity:1; } }
@keyframes aiaBarGrow { 0%,100% { transform: scaleY(.4); } 50% { transform: scaleY(1); } }
@media (prefers-reduced-motion: reduce){ .marka-anim *{ animation:none !important; } }
.topbar-badge{
font-size:10px;padding:2px 8px;border-radius:10px;
background:rgba(99,179,237,0.12);border:1px solid rgba(99,179,237,0.25);
color:var(--primary);font-weight:600;letter-spacing:1px;
}
/* .topbar zaten position:sticky — absolute konumlu çocuklar için taşıyıcı blok
oluşturur, bu yüzden burada ayrıca position:relative gerekmiyor. */
/* Modül başlığı ESNEK öğedir (eskiden position:absolute left:50% idi —
asistan paneli #app'i daraltınca sağ kümeyle ÜST ÜSTE biniyordu; medya
sorguları viewport'a baktığından dock daralmasını göremez). Esnek öğe
önce kısalır, sığmazsa üç noktayla kırpılır: çakışma yapısal olarak imkânsız. */
.topbar-center{
flex:1 1 auto;min-width:0;text-align:center;
white-space:nowrap;font-size:12px;padding:0 8px;letter-spacing:.3px;
overflow:hidden;text-overflow:ellipsis;
}
body.compact-mode .topbar-center{display:none !important;}
.topbar-right{display:flex;align-items:center;gap:8px;flex-shrink:0;}
.topbar-user{font-size:12px;color:var(--muted);padding:3px 10px;border-radius:8px;border:1px solid var(--border);max-width:190px;overflow:hidden;white-space:nowrap;display:inline-block;vertical-align:middle;text-align:left;}
/* Dar ekranlarda topbar taşmasın: kademeli sadeleşme */
@media (max-width:900px){
.topbar{padding:0 8px;}
.topbar-left{gap:8px;}
.tnav-btn .tnav-lbl{display:none;} /* Gelen Kutusu / Ana Panel → yalnız ikon */
.topbar-user{max-width:130px;}
#topbarUserAd{max-width:70px;}
}
@media (max-width:820px){ .topbar-center{display:none !important;} #navBtnGrup{display:none !important;} }
/* Asistan paneli açıkken (#app dar): aynı sadeleşme daha geniş eşiklerde —
viewport medya sorgusu dock daralmasını görmez, bu yüzden ayrı kural şart */
@media (max-width:1300px){
body.asistan-dock .tnav-btn .tnav-lbl{display:none;}
body.asistan-dock .topbar-user{max-width:130px;}
}
@media (max-width:1200px){ body.asistan-dock .topbar-center{display:none !important;} }
.topbar-user:hover{border-color:rgba(99,179,237,0.4);color:var(--text);}
/* ── Kompakt & Tam Ekran butonları ── */
.topbar-icon-btn{
padding:0 8px;border-radius:6px;font-size:14px;line-height:1;
background:transparent;border:1px solid var(--border);
color:var(--muted);cursor:pointer;transition:all .15s;
/* TÜM ikon düğmeleri AYNI boyda (AI animasyon düğmesi diğerlerinden
yüksek kalıyordu) — sabit yükseklik + flex ortalama */
height:28px;min-width:30px;display:inline-flex;align-items:center;justify-content:center;
}
#asistanTopBtn video{width:22px;height:22px;object-fit:cover;pointer-events:none;display:block;}
/* ● CANLI — mail izleme nabzı */
@keyframes nabizYanip { 0%,100%{opacity:1;} 50%{opacity:.15;} }
.nabiz-dot{display:inline-block;width:8px;height:8px;border-radius:50%;flex-shrink:0;}
.nabiz-dot.canli{background:#68d391;box-shadow:0 0 6px rgba(104,211,145,.9);animation:nabizYanip 1.6s ease-in-out infinite;}
.nabiz-dot.gec{background:#f6ad55;box-shadow:0 0 6px rgba(246,173,85,.8);}
.nabiz-dot.durdu{background:#fc8181;box-shadow:0 0 6px rgba(252,129,129,.9);animation:nabizYanip .9s ease-in-out infinite;}
.topbar-icon-btn:hover{border-color:var(--primary);color:var(--text);}
.topbar-icon-btn.active{border-color:var(--primary);color:var(--primary);background:rgba(99,179,237,0.1);}
/* ── Kompakt Mod ── */
body.compact-mode .topbar{height:32px;padding:0 10px;}
body.compact-mode .topbar-brand,
body.compact-mode .topbar-badge{display:none;}
/* Geliştirme Kuyruğu detayı: geniş ekranda SOLDA analiz, SAĞDA yazışma
(kullanıcı isteği 2026-08-30 — sağdaki boşluk israftı; yazışma
ilerledikçe analiz görünür kalsın). Dar ekranda alt alta düşer. */
.gk-detay-grid{display:grid;grid-template-columns:minmax(0,1fr) 400px;gap:16px;align-items:start;}
.gk-sohbet-sutun{position:sticky;top:8px;}
.gk-sekme-bar{display:none;gap:6px;margin-bottom:10px;}
.gk-sekme-bar button{flex:1;padding:7px 10px;font-size:12.5px;font-weight:700;border-radius:9px;
border:1px solid var(--border);background:var(--input-bg);color:var(--muted);cursor:pointer;}
.gk-sekme-bar button.aktif{background:var(--primary);border-color:var(--primary);color:#fff;}
/* DAR EKRAN (yan panel/tablet): iki sütun sığmaz — alt alta dizmek yerine
SEKME. Alt alta dizilince analiz yukarıda kalıyor, sohbet kutusu
sıkışıyor ve kaydırma çalışmıyor sanılıyordu (2026-08-30). */
@media (max-width:1180px){
.gk-detay-grid{grid-template-columns:1fr;}
.gk-sohbet-sutun{position:static;}
.gk-sekme-bar{display:flex;}
body.gk-sekme-sohbet .gk-analiz-sutun{display:none;}
body.gk-sekme-analiz .gk-sohbet-sutun{display:none;}
}
/* Sohbet kaydırması görünür olsun — ince ama fark edilir çubuk */
#gkSohbetKutu{scrollbar-width:thin;scrollbar-color:var(--border) transparent;}
#gkSohbetKutu::-webkit-scrollbar{width:8px;}
#gkSohbetKutu::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px;}
#gkSohbetKutu::-webkit-scrollbar-thumb:hover{background:var(--primary);}
/* Marka altın hattı (tasarım F, 2026-08-30) slogan ile BİRLİKTE gizlenir —
yoksa dar ekranda sloganın altında asılı tek bir çizgi kalıyor. */
body.compact-mode .topbar-motto, body.compact-mode .marka-hat{display:none;}
@media (max-width:980px){ .topbar-motto, .marka-hat{display:none;} }
body.compact-mode .topbar-logo{width:24px;height:24px;font-size:12px;border-radius:6px;}
body.compact-mode .tnav{display:none;}
body.compact-mode .tnav-pdf{padding:3px 10px;font-size:11px;}
body.compact-mode #kpiGrid{display:none !important;}
body.compact-mode .table-toolbar{padding:3px 8px;min-height:0;}
.topbar-logout{
padding:6px 14px;border-radius:8px;font-size:12px;font-weight:600;
background:rgba(252,129,129,0.1);border:1px solid rgba(252,129,129,0.25);
color:#fc8181;cursor:pointer;transition:all .2s;
}
.topbar-logout:hover{background:rgba(252,129,129,0.2);}
/* ── Topbar Nav Grupları ── */
.tnav{position:relative;display:inline-block;}
.tnav-btn{
display:flex;align-items:center;gap:5px;
padding:5px 11px;border-radius:8px;font-size:11px;font-weight:600;cursor:pointer;
border:1px solid var(--border);background:transparent;color:var(--text-soft);
transition:all .15s;white-space:nowrap;
}
.tnav-btn:hover,.tnav-btn.open{color:var(--text);border-color:rgba(99,179,237,0.4);background:rgba(99,179,237,0.07);}
.tnav-arrow{font-size:9px;opacity:.55;transition:transform .15s;margin-left:1px;}
.tnav-btn.open .tnav-arrow{transform:rotate(180deg);}
.tnav-drop{
display:none;position:absolute;top:calc(100% + 7px);left:0;
background:var(--panel);border:1px solid var(--border);border-radius:11px;
padding:5px;min-width:210px;z-index:9100;
box-shadow:0 10px 30px rgba(0,0,0,.45);
}
.tnav-drop.open{display:block;}
.tnav-item{
display:flex;align-items:center;gap:10px;
padding:8px 11px;border-radius:8px;font-size:12px;
cursor:pointer;color:var(--text);transition:background .12s;white-space:nowrap;
}
.tnav-item:hover{background:var(--row-hover);}
.tnav-icon{font-size:16px;flex-shrink:0;width:22px;text-align:center;}
.tnav-label{font-weight:600;font-size:12px;line-height:1.2;}
.tnav-desc{font-size:10px;color:var(--muted);margin-top:1px;}
.tnav-sep{height:1px;background:var(--border);margin:4px 2px;}
.tnav-grp{font-size:10px;font-weight:800;letter-spacing:.6px;color:var(--muted);padding:7px 11px 3px;text-transform:uppercase;}
/* Ana Panel (dashboard) — kompakt, responsive, scroll'suz */
#anaPanel{display:flex;}
.ap-wrap{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:clamp(8px,1.6vh,18px) 18px 14px;overflow:auto;box-sizing:border-box;}
.ap-head{font-size:clamp(16px,2.2vw,22px);font-weight:800;color:var(--text);text-align:center;margin-bottom:clamp(8px,2.2vh,20px);flex-shrink:0;}
.ap-head small{display:block;font-size:11px;color:var(--muted);font-weight:500;margin-top:2px;}
.ap-logo{display:block;margin:0 auto;max-height:clamp(56px,10vh,110px);max-width:min(320px,70vw);object-fit:contain;}
.ap-firma{margin-top:7px;font-size:clamp(13px,1.6vw,16px);font-weight:700;letter-spacing:.3px;color:var(--text);}
.ap-sections{display:flex;flex-direction:column;gap:clamp(12px,2.6vh,24px);width:100%;max-width:900px;}
.ap-sec-h{font-size:11px;font-weight:800;letter-spacing:1.3px;color:var(--muted);text-transform:uppercase;margin-bottom:9px;padding-left:3px;}
.ap-sec-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:9px;}
.ap-mini{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:2px;}
/* Uygulama kurulum bandı — Ana Panel'de, tarayıcı kurulumu mümkünken görünür.
Chrome'un kendi teklifi beforeinstallprompt'ta preventDefault ile bastırıldığı
için kurulumun tek görünür yeri burası (topbar ⊕ Kur düğmesi yedek). */
.ap-pwa{display:flex;align-items:center;gap:12px;width:100%;max-width:900px;margin-bottom:clamp(10px,2vh,18px);
background:linear-gradient(90deg,rgba(200,144,43,.16),rgba(200,144,43,.04));border:1px solid rgba(200,144,43,.45);
border-radius:11px;padding:11px 14px;box-sizing:border-box;}
.ap-pwa-ico{font-size:22px;line-height:1;flex-shrink:0;}
.ap-pwa-txt{flex:1;min-width:0;}
.ap-pwa-b{font-size:13px;font-weight:800;color:var(--text);}
.ap-pwa-s{font-size:11px;color:var(--muted);margin-top:2px;line-height:1.35;}
.ap-pwa-btn{flex-shrink:0;background:#c8902b;border:0;border-radius:8px;color:#1a1206;font-size:12px;font-weight:800;
padding:8px 16px;cursor:pointer;white-space:nowrap;}
.ap-pwa-btn:hover{background:#dda23a;}
.ap-pwa-x{flex-shrink:0;background:none;border:0;color:var(--muted);font-size:15px;cursor:pointer;padding:2px 4px;line-height:1;}
.ap-pwa-x:hover{color:var(--text);}
/* Dar ekranda tek sıraya sığmaz: üstte ⊕ … ✕, ortada metin, altta tam genişlik Kur */
@media (max-width:620px){
.ap-pwa{flex-wrap:wrap;gap:8px;}
.ap-pwa-ico{order:1;}
.ap-pwa-x{order:2;margin-left:auto;}
.ap-pwa-txt{order:3;flex:1 1 100%;}
.ap-pwa-btn{order:4;flex:1 1 100%;padding:10px 16px;}
}
.ap-mini-tile{display:flex;align-items:center;gap:6px;background:var(--panel);border:1px solid var(--border);border-radius:9px;padding:6px 12px;cursor:pointer;font-size:11px;font-weight:700;color:var(--muted);transition:border-color .15s,color .15s;}
.ap-mini-tile:hover{border-color:var(--primary);color:var(--text);}
.ap-tile{background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:clamp(5px,1vh,10px) 8px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:3px;min-height:56px;transition:border-color .15s,transform .1s,box-shadow .15s;}
.ap-tile:hover{border-color:var(--primary);transform:translateY(-2px);box-shadow:0 6px 18px rgba(0,0,0,.3);}
.ap-ico{font-size:clamp(15px,2.2vh,20px);line-height:1;}
.ap-title{font-size:10px;font-weight:700;color:var(--text);line-height:1.12;}
.ap-ozet{font-size:9px;font-weight:800;}
.tnav-pdf{
display:flex;align-items:center;gap:5px;
padding:5px 13px;border-radius:8px;font-size:11px;font-weight:700;cursor:pointer;
border:1px solid rgba(104,211,145,0.4);background:rgba(104,211,145,0.12);color:var(--accent);
transition:all .15s;white-space:nowrap;
}
.tnav-pdf:hover{background:rgba(104,211,145,0.22);border-color:rgba(104,211,145,0.6);}
/* ── Upload Banner ── */
#uploadBanner{
position:sticky;top:44px;z-index:99;
background:var(--panel);
border-bottom:1px solid rgba(99,179,237,0.25);
backdrop-filter:blur(8px);
padding:0 16px;
display:none;
flex-direction:column;
gap:0;
overflow:hidden;
transition:max-height .3s ease;
}
.ub-top{
display:flex;align-items:center;gap:12px;
padding:8px 0;flex-wrap:wrap;
}
.ub-title{font-size:12px;font-weight:700;color:var(--primary);letter-spacing:.5px;flex-shrink:0;}
.ub-counters{display:flex;gap:10px;align-items:center;flex:1;flex-wrap:wrap;}
.ub-chip{
display:inline-flex;align-items:center;gap:4px;
font-size:11px;font-weight:700;padding:3px 10px;
border-radius:20px;white-space:nowrap;
}
.ub-chip-prog{background:rgba(99,179,237,0.12);border:1px solid rgba(99,179,237,0.3);color:var(--primary);}
.ub-chip-ok {background:rgba(104,211,145,0.12);border:1px solid rgba(104,211,145,0.3);color:var(--accent);}
.ub-chip-upd {background:rgba(246,173,85,0.12); border:1px solid rgba(246,173,85,0.3); color:var(--warn);}
.ub-chip-same{background:rgba(160,174,192,0.1); border:1px solid rgba(160,174,192,0.25);color:#a0aec0;}
.ub-chip-skip{background:rgba(159,122,234,0.12);border:1px solid rgba(159,122,234,0.3); color:#b794f4;}
.ub-chip-err {background:rgba(252,129,129,0.12);border:1px solid rgba(252,129,129,0.3);color:var(--danger);}
.ub-chip-done{background:rgba(99,179,237,0.08); border:1px solid rgba(99,179,237,0.2); color:var(--muted);}
.ub-prog-bar-wrap{flex:1;min-width:120px;height:4px;background:rgba(99,179,237,0.1);border-radius:3px;overflow:hidden;}
.ub-prog-bar{height:100%;background:linear-gradient(90deg,#4299e1,#68d391);border-radius:3px;transition:width .35s ease;}
.ub-actions{display:flex;align-items:center;gap:8px;margin-left:auto;flex-shrink:0;}
.ub-toggle{font-size:11px;color:var(--muted);cursor:pointer;padding:3px 8px;border-radius:5px;border:1px solid var(--border);background:transparent;transition:all .15s;}
.ub-toggle:hover{color:var(--text);border-color:rgba(99,179,237,0.4);}
.ub-close{font-size:11px;color:var(--muted);cursor:pointer;padding:3px 8px;border-radius:5px;border:1px solid var(--border);background:transparent;transition:all .15s;}
.ub-close:hover{color:var(--danger);border-color:rgba(252,129,129,0.4);}
.ub-update-all{font-size:11px;font-weight:700;cursor:pointer;padding:4px 12px;border-radius:5px;border:1px solid rgba(246,173,85,0.4);background:rgba(246,173,85,0.12);color:var(--warn);transition:all .15s;}
.ub-update-all:hover{background:rgba(246,173,85,0.22);border-color:rgba(246,173,85,0.6);}
.ub-update-all:disabled{opacity:.45;cursor:not-allowed;}
.ub-detail{max-height:0;overflow:hidden;transition:max-height .3s ease;}
.ub-detail.open{max-height:260px;}
.ub-detail-inner{padding:0 0 10px 0;}
.ub-list{display:flex;flex-direction:column;gap:5px;max-height:220px;overflow-y:auto;padding-right:4px;}
.ub-list::-webkit-scrollbar{width:4px;}
.ub-list::-webkit-scrollbar-thumb{background:rgba(99,179,237,0.25);border-radius:4px;}
.ub-row{
display:flex;align-items:center;gap:8px;
padding:6px 10px;border-radius:8px;
background:rgba(99,179,237,0.04);border:1px solid var(--border);
font-size:11px;
}
.ub-row-name{flex:1;color:var(--text-soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ub-row-bar-wrap{width:80px;height:3px;background:rgba(99,179,237,0.1);border-radius:2px;overflow:hidden;flex-shrink:0;}
.ub-row-bar{height:100%;background:var(--primary);border-radius:2px;transition:width .3s;}
.ub-row-status{font-size:10px;font-weight:700;min-width:120px;text-align:right;flex-shrink:0;}
.ub-row.ok-row {border-color:rgba(104,211,145,0.2);}
.ub-row.upd-row {border-color:rgba(246,173,85,0.2);}
.ub-row.same-row {border-color:rgba(160,174,192,0.15);opacity:.7;}
.ub-row.err-row {border-color:rgba(252,129,129,0.2);}
/* ── Ana İçerik ── */
.main{flex:1;min-height:0;min-width:0;padding:12px 16px;display:flex;flex-direction:column;overflow:hidden;}
/* ── KPI Kartları ── */
.kpi-panel-wrap{margin-bottom:8px;transition:opacity .2s;}
.kpi-header-bar{display:flex;align-items:center;justify-content:space-between;padding:4px 2px 6px 2px;flex-wrap:wrap;gap:6px;}
.kpi-panel-title{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--muted);}
.kpi-date-controls{display:flex;align-items:center;gap:6px;flex-wrap:wrap;}
.kpi-date-sel{background:var(--panel);border:1px solid var(--border);border-radius:6px;color:var(--text);font-size:11px;padding:3px 8px;cursor:pointer;outline:none;}
.kpi-date-sel:hover{border-color:rgba(99,179,237,0.4);}
.kpi-custom-range{display:none;align-items:center;gap:5px;}
.kpi-custom-range.show{display:flex;}
.kpi-custom-inp{background:var(--panel);border:1px solid var(--border);border-radius:6px;color:var(--text);font-size:11px;padding:3px 6px;cursor:pointer;outline:none;width:120px;}
.kpi-custom-inp:hover,.kpi-custom-inp:focus{border-color:rgba(99,179,237,0.4);}
.kpi-date-sep{font-size:11px;color:var(--muted);}
.kpi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(90px,1fr));gap:6px;}
.panel-hidden{display:none!important;}
.panel-toggle-btn.active{background:rgba(99,179,237,0.15);border-color:rgba(99,179,237,0.5);color:var(--primary);}
.kpi-card{
background:var(--panel);border:1px solid var(--border);
border-radius:8px;padding:6px 8px;text-align:center;
}
.kpi-val{font-size:15px;font-weight:800;color:var(--primary);line-height:1;}
.kpi-sep{font-size:10px;color:var(--muted);margin:1px 0;font-weight:500;}
.kpi-lbl{font-size:9px;color:var(--muted);margin-top:3px;font-weight:600;letter-spacing:.5px;}
.kpi-warn .kpi-val{color:var(--warn);}
.kpi-green .kpi-val{color:var(--accent);}
.kpi-red .kpi-val{color:var(--danger);}
.kpi-purple .kpi-val{color:#b794f4;}
.kpi-gold .kpi-val{color:#f6e05e;}
.kpi-accent .kpi-val{color:var(--accent);}
.kpi-card{cursor:pointer;transition:border-color .15s,box-shadow .15s;}
.kpi-card:hover{border-color:rgba(99,179,237,0.4);}
.kpi-card.kpi-active{border-color:rgba(99,179,237,0.7);box-shadow:0 0 0 2px rgba(99,179,237,0.15);}
/* ── Yükleme Paneli & Progress ── */
.upload-panel{
background:var(--panel);border:1px solid var(--border);
border-radius:10px;padding:8px 12px;margin-bottom:8px;
}
.panel-title{font-size:13px;font-weight:700;color:var(--muted);letter-spacing:1.5px;text-transform:uppercase;margin-bottom:14px;}
.progress-wrap{margin-top:0px;margin-bottom:16px;display:none;background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:20px;}
.progress-list{display:flex;flex-direction:column;gap:8px;max-height:220px;overflow-y:auto;}
.prog-item{background:rgba(99,179,237,0.05);border:1px solid var(--border);border-radius:10px;padding:10px 14px;}
.prog-name{font-size:12px;color:var(--text-soft);margin-bottom:5px;font-weight:500;}
.prog-bar-wrap{height:5px;background:rgba(99,179,237,0.1);border-radius:3px;overflow:hidden;}
.prog-bar{height:100%;background:var(--primary);border-radius:3px;transition:width .3s;}
.prog-status{font-size:11px;color:var(--muted);margin-top:5px;}
.prog-ok .prog-bar{background:var(--accent);}
.prog-err .prog-bar{background:var(--danger);}
.prog-dup .prog-bar{background:var(--warn);}
.prog-dup{border-color:rgba(246,173,85,0.35);}
.diff-panel{margin-top:10px;border-top:1px solid var(--border);padding-top:10px;}
.diff-row{display:flex;gap:8px;align-items:baseline;font-size:11px;padding:3px 0;border-bottom:1px solid var(--diff-sep);}
.diff-label{color:var(--muted);min-width:130px;flex-shrink:0;}
.diff-old{color:#fc8181;text-decoration:line-through;opacity:.7;flex:1;word-break:break-all;}
.diff-arrow{color:var(--muted);flex-shrink:0;}
.diff-new{color:#68d391;flex:1;word-break:break-all;}
.diff-nochange{font-size:11px;color:var(--muted);font-style:italic;padding:4px 0;}
.diff-protected{font-size:10px;color:var(--muted);margin-top:6px;opacity:.6;}
.diff-actions{display:flex;gap:8px;margin-top:10px;justify-content:flex-end;}
.sal-tbl{width:100%;border-collapse:collapse;font-size:12px;table-layout:auto;}
.sal-tbl th{padding:7px 10px;text-align:left;color:var(--muted);font-size:10px;letter-spacing:.8px;border-bottom:2px solid var(--border);white-space:nowrap;}
.sal-tbl td{padding:7px 10px;border-bottom:1px solid rgba(99,179,237,0.06);overflow:visible;text-overflow:clip;}
.sal-tbl tr:nth-child(even) td{background:rgba(99,179,237,0.02);}
.sal-badge{display:inline-block;padding:2px 8px;border-radius:10px;font-size:10px;font-weight:600;}
.sal-bekliyor{background:rgba(246,173,85,.12);border:1px solid rgba(246,173,85,.3);color:#f6ad55;}
.sal-siparis{background:rgba(99,179,237,.12);border:1px solid rgba(99,179,237,.3);color:#63b3ed;}
.sal-teslim{background:rgba(104,211,145,.12);border:1px solid rgba(104,211,145,.3);color:#68d391;}
.sal-iptal{background:rgba(160,160,160,.12);border:1px solid rgba(160,160,160,.3);color:#a0aec0;}
.sal-boyahane{background:rgba(183,148,244,.12);border:1px solid rgba(183,148,244,.3);color:#b794f4;}
.sal-ekle-btn{padding:3px 9px;border-radius:5px;font-size:10px;font-weight:600;cursor:pointer;border:1px solid rgba(99,179,237,0.4);background:rgba(99,179,237,0.1);color:var(--primary);white-space:nowrap;}
.sal-eklendi-btn{padding:3px 9px;border-radius:5px;font-size:10px;cursor:default;border:1px solid rgba(104,211,145,0.3);background:rgba(104,211,145,0.08);color:#68d391;white-space:nowrap;}
/* ── Panel Resize Handle — tüm paneller için ortak ── */
.panel-resize-handle { height:8px; cursor:ns-resize; z-index:10; display:flex; align-items:center; justify-content:center; border-top:2px solid rgba(99,179,237,0.35); transition:border-color 0.2s; flex-shrink:0; }
.panel-resize-handle::after { content:''; width:40px; height:3px; border-radius:2px; background:rgba(99,179,237,0.45); transition:background 0.2s; }
.panel-resize-handle:hover { border-top-color:rgba(99,179,237,0.85); }
.panel-resize-handle:hover::after { background:rgba(99,179,237,0.9); }
/* ── KPI paneli ── */
#kpiGrid { display:flex; flex-direction:column; }
.kpi-header-bar { flex-shrink:0; }
.kpi-grid { overflow-y:auto; flex:1; min-height:0; }
/* ── Üretici Cari Hesap ── */
.uc-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.75);z-index:800;align-items:center;justify-content:center;}
.uc-overlay.open{display:flex;}
.uc-modal{background:var(--panel);border:1px solid var(--border);border-radius:16px;width:1200px;max-width:98vw;height:88vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 24px 80px rgba(0,0,0,0.8);}
.uc-header{display:flex;align-items:center;justify-content:space-between;padding:16px 22px;border-bottom:1px solid var(--border);flex-shrink:0;}
.uc-title{font-size:15px;font-weight:700;color:var(--text);}
.uc-body{display:flex;flex:1;overflow:hidden;}
.uc-left{width:240px;flex-shrink:0;border-right:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden;}
.uc-left-search{padding:10px;}
.uc-uretici-list{flex:1;overflow-y:auto;}
.uc-uretici-item{padding:10px 14px;cursor:pointer;border-bottom:1px solid rgba(99,179,237,0.05);transition:background .1s;border-left:3px solid transparent;}
.uc-uretici-item:hover{background:rgba(99,179,237,0.07);}
.uc-uretici-item.active{background:rgba(99,179,237,0.12);border-left-color:var(--primary);}
.uc-uretici-name{font-size:12px;font-weight:600;color:var(--text);}
.uc-uretici-sub{font-size:10px;color:var(--muted);margin-top:2px;}
.uc-right{flex:1;display:flex;flex-direction:column;overflow:hidden;}
.uc-right-empty{flex:1;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:13px;}
.uc-detail{flex:1;display:flex;flex-direction:column;overflow:hidden;}
.uc-toolbar{padding:10px 18px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px;flex-shrink:0;flex-wrap:wrap;}
.uc-stats{display:flex;gap:8px;padding:10px 18px;flex-shrink:0;overflow-x:auto;border-bottom:1px solid var(--border);}
.uc-stat{background:var(--panel);border:1px solid var(--border);border-radius:8px;padding:8px 14px;min-width:120px;flex-shrink:0;}
.uc-stat-lbl{font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;}
.uc-stat-val{font-size:16px;font-weight:700;margin-top:4px;}
.uc-tabs{display:flex;gap:2px;padding:0 18px;border-bottom:1px solid var(--border);flex-shrink:0;}
.uc-tab{padding:8px 16px;font-size:12px;font-weight:600;cursor:pointer;color:var(--muted);border-bottom:2px solid transparent;transition:all .15s;white-space:nowrap;}
.uc-tab.active{color:var(--primary);border-bottom-color:var(--primary);}
.uc-content{flex:1;overflow-y:auto;padding:14px 18px;}
.uc-tbl{width:100%;border-collapse:collapse;font-size:12px;}
.uc-tbl th{padding:7px 10px;text-align:left;font-size:10px;font-weight:700;color:var(--muted);letter-spacing:.7px;text-transform:uppercase;border-bottom:1px solid var(--border);background:var(--panel);position:sticky;top:0;z-index:2;}
.uc-tbl td{padding:7px 10px;border-bottom:1px solid rgba(99,179,237,0.05);}
.uc-tbl tr:hover td{background:rgba(99,179,237,0.03);}
.uc-add-btn{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;background:rgba(104,211,145,0.1);border:1px solid rgba(104,211,145,0.3);color:var(--accent);border-radius:8px;cursor:pointer;font-size:12px;font-weight:600;transition:all .15s;}
.uc-add-btn:hover{background:rgba(104,211,145,0.2);}
.uc-form{background:rgba(99,179,237,0.04);border:1px solid rgba(99,179,237,0.12);border-radius:10px;padding:14px;margin-bottom:14px;}
.uc-form-row{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:10px;align-items:flex-end;}
.uc-form-field{display:flex;flex-direction:column;gap:4px;}
.uc-form-field label{font-size:10px;color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.4px;}
/* ── Sipariş Tablosu ── */
.table-panel{
background:var(--panel);border:1px solid var(--border);
border-radius:14px;overflow:hidden;
flex:1;min-height:0;display:flex;flex-direction:column;
}
/* ── Stok & Kayıp modal sekme butonları ── */
/* İçeri Alma Mutabakatı sekmeleri (okunan veri ↔ orijinal evrak) */
.mut-tab{background:transparent;border:none;border-bottom:2px solid transparent;color:var(--muted);
font-size:12.5px;font-weight:700;padding:8px 14px;cursor:pointer;}
.mut-tab:hover{color:var(--text);}
.mut-tab.active{color:var(--primary);border-bottom-color:var(--primary);}
.stok-tab-btn{background:transparent;border:none;border-bottom:2px solid transparent;color:var(--muted);font-size:13px;font-weight:600;padding:8px 14px;cursor:pointer;border-radius:6px 6px 0 0;transition:.15s;}
.stok-tab-btn:hover{color:var(--text);background:rgba(255,255,255,0.04);}
.stok-tab-btn.active{color:var(--primary);border-bottom-color:var(--primary);}
/* E-posta ayarları formu */
.em-lbl{display:block;font-size:11px;font-weight:600;color:var(--muted);margin-bottom:4px;}
.em-inp{width:100%;box-sizing:border-box;font-size:12px;padding:7px 10px;margin:0;}
/* Kaydırmalı şalter */
.mes-switch{position:relative;display:inline-block;width:44px;height:24px;flex-shrink:0;}
.mes-switch input{opacity:0;width:0;height:0;}
.mes-switch .mes-sl{position:absolute;inset:0;background:var(--border);border-radius:24px;transition:.2s;cursor:pointer;}
.mes-switch .mes-sl:before{content:"";position:absolute;height:18px;width:18px;left:3px;top:3px;background:#fff;border-radius:50%;transition:.2s;}
.mes-switch input:checked + .mes-sl{background:var(--accent);}
.mes-switch input:checked + .mes-sl:before{transform:translateX(20px);}
/* Şalter kapalıyken ayarları soluklaştır + kilitle */
.imap-disabled{opacity:.4;pointer-events:none;filter:grayscale(.4);}
/* ── Sticky (freeze) sütunlar — her zaman opak ── */
.sticky-actions{position:sticky;right:0;z-index:6;background:var(--bg);box-shadow:-4px 0 8px rgba(0,0,0,0.4);}
.sticky-left{position:sticky;z-index:5;background:var(--bg);box-shadow:4px 0 6px rgba(0,0,0,0.25);}
.sticky-chk{position:sticky;left:0;z-index:5;background:var(--bg);}
/* Dondurulmuş başlık hücreleri normal başlıkların (th z-index:10) ÜSTÜNDE olmalı —
aksi halde yatay scroll'da normal başlıklar üzerine biner */
thead .sticky-left,thead .sticky-chk,thead .sticky-actions{z-index:20;background:var(--bg);}
/* Normal satır (çift satır dahil) */
tr.clickable:nth-child(even) .sticky-actions,
tr.clickable:nth-child(even) .sticky-left{background:var(--bg);}
.fb-grup-child .sticky-actions,.fb-grup-child .sticky-left,.fb-grup-child .sticky-chk{background:var(--bg);}
.grup-child-row .sticky-actions,.grup-child-row .sticky-left,.grup-child-row .sticky-chk{background:var(--bg);}
/* Grup başlık satırları — hafif ton ama opak */
.fb-grup-hdr .sticky-actions,.fb-grup-hdr .sticky-left,.fb-grup-hdr .sticky-chk,
.grup-header-row .sticky-actions,.grup-header-row .sticky-left,.grup-header-row .sticky-chk{background:color-mix(in srgb,var(--bg) 93%,var(--primary)) !important;}
.col-pin-btn{display:none;position:absolute;top:50%;right:4px;transform:translateY(-50%);background:none;border:none;cursor:pointer;font-size:10px;opacity:0.35;padding:2px;line-height:1;color:var(--muted);}
.col-pin-btn.pinned{display:inline-block;opacity:0.75;color:#f6ad55;}
th:hover .col-pin-btn{display:inline-block;}
th{position:relative;}
.table-toolbar{
display:flex;align-items:center;gap:12px;
padding:14px 20px;border-bottom:1px solid var(--border);
flex-wrap:wrap;
}
.filter-btns{display:flex;gap:6px;flex-wrap:wrap;}
.flt-btn{
padding:5px 13px;border-radius:20px;font-size:11px;font-weight:600;
cursor:pointer;border:1px solid rgba(99,179,237,0.2);
background:rgba(99,179,237,0.05);color:var(--muted);
transition:all .2s;letter-spacing:.3px;
}
.flt-btn:hover{color:var(--text);border-color:rgba(99,179,237,0.5);}
.flt-btn.active{background:rgba(99,179,237,0.15);border-color:var(--primary);color:var(--primary);}
.search-box{
margin-left:auto;padding:7px 14px;border-radius:20px;
background:var(--input-bg);border:1px solid var(--border);
color:var(--text);font-size:12px;width:220px;outline:none;
}
.search-box:focus{border-color:var(--primary);}
.record-count{font-size:11px;color:var(--muted);white-space:nowrap;}
/* ─── Odoo-style Search Bar ─── */
.odoo-searchbar{
display:flex;align-items:center;flex:1;min-width:260px;max-width:660px;
border:1px solid var(--border);border-radius:8px;
background:var(--input-bg);padding:4px 6px 4px 10px;gap:5px;cursor:text;
transition:border-color .2s;position:relative;
}
.odoo-searchbar:focus-within,.odoo-searchbar:hover{border-color:var(--primary);}
.odoo-search-icon{color:var(--muted);font-size:13px;flex-shrink:0;}
.odoo-chips-inner{display:flex;flex-wrap:wrap;gap:3px;flex:0 1 auto;min-width:0;align-items:center;}
.odoo-search-input{border:none;background:transparent;color:var(--text);font-size:13px;outline:none;flex:1 1 80px;min-width:80px;padding:3px 0;}
.odoo-search-input::placeholder{color:var(--placeholder);}
.odoo-toggle-btn{background:none;border:1px solid var(--border);border-radius:5px;color:var(--muted);cursor:pointer;font-size:10px;padding:3px 7px;flex-shrink:0;transition:all .15s;}
.odoo-toggle-btn:hover{border-color:var(--primary);color:var(--primary);}
/* ─── Filter Bar (Odoo 3-column) ─── */
#filterBarPanel{border-bottom:1px solid var(--border);background:var(--panel);}
.odoo-filter-panel{border-bottom:1px solid var(--border);}
.odoo-filter-col{flex:1;border-right:1px solid var(--border);min-width:180px;display:flex;flex-direction:column;}
.odoo-filter-col:last-child{border-right:none;}
.odoo-col-hdr{font-size:10px;font-weight:700;color:var(--muted);padding:10px 14px 7px;letter-spacing:.7px;text-transform:uppercase;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:6px;}
.odoo-filter-col .fb-drop-item{padding:7px 16px;font-size:12px;cursor:pointer;color:var(--text-soft);transition:background .12s;display:flex;align-items:center;gap:7px;}
.odoo-filter-col .fb-drop-item:hover{background:var(--row-hover);color:var(--text);}
.odoo-filter-col .fb-drop-item.grp-active{color:var(--primary);font-weight:600;}
.grp-parent-lbl{font-size:11px;font-weight:700;color:var(--muted);padding:8px 14px 3px;display:flex;align-items:center;gap:6px;}
.grp-check{display:flex;align-items:center;gap:8px;padding:6px 16px;font-size:12px;cursor:pointer;color:var(--text-soft);transition:background .12s;}
.grp-check:hover{background:var(--row-hover);color:var(--text);}
.grp-check.sub{padding-left:30px;}
.grp-check input{accent-color:var(--primary);width:14px;height:14px;cursor:pointer;flex-shrink:0;}
.grp-check.checked{color:var(--primary);font-weight:600;}
.grp-order-badge{margin-left:auto;background:var(--primary);color:#fff;font-size:9px;font-weight:700;border-radius:50%;width:16px;height:16px;display:inline-flex;align-items:center;justify-content:center;}
.grp-divider{border-top:1px solid var(--border);margin:4px 0;}
/* Gelişmiş filtre koşul satırları */
.fb-cond-row{background:var(--input-bg);border:1px solid var(--border);border-radius:8px;padding:8px;margin-bottom:8px;display:flex;flex-direction:column;gap:6px;}
.fb-cond-line{display:flex;gap:6px;align-items:center;}
.fb-cond-sel{flex:1;min-width:0;padding:5px 7px;border-radius:6px;border:1px solid var(--border);background:var(--panel);color:var(--text);font-size:12px;outline:none;cursor:pointer;}
.fb-cond-sel:focus{border-color:var(--primary);}
.fb-cond-val{padding:5px 8px;border-radius:6px;border:1px solid var(--border);background:var(--panel);color:var(--text);font-size:12px;outline:none;width:100%;box-sizing:border-box;}
.fb-cond-val:focus{border-color:var(--primary);}
.fb-cond-del{flex-shrink:0;width:24px;height:24px;border:1px solid var(--border);background:transparent;color:var(--danger);border-radius:6px;cursor:pointer;font-size:14px;line-height:1;}
.fb-cond-del:hover{background:rgba(252,129,129,0.12);}
.fb-cond-listbox{max-height:150px;overflow-y:auto;border:1px solid var(--border);border-radius:6px;background:var(--panel);padding:3px;}
.fb-cond-check{display:flex;align-items:center;gap:7px;padding:5px 7px;font-size:12px;cursor:pointer;border-radius:5px;color:var(--text-soft);}
.fb-cond-check:hover{background:var(--row-hover);}
.fb-cond-check input{accent-color:var(--primary);width:14px;height:14px;cursor:pointer;flex-shrink:0;}
.fb-cond-add{width:100%;padding:7px;border:1px dashed var(--border);background:transparent;color:var(--primary);border-radius:7px;cursor:pointer;font-size:12px;font-weight:600;}
.fb-cond-add:hover{border-color:var(--primary);background:var(--row-hover);}
.fb-preset-btn{width:100%;padding:8px 10px;border:1px solid var(--border);background:var(--input-bg);color:var(--text);border-radius:7px;cursor:pointer;font-size:12px;font-weight:600;text-align:left;transition:all .15s;}
.fb-preset-btn:hover{border-color:var(--accent);}
.fb-preset-btn.active{background:rgba(104,211,145,0.12);border-color:var(--accent);color:var(--accent);}
/* AI Plan görünüm/proses butonları */
.ai-view-btn{background:transparent;border:none;color:var(--muted);font-size:11px;font-weight:600;padding:4px 12px;border-radius:6px;cursor:pointer;}
.ai-view-btn.active{background:var(--panel);color:var(--primary);box-shadow:0 1px 3px rgba(0,0,0,.2);}
.ai-board-proses-btn{background:var(--input-bg);border:1px solid var(--border);color:var(--text-soft);font-size:11px;font-weight:600;padding:4px 12px;border-radius:7px;cursor:pointer;}
.ai-board-proses-btn.active{background:var(--primary);color:#0d1117;border-color:var(--primary);}
/* Kanban */
/* Yatay scrollbar her zaman görünür (overlay/otomatik-gizlenen yerine kalıcı) */
/* Yatay kaydırma çubuğu — TEMA DUYARLI: eski beyaz thumb açık temada beyaz-üstüne-beyaz
kalıp görünmüyordu. --primary + --border ile her temada görünür (overflow-x:scroll →
çubuk daima yer ayırır, sadece hover'da belirmez). */
#aiPlanBoardWrap{overflow-x:scroll;scrollbar-width:thin;scrollbar-color:var(--primary) var(--input-bg);}
#aiPlanBoardWrap::-webkit-scrollbar{width:12px;height:16px;}
#aiPlanBoardWrap::-webkit-scrollbar-track{background:var(--input-bg);border-radius:8px;border:1px solid var(--border);}
#aiPlanBoardWrap::-webkit-scrollbar-thumb{background:var(--primary);border-radius:8px;border:3px solid transparent;background-clip:content-box;}
#aiPlanBoardWrap::-webkit-scrollbar-thumb:hover{background:var(--primary);border-width:2px;background-clip:content-box;}
.ai-kanban{display:flex;gap:10px;height:100%;align-items:flex-start;width:max-content;min-width:100%;}
.ai-kan-col{flex:0 0 var(--kan-col-w,470px);width:var(--kan-col-w,470px);background:var(--input-bg);border:1px solid var(--border);border-radius:10px;display:flex;flex-direction:column;max-height:100%;}
.ai-board-col-btn{width:22px;height:22px;border:1px solid var(--border);background:var(--input-bg);color:var(--text);border-radius:5px;font-size:14px;font-weight:700;cursor:pointer;line-height:1;display:flex;align-items:center;justify-content:center;}
.ai-board-col-btn:hover{border-color:var(--primary);color:var(--primary);}
.ai-kan-col.dragover{border-color:var(--primary);box-shadow:0 0 0 2px rgba(99,179,237,0.35);background:var(--row-hover);}
.ai-kan-col-hdr{padding:8px 10px;border-bottom:1px solid var(--border);position:sticky;top:0;background:var(--input-bg);border-radius:10px 10px 0 0;}
.ai-kan-col-title{font-size:12px;font-weight:800;color:var(--text);}
.ai-kan-col-sub{font-size:10px;color:var(--text);font-weight:700;margin-top:2px;}
.ai-kan-col-body{padding:6px;overflow-y:auto;display:flex;flex-direction:column;gap:5px;flex:1;}
/* Her hafta N sütunlu kart düzeni (sütun sayısı ayarlanabilir) */
.ai-kan-col-body-2{display:grid;grid-template-columns:repeat(var(--kan-cols,2),1fr);grid-auto-rows:max-content;gap:5px;align-content:start;}
.ai-kan-col-devir{flex:0 0 var(--kan-col-w,470px);width:var(--kan-col-w,470px);border-color:rgba(246,173,85,0.5);background:rgba(246,173,85,0.06);}
.ai-kan-col-devir .ai-kan-col-hdr{background:rgba(246,173,85,0.12);}
.ai-kan-col-devir .ai-kan-col-title{color:#f6ad55;}
.ai-kan-col-uyari{flex:0 0 var(--kan-col-w,470px);width:var(--kan-col-w,470px);border-color:rgba(245,101,101,0.55);background:rgba(245,101,101,0.07);}
.ai-kan-col-uyari .ai-kan-col-hdr{background:rgba(245,101,101,0.14);}
.ai-kan-col-uyari .ai-kan-col-title{color:#fc8181;}
/* Tasarim F (2026-08-20): gorsel arka planli baslik bandi + nokta renkler +
durum pili. Onceki B/A duzenleri: git gecmisi V13984/V13983 */
.ai-kan-card{background:var(--panel);border:1.5px solid rgba(148,184,220,.55);border-radius:8px;cursor:grab;font-size:11px;min-width:0;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 2px 7px rgba(0,0,0,.45);}
.ai-kan-ust{display:flex;gap:9px;padding:7px 9px;align-items:center;background:var(--input-bg);}
.ai-kan-card-grab{flex:1;min-width:0;}
.ai-kan-sag{display:flex;flex-direction:column;align-items:flex-end;gap:3px;flex-shrink:0;}
.ai-kan-term-b{background:rgba(246,173,85,.14);color:#f6ad55;border-radius:6px;padding:1px 7px;font-size:9.5px;font-weight:700;white-space:nowrap;}
.ai-kan-adet-b{font-size:12.5px;font-weight:800;color:var(--text);white-space:nowrap;line-height:1;}
.ai-kan-adet-b i{font-style:normal;font-size:9px;color:var(--muted);font-weight:600;}
.ai-kan-orta{display:flex;align-items:center;gap:6px;padding:6px 9px 0;min-height:22px;}
.ai-kan-selrow{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:6px 9px 8px;}
.ai-kan-selrow select,.ai-kan-selrow input{margin-top:0!important;}
.ai-kan-card:active{cursor:grabbing;}
.ai-kan-card.dragging{opacity:.4;}
.ai-kan-card.picked{border-color:#f6ad55;box-shadow:0 0 0 2px rgba(246,173,85,0.45);background:rgba(246,173,85,0.08);}
.ai-kan-hafta{width:100%;box-sizing:border-box;margin-top:3px;font-size:11px;padding:2px 5px;border:1px solid var(--border);border-radius:5px;background:var(--input-bg);color:var(--text);}
.ai-kan-card.cap-over{border-color:var(--danger);}
.ai-kan-card-po{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-weight:700;font-size:10.5px;color:#f3f6fa;white-space:normal;overflow:visible;word-break:break-all;line-height:1.25;}
/* 3. satır: PLM · grup · parça adı — açık gri, tam satır (okunurluk, 2026-08-23) */
.ai-kan-card-po .ai-kan-card-sip{display:block;font-size:10px;color:#b7c2d3;font-family:monospace;font-weight:400;margin:2px 0 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ai-kan-satir2{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:3px;}
.ai-kan-card-grab{flex:1;min-width:0;}
.ai-kan-sipno{font-size:10.5px;color:#b7c2d3;font-family:monospace;font-weight:400;margin-left:auto;white-space:nowrap;flex-shrink:0;}
.ai-kan-card-sip{font-size:10px;color:#b7c2d3;font-family:monospace;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px;}
.ai-kan-card-plm{font-weight:700;font-size:11px;color:#63b3ed;}
.ai-kan-card-meta{color:var(--text);font-weight:700;font-size:10px;margin-top:2px;word-break:break-word;}
.ai-kan-card-parca{color:var(--text);font-weight:700;font-size:10px;margin-top:2px;word-break:break-word;display:flex;justify-content:space-between;align-items:baseline;gap:6px;flex-wrap:wrap;}
.ai-kan-card-adet{color:var(--text);font-size:10px;margin-top:1px;display:flex;justify-content:space-between;align-items:baseline;gap:6px;flex-wrap:wrap;}
.ai-kan-card-term{color:#f6ad55;font-weight:700;font-size:10px;white-space:nowrap;align-self:flex-start;}
.ai-kan-card-renk{display:flex;flex-wrap:wrap;gap:3px;margin-top:2px;}
.ai-kan-card-renk-inline{white-space:normal;display:inline-flex;flex-wrap:wrap;gap:3px;}
.ai-kan-card-renk-inline .ai-kan-renk-chip{margin-left:0;}
.ai-kan-renk-chip{font-size:9px;font-weight:600;color:var(--primary);background:rgba(99,179,237,0.12);border-radius:4px;padding:1px 6px;line-height:1.45;display:inline-block;}
.krt-dots{display:inline-flex;align-items:center;gap:4px;flex-wrap:wrap;min-width:0;}
.krt-dot{width:11px;height:11px;border-radius:50%;display:inline-block;border:1px solid rgba(255,255,255,.28);flex-shrink:0;}
.krt-dot-daha{font-size:9.5px;color:var(--muted);font-weight:600;}
.krt-durum{margin-left:auto;font-size:10px;font-weight:700;padding:2px 8px;border-radius:12px;cursor:pointer;max-width:58%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ai-kan-thumb{width:42px;min-width:42px;height:42px;border-radius:8px;object-fit:cover;flex-shrink:0;background:var(--panel);border:1px solid var(--border);cursor:zoom-in;}
.ai-kan-thumb-empty{display:flex;align-items:center;justify-content:center;font-size:16px;min-height:42px;color:var(--muted);}
.ai-kan-uretici{margin-top:3px;width:100%;box-sizing:border-box;font-size:10px;padding:2px 5px;border-radius:5px;border:1px solid var(--border);background:var(--input-bg);color:var(--text);}
.ai-kan-durum{margin-top:3px;width:100%;box-sizing:border-box;font-size:10px;padding:2px 5px;border-radius:5px;border:1px solid var(--border);background:var(--input-bg);color:var(--text);}
.ai-kan-col-cap{height:4px;border-radius:2px;background:rgba(255,255,255,0.08);margin-top:5px;overflow:hidden;}
.ai-kan-col-cap > i{display:block;height:100%;}
/* Asistan sohbet */
.as-msg{max-width:90%;padding:9px 12px;border-radius:12px;font-size:13px;line-height:1.5;white-space:pre-wrap;word-break:break-word;}
.as-msg.user{align-self:flex-end;background:var(--primary);color:#0d1117;border-bottom-right-radius:3px;}
.as-msg.ai{align-self:flex-start;background:var(--input-bg);border:1px solid var(--border);color:var(--text);border-bottom-left-radius:3px;}
.as-msg.sys{align-self:center;background:transparent;color:var(--muted);font-size:11px;}
.as-act{align-self:flex-start;width:90%;background:var(--bg);border:1px solid var(--border);border-left:3px solid var(--accent);border-radius:8px;padding:9px 11px;font-size:12px;}
.as-act.over{border-left-color:var(--danger);}
.as-act-bttns{display:flex;gap:8px;margin-top:8px;}
.as-act-bttns button{flex:1;padding:5px 8px;font-size:11px;font-weight:600;border-radius:6px;cursor:pointer;border:1px solid var(--border);}
.as-act-uygula{background:rgba(104,211,145,0.15);border-color:rgba(104,211,145,0.4)!important;color:var(--accent);}
.as-act-red{background:transparent;color:var(--muted);}
.as-hizli-btn{background:var(--input-bg);border:1px solid var(--border);color:var(--text-soft);font-size:10px;padding:3px 8px;border-radius:12px;cursor:pointer;}
.as-hizli-btn:hover{border-color:var(--accent);color:var(--text);}
/* Asistan markdown cevabı (tablo/liste/bold) */
.as-msg.ai.as-md{white-space:normal;}
.as-msg.ai.as-md>div{margin:2px 0;}
.as-msg.ai.as-md b{color:var(--text);}
.as-msg.ai.as-md code{background:var(--bg);padding:1px 4px;border-radius:4px;font-size:11px;}
.as-msg.ai.as-md ul{margin:4px 0;padding-left:18px;}
.as-msg.ai.as-md li{margin:2px 0;}
.as-msg.ai.as-md table{border-collapse:collapse;margin:6px 0;font-size:11px;display:block;max-width:100%;overflow-x:auto;}
.as-msg.ai.as-md th,.as-msg.ai.as-md td{border:1px solid var(--border);padding:4px 7px;text-align:left;vertical-align:top;}
.as-msg.ai.as-md th{background:var(--bg);font-weight:700;white-space:nowrap;}
/* Asistan onay formu */
.as-form{align-self:stretch;background:var(--bg);border:1px solid var(--border);border-radius:10px;overflow:hidden;}
.as-form-hdr{padding:8px 12px;font-size:12px;font-weight:700;color:var(--text);background:var(--input-bg);border-bottom:1px solid var(--border);}
.as-form-body{max-height:340px;overflow-y:auto;}
.as-row{display:flex;gap:9px;align-items:flex-start;padding:8px 12px;border-bottom:1px solid var(--border);cursor:pointer;}
.as-row:hover{background:var(--row-hover);}
.as-row.over{background:rgba(252,129,129,0.06);}
.as-row input[type=checkbox]{margin-top:3px;width:15px;height:15px;accent-color:var(--accent);flex-shrink:0;cursor:pointer;}
.as-form-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 12px;background:var(--input-bg);}
.as-kural-oner{align-self:stretch;background:rgba(104,211,145,0.06);border:1px solid rgba(104,211,145,0.3);border-radius:10px;padding:10px 12px;}
/* Asistan dock — açıkken sayfayı sola daralt */
#app{transition:margin-right .12s ease;}
body.asistan-dock #app{margin-right:var(--asistan-w,380px);}
body.asistan-dock #aiPlanModal{right:var(--asistan-w,380px)!important;}
.fb-grup-hdr td .grp-indent{display:inline-block;}
.fb-inner{display:flex;align-items:center;gap:8px;padding:10px 20px;flex-wrap:wrap;}
.fb-drop-wrap{position:relative;}
.fb-drop-btn{display:flex;align-items:center;gap:5px;padding:6px 12px;border-radius:8px;font-size:12px;font-weight:600;cursor:pointer;border:1px solid var(--border);background:var(--input-bg);color:var(--text);transition:all .2s;white-space:nowrap;}
.fb-drop-btn:hover,.fb-drop-btn.open{border-color:var(--primary);color:var(--primary);}
.fb-badge{background:var(--primary);color:#fff;border-radius:10px;padding:1px 6px;font-size:10px;margin-left:2px;}
.fb-dropdown{position:absolute;top:calc(100% + 6px);left:0;min-width:240px;max-height:420px;overflow-y:auto;background:var(--panel);border:1px solid var(--border);border-radius:10px;box-shadow:0 8px 24px rgba(0,0,0,.45);z-index:300;padding:6px 0;display:none;}
.fb-dropdown.open{display:block;}
.fb-drop-section{padding:6px 14px 3px;font-size:10px;font-weight:700;color:var(--muted);letter-spacing:.8px;text-transform:uppercase;margin-top:2px;}
.fb-drop-item{display:flex;align-items:center;gap:8px;padding:7px 14px;font-size:12px;cursor:pointer;transition:background .15s;color:var(--text);}
.fb-drop-item:hover{background:var(--row-hover);}
.fb-drop-item input[type=checkbox]{width:14px;height:14px;accent-color:var(--primary);flex-shrink:0;}
/* Muhasebe modülü menü çubuğu */
.fnmenubar{display:flex;align-items:stretch;gap:2px;flex-wrap:wrap;border-bottom:2px solid var(--border);margin:-16px -20px 16px;padding:8px 20px 0;position:sticky;top:0;background:var(--bg);z-index:40;}
.fnmenu-item{background:none;border:none;border-bottom:2px solid transparent;margin-bottom:-2px;padding:9px 14px;font-size:12.5px;font-weight:600;color:var(--muted);cursor:pointer;white-space:nowrap;border-radius:7px 7px 0 0;transition:color .12s,background .12s;font-family:inherit;line-height:1;}
.fnmenu-item:hover{color:var(--text);background:var(--row-hover);}
.fnmenu-item.active{color:var(--primary);border-bottom-color:var(--primary);}
.fnmenu-sep{width:1px;background:var(--border);margin:7px 9px;align-self:stretch;}
.fnmenu-group{position:relative;display:flex;margin-left:auto;}
.fnmenu-dropdown{display:none;position:absolute;top:calc(100% + 5px);right:0;min-width:215px;background:var(--panel);border:1px solid var(--border);border-radius:11px;box-shadow:0 10px 30px rgba(0,0,0,.45);z-index:60;padding:5px;}
.fnmenu-dropdown.open{display:block;}
.fnmenu-ddhead{font-size:9.5px;text-transform:uppercase;letter-spacing:.8px;color:var(--muted);padding:6px 11px 5px;}
.fnmenu-dditem{display:block;width:100%;text-align:left;background:none;border:none;padding:8px 11px;font-size:12.5px;font-weight:600;color:var(--text);cursor:pointer;border-radius:8px;white-space:nowrap;font-family:inherit;}
.fnmenu-dditem:hover{background:var(--row-hover);}
.fnmenu-dditem.active{background:color-mix(in srgb,var(--primary) 16%,transparent);color:var(--primary);}
.fb-drop-item.fb-active{color:var(--primary);}
.fb-date-row{padding:5px 14px;display:flex;align-items:center;gap:8px;font-size:11px;color:var(--muted);}
.fb-date-row input{background:var(--input-bg);border:1px solid var(--border);border-radius:6px;color:var(--text);padding:4px 8px;font-size:11px;width:120px;outline:none;}
.fb-date-row input:focus{border-color:var(--primary);}
.fb-chips-row{display:flex;align-items:center;gap:6px;padding:0 20px 8px;flex-wrap:wrap;}
.fb-chip{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:20px;font-size:11px;font-weight:600;background:rgba(99,179,237,0.12);border:1px solid rgba(99,179,237,0.3);color:var(--primary);}
.fb-chip-grp{background:rgba(104,211,145,0.1);border-color:rgba(104,211,145,0.3);color:#68d391;cursor:grab;}
.fb-chip-grp:active{cursor:grabbing;}
.fb-chip-x{cursor:pointer;opacity:.65;font-size:13px;line-height:1;}
.fb-chip-x:hover{opacity:1;}
.fb-clear-all{font-size:11px;color:var(--danger);cursor:pointer;padding:3px 10px;border-radius:14px;background:rgba(252,129,129,0.08);border:1px solid rgba(252,129,129,0.2);white-space:nowrap;}
.fb-clear-all:hover{background:rgba(252,129,129,0.18);}
.fb-save-form{padding:8px 14px;border-top:1px solid var(--border);margin-top:4px;}
.fb-save-form input[type=text]{width:100%;background:var(--input-bg);border:1px solid var(--border);border-radius:6px;color:var(--text);padding:6px 10px;font-size:12px;outline:none;margin-bottom:6px;box-sizing:border-box;}
.fb-save-form input[type=text]:focus{border-color:var(--primary);}
.fb-save-row{display:flex;align-items:center;justify-content:space-between;gap:8px;}
.fb-save-lbl{font-size:11px;color:var(--muted);display:flex;align-items:center;gap:5px;cursor:pointer;}
.fb-save-btn{padding:5px 14px;border-radius:8px;font-size:11px;font-weight:600;cursor:pointer;background:rgba(99,179,237,0.12);border:1px solid var(--primary);color:var(--primary);}
.fb-save-btn:hover{background:rgba(99,179,237,0.22);}
.fb-saved-item{display:flex;align-items:center;justify-content:space-between;padding:7px 14px;font-size:12px;cursor:pointer;transition:background .15s;color:var(--text);}
.fb-saved-item:hover{background:var(--row-hover);}
.fb-saved-del{opacity:0;color:var(--danger);font-size:13px;cursor:pointer;padding:2px 4px;}
.fb-saved-item:hover .fb-saved-del{opacity:1;}
.fb-saved-shared{font-size:9px;background:rgba(104,211,145,0.15);border:1px solid rgba(104,211,145,0.3);color:#68d391;border-radius:10px;padding:1px 6px;margin-left:5px;}
.fb-empty-msg{padding:10px 14px;font-size:11px;color:var(--muted);}
.fb-acc-section{border-bottom:1px solid var(--border);}
.fb-acc-section:last-child{border-bottom:none;}
.fb-acc-hdr{display:flex;align-items:center;gap:6px;padding:9px 14px;cursor:pointer;font-size:12px;font-weight:600;color:var(--text);transition:background .15s;user-select:none;}
.fb-acc-hdr:hover{background:var(--row-hover);}
.fb-acc-hdr span:first-child{flex:1;}
.fb-acc-badge{background:var(--primary);color:#fff;border-radius:10px;padding:1px 7px;font-size:10px;font-weight:700;}
.fb-acc-arrow{font-size:10px;color:var(--muted);margin-left:2px;}
.fb-acc-body{padding:0 0 4px;}
.fb-grup-hdr { cursor:pointer; }
.fb-grup-hdr td { background:color-mix(in srgb,var(--bg) 93%,var(--primary)) !important; border-top:2px solid var(--border) !important; }
.fb-grup-hdr td:first-child { border-left:3px solid var(--primary) !important; }
.fb-grup-child td { background:var(--bg) !important; }
/* Sipariş listesi kaydırma çubuğu — TEMA DUYARLI (eski beyaz thumb açık temada görünmüyordu) */
/* Akış kartının kanıt kutuları: kapalıyken tek satırda yan yana dururlar,
açılınca satırın TAMAMINI kaplarlar — yoksa mail metni içerik genişliği
kadar dar bir sütuna sıkışıyor. */
.bkKanit{min-width:0;}
.bkKanit[open]{flex:1 1 100%;}
.table-wrap{overflow:auto; flex:1; min-height:0; scrollbar-width:thin; scrollbar-color:var(--primary) var(--input-bg);}
.table-wrap::-webkit-scrollbar{width:12px;height:14px;}
.table-wrap::-webkit-scrollbar-track{background:var(--input-bg);border-radius:7px;border:1px solid var(--border);}
.table-wrap::-webkit-scrollbar-thumb{background:var(--primary);border-radius:7px;border:3px solid transparent;background-clip:content-box;}
.table-wrap::-webkit-scrollbar-thumb:hover{background:var(--primary);border-width:2px;background-clip:content-box;}
.table-wrap::-webkit-scrollbar-corner{background:var(--input-bg);}
/* AKIŞ TABLOSU (Gelen Kutusu) — kendi dikey kaydırması.
.table-wrap'in flex:1 kuralı burada işlemiyordu: ana öge flex sütun değil,
kutu içerik boyu kadar uzuyordu. Sonuç: uzun listede başlık satırı kayıp
gidiyor, yatay kaydırma çubuğu da listenin en dibinde kalıyordu. Sınırlı
yükseklik ikisini de çözer — çubuk kutunun altına sabitlenir. */
.bk-tbl-wrap{max-height:calc(100vh - 250px);}
.bk-tbl-wrap thead th{position:sticky;top:0;z-index:3;background:var(--panel);}
table{border-collapse:collapse;font-size:13px; table-layout: fixed;}
th{
padding:8px 10px;text-align:left;
font-size:10px;font-weight:700;color:var(--muted);
letter-spacing:1px;text-transform:uppercase;
border-bottom:1px solid var(--border);
background:var(--panel);
position:sticky;top:0;z-index:10;
user-select:none;
}
th.sortable { cursor: pointer; }
th.sortable:hover { background: rgba(99,179,237,0.05); }
td{padding:7px 10px;border-bottom:1px solid rgba(99,179,237,0.06); overflow: hidden; text-overflow: ellipsis;}
tr.clickable{cursor:default;}
tr.clickable td{background:var(--bg);height:80px;overflow:hidden;vertical-align:middle;}
/* Hücre chip — uzun metin alanları için (not, ai_oneri vb.) */
.cell-chip{
display:inline-block;max-width:100%;padding:3px 8px;border-radius:6px;
background:rgba(99,179,237,0.07);border:1px solid rgba(99,179,237,0.18);
color:var(--text-soft);font-size:11px;cursor:pointer;
white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
vertical-align:middle;transition:background .15s,border-color .15s,color .15s;
}
.cell-chip:hover{background:rgba(99,179,237,0.15);border-color:rgba(99,179,237,0.4);color:var(--text);}
.cell-chip-empty{opacity:.38;border-style:dashed;}
/* Hücre düzenleme popup */
.cell-edit-popup{
position:fixed;z-index:10000;
background:var(--panel);border:1px solid var(--border);border-radius:12px;
padding:14px;box-shadow:0 10px 40px rgba(0,0,0,0.75);min-width:280px;max-width:380px;
}
.po-num {font-weight:700;color:var(--primary);font-family:'Courier New',monospace;}
.td-muted {color:var(--text-soft);}
.td-hafta {font-weight:700;color:#4fd1c5;}
.td-plm {color:#b794f4;font-family:'Courier New',monospace;}
.td-grup-plm {color:#90cdf4;font-weight:700;font-family:'Courier New',monospace;}
.td-tedarikci{color:#f6ad55;}
.td-buyer {color:#fc8181;}
.td-depo {color:#68d391;}
.td-urun-grp {color:#fbd38d;}
.empty-row td{text-align:center;padding:60px 20px;color:var(--muted);}
.empty-icon{font-size:36px;margin-bottom:10px;}
/* Inline Edit CSS */
.inline-input {
background: transparent;
border: 1px solid transparent;
color: inherit;
font-family: inherit;
font-size: inherit;
width: 100%;
padding: 4px 6px;
margin: -4px -6px;
border-radius: 6px;
outline: none;
transition: all 0.2s;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
}
.inline-input:hover {
background: rgba(99,179,237,0.08);
border-color: rgba(99,179,237,0.2);
}
/* Üretim sütunları parça kırılımı (Kesim/Yüklenen/Defolu/Elde/Kayıp) */
.ut-kirilim{display:flex;flex-direction:column;gap:1px;line-height:1.35;font-size:11px;}
.ut-kr-row{display:flex;justify-content:space-between;gap:6px;white-space:nowrap;align-items:baseline;}
.ut-kr-row .ut-kr-ad{color:var(--muted);overflow:hidden;text-overflow:ellipsis;font-size:10px;}
.ut-kr-val{justify-content:flex-end;font-weight:600;}
.inline-input:focus {
background: var(--panel);
border-color: var(--primary);
color: var(--text);
box-shadow: 0 0 0 3px rgba(99,179,237,0.15);
white-space: normal;
overflow: visible;
text-overflow: clip;
z-index: 10;
position: relative;
}
/* Gizli spinner'ı Chrome/Safari için kaldır (Sayısal inputlarda) */
.inline-input[type=number]::-webkit-inner-spin-button,
.inline-input[type=number]::-webkit-outer-spin-button {
-webkit-appearance: none; margin: 0;
}
/* Resizer css */
.resizer {
position: absolute;
right: 0;
top: 0;
bottom: 0;
width: 5px;
cursor: col-resize;
user-select: none;
}
.resizer:hover, .resizer.resizing {
background-color: rgba(99,179,237,0.5);
}
/* ── Durum Badges ── */
.badge{
display:inline-flex;align-items:center;justify-content:center;gap:4px;
padding:4px 10px;border-radius:20px;font-size:11px;font-weight:700;
cursor:pointer;white-space:nowrap;transition:opacity .2s;
min-width:140px;box-sizing:border-box;
}
.badge:hover{opacity:.8;}
.b-bekliyor {background:rgba(246,173,85,.12); border:1px solid rgba(246,173,85,.3); color:#f6ad55;}
.b-kesim_sirasinda{background:rgba(251,211,141,.10);border:1px solid rgba(251,211,141,.25);color:#ecc96e;}
.b-kesim {background:rgba(251,211,141,.18);border:1px solid rgba(251,211,141,.4); color:#f6d860;}
.b-dikim_sirasinda{background:rgba(129,199,248,.10);border:1px solid rgba(129,199,248,.25);color:#63b3ed;}
.b-dikim {background:rgba(129,199,248,.18);border:1px solid rgba(129,199,248,.4); color:#76c6f5;}
.b-utu_paket {background:rgba(184,130,248,.12);border:1px solid rgba(184,130,248,.3); color:#b794f4;}
.b-sevk {background:rgba(104,211,145,.12);border:1px solid rgba(104,211,145,.3); color:#68d391;}
.b-qc_kaldi {background:rgba(252,129,129,.12);border:1px solid rgba(252,129,129,.3); color:#fc8181;}
.b-iptal {background:rgba(160,160,160,.12);border:1px solid rgba(160,160,160,.3); color:#a0aec0;}
/* ── Malzeme Durumu multi-select ── */
.mbd-wrap{display:flex;flex-wrap:nowrap;gap:3px;align-items:center;cursor:pointer;min-height:28px;padding:2px 0;min-width:110px;box-sizing:border-box;}
.mbd-arrow{color:var(--muted);font-size:10px;margin-left:auto;flex-shrink:0;}
.mbd-chip{font-size:10px;font-weight:600;padding:2px 7px;border-radius:6px;white-space:nowrap;display:inline-block;min-width:80px;text-align:center;box-sizing:border-box;}
.mbd-bekliyor{background:rgba(246,173,85,.15);border:1px solid rgba(246,173,85,.3);color:#f6ad55;}
.mbd-boyada {background:rgba(184,130,248,.15);border:1px solid rgba(184,130,248,.3);color:#b794f4;}
.mbd-temin {background:rgba(104,211,145,.15);border:1px solid rgba(104,211,145,.3);color:#68d391;}
.mbd-hayir {background:rgba(252,129,129,.15);border:1px solid rgba(252,129,129,.3);color:#fc8181;}
.mbd-stok {background:rgba(99,179,237,.15); border:1px solid rgba(99,179,237,.3); color:#63b3ed;}
.mbd-dropdown{position:fixed;z-index:9999;background:var(--panel);border:1px solid rgba(99,179,237,0.25);border-radius:10px;padding:6px;min-width:195px;box-shadow:0 8px 32px rgba(0,0,0,0.6);}
.mbd-item{display:flex;align-items:center;gap:8px;padding:6px 10px;cursor:pointer;border-radius:6px;transition:background .12s;}
.mbd-item:hover{background:rgba(99,179,237,0.08);}
.mbd-item.selected{background:rgba(99,179,237,0.12);}
.mbd-sel-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0;background:transparent;border:1.5px solid rgba(99,179,237,0.3);}
.mbd-item.selected .mbd-sel-dot{background:#63b3ed;border-color:#63b3ed;}
.renk-badge{
display:inline-block;font-size:11px;color:var(--text-soft);
background:rgba(99,179,237,0.06);border:1px solid rgba(99,179,237,0.15);
border-radius:6px;padding:2px 8px;white-space:nowrap;max-width:180px;
overflow:hidden;text-overflow:ellipsis;
}
/* DT-011: renk cipleri satir basina BIR tane, ust uste binmeden; 4'ten
fazlasi "+N daha" arkasina katlanir (tikla ac/kapa, hover'da tam liste) */
.renk-kume{display:flex;flex-direction:column;gap:3px;align-items:flex-start;}
.renk-kume>span{max-width:100%;overflow:hidden;text-overflow:ellipsis;}
.renk-kume .renk-gizli{display:none;}
.renk-kume.acik .renk-gizli{display:block;}
.renk-daha{font-size:10px;color:var(--muted);border:1px dashed var(--border);border-radius:6px;padding:1px 7px;cursor:pointer;white-space:nowrap;user-select:none;}
.renk-daha:hover{color:var(--text);border-color:var(--muted);}
.renk-kume.acik .renk-daha .rd-ac{display:none;}
.renk-kume:not(.acik) .renk-daha .rd-kapa{display:none;}
.gecikme {background:rgba(252,129,129,.15);border:1px solid rgba(252,129,129,.4);color:#fc8181;border-radius:10px;font-size:10px;padding:1px 7px;margin-left:5px;}
.yakin {background:rgba(246,173,85,.15); border:1px solid rgba(246,173,85,.4); color:#f6ad55; border-radius:10px;font-size:10px;padding:1px 7px;margin-left:5px;}
.kaldi-yesil{background:rgba(104,211,145,.15);border:1px solid rgba(104,211,145,.4);color:#68d391;border-radius:10px;font-size:10px;padding:1px 7px;margin-left:5px;}
/* ── Ana Sekme ── */
.main-tabs{display:flex;gap:0;border-bottom:2px solid var(--border);padding:0 20px;background:var(--panel);flex-shrink:0;}
.main-tab-btn{padding:10px 20px;font-size:12px;font-weight:700;letter-spacing:.5px;cursor:pointer;border:none;background:transparent;color:var(--muted);border-bottom:2px solid transparent;margin-bottom:-2px;transition:color .15s,border-color .15s;}
.main-tab-btn.active{color:var(--primary);border-bottom-color:var(--primary);}
.main-tab-btn:hover:not(.active){color:var(--text);}
/* ── Tanımlar Sekmesi ── */
#tanimlarPanel{display:none;flex:1;min-height:0;overflow:hidden;flex-direction:row;}
.tnm-nav{width:180px;flex-shrink:0;border-right:1px solid var(--border);padding:12px 8px;display:flex;flex-direction:column;gap:2px;background:var(--panel);overflow-y:auto;}
.tnm-nav-btn{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:8px;border:none;background:transparent;color:var(--muted);font-size:12px;font-weight:600;cursor:pointer;text-align:left;width:100%;transition:background .15s,color .15s;}
.tnm-nav-btn:hover{background:var(--row-hover);color:var(--text);}
.tnm-nav-btn.active{background:rgba(99,179,237,0.15);color:var(--primary);}
.tnm-content{flex:1;overflow-y:auto;padding:20px 24px;}
.tnm-section{display:none;}
.tnm-section.active{display:block;}
#tnmSec-urun.active{display:flex;flex-direction:column;flex:1;padding:0;overflow:hidden;}
.tnm-title{font-size:16px;font-weight:700;color:var(--text);margin-bottom:16px;padding-bottom:10px;border-bottom:1px solid var(--border);}
.up-nav-btn{display:flex;align-items:center;gap:6px;padding:6px 13px;border-radius:8px;border:1px solid var(--border);background:transparent;color:var(--text-soft);font-size:12px;font-weight:600;cursor:pointer;white-space:nowrap;transition:all .15s;}
.up-nav-btn:hover{color:var(--text);border-color:rgba(99,179,237,0.4);background:rgba(99,179,237,0.07);}
.up-nav-btn.active{background:rgba(99,179,237,0.15);color:var(--primary);border-color:var(--primary);}
/* Luu Planlıyor: kuyruk kartları + otonom anahtarı (2026-08-16) */
/* Mini Luu — sesli mod açıkken Ana Panel dışında sağ altta (2026-08-16) */
.luu-mini{position:fixed;right:18px;bottom:18px;z-index:99990;width:250px;height:auto;min-width:210px;min-height:170px;max-width:min(92vw,560px);max-height:82vh;resize:both;overflow:hidden;display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 10px 8px;border-radius:16px;background:rgba(6,14,26,.86);border:1px solid rgba(99,179,237,.35);box-shadow:0 10px 30px rgba(0,0,0,.45);backdrop-filter:blur(6px);--jr-cekirdek:104px;}
.luu-mini-core{position:relative;width:104px;height:104px;display:grid;place-items:center;}
.luu-mini-core .jr-core-wrap{position:relative;left:auto;top:auto;transform:none;width:104px;}
/* Mini pencerede yüz ~%45 küçülür ama non-scaling-stroke yüzünden kaş/ağız/göz
çizgileri aynı px kalıyordu → hatlar kalın ve sert görünüyordu. Çizgi
kalınlıkları çekirdek çapıyla orantılanır (2026-08-24). */
.luu-mini-core{--luu-cizgi-k:.47;} /* 104px / 220px = yuzun kucultme orani */
.luu-mini-core .lb-goz path.kas,.luu-mini-core .lb-goz path.agiz{
filter:none; /* küçük ölçekte gölge hatları bulanıklaştırıyordu */
stroke-linecap:round;stroke-linejoin:round;}
/* Metin: kart genisledikce buyur, uzun yanit KAYDIRILIR (eskiden kirpiliyor ve
bosluksuz tablo metni kartin disina tasiyordu — kullanici bildirdi 2026-08-19) */
.luu-mini-metin{flex:1 1 auto;width:100%;box-sizing:border-box;font-size:11px;line-height:1.4;
color:var(--text-soft,#cbd5e0);text-align:left;min-height:32px;max-height:none;overflow-y:auto;
overflow-x:hidden;overflow-wrap:anywhere;word-break:break-word;white-space:pre-wrap;opacity:.9;
padding-right:2px;scrollbar-width:thin;}
.luu-mini-core{flex:0 0 auto;}
.luu-mini-metin.yeni{animation:luuMiniYeni .4s ease;}
@keyframes luuMiniYeni{from{opacity:.2;transform:translateY(3px)}to{opacity:.9;transform:none}}
.luu-mini-giris{display:flex;gap:5px;width:100%;}
.luu-mini-giris input{flex:1;min-width:0;font-size:11.5px;padding:5px 8px;border-radius:9px;border:1px solid var(--border);background:var(--input-bg);color:var(--text);}
.luu-mini-giris input:focus{outline:none;border-color:var(--primary);}
.luu-mini-btns{display:flex;gap:6px;}
.luu-mini-btns .btn{font-size:10.5px;padding:2px 8px;}
body.jr-hafif .luu-mini{backdrop-filter:none;}
.luu-kuyruk{display:flex;gap:8px;overflow-x:auto;padding:4px 2px 10px;scrollbar-width:thin;scrollbar-color:rgba(99,179,237,.45) rgba(255,255,255,.04);}
.luu-kuyruk::-webkit-scrollbar{height:6px;}
.luu-kuyruk::-webkit-scrollbar-track{background:rgba(255,255,255,.04);border-radius:3px;}
.luu-kuyruk::-webkit-scrollbar-thumb{background:rgba(99,179,237,.35);border-radius:3px;}
.luu-kuyruk::-webkit-scrollbar-thumb:hover{background:rgba(99,179,237,.7);}
.luu-kart{flex:0 0 236px;border:1px solid var(--border);border-radius:10px;background:var(--panel);padding:6px 8px;cursor:pointer;transition:border-color .15s,transform .15s;}
.lk-ust{display:flex;gap:7px;align-items:stretch;}
.lk-img{width:46px;height:46px;object-fit:cover;border-radius:6px;flex-shrink:0;background:var(--input-bg);}
.lk-bos{display:flex;align-items:center;justify-content:center;font-size:18px;}
.lk-bilgi{min-width:0;flex:1;display:flex;flex-direction:column;justify-content:space-between;}
.lk-satir{display:flex;align-items:baseline;justify-content:space-between;gap:6px;min-width:0;line-height:1.25;}
.lk-po{font-size:11.5px;font-weight:800;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
/* DT-056: Sipariş No (plm_id) — planlama panosunda ve üretici tarih atama
ekranında var, Luu Planlıyor kartlarında yoktu. Model kodunun yanında
ikincil bir künye olarak durur. */
.lk-plm{font-size:9.5px;font-weight:700;color:var(--primary);background:rgba(99,179,237,.12);
border-radius:5px;padding:0 5px;margin-left:5px;white-space:nowrap;flex-shrink:0;}
.lk-gun{font-size:9.5px;font-weight:800;white-space:nowrap;flex-shrink:0;}
.lk-ikincil .lk-cari{font-size:10px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.lk-adet{font-size:10.5px;font-weight:700;color:var(--text-soft,#cbd5e0);white-space:nowrap;flex-shrink:0;}
.lk-durum{font-size:9.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.lk-tarih{font-size:9.5px;color:var(--muted);white-space:nowrap;flex-shrink:0;}
.lk-son{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-top:4px;min-width:0;}
.lk-meta{font-size:9px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;}
.lk-cipler{display:flex;gap:3px;flex-shrink:0;}
.luu-kart:hover{border-color:rgba(99,179,237,.55);transform:translateY(-1px);}
.luu-kart.aktif{border-color:#68d391;box-shadow:0 0 0 2px rgba(104,211,145,.25);}
.luu-kart.atlandi{opacity:.55;border-style:dashed;}
.luu-switch{display:inline-flex;align-items:center;gap:7px;cursor:pointer;user-select:none;}
.luu-switch input{display:none;}
.luu-switch-track{width:34px;height:18px;border-radius:9px;background:rgba(160,174,192,.35);position:relative;transition:background .2s;}
.luu-switch-knob{position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:#fff;transition:left .2s;}
.luu-switch input:checked + .luu-switch-track{background:#68d391;}
.luu-switch input:checked + .luu-switch-track .luu-switch-knob{left:18px;}
.tnm-card{background:var(--panel);border:1px solid var(--border);border-radius:10px;padding:16px;margin-bottom:12px;}
.tnm-row{display:flex;align-items:center;gap:8px;padding:9px 12px;border-radius:8px;border:1px solid var(--border);background:var(--input-bg);margin-bottom:6px;transition:border-color .15s;}
.tnm-row:hover{border-color:rgba(99,179,237,0.4);}
.tnm-add-row{display:flex;gap:8px;margin-bottom:16px;align-items:center;flex-wrap:wrap;}
.cari-tip-chip{display:inline-flex;align-items:center;gap:4px;padding:2px 8px;border-radius:10px;font-size:10px;font-weight:700;}
.cari-tip-uretici{background:rgba(104,211,145,.15);border:1px solid rgba(104,211,145,.3);color:#68d391;}
.cari-tip-tedarikci{background:rgba(99,179,237,.15);border:1px solid rgba(99,179,237,.3);color:#63b3ed;}
.cari-tip-musteri{background:rgba(246,173,85,.15);border:1px solid rgba(246,173,85,.3);color:#f6ad55;}
.renk-swatch{width:22px;height:22px;border-radius:50%;border:2px solid rgba(255,255,255,0.15);flex-shrink:0;cursor:pointer;}
.tnm-empty{text-align:center;padding:16px 20px;color:var(--muted);font-size:13px;}
/* ── Durum & Proses Tanımları: sabit sütunlu tablo ── */
.durum-tbl{border:1px solid var(--border);border-radius:10px;overflow:auto;background:var(--panel);}
.durum-cols{display:grid;grid-template-columns:26px 170px 50px 190px 42px 175px 150px 64px minmax(130px,1fr) 36px;gap:8px;align-items:center;min-width:1000px;}
.durum-thead{padding:9px 12px;font-size:9.5px;font-weight:800;letter-spacing:.7px;color:var(--muted);text-transform:uppercase;border-bottom:1px solid var(--border);background:var(--input-bg);position:sticky;top:0;z-index:1;}
.durum-thead span[title]{cursor:help;text-decoration:underline dotted;text-underline-offset:3px;}
.durum-row{padding:6px 12px;border-bottom:1px solid var(--border);transition:background .15s;}
.durum-row:last-child{border-bottom:none;}
.durum-row:hover{background:var(--row-hover);}
.durum-row.proses{background:rgba(159,122,234,0.06);}
.durum-row.proses:hover{background:rgba(159,122,234,0.12);}
.durum-help{display:grid;grid-template-columns:110px 1fr;gap:4px 12px;font-size:11px;color:var(--muted);padding:10px 14px;border:1px solid var(--border);border-radius:8px;background:var(--input-bg);margin-bottom:12px;line-height:1.5;}
.durum-help b{color:var(--text-soft);font-size:11px;white-space:nowrap;}
.cari-detail-panel{display:none;position:fixed;inset:0;z-index:8000;background:rgba(0,0,0,.6);align-items:center;justify-content:center;}
.cari-detail-panel.open{display:flex;}
.cari-detail-box{background:var(--panel);border:1px solid var(--border);border-radius:14px;padding:24px;width:520px;max-width:95vw;max-height:90vh;overflow-y:auto;}
.cari-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.cari-form-full{grid-column:1/-1;}
/* ── Hammadde Stok ── */
.hm-stok-tbl{width:100%;border-collapse:collapse;font-size:12px;}
.hm-stok-tbl thead th{padding:8px 10px;text-align:left;font-size:10px;font-weight:700;color:#f472b6;letter-spacing:.8px;text-transform:uppercase;background:var(--panel);position:sticky;top:0;z-index:2;border-bottom:2px solid var(--border);}
.hm-stok-tbl td{padding:8px 10px;border-bottom:1px solid rgba(99,179,237,0.06);vertical-align:top;}
.hm-sekme{background:none;border:1px solid transparent;border-bottom:none;border-radius:8px 8px 0 0;
padding:6px 14px;font-size:12.5px;font-weight:600;color:var(--muted);cursor:pointer;}
.hm-sekme:hover{color:var(--text);}
.hm-sekme.aktif{background:var(--panel);border-color:var(--border);color:var(--primary);}
.hm-stok-row{transition:background .12s;}
.hm-stok-row:hover td{background:var(--row-hover);}
.hm-stok-row.hm-selected td{background:rgba(99,179,237,0.12);}
.hm-yetersiz td{background:rgba(252,129,129,0.05);}
.hm-yetersiz:hover td{background:rgba(252,129,129,0.1);}
.hm-izle-btn{background:none;border:1px solid var(--border);border-radius:5px;cursor:pointer;font-size:13px;padding:2px 5px;opacity:.5;transition:opacity .15s,background .15s;}
.hm-izle-btn:hover{opacity:1;background:rgba(99,179,237,0.12);}
.hm-izle-btn.active{opacity:1;background:rgba(99,179,237,0.2);border-color:rgba(99,179,237,0.5);}
.hm-act-btn{background:none;border:1px solid var(--border);border-radius:5px;cursor:pointer;font-size:12px;line-height:1;padding:3px 6px;margin:0 1px;color:var(--text);font-weight:700;transition:background .15s;}
.hm-act-btn:hover{background:rgba(99,179,237,0.14);}
.hm-more-btn{display:inline-block;margin-top:3px;font-size:10px;color:var(--primary);cursor:pointer;padding:1px 6px;border:1px solid rgba(99,179,237,0.3);border-radius:8px;}
.hm-more-btn:hover{background:rgba(99,179,237,0.1);}
.hm-fiş-modal .modal{max-width:500px;width:95vw;}
.hm-fiş-field{margin-bottom:12px;}
.hm-fiş-field label{display:block;font-size:11px;color:var(--muted);margin-bottom:4px;font-weight:600;letter-spacing:.5px;text-transform:uppercase;}
.hm-fiş-field input,.hm-fiş-field select,.hm-fiş-field textarea{width:100%;box-sizing:border-box;}
/* box-sizing AÇIKÇA yazılı: sürükleme ölçülen genişliği geri yazıyor, kutu
modeli content-box olsaydı her sürüklemede padding kadar kayardı. */
.hm-panel{display:none;flex-direction:column;width:340px;flex-shrink:0;border-left:1px solid var(--border);padding:16px;overflow:hidden;position:relative;box-sizing:border-box;}
/* Sol kenardan sürüklenerek genişletilir; genişlik cihazda saklanır. */
.hm-panel-tut{position:absolute;left:0;top:0;bottom:0;width:7px;cursor:col-resize;z-index:3;}
.hm-panel-tut::after{content:'';position:absolute;left:2px;top:0;bottom:0;width:3px;background:transparent;transition:background .15s;}
.hm-panel-tut:hover::after,.hm-panel-tut.aktif::after{background:rgba(99,179,237,.55);}
/* KADEMELİ BİLGİ: panel genişledikçe alt kademeler açılır. Sınıf değişimi
yeniden çizimden ucuz — sürükleme sırasında akıcı kalsın diye böyle. */
.hm-panel .hm-k2,.hm-panel .hm-k3{display:none;}
.hm-panel.hm-k2on .hm-k2{display:block;}
.hm-panel.hm-k3on .hm-k3{display:block;}
.hm-hrk-git{background:none;border:1px solid var(--border);border-radius:6px;color:var(--primary);
font-size:10px;cursor:pointer;padding:1px 7px;white-space:nowrap;}
.hm-hrk-git:hover{border-color:var(--primary);background:rgba(99,179,237,.12);}
/* ── Satır no ── */
.td-no{font-size:11px;color:var(--muted);text-align:center;width:36px;font-weight:600;}
/* ── Model resim thumbnail ── */
.model-thumb-wrap{display:flex;flex-wrap:wrap;gap:6px;align-items:center;min-width:70px;}
.model-thumb{
width:80px;height:80px;border-radius:12px;object-fit:cover;
border:1px solid rgba(99,179,237,0.2);cursor:pointer;transition:transform .2s;
display:block;flex-shrink:0;
}
.model-thumb:hover{transform:scale(1.05);border-color:rgba(99,179,237,0.6);}
.model-thumb-empty{
width:80px;height:80px;border-radius:12px;
background:rgba(99,179,237,0.06);border:1px dashed rgba(99,179,237,0.2);
display:flex;align-items:center;justify-content:center;
font-size:24px;cursor:pointer;transition:all .2s;flex-shrink:0;
}
.model-thumb-empty:hover{background:rgba(99,179,237,0.12);border-color:rgba(99,179,237,0.5);}
/* Küçük versiyon (çok renk varsa) */
.model-thumb-sm.model-thumb{width:64px;height:64px;border-radius:10px;}
.model-thumb-sm.model-thumb-empty{width:64px;height:64px;border-radius:10px;font-size:20px;}
.col-menu {
display: none; position: fixed;
background: var(--panel); border: 1px solid var(--border); border-radius: 12px;
padding: 14px; box-shadow: 0 10px 40px rgba(0,0,0,0.7); z-index: 9999;
grid-template-columns: 1fr 1fr; gap: 4px 16px; min-width: 300px;
}
.col-menu.show { display: grid; }
.col-item {
display: flex; align-items: center; gap: 8px;
font-size: 13px; color: var(--text); cursor: pointer; user-select: none;
padding: 5px 6px; border-radius: 6px; transition: background .15s;
}
.col-item:hover { background: rgba(99,179,237,0.08); }
.col-item:last-child { margin-bottom: 0; }
.col-item input { cursor: pointer; width:16px; height:16px; }
/* ── Model resim büyütme ── */
.img-preview-overlay{
display:none;position:fixed;inset:0;z-index:600;
background:rgba(0,0,0,0.85);backdrop-filter:blur(8px);
align-items:center;justify-content:center;
}
.img-preview-overlay.open{display:flex;}
.img-preview-box{
background:var(--panel);border:1px solid rgba(99,179,237,0.2);
border-radius:20px;padding:24px;text-align:center;position:relative;max-width:90vw;
}
.img-preview-box img{max-width:420px;max-height:420px;border-radius:12px;display:block;margin:0 auto;}
.img-preview-title{font-size:13px;color:var(--muted);margin-bottom:14px;font-weight:700;letter-spacing:1px;}
.img-preview-close{position:absolute;top:14px;right:18px;font-size:20px;cursor:pointer;color:var(--muted);}
.img-preview-close:hover{color:var(--text);}
.img-preview-actions{display:flex;gap:10px;justify-content:center;margin-top:14px;}
.img-upload-input{display:none;}
/* ── BOM Modal ── */
.bom-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.7);z-index:500;align-items:center;justify-content:center;}
.bom-overlay.open{display:flex;}
.bom-modal{background:var(--panel);border:1px solid rgba(99,179,237,0.2);border-radius:18px;padding:28px;width:fit-content;min-width:420px;max-width:95vw;max-height:88vh;overflow-y:auto;overflow-x:hidden;position:relative;}
.bom-modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;}
.bom-modal-title{font-size:15px;font-weight:800;color:var(--text);}
.bom-modal-close{font-size:20px;cursor:pointer;color:var(--muted);background:none;border:none;line-height:1;}
.bom-modal-close:hover{color:var(--text);}
.ut-inp{background:rgba(255,255,255,0.05);border:1px solid var(--border);border-radius:5px;color:var(--text);font-size:12px;padding:4px 6px;text-align:center;width:68px;transition:border-color .15s;}
.ut-inp:focus{outline:none;border-color:var(--primary);background:rgba(99,179,237,0.08);}
.ut-inp::placeholder{color:var(--placeholder);}
.stok-chip{display:inline-flex;align-items:center;gap:3px;background:rgba(104,211,145,0.1);color:var(--accent);border:1px solid rgba(104,211,145,0.25);border-radius:5px;padding:2px 8px;font-size:11px;font-weight:600;cursor:pointer;user-select:none;white-space:nowrap;}
.stok-chip:hover{background:rgba(104,211,145,0.2);}
.stok-chip.empty{background:rgba(255,255,255,0.04);color:var(--muted);border-color:var(--border);cursor:default;}
.bom-inp{background:rgba(99,179,237,0.06);border:1px solid rgba(99,179,237,0.15);border-radius:6px;color:var(--text);font-size:12px;padding:5px 7px;outline:none;transition:border-color .2s;}
.bom-inp:focus{border-color:var(--primary);}
.bom-inp::placeholder{color:var(--muted);}
.bom-inp option{background:var(--panel);color:var(--text);}
#nsComboDropdown{position:fixed;z-index:99999;background:var(--panel);border:1px solid var(--border);border-radius:8px;box-shadow:0 8px 32px rgba(0,0,0,.5);max-height:220px;overflow-y:auto;display:none;}
.ns-combo-item{padding:7px 10px;cursor:pointer;display:flex;align-items:center;gap:8px;font-size:12px;white-space:nowrap;}
.ns-combo-item:hover,.ns-combo-item.active{background:rgba(99,179,237,.15);}
.ns-combo-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0;border:1px solid rgba(255,255,255,.2);}
.ns-combo-sub{font-size:10px;color:var(--muted);margin-left:2px;}
#dpPopup{position:fixed;z-index:99998;background:var(--panel);border:1px solid var(--border);border-radius:10px;box-shadow:0 8px 32px rgba(0,0,0,.5);padding:12px;width:270px;display:none;user-select:none;}
.dp-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;font-weight:600;font-size:13px;}
.dp-nav{background:none;border:1px solid var(--border);border-radius:6px;color:var(--text);cursor:pointer;padding:2px 9px;font-size:14px;line-height:1.4;}
.dp-days-hdr,.dp-grid{display:grid;grid-template-columns:26px repeat(7,1fr);gap:2px;text-align:center;}
.dp-week{font-size:9px;font-weight:700;color:var(--muted);display:flex;align-items:center;justify-content:center;border-right:1px solid var(--border);margin-right:2px;}
.dp-week-hdr{font-size:9px;font-weight:700;color:var(--primary);}
.dp-days-hdr{font-size:10px;color:var(--muted);margin-bottom:4px;}
.dp-day{padding:5px 0;border-radius:6px;font-size:12px;cursor:pointer;}
.dp-day:hover{background:rgba(99,179,237,.2);}
.dp-today{color:var(--primary);font-weight:700;}
.dp-sel{background:var(--primary)!important;color:#fff;font-weight:700;}
.dp-inp-wrap{position:relative;}
.dp-icon{position:absolute;right:8px;top:50%;transform:translateY(-50%);color:var(--muted);pointer-events:none;font-size:13px;}
.bom-footer{display:flex;justify-content:flex-end;gap:10px;margin-top:16px;padding-top:14px;border-top:1px solid var(--border);}
.bom-add-row{width:100%;padding:8px;border-radius:8px;background:rgba(99,179,237,0.05);border:1px dashed rgba(99,179,237,0.3);color:var(--primary);font-size:12px;cursor:pointer;margin-bottom:4px;transition:all .2s;}
.bom-add-row:hover{background:rgba(99,179,237,0.1);}
.bom-th{padding:8px 8px;text-align:left;font-size:9px;font-weight:700;color:var(--muted);letter-spacing:1px;text-transform:uppercase;border-bottom:1px solid var(--border);background:rgba(99,179,237,0.04);}
.bom-td{padding:5px 6px;border-bottom:1px solid rgba(99,179,237,0.05);}
.renk-bazli-hint{font-size:9px;color:var(--muted);margin-top:4px;}
.bom-ac-list{background:var(--panel);border:1px solid var(--border);border-radius:8px;max-height:160px;overflow-y:auto;box-shadow:0 8px 24px rgba(0,0,0,0.6);min-width:140px;}
.bom-ac-item{padding:7px 10px;font-size:12px;cursor:pointer;color:var(--text);}
.bom-ac-item:hover{background:rgba(99,179,237,0.12);}
/* ── BOM Yönetim Paneli ── */
.bomy-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.7);z-index:600;align-items:center;justify-content:center;}
.bomy-overlay.open{display:flex;}
.bomy-modal{background:var(--panel);border:1px solid rgba(99,179,237,0.2);border-radius:18px;padding:0;width:1140px;max-width:97vw;max-height:90vh;display:flex;flex-direction:column;overflow:hidden;}
.bomy-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px 0;}
.bomy-title{font-size:15px;font-weight:800;color:var(--text);}
.bomy-tabs{display:flex;padding:14px 24px 0;border-bottom:1px solid var(--border);flex-shrink:0;}
.bomy-tab{padding:8px 20px;font-size:12px;font-weight:600;color:var(--muted);cursor:pointer;border:none;border-bottom:2px solid transparent;background:none;transition:all .15s;}
.bomy-tab:hover{color:var(--text);}
.bomy-tab.active{color:var(--primary);border-bottom-color:var(--primary);}
.bomy-body{flex:1;overflow:hidden;display:flex;flex-direction:column;min-height:0;}
.bomy-pane{display:none;flex:1;overflow:hidden;flex-direction:column;padding:20px 24px;min-height:0;}
.bomy-pane.active{display:flex;}
.bomy-two-col{display:flex;gap:16px;flex:1;overflow:hidden;min-height:0;}
.bomy-col{display:flex;flex-direction:column;gap:8px;flex:1;overflow:hidden;}
.bomy-col-title{font-size:10px;font-weight:700;color:var(--muted);letter-spacing:1px;text-transform:uppercase;padding-bottom:6px;border-bottom:1px solid var(--border);flex-shrink:0;}
.bomy-list{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:4px;}
.bomy-item{padding:8px 12px;border-radius:8px;border:1px solid transparent;font-size:12px;cursor:pointer;color:var(--text);transition:all .15s;display:flex;align-items:center;justify-content:space-between;}
.bomy-item:hover{background:rgba(99,179,237,0.08);border-color:rgba(99,179,237,0.2);}
.bomy-item.active{background:rgba(99,179,237,0.14);border-color:rgba(99,179,237,0.4);color:var(--primary);font-weight:700;}
.bomy-item-del{background:none;border:none;color:var(--danger);cursor:pointer;font-size:13px;opacity:0;transition:opacity .15s;padding:0 2px;}
.bomy-item:hover .bomy-item-del{opacity:1;}
.bomy-add-row{display:flex;gap:8px;margin-top:8px;flex-shrink:0;}
.bomy-inp{background:rgba(99,179,237,0.06);border:1px solid rgba(99,179,237,0.2);border-radius:6px;color:var(--text);font-size:12px;padding:6px 10px;outline:none;transition:border-color .2s;}
.bomy-inp:focus{border-color:var(--primary);}
.bomy-inp::placeholder{color:var(--muted);}
.bomy-divider{width:1px;background:var(--border);flex-shrink:0;}
.bomy-empty{padding:20px;text-align:center;color:var(--muted);font-size:12px;}
.bomy-table-wrap{flex:1;overflow:auto;min-height:0;}
.bomy-tbl{width:100%;border-collapse:separate;border-spacing:0;font-size:12px;}
.bomy-tbl th{padding:8px 10px;text-align:left;font-size:10px;font-weight:700;color:var(--muted);letter-spacing:1px;text-transform:uppercase;background:var(--panel);white-space:nowrap;position:sticky;top:0;z-index:2;box-shadow:0 1px 0 var(--border);}
.bomy-tbl th.sortable{cursor:pointer;user-select:none;transition:color .15s;}
.bomy-tbl th.sortable:hover{color:var(--primary);}
.bomy-sort-ind{margin-left:4px;font-style:normal;opacity:0.3;font-size:9px;}
.bomy-sort-ind.active{opacity:1;color:var(--primary);}
.bomy-tbl td{padding:5px 6px;border-bottom:1px solid rgba(99,179,237,0.05);}
/* Satır takibi: bir koyu bir açık zemin (zebra) — hover üzerine biner */
.bomy-tbl tbody tr:nth-child(even) td{background:rgba(99,179,237,0.045);}
.bomy-tbl tbody tr:hover td{background:rgba(99,179,237,0.11);}
.bomy-cell-inp{background:var(--input-bg);border:1px solid transparent;border-radius:5px;color:var(--text);font-size:11px;padding:4px 7px;outline:none;width:100%;transition:border-color .15s;}
.bomy-cell-inp:focus{border-color:var(--primary);}
.bomy-matrix-wrap{flex:1;overflow:auto;min-height:0;}
.bomy-matrix{border-collapse:collapse;font-size:11px;white-space:nowrap;}
.bomy-matrix th{padding:6px 10px;font-size:9px;font-weight:700;color:var(--muted);letter-spacing:.8px;text-transform:uppercase;border-bottom:1px solid var(--border);border-right:1px solid var(--border);background:var(--panel);position:sticky;top:0;}
.bomy-matrix td{padding:5px 8px;border-bottom:1px solid rgba(99,179,237,0.05);border-right:1px solid rgba(99,179,237,0.05);text-align:center;}
.bomy-matrix .ham-name{text-align:left;font-size:11px;font-weight:600;color:var(--text);padding:6px 14px;white-space:nowrap;position:sticky;left:0;background:var(--panel);z-index:2;}
.bomy-matrix .kat-header{max-width:100px;overflow:hidden;text-overflow:ellipsis;font-size:9px;}
.bomy-matrix .group-header{background:rgba(99,179,237,0.06);font-size:10px;color:var(--primary);text-align:center;}
.bomy-matrix input[type=checkbox]{width:14px;height:14px;cursor:pointer;accent-color:var(--primary);}
.bomy-matrix tr:hover td{background:rgba(99,179,237,0.04);}
.bomy-matrix tr:hover .ham-name{background:rgba(14,28,58,0.99);}
.bomy-panel-footer{display:flex;justify-content:flex-end;gap:10px;padding:12px 0 0;flex-shrink:0;}
/* ══ ÜRÜN KARTLARI ══════════════════════════════════════════ */
.uk-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,0.75);z-index:700;align-items:center;justify-content:center;}
.uk-overlay.open{display:flex;}
.uk-modal{background:var(--panel);border:1px solid var(--border);border-radius:16px;width:1260px;max-width:98vw;height:88vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 24px 80px rgba(0,0,0,0.8);}
.uk-header{display:flex;align-items:center;justify-content:space-between;padding:16px 22px;border-bottom:1px solid var(--border);flex-shrink:0;}
.uk-title{font-size:15px;font-weight:700;color:var(--text);}
.uk-body{display:flex;flex:1;overflow:hidden;}
/* Sol liste */
.uk-list-panel{width:260px;flex-shrink:0;border-right:1px solid var(--border);display:flex;flex-direction:column;overflow:hidden;background:var(--panel);}
.uk-list-search{padding:10px 12px;border-bottom:1px solid var(--border);flex-shrink:0;background:var(--panel);}
.uk-list-search input{width:100%;background:var(--input-bg);border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:12px;padding:7px 10px;outline:none;}
.uk-list-search input:focus{border-color:var(--primary);}
.uk-list-scroll{flex:1;overflow-y:auto;background:var(--panel);}
.uk-list-item{padding:10px 14px;cursor:pointer;border-bottom:1px solid var(--diff-sep);display:flex;align-items:center;gap:8px;transition:background .15s;}
.uk-list-item:hover{background:var(--row-hover);}
.uk-list-item.active{background:var(--row-hover);background:color-mix(in srgb, var(--primary) 14%, transparent);border-left:3px solid var(--primary);}
.uk-list-item .uk-item-name{font-size:12px;font-weight:600;color:var(--text);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.uk-list-item .uk-item-sub{font-size:10px;color:var(--muted);}
.uk-bom-badge{font-size:9px;font-weight:700;padding:2px 6px;border-radius:10px;flex-shrink:0;}
.uk-bom-badge.ok{background:rgba(104,211,145,0.15);background:color-mix(in srgb, var(--accent) 14%, transparent);color:var(--accent);}
.uk-bom-badge.warn{background:rgba(252,129,129,0.15);background:color-mix(in srgb, var(--danger) 14%, transparent);color:var(--danger);}
/* Sağ detay */
.uk-detail{flex:1;display:flex;flex-direction:column;overflow:hidden;}
.uk-detail-empty{flex:1;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:13px;}
.uk-tabs{display:flex;border-bottom:1px solid var(--border);padding:0 20px;flex-shrink:0;}
.uk-tab{padding:12px 18px;font-size:12px;font-weight:600;color:var(--muted);background:none;border:none;border-bottom:2px solid transparent;cursor:pointer;transition:all .2s;}
.uk-tab.active{color:var(--primary);border-bottom-color:var(--primary);}
.uk-tab-pane{display:none;flex:1;overflow:auto;padding:20px;}
.uk-tab-pane.active{display:block;}
/* Detay formu */
.uk-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 24px;}
.uk-form-group{display:flex;flex-direction:column;gap:5px;}
.uk-form-group.full{grid-column:1/-1;}
.uk-label{font-size:10px;font-weight:700;color:var(--muted);letter-spacing:.8px;text-transform:uppercase;}
.uk-input{background:rgba(99,179,237,0.06);border:1px solid rgba(99,179,237,0.2);border-radius:8px;color:var(--text);font-size:13px;padding:8px 12px;outline:none;transition:border-color .2s;}
.uk-input:focus{border-color:var(--primary);}
/* Hammaddeler sekmesi */
.uk-ham-tbl{width:100%;border-collapse:separate;border-spacing:0;font-size:12px;}
.uk-ham-tbl th{padding:8px 10px;text-align:left;font-size:10px;font-weight:700;color:var(--muted);letter-spacing:.8px;text-transform:uppercase;background:var(--panel);position:sticky;top:0;z-index:2;box-shadow:0 1px 0 var(--border);}
.uk-ham-tbl td{padding:7px 10px;border-bottom:1px solid rgba(99,179,237,0.05);}
.uk-ham-tbl tbody tr:nth-child(even) td{background:rgba(99,179,237,0.045);}
.uk-ham-tbl tbody tr:hover td{background:rgba(99,179,237,0.11);}
.uk-ham-tbl input[type=checkbox]{width:15px;height:15px;cursor:pointer;accent-color:var(--primary);}
/* BOM sekmesi */
.uk-bom-tbl{width:100%;border-collapse:separate;border-spacing:0;font-size:12px;}
.uk-bom-tbl th{padding:8px 10px;text-align:left;font-size:10px;font-weight:700;color:var(--muted);letter-spacing:.8px;text-transform:uppercase;background:var(--panel);position:sticky;top:0;z-index:2;box-shadow:0 1px 0 var(--border);}
.uk-bom-tbl td{padding:6px 8px;border-bottom:1px solid rgba(99,179,237,0.05);}
.uk-bom-tbl tbody tr:nth-child(even) td{background:rgba(99,179,237,0.045);}
.uk-bom-tbl tbody tr:hover td{background:rgba(99,179,237,0.11);}
.uk-bom-tbl tr.total-row td{border-top:1px solid var(--border);font-weight:700;color:var(--primary);}
.uk-num-inp{background:rgba(99,179,237,0.06);border:1px solid transparent;border-radius:5px;color:var(--text);font-size:12px;padding:4px 7px;outline:none;width:80px;text-align:right;transition:border-color .15s;}
.uk-num-inp:focus{border-color:rgba(99,179,237,0.4);}
.uk-detail-footer{display:flex;justify-content:flex-end;gap:10px;padding:12px 20px;border-top:1px solid var(--border);flex-shrink:0;}
/* Ürün resim thumbnail */
.uk-img-thumb{width:90px;height:90px;object-fit:cover;border-radius:10px;border:2px solid rgba(99,179,237,0.2);cursor:pointer;transition:border-color .2s,transform .2s;}
.uk-img-thumb:hover{border-color:var(--primary);transform:scale(1.05);}
.uk-img-empty{width:90px;height:90px;border-radius:10px;border:2px dashed rgba(99,179,237,0.2);display:flex;align-items:center;justify-content:center;font-size:26px;color:rgba(99,179,237,0.3);cursor:pointer;}
/* Hover büyük önizleme */
#ukImgHover{display:none;position:fixed;z-index:9999;pointer-events:none;padding:8px;background:var(--panel);border:1px solid rgba(99,179,237,0.3);border-radius:14px;box-shadow:0 16px 48px rgba(0,0,0,0.7);}
#ukImgHover img{display:block;max-width:420px;max-height:460px;border-radius:10px;object-fit:contain;}
/* Sipariş satırı BOM badge */
.order-bom-badge{display:inline-flex;align-items:center;gap:4px;font-size:10px;font-weight:700;padding:3px 8px;border-radius:10px;cursor:pointer;transition:opacity .15s;}
.order-bom-badge:hover{opacity:0.8;}
.order-bom-badge.ok{background:rgba(104,211,145,0.15);color:#68d391;border:1px solid rgba(104,211,145,0.3);}
.order-bom-badge.warn{background:rgba(252,129,129,0.12);color:#fc8181;border:1px solid rgba(252,129,129,0.25);}
/* ── Genel butonlar ── */
.btn{
padding:7px 16px;border-radius:8px;font-size:12px;font-weight:600;cursor:pointer;
background:rgba(99,179,237,0.08);border:1px solid rgba(99,179,237,0.25);
color:var(--text-soft);transition:all .15s;white-space:nowrap;
}
.btn:hover{background:rgba(99,179,237,0.16);color:var(--text);}
.btn-primary{
background:rgba(66,153,225,0.18);border-color:rgba(99,179,237,0.5);color:var(--primary);
}
.btn-primary:hover{background:rgba(66,153,225,0.32);color:#90cdf4;}
.btn-success{
background:rgba(104,211,145,0.12);border-color:rgba(104,211,145,0.4);color:var(--accent);
}
.btn-success:hover{background:rgba(104,211,145,0.24);color:#9ae6b4;}
.btn-warn{
background:rgba(246,173,85,0.12);border-color:rgba(246,173,85,0.4);color:#f6ad55;
}
.btn-warn:hover{background:rgba(246,173,85,0.24);}
.btn-danger{
background:rgba(252,129,129,0.12);border-color:rgba(252,129,129,0.4);color:var(--danger);
}
.btn-danger:hover{background:rgba(252,129,129,0.24);}
/* ── Küçük butonlar ── */
.btn-xs{
padding:4px 9px;border-radius:6px;font-size:11px;cursor:pointer;
background:rgba(99,179,237,0.08);border:1px solid rgba(99,179,237,0.2);
color:var(--text-soft);text-decoration:none;display:inline-block;
transition:all .15s;
}
.btn-xs:hover{background:rgba(99,179,237,0.18);color:var(--text);}
/* ── Bağlam Menüsü ── */
.ctx-menu{
position:fixed;z-index:9999;
background:var(--panel);border:1px solid var(--border);
border-radius:12px;padding:6px;min-width:170px;
box-shadow:0 10px 40px rgba(0,0,0,0.7);
}
.row-action-btn{
background:transparent;border:1px solid var(--border);color:var(--muted);
border-radius:6px;padding:2px 5px;font-size:16px;cursor:pointer;
line-height:1;transition:border-color .15s,color .15s;
}
.row-action-btn:hover{border-color:var(--primary);color:var(--primary);}
.ctx-item{
padding:9px 15px;font-size:13px;cursor:pointer;border-radius:7px;
color:var(--text-soft);transition:background .15s;
}
.ctx-item:hover{background:rgba(99,179,237,0.1);color:var(--text);}
.ctx-has-sub{position:relative;}
.ctx-submenu{
display:none;position:absolute;right:100%;top:-6px;
background:var(--panel);border:1px solid var(--border);
border-radius:10px;padding:6px 0;min-width:190px;
box-shadow:0 8px 24px rgba(0,0,0,.5);z-index:1010;
}
.ctx-has-sub:hover .ctx-submenu{display:block;}
.ctx-submenu .ctx-item{display:flex;align-items:center;gap:8px;}
.ctx-submenu .ctx-item.theme-active{color:var(--primary);font-weight:700;}
.theme-dot{width:12px;height:12px;border-radius:50%;flex-shrink:0;border:1px solid rgba(255,255,255,0.15);}
/* ── Modal ── */
.modal-overlay{
display:none;position:fixed;inset:0;z-index:500;
background:rgba(0,0,0,0.75);backdrop-filter:blur(5px);
align-items:center;justify-content:center;
}
.modal-overlay.open{display:flex;}
.modal{
background:var(--panel);border:1px solid rgba(99,179,237,0.2);
border-radius:18px;padding:30px;width:90%;max-width:900px;
max-height:90vh;overflow-y:auto;position:relative;
}
.modal-close{
position:absolute;top:18px;right:22px;font-size:20px;
cursor:pointer;color:var(--muted);transition:color .2s;
}
.modal-close:hover{color:var(--text);}
/* Sekme sayısı arttıkça (6+) tek satıra sığmıyordu; sarmalı olmayan flex son
sekmeleri görünmez şekilde taşırıyordu — wrap + nowrap etiket ile çözüldü. */
.det-tabs{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:20px;border-bottom:2px solid var(--border);padding-bottom:0;}
.det-tab{background:none;border:none;padding:8px 16px;font-size:13px;font-weight:600;color:var(--muted);cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-2px;border-radius:6px 6px 0 0;transition:all .15s;white-space:nowrap;flex:0 0 auto;}
.det-tab.active{color:var(--primary);border-bottom-color:var(--primary);background:rgba(99,179,237,0.06);}
.det-tab:hover:not(.active){color:var(--text);background:rgba(255,255,255,0.04);}
.det-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:22px;}
.det-title{font-size:22px;font-weight:800;color:var(--primary);font-family:'Courier New',monospace;}
.det-sub{font-size:12px;color:var(--muted);margin-top:5px;}
.det-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px;margin-bottom:18px;}
.det-block{background:rgba(99,179,237,0.04);border:1px solid rgba(99,179,237,0.1);border-radius:12px;padding:16px;}
.det-block-title{font-size:10px;font-weight:700;color:var(--muted);letter-spacing:2px;text-transform:uppercase;margin-bottom:12px;}
.det-row{display:flex;justify-content:space-between;gap:8px;padding:5px 0;border-bottom:1px solid rgba(99,179,237,0.05);}
.det-row:last-child{border-bottom:none;}
.det-lbl{font-size:11px;color:var(--muted);}
.det-val{font-size:12px;color:var(--text);font-weight:500;text-align:right;}
.prod-table{width:100%;border-collapse:collapse;font-size:12px;margin-bottom:16px;}
.prod-table th{background:rgba(99,179,237,0.08);padding:9px 11px;text-align:left;font-size:10px;font-weight:700;color:var(--muted);letter-spacing:1px;text-transform:uppercase;border-bottom:1px solid rgba(99,179,237,0.15);}
.prod-table td{padding:9px 11px;border-bottom:1px solid rgba(99,179,237,0.05);}
.prod-table tr:hover td{background:rgba(99,179,237,0.04);}
.fin-box{background:rgba(99,179,237,0.04);border:1px solid rgba(99,179,237,0.12);border-radius:12px;padding:16px;margin-bottom:18px;}
.fin-row{display:flex;justify-content:space-between;padding:6px 0;font-size:13px;border-bottom:1px solid rgba(99,179,237,0.06);}
.fin-row:last-child{border-bottom:none;}
.fin-total{font-size:16px;font-weight:800;color:var(--primary);padding-top:12px;}
.durum-sec{background:rgba(99,179,237,0.03);border:1px solid rgba(99,179,237,0.1);border-radius:12px;padding:16px;margin-bottom:14px;}
.durum-btns{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;}
.durum-btn{
padding:7px 15px;border-radius:20px;font-size:12px;font-weight:600;
cursor:pointer;border:1px solid rgba(99,179,237,0.2);
background:rgba(99,179,237,0.05);color:var(--muted);
transition:all .2s;
}
.durum-btn:hover{color:var(--text);border-color:rgba(99,179,237,0.5);}
.durum-btn.active{background:rgba(99,179,237,0.2);border-color:var(--primary);color:var(--text);}
.not-input{
width:100%;margin-top:10px;padding:9px 14px;border-radius:9px;
background:var(--input-bg);border:1px solid var(--border);
color:var(--text);font-size:12px;outline:none;
}
.not-input:focus{border-color:var(--primary);}
/* Çok satırlı not kutusu (_otoYukselt ile boylanır). font-family:inherit
şart — textarea varsayılanı monospace'e düşüyor, input'lardan farklı
görünüyordu. resize:vertical kullanıcıya elle büyütme hakkı bırakır. */
textarea.not-input{
font-family:inherit;line-height:1.45;resize:vertical;
min-height:38px;overflow-y:hidden;display:block;
}
.be-po-opt:hover{background:var(--row-hover);}
.up-po-row:hover{background:var(--row-hover);}
.up-po-row.active{background:rgba(99,179,237,0.15);color:var(--primary);font-weight:700;}
.pdf-link{
display:inline-block;padding:9px 20px;border-radius:9px;font-size:13px;
background:rgba(99,179,237,0.1);border:1px solid rgba(99,179,237,0.3);
color:var(--primary);text-decoration:none;transition:all .2s;
}
.pdf-link:hover{background:rgba(99,179,237,0.2);}
/* ORB KONUMU: sağ altta ama dipten YUKARIDA (bottom:96px). Dipteki sabit
çubukların (sayfalama, kaydet/alt işlem çubukları, toast, seçim özeti)
üstüne binmesin diye yükseltildi — eskiden bottom:22px idi ve o çubukları
örtüyordu, her biri için ayrı kaydırma kuralı gerekiyordu.
Yerleşim düzeni (viewport dibinden yukarı):
0–58px seçim özeti çubuğu / sayfalama çubuğu
28–88px toast
96–156px ORB ← artık ikisinin de üstünde, çakışma yok */
body.orb-var #ukWindowBody, body.orb-var #bkBody, body.orb-var #tdpBody,
body.orb-var .mes-full-win > div[id$="Body"]{ padding-bottom:160px !important; }
/* Kaydırılan gövdelerin SON satırı orbun bandına (96–156px) girmesin diye
160px dip payı; !important ŞART çünkü bu gövdelerin padding'i satır içi
stille kuruluyor ve satır içi stil dosyayı her koşulda ezer. */
/* ── Toast ── */
.toast{
position:fixed;bottom:28px;right:28px;z-index:9999;
padding:13px 22px;border-radius:12px;font-size:13px;font-weight:600;
opacity:0;transform:translateY(12px);transition:all .3s;
border:1px solid transparent;pointer-events:none;
}
.toast.show{opacity:1;transform:translateY(0);}
.toast-ok {background:rgba(104,211,145,.15);border-color:rgba(104,211,145,.4);color:#68d391;}
.toast-warn {background:rgba(246,173,85,.15); border-color:rgba(246,173,85,.4); color:#f6ad55;}
.toast-err {background:rgba(252,129,129,.15);border-color:rgba(252,129,129,.4);color:#fc8181;}
/* ── Responsive ── */
@media(max-width:640px){
.main{padding:14px;}
.modal{padding:20px;}
.kpi-grid{grid-template-columns:repeat(2,1fr);}
}
/* ══════════════════════════════════════════════════════════════════════════
DT-112 · MOBİL KOMPAKT KATMANI (2026-09-03)
Kapsam kararı: "sahada kullanılanlar" — atölyede/depoda telefonla açılan
ekranlar. Kalite Kontrol kendi kompakt çizimine sahipti (mobil=true dalı);
burada aynı ilkeler CSS ile diğer ekranlara taşınır. Çizim koduna
dokunulmaz — yalnız dar ekranda görünüm sıkışır.
İlkeler:
1) iOS ZOOM: 16px'ten küçük yazılı bir alana odaklanınca Safari sayfayı
zorla yakınlaştırır ve kullanıcı bir daha uzaklaştıramaz. Dar ekranda
TÜM giriş alanları 16px'e çıkarılır (kalite modülünde kanıtlanmış kural).
2) PARMAK HEDEFİ: düğme/seçici en az 38px yüksek — eldivenle de basılabilsin.
3) YATAY TAŞMA: geniş tablolar kendi kapsayıcısında kayar; SAYFA gövdesi
asla yatay kaymaz (kayarsa dokunmatik kaydırma kilitlenir).
4) YER: dar ekranda dolgu ve boşluklar küçülür, tam ekran modüllerin gövdesi
kenara yaklaşır — 6" ekranda içerik için her piksel değerli.
══════════════════════════════════════════════════════════════════════════ */
@media (max-width:640px){
/* 1 · iOS odak yakınlaşması — dar ekranda istisnasız 16px */
input, select, textarea, .not-input, .uk-input, .bomy-cell-inp, .bom-inp{
font-size:16px !important;
}
/* Tablo içi hücre girişleri: 16px okunur ama satırı şişirmesin */
td input, td select, td textarea, .bomy-cell-inp{ padding:6px 8px !important; }
/* 2 · Parmak hedefi */
.btn, button.btn, .btn-xs, button{ min-height:38px; }
.btn-xs{ padding:6px 10px !important; }
/* Satır içi ikon düğmeleri (✕, ↑, ↓) küçük kalabilir — yanlış basma riski
büyümekten daha kötü; yalnız dokunma alanı genişletilir. */
td button.btn-xs, td .btn-xs{ min-height:34px; }
/* 3 · Yatay taşma: tablo kendi içinde kaysın, sayfa kaymasın */
body{ overflow-x:hidden; }
.td-list, .uk-body, [id$="Body"]{ -webkit-overflow-scrolling:touch; }
table{ max-width:none; }
/* 4 · Yer kazanımı — tam ekran modüllerin gövdesi */
.mes-full-win > div[id$="Body"]{ padding:10px 12px 24px !important; }
.main{ padding:10px !important; }
.modal{ padding:14px !important; }
/* ── PLANLAMA PANOSU: hafta kolonları yan yana sığmaz, alt alta ── */
.ai-kan-col{ min-width:100% !important; width:100% !important; }
.ai-kanban{ flex-direction:column !important; gap:10px !important; width:100% !important; min-width:0 !important; }
.ai-kan-col-sub{ font-size:11px !important; }
/* ── SİPARİŞ DETAYI: iki sütunlu ızgaralar tek sütuna ── */
.det-grid, .uk-form-grid{ grid-template-columns:1fr !important; }
.det-lbl{ font-size:11px !important; }
/* ── ÜRETİM HAREKETLERİ / listeler: KPI kutuları ikişerli ── */
.kpi-grid{ grid-template-columns:repeat(2,1fr) !important; }
/* Üst bant: modül başlığı dar ekranda taşmasın */
.topbar-center{ max-width:46vw; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
}
/* Çok dar (≤400px) — eski/küçük telefonlar */
@media (max-width:400px){
.kpi-grid{ grid-template-columns:1fr !important; }
.mes-full-win > div[id$="Body"]{ padding:8px 8px 20px !important; }
}
/* ── Print Specific Styles ── */
#printArea { display: none; }
@media print {
@page { margin: 1.5cm 2cm; }
body { background: white !important; color: black !important; margin: 0; padding: 0; }
body * { visibility: hidden; }
#printArea, #printArea * { visibility: visible; color: black !important; }
#printArea {
display: block !important;
position: absolute; left: 0; top: 0; width: 100%;
padding: 0; margin: 0;
background: white;
}
.print-page {
padding-bottom: 20px;
}
/* Grup üretim emri (DT-049): birden çok .print-page arka arkaya basılırken
her yeni sipariş TEMİZ SAYFADAN başlasın — yoksa iki emir aynı kâğıtta
birbirine karışır. Tek sayfalı çıktıda kural hiç devreye girmez. */
.print-page + .print-page { page-break-before: always; }
.print-table { width: 100%; border-collapse: collapse; margin-bottom: 20px; page-break-inside: auto; }
.print-table tr { page-break-inside: avoid; page-break-after: auto; }
.print-table th, .print-table td { border: 1px solid #000 !important; padding: 10px; text-align: center; }
.print-table th { background-color: #f0f0f0 !important; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.print-part-title {
background-color: #e0e0e0 !important;
-webkit-print-color-adjust: exact;
print-color-adjust: exact;
padding: 8px;
font-weight: bold;
margin-top: 15px;
margin-bottom: 10px;
border: 1px solid #000 !important;
page-break-after: avoid;
}
.print-header {
display: flex;
align-items:flex-start;
gap:20px;
border-bottom: 2px solid #000;
padding-bottom: 15px;
margin-bottom: 20px;
page-break-inside: avoid;
}
.print-img { width:140px; height:140px; object-fit:contain; border:1px solid #ccc; flex-shrink:0; }
.print-info { flex:1; display:flex; justify-content:space-between; }
a[href]:after { content: none !important; }
html { -webkit-print-color-adjust: exact; }
#printArea td, #printArea th {
overflow: visible !important;
text-overflow: unset !important;
white-space: normal !important;
word-break: break-word;
}
.plan-pdf-section { page-break-before: always; }
.plan-pdf-cap-ok { background:#ddffe8 !important; -webkit-print-color-adjust:exact; print-color-adjust:exact; }
.plan-pdf-cap-mid { background:#fff3cd !important; -webkit-print-color-adjust:exact; print-color-adjust:exact; }
.plan-pdf-cap-over{ background:#ffdddd !important; color:#c00 !important; font-weight:bold; -webkit-print-color-adjust:exact; print-color-adjust:exact; }
.plan-pdf-none { color:#aaa; }
}
/* ── Grup Satırları ── */
.grup-header-row { cursor: pointer; }
.grup-header-row td { background: color-mix(in srgb,var(--bg) 93%,var(--primary)) !important; border-top: 2px solid var(--border); }
.grup-header-row td:first-child { border-left: 3px solid var(--primary) !important; }
.grup-expand-icon { color: var(--primary); user-select: none; }
.grup-child-row td { background: var(--bg) !important; }
/* ══════════════════════════════════════
Teknik Dokümanlar
══════════════════════════════════════ */
#teknikDocModal{display:none;position:fixed;inset:0;z-index:9000;background:rgba(0,0,0,.65);align-items:center;justify-content:center;}
#teknikDocModal.open{display:flex;}
.tdm-box{background:var(--panel);border:1px solid var(--border);border-radius:16px;width:min(780px,96vw);max-height:88vh;display:flex;flex-direction:column;overflow:hidden;}
.tdm-head{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid var(--border);flex-shrink:0;}
.tdm-title{font-size:15px;font-weight:700;color:var(--text);}
.tdm-body{flex:1;overflow-y:auto;padding:20px;}
.tdm-foot{padding:14px 20px;border-top:1px solid var(--border);display:flex;justify-content:flex-end;gap:10px;flex-shrink:0;}
.tdm-drop{border:2px dashed rgba(99,179,237,0.35);border-radius:12px;padding:36px 20px;text-align:center;cursor:pointer;transition:border-color .2s;margin-bottom:16px;}
.tdm-drop:hover,.tdm-drop.drag-over{border-color:var(--primary);}
.tdm-drop-icon{font-size:32px;margin-bottom:8px;}
.tdm-drop-txt{font-size:13px;color:var(--muted);}
.tdm-table{width:100%;border-collapse:collapse;font-size:12px;}
.tdm-table th{padding:7px 10px;text-align:left;font-size:10px;font-weight:700;color:var(--muted);letter-spacing:.6px;text-transform:uppercase;border-bottom:1px solid var(--border);}
.tdm-table td{padding:7px 10px;border-bottom:1px solid var(--diff-sep);vertical-align:middle;}
.tdm-badge-ok{display:inline-flex;align-items:center;gap:4px;background:rgba(104,211,145,.15);color:#68d391;border:1px solid rgba(104,211,145,.3);border-radius:5px;padding:2px 8px;font-size:11px;font-weight:600;}
.tdm-badge-warn{display:inline-flex;align-items:center;gap:4px;background:rgba(246,173,85,.15);color:#f6ad55;border:1px solid rgba(246,173,85,.3);border-radius:5px;padding:2px 8px;font-size:11px;font-weight:600;}
.tdm-badge-err{display:inline-flex;align-items:center;gap:4px;background:rgba(252,129,129,.15);color:#fc8181;border:1px solid rgba(252,129,129,.3);border-radius:5px;padding:2px 8px;font-size:11px;font-weight:600;}
.tdm-tip-sel{background:var(--input-bg);border:1px solid var(--border);border-radius:6px;color:var(--text);font-size:11px;padding:4px 6px;outline:none;cursor:pointer;}
.tdm-tip-sel:focus{border-color:var(--primary);}
.tdm-remove{background:none;border:none;color:var(--muted);cursor:pointer;font-size:14px;padding:2px 6px;border-radius:4px;}
.tdm-remove:hover{color:#fc8181;background:rgba(252,129,129,.1);}
/* Teknik Doküman tab liste */
.td-list{display:flex;flex-direction:column;gap:8px;padding:16px;}
.td-item{display:flex;align-items:center;gap:12px;background:var(--input-bg);border:1px solid var(--border);border-radius:10px;padding:10px 14px;transition:border-color .15s;}
.td-item:hover{border-color:rgba(99,179,237,.4);}
.td-item-icon{font-size:22px;flex-shrink:0;}
.td-item-info{flex:1;min-width:0;}
.td-item-name{font-size:12px;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.td-item-meta{font-size:10px;color:var(--muted);margin-top:2px;}
.td-item-tip{display:inline-block;background:rgba(99,179,237,.12);color:var(--primary);border-radius:4px;padding:1px 7px;font-size:10px;font-weight:600;margin-right:6px;}
.td-item-actions{display:flex;gap:6px;flex-shrink:0;}
.td-btn-view{background:rgba(99,179,237,.1);border:1px solid rgba(99,179,237,.25);color:var(--primary);border-radius:6px;padding:4px 10px;font-size:11px;cursor:pointer;text-decoration:none;display:inline-block;}
.td-btn-view:hover{background:rgba(99,179,237,.2);}
.td-btn-del{background:rgba(252,129,129,.08);border:1px solid rgba(252,129,129,.2);color:#fc8181;border-radius:6px;padding:4px 10px;font-size:11px;cursor:pointer;}
.td-btn-del:hover{background:rgba(252,129,129,.2);}
.td-empty{text-align:center;padding:40px 20px;color:var(--muted);font-size:13px;}
.td-tab-header{display:flex;align-items:center;justify-content:space-between;padding:12px 16px 0;flex-shrink:0;}
.td-tab-upload-btn{background:rgba(99,179,237,.1);border:1px solid rgba(99,179,237,.25);color:var(--primary);border-radius:7px;padding:5px 14px;font-size:11px;font-weight:600;cursor:pointer;}
.td-tab-upload-btn:hover{background:rgba(99,179,237,.2);}
/* ── Upload İlerleme ── */
.tdm-prog-wrap{margin-bottom:16px;padding:14px 16px;background:var(--input-bg);border:1px solid var(--border);border-radius:10px;}
.tdm-prog-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px;}
.tdm-prog-label{font-size:13px;font-weight:700;color:var(--text);}
.tdm-prog-pct{font-size:12px;color:var(--muted);}
.tdm-prog-chips{display:flex;gap:6px;align-items:center;}
.tdm-prog-track{height:8px;background:rgba(99,179,237,0.1);border-radius:4px;overflow:hidden;margin-bottom:8px;}
.tdm-prog-fill{height:100%;background:linear-gradient(90deg,var(--primary),var(--accent));border-radius:4px;transition:width .35s ease;}
.tdm-prog-cur{font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.tdm-file-track{height:3px;background:rgba(99,179,237,0.12);border-radius:2px;overflow:hidden;margin-top:4px;}
.tdm-file-fill{height:100%;background:var(--primary);border-radius:2px;transition:width .2s;}
@keyframes tdmPulse{0%,100%{opacity:1}50%{opacity:.45}}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.5}}
@keyframes micPulse{0%{box-shadow:0 0 0 0 rgba(245,101,101,.55)}70%{box-shadow:0 0 0 8px rgba(245,101,101,0)}100%{box-shadow:0 0 0 0 rgba(245,101,101,0)}}
#asistanMicBtn.mic-rec{background:#f56565;border-color:#f56565;color:#fff;animation:micPulse 1.2s infinite;}
/* Sohbet orb durum animasyonları */
@keyframes orbPulseY{0%{box-shadow:0 0 0 0 rgba(72,187,120,.6)}70%{box-shadow:0 0 0 14px rgba(72,187,120,0)}100%{box-shadow:0 0 0 0 rgba(72,187,120,0)}}
@keyframes orbPulseB{0%{box-shadow:0 0 0 0 rgba(99,179,237,.6)}70%{box-shadow:0 0 0 14px rgba(99,179,237,0)}100%{box-shadow:0 0 0 0 rgba(99,179,237,0)}}
#asistanOrb{transition:background .2s;}
#asistanOrb.orb-dinliyor{background:#48bb78;animation:orbPulseY 1.3s infinite;}
#asistanOrb.orb-konusuyor{background:#4299e1;animation:orbPulseB 1.1s infinite;}
/* Video orb'da arkaplan rengi görünmez — düşünüyor durumu sabit turuncu halkayla belli olsun */
#asistanOrb.orb-dusunuyor{background:#ed8936;box-shadow:0 0 0 4px rgba(237,137,54,.55),0 6px 22px rgba(0,0,0,.4);}
/* Video yüklendiğinde: daire/arka plan/gölge TAMAMEN kalkar, küp serbest döner.
Durum nabızları orb gövdesinde daire çizeceğinden ROZETE taşınır. */
#asistanOrb.orb-video{background:transparent!important;box-shadow:none!important;animation:none!important;}
#asistanOrb.orb-video.orb-dinliyor #asistanOrbIcon{animation:orbPulseY 1.3s infinite;}
#asistanOrb.orb-video.orb-konusuyor #asistanOrbIcon{animation:orbPulseB 1.1s infinite;}
#asistanOrb.orb-video.orb-dusunuyor #asistanOrbIcon{box-shadow:0 0 0 3px rgba(237,137,54,.55);}
/* Satınalma Bekleniyor: 1 sn görünür, 1 sn kaybolur (glow yok) */
@keyframes satinalmaGlow{
0%,49.9%{opacity:1;}
50%,100%{opacity:0;}
}
.tdm-anim{animation:tdmPulse 1.1s ease-in-out infinite;}
/* ── Teknik Dokümanlar Ana Panel ── */
#tdPanelOverlay{display:none;position:fixed;left:0;right:0;bottom:0;top:44px;background:var(--bg);z-index:445;}
#tdPanelOverlay.open{display:flex;flex-direction:column;}
.tdp-modal{background:var(--bg);border:none;border-radius:0;width:100%;height:100%;display:flex;flex-direction:column;overflow:hidden;box-shadow:none;}
.tdp-header{display:flex;align-items:center;gap:10px;padding:14px 20px;border-bottom:1px solid var(--border);flex-shrink:0;flex-wrap:wrap;background:var(--panel);}
.tdp-title{font-size:15px;font-weight:700;color:var(--text);}
.tdp-search{background:var(--input-bg);border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:12px;padding:7px 12px;outline:none;width:220px;margin-left:auto;}
.tdp-search:focus{border-color:var(--primary);}
.tdp-filter{background:var(--input-bg);border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:12px;padding:7px 10px;outline:none;cursor:pointer;}
.tdp-filter:focus{border-color:var(--primary);}
.tdp-count{font-size:11px;color:var(--muted);white-space:nowrap;}
.tdp-body{flex:1;overflow-y:auto;}
.tdp-table{width:100%;border-collapse:collapse;font-size:12px;}
.tdp-table th{padding:9px 14px;text-align:left;font-size:10px;font-weight:700;color:var(--muted);letter-spacing:.7px;text-transform:uppercase;background:var(--panel);position:sticky;top:0;z-index:2;border-bottom:2px solid var(--border);}
.tdp-table td{padding:9px 14px;border-bottom:1px solid var(--diff-sep);vertical-align:middle;}
.tdp-table tbody tr:hover td{background:var(--row-hover);}
.tdp-table tbody tr:nth-child(even) td{background:var(--row-even);}
.tdp-table tbody tr:nth-child(even):hover td{background:var(--row-hover);}
.tdp-model{font-weight:700;color:var(--primary);font-family:'Courier New',monospace;font-size:11px;white-space:nowrap;}
.tdp-fname{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:300px;color:var(--text);}
.tdp-empty-panel{text-align:center;padding:80px 20px;color:var(--muted);font-size:14px;}
/* Luu'nun tavsiyeleri (Ana Panel) + Kişisel verilerim (2026-08-22) */
.luu-tavsiye{margin:0 0 14px;padding:12px 16px;border:1px solid rgba(200,144,43,.35);border-radius:12px;background:linear-gradient(135deg,rgba(200,144,43,.08),rgba(99,179,237,.05));font-size:13px;line-height:1.5}
.luu-tv-head{font-weight:600;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.luu-tv-logo{font-weight:800;letter-spacing:.02em;color:#c8902b}
.luu-tv-list{display:grid;gap:8px;margin-top:10px}
.luu-tv-item{padding:8px 10px;border-radius:8px;background:rgba(0,0,0,.08);border:1px solid var(--border)}
.luu-tv-metin{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.luu-tv-em{font-size:15px}
.luu-tv-sorular{display:flex;flex-wrap:wrap;gap:4px 6px;margin-top:6px;align-items:center}
.luu-tv-soru{font:inherit;font-size:11.5px;padding:3px 9px;border-radius:14px;border:1px solid rgba(99,179,237,.35);background:transparent;color:var(--text);cursor:pointer}
.luu-tv-soru:hover{background:rgba(99,179,237,.12)}
.luu-tv-mic{font:inherit;font-size:11px;padding:2px 5px;border-radius:10px;border:1px solid transparent;background:transparent;cursor:pointer;margin-right:6px;opacity:.7}
.luu-tv-mic:hover{opacity:1;border-color:rgba(200,144,43,.5)}
body.jr-hafif .luu-tv-sorular{display:none}
/* Radar sağ alt yuva (2026-08-22): komut satırının yerine tavsiye paneli */
.luu-tv-yuva{flex-shrink:0;pointer-events:auto;margin-top:8px;max-height:58%;overflow:auto;font-family:'Segoe UI',system-ui,sans-serif}
.luu-tv-yuva .luu-tavsiye{margin:0;background:linear-gradient(135deg,rgba(200,144,43,.12),rgba(10,20,40,.55));backdrop-filter:blur(4px);box-shadow:0 6px 24px rgba(0,0,0,.35)}
.luu-tv-yuva .luu-tv-item{background:rgba(0,0,0,.22)}
.kv-sec{margin:0 0 16px;padding:10px 12px;border:1px solid var(--border);border-radius:8px}
.kv-sec h4{margin:0 0 6px;font-size:13px}
.kv-metin p{margin:0 0 8px}
/* Görev kutusu (2026-08-23) */
.gk-rozet{display:inline-block;min-width:16px;padding:0 5px;margin-left:4px;border-radius:9px;background:rgba(200,144,43,.25);color:#e0b75b;font-size:10px;font-weight:700;line-height:16px;text-align:center;vertical-align:middle}
.gk-panel{position:fixed;top:0;right:0;bottom:0;width:520px;max-width:96vw;z-index:610;background:var(--panel);border-left:1px solid var(--border);box-shadow:-6px 0 24px rgba(0,0,0,.3);display:flex;flex-direction:column}
.gk-head{display:flex;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid var(--border);font-size:14px}
.gk-tabs{display:flex;gap:2px;padding:6px 8px 0;border-bottom:1px solid var(--border);flex-wrap:wrap}
.gk-tab{font:inherit;font-size:12px;padding:6px 10px;border:1px solid transparent;border-bottom:none;background:transparent;color:var(--muted);cursor:pointer;border-radius:6px 6px 0 0}
.gk-tab.active{color:var(--text);border-color:var(--border);background:rgba(255,255,255,.03)}
.gk-body{flex:1;overflow:auto;padding:8px}
.gk-item{border:1px solid var(--border);border-radius:8px;padding:8px 10px;margin-bottom:8px;background:rgba(0,0,0,.08)}
.gk-item.gk-hat{border-color:rgba(200,144,43,.5)}
.gk-item.gk-yeni{border-color:rgba(99,179,237,.5)}
.gk-ust{display:flex;gap:8px;align-items:flex-start}
.gk-em{font-size:16px;line-height:1.2}
.gk-metin{flex:1;font-size:12.5px;line-height:1.4}
.gk-alt{font-size:11px;color:var(--muted);margin-top:2px}
.gk-not{font-size:11.5px;margin-top:4px;color:var(--text)}
.gk-ogeler{display:flex;flex-wrap:wrap;gap:4px;margin-top:5px}
.gk-oge{font-size:10.5px;padding:1px 7px;border-radius:10px;background:rgba(99,179,237,.1);border:1px solid rgba(99,179,237,.25);white-space:nowrap}
.gk-cevap{font-size:11.5px;margin-top:5px;padding:5px 8px;border-radius:6px;background:rgba(104,211,145,.08);border-left:2px solid rgba(104,211,145,.5)}
.gk-cevap small{color:var(--muted);margin-left:4px}
.gk-etiket{font-size:10px;padding:1px 6px;border-radius:8px;background:rgba(200,144,43,.18);color:#e0b75b;vertical-align:middle}
.gk-eylem{display:flex;flex-wrap:wrap;gap:4px 6px;margin-top:7px;align-items:center}
.gk-bos{padding:18px 12px;color:var(--muted);font-size:13px;text-align:center}
.gk-yon{font-size:12.5px}
.gk-yon-h{font-weight:600;margin:4px 0 8px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.gk-yon-h small{font-weight:400;color:var(--muted)}
.gk-tablo{width:100%;border-collapse:collapse;font-size:11.5px}
.gk-tablo th{text-align:left;color:var(--muted);font-weight:600;padding:4px 6px;border-bottom:1px solid var(--border)}
.gk-tablo td{padding:5px 6px;border-bottom:1px solid var(--border);vertical-align:top}
body.jr-hafif .gk-panel{width:100vw}
/* Luu penceresi açıkken Ana Panel konuşma akışı gizli — tek iletişim yüzeyi (2026-08-23) */
body.luu-mini-acik #jrLog{display:none !important}
/* Luu sunum modu çubuğu (2026-08-23) */
.luu-sunum-bar{position:fixed;left:50%;transform:translateX(-50%);bottom:18px;z-index:1500;display:flex;align-items:center;gap:10px;padding:8px 14px;border-radius:24px;background:rgba(16,22,32,.92);border:1px solid rgba(200,144,43,.5);box-shadow:0 8px 28px rgba(0,0,0,.45);font-size:12.5px;color:#e6eaf0;backdrop-filter:blur(6px)}
.luu-sunum-bar .ls-nokta{width:8px;height:8px;border-radius:50%;background:#68d391;box-shadow:0 0 8px #68d391;animation:lsYanip 1.6s ease-in-out infinite}
@keyframes lsYanip{0%,100%{opacity:1}50%{opacity:.35}}
.luu-sunum-bar .ls-adim{color:#e0b75b;font-weight:700}
.luu-sunum-bar .ls-durum{color:var(--muted)}
@media (prefers-reduced-motion:reduce){.luu-sunum-bar .ls-nokta{animation:none}}
/* Gezinme okları (Alt+←/→): dokunulabilir boyut + yazı etiketi (2026-08-30).
Dar ekranda yazı düşer, yalnız ok kalır — topbar taşmasın. */
@media (max-width:860px) { #navBtnGrup .nav-yazi { display:none; } }
/* ── Perakende: gündem akış şeridi (moduller/perakende.js) ──────────────
Sağ paneldeki haberler 15-30 sn'de bir değişir; yeni satır aşağıdan
yumuşakça girer. Hareket azaltma tercihinde animasyon kapanır ama içerik
AYNEN görünür (opacity:1) — animasyonu iptal edip başlangıç durumunda
bırakmak satırları görünmez yapardı. */
@keyframes pkHaberGir{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
[style*="pkHaberGir"]{animation:none!important;opacity:1!important;transform:none!important;}
}
/* ── Perakende: ACİL rozeti (moduller/perakende.js) ────────────────────
Stok tedarik süresinden önce bitiyorsa kart listenin başına gelir ve
rozet yanıp söner. Hareket azaltma tercihinde yanıp sönme durur ama
rozet TAM GÖRÜNÜR kalır — uyarıyı görünmez yapmak en kötü sonuç. */
@keyframes pkAcilYanip{0%,100%{opacity:1}50%{opacity:.45}}
.pk-acil{animation:pkAcilYanip 1.15s ease-in-out infinite;}
@media (prefers-reduced-motion:reduce){ .pk-acil{animation:none;opacity:1;} }
/* ── SEGMENT DÜĞMESİ (görünüm seçici) ─────────────────────────────────
Muhasebe → Fatura & İrsaliye'deki görünüm düğmeleri için (2026-09-03).
Neden ayrı bileşen: .btn/.btn-primary çifti bu iş için iki sorun
üretiyordu — (1) tema paketleri .btn-primary'ye dış+iç glow ekliyor,
dört düğmeden biri parlayınca sıra dağınık görünüyor; (2) düğme
metni emoji ile birlikte satır kutusunda yukarı kayıyor (line-height
normal + baseline hizası), seçili düğmede bu kayma göze çarpıyor.
Burada yükseklik sabit, hizalama flex ile ortalı, glow kapalı. */
.seg{
display:inline-flex;align-items:stretch;max-width:100%;overflow:auto;
border:1px solid var(--border);border-radius:10px;background:var(--panel);
}
.seg button{
appearance:none;border:0;background:transparent;color:var(--text-soft);
font-size:12px;font-weight:600;font-family:inherit;line-height:1;
height:34px;padding:0 14px;display:inline-flex;align-items:center;gap:6px;
cursor:pointer;white-space:nowrap;transition:background .15s,color .15s;
box-shadow:none !important; /* tema glow'u segment içinde kapalı */
}
.seg button + button{border-left:1px solid var(--border);}
.seg button:hover{background:rgba(99,179,237,0.10);color:var(--text);}
.seg button[aria-selected="true"]{background:rgba(66,153,225,0.20);color:var(--primary);}
.seg button:focus-visible{outline:2px solid var(--primary);outline-offset:-2px;}