/* app.css — v2 ortak gorsel katman.
 *
 * Tasarim sistemiyle (tasarim/_ds/.../styles.css) tutarli: ayni tokenlar, ayni
 * bilesen siniflari, ayni "blueprint" dili (kare koseler, hairline kenar, tek aksan).
 * Buradaki eklemeler (drawer, fk-select, toast, states) ayni tokenlari kullanir. */

@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@400;500;700&family=Barlow+Condensed:wght@400;600&family=IBM+Plex+Mono:wght@400;500&display=swap');

:root {
  --color-bg: #f2f2f3;
  --color-surface: #ffffff;
  --color-text: #1d1f20;
  --color-accent: #5980a6;
  --color-divider: color-mix(in srgb, #1d1f20 16%, transparent);

  --color-neutral-100: #f5f5f8; --color-neutral-200: #e7e7ea; --color-neutral-300: #d4d4d7;
  --color-neutral-400: #b7b7ba; --color-neutral-500: #98989b; --color-neutral-600: #7a7a7d;
  --color-neutral-700: #5d5d60; --color-neutral-800: #424244; --color-neutral-900: #2b2b2d;

  --color-accent-100: #eef6ff; --color-accent-200: #d6ebff; --color-accent-300: #b5d9fd;
  --color-accent-400: #94bce3; --color-accent-500: #749dc4; --color-accent-600: #597ea3;
  --color-accent-700: #416180; --color-accent-800: #2c455d; --color-accent-900: #1d2d3d;

  --color-success: #3f7a44; --color-success-fill: #e4efe4;
  --color-warning: #b3801a; --color-warning-fill: #f6ecd9;
  --color-danger:  #a33a32; --color-danger-fill:  #f5e2e0;

  /* Üretim Panosu (TV) — eşik tonları AYRI: iyi/orta arası 30 puan, uzaktan daha az kırmızı */
  --pano-iyi: #3f7a44; --pano-iyi-zemin: #e4efe4;
  --pano-orta: #b3801a; --pano-orta-zemin: #f6ecd9;
  --pano-kotu: #a33a32; --pano-kotu-zemin: #f5e2e0;

  --font-heading: "Barlow Condensed", system-ui, sans-serif;
  --font-body: "Barlow", system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, monospace;

  --space-1: 3.4px; --space-2: 6.8px; --space-3: 10.2px; --space-4: 13.6px;
  --space-6: 20.4px; --space-8: 27.2px;

  --radius: 0;  /* blueprint: kare */
  --shadow-md: 0 3px 10px color-mix(in srgb, #2b2b2d 16%, transparent);
  --shadow-lg: 0 12px 32px color-mix(in srgb, #2b2b2d 22%, transparent);
}

*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; background: var(--color-bg); color: var(--color-text);
  font-family: var(--font-body); font-size: 15px; line-height: 1.55; }
h1, h2, h3, h4 { font-family: var(--font-heading); font-weight: 600; line-height: 1.12;
  letter-spacing: -0.01em; margin: 0; }
h2 { font-size: 32px; text-transform: uppercase; }
h3 { font-size: 20px; margin: var(--space-6) 0 var(--space-3); }
:focus { outline: none; }
:focus-visible { outline: 2px solid var(--color-accent); outline-offset: 2px; }
.text-muted { color: color-mix(in srgb, var(--color-text) 55%, transparent); }
.mono { font-family: var(--font-mono); }

/* — buttons — */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  cursor: pointer; text-decoration: none; font-family: var(--font-heading); font-weight: 600;
  font-size: 14px; line-height: 1.2; color: var(--color-text);
  background: transparent; border: 1px solid var(--color-divider);
  padding: var(--space-2) calc(var(--space-3) * 1.2); border-radius: var(--radius); }
.btn:disabled { opacity: 0.45; cursor: not-allowed; }
.btn-primary { background: var(--color-accent); color: var(--color-bg); border-color: var(--color-accent); }
.btn-primary:hover:not(:disabled) { background: var(--color-accent-600); }
.btn-primary:active:not(:disabled) { background: var(--color-accent-700); }
.btn-secondary:hover:not(:disabled) { background: color-mix(in srgb, var(--color-text) 7%, transparent); }
.btn-ghost { border-color: transparent; color: var(--color-accent); padding-inline: var(--space-2); }
.btn-ghost:hover:not(:disabled) { background: color-mix(in srgb, var(--color-accent) 10%, transparent); }
.btn-danger { color: var(--color-danger); border-color: transparent; padding-inline: var(--space-2); }
.btn-danger:hover:not(:disabled) { background: var(--color-danger-fill); }
.btn-sm { font-size: 13px; padding: 4px 9px; }

/* — forms — */
.field { margin-bottom: var(--space-4); }
.field > label { display: block; font-size: 12px; margin-bottom: 5px;
  color: color-mix(in srgb, var(--color-text) 70%, transparent); }
.field > label .req { color: var(--color-danger); }
.input { width: 100%; min-height: 36px; padding: 6px 10px; font: inherit; font-size: 14px;
  color: var(--color-text); caret-color: var(--color-accent); background: var(--color-surface);
  border: 1px solid var(--color-divider); border-radius: var(--radius); }
.input:hover { border-color: color-mix(in srgb, var(--color-text) 45%, transparent); }
.input:focus-visible { border-color: var(--color-accent); }
textarea.input { min-height: 84px; resize: vertical; }
/* Şifre alanı: sağda göster/gizle göz düğmesi */
.pw-wrap { position: relative; display: block; }
.pw-wrap .input { width: 100%; padding-right: 40px; }
.pw-toggle { position: absolute; top: 1px; right: 1px; bottom: 1px; width: 36px; padding: 0;
  display: grid; place-items: center; background: none; border: 0; cursor: pointer; color: var(--color-neutral-600); }
.pw-toggle:hover { color: var(--color-neutral-800); }
.field.has-error .input, .field.has-error .fk { border-color: var(--color-danger); }
.field-error { display: block; margin-top: 4px; font-size: 12px; color: var(--color-danger); }
.seg { display: inline-flex; overflow: hidden; border: 1px solid var(--color-divider); border-radius: var(--radius); }
.seg-opt { display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; font-size: 13px; cursor: pointer; }
.seg-opt + .seg-opt { border-left: 1px solid var(--color-divider); }
.seg-opt:has(input:checked) { background: var(--color-accent); color: var(--color-bg); }
.seg-opt input { position: absolute; opacity: 0; width: 0; height: 0; }

/* — tags — */
.tag { display: inline-flex; align-items: center; font-size: 11px; letter-spacing: 0.02em;
  padding: 3px 9px; border-radius: var(--radius); }
.tag-neutral { background: var(--color-neutral-100); color: var(--color-neutral-800); }
.tag-accent { background: var(--color-accent-100); color: var(--color-accent-800); }
.tag-success { background: var(--color-success-fill); color: var(--color-success); }
.tag-danger { background: var(--color-danger-fill); color: var(--color-danger); }
.tag-warn { background: var(--color-warning-fill); color: var(--color-warning); }
.tag + .tag { margin-left: 4px; }

/* — app kabuk: koyu gruplu kenar cubugu + ust bar — */
.app { display: grid; grid-template-columns: 240px minmax(0, 1fr); height: 100vh; }

.sidebar { background: var(--color-accent-900); color: #e6ebf1; display: flex; flex-direction: column; overflow: hidden; }
.sidebar-brand { display: flex; align-items: center; gap: 12px; height: 60px; padding: 0 18px;
  border-bottom: 1px solid rgba(255,255,255,0.14); flex: none;
  font-family: var(--font-heading); font-weight: 700; font-size: 20px; letter-spacing: 0.05em; text-transform: uppercase; }
.sidebar-brand svg { height: 48px; width: auto; color: #fff; }
.sidebar-nav { flex: 1; overflow-y: auto; padding: 10px 0 28px; display: flex; flex-direction: column; gap: 2px; }
.nav-group { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.16em; color: #8397ac; padding: 14px 18px 6px; }
.sidebar-nav a { display: flex; align-items: center; height: 36px; padding: 0 18px; color: #e6ebf1;
  font-size: 14.5px; text-decoration: none; border-left: 3px solid transparent; }
.sidebar-nav a:hover { background: rgba(255,255,255,0.08); }
.sidebar-nav a[aria-current='page'] { background: rgba(255,255,255,0.12); color: #fff; font-weight: 500;
  border-left-color: var(--color-accent-500); padding-left: 15px; }
.sidebar-nav a .count { margin-left: auto; font-family: var(--font-mono); font-size: 11px; color: #93a7bc; }

.main { display: flex; flex-direction: column; overflow: hidden; min-width: 0; }
.topbar { height: 60px; flex: none; background: var(--color-neutral-100);
  border-bottom: 1px solid var(--color-neutral-300); display: flex; align-items: center; gap: 16px; padding: 0 24px; }
.topbar .crumb { font-family: var(--font-mono); font-size: 12px; color: var(--color-neutral-600); }
.topbar .right { margin-left: auto; display: flex; align-items: center; gap: 16px; }
.topbar .sep { width: 1px; height: 28px; background: var(--color-neutral-300); }
.lang { display: flex; border: 1px solid var(--color-neutral-300); font-family: var(--font-mono); font-size: 12px; }
.lang button { border: 0; background: none; padding: 5px 11px; cursor: pointer; color: var(--color-neutral-600); font: inherit; }
.lang button.on { background: var(--color-accent-900); color: #fff; }
.user { display: flex; align-items: center; gap: 10px; }
.user .avatar { width: 34px; height: 34px; background: var(--color-accent-200); border: 1px solid var(--color-accent-500);
  display: grid; place-items: center; font-family: var(--font-heading); font-size: 15px; font-weight: 600; color: var(--color-accent-800); }
.user .who { line-height: 1.25; }
.user .who .name { font-size: 14px; font-weight: 500; }
.topbar .logout { border: 1px solid var(--color-neutral-400); background: transparent; color: var(--color-neutral-700);
  font: inherit; font-size: 13px; height: 32px; padding: 0 12px; cursor: pointer; }
.topbar .logout:hover { background: var(--color-neutral-200); border-color: var(--color-neutral-500); }
.content { flex: 1; overflow: auto; padding: 24px 24px 40px; min-width: 0; }

/* form bolum basligi (uzun formlari gruplar, or. kod tanimlari) */
.form-section { margin: var(--space-6) 0 var(--space-3); }
.form-section:first-child { margin-top: 0; }
.form-section h4 { font-family: var(--font-heading); font-size: 15px; text-transform: uppercase; letter-spacing: 0.06em;
  color: var(--color-neutral-700); padding-bottom: 5px; border-bottom: 1px solid var(--color-divider); }

/* — module head + toolbar — */
.module-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: var(--space-4); gap: var(--space-4); }
.toolbar { display: flex; align-items: center; gap: var(--space-3); margin-bottom: var(--space-3); }
.toolbar .search { flex: 0 1 320px; }
.toolbar .search input { padding-left: 30px; background-image:
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%237a7a7d' stroke-width='2'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: 9px center; }

/* — table — */
.table-wrap { border: 1px solid var(--color-divider); background: var(--color-surface); }
.table { width: 100%; border-collapse: collapse; font-size: 14px; }
.table th { text-align: left; font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase;
  color: color-mix(in srgb, var(--color-text) 60%, transparent);
  padding: var(--space-2) var(--space-3); border-bottom: 1px solid var(--color-divider); white-space: nowrap; }
.table td { padding: var(--space-2) var(--space-3);
  border-bottom: 1px solid color-mix(in srgb, var(--color-text) 8%, transparent); }
.table tbody tr:hover { background: color-mix(in srgb, var(--color-text) 4%, transparent); }
.table tr.is-active { background: var(--color-accent-100); }
.table tr.is-active:hover { background: var(--color-accent-200); }
.table td.actions { text-align: right; white-space: nowrap; width: 1%; }
@keyframes flash { from { background: var(--color-success-fill); } to { background: transparent; } }
.table tr.flash td { animation: flash 1.6s ease-out; }

/* Satır bayrağı sayacı (toolbar) + eksik-değer satırı/hücresi */
.toolbar .flag-host { margin-left: auto; }
.flag-chip { font: inherit; font-size: 12.5px; cursor: pointer; white-space: nowrap;
  padding: 5px 11px; border-radius: var(--radius);
  color: var(--color-warning); background: var(--color-warning-fill); border: 1px solid var(--color-warning); }
.flag-chip:hover { background: color-mix(in srgb, var(--color-warning) 22%, var(--color-warning-fill)); }
.flag-chip.on { background: var(--color-warning); color: #fff; }
.table tr.row-warn td:first-child { box-shadow: inset 3px 0 0 var(--color-warning); }
.cell-empty { color: var(--color-warning); font-style: italic; }

/* Facet (çoklu seçim) filtre çubuğu — tablo üstünde */
.facet-bar { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: var(--space-3); }
.facet-chip { font: inherit; font-size: 12.5px; cursor: pointer; padding: 4px 10px;
  background: var(--color-surface); border: 1px solid var(--color-divider);
  border-radius: var(--radius); color: var(--color-neutral-700); }
.facet-chip:hover { border-color: var(--color-neutral-500); }
.facet-chip.on { background: var(--color-accent); color: var(--color-bg); border-color: var(--color-accent); }
.facet-clear { font: inherit; font-size: 12.5px; cursor: pointer; padding: 4px 8px;
  background: none; border: 0; color: var(--color-neutral-600); text-decoration: underline; }

/* Durum rozeti — küçük, renkli, KARE köşe (border-radius 0) */
.status-badge { display: inline-block; font-size: 11.5px; font-weight: 500; line-height: 1.5;
  padding: 1px 8px; border-radius: 0; white-space: nowrap; }
.status-badge.warn    { background: var(--color-warning-fill); color: var(--color-warning); }
.status-badge.accent  { background: var(--color-accent-100);   color: var(--color-accent-800); }
.status-badge.neutral { background: var(--color-neutral-100);  color: var(--color-neutral-800); }
.status-badge.success { background: var(--color-success-fill); color: var(--color-success); }
.status-badge.danger  { background: var(--color-danger-fill);  color: var(--color-danger); }

.pager { display: flex; align-items: center; gap: var(--space-3); margin-top: var(--space-3); font-size: 13px; }
.pager .grow { flex: 1; }

/* — dialog (onay) — */
.dialog-backdrop { position: fixed; inset: 0; display: grid; place-items: center; padding: var(--space-4);
  background: color-mix(in srgb, var(--color-neutral-900) 50%, transparent); z-index: 60; }
.dialog { width: min(420px, 100%); display: flex; flex-direction: column; gap: var(--space-3);
  padding: var(--space-6); border: 1px solid var(--color-divider); background: var(--color-surface); box-shadow: var(--shadow-lg); }
.dialog-title { font-family: var(--font-heading); font-weight: 600; font-size: 20px; }
.dialog-body { font-size: 14px; opacity: 0.9; }
.dialog-actions { display: flex; justify-content: flex-end; gap: var(--space-2); margin-top: var(--space-2); }

/* — drawer (yan panel) — */
.drawer-backdrop { position: fixed; inset: 0; background: color-mix(in srgb, var(--color-neutral-900) 42%, transparent); z-index: 50; }
.drawer { position: fixed; top: 0; right: 0; height: 100vh; width: min(460px, 100%);
  background: var(--color-surface); border-left: 1px solid var(--color-divider); box-shadow: var(--shadow-lg);
  display: flex; flex-direction: column; z-index: 51; animation: drawer-in 0.16s ease-out; }
@keyframes drawer-in { from { transform: translateX(18px); opacity: 0.5; } to { transform: none; opacity: 1; } }
.drawer-head { display: flex; align-items: center; justify-content: space-between;
  padding: var(--space-4) var(--space-6); border-bottom: 1px solid var(--color-divider); }
.drawer-head .drawer-title { font-family: var(--font-heading); font-weight: 600; font-size: 22px; text-transform: uppercase; }
.drawer-body { padding: var(--space-6); overflow-y: auto; flex: 1; }
.drawer-actions { display: flex; justify-content: flex-end; gap: var(--space-2);
  padding: var(--space-4) var(--space-6); border-top: 1px solid var(--color-divider); }
.drawer-error { margin-bottom: var(--space-4); padding: var(--space-3); font-size: 13px;
  color: var(--color-danger); background: var(--color-danger-fill); border: 1px solid var(--color-danger); }

/* — fk-select — */
.fk { position: relative; }
.fk-control { min-height: 36px; display: flex; flex-wrap: wrap; align-items: center; gap: 4px;
  padding: 4px 8px; background: var(--color-surface); border: 1px solid var(--color-divider);
  border-radius: var(--radius); cursor: text; }
.fk-control.open { border-color: var(--color-accent); }
/* Metin (placeholder + tekil değer) tıklamayı yutmasın; tıklama alttaki kontrole
   geçsin (kontrolün TAMAMI tıklanabilir). Çipler hariç — onların × butonu var. */
.fk-placeholder, .fk-single { pointer-events: none; }
.fk-placeholder { color: color-mix(in srgb, var(--color-text) 45%, transparent); font-size: 14px; }
.fk-single { font-size: 14px; }
.fk-chip { display: inline-flex; align-items: center; gap: 5px; font-size: 12px;
  padding: 2px 7px; background: var(--color-accent-100); color: var(--color-accent-800); }
.fk-chip button { border: 0; background: none; cursor: pointer; color: inherit; font-size: 13px; line-height: 1; padding: 0; }

/* Gerekçe seçici (First-Off): sabit kutucuklar + serbest metin ekleme + çipler */
.chk-wrap { display: flex; flex-direction: column; gap: 10px; }
.chk-list { display: flex; flex-direction: column; gap: 7px; }
.chk-opt { display: flex; align-items: center; gap: 8px; font-size: 13.5px; cursor: pointer; }
.chk-opt input { flex: none; width: 16px; height: 16px; }
.chk-custom { display: flex; gap: 8px; }
.chk-custom .input { flex: 1; }
.chk-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.fk-control .taginput { border: 0; outline: 0; background: none; font: inherit; font-size: 14px; flex: 1; min-width: 90px; padding: 2px; }
.fk-pop { position: absolute; z-index: 55; left: 0; right: 0; margin-top: 3px; background: var(--color-surface);
  border: 1px solid var(--color-accent); box-shadow: var(--shadow-md); max-height: 300px; display: flex; flex-direction: column; }
.fk-search { padding: var(--space-2); border-bottom: 1px solid var(--color-divider); }
.fk-warn { padding: 6px var(--space-3); font-size: 12px; color: var(--color-warning);
  background: var(--color-warning-fill); border-bottom: 1px solid var(--color-warning); }
.fk-list { overflow-y: auto; }
.fk-opt { display: grid; grid-template-columns: minmax(60px, auto) 1fr; gap: var(--space-3);
  padding: 7px var(--space-3); cursor: pointer; font-size: 14px; align-items: baseline; }
.fk-opt .code { font-family: var(--font-mono); font-size: 12.5px; color: var(--color-neutral-700); }
.fk-opt.active { background: var(--color-accent); color: var(--color-bg); }
.fk-opt.active .code { color: var(--color-bg); }
.fk-opt.selected::after { content: '✓'; color: var(--color-accent); }
.fk-opt.active.selected::after { color: var(--color-bg); }
.fk-empty { padding: var(--space-3); font-size: 13px; color: var(--color-neutral-600); }

/* — states — */
.skeleton { border: 1px solid var(--color-divider); background: var(--color-surface); }
.skeleton .sk-row { height: 40px; border-bottom: 1px solid color-mix(in srgb, var(--color-text) 6%, transparent);
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--color-text) 5%, transparent), transparent);
  background-size: 200% 100%; animation: sk 1.2s ease-in-out infinite; }
@keyframes sk { from { background-position: 200% 0; } to { background-position: -200% 0; } }
.state { border: 1px solid var(--color-divider); background: var(--color-surface);
  padding: var(--space-8); text-align: center; }
.state .state-title { font-family: var(--font-heading); font-size: 18px; margin-bottom: var(--space-2); }
.state .state-msg { font-size: 14px; color: var(--color-neutral-700); margin-bottom: var(--space-4); }
.state.error { border-color: var(--color-danger); }
.state.error .state-title { color: var(--color-danger); }
.state.conflict { border-color: var(--color-warning); background: var(--color-warning-fill); text-align: left; padding: var(--space-4); }
.state.conflict .state-title { color: var(--color-warning); }

/* — toast — */
.toasts { position: fixed; bottom: var(--space-6); right: var(--space-6); display: flex; flex-direction: column;
  gap: var(--space-2); z-index: 80; }
.toast { min-width: 220px; max-width: 360px; padding: var(--space-3) var(--space-4); font-size: 14px;
  background: var(--color-neutral-900); color: #fff; box-shadow: var(--shadow-md);
  border-left: 3px solid var(--color-accent); animation: toast-in 0.18s ease-out; }
.toast.success { border-left-color: var(--color-success); }
.toast.danger { border-left-color: var(--color-danger); }
.toast.fade { opacity: 0; transition: opacity 0.3s ease; }
@keyframes toast-in { from { transform: translateY(8px); opacity: 0; } to { transform: none; opacity: 1; } }

.loading { padding: var(--space-6); color: var(--color-neutral-600); }

/* — çalışma saatleri özeti — */
.wh-summary { border: 1px solid var(--color-divider); background: var(--color-neutral-100); padding: 14px 16px; margin-bottom: 18px; }
.wh-timeline { font-family: var(--font-heading); font-size: 15px; text-transform: uppercase; letter-spacing: 0.06em; margin-bottom: 8px; }
.wh-stats { display: flex; flex-wrap: wrap; gap: 6px 22px; font-size: 13.5px; }
.wh-stats b { font-family: var(--font-mono); }
.wh-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 0 28px; }
@media (max-width: 700px) { .wh-cols { grid-template-columns: 1fr; } }
/* Tekil kayıt formu; diğer modüller gibi başlık altında hemen başlar (üste hizalı). */
.wh-center { padding: 8px 0 24px; }
.wh-card { width: 100%; max-width: 880px; padding: 22px 24px; }

/* — ürün ağacı: açılır/kapanır hiyerarşi — */
.tree-wrap { border: 1px solid var(--color-divider); background: var(--color-surface); }
.tree-head, .tree-row { display: grid; grid-template-columns: minmax(0,1fr) 80px 80px 100px max-content; align-items: center; }
.tree-head { border-bottom: 1px solid var(--color-divider); }
.tree-head > div { font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase;
  color: color-mix(in srgb, var(--color-text) 60%, transparent); padding: var(--space-2) var(--space-3); }
.tree-row { border-bottom: 1px solid color-mix(in srgb, var(--color-text) 8%, transparent); font-size: 14px; }
.tree-row:hover { background: color-mix(in srgb, var(--color-text) 4%, transparent); }
.tree-row.is-active { background: var(--color-accent-100); }
.tree-row > div { padding: var(--space-2) var(--space-3); }
.tree-node { display: flex; align-items: center; gap: 6px; min-width: 0; }
.tree-toggle { width: 18px; height: 18px; flex: none; display: grid; place-items: center; cursor: pointer;
  background: none; border: 0; color: var(--color-neutral-600); padding: 0; }
.tree-toggle.leaf { cursor: default; visibility: hidden; }
.tree-code { font-family: var(--font-mono); font-size: 12.5px; color: var(--color-accent-800); }
.tree-name { color: var(--color-neutral-800); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tree-actions { text-align: right; white-space: nowrap; }
.tree-num { font-family: var(--font-mono); }

/* — rotalar: ürün seçici + zaman çizelgesi (referans v78 viewRoutes düzeni, v2 blueprint stili) — */
.part-picker { display: flex; gap: var(--space-4); align-items: flex-start; }
.part-list { width: 260px; flex: 0 0 260px; border: 1px solid var(--color-divider);
  background: var(--color-surface); max-height: 640px; overflow-y: auto; }
.part-list-item { padding: var(--space-3) var(--space-4); border-bottom: 1px solid var(--color-divider);
  cursor: pointer; font-size: 13px; }
.part-list-item:last-child { border-bottom: none; }
.part-list-item:hover { background: color-mix(in srgb, var(--color-text) 3%, transparent); }
.part-list-item.active { background: var(--color-accent-100);
  border-left: 3px solid var(--color-accent); padding-left: calc(var(--space-4) - 3px); }
.part-list-item .pn { font-family: var(--font-mono); font-size: 12.5px; font-weight: 600; }
.part-list-item .pmeta { font-size: 11px; color: var(--color-neutral-600); margin-top: 2px; }

.timeline { flex: 1; min-width: 0; }
.tl-cnc { font-family: var(--font-mono); font-size: 11px; text-transform: uppercase;
  letter-spacing: .06em; color: var(--color-neutral-500); margin: 18px 0 6px 40px; }
.tl-cnc:first-child { margin-top: 0; }
.tl-step { display: flex; gap: var(--space-4); }
.tl-marker-col { display: flex; flex-direction: column; align-items: center; }
.tl-num { min-width: 26px; height: 26px; padding: 0 5px; display: flex; align-items: center; justify-content: center;
  font-family: var(--font-mono); font-size: 11px; font-weight: 600; flex: 0 0 auto; z-index: 2;
  background: var(--color-surface); border: 2px solid var(--color-neutral-400);
  color: var(--color-neutral-600); }          /* KARE (radius:0) — v2 blueprint */
.tl-line { width: 2px; flex: 1; background: var(--color-neutral-400); margin: 2px 0; }
.tl-step:last-child .tl-line { display: none; }
.tl-content { padding-bottom: 22px; flex: 1; min-width: 0; }
.tl-title-row { display: flex; align-items: center; gap: 8px; margin-bottom: 5px; flex-wrap: wrap; }
.tl-title { font-weight: 600; font-size: 13.5px; }
.tl-variants { margin: 4px 0 6px; }
.tl-wc { display: flex; align-items: center; gap: 8px; margin-top: 5px; }
.tl-wc-name { font-size: 13px; }
.tl-wc-actions { margin-left: auto; white-space: nowrap; }
.tl-wc.flash { animation: flash 1.6s ease-out; }
.rt-note { font-size: 13px; color: var(--color-neutral-600); margin-top: 10px; }
.rt-drawer-note { font-size: 12.5px; line-height: 1.5; color: var(--color-neutral-600); }

/* Rotalar v2 (docs/Rotalar-v2.dc.html): iki kolonu DOLDURAN düzen — sol kolonda arama +
   ürün listesi, sağda panel + alt not; yükseklik flex ile bağlanır (sihirli sayı yok).
   Hepsi .rt-root altına kapsanır — Kapasiteler aynı .part-picker/.tl-* sınıflarını
   kullandığından ETKİLENMEZ. Paylaşılan .content düzenine dokunulmaz: .rt-root
   height:100% ile .content'i doldurur (kaydırma panellerin kendi içinde). */
.rt-root { height: 100%; display: flex; flex-direction: column; min-height: 0; }
.rt-head { flex: none; }
.rt-body { flex: 1; min-height: 0; display: grid; grid-template-columns: 272px minmax(0, 1fr);
  gap: 20px; align-items: stretch; overflow: hidden; }
.rt-col-left { min-width: 0; display: flex; flex-direction: column; min-height: 0; }
.rt-col-right { min-width: 0; display: flex; flex-direction: column; gap: 12px; min-height: 0; }
.rt-search { flex: none; padding-bottom: 10px; }
.rt-root .part-list { flex: 1; min-height: 0; width: auto; max-height: none; }
.rt-root .panel { flex: 1; min-height: 0; }
/* Panel başlığı: veri metni BÜYÜK HARFE ÇEVRİLMEZ (kod/ad sunucudan geldiği gibi) */
.rt-root .panel-head { flex: none; text-transform: none; padding: 14px 18px; }
.rt-root .panel-head h3 { font-family: var(--font-mono); font-size: 19px; font-weight: 500; color: var(--color-accent-800); margin: 0; }
.rt-root .panel-head .sub { font-family: var(--font-body); font-size: 13.5px; color: var(--color-neutral-700); }
.rt-root .panel-body { flex: 1; min-height: 0; overflow-y: auto; }
.rt-note { flex: none; font-size: 13px; color: var(--color-neutral-700); line-height: 1.5; margin-top: 0; }

/* Sol liste öğesi (tasarım: seçili accent-200 + inset sol çubuk) */
.rt-root .part-list-item { padding: 11px 13px; }
.rt-root .part-list-item.active { background: var(--color-accent-200);
  box-shadow: inset 3px 0 0 var(--color-accent); border-left: none; padding-left: 13px; }
.rt-root .part-list-item .pn { font-size: 13.5px; color: var(--color-accent-800); font-weight: 500; }
.rt-root .part-list-item .pname { font-size: 13px; color: var(--color-neutral-700);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.rt-root .part-list-item .pmeta { font-size: 12px; color: var(--color-neutral-600); }

/* Panel başlığı özeti (N adım · M operasyon) */
.rt-panel-title { display: flex; align-items: baseline; gap: 12px; min-width: 0; flex-wrap: wrap; }
.rt-panel-sum { font-family: var(--font-mono); font-size: 12px; color: var(--color-neutral-600); white-space: nowrap; }

/* Sıra kutusu (30×30, 1px): ana adım dolu aksan + beyaz; alt operasyon beyaz + hairline */
.rt-root .tl-num { width: 30px; height: 30px; min-width: 30px; border-width: 1px; font-size: 12.5px; }
.rt-root .tl-num.tl-main { background: var(--color-accent); border-color: var(--color-accent-700); color: #fff; }
.rt-root .tl-num.tl-sub { background: #fff; border-color: var(--color-neutral-400); color: var(--color-neutral-700); }
.rt-root .tl-line { width: 1px; background: var(--color-neutral-300); }
.rt-root .tl-step { gap: 14px; align-items: stretch; }

/* Adım başlığı + düğmeler (tasarım: satır içi, sarabilir; aksan-metin, hafif) */
.rt-root .tl-title-row { flex-wrap: wrap; min-height: 30px; }
.rt-root .tl-title { font-family: var(--font-heading); font-size: 18px; font-weight: 600; line-height: 1.15; }
.rt-root .tl-title-row .btn { height: 28px; padding: 0 10px; font-family: var(--font-body); font-weight: 400;
  font-size: 12.5px; color: var(--color-accent-700); border: 1px solid transparent; }
.rt-root .tl-title-row .btn:hover { background: var(--color-accent-100); }

/* İş merkezi satırı: rozet + ad + Düzenle (çerçeveli) / Sil (kırmızı çerçeveli) */
.rt-root .tl-wc { gap: 10px; margin-top: 6px; flex-wrap: wrap; }
.rt-root .tl-wc-name { font-size: 13.5px; }
.rt-root .tl-wc-actions { display: inline-flex; gap: 6px; }
.rt-root .tl-wc-actions .btn { height: 28px; padding: 0 10px; font-family: var(--font-body); font-weight: 400;
  font-size: 12.5px; background: #fff; border: 1px solid var(--color-neutral-400); color: var(--color-text); }
.rt-root .tl-wc-actions .btn:hover { background: var(--color-accent-200); border-color: var(--color-accent-500); }
.rt-root .tl-wc-actions .btn.tl-del { border-color: var(--color-danger); color: var(--color-danger); }
.rt-root .tl-wc-actions .btn.tl-del:hover { background: var(--color-danger-fill); border-color: var(--color-danger); }

/* Aktif hat yok uyarısı (yalnız Rotalar üretir) */
.tl-warn { margin-top: 8px; padding: 9px 12px; font-size: 13px; line-height: 1.5;
  color: var(--color-text); background: var(--color-warning-fill); border: 1px solid var(--color-warning); }
.tl-warn a { color: var(--color-accent-700); font-weight: 500; }

/* Arama sonucu boş — sol kolon (liste yerine) */
.rt-empty-search { flex: 1; display: flex; flex-direction: column; align-items: flex-start; gap: 12px;
  padding: 16px; background: var(--color-surface); border: 1px solid var(--color-neutral-400); }
.rt-empty-title { font-family: var(--font-heading); font-size: 14px; }

/* — katlanabilir blueprint paneli (ortak — core/collapsible.js) — */
/* Kutu + tıklanır başlık; Makine Durumu, Veri Kontrolü Uyarıları ve ileride başka
   ekranlar paylaşır. Panele özel içerik .cpanel-body içine gelir. */
.cpanel { position: relative; border: 1px solid var(--color-neutral-400); background: var(--color-surface); margin-bottom: 16px; }
.cpanel > .mreg { position: absolute; width: 9px; height: 9px; pointer-events: none; }   /* dört köşe registration işareti */
.cpanel > .mreg.tl { top: -1px; left: -1px; border-top: 2px solid var(--color-accent); border-left: 2px solid var(--color-accent); }
.cpanel > .mreg.tr { top: -1px; right: -1px; border-top: 2px solid var(--color-accent); border-right: 2px solid var(--color-accent); }
.cpanel > .mreg.bl { bottom: -1px; left: -1px; border-bottom: 2px solid var(--color-accent); border-left: 2px solid var(--color-accent); }
.cpanel > .mreg.br { bottom: -1px; right: -1px; border-bottom: 2px solid var(--color-accent); border-right: 2px solid var(--color-accent); }
.cpanel-head { display: flex; align-items: center; gap: 10px; padding: 12px 16px; cursor: pointer; user-select: none; }
.cpanel-head h3 { font-family: var(--font-heading); font-size: 15px; text-transform: uppercase; letter-spacing: 0.05em; margin: 0; }
.cpanel-caret { font-size: 11px; color: var(--color-neutral-600); width: 12px; text-align: center; }
.cpanel-dot { color: var(--color-neutral-400); }
.cpanel-meta { font-size: 13px; color: var(--color-neutral-700); }
.cpanel-right { margin-left: auto; }
.cpanel-body { border-top: 1px solid var(--color-neutral-200); }

/* — kapasiteler: makine durumu kart ızgarası + veri uyarıları (ortak .cpanel içinde) — */
.cap-mstat-strip { display: flex; align-items: center; gap: 12px; padding: 8px 16px; background: var(--color-neutral-100);
  border-bottom: 1px solid var(--color-neutral-200); font-size: 12.5px; }
.cap-mstat-sort { display: flex; gap: 4px; }
.cap-sort-btn { border: 1px solid var(--color-neutral-400); background: transparent; color: var(--color-neutral-700);
  font: inherit; padding: 2px 10px; cursor: pointer; }
.cap-sort-btn.on { background: var(--color-accent); border-color: var(--color-accent); color: var(--color-bg); }
.cap-mstat-hint { color: var(--color-neutral-600); }
.cap-mstat-strip-note { margin-left: auto; font-family: var(--font-mono); font-size: 11.5px; color: var(--color-neutral-600); }
.cap-mstat-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(322px, 1fr)); gap: 14px; align-items: stretch; padding: 16px; }
.cap-mstat-card { border: 1px solid var(--color-neutral-300); background: var(--color-surface); display: flex; flex-direction: column; }
.cap-mstat-card-hd { padding: 10px 12px; border-bottom: 1px solid var(--color-neutral-200);
  display: grid; grid-template-columns: minmax(0,1fr) auto; grid-template-areas: "top total" "bar total"; gap: 5px 10px; align-items: center; }
.cap-mstat-card-top { grid-area: top; display: flex; align-items: baseline; gap: 8px; min-width: 0; }
.cap-mstat-card-name { font-weight: 600; font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cap-mstat-card-ops { font-size: 11px; color: var(--color-neutral-600); white-space: nowrap; }
.cap-mstat-bar { grid-area: bar; height: 6px; background: var(--color-neutral-200); }
.cap-mstat-bar > i { display: block; height: 100%; background: var(--color-accent); }
.cap-mstat-bar > i.warn { background: var(--color-warning); }
.cap-mstat-card-total { grid-area: total; font-size: 15px; font-weight: 600; text-align: right; align-self: center; }
.cap-mstat-rows { display: flex; flex-direction: column; }
.cap-mstat-row { display: grid; grid-template-columns: 92px minmax(0,1fr) 92px; align-items: center; gap: 10px;
  height: 32px; padding: 0 12px; font-size: 12.5px; color: var(--color-text); text-decoration: none;
  border-bottom: 1px solid var(--color-neutral-100); }
.cap-mstat-row:last-child { border-bottom: none; }
.cap-mstat-row:hover { background: var(--color-accent-100); }
/* kod hücresi: iş emri no küçük ön-ek + ürün kodu (spec'in 3 kolonu korunur) */
.cap-mstat-code { display: flex; align-items: baseline; gap: 5px; min-width: 0; font-family: var(--font-mono); }
.cap-mstat-wo { flex: none; max-width: 44px; font-size: 10px; color: var(--color-neutral-500);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cap-mstat-codev { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cap-mstat-op { min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; color: var(--color-neutral-700); }
.cap-mstat-rem { text-align: right; }
.cap-mstat-more { border: none; border-top: 1px solid var(--color-neutral-200); background: transparent;
  color: var(--color-accent); font: inherit; font-size: 12px; padding: 7px 12px; text-align: left; cursor: pointer; }
.cap-mstat-more:hover { background: var(--color-neutral-100); }
.cap-mstat-empty { padding: 28px 16px; text-align: center; }
.cap-mstat-empty-title { font-weight: 600; font-size: 14px; margin-bottom: 4px; }
.cap-mstat-empty-msg { font-size: 13px; color: var(--color-neutral-600); }
.cap-warn-row { display: flex; align-items: center; gap: 8px; padding: 10px 14px;
  border-bottom: 1px solid var(--color-divider); font-size: 13px; }
.cap-warn-row:last-child { border-bottom: none; }
.cap-warn-row .grow { margin-left: auto; }
.tl-num.bottleneck { border-color: var(--color-danger); color: var(--color-danger); }
.cap-edit-row { display: flex; align-items: center; gap: 10px; margin-top: 8px; flex-wrap: wrap; font-size: 12.5px; }
.cap-edit-row .cap-active { display: flex; align-items: center; gap: 5px; cursor: pointer; }
.cap-input { width: 110px; }
.cap-min-wrap { display: flex; align-items: center; gap: 5px; padding-left: 10px; border-left: 1px solid var(--color-divider); }
.cap-min-input { width: 84px; }
.cap-note { font-size: 13px; color: var(--color-neutral-600); margin-top: 10px; }

/* — ilerleme çubuğu (iş emirleri) — */
.progress { display: flex; align-items: center; gap: 8px; }
.progress .bar { flex: 1; height: 7px; background: var(--color-neutral-200); min-width: 60px; }
.progress .bar > i { display: block; height: 100%; background: var(--color-accent); }
.progress .bar > i.full { background: var(--color-success); }
.progress .pct { font-family: var(--font-mono); font-size: 12px; color: var(--color-neutral-700); min-width: 34px; text-align: right; }

/* — iki kolonlu düzen (üretim girişi) — */
.split { display: grid; grid-template-columns: 390px minmax(0,1fr); gap: 20px; align-items: start; }
@media (max-width: 920px) { .split { grid-template-columns: 1fr; } }
.panel { border: 1px solid var(--color-divider); background: var(--color-surface); }
.panel-head { padding: 10px 14px; border-bottom: 1px solid var(--color-divider); display: flex;
  justify-content: space-between; align-items: baseline; font-family: var(--font-heading);
  font-size: 15px; text-transform: uppercase; letter-spacing: 0.05em; }
.panel-head .sub { font-family: var(--font-mono); font-size: 11px; color: var(--color-neutral-600); }
.panel-body { padding: 16px; }

/* — haftalık plan ızgarası (üretim planı) — */
.week-nav { display: flex; align-items: center; gap: 10px; }
.wgrid { border: 1px solid var(--color-divider); overflow: auto; background: var(--color-surface); }
.wgrid table { border-collapse: collapse; width: 100%; font-size: 13.5px; }
.wgrid th, .wgrid td { border: 1px solid color-mix(in srgb, var(--color-text) 10%, transparent); padding: 6px 8px; text-align: center; }
.wgrid th { background: var(--color-neutral-100); font-family: var(--font-heading); text-transform: uppercase; font-size: 11px; letter-spacing: 0.05em; }
.wgrid th .date { display: block; font-family: var(--font-mono); font-size: 10.5px; color: var(--color-neutral-600); font-weight: 400; }
.wgrid td.wc { text-align: left; white-space: nowrap; font-weight: 500; }
.wgrid td.wc .cap { display: block; font-family: var(--font-mono); font-size: 10.5px; color: var(--color-neutral-600); font-weight: 400; }
.wgrid td.cell { cursor: pointer; font-family: var(--font-mono); color: var(--color-neutral-500); }
.wgrid td.cell.has { background: var(--color-accent-100); color: var(--color-accent-900); font-weight: 500; }
.wgrid td.cell:hover { outline: 2px solid var(--color-accent); outline-offset: -2px; }

/* — üretim planı v2: hafta şeridi + satır içi düzenlenen ızgara + üç özet — */
.mp-weekbar { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.mp-weekbar .grow { flex: 1; }
.mp-weeklabel { font-family: var(--font-heading); font-size: 17px; letter-spacing: 0.02em; }
.mp-panel { border: 1px solid var(--color-divider); border-bottom: none; background: var(--color-surface); }
.mp-panel-hd { display: flex; align-items: center; gap: 14px; padding: 10px 14px; flex-wrap: wrap; }
.mp-panel-hd h3 { font-family: var(--font-heading); font-size: 15px; text-transform: uppercase; letter-spacing: 0.05em; margin: 0; }
.mp-panel-hd .grow { flex: 1; }
.mp-check { display: flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--color-neutral-700); cursor: pointer; }
.mp-group-toggle { display: flex; gap: 4px; }
.mp-grp-btn { border: 1px solid var(--color-neutral-400); background: transparent; color: var(--color-neutral-700);
  font: inherit; font-size: 12.5px; padding: 3px 12px; cursor: pointer; }
.mp-grp-btn.on { background: var(--color-accent); border-color: var(--color-accent); color: var(--color-bg); }

.mp-grid table { table-layout: fixed; }
.mp-grid th.mp-mcol, .mp-grid td.mp-mcol { width: 210px; text-align: left; white-space: normal; }
.mp-grid th:not(.mp-mcol) { min-width: 130px; }
.mp-grid td { vertical-align: top; }
.mp-grid th.mp-today { background: var(--color-accent-200); }
.mp-grid td.mp-today { background: var(--color-accent-100); }
.mp-grid th.mp-weekend { background: var(--color-neutral-200); }
.mp-grid td.mp-weekend { background: var(--color-neutral-100); }
.mp-mname { font-weight: 500; }
.mp-mop { font-family: var(--font-mono); font-size: 10.5px; color: var(--color-neutral-600); }
.mp-mcol.mp-indent { padding-left: 32px; }
.mp-opgroup td { background: var(--color-neutral-100); text-align: left; cursor: pointer; user-select: none;
  font-family: var(--font-mono); font-size: 10.5px; text-transform: uppercase; letter-spacing: 0.04em; }
.mp-caret { color: var(--color-neutral-600); }
.mp-opcount { color: var(--color-neutral-500); }
.mp-cell { text-align: left; }
.mp-sel { width: 100%; height: 30px; font-family: var(--font-mono); font-size: 11.5px; padding: 0 4px;
  border: 1px solid var(--color-neutral-300); background: var(--color-surface); }
.mp-target { width: 100%; height: 26px; margin-top: 4px; font-family: var(--font-mono); font-size: 12px;
  text-align: right; padding: 0 5px; border: 1px solid var(--color-neutral-300); background: var(--color-surface); }
.mp-target.mp-over { border: 2px solid var(--color-danger); background: var(--color-danger-fill); }
.mp-wonote { margin-top: 3px; font-family: var(--font-mono); font-size: 9.5px; color: var(--color-neutral-600); }
.mp-capnote { margin-top: 2px; font-size: 10px; color: var(--color-danger); }
.mp-sel:disabled, .mp-target:disabled { opacity: 0.45; cursor: not-allowed; }

.mp-summaries { display: flex; flex-direction: column; gap: 16px; margin-top: 20px; }
.mp-sum { border: 1px solid var(--color-divider); background: var(--color-surface); overflow: auto; }
.mp-sum-title { padding: 9px 12px; border-bottom: 1px solid var(--color-divider);
  font-family: var(--font-heading); font-size: 13px; text-transform: uppercase; letter-spacing: 0.05em; }
.mp-sum table { border-collapse: collapse; width: 100%; font-size: 12px; }
.mp-sum th, .mp-sum td { border: 1px solid color-mix(in srgb, var(--color-text) 8%, transparent); padding: 5px 7px; text-align: right; }
.mp-sum th:first-child, .mp-sum td:first-child { text-align: left; white-space: nowrap; }
.mp-sum th { background: var(--color-neutral-100); font-family: var(--font-heading); text-transform: uppercase;
  font-size: 10px; letter-spacing: 0.04em; }
.mp-sum-total { font-weight: 600; background: var(--color-neutral-100); }
.mp-sum-empty { text-align: left; color: var(--color-neutral-600); font-size: 12.5px; }

/* — üretim raporu (salt okunur pano) — */
.ur-bar { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.ur-modes { display: flex; gap: 4px; }
.ur-mode { border: 1px solid var(--color-neutral-400); background: transparent; color: var(--color-neutral-700);
  font: inherit; font-size: 13px; padding: 5px 14px; cursor: pointer; }
.ur-mode.on { background: var(--color-accent-900); border-color: var(--color-accent-900); color: #fff; }
.ur-nav { display: flex; align-items: center; gap: 10px; margin-left: auto; flex-wrap: wrap; }
.ur-period { font-family: var(--font-heading); font-size: 15px; letter-spacing: 0.02em; }
/* KPI değeri renk tonları (mevcut .kpi kartı üzerine) */
.kpi-value.accent { color: var(--color-accent-500); }
.kpi-value.success { color: var(--color-success); }
.kpi-value.warning { color: var(--color-warning); }
.kpi-value.danger { color: var(--color-danger); }
/* uyarı satırları */
.ur-warn { display: flex; gap: 8px; align-items: flex-start; padding: 9px 16px; font-size: 13px;
  border-bottom: 1px solid var(--color-divider); }
.ur-warn:last-child { border-bottom: none; }
.ur-warn-ic { color: var(--color-warning); }
/* tablolar: sayı kolonları sağa hizalı, mono */
.ur-table th.num, .ur-table td.num { text-align: right; }
.ur-table td.mono, .ur-table th.num { font-family: var(--font-mono); }
.ur-table .ur-dayname { color: var(--color-neutral-600); font-family: var(--font-body); font-size: 12px; margin-left: 4px; }
.ur-today-row td { background: var(--color-accent-100); }
.ur-barcol { width: 200px; }
.ur-bar-track { height: 8px; background: var(--color-neutral-200); overflow: hidden; }
.ur-bar-track > i { display: block; height: 100%; }
/* trend: çubuk = gerçek, dikey çizgi = plan */
.ur-trend-track { position: relative; height: 10px; background: var(--color-neutral-100); }
.ur-trend-track > i { display: block; height: 100%; background: var(--color-accent-400); }
.ur-trend-track > b { position: absolute; top: -2px; bottom: -2px; width: 2px; background: var(--color-accent-900); }
.ur-note { padding: 8px 16px 0; font-size: 12.5px; color: var(--color-neutral-600); }

/* — Verimlilik (iş emri bazında plan/gerçekleşme; ur-table iskeletini paylaşır) — */
.vr-table tbody tr.vr-row { cursor: pointer; }
.vr-table .vr-wo { font-size: 12px; color: var(--color-neutral-600); margin-top: 1px; }
.vr-empty { display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 14px; padding: 72px 24px; text-align: center; }
.vr-empty-mark { width: 44px; height: 44px; border: 1px solid var(--color-neutral-400); }
.vr-empty-title { font-family: var(--font-heading); font-size: 26px; font-weight: 600; }
.vr-empty-msg { margin: 0; font-size: 14.5px; color: var(--color-neutral-700); max-width: 52ch; line-height: 1.6; }

/* — tekrarlı satır editörü (ölçümler / karakteristikler) — */
.rows-ed { border: 1px solid var(--color-divider); }
.rows-ed .rows-head { display: grid; gap: 8px; padding: 6px 8px; border-bottom: 1px solid var(--color-divider);
  font-size: 11px; letter-spacing: 0.06em; text-transform: uppercase; color: var(--color-neutral-600); }
.rows-ed .row-line { display: grid; gap: 8px; align-items: center; padding: 6px 8px; }
/* Grid item'lar (özellikle FkSelect) küçülebilsin — yoksa min-width:auto taşırıp
   son kolonu (× butonu) çerçevenin dışına iter. */
.rows-ed .row-line > * { min-width: 0; }
.rows-ed .row-line + .row-line { border-top: 1px solid color-mix(in srgb, var(--color-text) 8%, transparent); }
.rows-ed .row-x { border: 0; background: none; cursor: pointer; color: var(--color-danger);
  font-size: 16px; line-height: 1; padding: 4px; justify-self: end; }
.rows-ed .rows-empty { padding: 8px; font-size: 13px; color: var(--color-neutral-600); }
.rows-ed-add { margin-top: 6px; }
.rows-ed .input, .rows-ed .fk-control { min-height: 32px; }
.char-block { border: 1px solid var(--color-divider); margin-bottom: 10px; }
.char-block .char-head { display: grid; grid-template-columns: 1fr auto; gap: 8px; align-items: center;
  padding: 8px; background: var(--color-neutral-100); border-bottom: 1px solid var(--color-divider); }
.char-block .char-head > * { min-width: 0; }
.char-block .char-head .row-x { justify-self: end; }
.char-block .char-body { padding: 8px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px 12px; }
.char-block .char-body > * { min-width: 0; }   /* alanlar taşmasın */
.char-block .char-values { grid-column: 1 / -1; }

/* — genişleyen satır + ölçüm detayı — */
.table th.expander, .table td.expander { width: 1%; padding-right: 0; }
.table td.expander .tree-toggle { visibility: visible; }
.table .detail-row > .detail-cell { padding: 0; background: var(--color-neutral-100);
  border-bottom: 1px solid var(--color-divider); }
.meas-detail { padding: 10px 16px; display: flex; flex-direction: column; gap: 8px; }
.meas-detail .mrow { display: grid; grid-template-columns: 220px 1fr auto; gap: 14px; align-items: baseline; font-size: 13.5px; }
.meas-detail .mloc { font-weight: 500; min-width: 0; }
.meas-detail .limits { display: block; font-size: 11px; color: var(--color-neutral-600); font-family: var(--font-mono); font-weight: 400; }
.meas-detail .mvals { font-family: var(--font-mono); display: flex; flex-wrap: wrap; gap: 4px 10px; min-width: 0; }
.meas-detail .v.out { color: var(--color-danger); font-weight: 700; }
.meas-detail .mstat { font-size: 12px; white-space: nowrap; }
.meas-detail .mstat.ok { color: var(--color-success); }
.meas-detail .mstat.bad { color: var(--color-danger); }
.meas-detail .empty { font-size: 13px; color: var(--color-neutral-600); }

/* Çocuk-kayıt detayı (genişleyen satır): mini tablo / alan ızgarası / etiketler */
.child-detail { padding: 10px 16px; }
.child-detail .cd-empty { font-size: 13px; color: var(--color-neutral-600); }
.cd-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.cd-table th { text-align: left; font-weight: 600; color: var(--color-neutral-600);
  font-size: 11px; text-transform: uppercase; letter-spacing: .04em; padding: 3px 14px 5px 0; }
.cd-table td { padding: 4px 14px 4px 0; border-top: 1px solid var(--color-divider); }
.cd-table .mono { font-family: var(--font-mono); }
.cd-fields { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 9px 22px; }
.cd-field { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.cd-field .cd-k { font-size: 11px; color: var(--color-neutral-600); text-transform: uppercase; letter-spacing: .04em; }
.cd-field .cd-v { font-size: 13.5px; }
.cd-field .cd-v.mono { font-family: var(--font-mono); }
.cd-chips { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }

/* Sipariş detay paneli — bölüm başlıkları, çapraz bağlantı, tıklanabilir satır */
.order-detail { padding: 4px 0 10px; }
.order-detail .child-detail { padding-top: 2px; padding-bottom: 2px; }
.cd-sectitle { font-family: var(--font-heading); font-size: 12.5px; font-weight: 600;
  text-transform: uppercase; letter-spacing: .04em; color: var(--color-neutral-600);
  margin: 14px 0 6px; padding: 0 16px; }
.cd-sectitle.first { margin-top: 4px; }
.xlink { color: var(--color-accent-800); text-decoration: none; border-bottom: 1px solid transparent; }
.xlink:hover { border-bottom-color: currentColor; }
.child-detail .cd-table tr.clickable { cursor: pointer; }
.child-detail .cd-table tr.clickable:hover td { background: var(--color-neutral-100); }
.table tbody tr.row-expandable { cursor: pointer; }

/* — Global arama (Cmd/Ctrl+K) — */
.topsearch { display: inline-flex; align-items: center; gap: 8px; height: 32px; padding: 0 8px 0 10px;
  background: var(--color-neutral-100); border: 1px solid var(--color-divider); color: var(--color-neutral-600);
  font-family: var(--font-body); font-size: 13px; cursor: pointer; }
.topsearch:hover { border-color: var(--color-neutral-400); color: var(--color-neutral-700); }
.topsearch .ts-ico { font-size: 15px; line-height: 1; }
.topsearch .ts-label { min-width: 92px; text-align: left; }
.topsearch .ts-kbd { font-family: var(--font-mono); font-size: 11px; color: var(--color-neutral-600);
  border: 1px solid var(--color-divider); padding: 1px 5px; background: #fff; }
@media (max-width: 760px) { .topsearch .ts-label { display: none; } }

.gsearch-backdrop { position: fixed; inset: 0; background: rgba(20, 25, 32, .35);
  display: flex; align-items: flex-start; justify-content: center; padding-top: 12vh; z-index: 1000; }
.gsearch { width: min(600px, 92vw); background: #fff; border: 1px solid var(--color-divider);
  box-shadow: 0 20px 60px rgba(0, 0, 0, .25); display: flex; flex-direction: column; max-height: 70vh; }
.gsearch-head { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-bottom: 1px solid var(--color-divider); }
.gsearch-ico { font-size: 18px; color: var(--color-neutral-600); }
.gsearch-input { flex: 1; border: 0; outline: none; background: none; color: var(--color-text);
  font-family: var(--font-body); font-size: 16px; }
.gsearch-esc { border: 1px solid var(--color-divider); background: var(--color-neutral-100); color: var(--color-neutral-600);
  font-family: var(--font-mono); font-size: 11px; padding: 3px 7px; cursor: pointer; }
.gsearch-list { overflow-y: auto; padding: 6px; }
.gsearch-hint { padding: 18px 12px; color: var(--color-neutral-600); font-size: 13.5px; text-align: center; }
.gsearch-group { font-family: var(--font-heading); font-size: 11px; font-weight: 600; text-transform: uppercase;
  letter-spacing: .05em; color: var(--color-neutral-600); padding: 10px 10px 4px; }
.gsearch-item { display: flex; align-items: baseline; gap: 10px; padding: 8px 10px; cursor: pointer; }
.gsearch-item.active { background: color-mix(in srgb, var(--color-accent) 12%, #fff); }
.gsearch-item .gs-label { flex: 1; font-size: 14px; color: var(--color-text); }
.gsearch-item .gs-meta { font-size: 12px; color: var(--color-neutral-600); font-family: var(--font-mono); }

/* — salt okunur panolar: Genel Bakış & Satış Raporları — */
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; margin-bottom: 20px; }
.kpi { background: var(--color-surface); border: 1px solid var(--color-divider); padding: 18px; }
.kpi-title { font-family: var(--font-heading); font-size: 13px; text-transform: uppercase; letter-spacing: .1em; color: var(--color-neutral-700); }
.kpi-value { font-family: var(--font-mono); font-size: 34px; line-height: 1; margin: 10px 0 6px; }
.kpi-value.danger { color: var(--color-danger); }
.kpi-detail { font-size: 13px; color: var(--color-neutral-600); }

.panels { display: flex; flex-wrap: wrap; gap: 20px; align-items: stretch; }
.panel { background: var(--color-surface); border: 1px solid var(--color-divider); min-width: 0; display: flex; flex-direction: column; }
.panel-wide { flex: 1 1 560px; }
.panel-side { flex: 1 1 380px; }
.panel-hd { padding: 14px 18px; border-bottom: 1px solid var(--color-divider); display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.panel-hd h3 { font-family: var(--font-heading); font-size: 20px; font-weight: 600; text-transform: uppercase; margin: 0; }
.panel-hd .sub { font-size: 13px; color: var(--color-neutral-600); }
.panel-bd { padding: 16px 18px; }
.panel-empty { padding: 20px 18px; font-size: 13.5px; color: var(--color-neutral-600); }

/* iş merkezi doluluk çubukları */
.load-row { display: grid; grid-template-columns: 190px minmax(0, 1fr) 78px; align-items: center; gap: 14px; }
.load-row + .load-row { margin-top: 14px; }
.load-name { font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.load-bar { height: 16px; background: var(--color-neutral-200); position: relative; display: block; }
.load-bar > i { position: absolute; left: 0; top: 0; bottom: 0; background: var(--color-accent); }
.load-bar > i.warn { background: var(--color-warning); }
.load-bar > i.over { background: var(--color-danger); }
.load-val { font-family: var(--font-mono); font-size: 13.5px; text-align: right; color: var(--color-neutral-700); }
.load-val.warn { color: var(--color-warning); }
.load-val.over { color: var(--color-danger); }

/* son kalite kayıtları listesi */
.q-row { display: grid; grid-template-columns: 100px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 0 18px; height: 44px; border-bottom: 1px solid var(--color-neutral-200); }
.q-row:last-child { border-bottom: 0; }
.q-code { font-family: var(--font-mono); font-size: 13px; color: var(--color-accent-800); }
.q-measure { font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.q-result { display: inline-flex; align-items: center; gap: 7px; font-size: 13.5px; justify-content: flex-end; white-space: nowrap; }
.q-dot { width: 7px; height: 7px; flex: none; background: var(--color-neutral-400); }
.q-dot.ok { background: var(--color-success); }
.q-dot.bad { background: var(--color-danger); }

/* satış raporları: aylık çubuk grafiği + kırılım barları + filtre + boş hal */
.rep-filter { display: flex; flex-wrap: wrap; gap: 14px; align-items: flex-end; margin-bottom: 20px; }
.rep-filter .field { margin: 0; }
.rep-filter .field label { display: block; font-size: 12px; color: var(--color-neutral-700); margin-bottom: 4px; }
.rep-note { font-size: 12.5px; color: var(--color-neutral-600); margin: -8px 0 20px; }
.bars { display: flex; align-items: flex-end; gap: 12px; height: 160px; }
.bar-col { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; gap: 6px; min-width: 0; }
.bar-fill { width: 100%; background: var(--color-accent-300); min-height: 3px; }
.bar-val { font-family: var(--font-mono); font-size: 11px; color: var(--color-neutral-700); }
.bar-label { font-family: var(--font-mono); font-size: 11px; color: var(--color-neutral-600); }
.brk-row { display: grid; grid-template-columns: 160px minmax(0, 1fr) 84px; gap: 12px; align-items: center; }
.brk-row + .brk-row { margin-top: 12px; }
.brk-name { font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.brk-name small { color: var(--color-neutral-600); }
.brk-bar { height: 14px; background: var(--color-neutral-200); position: relative; display: block; }
.brk-bar > i { position: absolute; left: 0; top: 0; bottom: 0; background: var(--color-accent-300); }
.brk-val { font-family: var(--font-mono); font-size: 12.5px; text-align: right; color: var(--color-neutral-600); }
.rep-empty { background: var(--color-surface); border: 1px solid var(--color-divider);
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px;
  padding: 64px 24px; text-align: center; }
.rep-empty .icon { width: 44px; height: 44px; border: 1px solid var(--color-neutral-400); }
.rep-empty h3 { font-family: var(--font-heading); font-size: 26px; font-weight: 600; text-transform: uppercase; margin: 0; }
.rep-empty p { margin: 0; font-size: 14.5px; color: var(--color-neutral-700); max-width: 52ch; line-height: 1.6; }
.rep-empty .acts { display: flex; gap: 10px; margin-top: 6px; flex-wrap: wrap; justify-content: center; }

/* Üretim Panosu (TV) — salt görüntüleme, otomatik yenilenen. Tipografi uzaktan
   okunacak kadar büyük (başlık 46 / KPI 58 / kart 44 px). Renkler dinamik → satır içi. */
.pano-root { display: flex; flex-direction: column; gap: 26px; background: var(--color-surface); }
.pano-root:fullscreen { padding: 30px 34px 34px; overflow-y: auto; }

.pano-head { display: flex; align-items: flex-start; gap: 24px;
  border-bottom: 1px solid var(--color-neutral-400); padding-bottom: 20px; }
.pano-title { font-family: var(--font-heading); font-size: 46px; font-weight: 600; line-height: 1; }
.pano-date { font-size: 19px; color: var(--color-neutral-600); margin-top: 6px; }
.pano-head-right { margin-left: auto; flex: none; display: flex; flex-direction: column; align-items: flex-end; gap: 10px; }
.pano-clock { font-family: var(--font-mono); font-size: 40px; font-weight: 500; line-height: 1; letter-spacing: 0.02em; }
.pano-fs { height: 36px; padding: 0 16px; font-size: 14px; background: transparent;
  border: 1px solid var(--color-neutral-400); color: var(--color-text); cursor: pointer; font-family: var(--font-body); }
.pano-fs:hover { background: var(--color-accent-100); border-color: var(--color-accent-500); }

.pano-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.pano-kpi { border: 1px solid var(--color-neutral-400); border-top: 3px solid var(--color-accent-500); padding: 18px 20px 20px; }
.pano-kpi-label { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.14em; color: var(--color-neutral-600); }
.pano-kpi-value { font-family: var(--font-heading); font-size: 58px; font-weight: 600; line-height: 1; margin-top: 10px; }
.pano-kpi-sub { font-size: 14px; color: var(--color-neutral-700); margin-top: 6px; }

.pano-empty { border: 1px solid var(--color-neutral-400); padding: 64px 24px; text-align: center; }
.pano-empty-title { font-family: var(--font-heading); font-size: 30px; font-weight: 600; }
.pano-empty-sub { font-size: 16px; color: var(--color-neutral-700); margin-top: 8px; }

.pano-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 18px; }
.pano-card { border: 1px solid var(--color-neutral-400); padding: 18px 20px 20px; }
.pano-card-top { display: flex; align-items: baseline; gap: 12px; }
.pano-card-name { font-family: var(--font-heading); font-size: 25px; font-weight: 600; min-width: 0; }
.pano-card-pct { margin-left: auto; flex: none; font-family: var(--font-mono); font-size: 16px; }
.pano-card-sub { font-size: 14.5px; color: var(--color-neutral-600); margin-top: 3px; font-family: var(--font-mono); }
.pano-card-nums { display: flex; align-items: baseline; gap: 8px; margin-top: 14px; }
.pano-card-actual { font-family: var(--font-heading); font-size: 44px; font-weight: 600; line-height: 1; }
.pano-card-target { font-size: 20px; color: var(--color-neutral-600); }
.pano-card-down { margin-left: auto; flex: none; font-family: var(--font-mono); font-size: 13px; padding: 3px 8px;
  border: 1px solid var(--pano-kotu); background: var(--pano-kotu-zemin); color: var(--pano-kotu); }
.pano-bar { display: block; height: 12px; background: var(--color-neutral-200); margin-top: 14px; position: relative; }
.pano-bar > i { position: absolute; left: 0; top: 0; bottom: 0; }

.pano-week-label { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.14em; color: var(--color-neutral-600); margin-bottom: 12px; }
.pano-week { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 12px; }
.pano-day { border: 1px solid var(--color-neutral-400); padding: 14px 12px; text-align: center; }
.pano-day-name { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.1em; color: var(--color-neutral-600); }
.pano-day-date { font-family: var(--font-mono); font-size: 13px; color: var(--color-neutral-700); margin-top: 3px; }
.pano-day-nums { font-family: var(--font-heading); font-size: 28px; font-weight: 600; margin-top: 10px; line-height: 1; }
.pano-day-nums small { font-size: 16px; font-weight: 500; color: var(--color-neutral-600); }
.pano-day-pct { font-family: var(--font-mono); font-size: 13px; margin-top: 6px; }

.pano-foot { font-size: 13px; color: var(--color-neutral-600); text-align: center; padding-top: 4px; }

/* Stok Durumu — hammadde tablosu (iki satırlı hücreler) + WIP aşama zinciri (numaralı) */
.stok-panel { margin-bottom: 22px; }
.stok-panel-head { padding: 14px 18px 12px; border-bottom: 1px solid var(--color-neutral-300); }
.stok-panel-title { font-family: var(--font-heading); font-size: 20px; font-weight: 600; }
.stok-panel-sub { font-size: 13px; color: var(--color-neutral-600); margin-top: 2px; }
.stok-tablewrap { overflow-x: auto; }
.stok-table { width: 100%; min-width: 1180px; border-collapse: collapse; font-size: 14px; table-layout: fixed; }
.stok-table thead th { text-align: left; padding: 9px 14px; font-family: var(--font-mono); font-size: 10.5px;
  letter-spacing: 0.12em; color: var(--color-neutral-700); font-weight: 500; background: var(--color-neutral-100);
  border-bottom: 1px solid var(--color-neutral-300); }
.stok-table th.stok-c-prod { width: 200px; padding-left: 18px; }
.stok-table th.stok-num { text-align: right; width: 150px; }
.stok-table th:nth-child(2) { width: 140px; }
.stok-table th:nth-child(6) { width: 120px; }
.stok-table tbody td { padding: 11px 14px; border-bottom: 1px solid var(--color-neutral-200); vertical-align: top; white-space: nowrap; }
.stok-table td.stok-c-prod { padding-left: 18px; }
.stok-table td.stok-num { text-align: right; }
.stok-table td.stok-orders { padding-right: 18px; font-size: 12.5px; color: var(--color-neutral-600); white-space: normal; }
.stok-table tbody tr:hover { background: var(--color-accent-100); }
.stok-table .mono { font-family: var(--font-mono); font-size: 13px; }
.stok-sub { font-size: 12px; color: var(--color-neutral-600); margin-top: 2px; }
.stok-ellip { overflow: hidden; text-overflow: ellipsis; }
.stok-badge { display: inline-block; padding: 2px 7px; font-size: 12px; border: 1px solid; }
.stok-badge-danger { border-color: var(--color-danger); background: var(--color-danger-fill); color: var(--color-danger); }
.stok-badge-warning { border-color: var(--color-warning); background: var(--color-warning-fill); color: var(--color-warning); }

.stok-wip-label { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.14em; color: var(--color-neutral-600); margin: 6px 0 12px; }
.stok-wip { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 20px; align-items: start; }
.stok-ordlist { overflow: hidden; }
.stok-ordlist-head { padding: 10px 14px; border-bottom: 1px solid var(--color-neutral-300); background: var(--color-neutral-100);
  font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.12em; color: var(--color-neutral-700); }
.stok-ordlist-body { max-height: 460px; overflow-y: auto; }
.stok-ord { padding: 11px 14px; border-bottom: 1px solid var(--color-neutral-200); cursor: pointer; border-left: 3px solid transparent; }
.stok-ord:hover { background: var(--color-accent-100); }
.stok-ord.on { background: var(--color-accent-100); border-left-color: var(--color-accent); }
.stok-ord-no { font-size: 13.5px; font-weight: 500; }
.stok-ord-meta { font-size: 12.5px; color: var(--color-neutral-600); margin-top: 2px; }
.stok-stages { min-width: 0; }
.stok-stages-head { padding: 14px 18px 12px; border-bottom: 1px solid var(--color-neutral-300); display: flex; align-items: baseline; gap: 12px; }
.stok-stages-code { font-size: 16px; font-weight: 500; }
.stok-stages-sub { font-size: 13px; color: var(--color-neutral-600); }
.stok-stages-body { padding: 6px 18px 18px; }
.stok-stage { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 14px; }
.stok-stage-mark { display: flex; flex-direction: column; align-items: center; padding-top: 14px; }
.stok-stage-num { width: 30px; height: 30px; flex: none; display: grid; place-items: center; font-family: var(--font-mono); font-size: 13px; border: 1px solid; }
.stok-stage-line { flex: 1; width: 1px; background: var(--color-neutral-300); min-height: 18px; }
.stok-stage-body { padding: 14px 0; border-bottom: 1px solid var(--color-neutral-200); min-width: 0; }
.stok-stage-titlerow { display: flex; align-items: baseline; gap: 10px; }
.stok-stage-name { font-family: var(--font-heading); font-size: 20px; font-weight: 600; }
.stok-stage-note { font-size: 12.5px; color: var(--color-neutral-600); }
.stok-stage-nums { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 10px; }
.stok-stage-lbl { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.1em; color: var(--color-neutral-600); }
.stok-stage-val { font-size: 20px; margin-top: 3px; }

/* Kalite Kontrol — sol sipariş listesi + sağ plan maddeleri (ölçüsel kumpas + nitel butonlar) */
.kk-head { align-items: flex-end; }
.kk-shift { display: flex; align-items: center; gap: 10px; }
.kk-shift-lbl { font-size: 13.5px; color: var(--color-neutral-600); }
.kk-shift-seg { display: flex; border: 1px solid var(--color-neutral-400); }
.kk-shift-btn { width: 42px; height: 38px; font-size: 14px; border: 0; border-left: 1px solid var(--color-neutral-400);
  cursor: pointer; background: transparent; color: var(--color-text); font-family: var(--font-body); }
.kk-shift-btn:first-child { border-left: 0; }
.kk-shift-btn.on { background: var(--color-accent-900); color: #fff; font-weight: 500; }

.kk-grid { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 20px; align-items: start; }
.kk-orders { overflow: hidden; }
.kk-orders-head, .kk-items-head { background: var(--color-neutral-100); }
.kk-orders-head { padding: 10px 14px; border-bottom: 1px solid var(--color-neutral-300);
  font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.12em; color: var(--color-neutral-700); }
.kk-orders-body { max-height: 620px; overflow-y: auto; }
.kk-ord { padding: 12px 14px; border-bottom: 1px solid var(--color-neutral-200); cursor: pointer; border-left: 3px solid transparent; }
.kk-ord:hover { background: var(--color-accent-100); }
.kk-ord.on { background: var(--color-accent-100); border-left-color: var(--color-accent); }
.kk-ord-code { font-size: 13.5px; font-weight: 500; }
.kk-ord-meta { font-size: 12.5px; color: var(--color-neutral-600); margin-top: 2px; }
.kk-ord-prog { display: flex; align-items: center; gap: 8px; margin-top: 6px; }
.kk-ord-prog .mono { font-family: var(--font-mono); font-size: 12px; color: var(--color-neutral-700); }
.kk-badge-bad { padding: 1px 6px; font-size: 11.5px; border: 1px solid var(--color-danger); background: var(--color-danger-fill); color: var(--color-danger); }

.kk-items { min-width: 0; }
.kk-items-head { padding: 14px 20px 12px; border-bottom: 1px solid var(--color-neutral-300); display: flex; align-items: baseline; gap: 12px; flex-wrap: wrap; }
.kk-h-code { font-size: 17px; font-weight: 500; }
.kk-h-name { font-size: 13.5px; color: var(--color-neutral-600); }
.kk-h-order { font-family: var(--font-mono); font-size: 12.5px; }
.kk-h-sum { margin-left: auto; font-family: var(--font-mono); font-size: 12px; color: var(--color-neutral-600); }
.kk-items-body { padding: 4px 20px 24px; }
.kk-group { padding-top: 18px; }
.kk-group-head { font-family: var(--font-heading); font-size: 15px; font-weight: 600; letter-spacing: 0.06em;
  color: var(--color-neutral-700); padding-bottom: 7px; border-bottom: 1px solid var(--color-neutral-300); }
.kk-item { display: flex; align-items: center; gap: 18px; padding: 11px 0; border-bottom: 1px solid var(--color-neutral-200); }
.kk-item-info { flex: 1; min-width: 180px; }
.kk-item-char { font-size: 14px; font-weight: 500; }
.kk-item-spec { font-size: 12.5px; color: var(--color-neutral-600); margin-top: 2px; }

.kk-olcusel { flex: none; display: flex; align-items: center; gap: 12px; }
.kk-num { width: 104px; height: 38px; padding: 0 10px; font-size: 14px; border: 1px solid var(--color-neutral-400);
  background: #fff; color: var(--color-text); text-align: right; }
.kk-bar { display: block; position: relative; width: 140px; height: 26px; }
.kk-bar-track { position: absolute; left: 0; right: 0; top: 12px; height: 2px; background: var(--color-neutral-300); }
.kk-bar-nominal { position: absolute; top: 5px; height: 16px; width: 1px; background: var(--color-neutral-600); }
.kk-bar-marker { position: absolute; top: 3px; height: 20px; width: 3px; transform: translateX(-1px); }
.kk-res-wrap { flex: none; width: 104px; font-size: 13px; }
.kk-res { display: inline-block; padding: 2px 8px; border: 1px solid; }
.kk-res-pass { border-color: var(--color-success); background: var(--color-success-fill); color: var(--color-success); }
.kk-res-fail { border-color: var(--color-danger); background: var(--color-danger-fill); color: var(--color-danger); }
.kk-res-none { border-color: transparent; color: var(--color-neutral-500); }

.kk-nitel { flex: none; display: flex; align-items: center; gap: 8px; width: 262px; justify-content: flex-end; }
.kk-nitel-btn { height: 38px; padding: 0 16px; font-size: 14px; cursor: pointer; border: 1px solid var(--color-neutral-400);
  background: transparent; color: var(--color-text); font-family: var(--font-body); }
.kk-nitel-pass.on { background: var(--color-accent); border-color: var(--color-accent-700); color: #fff; font-weight: 500; }
.kk-nitel-fail.on { background: var(--color-danger); border-color: var(--color-danger); color: #fff; font-weight: 500; }
.kk-num:disabled, .kk-nitel-btn:disabled { opacity: 0.6; cursor: not-allowed; }

/* Genel Bakış v2 — 5 KPI + geciken görev tablosu + darboğaz listesi + MRP özeti */
.gb-kpis { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 18px; margin-bottom: 20px; }
.gb-kpi { background: var(--color-surface); border: 1px solid var(--color-neutral-400); border-top: 3px solid var(--color-accent-500); padding: 15px 16px 17px; }
.gb-kpi-label { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.13em; color: var(--color-neutral-600); }
.gb-kpi-value { font-family: var(--font-heading); font-size: 40px; font-weight: 600; line-height: 1.05; margin-top: 8px; }
.gb-kpi-sub { font-size: 13px; color: var(--color-neutral-700); margin-top: 4px; }

.gb-panel { margin-bottom: 20px; }
.gb-panel-head { padding: 14px 18px 12px; border-bottom: 1px solid var(--color-neutral-300); display: flex; align-items: baseline; gap: 12px; }
.gb-panel-title { font-family: var(--font-heading); font-size: 19px; font-weight: 600; }
.gb-panel-sub { font-size: 13px; color: var(--color-neutral-600); }
.gb-badge-bad { flex: none; padding: 2px 8px; font-family: var(--font-mono); font-size: 12px; border: 1px solid var(--color-danger); background: var(--color-danger-fill); color: var(--color-danger); }
.gb-note { padding: 10px 18px 14px; font-size: 12.5px; color: var(--color-neutral-600); }

.gb-tablewrap { overflow-x: auto; }
.gb-table { width: 100%; min-width: 680px; border-collapse: collapse; font-size: 14px; }
.gb-table thead th { text-align: left; padding: 9px 18px; font-family: var(--font-mono); font-size: 10.5px;
  letter-spacing: 0.12em; color: var(--color-neutral-700); font-weight: 500; background: var(--color-neutral-100);
  border-bottom: 1px solid var(--color-neutral-300); }
.gb-table th.gb-c-who, .gb-table th.gb-c-due { width: 130px; }
.gb-table th.gb-c-delay { width: 110px; text-align: right; }
.gb-table tbody td { padding: 10px 18px; border-bottom: 1px solid var(--color-neutral-200); }
.gb-table td.gb-c-who, .gb-table td.gb-c-due { font-family: var(--font-mono); font-size: 13px; }
.gb-table td.gb-c-delay { text-align: right; }
.gb-table tbody tr:hover { background: var(--color-accent-100); }

.gb-bn-body { padding: 14px 18px 8px; display: flex; flex-direction: column; gap: 10px; }
.gb-bn-row { display: grid; grid-template-columns: 160px minmax(0, 1fr) 240px 70px; gap: 14px; align-items: center; }
.gb-bn-code { font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gb-bn-station { font-size: 12.5px; color: var(--color-neutral-600); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gb-bn-cap { font-size: 13px; text-align: right; }
.gb-bar { display: block; height: 12px; background: var(--color-neutral-200); position: relative; }
.gb-bar > i { position: absolute; left: 0; top: 0; bottom: 0; }

.gb-mrp { padding: 16px 18px 18px; display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 24px; align-items: start; }
.gb-mrp-nums { display: flex; flex-direction: column; gap: 14px; }
.gb-mrp-lbl { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.13em; color: var(--color-neutral-600); }
.gb-mrp-val { font-family: var(--font-heading); font-size: 30px; font-weight: 600; line-height: 1.1; margin-top: 3px; }
.gb-mrp-list { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.gb-risk-row { display: grid; grid-template-columns: 150px minmax(0, 1fr) 200px 60px; gap: 14px; align-items: center; }
.gb-risk-row > a { font-size: 13px; }
.gb-risk-reason { font-size: 12.5px; color: var(--color-neutral-600); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gb-risk-pct { font-size: 13px; text-align: right; }

@media (max-width: 1100px) {
  .gb-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .gb-mrp { grid-template-columns: 1fr; }
}

/* Tedarikçi & Site Yönetimi — sıralanabilir tablo (kolon başlığı tıklanır) + iki satırlı SQE/SQM */
.site-tablewrap { border: 1px solid var(--color-neutral-400); background: var(--color-surface); overflow-x: auto; }
.site-table { width: 100%; min-width: 1120px; border-collapse: collapse; font-size: 14px; }
.site-table thead th { text-align: left; padding: 9px 14px; font-family: var(--font-mono); font-size: 10.5px;
  letter-spacing: 0.12em; color: var(--color-neutral-700); font-weight: 500; background: var(--color-neutral-100);
  border-bottom: 1px solid var(--color-neutral-300); white-space: nowrap; position: sticky; top: 0; }
.site-table th.site-th { cursor: pointer; }
.site-table th.site-th:hover { color: var(--color-accent-800); }
.site-table th.site-th.on { color: var(--color-accent-800); }
.site-table tbody td { padding: 10px 14px; border-bottom: 1px solid var(--color-neutral-200); vertical-align: top; }
.site-table td.site-c-supplier { font-weight: 500; }
.site-table tbody tr:hover { background: var(--color-accent-100); }
.site-mail { font-family: var(--font-mono); font-size: 12px; color: var(--color-neutral-600); margin-top: 2px; }
.site-c-actions { white-space: nowrap; }
.site-acts { display: flex; gap: 8px; justify-content: flex-end; }
.site-empty { padding: 44px 24px; text-align: center; color: var(--color-neutral-600); font-size: 14.5px; }

/* Görev Takibi v2 — 5 KPI + sekme şeridi + sekme tabloları/pano/hatırlatma kartları */
.gt-kpis { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 18px; margin-bottom: 18px; }
.gt-kpi { background: var(--color-surface); border: 1px solid var(--color-neutral-400); border-top: 3px solid var(--color-accent-500); padding: 14px 16px 16px; }
.gt-kpi-label { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.13em; color: var(--color-neutral-600); }
.gt-kpi-value { font-family: var(--font-heading); font-size: 38px; font-weight: 600; line-height: 1.05; margin-top: 6px; }

.gt-tabs { display: flex; border-bottom: 1px solid var(--color-neutral-400); margin-bottom: 20px; }
.gt-tab { height: 40px; padding: 0 18px; font-size: 14px; cursor: pointer; background: transparent;
  border: 1px solid var(--color-neutral-400); border-bottom: 0; border-left: 0; color: var(--color-neutral-600);
  font-family: var(--font-body); margin-bottom: -1px; }
.gt-tab:first-child { border-left: 1px solid var(--color-neutral-400); }
.gt-tab.on { background: var(--color-surface); color: var(--color-text); font-weight: 500; }

.gt-panel { margin-bottom: 20px; }
.gt-panel-head { padding: 14px 18px 12px; border-bottom: 1px solid var(--color-neutral-300); display: flex; align-items: baseline; gap: 12px; }
.gt-panel-title { font-family: var(--font-heading); font-size: 19px; font-weight: 600; }
.gt-panel-sub { font-size: 13px; color: var(--color-neutral-600); }

.gt-tablewrap { overflow-x: auto; }
.gt-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.gt-tasks { min-width: 1240px; }
.gt-table thead th { text-align: left; padding: 9px 12px; font-family: var(--font-mono); font-size: 10.5px;
  letter-spacing: 0.12em; color: var(--color-neutral-700); font-weight: 500; background: var(--color-neutral-100);
  border-bottom: 1px solid var(--color-neutral-300); white-space: nowrap; }
.gt-table th.gt-num { text-align: right; }
.gt-table tbody td { padding: 10px 12px; border-bottom: 1px solid var(--color-neutral-200); vertical-align: middle; }
.gt-table td.gt-num { text-align: right; }
.gt-table td.gt-strong { font-weight: 500; }
.gt-table tbody tr:hover { background: var(--color-accent-100); }
.gt-row-late { background: var(--color-danger-fill); }
.gt-row-click { cursor: pointer; }
.gt-notes { font-size: 12.5px; }
.gt-acts { display: flex; gap: 8px; justify-content: flex-end; }

.gt-chip { display: inline-block; padding: 2px 8px; font-size: 12.5px; border: 1px solid; white-space: nowrap; }
.gt-chip-ok { border-color: var(--color-success); background: var(--color-success-fill); color: var(--color-success); }
.gt-chip-warn { border-color: var(--color-warning); background: var(--color-warning-fill); color: var(--color-warning); }
.gt-chip-bad { border-color: var(--color-danger); background: var(--color-danger-fill); color: var(--color-danger); font-family: var(--font-mono); }
.gt-chip-neutral { border-color: var(--color-neutral-400); background: var(--color-neutral-100); color: var(--color-neutral-600); }

.gt-prog { display: flex; align-items: center; gap: 8px; }
.gt-prog-bar { display: block; flex: 1; height: 10px; background: var(--color-neutral-200); position: relative; min-width: 40px; }
.gt-prog-bar > i { position: absolute; left: 0; top: 0; bottom: 0; background: var(--color-accent-500); }
.gt-prog-pct { flex: none; font-size: 12.5px; }

.gt-board { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 20px; align-items: start; }
.gt-dist { padding: 14px 18px 18px; display: flex; flex-direction: column; gap: 12px; }
.gt-dist-row { display: grid; grid-template-columns: minmax(90px, 140px) minmax(50px, 1fr) 54px; gap: 12px; align-items: center; }
.gt-dist-label { font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gt-dist-n { font-size: 13px; text-align: right; }
.gt-bar { display: block; height: 12px; background: var(--color-neutral-200); position: relative; }
.gt-bar > i { position: absolute; left: 0; top: 0; bottom: 0; }
.gt-sumcards { padding: 14px 18px 18px; display: flex; flex-direction: column; gap: 14px; }
.gt-sumcard { display: flex; align-items: baseline; gap: 12px; padding-bottom: 12px; border-bottom: 1px solid var(--color-neutral-200); }
.gt-sumcard:last-child { border-bottom: 0; padding-bottom: 0; }
.gt-sumcard-label { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.13em; color: var(--color-neutral-600); }
.gt-sumcard-sub { font-size: 13px; color: var(--color-neutral-700); margin-top: 3px; }
.gt-sumcard-val { margin-left: auto; flex: none; font-family: var(--font-heading); font-size: 34px; font-weight: 600; line-height: 1; }

.gt-rems { padding: 16px 18px 18px; display: flex; flex-direction: column; gap: 16px; }
.gt-rem { border: 1px solid var(--color-neutral-300); }
.gt-rem-head { padding: 10px 14px; background: var(--color-neutral-100); border-bottom: 1px solid var(--color-neutral-300); display: flex; align-items: center; gap: 12px; }
.gt-rem-msg { margin: 0; padding: 14px; font-family: var(--font-mono); font-size: 12.5px; line-height: 1.7; white-space: pre-wrap; color: var(--color-text); }

@media (max-width: 1100px) { .gt-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } .gt-board { grid-template-columns: 1fr; } }

/* Günlük Kalite Raporları v2 — filtre çubuğu + sekmeler + Günlük Özet tablosu */
.gkr-filter { background: var(--color-surface); border: 1px solid var(--color-neutral-400); padding: 12px 16px;
  display: flex; align-items: flex-end; gap: 16px; flex-wrap: nowrap; overflow-x: auto; margin-bottom: 16px; }
.gkr-f { flex: none; }
.gkr-f label { display: block; font-size: 12px; color: var(--color-neutral-700); margin-bottom: 4px; }
.gkr-f .input { height: 36px; }
.gkr-f select.input { min-width: 160px; }
.gkr-shift { display: flex; border: 1px solid var(--color-neutral-400); }
.gkr-shift-btn { width: 40px; height: 36px; font-size: 14px; border: 0; border-left: 1px solid var(--color-neutral-400);
  cursor: pointer; background: transparent; color: var(--color-text); font-family: var(--font-body); }
.gkr-shift-btn:first-child { border-left: 0; }
.gkr-shift-btn.on { background: var(--color-accent-900); color: #fff; font-weight: 500; }
.gkr-summary { margin-left: auto; flex: none; font-size: 12px; color: var(--color-neutral-600); white-space: nowrap; }

.gkr-tabs { display: flex; border-bottom: 1px solid var(--color-neutral-400); margin-bottom: 20px; }
.gkr-tab { height: 40px; padding: 0 18px; font-size: 14px; cursor: pointer; background: transparent;
  border: 1px solid var(--color-neutral-400); border-bottom: 0; border-left: 0; color: var(--color-neutral-600);
  font-family: var(--font-body); margin-bottom: -1px; white-space: nowrap; }
.gkr-tab:first-child { border-left: 1px solid var(--color-neutral-400); }
.gkr-tab.on { background: var(--color-surface); color: var(--color-text); font-weight: 500; }

.gkr-panel-head { padding: 14px 18px 12px; border-bottom: 1px solid var(--color-neutral-300); display: flex; align-items: baseline; gap: 12px; }
.gkr-panel-title { font-family: var(--font-heading); font-size: 19px; font-weight: 600; }
.gkr-panel-sub { font-size: 13px; color: var(--color-neutral-600); }
.gkr-tablewrap { overflow-x: auto; }
.gkr-table { width: 100%; min-width: 1080px; border-collapse: collapse; font-size: 14px; }
.gkr-table thead th { text-align: left; padding: 9px 18px; font-family: var(--font-mono); font-size: 10.5px;
  letter-spacing: 0.12em; color: var(--color-neutral-700); font-weight: 500; background: var(--color-neutral-100);
  border-bottom: 1px solid var(--color-neutral-300); white-space: nowrap; }
.gkr-table th.gkr-num { text-align: right; }
.gkr-table tbody td { padding: 10px 18px; border-bottom: 1px solid var(--color-neutral-200); vertical-align: middle; }
.gkr-table td.gkr-num { text-align: right; }
.gkr-table td.gkr-hours { font-size: 12.5px; color: var(--color-neutral-700); }
.gkr-table tbody tr:hover { background: var(--color-accent-100); }
.gkr-chip { display: inline-block; padding: 2px 8px; font-size: 12.5px; border: 1px solid; }
.gkr-chip-success { border-color: var(--color-success); background: var(--color-success-fill); color: var(--color-success); }
.gkr-chip-danger { border-color: var(--color-danger); background: var(--color-danger-fill); color: var(--color-danger); font-family: var(--font-mono); }
.gkr-chip-neutral { border-color: var(--color-neutral-400); background: var(--color-neutral-100); color: var(--color-neutral-600); }
.gkr-empty { padding: 40px 24px; text-align: center; color: var(--color-neutral-600); font-size: 14.5px; }

/* Günlük Kalite — First Off sekmesi (liste hücreleri + form: gerekçe kutucukları, numune ızgarası) */
.gkr-fo-reason { font-size: 12.5px; color: var(--color-neutral-700); }
.gkr-fo-note { font-style: italic; color: var(--color-neutral-600); margin-top: 3px; }
.gkr-fo-meta { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.gkr-fo-sec { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.13em; color: var(--color-neutral-600); margin: 22px 0 8px; }
.gkr-reasons { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 8px; }
.gkr-reason { display: flex; align-items: center; gap: 9px; padding: 9px 12px; font-size: 13.5px; text-align: left;
  cursor: pointer; border: 1px solid var(--color-neutral-400); background: var(--color-surface); color: var(--color-text); font-family: var(--font-body); }
.gkr-reason-box { width: 14px; height: 14px; flex: none; border: 1px solid var(--color-neutral-500); background: var(--color-surface); }
.gkr-reason.on { border-color: var(--color-accent-500); background: var(--color-accent-100); }
.gkr-reason.on .gkr-reason-box { border-color: var(--color-accent-700); background: var(--color-accent); }
.gkr-fo-grid td { padding: 6px 10px; }
.gkr-fo-grid td.gkr-cell { text-align: center; padding: 6px 6px; }
.gkr-scell { width: 72px; height: 32px; padding: 0 6px; font-size: 12.5px; border: 1px solid var(--color-neutral-400); background: var(--color-surface); color: var(--color-text); }
input.gkr-scell { text-align: right; font-family: var(--font-mono); }
.gkr-fo-bottom { margin-top: 18px; display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 20px; align-items: end; }
.gkr-fo-karar { border: 1px solid var(--color-neutral-400); padding: 10px 14px; }
.gkr-fo-karar-lbl { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.13em; color: var(--color-neutral-600); }
.gkr-fo-karar-val { font-family: var(--font-heading); font-size: 24px; font-weight: 600; margin-top: 2px; }

/* Günlük Kalite — Saatlik Kontrol sekmesi (iş merkezi rozeti + saat blokları) */
.gkr-wc { flex: none; padding: 2px 8px; font-family: var(--font-mono); font-size: 12px;
  border: 1px solid var(--color-neutral-400); background: var(--color-neutral-100); color: var(--color-neutral-700); }
.gkr-hblock-head { display: flex; align-items: center; gap: 12px; padding-bottom: 8px; border-bottom: 1px solid var(--color-neutral-300); }
.gkr-hblock-hour { font-family: var(--font-heading); font-size: 20px; font-weight: 600; }
.gkr-hblock-personel { width: 180px; height: 34px; }
.gkr-hblock-head .gkr-chip { margin-left: auto; }
.gkr-hblock-head .btn { flex: none; }

/* Satış Siparişleri — sıralanabilir tablo + durum filtreleri + rapor modalı */
.ss-filters { display: flex; border: 1px solid var(--color-neutral-400); flex: none; }
.ss-filter { height: 38px; padding: 0 14px; font-size: 14px; border: 0; border-left: 1px solid var(--color-neutral-400);
  cursor: pointer; background: transparent; color: var(--color-text); font-family: var(--font-body); white-space: nowrap; }
.ss-filter:first-child { border-left: 0; }
.ss-filter.on { background: var(--color-accent-900); color: #fff; font-weight: 500; }

.ss-tablewrap { border: 1px solid var(--color-neutral-400); background: var(--color-surface); overflow-x: auto; }
.ss-table { width: 100%; min-width: 1340px; border-collapse: collapse; font-size: 14px; }
.ss-table thead th { padding: 9px 14px; font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.12em;
  color: var(--color-neutral-700); font-weight: 500; background: var(--color-neutral-100);
  border-bottom: 1px solid var(--color-neutral-300); white-space: nowrap; position: sticky; top: 0; text-align: left; }
.ss-table th.ss-th { cursor: pointer; }
.ss-table th.ss-th:hover, .ss-table th.ss-th.on { color: var(--color-accent-800); }
.ss-table tbody td { padding: 10px 14px; border-bottom: 1px solid var(--color-neutral-200); vertical-align: top; }
.ss-table tbody tr:hover { background: var(--color-accent-100); }
.ss-table .ss-strong { font-weight: 500; }
.ss-sub { font-size: 12px; color: var(--color-neutral-600); margin-top: 2px; }
.ss-c-actions { white-space: nowrap; }
.ss-acts { display: flex; gap: 8px; justify-content: flex-end; }
.ss-empty { padding: 44px 24px; text-align: center; color: var(--color-neutral-600); font-size: 14.5px; }
.ss-foot { padding: 10px 2px 0; font-size: 12.5px; }

.ss-badge { display: inline-block; padding: 2px 8px; font-size: 12.5px; border: 1px solid; white-space: nowrap; }
.ss-badge-success { border-color: var(--color-success); background: var(--color-success-fill); color: var(--color-success); }
.ss-badge-danger { border-color: var(--color-danger); background: var(--color-danger-fill); color: var(--color-danger); }
.ss-badge-warning { border-color: var(--color-warning); background: var(--color-warning-fill); color: var(--color-warning); }
.ss-badge-accent { border-color: var(--color-accent-500); background: var(--color-accent-100); color: var(--color-accent-800); }
.ss-prog { display: flex; align-items: center; gap: 8px; margin-top: 6px; }
.ss-prog-bar { display: block; flex: 1; height: 8px; background: var(--color-neutral-200); position: relative; min-width: 46px; }
.ss-prog-bar > i { position: absolute; left: 0; top: 0; bottom: 0; }
.ss-prog-pct { flex: none; font-size: 12px; color: var(--color-neutral-600); }

.ss-modal-backdrop { position: fixed; inset: 0; background: rgba(29,31,32,0.5); display: grid; place-items: center; z-index: 40; padding: 24px; }
.ss-modal { width: 820px; max-width: 100%; max-height: 100%; background: var(--color-surface); border: 1px solid var(--color-neutral-500);
  box-shadow: var(--shadow-lg); display: flex; flex-direction: column; }
.ss-modal-head { flex: none; padding: 16px 20px 14px; border-bottom: 1px solid var(--color-neutral-300); display: flex; align-items: center; gap: 12px; }
.ss-modal-title { font-family: var(--font-heading); font-size: 22px; font-weight: 600; }
.ss-modal-head .btn { margin-left: auto; }
.ss-modal-body { flex: 1; overflow-y: auto; padding: 18px 20px 20px; }
.ss-modal-foot { flex: none; padding: 14px 20px 18px; border-top: 1px solid var(--color-neutral-300); display: flex; justify-content: flex-end; }
.ss-r-info { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px 20px; }
.ss-r-lbl { font-size: 12px; color: var(--color-neutral-700); }
.ss-r-val { font-size: 14px; margin-top: 3px; }
.ss-r-eta { margin-top: 20px; padding-top: 14px; border-top: 1px solid var(--color-neutral-300); }
.ss-r-sec { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.13em; color: var(--color-neutral-600); margin-bottom: 10px; }
.ss-r-warn { font-size: 13.5px; color: var(--color-neutral-700); border: 1px solid var(--color-warning); background: var(--color-warning-fill); padding: 12px 14px; }
.ss-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.ss-kpi { border: 1px solid var(--color-neutral-400); border-top: 3px solid var(--color-accent-500); padding: 12px 14px 14px; }
.ss-kpi-lbl { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.13em; color: var(--color-neutral-600); }
.ss-kpi-val { font-family: var(--font-heading); font-size: 22px; font-weight: 600; line-height: 1.1; margin-top: 6px; }
.ss-r-table { width: 100%; border-collapse: collapse; font-size: 14px; border: 1px solid var(--color-neutral-300); }
.ss-r-table th { text-align: left; padding: 8px 12px; font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.12em;
  color: var(--color-neutral-700); font-weight: 500; background: var(--color-neutral-100); border-bottom: 1px solid var(--color-neutral-300); }
.ss-r-table td { padding: 8px 12px; border-bottom: 1px solid var(--color-neutral-200); }

/* Üretim Siparişleri v2 — KPI + İş Emri Aç modalı + form modalı */
.ss-badge-neutral { border-color: var(--color-neutral-400); background: var(--color-neutral-100); color: var(--color-neutral-700); }
.uo-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; margin-bottom: 18px; }
.uo-kpi { background: var(--color-surface); border: 1px solid var(--color-neutral-400); border-top: 3px solid var(--color-accent-500); padding: 14px 16px 16px; }
.uo-kpi-label { font-family: var(--font-mono); font-size: 10.5px; letter-spacing: 0.13em; color: var(--color-neutral-600); }
.uo-kpi-value { font-family: var(--font-heading); font-size: 34px; font-weight: 600; line-height: 1.05; margin-top: 6px; }
.row-flash { animation: uo-flash 1.5s ease-out; }
@keyframes uo-flash { from { background: var(--color-accent-200); } to { background: transparent; } }

.uo-modal-backdrop { position: fixed; inset: 0; background: rgba(29,31,32,0.5); display: grid; place-items: center; z-index: 40; padding: 24px; }
.uo-modal { max-width: 100%; max-height: 100%; background: var(--color-surface); border: 1px solid var(--color-neutral-500); box-shadow: var(--shadow-lg); display: flex; flex-direction: column; }
.uo-modal-head { flex: none; padding: 16px 20px 14px; border-bottom: 1px solid var(--color-neutral-300); display: flex; align-items: center; gap: 12px; }
.uo-modal-title { font-family: var(--font-heading); font-size: 22px; font-weight: 600; }
.uo-modal-head .btn { margin-left: auto; }
.uo-modal-body { flex: 1; overflow-y: auto; padding: 18px 20px 20px; }
.uo-modal-foot { flex: none; padding: 14px 20px 18px; border-top: 1px solid var(--color-neutral-300); display: flex; gap: 10px; justify-content: flex-end; align-items: center; }

.uo-step { border: 1px solid var(--color-neutral-300); padding: 12px 14px; margin-bottom: 12px; }
.uo-step-head { display: flex; align-items: baseline; gap: 10px; margin-bottom: 8px; }
.uo-step-title { font-family: var(--font-heading); font-size: 16px; font-weight: 600; }
.uo-step-meta { font-size: 12.5px; }
.uo-mrow { display: flex; align-items: center; gap: 10px; margin-bottom: 6px; }
.uo-msel { flex: 1; min-width: 0; height: 34px; }
.uo-mpct { flex: none; width: 46px; text-align: right; font-size: 13px; }
.uo-mtgt { flex: none; width: 80px; text-align: right; font-size: 12.5px; }
.uo-addm { margin-top: 4px; }
.uo-variant { margin-top: 10px; display: flex; align-items: center; gap: 8px; }
.uo-variant .uo-vsel { height: 34px; min-width: 180px; }
.uo-warn { font-size: 12.5px; color: var(--color-warning); background: var(--color-warning-fill); border: 1px solid var(--color-warning); padding: 6px 10px; margin-top: 6px; }

.uo-preview { font-size: 13px; margin: -4px 0 14px; min-height: 18px; }
.uo-frow { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.uo-modal-body .field { margin-bottom: 12px; }
.uo-modal-body .field label { display: block; font-size: 12.5px; color: var(--color-neutral-700); margin-bottom: 5px; }
.uo-form-err { font-size: 13px; color: var(--color-danger); border: 1px solid var(--color-danger); background: var(--color-danger-fill); padding: 8px 12px; }