/* ============================================================
   ATMOSCAFE — ortak (cf-*), Ayarlar (cs-*), Menü (cm-*), Masalar (ct-*), adisyon paneli (co-*), Adisyonlar (ol-*), Kasa (cc-*)
   Views/Modules/Cafe/*.cshtml, js/pages/cafe-*.js
   ============================================================ */

/* ---- Ortak ---- */
.cafe-page { display: flex; flex-direction: column; gap: 14px; }
.cafe-page .btn-sm, .co-overlay .btn-sm, .modal-overlay[data-cafe] .btn-sm { width: auto; }   /* genel .btn-sm { width:100% } kuralını ez (modallar body'de) */
.cf-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.cf-head > div:first-child { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; min-width: 0; }
.cf-acts { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.cf-sub { font-size: 12.5px; color: var(--text-muted); }
.cf-hint { font-size: 12.5px; color: var(--text-muted); line-height: 1.5; }
.cf-chip { display: inline-flex; align-items: center; gap: 4px; padding: 2px 9px; border-radius: 999px; background: var(--accent-soft); color: var(--accent-bright); font-size: 11.5px; font-weight: 700; }
.cf-chip.off { background: rgba(148, 163, 184, .18); color: var(--text-muted); }
.cf-chips { display: flex; flex-wrap: wrap; gap: 5px; }
.cf-empty { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 36px 16px; border: 1px dashed var(--border-strong); border-radius: 16px; text-align: center; color: var(--text-muted); }
.cf-empty[hidden] { display: none; }
.cf-empty > svg { width: 32px; height: 32px; color: var(--accent); }
.cf-empty p { margin: 0; max-width: 480px; line-height: 1.55; }
.cf-tabs { display: flex; gap: 4px; padding: 4px; border-radius: 12px; background: var(--bg-elevated); border: 1px solid var(--border); overflow-x: auto; scrollbar-width: none; }
.cf-tabs::-webkit-scrollbar { display: none; }
.cf-tabs.dragging, .cf-tabs.dragging button { cursor: grabbing; user-select: none; }   /* fareyle sürükleme: js/module-tabs.js */
.cf-tab { flex-shrink: 0; display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; border: 0; border-radius: 9px; background: none; color: var(--text-secondary); font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; }
.cf-tab svg { width: 15px; height: 15px; }
.cf-tab.on { background: var(--bg-surface); color: var(--text-primary); box-shadow: 0 1px 3px rgba(15, 27, 45, .12); }
.cf-tab.on svg { color: var(--accent); }
.cf-count { font-size: 11px; font-weight: 700; color: var(--text-muted); }
.cf-checks { display: flex; flex-wrap: wrap; gap: 6px 14px; }
.cf-checks .wf-check { margin: 0; }
.cf-table { border: 1px solid var(--border); border-radius: 14px; overflow: hidden; background: var(--bg-surface); }
.cf-tr { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr 44px; gap: 10px; align-items: center; padding: 9px 14px; border-bottom: 1px solid var(--border); font-size: 13px; }
.cf-tr:last-child { border-bottom: 0; }
.cf-th { background: var(--bg-elevated); font-size: 12px; font-weight: 700; color: var(--text-secondary); }
.cf-tr.warn { background: rgba(245, 158, 11, .08); }
.cf-tr.off, .cs-branch.off, .cs-area.off, .cm-cat.off, .cm-product.off, .cm-group.off, .cs-table.off { opacity: .55; }
.danger-text { color: #e5484d; margin-right: auto; }

/* ---- Ayarlar ---- */
.cs-grid { display: grid; grid-template-columns: 260px 1fr; gap: 14px; align-items: start; }
.cs-branches, .cs-detail, .cm-cats, .cm-products { display: flex; flex-direction: column; gap: 10px; padding: 14px; border: 1px solid var(--border); border-radius: 16px; background: var(--bg-surface); min-width: 0; }
.cs-branch-list { display: flex; flex-direction: column; gap: 6px; }
.cs-branch { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-elevated); color: var(--text-primary); font: inherit; text-align: left; cursor: pointer; }
.cs-branch span { font-size: 12px; color: var(--text-muted); }
.cs-branch.on { border-color: var(--accent); background: var(--accent-soft); }
.cs-bname { font-family: var(--font-display); font-size: 17px; }
.cs-area { border: 1px solid var(--border); border-radius: 14px; padding: 12px; display: flex; flex-direction: column; gap: 10px; }
.cs-area-h { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cs-area-h .cf-acts { margin-left: auto; }
.cs-tables { display: flex; flex-wrap: wrap; gap: 8px; }
.cs-table { width: 78px; height: 62px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; border: 1px solid var(--border-strong); border-radius: 12px; background: var(--bg-elevated); color: var(--text-primary); font: inherit; cursor: pointer; }
.cs-table.round { border-radius: 999px; width: 66px; }
.cs-table.long { width: 120px; }
.cs-table span { display: inline-flex; align-items: center; gap: 3px; font-size: 11.5px; color: var(--text-muted); }
.cs-table svg { width: 12px; height: 12px; }
.cs-table:hover, .cs-branch:hover, .cm-cat:hover { border-color: var(--accent); }

/* ---- Menü ---- */
.cm-grid { display: grid; grid-template-columns: 250px 1fr; gap: 14px; align-items: start; }
.cm-cat-list { display: flex; flex-direction: column; gap: 4px; }
.cm-cat { display: flex; align-items: center; gap: 8px; padding: 9px 11px; border: 1px solid transparent; border-radius: 10px; background: none; color: var(--text-primary); font: inherit; font-size: 13.5px; text-align: left; cursor: pointer; }
.cm-cat b { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.cm-cat.on { background: var(--accent-soft); border-color: var(--accent); }
.cm-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.cm-product-list, .cm-group-list { display: flex; flex-direction: column; gap: 6px; }
.cm-product, .cm-group { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-elevated); }
.cm-p-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.cm-p-main b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text-primary); }
.cm-price { font-family: var(--font-display); font-weight: 800; color: var(--text-primary); white-space: nowrap; }
.cm-unlinked { border: 1px dashed var(--border-strong); font: inherit; font-size: 11.5px; cursor: pointer; white-space: nowrap; }
.cm-unlinked:hover { border-color: var(--accent); color: var(--accent); }
.cm-unlinked svg { width: 12px; height: 12px; vertical-align: -2px; }
.cm-avail { display: inline-flex; align-items: center; gap: 5px; font-size: 12px; color: var(--text-secondary); white-space: nowrap; cursor: pointer; }
.cm-avail input { width: 15px; height: 15px; margin: 0; }
.cm-group .cf-chips { flex: 2; }
.cm-rlines { display: flex; flex-direction: column; gap: 6px; margin: 8px 0; }
.cm-rline { display: grid; grid-template-columns: 1fr 110px 50px 30px; gap: 6px; align-items: center; }
.cm-wide { max-width: 760px; width: 100%; }
.cm-olines-h, .cm-oline { display: grid; grid-template-columns: 1.4fr 110px 1.4fr 90px 30px; gap: 6px; align-items: center; }
.cm-olines-h { font-size: 11.5px; font-weight: 700; color: var(--text-muted); margin-top: 6px; }
.cm-olines { display: flex; flex-direction: column; gap: 6px; margin: 6px 0 8px; }
.cm-rline select, .cm-rline input, .cm-oline select, .cm-oline input { width: 100%; min-width: 0; padding: 7px 9px; border-radius: 9px; border: 1px solid var(--border); background: var(--bg-surface); color: var(--text-primary); font: inherit; font-size: 13px; }

