/* ==========================================================================
   DOAM PANEL — Ana Stil (açık tema, mavi vurgu)
   ========================================================================== */

:root {
    --bg:          #eef3f9;   /* en arka plan (buz mavisi) */
    --bg-2:        #f4f7fb;   /* içerik alanı */
    --panel:       #ffffff;   /* kartlar */
    --panel-2:     #edf3f9;   /* kart üst/tablo başlığı */
    --sidebar:     #e7eef7;   /* sol menü (soluk mavi) */
    --topbar:      #ffffff;   /* üst bar */
    --border:      #d3dfec;
    --text:        #1e2733;   /* ana yazı (koyu lacivert-gri) */
    --muted:       #64748b;   /* soluk yazı */
    --accent:      #2f7bff;   /* DOAM mavi (Kaydet/Giriş) */
    --accent-2:    #2260e6;   /* koyu DOAM mavi (hover/link) */
    --accent-grad: linear-gradient(100deg,#37c6f4 0%,#2f7bff 46%,#8b5cf6 100%); /* DOAM marka gradyanı */
    --input-bg:    #ffffff;   /* form alanı */
    --input-text:  #1e2733;
    --danger:      #c0392b;
    --success:     #2e7d48;
    --info:        #2f7bff;
    --radius:      10px;
    --shadow:      0 6px 20px rgba(30,39,51,.08);
    --sidebar-w:   232px;
}

* { box-sizing: border-box; }

/* ---------- Simgeler (core/Ikon.php — çizgi SVG) ----------
   Rengi bulunduğu yerden alır (stroke="currentColor"), yani menüde soluk,
   aktif satırda mavi, butonda buton rengi olur — ayrıca kural yazmaya gerek yok. */
.ikon { display: block; flex: none; }
/* Yazının içinde geçen küçük simgeler (tablo hücresi, rozet, satır sonu) */
.ikon-satir { display: inline-block; vertical-align: -2px; }
/* Başlık/buton/etiket içindeki simgeleri metinle aynı hizaya getir */
.page-h1 .ikon, .panel-head h2 .ikon, .btn .ikon,
label .ikon, .yetki-ad .ikon, .alert .ikon { display: inline-block; vertical-align: -3px; }
.btn .ikon { margin-right: 2px; }

html, body {
    margin: 0;
    padding: 0;
    font-family: "Segoe UI", Roboto, system-ui, Arial, sans-serif;
    background: var(--bg);
    color: var(--text);
    font-size: 15px;
    line-height: 1.5;
    /* Sayfa asla yatay kaymasın (mobilde sağa-sola kayma engeli). Geniş içerik
       kendi .table-wrap kutusunda kayar; sayfa gövdesi sabit kalır. */
    max-width: 100%;
    overflow-x: hidden;
}
/* Görseller kutusundan taşmasın (sabit boyutlu .kalem-gorsel vb. etkilenmez) */
img:not([class]), video { max-width: 100%; height: auto; }

a { color: var(--accent-2); text-decoration: none; }
a:hover { text-decoration: underline; }

/* ---------- Uygulama düzeni (sidebar + main) ---------- */
body.app { display: flex; min-height: 100vh; }

.sidebar {
    width: var(--sidebar-w);
    flex: 0 0 var(--sidebar-w);
    background: var(--sidebar);
    border-right: 1px solid var(--border);
    display: flex;
    flex-direction: column;
    position: sticky;
    top: 0;
    height: 100vh;
    overflow-y: auto;
}

.brand {
    padding: 16px 16px 14px;
    border-bottom: 1px solid var(--border);
}
.brand a { display: block; }
.brand-logo {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    background: #fff;
    padding: 11px 13px;
    border-radius: 10px;
    box-sizing: border-box;
}
.brand-main { font-weight: 800; font-size: 20px; color: var(--text); }
.brand-sub  { font-weight: 800; font-size: 20px; color: var(--accent); margin-left: 4px; }

.menu { padding: 10px 0; display: flex; flex-direction: column; }
.menu-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 20px;
    color: var(--muted);
    font-size: 14px;
    border-left: 3px solid transparent;
    white-space: nowrap;
}
.menu-item:hover { background: rgba(47,114,184,.08); color: var(--text); text-decoration: none; }
.menu-item.active {
    background: rgba(47,114,184,.14);
    color: var(--accent-2);
    font-weight: 600;
    border-left-color: var(--accent);
}
.menu-item.disabled { color: #9aa7b5; cursor: default; }
.menu-item.disabled:hover { background: none; }
.menu-icon {
    width: 20px;
    height: 20px;
    flex: 0 0 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #8496a9;            /* simgeler yazıdan bir ton soluk */
}
.menu-item:hover .menu-icon,
.menu-item.active .menu-icon { color: var(--accent); }
.menu-label { flex: 1; }

/* ---------- Menü grubu (Yönetim — açılır/kapanır) ---------- */
.menu-group { display: flex; flex-direction: column; }
.menu-group-head {
    width: 100%;
    background: none;
    font-family: inherit;
    font-size: 14px;
    text-align: left;
    cursor: pointer;
    border: none;
    border-left: 3px solid transparent;
}
.menu-group-head:hover { background: rgba(47,114,184,.08); color: var(--text); }
.menu-ok {
    display: flex;
    color: #9aa9ba;
    transition: transform .18s ease;
}
.menu-group.acik .menu-ok { transform: rotate(180deg); }

/* Kapalıyken alt satırlar gizli; açılırken yumuşak iner.
   0fr→1fr numarası tek bir ızgara satırı gerektirir; o yüzden satırlar
   .menu-group-inner içinde sarmalanmış durumda (yoksa her satır ayrı satır olur). */
.menu-group-body {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows .18s ease;
}
.menu-group.acik .menu-group-body { grid-template-rows: 1fr; }
.menu-group-inner {
    min-height: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    visibility: hidden;   /* kapalıyken Tab ile içine girilmesin */
}
.menu-group.acik .menu-group-inner { visibility: visible; }

/* Grup içindeki satırlar: biraz içeride ve bir tık küçük */
.menu-alt {
    padding-left: 30px;
    font-size: 13.5px;
}
.menu-alt .menu-icon { width: 18px; flex-basis: 18px; height: 18px; }

/* Menüde animasyon istemeyen kullanıcı */
@media (prefers-reduced-motion: reduce) {
    .menu-ok, .menu-group-body { transition: none; }
}
.soon {
    font-size: 10px;
    background: #dbe5f0;
    color: #5b6b7d;
    padding: 1px 6px;
    border-radius: 20px;
}

/* ---------- Ana alan ---------- */
.main { flex: 1; display: flex; flex-direction: column; min-width: 0; background: var(--bg-2); }

.topbar {
    height: 60px;
    background: var(--topbar);
    border-bottom: 1px solid var(--border);
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 0 22px;
    position: sticky;
    top: 0;
    z-index: 20;
}
.page-title { font-size: 18px; font-weight: 700; flex: 1; }
.topbar-right { display: flex; align-items: center; gap: 14px; }
.user-box { display: flex; flex-direction: column; align-items: flex-end; line-height: 1.2; }
.user-name { font-weight: 600; font-size: 14px; }
.user-dept { font-size: 12px; color: var(--muted); }

.hamburger {
    display: none;
    background: none;
    border: none;
    color: var(--text);
    font-size: 22px;
    cursor: pointer;
}

.content { padding: 24px; flex: 1; }

/* ---------- Dashboard ---------- */
.welcome h1 { margin: 0 0 4px; font-size: 22px; }
.welcome p  { margin: 0 0 20px; color: var(--muted); }

.stat-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
    gap: 16px;
    margin-bottom: 22px;
}
.stat-card {
    background: var(--panel);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: 0 1px 3px rgba(30,39,51,.06);
    padding: 18px;
    display: flex;
    align-items: center;
    gap: 14px;
}
.stat-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    flex: 0 0 44px;
    border-radius: 10px;
    background: rgba(47,114,184,.10);
    color: var(--accent);
}
.stat-info { display: flex; flex-direction: column; }
.stat-value { font-size: 26px; font-weight: 800; }
.stat-label { font-size: 13px; color: var(--muted); }