/* ---- Masalar ---- */
.ct-filters { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; min-width: 0; }
.ct-branch { padding: 8px 10px; border-radius: 10px; border: 1px solid var(--border); background: var(--bg-surface); color: var(--text-primary); font: inherit; font-size: 13.5px; font-weight: 600; }
.ct-legend { display: flex; gap: 10px; flex-wrap: wrap; font-size: 12px; color: var(--text-secondary); }
.ct-lg::before { content: ""; display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 5px; vertical-align: -1px; background: var(--ct-c); }
.ct-lg.free, .ct-table.free { --ct-c: #22c55e; }
.ct-lg.occupied, .ct-table.occupied { --ct-c: #f97316; }
.ct-lg.bill, .ct-table.bill { --ct-c: #e5484d; }
.ct-lg.reserved, .ct-table.reserved { --ct-c: #6366f1; }
.ct-board { display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 12px; }
.ct-board.placed { grid-template-columns: repeat(8, minmax(96px, 1fr)); grid-auto-rows: minmax(104px, auto); }
.ct-table { position: relative; min-height: 104px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; padding: 10px 8px;
            border: 2px solid var(--ct-c); border-radius: 16px; background: color-mix(in srgb, var(--ct-c) 9%, var(--bg-surface)); color: var(--text-primary); font: inherit; cursor: pointer; }
.ct-table.round { border-radius: 50% / 46%; }
.ct-table b { font-family: var(--font-display); font-size: 18px; }
.ct-state { font-size: 11px; font-weight: 700; color: var(--ct-c); text-transform: uppercase; letter-spacing: .3px; }
.ct-total { font-weight: 800; font-size: 14px; }
.ct-meta, .ct-cap { font-size: 11.5px; color: var(--text-muted); display: inline-flex; align-items: center; gap: 3px; }
.ct-cap svg { width: 12px; height: 12px; }
.ct-table:hover { box-shadow: 0 4px 14px rgba(15, 27, 45, .14); }
.ct-dl { display: grid; grid-template-columns: auto 1fr; gap: 6px 14px; margin: 0 0 10px; font-size: 13.5px; }
.ct-dl dt { color: var(--text-muted); }
.ct-dl dd { margin: 0; font-weight: 600; }

/* ---- Adisyon paneli (POS) — _OrderPanel.cshtml, cafe-order.js ---- */
.cafe-page [hidden], #coPanel [hidden], .modal-overlay[id^="co"] [hidden], .modal-overlay[data-cafe] [hidden] { display: none !important; }
body.co-lock { overflow: hidden; }
.co-overlay { position: fixed; inset: 0; z-index: 150; display: flex; background: var(--bg-base); }   /* kenar çubuğu 100 / alt menü 80 üstünde, modal 200 altında */
.co-overlay[hidden] { display: none; }
.co-shell { flex: 1; min-width: 0; min-height: 0; display: flex; flex-direction: column; }
.co-top { display: flex; align-items: center; gap: 10px; padding: 10px 16px; border-bottom: 1px solid var(--border); background: var(--bg-surface); }
.co-title { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.co-title b { font-family: var(--font-display); font-size: 18px; color: var(--text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.co-title .cf-sub { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.co-mtabs { display: none; margin: 8px 12px 0; }
.co-body { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr) 410px; }
.co-menu { display: flex; flex-direction: column; gap: 10px; min-height: 0; padding: 14px 16px 0; }
.co-search { display: flex; align-items: center; gap: 8px; padding: 0 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-surface); }
.co-search svg { width: 16px; height: 16px; color: var(--text-muted); flex-shrink: 0; }
.co-search input { flex: 1; min-width: 0; padding: 10px 0; border: 0; background: none; color: var(--text-primary); font: inherit; font-size: 14px; outline: none; }
.co-cats { flex-shrink: 0; }
.co-cats .cm-dot { width: 8px; height: 8px; }
.co-products { flex: 1; min-height: 0; overflow-y: auto; display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; align-content: start; padding-bottom: 16px; }
.co-prod { display: flex; flex-direction: column; justify-content: space-between; gap: 6px; min-height: 84px; padding: 12px; border: 1px solid var(--border); border-left: 4px solid var(--co-c);
           border-radius: 12px; background: var(--bg-surface); color: var(--text-primary); font: inherit; text-align: left; cursor: pointer; transition: transform .08s ease, border-color .15s ease; }
.co-prod b { font-size: 14px; line-height: 1.3; }
.co-prod span { display: flex; align-items: center; gap: 4px; font-size: 13.5px; font-weight: 800; color: var(--accent-bright); }
.co-prod span svg { width: 13px; height: 13px; color: var(--text-muted); }
.co-prod:hover:not(:disabled) { border-color: var(--accent); border-left-color: var(--co-c); }
.co-prod:active:not(:disabled) { transform: scale(.97); }
.co-prod:disabled { cursor: default; opacity: .65; }
.co-prod.off span { color: #e5484d; }
.co-ticket { display: flex; flex-direction: column; gap: 10px; min-height: 0; overflow-y: auto; padding: 14px 16px 0; border-left: 1px solid var(--border); background: var(--bg-surface); }
.co-sec-h { display: flex; align-items: baseline; gap: 8px; margin: 2px 0 4px; font-size: 13px; color: var(--text-primary); }
.co-sec-h .cf-sub { font-size: 11.5px; }
.co-pending { display: flex; flex-direction: column; gap: 6px; padding: 10px; border: 1px dashed var(--accent); border-radius: 12px; background: var(--accent-soft); }
.co-pending-acts { display: flex; justify-content: flex-end; align-items: center; gap: 6px; flex-wrap: wrap; }
.co-lines { display: flex; flex-direction: column; gap: 4px; }
.co-line { width: 100%; display: flex; align-items: flex-start; gap: 8px; padding: 8px 10px; border: 1px solid var(--border); border-radius: 10px; background: var(--bg-elevated); color: var(--text-primary); font: inherit; text-align: left; }
button.co-line { cursor: pointer; }
button.co-line:hover:not(:disabled) { border-color: var(--accent); }
button.co-line:disabled { cursor: default; }
.co-line.pend { align-items: center; background: var(--bg-surface); }
.co-line.cancelled { opacity: .5; }
.co-line.cancelled b { text-decoration: line-through; }
.co-q { min-width: 32px; font-weight: 800; color: var(--text-secondary); }
.co-l-main { flex: 1; min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 3px 6px; }
.co-l-main b { width: 100%; font-size: 13.5px; font-weight: 600; }
.co-l-main span { font-size: 12px; color: var(--text-muted); }
.co-note { width: 100%; font-style: italic; }
.co-l-price { font-size: 13.5px; font-weight: 800; white-space: nowrap; }
.co-qty { display: flex; align-items: center; gap: 4px; }
.co-qty b { min-width: 24px; text-align: center; }
.co-st, .co-badge { padding: 1px 7px; border-radius: 999px; font-size: 10.5px !important; font-weight: 700; letter-spacing: .2px; }
.co-st { background: rgba(148, 163, 184, .18); color: var(--text-secondary) !important; text-transform: uppercase; }
.co-st.new { background: rgba(245, 158, 11, .16); color: #b45309 !important; }
.co-st.sent, .co-st.preparing { background: rgba(99, 102, 241, .14); color: #4f46e5 !important; }
.co-st.ready { background: rgba(34, 197, 94, .16); color: #15803d !important; }
.co-badge { background: rgba(229, 72, 77, .12); color: #e5484d !important; }
.co-badge.gift { background: rgba(236, 72, 153, .14); color: #db2777 !important; }
.co-badge.paid { background: var(--accent-soft); color: var(--accent-bright) !important; }
.co-empty { padding: 24px 12px; }
.co-totals { display: flex; flex-direction: column; gap: 4px; padding-top: 10px; border-top: 1px solid var(--border); font-size: 13.5px; color: var(--text-secondary); }
.co-totals > div { display: flex; justify-content: space-between; gap: 10px; }
.co-total { padding-top: 4px; font-size: 16px; color: var(--text-primary); }
.co-total b { font-family: var(--font-display); font-size: 24px; }
.co-rem { color: var(--text-primary); }
.co-rem b { font-size: 17px; color: #e5484d; }
.co-rem.zero b { color: var(--accent-bright); }
.co-pays { display: flex; flex-direction: column; gap: 4px; }
.co-pay { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border-radius: 9px; background: var(--bg-elevated); font-size: 12.5px; }
.co-pay span { flex: 1; min-width: 0; color: var(--text-secondary); }
.co-pay small { font-weight: 600; color: var(--text-muted); }
.co-pay.void { opacity: .55; }
.co-pay.void b { text-decoration: line-through; }
.co-acts { position: sticky; bottom: 0; margin-top: auto; display: flex; flex-wrap: wrap; gap: 6px; padding: 10px 0 14px; background: var(--bg-surface); }
.co-acts .btn { flex: 1 1 auto; justify-content: center; }
.co-acts .co-danger { flex: 0 0 auto; color: #e5484d; }
.co-cash-hint { width: 100%; }
.co-optg { margin-bottom: 12px; }
.co-opts { display: flex; flex-wrap: wrap; gap: 6px; }
.co-opt { padding: 9px 13px; border: 1px solid var(--border-strong); border-radius: 10px; background: var(--bg-base); color: var(--text-primary); font: inherit; font-size: 13.5px; cursor: pointer; }
.co-opt small { color: var(--text-muted); }
.co-opt.on { border-color: var(--accent); background: var(--accent-soft); font-weight: 700; }
.co-disc { margin-top: 12px; padding-top: 10px; border-top: 1px solid var(--border); }
.co-seg { display: flex; gap: 4px; margin-bottom: 12px; padding: 4px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-base); }
.co-seg button { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 10px 8px; border: 0; border-radius: 9px; background: none; color: var(--text-secondary); font: inherit; font-size: 13.5px; font-weight: 700; cursor: pointer; }
.co-seg button svg { width: 16px; height: 16px; }
.co-seg button.on { background: var(--accent-soft); color: var(--accent-bright); box-shadow: inset 0 0 0 1px var(--accent); }
.co-seg-sm button { padding: 7px 6px; font-size: 12.5px; }
.co-pay-rem { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 12px; color: var(--text-secondary); }
.co-pay-rem b { font-family: var(--font-display); font-size: 26px; color: var(--text-primary); }
.co-pay-items { display: flex; flex-direction: column; gap: 6px; max-height: 260px; overflow-y: auto; margin-bottom: 8px; }
.co-pay-item { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid var(--border); border-radius: 10px; }
.co-pay-item.on { border-color: var(--accent); background: var(--accent-soft); }
#coPayItemsTotal { margin-bottom: 12px; }
.co-move-row { display: grid; grid-template-columns: repeat(auto-fill, minmax(92px, 1fr)); gap: 8px; margin-bottom: 10px; }
.co-mt { min-height: 70px; }
.co-mt:disabled { opacity: .45; cursor: default; }
.co-log { display: flex; flex-direction: column; max-height: 60vh; overflow-y: auto; }
.co-log-row { display: flex; align-items: flex-start; gap: 10px; padding: 7px 0; border-bottom: 1px solid var(--border); font-size: 13px; }
.co-log-row > div { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.co-log-row span, .co-log-row small { color: var(--text-muted); }
.co-log-t { min-width: 42px; color: var(--text-muted); }

/* ---- Adisyonlar ---- */
.ol-table .cf-tr { grid-template-columns: 2.4fr 1fr 1fr 1.3fr 28px; }
.ol-row { width: 100%; border: 0; border-bottom: 1px solid var(--border); background: none; color: var(--text-primary); font: inherit; text-align: left; cursor: pointer; }
.ol-row:last-child { border-bottom: 0; }
.ol-row:hover { background: var(--bg-elevated); }
.ol-row svg { width: 16px; height: 16px; color: var(--text-muted); }

/* ---- Kasa ---- */
.cc-card { display: flex; flex-direction: column; gap: 14px; padding: 16px; border: 1px solid var(--border); border-radius: 16px; background: var(--bg-surface); }
.cc-card-h { display: flex; align-items: center; gap: 12px; }
.cc-card-h > svg { width: 24px; height: 24px; color: var(--accent); flex-shrink: 0; }
.cc-card-h > div { display: flex; flex-direction: column; gap: 2px; }
.cc-card-h b { font-family: var(--font-display); font-size: 17px; color: var(--text-primary); }
.cc-form { display: flex; align-items: flex-end; gap: 10px; flex-wrap: wrap; }
.cc-f { display: flex; flex-direction: column; gap: 4px; min-width: 160px; font-size: 12px; font-weight: 600; color: var(--text-secondary); }
.cc-f.grow { flex: 1; }
.cc-f input { padding: 9px 11px; border: 1px solid var(--border-strong); border-radius: 10px; background: var(--bg-base); color: var(--text-primary); font: inherit; font-size: 14px; font-weight: 400; }
.cc-stats { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.cc-stat { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-elevated); }
.cc-stat span { font-size: 12px; color: var(--text-muted); }
.cc-stat b { font-family: var(--font-display); font-size: 18px; color: var(--text-primary); }
.cc-stat.main { grid-column: span 2; border-color: var(--accent); background: var(--accent-soft); }
.cc-stat.main b { font-size: 26px; }
.cc-stat.warn b { color: #d97706; }
.cc-close { display: flex; flex-direction: column; gap: 8px; padding-top: 12px; border-top: 1px solid var(--border); }
.cc-bad { color: #e5484d; font-weight: 700; }
.cc-hist { display: flex; flex-direction: column; gap: 8px; }
.cc-table .cf-tr { grid-template-columns: 2fr 1fr 1fr 1fr 1fr; }

/* ---- Genel Bakış / Raporlar / Gelir & Gider ortak kartları (cd-*) ---- */
.cf-chip.warn { background: rgba(245, 158, 11, .16); color: #b45309; }
.cf-tabs-sm .cf-tab { padding: 5px 10px; font-size: 12.5px; }
.cd-kpis { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px; }
.cd-kpi { display: flex; flex-direction: column; gap: 3px; min-width: 0; padding: 14px 16px; border: 1px solid var(--border); border-radius: 16px; background: var(--bg-surface); }
.cd-kpi > span { font-size: 12.5px; color: var(--text-muted); }
.cd-kpi > b { font-family: var(--font-display); font-size: 22px; color: var(--text-primary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cd-kpi > small { font-size: 12px; color: var(--text-muted); }
.cd-kpi.main { border-color: var(--accent); background: var(--accent-soft); }
.cd-kpi.main > b { font-size: 26px; }
.cd-kpi.good > b { color: #15803d; }
.cd-kpi.bad > b { color: #e5484d; }
.cd-kpi.warn > b { color: #d97706; }
.cd-trend { font-weight: 800; }
.cd-trend.up { color: #15803d; }
.cd-trend.down { color: #e5484d; }
.cd-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; align-items: start; }
.cd-card { display: flex; flex-direction: column; gap: 10px; min-width: 0; padding: 14px 16px; border: 1px solid var(--border); border-radius: 16px; background: var(--bg-surface); }
.cd-wide { grid-column: span 2; }
.cd-card-h { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.cd-card-h > b { font-size: 14px; color: var(--text-primary); }
.cd-card-h > .btn-sm, .cd-card-h > .ct-filters, .cd-link { margin-left: auto; }
.cd-link { display: inline-flex; align-items: center; gap: 2px; font-size: 12.5px; font-weight: 700; color: var(--accent-bright); text-decoration: none; }
.cd-link svg { width: 14px; height: 14px; }
.cd-chart { position: relative; height: 230px; }
.cd-chart.sm { height: 190px; }
.cd-ops { display: flex; flex-direction: column; gap: 4px; }
.cd-op { display: flex; justify-content: space-between; gap: 10px; padding: 7px 10px; border-radius: 9px; background: var(--bg-elevated); font-size: 13px; }
.cd-op span { color: var(--text-secondary); min-width: 0; }
.cd-op b { white-space: nowrap; color: var(--text-primary); }
.cd-op.warn b { color: #d97706; }
.cd-op.bad b { color: #e5484d; }
.cd-links { display: flex; flex-wrap: wrap; gap: 8px; }
.cd-qlink { display: inline-flex; align-items: center; gap: 6px; padding: 8px 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--bg-surface); color: var(--text-primary); font-size: 13px; font-weight: 600; text-decoration: none; }
.cd-qlink svg { width: 15px; height: 15px; color: var(--accent); }
.cd-qlink:hover { border-color: var(--accent); }
.cf-bar { display: flex; flex-direction: column; gap: 4px; margin-bottom: 8px; }
.cf-bar-h { display: flex; justify-content: space-between; gap: 10px; font-size: 13px; }
.cf-bar-h span { min-width: 0; color: var(--text-secondary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cf-bar-h small { color: var(--text-muted); }
.cf-bar-h b { white-space: nowrap; color: var(--text-primary); }
.cf-bar-t { height: 6px; border-radius: 999px; background: var(--bg-elevated); overflow: hidden; }
.cf-bar-t i { display: block; height: 100%; border-radius: inherit; background: var(--accent); }
.cr-custom { display: inline-flex; align-items: center; gap: 6px; }
.cr-products .cf-tr { grid-template-columns: 2.2fr .7fr 1fr 1fr 1fr .6fr; }
.cr-sort { padding: 0; border: 0; background: none; color: inherit; font: inherit; font-weight: 700; cursor: pointer; }
.cr-sort.on { color: var(--accent-bright); }
.cr-sort.on::after { content: " ▾"; }
.cr-auto { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 14px 16px; border: 1px dashed var(--accent); border-radius: 16px; background: var(--accent-soft); }
.cr-auto > svg { width: 24px; height: 24px; color: var(--accent); flex-shrink: 0; }
.cr-auto > div { flex: 1 1 260px; display: flex; flex-direction: column; gap: 2px; font-size: 13px; color: var(--text-secondary); }
.cr-auto b { color: var(--text-primary); font-size: 14px; }

/* ---- Stok ---- */
.st-search { padding: 0 10px; }
.st-search input { padding: 7px 0; font-size: 13px; }
.st-table .cf-tr { grid-template-columns: 2.2fr 1fr 1.2fr 1fr 70px; }
.st-row-acts { display: flex; gap: 4px; justify-content: flex-end; }
.st-pending { display: block; margin-top: 2px; font-size: 11.5px; }
.st-unlinked { cursor: help; }
.st-unlinked svg { width: 12px; height: 12px; vertical-align: -2px; }
.st-count { width: 100%; max-width: 130px; padding: 6px 8px; border: 1px solid var(--accent); border-radius: 8px; background: var(--bg-base); color: var(--text-primary); font: inherit; }
.st-countbar { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 10px 12px; border: 1px dashed var(--accent); border-radius: 12px; background: var(--accent-soft); font-size: 13px; }
.st-countbar > span { flex: 1 1 260px; }
.st-countbar input { padding: 7px 10px; border: 1px solid var(--border-strong); border-radius: 9px; background: var(--bg-surface); color: var(--text-primary); font: inherit; font-size: 13px; }
.st-moves .cf-tr { grid-template-columns: 2.2fr 1fr .8fr 1.1fr .7fr; }
.st-kind { padding: 1px 8px; border-radius: 999px; font-size: 11.5px; font-weight: 700; background: rgba(148, 163, 184, .18); color: var(--text-secondary); }
.st-kind.in, .st-kind.return { background: rgba(34, 197, 94, .14); color: #15803d; }
.st-kind.out { background: rgba(229, 72, 77, .12); color: #e5484d; }
.st-kind.consume { background: rgba(99, 102, 241, .14); color: #4f46e5; }
.st-kind.adjust { background: rgba(245, 158, 11, .16); color: #b45309; }
.st-pos { color: #15803d; font-weight: 700; }
.st-clear { margin-left: 6px; padding: 0; border: 0; background: none; color: var(--accent-bright); font: inherit; font-size: 12px; cursor: pointer; }
.st-more { justify-content: center; margin-top: 8px; }
.modal.st-wide { max-width: 720px; }
.st-rlines-h, .st-rline { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr 30px; gap: 6px; align-items: center; }
.st-rlines-h { font-size: 11.5px; font-weight: 700; color: var(--text-muted); }
.st-rlines { display: flex; flex-direction: column; gap: 6px; margin: 6px 0 8px; }
.st-rline select, .st-rline input { width: 100%; min-width: 0; padding: 8px 9px; border: 1px solid var(--border-strong); border-radius: 9px; background: var(--bg-base); color: var(--text-primary); font: inherit; font-size: 13px; }
.st-rsum { font-weight: 700; font-size: 13px; text-align: right; }
.st-rtotal { display: flex; justify-content: space-between; align-items: baseline; margin: 10px 0 12px; padding-top: 8px; border-top: 1px solid var(--border); }
.st-rtotal b { font-family: var(--font-display); font-size: 20px; }

/* ---- Gelir & Gider ---- */
.fi-table .cf-tr { grid-template-columns: 2.4fr .8fr 1.4fr 1.1fr 44px; }
.fi-kind { padding: 1px 8px; border-radius: 999px; font-size: 11.5px; font-weight: 700; }
.fi-kind.income { background: rgba(34, 197, 94, .14); color: #15803d; }
.fi-kind.expense { background: rgba(249, 115, 22, .14); color: #c2410c; }
.fi-kind.transfer { background: rgba(99, 102, 241, .14); color: #4f46e5; }
.fi-amt { display: flex; flex-direction: column; font-weight: 800; }
.fi-amt.income { color: #15803d; }
.fi-amt.expense { color: #c2410c; }
.fi-amt small { font-weight: 400; }
.fi-catrow { display: flex; gap: 6px; align-items: center; }
.fi-catrow select, .fi-catrow input { flex: 1; min-width: 0; }
.fi-catrow + .fi-catrow { margin-top: 6px; }

/* ---- POS entegrasyonu ---- */
.cp-intro { max-width: 720px; line-height: 1.5; }
#cpModal .cf-checks + .cf-hint { margin-top: 10px; }
.cp-list { display: flex; flex-direction: column; gap: 8px; }
.cp-card { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding: 14px 16px; border: 1px solid var(--border); border-radius: 16px; background: var(--bg-surface); }
.cp-card.off { opacity: .65; }
.cp-main { flex: 1 1 240px; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.cp-main > b { font-size: 15px; color: var(--text-primary); }
.cp-hist .cf-tr { grid-template-columns: 2.6fr .8fr .8fr .8fr 10px; }
.cp-err { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.modal.cp-wide { max-width: 760px; }
.cp-copy { display: flex; align-items: center; gap: 8px; }
.cp-copy code, .cp-code { flex: 1; min-width: 0; padding: 9px 11px; border-radius: 10px; background: var(--bg-base); border: 1px solid var(--border-strong); font-family: ui-monospace, Consolas, monospace; font-size: 12.5px; word-break: break-all; color: var(--text-primary); }
.cp-code { display: block; }
.cp-pre { margin: 0; padding: 12px; max-height: 260px; overflow: auto; border-radius: 10px; background: var(--bg-base); border: 1px solid var(--border-strong); font-size: 12px; line-height: 1.45; color: var(--text-primary); }
.cp-key { margin-bottom: 12px; }
.wf-banner.warn { background: rgba(245, 158, 11, .14); color: #92400e; border-color: rgba(245, 158, 11, .4); }
.cp-drop { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 28px 16px; border: 2px dashed var(--border-strong); border-radius: 14px; text-align: center; cursor: pointer; color: var(--text-secondary); }
.cp-drop:hover { border-color: var(--accent); background: var(--accent-soft); }
.cp-drop svg { width: 28px; height: 28px; color: var(--accent); }
.cp-drop b { color: var(--text-primary); }
.cp-drop span { font-size: 12px; color: var(--text-muted); }
.cp-map { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 8px 12px; margin: 10px 0; }
.cp-map-f { display: flex; flex-direction: column; gap: 4px; font-size: 12px; font-weight: 600; color: var(--text-secondary); }
.cp-map-f.req span { color: var(--text-primary); }
.cp-map-f select { padding: 7px 9px; border: 1px solid var(--border-strong); border-radius: 9px; background: var(--bg-base); color: var(--text-primary); font: inherit; font-size: 13px; font-weight: 400; }
.cp-sample-scroll { overflow-x: auto; }
.cp-sample table { border-collapse: collapse; font-size: 12px; min-width: 100%; }
.cp-sample th, .cp-sample td { padding: 6px 9px; border-bottom: 1px solid var(--border); text-align: left; white-space: nowrap; }
.cp-sample th { background: var(--bg-elevated); color: var(--text-secondary); }
.cp-warn { display: flex; flex-direction: column; gap: 4px; margin-top: 10px; padding: 10px 12px; border-radius: 12px; background: rgba(245, 158, 11, .1); font-size: 13px; color: var(--text-secondary); }
.cp-warn b { color: var(--text-primary); }
.cp-warn.bad { background: rgba(229, 72, 77, .08); }
.cp-warn ul { margin: 0; padding-left: 18px; max-height: 180px; overflow-y: auto; }

/* ---- Masalar: servis bekleyen "hazır" kalem rozeti, rezerve masada oturtma ---- */
.ct-ready { position: absolute; top: -8px; right: -8px; display: inline-flex; align-items: center; gap: 3px; padding: 3px 8px; border-radius: 999px;
            background: #16a34a; color: #fff; font-size: 12px; font-weight: 800; box-shadow: 0 2px 8px rgba(22, 163, 74, .4); animation: ct-pulse 1.6s ease-in-out infinite; }
.ct-ready svg { width: 13px; height: 13px; }
@keyframes ct-pulse { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.08); } }
.ct-rsv-acts { display: flex; flex-direction: column; gap: 8px; }
.ct-rsv-acts .btn { justify-content: center; }
.co-serve { margin: 4px 0 10px; }

/* ---- Mutfak / bar ekranı (KDS) ---- */
.ck-page:fullscreen { padding: 16px; overflow-y: auto; background: var(--bg-base); }
#ckSound.on { color: var(--accent-bright); }
.ck-board { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; align-items: start; }
.ck-ticket { --ck-c: var(--border-strong); display: flex; flex-direction: column; border: 2px solid var(--ck-c); border-top-width: 6px; border-radius: 14px; background: var(--bg-surface); overflow: hidden; }
.ck-ticket.warn { --ck-c: #f59e0b; }
.ck-ticket.late { --ck-c: #e5484d; }
.ck-ticket.done { --ck-c: #16a34a; opacity: .85; }
.ck-ticket header { display: flex; align-items: baseline; gap: 8px; padding: 10px 12px 2px; }
.ck-ticket header b { flex: 1; min-width: 0; font-family: var(--font-display); font-size: 19px; color: var(--text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ck-no { font-weight: 700; color: var(--text-muted); }
.ck-time { padding: 2px 8px; border-radius: 999px; background: var(--ck-c); color: #fff; font-size: 12px; font-weight: 800; }
.ck-ticket:not(.warn):not(.late):not(.done) .ck-time { background: var(--bg-elevated); color: var(--text-secondary); }
.ck-sub { padding: 0 12px 6px; font-size: 12px; color: var(--text-muted); }
.ck-note { margin: 0 12px 6px; padding: 6px 8px; border-radius: 8px; background: rgba(245, 158, 11, .14); color: #92400e; font-size: 12.5px; font-weight: 600; }
.ck-ticket ul { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--border); }
.ck-item { display: flex; align-items: flex-start; gap: 8px; padding: 10px 12px; border-bottom: 1px solid var(--border); cursor: pointer; user-select: none; }
.ck-item:active { background: var(--bg-elevated); }
.ck-q { min-width: 32px; font-family: var(--font-display); font-size: 18px; font-weight: 800; color: var(--text-primary); }
.ck-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.ck-main b { font-size: 15.5px; color: var(--text-primary); }
.ck-opts { font-size: 13px; font-weight: 700; color: var(--accent-bright); }
.ck-inote { font-size: 12.5px; font-style: italic; color: #b45309; }
.ck-st { flex-shrink: 0; padding: 2px 8px; border-radius: 999px; font-size: 11px; font-weight: 800; text-transform: uppercase; background: rgba(245, 158, 11, .16); color: #b45309; }
.ck-item.preparing .ck-st { background: rgba(99, 102, 241, .14); color: #4f46e5; }
.ck-item.ready .ck-st { background: rgba(34, 197, 94, .16); color: #15803d; }
.ck-item.ready .ck-main b { text-decoration: line-through; color: var(--text-muted); }
.ck-undo { flex-shrink: 0; padding: 2px; border: 0; background: none; color: var(--text-muted); cursor: pointer; }
.ck-undo svg { width: 15px; height: 15px; }
.ck-ticket footer { padding: 10px 12px; }
.ck-ticket footer .btn { width: 100%; justify-content: center; }

/* ---- Rezervasyonlar ---- */
.rs-daynav { display: inline-flex; align-items: center; gap: 4px; }
.rs-list { display: flex; flex-direction: column; gap: 8px; }
.rs-row { display: grid; grid-template-columns: 64px minmax(0, 1fr) auto; grid-template-areas: "time main st" "time acts acts"; gap: 6px 12px; align-items: start;
          padding: 12px 14px; border: 1px solid var(--border); border-left: 4px solid var(--accent); border-radius: 14px; background: var(--bg-surface); }
.rs-row.done { border-left-color: #16a34a; }
.rs-row.cancelled, .rs-row.noshow { border-left-color: var(--border-strong); opacity: .6; }
.rs-row.late { border-left-color: #e5484d; }
.rs-time { grid-area: time; display: flex; flex-direction: column; }
.rs-time b { font-family: var(--font-display); font-size: 19px; color: var(--text-primary); }
.rs-time span { font-size: 12px; color: var(--text-muted); }
.rs-main { grid-area: main; display: flex; flex-wrap: wrap; align-items: center; gap: 3px 8px; min-width: 0; }
.rs-main > b { font-size: 15px; color: var(--text-primary); }
.rs-meta { width: 100%; font-size: 12.5px; color: var(--text-secondary); }
.rs-phone { display: inline-flex; align-items: center; gap: 4px; font-size: 12.5px; color: var(--accent-bright); text-decoration: none; }
.rs-phone svg { width: 13px; height: 13px; }
.rs-note { width: 100%; font-size: 12.5px; font-style: italic; color: var(--text-muted); }
.rs-st { grid-area: st; padding: 2px 9px; border-radius: 999px; font-size: 11.5px; font-weight: 700; background: var(--accent-soft); color: var(--accent-bright); }
.rs-st.done { background: rgba(34, 197, 94, .14); color: #15803d; }
.rs-st.cancelled, .rs-st.noshow { background: rgba(148, 163, 184, .18); color: var(--text-muted); }
.rs-acts { grid-area: acts; display: flex; flex-wrap: wrap; gap: 6px; }
.rs-acts:empty { display: none; }

@media (max-width: 900px) {
    .cs-grid, .cm-grid { grid-template-columns: 1fr; }
    .ct-board.placed { grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); }
    .ct-board.placed .ct-table { grid-column: auto !important; grid-row: auto !important; }
    .co-mtabs { display: flex; }
    .co-body { grid-template-columns: 1fr; }
    .co-menu, .co-ticket { display: none; }
    .co-menu.m-on, .co-ticket.m-on { display: flex; }
    .co-ticket { border-left: 0; }
    .cd-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}
@media (max-width: 640px) {
    .cf-tr { grid-template-columns: 1.6fr 1fr 1fr 40px; }
    .cf-tr > span:nth-child(4) { display: none; }
    .cm-olines-h { display: none; }
    .cm-oline { grid-template-columns: 1fr 90px; }
    .cm-oline select { grid-column: 1; }
    .ct-board { grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 8px; }
    .cm-product { flex-wrap: wrap; }
    .cm-p-main b { white-space: normal; }
    .co-top { padding: 8px 12px; }
    .co-menu, .co-ticket { padding-left: 12px; padding-right: 12px; }
    .co-products { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
    .co-prod { min-height: 74px; padding: 10px; }
    .ol-table .cf-tr { grid-template-columns: 1.8fr 1fr 1.1fr 20px; }
    .ol-table .cf-tr > span:nth-child(4) { display: block; }
    .ol-table .cf-tr > span:nth-child(3) { display: none; }
    .cc-table .cf-tr { grid-template-columns: 1.5fr 1fr 1fr 1fr; }
    .cc-table .cf-tr > span:nth-child(4) { display: block; }
    .cc-table .cf-tr > span:nth-child(2) { display: none; }
    .cc-stat.main { grid-column: 1 / -1; }
    .cc-f { min-width: 0; flex: 1 1 140px; }
    .ck-board { grid-template-columns: minmax(0, 1fr); }
    .cp-hist .cf-tr { grid-template-columns: 1.8fr .7fr .7fr .7fr; }
    .cp-hist .cf-tr > span:nth-child(4) { display: block; }
    .cp-card .cf-acts { width: 100%; }
    .rs-row { grid-template-columns: 52px minmax(0, 1fr); grid-template-areas: "time main" "time st" "acts acts"; }
    .rs-st { justify-self: start; }
    .cd-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
    .cd-kpi { padding: 12px; }
    .cd-kpi > b, .cd-kpi.main > b { font-size: 19px; }
    .cd-kpi.main { grid-column: 1 / -1; }
    .cd-grid { grid-template-columns: minmax(0, 1fr); }
    .cd-wide { grid-column: auto; }
    .cr-products .cf-tr { grid-template-columns: 1.8fr .6fr 1fr 1fr; }
    .cr-products .cf-tr > span:nth-child(6) { display: none; }   /* 4. sütun (maliyet) genel kuralla gizli */
    .st-table .cf-tr { grid-template-columns: 1.8fr 1fr 1fr 60px; }
    .st-moves .cf-tr { grid-template-columns: 1.7fr 1fr .8fr; }
    .st-moves .cf-tr > span:nth-child(4), .st-moves .cf-tr > span:nth-child(5) { display: none; }
    .st-rlines-h { display: none; }
    .st-rline { grid-template-columns: 1fr 1fr 30px; }
    .st-rline .st-ritem { grid-column: 1 / -1; }
    .st-rline .st-rsum { display: none; }
    .fi-table .cf-tr { grid-template-columns: 1.7fr 1fr 40px; }
    .fi-table .cf-tr > span:nth-child(2), .fi-table .cf-tr > span:nth-child(3) { display: none; }
    .fi-table .cf-tr > span:nth-child(4) { display: flex; }
}