/* ---------- Panel / kart ---------- */
.panel {
    background: var(--panel);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    box-shadow: 0 1px 3px rgba(30,39,51,.06);
    overflow: hidden;
}
.panel-head {
    padding: 14px 18px;
    border-bottom: 1px solid var(--border);
    background: var(--panel-2);
}
.panel-head h2 { margin: 0; font-size: 16px; }
.panel-body { padding: 18px; }
.muted { color: var(--muted); }

/* ---------- Butonlar ---------- */
.btn {
    display: inline-block;
    padding: 10px 18px;
    border: 1px solid transparent;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    text-align: center;
}
.btn:hover { text-decoration: none; }
.btn-primary { background: var(--accent); color: #fff; }
.btn-primary:hover { background: var(--accent-2); color: #fff; }
.btn-ghost {
    background: transparent;
    border-color: var(--border);
    color: var(--text);
}
.btn-ghost:hover { background: rgba(30,39,51,.06); color: var(--text); }
.btn-warning { background: #e08a1e; color: #fff; border-color: #e08a1e; }
.btn-warning:hover { background: #c5760f; color: #fff; }
/* Teklif/sipariş/üretim satırındaki ürün küçük görseli */
.kalem-gorsel {
    width: 42px; height: 42px; object-fit: cover;
    border: 1px solid var(--border); border-radius: 6px;
    vertical-align: middle; margin-right: 8px;
}
.btn-block { display: block; width: 100%; }

/* ---------- Uyarı / bildirim ---------- */
.alert {
    padding: 11px 16px;
    border-radius: 8px;
    margin-bottom: 14px;
    font-size: 14px;
    border: 1px solid transparent;
}
.alert-success { background: #e8f5ec; border-color: #a8d5b6; color: #1f5c33; }
.alert-error   { background: #fbeceb; border-color: #e7b5ae; color: #8f2b20; }
.alert-info    { background: #e9f1fa; border-color: #b3cde8; color: #1f5183; }
.alert-warning { background: #fdf4e3; border-color: #e8cf9a; color: #8a5a12; }

/* ---------- Formlar ---------- */
label {
    display: block;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .5px;
    color: var(--muted);
    margin: 14px 0 6px;
}
input[type="text"], input[type="password"], input[type="email"],
input[type="number"], input[type="tel"], input[type="date"], input[type="search"],
select, textarea {
    width: 100%;
    padding: 11px 13px;
    background: var(--input-bg);
    color: var(--input-text);
    border: 1px solid #c2d2e3;
    border-radius: 7px;
    font-size: 15px;
    font-family: inherit;
}
input:focus, select:focus, textarea:focus {
    outline: none;
    border-color: var(--accent);
    box-shadow: 0 0 0 3px rgba(47,114,184,.18);
}

/* ---------- Giriş ekranı ---------- */
.auth-body {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    background:
        radial-gradient(1200px 500px at 50% -10%, #dfeaf7 0%, var(--bg) 60%);
    padding: 20px;
}
.auth-wrap { width: 100%; max-width: 400px; }
.auth-card {
    background: var(--panel);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 32px 28px;
    box-shadow: var(--shadow);
}
.auth-brand { text-align: center; }
.auth-brand .brand-main, .auth-brand .brand-sub { font-size: 26px; }
.auth-logo {
    display: block;
    width: 100%;
    max-width: 280px;
    height: auto;
    margin: 0 auto;
    background: #fff;
    padding: 16px 20px;
    border-radius: 12px;
    box-sizing: border-box;
}
.auth-slogan { text-align: center; color: var(--muted); margin: 4px 0 18px; font-size: 13px; }
.auth-form { margin-top: 6px; }
.auth-form .btn { margin-top: 22px; }
.auth-foot { text-align: center; color: var(--muted); font-size: 12px; margin: 20px 0 0; }

/* ---------- Sayfa başlığı + aksiyonlar ---------- */
.page-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
    flex-wrap: wrap;
}
.page-h1 { margin: 0; font-size: 22px; }
.page-actions { display: flex; gap: 8px; flex-wrap: wrap; }

/* stat-card link olduğunda */
a.stat-card { text-decoration: none; color: inherit; transition: border-color .15s; }
a.stat-card:hover { border-color: var(--accent); }

/* ---------- Araç çubuğu (arama) ---------- */
.toolbar {
    display: flex;
    gap: 8px;
    margin-bottom: 16px;
    max-width: 640px;
}
.toolbar input[type="text"] { flex: 1; }
.live-spinner { align-self: center; color: var(--muted); font-size: 13px; white-space: nowrap; }

/* Arama + tarih aralığı + sıralama bir arada olan geniş araç çubuğu */
.toolbar-genis { max-width: 100%; flex-wrap: wrap; align-items: flex-end; }
.toolbar-genis input[type="text"] { min-width: 220px; }
.toolbar-alan { display: flex; flex-direction: column; gap: 4px; margin: 0; }
.toolbar-alan > span {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .5px;
    color: var(--muted);
    text-transform: uppercase;
}
.toolbar-alan input[type="date"], .toolbar-alan select { width: auto; padding: 10px 12px; }
.toolbar-genis .btn { align-self: flex-end; }
.filter-etiket {
    align-self: center;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .5px;
    color: var(--muted);
    text-transform: uppercase;
    margin-right: 2px;
}

/* ---------- Veri tablosu ---------- */
/* Geniş tablolar SADECE kendi kutusunda yatay kayar; sayfa gövdesi kaymaz.
   Mobilde parmakla akıcı kaydırma. */
.table-wrap { overflow-x: auto; max-width: 100%; -webkit-overflow-scrolling: touch; }
.data-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}
.data-table thead th {
    text-align: left;
    padding: 12px 14px;
    background: var(--panel-2);
    color: var(--muted);
    font-size: 12px;
    letter-spacing: .5px;
    text-transform: uppercase;
    border-bottom: 1px solid var(--border);
    white-space: nowrap;
}
.data-table thead th.col-num,
.data-table thead th.col-actions { text-align: right; }
.data-table tbody td {
    padding: 11px 14px;
    border-bottom: 1px solid var(--border);
    vertical-align: middle;
}
.data-table tbody tr:hover { background: rgba(47,114,184,.06); }
.data-table .empty { text-align: center; color: var(--muted); padding: 30px 14px; }
.data-table a { color: var(--text); }
.data-table a:hover { color: var(--accent-2); }
.col-actions { text-align: right; white-space: nowrap; width: 1%; }
.col-num { text-align: right; white-space: nowrap; }
.row-passive td { opacity: .55; }

.btn-mini {
    display: inline-block;
    padding: 5px 10px;
    font-size: 12.5px;
    font-weight: 600;
    border-radius: 6px;
    border: 1px solid var(--border);
    background: transparent;
    color: var(--text);
    cursor: pointer;
}
.btn-mini:hover { background: rgba(30,39,51,.06); text-decoration: none; }
.btn-mini.danger { color: #b03a2b; border-color: #e7bdb7; }
.btn-mini.danger:hover { background: rgba(192,57,43,.10); }

.badge {
    display: inline-block;
    padding: 2px 9px;
    font-size: 12px;
    font-weight: 700;
    border-radius: 20px;
    background: rgba(47,114,184,.12);
    color: var(--accent-2);
}

/* ---------- Sayfalama ---------- */
.pagination { display: flex; gap: 6px; margin-top: 16px; flex-wrap: wrap; }
.page-link {
    display: inline-block;
    min-width: 34px;
    text-align: center;
    padding: 7px 10px;
    border: 1px solid var(--border);
    border-radius: 7px;
    color: var(--text);
    font-size: 14px;
}
.page-link:hover { background: rgba(30,39,51,.06); text-decoration: none; }
.page-link.active { background: var(--accent); border-color: var(--accent); color: #fff; }

/* ---------- Form ızgarası ---------- */
.form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px 20px;
}
.form-grid .fg-full { grid-column: 1 / -1; }
/* Açılır-kapanır panel (Depo → Stok Durumu): başlığa tıklayınca aşağı açılır */
details.stok-acilir > summary { cursor: pointer; list-style: none; user-select: none; }
details.stok-acilir > summary::-webkit-details-marker { display: none; }
details.stok-acilir > summary:hover { background: #e4ecf6; }
details.stok-acilir > summary h2 { display: flex; align-items: center; gap: 8px; }
details.stok-acilir .stok-acilir-ok {
    margin-left: auto; font-size: 18px; color: var(--accent); transition: transform .2s;
}
details.stok-acilir[open] .stok-acilir-ok { transform: rotate(180deg); }
details.stok-acilir:not([open]) > summary { border-bottom: none; }
details.stok-acilir[open] > .table-wrap { animation: acilirIn .2s ease-out; }
@keyframes acilirIn { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
@media print { details.stok-acilir > summary .stok-acilir-ok { display: none; } }

/* Tarih kutuları: stil diğer kutularla aynı; ama GENİŞLİK yalnızca form ızgarasında tam.
   Satır içi formlarda (araç çubuğu, irsaliye satırı, filtreler) kendi boyunda kalır —
   yoksa yanındaki kutuları ezer. */
input[type="date"] { width: auto; min-width: 150px; }
.form-grid input[type="date"], .panel-body > input[type="date"], .form-row input[type="date"] { width: 100%; min-height: 45px; }
/* 4 sütunlu düzen (teklif formu gibi yoğun formlar) */
.form-grid.fg-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px 18px; }
.form-grid.fg-4 .fg-2 { grid-column: span 2; }
.form-grid.fg-4 .fg-3 { grid-column: span 3; }
.form-not { font-size: 12px; color: var(--muted); margin: 5px 0 0; }
input[readonly].salt-okunur, input:disabled.salt-okunur { background: #f1f5f9; color: #475569; }
@media (max-width: 1100px) {
    .form-grid.fg-4 { grid-template-columns: 1fr 1fr; }
    .form-grid.fg-4 .fg-3 { grid-column: 1 / -1; }
}
@media (max-width: 640px) {
    .form-grid.fg-4 { grid-template-columns: 1fr; }
    .form-grid.fg-4 .fg-2, .form-grid.fg-4 .fg-3 { grid-column: auto; }
}
.form-grid label:first-child { margin-top: 0; }
.form-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 22px;
    padding-top: 16px;
    border-top: 1px solid var(--border);
}

/* ---------- Filtre sekmeleri ---------- */
.filter-tabs { display: flex; gap: 6px; margin-bottom: 14px; flex-wrap: wrap; }
.ftab {
    padding: 7px 14px;
    border: 1px solid var(--border);
    border-radius: 20px;
    color: var(--muted);
    font-size: 13px;
}
.ftab:hover { color: var(--text); text-decoration: none; background: rgba(30,39,51,.06); }
.ftab.active { background: var(--accent); border-color: var(--accent); color: #fff; }

/* ---------- Durum rozetleri ---------- */
.durum {
    display: inline-block;
    padding: 3px 10px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 700;
    white-space: nowrap;
}
.durum-beklemede { background: #e6eaef; color: #475569; }
/* Yeni sipariş akışı durumları */
.durum-onay_bekliyor  { background: #f0e7dd; color: #7a5a3c; }
.durum-uretim_basladi { background: #fbeadd; color: #9a4a22; }
.durum-uretim_bitti   { background: #e3eefa; color: #1f5183; }
.durum-kalitede       { background: #ede4f7; color: #5b3f80; }
/* Yeni teklif akışı durumları */
.tdurum-termin_bekliyor { background: #f0e7dd; color: #7a5a3c; }
.tdurum-termin_alindi   { background: #e3eefa; color: #1f5183; }
/* Üretim ekranındaki termin verme formu */
.termin-form { display: flex; gap: 6px; align-items: stretch; margin: 0; }
.termin-form input[type="date"] { width: auto; }
.termin-form input[type="text"] { flex: 1; min-width: 90px; }
.termin-form .btn { padding: 8px 14px; white-space: nowrap; }
.durum-uretimde  { background: #fbeadd; color: #9a4a22; }
.durum-hazir     { background: #e2f2e8; color: #1f6b3c; }
.durum-sevk      { background: #e3eefa; color: #1f5183; }
.durum-iptal     { background: #fae4e1; color: #99271b; }
.durum-kismi_sevk       { background: #fdf0d8; color: #9a6a0a; }
.durum-irsaliye_kesildi { background: #e6f0fb; color: #2f7bff; }
.durum-fatura_edildi    { background: #dff3ea; color: #146c43; }
/* Sipariş durumunun altındaki sevkiyat özeti (irsaliye / depo / sevk) */
.sevk-ozet { display: flex; flex-direction: column; gap: 2px; margin-top: 4px; font-size: 11.5px; line-height: 1.35; color: #475569; }
.sevk-ozet .so-satir { display: flex; align-items: center; gap: 5px; white-space: nowrap; }
.sevk-ozet .so-nokta { width: 8px; height: 8px; border-radius: 50%; flex: 0 0 8px; }
.sevk-ozet .so-turuncu { background: #e6a23c; }
.sevk-ozet .so-yesil   { background: #2f9e5a; }
.sevk-ozet .so-mavi    { background: #2f7bff; }
.sevk-ozet .so-gri     { background: #9aa7b5; }
.sevk-ozet strong { color: #1e2733; font-weight: 600; }
.tdurum-taslak    { background: #e6eaef; color: #475569; }
.tdurum-gonderildi { background: #e3eefa; color: #1f5183; }
.tdurum-onaylandi  { background: #e2f2e8; color: #1f6b3c; }
.tdurum-reddedildi { background: #fae4e1; color: #99271b; }
/* Süresi doldu: reddedilmiş değil, sadece zamanı geçmiş — nötr gri-turuncu */
.tdurum-suresi_doldu { background: #f0e7dd; color: #7a5a3c; }
/* Satın alma durumları */
.sadurum-talep   { background: #e6eaef; color: #475569; }
.sadurum-siparis { background: #e3eefa; color: #1f5183; }
.sadurum-kismi   { background: #fbeadd; color: #9a4a22; }
.sadurum-teslim  { background: #e2f2e8; color: #1f6b3c; }
.sadurum-iptal   { background: #fae4e1; color: #99271b; }

/* Listede satir-ici durum acilir menusu (renk tdurum sinifindan gelir) */
.durum-select {
    width: auto;
    max-width: 150px;
    padding: 3px 22px 3px 9px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 700;
    border: 1px solid var(--border);
    cursor: pointer;
    line-height: 1.4;
    height: auto;
}
.durum-select:focus { outline: none; box-shadow: 0 0 0 2px rgba(47,114,184,.25); }
.durum-select option { background: var(--panel); color: var(--text); font-weight: 600; }
/* Seçilemeyen durumlar (sistem/üretim belirler) görünür ama soluk */
select option:disabled { color: #9aa7b5; font-style: italic; }

/* ---------- Belge (sipariş/teklif) ---------- */
.belge-ust { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.belge-ust p { margin: 0 0 8px; }
.durum-form { display: flex; gap: 8px; margin-top: 12px; }
.durum-form select { flex: 1; }

.belge-kalem input, .belge-kalem select {
    padding: 7px 9px;
    font-size: 13.5px;
}
.belge-kalem .k-tutar { font-weight: 700; }

.belge-toplam {
    margin-left: auto;
    max-width: 340px;
    margin-top: 8px;
}
.belge-toplam > div {
    display: flex;
    justify-content: space-between;
    padding: 6px 0;
    border-bottom: 1px solid var(--border);
}
.belge-toplam .genel {
    border-bottom: none;
    border-top: 2px solid var(--accent);
    margin-top: 4px;
    font-size: 18px;
}
.belge-toplam .genel strong { color: var(--accent-2); }

/* ---------- Yazdırma ---------- */
.print-only { display: none; }

@media print {
    @page { size: A4 portrait; margin: 0.6cm; }
    html, body { height: auto !important; }
    .sidebar, .topbar, .no-print, .filter-tabs, .toolbar, .durum-form, .overlay { display: none !important; }
    body.app { display: block; min-height: 0 !important; }
    .main { display: block !important; min-height: 0 !important; height: auto !important; }
    /* Kâğıt kenarına yapışmasın: yazıcı boşluğu "Yok" seçilse bile içerik kendi
       boşluğunu taşısın (üst + sağ/sol). @page boşluğuyla toplanır ama içerik kısa
       olduğu için tek sayfaya rahat sığar. */
    /* Yanlardan bol boşluk, üst/alt dar — tek sayfaya sığsın ama kenara yapışmasın.
       Baskı yazı boyutu hafif küçük (14→12.5px): her yeri orantılı kısaltıp tek
       sayfa payını artırır, okunurluğu bozmaz. */
    .content { padding: 0.7cm 1.1cm 0.3cm !important; font-size: 12.5px; display: block !important; flex: none !important; min-height: 0 !important; }
    /* Baskıda sıkı yerleşim: panel/tablo iç boşlukları küçülsün (iş kâğıdı hariç) */
    .panel-body { padding: 8px 11px !important; }
    .data-table td, .data-table th { padding: 5px 9px !important; }
    .is-kagidi .data-table tbody td { padding: 9px 11px !important; }
    .belge-toplam { padding: 2px 0 !important; }
    .belge-toplam div { padding: 2px 0 !important; }
    /* Koyu tema arka planlarını tamamen beyaza çevir (boş sayfada siyah kalmasın) */
    html, body, body.app, .main, .content, .panel, .panel-body { background: #fff !important; color: #000 !important; }
    /* Yalnızca açık gri başlıklar bassın (siyah değil) */
    .panel-head, .data-table thead th {
        -webkit-print-color-adjust: exact; print-color-adjust: exact;
    }

    /* Yazdırma başlığı (logo + belge türü) */
    .print-only { display: block !important; }
    .belge-print-baslik {
        display: flex !important;
        justify-content: space-between;
        align-items: center;
        border-bottom: 2px solid #2a2a2a;
        padding-bottom: 7px;
        margin-bottom: 10px;
    }
    .belge-print-sol { display: flex; align-items: center; gap: 14px; }
    .belge-print-logo { height: 44px; width: auto; }
    .belge-print-firma { font-weight: 700; font-size: 14px; color: #000; }
    .belge-print-firma span { font-weight: 400; font-size: 12px; color: #666; }
    .belge-print-tur { text-align: right; font-size: 26px; font-weight: 800; letter-spacing: 3px; color: #111; }
    .belge-print-no { font-size: 12px; font-weight: 600; letter-spacing: 0; color: #555; margin-top: 6px; }

    /* Kartlar/tablolar sade */
    .panel { border: 1px solid #ccc; box-shadow: none; margin-bottom: 8px; }
    .panel-head { padding: 6px 11px !important; }
    .panel-head { background: #f4f4f4 !important; }
    .panel-head h2 { color: #000 !important; font-size: 14px; }
    .data-table thead th { background: #f4f4f4 !important; color: #000 !important; border-bottom: 1px solid #bbb; }
    .data-table tbody td { border-bottom: 1px solid #e2e2e2; }
    .belge-ust { display: grid !important; grid-template-columns: 1fr 1fr; gap: 14px; }
    .badge { background: #eee !important; color: #333 !important; border: 1px solid #ccc; }
    .belge-toplam .genel { border-top: 2px solid #2a2a2a; }
    .belge-toplam .genel strong { color: #000 !important; }
    .muted { color: #555 !important; }
    a { color: #000 !important; text-decoration: none; }

    /* Baskıda gereksiz olanlar */
    .pagination, .col-actions, .stat-grid, .live-spinner, .page-actions { display: none !important; }

    /* ---------- Çıktı alt bilgisi: NOT + İMZA ---------- */
    .print-altbilgi { margin-top: 8px; page-break-inside: avoid; }

    .print-not { border: 1px solid #bbb; padding: 6px 9px; margin-bottom: 8px; }
    .print-not-baslik {
        font-size: 10px; font-weight: 700; letter-spacing: 1px;
        color: #555; margin-bottom: 6px;
    }
    .print-not-metin { font-size: 12px; margin-bottom: 6px; }
    /* Elle yazmak için çizgiler */
    .print-not-satir { border-bottom: 1px dotted #999; height: 13px; }

    .print-imzalar { display: flex; gap: 10px; }
    .print-imza { flex: 1; border: 1px solid #bbb; padding: 6px 9px 5px; min-height: 50px; }
    .print-imza-baslik {
        font-size: 10px; font-weight: 700; letter-spacing: 1px;
        color: #555; margin-bottom: 4px;
    }
    .print-imza-ad { font-size: 12px; font-weight: 600; min-height: 16px; }
    .print-imza-cizgi { border-bottom: 1px solid #666; margin: 12px 0 3px; }
    .print-imza-alt { font-size: 9px; color: #777; text-align: center; }

    .print-dipnot {
        margin-top: 8px; font-size: 9px; color: #888; text-align: right;
    }

    /* ---------- İŞ KÂĞIDI (üretim emri / kalite formu) ----------
       Elle doldurulacak kutular: yazı büyük, satır yüksek, kutular belirgin. */
    .is-kagidi .data-table { font-size: 13px; }
    .is-kagidi .data-table thead th { font-size: 11px; }
    .is-kagidi .data-table tbody td { padding: 10px 12px; }
    /* Elle doldurulacak boş hücre */
    .el-kutu {
        border: 1px solid #999 !important;
        background: #fff !important;
        min-width: 70px;
        height: 30px;
    }
    .is-kagidi-ust {
        display: flex; gap: 12px; margin-bottom: 14px; page-break-inside: avoid;
    }
    .is-kagidi-ust > div {
        flex: 1; border: 1px solid #bbb; padding: 8px 10px; font-size: 12px;
    }
    .is-kagidi-ust .baslik {
        font-size: 10px; font-weight: 700; letter-spacing: 1px; color: #555;
        display: block; margin-bottom: 3px;
    }
    .is-kagidi-ust .deger { font-size: 14px; font-weight: 700; }
}

/* ---------- Stok ---------- */
.stok-kritik { color: #c0392b; font-weight: 800; }
.durum-hareket-giris    { background: #e2f2e8; color: #1f6b3c; }
.durum-hareket-cikis    { background: #fae4e1; color: #99271b; }
.durum-hareket-duzeltme { background: #e3eefa; color: #1f5183; }

/* ---------- Baskı onay durumları ---------- */
.bdurum-bekliyor   { background: #e6eaef; color: #475569; }
.bdurum-onaylandi  { background: #e2f2e8; color: #1f6b3c; }
.bdurum-revizyon   { background: #fbeadd; color: #9a4a22; }
.bdurum-reddedildi { background: #fae4e1; color: #99271b; }

/* ---------- Üretim ekranı ----------
   Fabrika zemininde, çoğu zaman tablet/uzaktan bakılarak kullanılır:
   kartlar büyük, dokunma hedefleri geniş, bilgi az. */
.uretim-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 14px;
}
.uretim-kart {
    display: block;
    background: var(--panel);
    border: 1px solid var(--border);
    border-left: 4px solid var(--accent);
    border-radius: var(--radius);
    box-shadow: 0 1px 3px rgba(30,39,51,.06);
    padding: 16px 18px;
    color: inherit;
    transition: box-shadow .15s, transform .15s;
}
.uretim-kart:hover {
    text-decoration: none;
    box-shadow: 0 6px 18px rgba(30,39,51,.12);
    transform: translateY(-1px);
}
.uretim-kart.gecikti { border-left-color: var(--danger); }
.uretim-kart-ust {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 10px;
    flex-wrap: wrap;
}
.uretim-no { font-size: 17px; font-weight: 800; letter-spacing: .3px; }
.uretim-teslim { font-size: 12px; color: var(--muted); white-space: nowrap; }
.uretim-musteri { font-size: 15px; margin-top: 6px; }
.uretim-kalem { font-size: 13px; color: var(--muted); }
.uretim-ilerleme {
    margin-top: 12px;
    background: rgba(47,114,184,.12);
    border-radius: 20px;
    height: 8px;
    overflow: hidden;
}
.uretim-ilerleme > span { display: block; height: 100%; background: var(--accent); border-radius: 20px; }
.uretim-yuzde { font-size: 13px; margin-top: 6px; font-weight: 600; }

/* Üretim kartı içindeki miktar girişi — parmakla kullanılabilsin */
.uretim-tablo input[type="text"] { font-size: 17px; padding: 12px 13px; }
.uretim-giris { display: flex; gap: 6px; align-items: stretch; }
.uretim-giris input { flex: 1; }
.uretim-tumu { white-space: nowrap; }
.btn-buyuk { font-size: 17px; padding: 15px 28px; }

/* ---------- Şifre alanı (göster / üret / kopyala) ---------- */
.sifre-satir { display: flex; gap: 6px; align-items: stretch; }
.sifre-satir input { flex: 1; }
.sifre-satir .btn-mini { white-space: nowrap; }

/* Şifre alanı butonları: ikon + yazı, dokunması kolay pill */
.btn-sifre {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
    padding: 0 12px;
    font-size: 13px;
    font-weight: 600;
    border-radius: 8px;
    border: 1px solid var(--border);
    background: var(--panel-2);
    color: var(--text);
    cursor: pointer;
    transition: background .15s, border-color .15s, color .15s;
}
.btn-sifre svg { display: block; opacity: .85; }
.btn-sifre:hover { background: #e3ecf6; border-color: #b9cbe0; }
/* "Üret" vurgulu (asıl eylem) */
.btn-sifre-uret { background: var(--accent); border-color: var(--accent); color: #fff; }
.btn-sifre-uret svg { opacity: 1; }
.btn-sifre-uret:hover { background: var(--accent-2); border-color: var(--accent-2); color: #fff; }
.sifre-not {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 8px;
    padding: 9px 12px;
    background: #fdf6e7;
    border: 1px solid #e8d3a0;
    border-radius: 8px;
    font-size: 13px;
    color: #7a5a1e;
}
.sifre-not strong#sifreMetin {
    font-family: "Consolas", "SF Mono", "DejaVu Sans Mono", monospace;
    font-size: 15px;
    letter-spacing: .5px;
}

/* ---------- Proforma teklif formu ---------- */
.doviz-hesap {
    margin-top: 14px;
    padding: 12px 14px;
    background: #eef5fb;
    border: 1px solid #cfe0f0;
    border-radius: 8px;
}
.doviz-hesap-baslik { font-size: 13px; font-weight: 700; color: var(--accent-2); margin-bottom: 8px; }
.doviz-hesap-baslik .muted { font-weight: 400; }
.doviz-hesap-alan { display: flex; gap: 14px; flex-wrap: wrap; align-items: flex-end; }

.proforma-kalem input[type="text"] { padding: 7px 8px; font-size: 13px; }
.proforma-kalem .p-tutar { font-weight: 700; }
/* Döviz kolonu JS ile gizlenir; readonly alanlar soluk */
.proforma-kalem input[readonly] { background: #f1f5f9; color: #475569; }
/* Laptop/dar ekran: sütunlar sıkışıp okunmaz olmasın (özellikle BASKI).
   Tablo min genişliği geniş monitörde etkisiz (tablo zaten daha geniş);
   dar ekranda .table-wrap içinde yatay kaydırır, sütunlar kullanılabilir kalır. */
/* Tablo ekrana sığsın: dar ekranda yine kaydırır ama normal laptopta kaymaz */
.proforma-kalem { min-width: 1080px; }
.proforma-kalem th, .proforma-kalem td { padding-left: 7px; padding-right: 7px; }
.proforma-kalem .p-baski { min-width: 80px; }
/* Kaynak: "Üretimden" yazısı ok simgesiyle birlikte KESİLMEDEN sığsın */
.proforma-kalem .p-kaynak { min-width: 112px; width: 100%; font-size: 13px; padding-left: 7px; padding-right: 20px; }
/* Koli içi / koli adedi / toplam: 6-7 haneli sayılar rahat sığsın */
.proforma-kalem .p-koliici, .proforma-kalem .p-koliad,
.proforma-kalem .p-miktar, .proforma-kalem .p-fiyat, .proforma-kalem .p-doviz {
    min-width: 78px; text-align: right; font-variant-numeric: tabular-nums;
}
.proforma-kalem .p-koliad, .proforma-kalem .p-fiyat { min-width: 72px; }
/* Stok bilgisi (seçili ürün) — sığmazsa alt satıra sarar */
.proforma-kalem .p-stok { font-size: 12.5px; min-width: 100px; max-width: 140px; text-align: left; }
.proforma-kalem .stok-var { color: #2f9e5a; font-weight: 600; }
.proforma-kalem .stok-yok { color: #c0392b; font-size: 12px; }
.proforma-kalem .stok-serbest { font-size: 12px; color: #2f7bff; }
.proforma-kalem .stok-serbest.sifir { color: #c0392b; font-weight: 600; }
.proforma-kalem .stok-uyari {
    margin-top: 4px; padding: 4px 6px; border-radius: 6px;
    background: #fff4e5; color: #9a5b00; font-size: 11px; line-height: 1.35;
}
.proforma-kalem .stok-uyari a { color: inherit; font-weight: 700; text-decoration: underline; }
.proforma-kalem .stok-asim-not { margin-top: 4px; font-size: 11px; font-weight: 700; color: #c0392b; }
.proforma-kalem tr.stok-asim > td { background: #fdecea; }
.proforma-kalem .p-aciklama,
.proforma-kalem .p-urun { min-width: 210px; }
/* Ürün kutusunda yalnızca ad yazar (kod açılır listede) — uzun adlar için geniş alan */
.proforma-kalem .us-secici, .proforma-kalem .us-arama { width: 100%; }
.proforma-kalem .p-birim { min-width: 50px; }
.proforma-kalem .p-gtip { min-width: 120px; }
/* İçindeki tüm metin kutuları hücreyi doldursun (kutu içinde de sıkışmasın) */
.proforma-kalem input[type="text"] { width: 100%; box-sizing: border-box; }
/* Teklif ayarları: seçenek listesi */
.secenek-liste { display: flex; flex-direction: column; gap: 4px; }
.secenek-satir { display: flex; justify-content: space-between; align-items: center;
    padding: 6px 10px; background: var(--panel-2); border-radius: 6px; font-size: 14px; }
.secenek-satir form { display: inline; }

/* Cari kod — rakam ağırlıklı olduğu için eşit genişlikli yazı tipiyle daha okunur */
.cari-kod {
    font-family: "Consolas", "SF Mono", "DejaVu Sans Mono", monospace;
    font-size: 13px;
    letter-spacing: .3px;
    white-space: nowrap;
}

/* ---------- Dağılım çubuğu (geri bildirim kategorileri) ---------- */
.dagilim-satir {
    display: grid;
    grid-template-columns: 170px 1fr 40px;
    align-items: center;
    gap: 12px;
    padding: 5px 0;
    font-size: 14px;
}
.dagilim-cubuk {
    background: rgba(47,114,184,.10);
    border-radius: 20px;
    height: 10px;
    overflow: hidden;
}
.dagilim-cubuk > span {
    display: block;
    height: 100%;
    background: var(--accent);
    border-radius: 20px;
}
.dagilim-adet { text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; }
@media (max-width: 640px) {
    .dagilim-satir { grid-template-columns: 120px 1fr 34px; font-size: 13px; }
}

/* Kalite ölçüm satırında otomatik hesaplanan sonuç rozeti */
.kk-oto { display: inline-block; margin-left: 6px; }

/* ---------- Modal (ortalanmış pencere) ---------- */
.modal-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(30, 39, 51, .45);
    z-index: 100;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
}
.modal-backdrop[hidden] { display: none; }
.modal {
    background: var(--panel);
    border: 1px solid var(--border);
    border-radius: 14px;
    padding: 20px 22px;
    width: 380px;
    max-width: 100%;
    box-shadow: 0 20px 60px rgba(30,39,51,.22);
    text-align: left;
}
.modal h3 { margin: 0 0 14px; font-size: 17px; }
.modal label:first-of-type { margin-top: 0; }

/* ---------- Yetki (modül) ızgarası ---------- */
.yetki-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
    gap: 10px;
}
.yetki-item {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 13px;
    border: 1px solid var(--border);
    border-radius: 8px;
    cursor: pointer;
    margin: 0;
    font-size: 14px;
    font-weight: 500;
    letter-spacing: 0;
    text-transform: none;
    color: var(--text);
}
.yetki-item:hover { background: rgba(47,114,184,.07); }
.yetki-item input { width: 18px; height: 18px; accent-color: var(--accent); }

/* ---------- Mobil (telefon) — APK hissi: kayma yok, her şey tam ekran ---------- */
@media (max-width: 640px) {
    .content { padding: 12px; }

    /* Form + belge blokları tek kolon */
    .form-grid { grid-template-columns: 1fr; }
    .belge-ust { grid-template-columns: 1fr; }

    /* Başlık: başlık üstte, aksiyonlar altta tam genişlik */
    .page-head { flex-direction: column; align-items: stretch; gap: 10px; margin-bottom: 14px; }
    .page-h1 { font-size: 19px; }
    .page-actions { width: 100%; }
    .page-actions .btn { flex: 1 1 auto; justify-content: center; text-align: center; }

    /* Araç çubuğu (arama/filtre) dikey ve tam genişlik */
    .toolbar { flex-direction: column; align-items: stretch; }
    .toolbar > * { width: 100%; }
    .toolbar .btn { justify-content: center; }
    .toolbar-genis input[type="text"] { min-width: 0; width: 100%; }
    .toolbar-alan { width: 100%; }
    .toolbar-alan input[type="date"], .toolbar-alan select { width: 100%; }

    /* Sekmeler tek satırda parmakla kaydırılır (satır satır bölünmez) */
    .filter-tabs { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 4px; }
    .filter-tabs .ftab { white-space: nowrap; flex: 0 0 auto; }

    /* Tüm giriş alanları kutudan taşmasın */
    input, select, textarea { max-width: 100%; }

    /* Belge toplamı ve KPI kartları tam genişlik/derli toplu */
    .belge-toplam { width: 100%; }
    .stat-grid { gap: 12px; margin-bottom: 16px; }

    /* Panel iç boşlukları biraz daralsın (daha çok ekran) */
    .panel-body { padding: 14px; }
    .panel-head { padding: 12px 14px; }
}
.overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(30,39,51,.4);
    z-index: 25;
}
@media (max-width: 820px) {
    .hamburger { display: block; }
    .sidebar {
        position: fixed;
        left: 0; top: 0;
        transform: translateX(-100%);
        transition: transform .25s ease;
        z-index: 30;
    }
    body.sidebar-open .sidebar { transform: translateX(0); }
    body.sidebar-open .overlay { display: block; }
    .user-box { display: none; }
}

/* ============================================================
   KULLANICI SOHBETİ — sağ alttaki balon
   ============================================================ */
.sohbet{ position:fixed; right:20px; bottom:20px; z-index:1000; font-size:14px; }
/* display:flex/inline-flex kuralları [hidden]'ı ezmesin — panel kapalı başlasın,
   liste ile konuşma aynı anda görünmesin, rozet 0'da gizli kalsın */
.sohbet [hidden]{ display:none !important; }

/* Açma butonu */
.sohbet-launcher{
    display:inline-flex; align-items:center; gap:8px;
    padding:11px 18px; border:none; border-radius:999px; cursor:pointer;
    background:var(--accent); color:#fff; font-weight:700; font-size:14px;
    box-shadow:0 6px 20px rgba(30,39,51,.22);
}
.sohbet-launcher:hover{ background:var(--accent-2); }
.sohbet-launcher svg{ display:block; }
.sohbet-launcher.acik{ background:var(--accent-2); }
.sohbet-rozet{
    min-width:20px; height:20px; padding:0 6px; border-radius:999px;
    background:#e5484d; color:#fff; font-size:12px; font-weight:800;
    display:inline-flex; align-items:center; justify-content:center; margin-left:2px;
}

/* Ekran içi toast: yeni mesaj gelince sağ altta belirir, aşağıdan yukarı kayar,
   4 sn sonra kaybolur. Açma butonunun üstünde durur; panel açıksa soluna kayar. */
.sohbet-toast-kap{
    position:fixed; right:20px; bottom:80px; z-index:1100;
    display:flex; flex-direction:column-reverse; gap:10px; align-items:flex-end;
    pointer-events:none;
}
.sohbet-toast-kap.panel-acik{ right:372px; bottom:20px; }
.sohbet-toast{
    pointer-events:auto; cursor:pointer; width:300px; max-width:calc(100vw - 40px);
    background:var(--panel); color:var(--text);
    border:1px solid var(--border); border-left:4px solid var(--accent);
    border-radius:12px; padding:11px 14px; box-shadow:0 12px 34px rgba(30,39,51,.28);
    transform:translateY(24px); opacity:0;
    transition:transform .3s cubic-bezier(.22,.61,.36,1), opacity .3s ease;
}
.sohbet-toast.gir{ transform:translateY(0); opacity:1; }
.sohbet-toast.cik{ transform:translateY(24px); opacity:0; }
.sohbet-toast-ust{ display:flex; align-items:center; gap:7px; margin-bottom:3px; }
.sohbet-toast-ikon{ font-size:15px; line-height:1; }
.sohbet-toast-ad{ font-weight:800; font-size:13px; color:var(--accent-2);
    white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sohbet-toast-metin{ font-size:13px; color:var(--text); line-height:1.35;
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
@media (max-width:600px){
    .sohbet-toast-kap.panel-acik{ right:12px; bottom:auto; top:12px; }
}
@media (prefers-reduced-motion:reduce){
    .sohbet-toast{ transition:opacity .2s ease; transform:none; }
    .sohbet-toast.gir{ transform:none; }
    .sohbet-toast.cik{ transform:none; }
}

/* Panel */
.sohbet-panel{
    position:absolute; right:0; bottom:56px; width:340px; height:460px; max-height:72vh;
    background:var(--panel); border:1px solid var(--border); border-radius:14px;
    box-shadow:0 12px 40px rgba(30,39,51,.24); overflow:hidden;
    display:flex; flex-direction:column;
}
.sohbet-ekran{ display:flex; flex-direction:column; height:100%; min-height:0; }

.sohbet-baslik{
    display:flex; align-items:center; gap:8px; padding:12px 14px;
    background:var(--panel-2); border-bottom:1px solid var(--border); font-weight:800;
    color:var(--text); flex:0 0 auto;
}
.sohbet-baslik svg{ vertical-align:-3px; }
.sohbet-kapat{ margin-left:auto; background:none; border:none; font-size:22px; line-height:1;
    color:var(--muted); cursor:pointer; padding:0 4px; }
.sohbet-kapat:hover{ color:var(--text); }
.sohbet-geri{ background:none; border:none; font-size:24px; line-height:1; color:var(--accent-2);
    cursor:pointer; padding:0 6px 0 0; font-weight:800; }

/* Kişi listesi */
.sohbet-kisiler{ overflow-y:auto; flex:1 1 auto; }
.sohbet-bos{ color:var(--muted); text-align:center; padding:26px 16px; font-size:13.5px; }
.sohbet-kisi-satir{
    display:flex; align-items:center; gap:11px; width:100%; text-align:left;
    padding:10px 14px; background:none; border:none; border-bottom:1px solid var(--panel-2);
    cursor:pointer; color:var(--text);
}
.sohbet-kisi-satir:hover{ background:var(--panel-2); }
.sohbet-avatar{
    position:relative; flex:0 0 auto; width:38px; height:38px; border-radius:50%;
    background:var(--accent-wash,#e5eef8); color:var(--accent-2);
    display:grid; place-items:center; font-weight:800; font-size:16px;
}
.sohbet-nokta{
    position:absolute; right:-1px; bottom:-1px; width:11px; height:11px; border-radius:50%;
    background:#b7c2cf; border:2px solid var(--panel);
}
.sohbet-nokta.online{ background:#33b969; }
.sohbet-kisi-bilgi{ display:flex; flex-direction:column; min-width:0; flex:1; }
.sohbet-kisi-isim{ font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sohbet-kisi-alt{ font-size:12px; color:var(--muted); }
.sohbet-kisi-rozet{
    margin-left:auto; min-width:20px; height:20px; padding:0 6px; border-radius:999px;
    background:#e5484d; color:#fff; font-size:12px; font-weight:800;
    display:inline-flex; align-items:center; justify-content:center;
}

/* Konuşma başlığı */
.sohbet-kisi{ display:flex; flex-direction:column; min-width:0; }
.sohbet-kisi-ad{ font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.sohbet-kisi-durum{ font-size:12px; font-weight:600; color:var(--muted); }
.sohbet-kisi-durum.online{ color:#2e9e5b; }

/* Mesajlar */
.sohbet-mesajlar{
    flex:1 1 auto; overflow-y:auto; padding:14px; display:flex; flex-direction:column; gap:8px;
    background:var(--bg-2,#f4f7fb);
}
.sohbet-balon{
    max-width:78%; padding:8px 12px; border-radius:14px; position:relative;
    display:flex; flex-direction:column; gap:2px; word-break:break-word;
}
.sohbet-balon-metin{ font-size:14px; line-height:1.45; white-space:pre-wrap; }
.sohbet-balon-alt{ display:flex; align-items:center; gap:4px; align-self:flex-end; }
/* Belgeye bağlı mesaj — tıklanabilir çip */
.sohbet-balon-belge{ display:inline-flex; align-items:center; gap:4px; margin-top:6px;
    font-size:12px; font-weight:600; text-decoration:none; padding:3px 8px; border-radius:6px;
    background:rgba(47,114,184,.12); color:var(--accent); align-self:flex-start; }
.sohbet-balon.benden .sohbet-balon-belge{ background:rgba(255,255,255,.22); color:#fff; }
.sohbet-balon-belge:hover{ text-decoration:underline; }
/* Yazarken üstte "şu belge hakkında" çubuğu */
.sohbet-baglam-cip{ display:flex; align-items:center; justify-content:space-between; gap:8px;
    margin:0 10px; padding:6px 10px; font-size:12.5px; font-weight:600;
    background:rgba(47,114,184,.12); color:var(--accent); border-radius:8px; }
.sohbet-baglam-x{ border:0; background:transparent; color:inherit; font-size:18px;
    line-height:1; cursor:pointer; padding:0 2px; }
/* Kanallar */
.sohbet-grup-baslik{ font-size:11px; font-weight:700; letter-spacing:.4px; text-transform:uppercase;
    color:#8a93a0; padding:9px 12px 3px; }
.sohbet-kanal-satir{ display:flex; align-items:center; gap:10px; width:100%; text-align:left;
    border:0; background:transparent; padding:8px 12px; cursor:pointer; font:inherit; color:inherit; }
.sohbet-kanal-satir:hover{ background:var(--panel-2,#eef3f9); }
.sohbet-kanal-ikon{ width:34px; height:34px; border-radius:9px; flex:none; display:flex;
    align-items:center; justify-content:center; background:rgba(47,114,184,.14);
    color:var(--accent,#2f7bff); font-weight:800; font-size:17px; }
.sohbet-balon-ad{ font-size:11px; font-weight:700; color:var(--accent,#2f7bff); margin-bottom:2px; }
/* Araç butonları (emoji, ek) */
.sohbet-arac{ border:0; background:transparent; font-size:19px; line-height:1; cursor:pointer;
    padding:4px 5px; border-radius:8px; flex:none; }
.sohbet-arac:hover{ background:var(--panel-2,#eef3f9); }
.sohbet-arac:disabled{ opacity:.5; cursor:default; }
/* Emoji paneli */
.sohbet-emoji-panel{ display:flex; flex-wrap:wrap; gap:2px; padding:8px 10px; max-height:150px; overflow-y:auto;
    border-top:1px solid var(--border,#e2e8f0); background:var(--panel-2,#f6f8fb); }
.sohbet-emoji{ border:0; background:transparent; font-size:20px; line-height:1; cursor:pointer;
    padding:3px 4px; border-radius:6px; }
.sohbet-emoji:hover{ background:rgba(47,114,184,.14); }
/* Ek önizleme (yazmadan önce) */
.sohbet-ek-onizleme{ display:flex; align-items:center; justify-content:space-between; gap:8px;
    margin:0 10px; padding:6px 10px; font-size:12.5px; font-weight:600;
    background:rgba(47,158,90,.14); color:#2f9e5a; border-radius:8px; }
/* Balondaki ek */
.sohbet-ek-gorsel{ display:block; margin-top:6px; }
.sohbet-ek-gorsel img{ max-width:200px; max-height:220px; border-radius:10px; display:block; }
.sohbet-ek-dosya{ display:inline-flex; align-items:center; gap:5px; margin-top:6px; font-size:13px;
    font-weight:600; text-decoration:none; padding:6px 10px; border-radius:8px;
    background:rgba(47,114,184,.12); color:var(--accent,#2f7bff); }
.sohbet-balon.benden .sohbet-ek-dosya{ background:rgba(255,255,255,.22); color:#fff; }
.sohbet-balon-saat{ font-size:10.5px; opacity:.7; }
/* Gönderilen mesaj: tek tik = gönderildi (soluk), çift tik = okundu (belirgin) */
.sohbet-tik{ font-size:12px; line-height:1; letter-spacing:-3px; padding-right:2px; }
.sohbet-balon.benden .sohbet-tik{ color:rgba(255,255,255,.6); }
.sohbet-balon.benden .sohbet-tik.okundu{ color:#7ef0b0; }
.sohbet-balon.gelen{ align-self:flex-start; background:var(--panel); border:1px solid var(--border);
    color:var(--text); border-bottom-left-radius:4px; }
.sohbet-balon.benden{ align-self:flex-end; background:var(--accent); color:#fff;
    border-bottom-right-radius:4px; }
.sohbet-balon.benden .sohbet-balon-saat{ color:#eaf1fb; }

/* Yazma alanı */
.sohbet-yaz{ display:flex; gap:8px; padding:10px; border-top:1px solid var(--border);
    background:var(--panel); flex:0 0 auto; }
.sohbet-yaz input{
    flex:1; padding:9px 12px; border:1px solid var(--border); border-radius:999px;
    background:var(--input-bg); color:var(--input-text); font-size:14px;
}
.sohbet-yaz input:focus{ outline:none; border-color:var(--accent); }
.sohbet-gonder{
    flex:0 0 auto; width:40px; height:40px; border:none; border-radius:50%;
    background:var(--accent); color:#fff; cursor:pointer; display:grid; place-items:center;
}
.sohbet-gonder:hover{ background:var(--accent-2); }

@media (max-width:480px){
    .sohbet{ right:12px; bottom:12px; }
    .sohbet-panel{ width:calc(100vw - 24px); height:70vh; }
    .sohbet-launcher-yazi{ display:none; }
}
@media print{ .sohbet{ display:none; } }

/* Çift gönderim koruması: gönderilirken buton soluk + tıklanamaz */
.btn-gonderiliyor{ opacity:.65; pointer-events:none; cursor:default; }

/* Yeni teklif tür seçimi (Yurtiçi / İhracat) */
.tur-sec{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:18px; max-width:720px; margin-top:8px; }
.tur-kart{
    display:flex; flex-direction:column; gap:8px; text-align:center; align-items:center;
    background:var(--panel); border:1px solid var(--border); border-radius:14px; padding:28px 22px;
    box-shadow:0 1px 3px rgba(30,39,51,.06); color:var(--text); transition:border-color .15s, box-shadow .15s, transform .1s;
}
.tur-kart:hover{ border-color:var(--accent); box-shadow:0 8px 24px rgba(47,114,184,.14); text-decoration:none; transform:translateY(-2px); }
.tur-kart .tur-ikon{ color:var(--accent); }
.tur-kart.ihracat .tur-ikon{ color:#b9791b; }
.tur-kart .tur-ad{ font-size:19px; font-weight:800; }
.tur-kart .tur-aciklama{ font-size:13px; color:var(--muted); line-height:1.5; }
.sum-pb{ font-size:13px; color:var(--muted); font-weight:600; }

/* ============================================================
   BİLDİRİM ÇANI (üst bar)
   ============================================================ */
.bildirim{ position:relative; }
.bildirim-btn{
    position:relative; background:none; border:none; cursor:pointer; color:var(--muted);
    padding:6px; border-radius:8px; display:flex; align-items:center;
}
.bildirim-btn:hover{ background:var(--panel-2); color:var(--text); }
.bildirim-rozet{
    position:absolute; top:0; right:0; min-width:17px; height:17px; padding:0 4px;
    background:#e5484d; color:#fff; font-size:10.5px; font-weight:800; border-radius:999px;
    display:inline-flex; align-items:center; justify-content:center; border:2px solid var(--topbar);
}
/* Bekleyen iş rozeti — menü satırı, alt işlem, sekme (IsSayaci / data-rozet) */
.is-rozet{
    flex:0 0 auto; margin-left:auto; min-width:20px; height:20px; padding:0 6px;
    background:#e5484d; color:#fff; font-size:11px; font-weight:800; line-height:20px;
    border-radius:999px; text-align:center; box-shadow:0 1px 4px rgba(229,72,77,.35);
    animation:isRozetNabiz 2.4s ease-in-out infinite;
}
.is-rozet[hidden]{ display:none !important; }
@keyframes isRozetNabiz{
    0%, 100%{ box-shadow:0 0 0 0 rgba(229,72,77,.45); }
    50%{ box-shadow:0 0 0 5px rgba(229,72,77,0); }
}
.menu-item .is-rozet + .menu-ok{ margin-left:6px; }
@media (prefers-reduced-motion: reduce){ .is-rozet{ animation:none; } }
.bildirim-panel{
    position:absolute; right:0; top:44px; width:320px; max-width:88vw;
    background:var(--panel); border:1px solid var(--border); border-radius:12px;
    box-shadow:0 12px 40px rgba(30,39,51,.22); overflow:hidden; z-index:50;
}
.bildirim-baslik{
    padding:11px 14px; font-weight:800; border-bottom:1px solid var(--border); background:var(--panel-2);
}
.bildirim-liste{ max-height:60vh; overflow-y:auto; }
.bildirim-bos{ padding:24px 16px; text-align:center; color:var(--muted); font-size:13.5px; }
.bildirim-satir{
    display:flex; align-items:center; gap:10px; padding:11px 14px; color:var(--text);
    border-bottom:1px solid var(--panel-2);
}
.bildirim-satir:hover{ background:var(--panel-2); text-decoration:none; }
.bildirim-ad{ flex:1; font-size:14px; }
.bildirim-sayi{
    min-width:22px; height:22px; padding:0 7px; border-radius:999px; background:var(--accent); color:#fff;
    font-size:12.5px; font-weight:800; display:inline-flex; align-items:center; justify-content:center;
}

/* Kişisel bildirim satırı (olay bildirimi) */
.bildirim-satir.kisisel{ align-items:flex-start; gap:9px; }
.bildirim-nokta{ flex:0 0 auto; width:8px; height:8px; border-radius:50%; background:var(--accent); margin-top:6px; }
.bildirim-ic{ display:flex; flex-direction:column; gap:2px; flex:1; min-width:0; }
.bildirim-ic .bildirim-ad{ font-size:13.5px; line-height:1.4; }
.bildirim-saat{ font-size:11px; color:var(--muted); }
.bildirim-ayrac{ padding:7px 14px 4px; font-size:11px; font-weight:800; text-transform:uppercase;
    letter-spacing:.05em; color:var(--muted); background:var(--panel-2); }

.sohbet-kisi-alt.online{ color:#2e9e5b; }

/* PWA "Uygulamayı Yükle" — giriş sayfasında yüzen buton */
.pwa-yukle-float{
    position:fixed; left:50%; bottom:22px; transform:translateX(-50%);
    display:inline-flex; align-items:center; gap:8px;
    padding:11px 20px; border:none; border-radius:999px; cursor:pointer;
    background:var(--accent); color:#fff; font-weight:700; font-size:14px; font-family:inherit;
    box-shadow:0 6px 20px rgba(30,39,51,.22); z-index:1000;
}
.pwa-yukle-float:hover{ background:var(--accent-2); }
.topbar-right .pwa-yukle{ white-space:nowrap; }

/* Müşteri ziyaret notları */
.ziyaret-liste{ display:flex; flex-direction:column; gap:10px; }
.ziyaret-satir{ border:1px solid var(--border); border-left:3px solid var(--accent); border-radius:8px; padding:10px 12px; background:var(--panel-2); }
.ziyaret-ust{ display:flex; align-items:center; gap:10px; font-size:12.5px; margin-bottom:4px; }
.ziyaret-tarih{ font-weight:700; color:var(--accent-2); }
.ziyaret-not{ font-size:14px; line-height:1.5; color:var(--text); white-space:pre-wrap; }

/* Görevler */
.gorev-liste{ display:flex; flex-direction:column; gap:10px; }
.gorev-kart{ display:flex; gap:14px; align-items:flex-start; background:var(--panel); border:1px solid var(--border);
    border-left:4px solid var(--accent); border-radius:10px; padding:14px 16px; box-shadow:0 1px 3px rgba(30,39,51,.05); }
.gorev-kart.gecikti{ border-left-color:#e5484d; }
.gorev-kart.tamam{ border-left-color:#33b969; opacity:.72; }
.gorev-kart.tamam .gorev-baslik{ text-decoration:line-through; }
.gorev-govde{ flex:1; min-width:0; }
.gorev-baslik{ font-weight:700; font-size:15px; }
.gorev-aciklama{ font-size:13.5px; color:var(--ink-soft,var(--muted)); margin-top:3px; }
.gorev-meta{ display:flex; flex-wrap:wrap; gap:6px 14px; font-size:12.5px; color:var(--muted); margin-top:8px; }
.gorev-aksiyon{ display:flex; gap:6px; flex:0 0 auto; }
.gorev-aksiyon form{ display:inline; }

/* ---------- Menü sıralama (sürükle-bırak, kişiye özel) ---------- */
.menu-duzen-bar{ padding:6px 12px 8px; display:flex; gap:6px; align-items:center; }
.menu-duzen-btn{
    display:inline-flex; align-items:center; gap:6px; font:inherit; font-size:12px; font-weight:600;
    background:none; border:1px dashed var(--border); border-radius:8px; padding:5px 10px; color:var(--muted);
    cursor:pointer; width:100%; justify-content:center;
}
.menu-duzen-btn:hover{ color:var(--accent-2); border-color:var(--accent); }
.menu.duzen-modu .menu-duzen-btn{ background:var(--accent); color:#fff; border-style:solid; border-color:var(--accent); }
.menu-duzen-sifirla{
    font:inherit; font-size:12px; background:none; border:1px solid var(--border); border-radius:8px;
    padding:5px 8px; color:var(--muted); cursor:pointer;
}
.menu-duzen-sifirla:hover{ color:#c0392b; border-color:#e7bdb7; }

/* Sürükleme tutamağı — sadece düzenleme modunda görünür */
.menu-tut{ display:none; width:16px; flex:0 0 16px; color:#9aa9ba; }
.menu.duzen-modu .menu-tut{ display:flex; align-items:center; }
.menu.duzen-modu .menu-blok{ cursor:grab; }
.menu.duzen-modu .menu-blok .menu-item{ pointer-events:none; }         /* linkler tıklanmasın */
.menu.duzen-modu .menu-blok{ border:1px dashed transparent; border-radius:8px; margin:1px 6px; }
.menu.duzen-modu .menu-blok:hover{ border-color:var(--accent); background:rgba(47,114,184,.05); }
.menu-blok.suruklenen{ opacity:.55; border-color:var(--accent) !important; background:rgba(47,114,184,.12) !important; }
/* Düzenleme modunda grupların içi kapanık dursun (karışmasın) */
.menu.duzen-modu .menu-group-body{ grid-template-rows:0fr !important; }

/* ==========================================================================
   ARANABİLİR + GRUPLU SEÇİM KUTUSU (ara-select) — teklif/sipariş ürün seçimi
   ========================================================================== */
.ara-select { position: relative; }
.us-secici .us-arama { width: 100%; }
/* fixed → taşan tabloyu itmez, üstünde serbest durur (konum JS ile) */
.ara-liste { position: fixed; z-index: 3000;
    max-height: 320px; overflow-y: auto; background: var(--panel, #fff);
    border: 1px solid var(--border, #d5dbe2); border-radius: 8px;
    box-shadow: 0 10px 28px rgba(0,0,0,.14); }
.us-secici .ara-liste { min-width: 240px; }
.ara-grup { position: sticky; top: 0; font-size: 11px; font-weight: 700; letter-spacing: .4px;
    text-transform: uppercase; color: #7a8494; background: var(--panel-2, #edf3f9);
    padding: 6px 12px 5px; border-top: 1px solid var(--border, #e3e9f0); }
.ara-grup:first-child { border-top: 0; }
.ara-oge { padding: 8px 12px; cursor: pointer; font-size: 14px; }
.ara-oge:hover, .ara-oge.vurgu { background: #eef4fb; }
.ara-oge.us-temizle { color: #c0392b; font-weight: 600;
    background: #fdecea; border-bottom: 1px solid #f3c6c0; }
.ara-oge.us-temizle:hover, .ara-oge.us-temizle.vurgu { background: #f9d9d4; }
.ara-oge.secili { font-weight: 600; }
.ara-oge.gizli, .ara-grup.gizli { display: none; }
.ara-bos { padding: 12px; color: #8a93a0; font-size: 13px; }