:root {
  /* токены дизайна (макеты docs/design) */
  --font: Onest, system-ui, "Segoe UI", sans-serif;
  --bg: #f3f1ed; --panel: #fff; --fg: #1f1b17; --muted: #5f574f;
  --card-line: #e2dcd4; --hair: #eee8e1; --line: #d6cec4;  /* рамка карточки, тонкие линии, рамка полей */
  --accent: #c8102e; --ok: #1f7a3d;
  --ok-bg: #e6f4ec; --ok-fg: #145236; --warn-bg: #fff4e0; --warn-fg: #5a3300; --err-bg: #fdecef; --err-fg: #8a0a1f;
  --site-bg: #ffd23f; --site-fg: #3d2e00; --bar-bg: #fff1c2; --bar-line: #f0d78a;
  --st-wait-bg: #ebe7e1; --st-wait-fg: #3d3833; --st-cook-bg: #ffeeb0; --st-cook-fg: #4a3800; --st-done-bg: #cdeedb; --st-done-fg: #145236;
  --st-way-bg: #d6e6ff; --st-way-fg: #163e75; --st-pre-bg: #e4dcf7; --st-pre-fg: #3f2a78; --st-err-bg: #c8102e; --st-err-fg: #fff; --st-site-bg: #ffd23f; --st-site-fg: #3d2e00;
  --row-late: #fff6ec; --row-err: #fff3f4; --row-site: #fffbea;
  --r-card: 10px; --r-ctl: 8px; --r-pill: 999px; --h-field: 36px; --h-small: 30px; --h-head: 50px; --h-strip: 42px; --h-foot: 52px; --gap: 12px;
  --soft: #faf8f5; --soft2: #eee; --hover: #fde8ea; --ink: #1f1b17; --on-ink: #fff; --err-line: #f0b8c0; --field: #fff;
  /* оттенки из стилей; тёмные пары — в html[data-theme=dark] */
  --cb-e2dcd4: #e2dcd4;
  --cb-e8f0fd: #e8f0fd;
  --cb-eaf4e4: #eaf4e4;
  --cb-eef4ff: #eef4ff;
  --cb-f1eee9: #f1eee9;
  --cb-f3ebe2: #f3ebe2;
  --cb-f3f1ee: #f3f1ee;
  --cb-f4f4f4: #f4f4f4;
  --cb-f4f6f8: #f4f6f8;
  --cb-f6f4f0: #f6f4f0;
  --cb-f9f6f1: #f9f6f1;
  --cb-fbe9e6: #fbe9e6;
  --cb-fbf9f6: #fbf9f6;
  --cb-fff1c9: #fff1c9;
  --cb-fff4d6: #fff4d6;
  --cb-fff7e0: #fff7e0;
  --cb-fff8f8: #fff8f8;
  --cb-fffaf0: #fffaf0;
  --cb-fffbf2: #fffbf2;
  --cf-163e75: #163e75;
  --cf-1a7a1a: #1a7a1a;
  --cf-1f7a3a: #1f7a3a;
  --cf-2a2622: #2a2622;
  --cf-3f6b32: #3f6b32;
  --cf-555: #555;
  --cf-5a3300: #5a3300;
  --cf-6b4a2f: #6b4a2f;
  --cf-6b4e00: #6b4e00;
  --cf-777: #777;
  --cf-9a4335: #9a4335;
  --cf-b00020: #b00020;
  --cl-a9c7f2: #a9c7f2;
  --cl-bfe3cd: #bfe3cd;
  --cl-c9c2b8: #c9c2b8;
  --cl-cfe3c4: #cfe3c4;
  --cl-d9dee6: #d9dee6;
  --cl-e2d3c2: #e2d3c2;
  --cl-e4ddd2: #e4ddd2;
  --cl-e6e0d8: #e6e0d8;
  --cl-f0cdc6: #f0cdc6;
  --cl-f0d08a: #f0d08a;
  --cl-f1f1f1: #f1f1f1;
}
* { box-sizing: border-box; }
body { margin: 0; font: 14px/1.4 var(--font); background: var(--bg); color: var(--fg); }
h1 { font-size: 18px; margin: 0; } h2 { font-size: 13px; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); margin: 0 0 8px; }
input, select, textarea, button { font: inherit; padding: 6px 8px; border: 1px solid var(--line); border-radius: 4px; background: var(--panel); color: inherit; max-width: 100%; }
input[disabled] { background: var(--soft2); }
button { cursor: pointer; } button:disabled { opacity: .5; cursor: not-allowed; }
/* всё кликабельное — пальцем (Евгений, 08.11.2026): галочки, переключатели, списки, раскрывашки, подписи к галочкам, выбор файла и цвета, значок календаря */
select, summary, input[type=checkbox], input[type=radio], input[type=color], input[type=file], input[type=range], input::-webkit-calendar-picker-indicator,
label:has(> input[type=checkbox]), label:has(> input[type=radio]), label[for] { cursor: pointer; }
select:disabled, input:disabled, label:has(> input:disabled) { cursor: not-allowed; }
button.primary { background: var(--accent); color: #fff; border-color: var(--accent); font-weight: 600; padding: 8px 16px; }
button.danger { color: var(--accent); border-color: var(--accent); }
button.link { border: 0; background: none; color: var(--muted); text-decoration: underline; }
button.ghost { border-style: dashed; background: none; margin-top: 6px; }
.error { color: var(--accent); margin: 4px 0; } .ok { color: var(--ok); margin: 4px 0; } .muted { color: var(--muted); margin: 4px 0; }
.login { max-width: 320px; margin: 15vh auto; display: grid; gap: 12px; } .login label { display: grid; gap: 4px; }
.panel { background: var(--panel); border: 1px solid var(--line); border-radius: 6px; padding: 12px; min-width: 0; overflow-wrap: anywhere; }
.grid2 { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 8px 12px; } .grid4 { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; margin-top: 8px; }
.f { display: grid; gap: 2px; } .f span { font-size: 12px; color: var(--muted); } .f input, .f select, .f textarea { width: 100%; }
.row { display: flex; gap: 8px; margin-top: 8px; } .blbox { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; align-items: center; }
.ac { position: relative; } .results { position: absolute; z-index: 5; left: 0; right: 0; top: 100%; margin: 2px 0 0; padding: 0; list-style: none; background: var(--panel); border: 1px solid var(--line); border-radius: 4px; max-height: 320px; overflow: auto; box-shadow: 0 4px 12px rgba(0,0,0,.12); }
.results li { padding: 6px 8px; cursor: pointer; display: flex; flex-wrap: wrap; gap: 6px; } .results li.cur, .results li:hover { background: var(--hover); }
.results li small { color: var(--muted); flex-basis: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .results li.stop { opacity: .5; } .results .price { margin-left: auto; }
.searchbox { position: relative; margin-bottom: 8px; } .search { width: 100%; font-size: 16px; }
.line { display: grid; grid-template-columns: minmax(0, 3fr) 110px minmax(0, 2fr) 80px 90px 28px; gap: 8px; align-items: start; padding: 6px 0; border-bottom: 1px solid var(--line); }
.line.head { color: var(--muted); font-size: 12px; } .line .qty { display: flex; gap: 2px; } .amt { width: 48px; text-align: center; } .lcomment { width: 100%; }
.line .price, .line .sum { text-align: right; padding-top: 6px; } .mod { display: block; font-size: 12px; color: var(--muted); margin-top: 4px; } .mod label { margin-right: 8px; }
.where { display: inline; } .pay { display: flex; gap: 6px; margin-top: 6px; } .pay input { width: 110px; }
.totals { display: grid; gap: 2px; margin-bottom: 6px; font-size: 15px; }
.horder { border-bottom: 1px solid var(--line); padding: 6px 0; } .hhead { display: flex; gap: 12px; } .hhead span:last-child { margin-left: auto; }
.horder { cursor: pointer; } .horder:hover { background: var(--soft); } .horder.harch { cursor: default; } .hhead .repeat { margin-left: auto; padding: 0 8px; } .hitem { display: flex; justify-content: space-between; gap: 6px; padding: 2px 0; } .hitem button { padding: 0 8px; }

.radio { margin-right: 12px; }

.line.bad { background: var(--err-bg); outline: 1px solid #e5484d; }

.odetail { cursor: default !important; } .odetail td { background: var(--panel) !important; text-decoration: none !important; color: var(--fg) !important; }
.cancel { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin-top: 8px; }
.addbox { margin-top: 10px; display: grid; gap: 6px; max-width: 520px; } .addres { display: grid; gap: 2px; } .addres button { text-align: left; margin: 0; } .addsel .hitem { align-items: center; }
.fold{cursor:pointer;user-select:none}
.ext { font-size: 11px; color: var(--muted); } .ext.big { font-size: 15px; font-weight: 600; color: var(--fg); }
.oview { max-width: 860px; margin: 0 auto; padding: 12px 16px; }
.ostatus { display: inline-block; padding: 4px 10px; border-radius: 4px; font-weight: 600; }
.ogrid { display: grid; grid-template-columns: 110px 1fr; gap: 4px 12px; } .ogrid dt { color: var(--muted); } .ogrid dd { margin: 0; }
.oacts .btn { padding: 6px 12px; border: 1px solid var(--line); border-radius: 4px; text-decoration: none; color: var(--fg); background: var(--panel); }
[hidden] { display: none !important; }
.streets label { gap: 8px; padding: 2px 0; }


/* окно входа поверх страницы при истёкшей сессии (минимум; дизайн — отдельным проходом) */
.reauth { position: fixed; inset: 0; background: rgba(0, 0, 0, .5); display: flex; align-items: center; justify-content: center; z-index: 1000; }
.reauth .login { margin: 0; background: var(--panel); padding: 1.5rem; border-radius: 8px; max-width: 22rem; }

.dfilters { display: flex; flex-wrap: wrap; gap: 4px; margin: 6px 0; } .dfilter { padding: 2px 10px; border-radius: 12px; } .dfilter.s1 { background: var(--ok-bg); border-color: #4a9a4a; } .dfilter.s2 { background: var(--err-bg); border-color: #c04a4a; }
.frow { display: flex; gap: 6px; align-items: flex-start; margin: 4px 0; } .f-stems { flex: 1; }
.phrase { color: var(--warn-fg); font-weight: 600; }
.ltable { border-collapse: collapse; width: 100%; } .ltable td { padding: 2px 8px 2px 0; vertical-align: top; } .ltable .pos { color: var(--ok); } .ltable .neg { color: var(--err-fg); } .loy { margin-top: 4px; }
.modal { position: fixed; inset: 0; background: rgba(0, 0, 0, .45); display: flex; align-items: center; justify-content: center; z-index: 2000; }
.modal-box { background: var(--panel); border-radius: 8px; padding: 18px 22px; width: min(440px, 92vw); box-shadow: 0 8px 30px rgba(0, 0, 0, .3); }
.modal-box h3 { margin: 0 0 8px; } .m-text { margin: 0 0 14px; white-space: pre-wrap; } .m-input { width: 100%; margin-bottom: 12px; box-sizing: border-box; } .m-btns { justify-content: flex-end; gap: 8px; }
.modal-box button.danger { background: var(--accent); color: #fff; }

.compbtn { margin-left: 8px; padding: 0 6px; font-size: 12px; background: none; border: 1px solid var(--line); border-radius: 4px; cursor: pointer; color: var(--accent); }
.compbox { font-size: 13px; margin-top: 4px; padding: 4px 8px; background: var(--soft); border-radius: 4px; cursor: default; }
ul.comp { margin: 0; padding-left: 16px; list-style: disc; } ul.comp ul.comp { margin-top: 0; }
.results .compbox { flex-basis: 100%; }

/* настройки: панель несохранённых изменений, группы фильтров */
.savebar { position: sticky; bottom: 0; z-index: 20; display: flex; gap: 12px; align-items: center; justify-content: space-between; margin: 12px -12px -12px; padding: 10px 12px; background: var(--cb-fff7e0); border-top: 2px solid #e0b030; border-radius: 0 0 6px 6px; }
.savebar[hidden] { display: none; } .savebar .sb-msg.ok { color: var(--cf-1a7a1a); } .savebar .sb-msg.error { color: var(--cf-b00020); } .savebar .sb-msg.warn { font-weight: 600; }
.frow-g { display: grid; gap: 6px; padding: 8px; border: 1px solid var(--line); border-radius: 6px; margin-bottom: 8px; }
.chips { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; } .chip { display: inline-flex; gap: 4px; align-items: center; padding: 1px 4px 1px 8px; border: 1px solid var(--line); border-radius: 12px; background: var(--cb-f4f6f8); }
.chip .chip-x { padding: 0 6px; border: 0; background: none; cursor: pointer; } .chip.g { padding: 1px 8px; cursor: pointer; }
@supports (field-sizing: content) { textarea { field-sizing: content; overflow: hidden; } }

.coupons { margin: 8px 0; }
.cp-btn { padding: 4px 10px; } .cp-btn.cp-empty { opacity: .6; } .cp-phrase { margin: 0 0 0 6px; font-size: 13px; }
.cp-card { border: 2px solid var(--accent); border-radius: 8px; padding: 8px 12px; margin: 8px 0; background: var(--cb-fff8f8); } .cp-code { font: 700 30px/1.2 ui-monospace, Menlo, Consolas, monospace; letter-spacing: 2px; user-select: all; }
.cpbanner { background: #ffd23f; border-bottom: 1px solid #c9a000; padding: 8px 16px; font-size: 14px; }
.fsbranch { border-top: 1px solid var(--line); padding-top: 8px; margin-top: 8px; }
.fsxml { max-height: 420px; overflow: auto; background: var(--soft); padding: 8px; font-size: 12px; white-space: pre-wrap; word-break: break-all; }
.fsxml[hidden], .fsmenu[hidden] { display: none; }

/* ===== общая шапка (одна на всех экранах): полосы, статус линии, звонок, вкладки, пропущенные, кнопки звонков ===== */
.phonebar { position: sticky; top: 0; z-index: 30; background: var(--panel); border-bottom: 1px solid var(--card-line); }
.sh-bar { display: flex; gap: 12px; align-items: center; min-height: 30px; padding: 4px 14px; background: var(--accent); color: #fff; font-size: 13px; font-weight: 600; border-bottom: 1px solid #fff; }
.sh-bar.warn { background: var(--bar-bg); color: var(--warn-fg); border-bottom: 1px solid var(--bar-line); } .sh-bar .grow { flex: 1; }
.sh-bar button { height: 24px; padding: 0 10px; font-size: 12px; border-radius: var(--r-ctl); } .sh-bar button.x { border: 0; background: none; color: inherit; font-size: 16px; padding: 0 6px; }
.sh-top { display: flex; align-items: center; gap: 12px; height: var(--h-head); padding: 0 14px; background: var(--panel); position: relative; }
.sh-line { display: flex; align-items: center; gap: 8px; font-weight: 600; white-space: nowrap; flex: none; }
.sh-dot { width: 9px; height: 9px; border-radius: 50%; background: #9c9389; } .sh-dot.ok { background: var(--ok); } .sh-dot.bad { background: var(--accent); } .sh-dot.pause { background: #d99a00; }
.sh-btn { display: inline-flex; align-items: center; justify-content: center; height: var(--h-small); padding: 0 12px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--panel); color: var(--fg); font-size: 13px; font-weight: 500; white-space: nowrap; cursor: pointer; }
.sh-btn.ok { background: var(--ok); border-color: var(--ok); color: #fff; font-weight: 600; } .sh-btn.dng { color: var(--accent); border-color: var(--err-line); font-weight: 600; }
.sh-btn.quiet { border-color: transparent; background: none; color: var(--muted); padding: 0 4px; } .sh-btn.quiet:disabled { opacity: .45; }
.sh-hint { font-size: 12px; font-weight: 400; color: var(--muted); }
.sh-call { display: flex; align-items: center; gap: 8px; flex: none; height: 42px; padding: 0 6px 0 10px; border: 1px solid var(--line); border-radius: var(--r-card); background: var(--soft); }
.sh-call.ring { border-color: #6fc08f; background: var(--ok-bg); box-shadow: 0 0 0 2px var(--cl-bfe3cd); } .sh-call.talk { border-color: var(--cl-a9c7f2); background: var(--cb-eef4ff); }
.sh-who { display: grid; line-height: 1.15; } .sh-who b { font-size: 14px; font-weight: 600; white-space: nowrap; } .sh-who small { font-size: 11px; color: var(--muted); white-space: nowrap; }
.sh-tabs { display: flex; align-items: center; gap: 8px; min-width: 0; flex: 0 1 auto; overflow: hidden; padding-left: 12px; border-left: 1px solid var(--hair); }
.sh-tab { display: inline-flex; align-items: center; gap: 4px; flex: none; height: var(--h-field); border: 1px solid var(--card-line); border-radius: var(--r-ctl); background: var(--panel); color: var(--fg); font-weight: 500; white-space: nowrap; }
.sh-tab > a, .sh-tab > button.sh-open { display: inline-flex; align-items: center; height: 100%; padding: 0 12px; color: inherit; text-decoration: none; border: 0; background: none; font: inherit; cursor: pointer; }
.sh-tab > a:has(+ .x), .sh-tab > button.sh-open { padding-right: 4px; } .sh-tab .x { border: 0; background: none; padding: 0 9px 0 2px; color: var(--muted); font-size: 15px; cursor: pointer; line-height: 1; }
.sh-tab.on { background: var(--ink); border-color: var(--ink); color: var(--on-ink); font-weight: 600; } .sh-tab.on .x { color: #d9d2c8; }
.sh-tab.draft { background: var(--bar-bg); border-color: var(--bar-line); }
.sh-link { display: inline-flex; align-items: center; gap: 6px; flex: none; height: var(--h-field); padding: 0 6px; color: var(--fg); text-decoration: none; font-weight: 500; white-space: nowrap; background: none; border: 0; cursor: pointer; }
.sh-link.on { font-weight: 700; box-shadow: inset 0 -2px 0 var(--fg); }
.sh-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 22px; height: 20px; padding: 0 7px; border-radius: var(--r-pill); background: var(--accent); color: #fff; font-size: 12px; font-weight: 600; }
.sh-badge.soft { background: var(--st-wait-bg); color: var(--muted); }
.sh-site { display: inline-flex; align-items: center; flex: none; height: var(--h-field); border-radius: var(--r-ctl); background: var(--site-bg); color: var(--site-fg); font-weight: 600; white-space: nowrap; }
.sh-site .sb-open { height: 100%; padding: 0 4px 0 12px; border: 0; background: none; font: inherit; color: inherit; cursor: pointer; } .sh-site .sb-x { padding: 0 11px 0 4px; border: 0; background: none; font: inherit; color: inherit; cursor: pointer; }
.sh-right { display: flex; align-items: center; gap: 6px; margin-left: auto; flex: none; }
.sh-right .sep { width: 1px; height: 22px; background: var(--hair); margin: 0 6px; }
.sh-pop { position: absolute; z-index: 40; background: var(--panel); border: 1px solid var(--card-line); border-radius: var(--r-card); box-shadow: 0 8px 24px rgba(31, 27, 23, .16); overflow: hidden auto; max-height: min(calc(var(--vh, 100vh) * .7), 640px); }
.sh-pop .item { display: flex; align-items: center; gap: 8px; width: 100%; padding: 8px 14px; border: 0; border-bottom: 1px solid var(--hair); border-radius: 0; background: var(--panel); text-align: left; font: inherit; cursor: pointer; color: var(--fg); text-decoration: none; }
.sh-pop .item:hover { background: var(--soft); } .sh-pop .item:last-child { border-bottom: 0; } .sh-pop .item .grow { flex: 1; min-width: 0; } .sh-pop .item small { display: block; color: var(--muted); font-size: 12px; }
.sh-pop .pop-head { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-bottom: 1px solid var(--hair); font-weight: 600; } .sh-pop .pop-head small { margin-left: auto; font-weight: 400; color: var(--muted); font-size: 12px; }
.sh-pop .item:disabled { opacity: .5; cursor: default; }
.sh-strip { display: flex; align-items: center; gap: 10px; height: var(--h-strip); padding: 0 14px; background: var(--soft); border-top: 1px solid var(--hair); position: relative; }
.sh-miss { display: flex; align-items: center; gap: 6px; min-width: 0; flex: 1 1 0; overflow: hidden; }
.sh-strip .lbl { font-size: 13px; color: var(--muted); white-space: nowrap; flex: none; }
.ph-miss { display: inline-flex; align-items: center; gap: 6px; flex: none; height: var(--h-small); padding: 0 6px 0 10px; border: 1px solid var(--err-line); border-radius: var(--r-pill); background: var(--err-bg); color: var(--err-fg); font-size: 13px; font-weight: 600; white-space: nowrap; cursor: pointer; }
.ph-miss span { font-weight: 400; color: var(--muted); } .ph-miss:disabled { opacity: .5; cursor: default; } .ph-miss .sh-badge { height: 18px; min-width: 18px; padding: 0 6px; font-size: 11px; }
.ph-more { display: inline-flex; align-items: center; flex: none; height: var(--h-small); padding: 0 12px; border: 1px solid var(--line); border-radius: var(--r-pill); background: var(--panel); font-size: 13px; font-weight: 500; cursor: pointer; }
.sh-dials { display: flex; align-items: center; gap: 8px; flex: none; }
button.dial { display: inline-flex; align-items: center; gap: 7px; height: var(--h-small); padding: 0 12px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--panel); color: var(--fg); font-size: 13px; font-weight: 500; white-space: nowrap; cursor: pointer; }
button.dial i { width: 8px; height: 8px; border-radius: 50%; background: #888; } button.dial small { font-size: 10px; color: var(--muted); }
.ph-badge-hot { animation: sh-pulse 1.2s ease-in-out infinite; } @keyframes sh-pulse { 50% { box-shadow: 0 0 0 4px var(--cl-bfe3cd); } }
.sh-menu-wrap { position: relative; }
.sh-tab.plain { border-color: transparent; background: none; } .sh-tab.plain > a { gap: 8px; } .sh-tab.plain.cur > a { font-weight: 700; box-shadow: inset 0 -2px 0 var(--fg); }
.sh-tab.plain.cur { border-radius: 0; }

/* ===== экран заказа (макеты 01, 02, 06, 08): сетка 740 | 600 | остальное, страница не прокручивается ===== */
body.fit { height: var(--vh, 100vh); overflow: hidden; display: flex; flex-direction: column; }
body.fit #phone { flex: none; } body.fit #app { flex: 1; min-height: 0; display: flex; flex-direction: column; }
.ns { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(0, 740px) minmax(0, 600px) minmax(0, 1fr); gap: var(--gap); padding: var(--gap); }
.ns .col { display: flex; flex-direction: column; gap: var(--gap); min-height: 0; min-width: 0; }
.ns .panel { flex: none; position: relative; background: var(--panel); border: 1px solid var(--card-line); border-radius: var(--r-card); padding: 14px; min-width: 0; overflow-wrap: anywhere; }
.ns .panel.grow { flex: 1 1 0; min-height: 0; display: flex; flex-direction: column; }
.ns .scroll { overflow: auto; min-height: 0; flex: 1 1 0; scrollbar-gutter: stable; }
.ns h2 { margin: 0; font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--st-wait-fg); }
.ns .hd { display: flex; align-items: center; gap: 10px; min-height: var(--h-small); margin-bottom: 8px; } .ns .hd .sp, .ns .sp { flex: 1; }
.ns input, .ns select, .ns textarea { height: var(--h-field); padding: 0 10px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--panel); color: var(--fg); min-width: 0; }
.ns input[type=checkbox], .ns input[type=radio] { height: auto; padding: 0; }
.ns select { padding-right: 24px; }
.ns input::placeholder { color: #8d847a; } .ns input:focus, .ns select:focus { outline: 2px solid var(--ink); outline-offset: -1px; }
.ns button { border-radius: var(--r-ctl); }
.ns .f { display: grid; gap: 3px; min-width: 0; align-content: start; } .ns .f > span { font-size: 12px; color: var(--muted); } .ns .f input, .ns .f select { width: 100%; }
.ns .btn-s, .ns button.btn-s { height: var(--h-small); padding: 0 12px; border: 1px solid var(--line); background: var(--panel); color: var(--fg); font-size: 13px; font-weight: 500; white-space: nowrap; }
.ns .btn-s.danger { color: var(--accent); border-color: var(--err-line); }
button.btn-s.btn-call, .ns button.btn-s.btn-call { background: var(--ok); border-color: var(--ok); color: #fff; font-weight: 600; } button.btn-s.btn-call:hover:not(:disabled) { background: #186332; }
.ns .btn-l { height: var(--h-field); padding: 0 16px; border: 1px solid var(--line); background: var(--panel); color: var(--fg); font-weight: 500; white-space: nowrap; }
.ns button.primary, .bottom button.primary { background: var(--accent); border-color: var(--accent); color: #fff; font-weight: 600; }
.ns button.link, .bottom button.link { border: 0; background: none; color: var(--accent); text-decoration: underline; padding: 0; height: auto; font-size: 13px; }
.ns button.danger.solid { background: var(--accent); border-color: var(--accent); color: #fff; font-weight: 600; height: var(--h-field); padding: 0 14px; }
.ns .pill { display: inline-flex; align-items: center; height: var(--h-small); padding: 0 12px; border: 1px solid var(--line); border-radius: var(--r-pill); background: var(--panel); font-size: 13px; font-weight: 500; white-space: nowrap; }
.ns .pill.soft { background: var(--bg); border-color: var(--card-line); color: var(--muted); cursor: default; } .ns .pill.soft b { color: var(--fg); margin-left: 5px; font-weight: 600; }
.ns .pill.dash { border-style: dashed; }
.ns .muted { margin: 0; }
.ns .seg { display: inline-flex; border: 1px solid var(--line); border-radius: var(--r-ctl); overflow: hidden; background: var(--panel); }
.ns .seg-b { height: 34px; padding: 0 14px; border: 0; border-radius: 0; background: var(--panel); color: var(--fg); font-weight: 500; white-space: nowrap; } .ns .seg-b + .seg-b { border-left: 1px solid var(--line); } .ns .seg-b.on { background: var(--ink); color: var(--on-ink); font-weight: 600; }
.ns .grow { flex: 1; min-width: 0; }

/* клиент */
.ns .client .hd { margin-bottom: 6px; } .ns .client .pill { height: 28px; }
.ns .g-client { display: grid; grid-template-columns: 180px minmax(0, 1fr) minmax(0, 1fr); gap: 10px; } .ns .g-info { display: grid; grid-template-columns: minmax(0, 1fr) 140px; gap: 10px; margin-top: 8px; }
.ns .links { display: flex; align-items: center; gap: 16px; margin-top: 8px; min-height: 20px; } .ns .links .cust-msg { margin-left: auto; font-size: 12px; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .ns .links .poplink { flex: none; white-space: nowrap; } .ns .bl-line { height: 18px; line-height: 18px; margin-top: 2px; font-size: 12px; font-weight: 600; color: var(--err-fg); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ns .poplink.on { font-weight: 600; }
.popcard { position: absolute; z-index: 25; left: 14px; right: 14px; top: calc(100% - 4px); background: var(--panel); border: 1px solid var(--card-line); border-radius: var(--r-card); box-shadow: 0 8px 24px rgba(31, 27, 23, .16); padding: 12px 14px; max-height: 420px; overflow: auto; }
.popcard .pop-h { display: flex; align-items: baseline; gap: 10px; margin-bottom: 6px; } .popcard .sp { flex: 1; }
.popcard .ltable { font-size: 13px; } .popcard .ltable th { text-align: left; font-size: 12px; font-weight: 400; color: var(--muted); padding: 4px 12px 4px 0; border-bottom: 1px solid var(--hair); } .popcard .ltable td { padding: 6px 12px 6px 0; border-bottom: 1px solid var(--hair); } .popcard .ltable .pos { color: var(--ok-fg); font-weight: 600; } .popcard .ltable .neg { color: var(--err-fg); font-weight: 600; } .popcard .ltable .code { font-weight: 700; } .popcard .ltable td:first-child, .popcard .ltable td.num { white-space: nowrap; }
.popcard .bl-row { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; } .popcard .bl-row:last-of-type { margin-bottom: 0; }

/* заказ: поиск, фильтры, корзина */
.ns .order { padding-bottom: 12px; }
.ns .searchbox { position: relative; flex: none; } .ns .search { width: 100%; height: 40px; font-size: 15px; border: 1.5px solid var(--ink); border-radius: var(--r-ctl); } .ns .search.replacing { border-color: var(--accent); }
.ns .sfwrap { position: relative; flex: none; } .ns .results { top: 100%; left: 0; right: 0; border-radius: var(--r-ctl); border-color: var(--card-line); z-index: 24; max-height: 360px; }
.ns .results li.cur, .ns .results li:hover { background: var(--bg); }
.ns .dfilters { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin: 10px 0 8px; flex: none; } .ns .dfilters .lbl { font-size: 12px; color: var(--muted); }
.ns .dfilter { cursor: pointer; } .ns .dfilter.s1 { background: var(--ok-bg); border-color: #8fd0a9; color: var(--ok-fg); } .ns .dfilter.s2 { background: var(--err-bg); border-color: var(--err-line); color: var(--err-fg); }
.ns .cart-head, .ns .line { display: grid; grid-template-columns: minmax(0, 1fr) 90px 150px 70px 92px 28px; gap: 8px; align-items: center; }
.ns .cart-head { flex: none; font-size: 12px; color: var(--muted); padding: 0 0 6px; border-bottom: 1px solid var(--hair); margin-right: 14px; } .ns .cart-head .c { text-align: center; } .ns .cart-head .r { text-align: right; }
.ns .cart-scroll { margin-top: 2px; } .ns .cart { display: block; }
.ns .line { padding: 9px 0; border-bottom: 1px solid var(--hair); margin-right: 4px; align-items: center; }
.ns .line.bad { background: var(--err-bg); outline: 0; border-radius: 6px; padding-left: 6px; padding-right: 6px; }
.ns .line .name { display: flex; align-items: center; gap: 8px; min-width: 0; font-weight: 500; } .ns .line .tg, .ns .line .tg-s { flex: none; width: 24px; height: 24px; } .ns .line .tg { border: 0; background: var(--bg); color: var(--muted); padding: 0; font-size: 11px; border-radius: 6px; }
.ns .line .qty { display: flex; align-items: center; gap: 4px; justify-content: center; } .ns .line .qty button { flex: none; width: 28px; height: 28px; padding: 0; border: 1px solid var(--line); background: var(--panel); font-size: 15px; line-height: 1; }
.ns .line .amt { width: 28px; height: 28px; border: 0; padding: 0; text-align: center; background: none; -moz-appearance: textfield; } .ns .line .amt::-webkit-inner-spin-button { display: none; }
.ns .line .lcomment { width: 100%; height: 30px; font-size: 13px; } .ns .line .price { text-align: right; color: var(--muted); } .ns .line .sum { text-align: right; font-weight: 700; }
.ns .line .del { width: 28px; height: 28px; padding: 0; border: 1px solid var(--err-line); background: var(--err-bg); color: var(--accent); font-size: 15px; }
.ns .line > .sub, .ns .line > .comp-line, .ns .line > .mods, .ns .line > .mod-sum { grid-column: 1 / -1; }
.ns .line .sub { display: flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 600; color: var(--err-fg); } .ns .line .sub .ghost { height: 30px; padding: 0 12px; border: 1px solid var(--line); background: var(--panel); color: var(--fg); font-weight: 500; font-size: 13px; margin: 0; }
.ns .comp-line { font-size: 12px; color: var(--muted); padding-left: 32px; }
.ns .comp-line { display: block; width: 100%; text-align: left; background: none; border: 0; padding: 2px 0 2px 32px; cursor: pointer; font: inherit; font-size: 12px; color: var(--muted); } .ns .comp-line:hover { color: var(--accent); text-decoration: underline dotted; }
.ns .comp-line.ro-comp { width: auto; padding-left: 0; color: var(--accent); } div.comp-line { cursor: default; }
.comp-link { background: none; border: 0; padding: 0; font: inherit; color: var(--accent); cursor: pointer; text-decoration: none; } .comp-all { font-weight: 600; }
.modal-box.wide { width: min(980px, 96vw); } .sv { display: grid; gap: 10px; max-height: 75vh; overflow: auto; margin-bottom: 14px; }
.sv-row { padding: 8px 12px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); }
.sv-name { font-weight: 700; margin-bottom: 2px; } .sv-items { margin: 0; line-height: 1.5; } .sv-all { color: var(--muted); }
.ns .mod-sum { font-size: 12px; color: var(--muted); padding-left: 32px; }
.ns .mods { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; padding: 8px 10px; border: 1px dashed var(--line); border-radius: var(--r-ctl); background: var(--cb-fbf9f6); margin-top: 2px; }
.ns .mods .mg { font-size: 12px; color: var(--muted); margin: 0 2px 0 4px; } .ns .mods .mod-p { cursor: pointer; } .ns .mods .mod-p.on { background: var(--ink); border-color: var(--ink); color: var(--on-ink); }
.ns .mods-ok { margin-left: auto; height: 30px; padding: 0 18px; background: var(--ink); border: 0; color: var(--on-ink); font-weight: 600; }
.ns .empty { padding: 24px 0; text-align: center; }
.ns .kit { flex: none; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; margin-top: 8px; padding: 6px 10px; border-radius: var(--r-ctl); background: var(--bg); font-size: 13px; }
.ns .kit .lbl { color: var(--muted); } .ns .kit.warn { background: var(--warn-bg); box-shadow: inset 3px 0 0 #e8a33d; } .ns .kit .kit-un { color: var(--warn-fg); font-size: 12px; }
.ns .cmt-order { flex: none; margin-top: 10px; } .ns .cmt-order input { height: var(--h-small); }
.ns .cmt-hd { flex: none; display: flex; flex-wrap: nowrap; align-items: center; gap: 4px 12px; margin-top: 8px; min-height: 26px; } .ns .cmt-hd .cmt-lbl { flex: none; font-size: 12px; color: var(--muted); cursor: text; }
.ns .cmt-hd .kit { flex: 0 1 auto; min-width: 0; margin: 0 0 0 auto; padding: 3px 10px; } .ns .cmt-hd + .cmt-row { margin-top: 4px; }
.results .compbox, .compbox { font-size: 13px; margin-top: 4px; padding: 4px 8px; background: var(--soft); border-radius: 4px; cursor: default; }

/* время */
.ns .time { padding: 12px 14px; } .ns .t-top { display: flex; align-items: center; gap: 12px; } .ns .t-top h2 { margin-right: 2px; }
.ns .bigtime { font-size: 20px; font-weight: 700; letter-spacing: -.01em; white-space: nowrap; display: flex; align-items: center; gap: 6px; }
.ns .bigin { width: 96px; height: 34px; border: 1px solid transparent; font-size: 20px; font-weight: 700; padding: 0 4px; background: none; } .ns .bigin:hover { border-color: var(--line); }
.ns .t-waits { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin-top: 8px; font-size: 13px; } .ns .lbl { font-size: 12px; color: var(--muted); }
.ns .chip-w { display: inline-flex; align-items: center; height: 24px; padding: 0 9px; border-radius: 6px; background: var(--st-wait-bg); color: var(--st-wait-fg); font-size: 12px; font-weight: 600; } .ns .chip-w.on { background: var(--ink); color: var(--on-ink); }
.ns .t-quick { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; margin-top: 8px; } .ns .t-quick .pill { height: 26px; padding: 0 10px; font-size: 12px; cursor: pointer; }
.ns .t-pre { display: flex; align-items: center; gap: 8px; margin-top: 10px; } .ns .t-date { width: 130px; } .ns .t-time { width: 90px; }

/* доставка */
.ns .dlv .hd select { width: auto; min-width: 150px; } .ns .dlv .courier { margin: -2px 0 8px; font-size: 13px; }
.ns .addr-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; align-items: center; }
.ns .chip-a { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px; border: 1px solid var(--line); border-radius: var(--r-pill); background: var(--panel); font-size: 13px; font-weight: 500; cursor: pointer; white-space: nowrap; }
.ns .chip-a.on { border-color: var(--accent); background: var(--err-bg); color: var(--err-fg); font-weight: 600; } .ns .chip-a .ed { color: var(--accent); font-size: 12px; }
.ns .more-a { position: relative; } .ns .addr-menu { top: 36px; left: 0; min-width: 220px; } .ns .addr-menu .item { white-space: nowrap; }
.ns .g-addr1 { display: grid; grid-template-columns: 120px minmax(0, 1fr) 60px 60px; gap: 6px; }
/* район — по самому длинному названию (ширина select = ширина самого длинного пункта), подъезд/этаж/кв. — поровну, остальное — домофону */
.ns .g-addr2 { display: grid; grid-template-columns: minmax(0, max-content) 56px 56px 56px minmax(72px, 1fr); gap: 6px; margin-top: 6px; }
.ns .g-addr2 .f:first-child select { width: auto; max-width: 100%; }
.ns .g-addr3 { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px; margin-top: 6px; align-items: end; }
.ns .address input:not([type=checkbox]), .ns .address select { height: 32px; } .ns .address .f > span { height: 16px; line-height: 16px; } .ns .address .free input { margin: 0; } .ns .address .in-entrance, .ns .address .in-floor, .ns .address .in-flat { padding: 0 6px; text-align: center; }
.ns .split { display: flex; justify-content: space-between; align-items: center; } .ns .free { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: var(--muted); cursor: pointer; }
.ns .ac { position: relative; } .ns .addr-note { margin-top: 6px; font-size: 12px; } .ns .addr-note .muted, .ns .addr-note .error { margin: 0; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

/* подсказки */
.ns .hints { display: flex; flex-direction: column; gap: 2px; }
.hint-row { display: flex; align-items: center; gap: 10px; min-height: 34px; padding: 3px 8px; border-radius: var(--r-ctl); }
.hint-row.ok { background: var(--ok-bg); } .hint-row.warn { background: var(--warn-bg); } .hint-row.err { background: var(--err-bg); color: var(--err-fg); }
.hint-row .tag { flex: none; width: 98px; text-align: center; padding: 4px 6px; border-radius: 6px; font-size: 11px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; background: var(--st-wait-bg); color: var(--st-wait-fg); white-space: nowrap; }
.hint-row .tag.t-long { font-size: 9.5px; letter-spacing: .02em; padding: 4px 3px; }  /* «Ролл месяца» — в одну строку */
.tag.t-ok { background: var(--st-done-bg); color: var(--st-done-fg); } .tag.t-promo-a { background: var(--err-bg); color: var(--err-fg); } .tag.t-warn { background: var(--st-cook-bg); color: var(--st-cook-fg); } .tag.t-promo { background: var(--st-pre-bg); color: var(--st-pre-fg); }
.hint-row .ht { font-weight: 500; } .hint-row .hs { font-size: 12px; color: var(--muted); } .hint-row .ha { flex: none; } .hint-row .btns { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; } .hint-row .added { color: var(--ok-fg); font-size: 13px; }
.hint-row .btn-s { height: 28px; } .hint-row .hs { line-height: 1.3; }
.ns .coupons { margin: 0; } .ns .cp-row { padding-left: 8px; } .ns .cp-row select { max-width: 190px; } .ns .cp-phrase { padding: 2px 8px; font-size: 12px; }
.ns .cp-btn { height: var(--h-small); padding: 0 14px; border: 1px solid var(--line); background: var(--panel); font-weight: 500; }
.ns .cp-card { position: relative; border: 1.5px solid var(--accent); border-radius: var(--r-card); padding: 10px 14px; margin: 8px 0 0; background: var(--panel); } .ns .cp-card .cp-x { position: absolute; right: 12px; top: 8px; color: var(--muted); text-decoration: none; font-size: 16px; }
.ns .cp-code { font: 700 28px/1.2 ui-monospace, Menlo, Consolas, monospace; letter-spacing: 2px; user-select: all; } .ns .cp-card .row { display: flex; gap: 8px; margin-top: 8px; } .ns .cp-card .row button { height: 32px; padding: 0 14px; }

/* история */
.ns .hist-panel .hd { margin-bottom: 6px; } .ns .hist-hd { cursor: pointer; user-select: none; } .ns .hist-hd:hover .fold-b, .ns .hist-hd:hover h2 { color: var(--fg); }
.ns .hist-panel.folded, .ns .r-top > .panel.hist-panel.folded { flex: none; min-height: 0; } .ns .hist-panel.folded .hd { margin-bottom: 0; } .ns .hist-sum { font-size: 12px; } .ns .fold-b { border: 0; background: none; padding: 0 4px; color: var(--muted); font-size: 12px; }
.ns .hist { display: flex; flex-direction: column; gap: 8px; padding-right: 4px; }
.ns .horder { border: 1px solid var(--card-line); border-radius: var(--r-ctl); padding: 10px 12px; cursor: pointer; background: var(--panel); flex: none; } .ns .horder:hover { background: var(--soft); } .ns .horder.harch { cursor: default; } .ns .horder.harch:hover { background: var(--panel); }
.ns .hhead { display: flex; align-items: baseline; gap: 8px; } .ns .hhead .hsum { margin-left: auto; font-size: 15px; } .ns .hsub { font-size: 12px; margin: 2px 0 6px; }
.ns .hitem { display: flex; align-items: center; gap: 8px; padding: 3px 0; } .ns .hitem .plus, .ns .hitem .plus-s { flex: none; width: 24px; height: 24px; padding: 0; } .ns .hitem .plus { border: 1px solid var(--line); background: var(--panel); font-size: 14px; line-height: 1; }
.ns .hacts { display: flex; gap: 14px; margin-top: 6px; }
.ns .hist .hhead + .muted { }

/* оплата */
.ns .pay-panel { padding: 12px 14px; } .ns .pay-promo { display: flex; gap: 8px; } .ns .pay-promo .promo { display: flex; gap: 8px; } .ns .pay-promo input { width: 170px; }
.ns .pay-note { margin-bottom: 6px; } .ns .note { padding: 6px 10px; border-radius: 6px; font-size: 13px; margin-bottom: 4px; } .ns .note.ok { background: var(--ok-bg); color: var(--ok-fg); } .ns .note.warn { background: var(--warn-bg); color: var(--warn-fg); } .ns .note.err { background: var(--err-bg); color: var(--err-fg); } .ns .note.info { background: var(--bg); color: var(--muted); }
.ns .promo-info { font-size: 12px; margin-bottom: 4px; }
.ns .pay { display: flex; align-items: center; gap: 8px; margin-top: 6px; } .ns .pay-type { flex: 1; min-width: 0; } .ns .pay-sum { width: 130px; text-align: right; } .ns .pay-change { width: 100px; }
.ns .pay-acts { flex: none; min-width: 64px; display: flex; gap: 10px; justify-content: flex-end; }
.pay-x { display: flex; align-items: center; gap: 8px; margin-top: 4px; } .pay-x .pd-note { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ns .totals { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin-top: 10px; font-size: 13px; } .ns .tot-l { display: grid; gap: 4px; min-width: 0; } .ns .tot-r { white-space: nowrap; text-align: right; } .ns .tot-r .total { font-size: 22px; font-weight: 700; margin-left: 6px; }
.ns .pay-foot { font-size: 12px; margin: 0; }

/* подвал */
.bottom { flex: none; height: var(--h-foot); display: flex; align-items: center; gap: 10px; padding: 0 12px; background: var(--panel); border-top: 1px solid var(--card-line); }
.bottom .foot-hint, .bottom .foot-msg { font-size: 13px; margin: 0; } .bottom .foot-hint { color: var(--muted); } .bottom .sp { flex: 1; }
.bottom:has(.foot-msg:not(:empty)) .foot-hint { display: none; }
.bottom .btn-l { height: 40px; padding: 0 18px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--panel); font-weight: 500; } .bottom .btn-l.primary { background: var(--accent); border-color: var(--accent); color: #fff; font-weight: 600; padding: 0 22px; }

/* правки по сверке с макетом */
.ns .bigin { width: 78px; } .ns .bigin::-webkit-calendar-picker-indicator { display: none; }
.ns .split { white-space: nowrap; } .ns .free { white-space: nowrap; }
.ns select { padding-left: 8px; padding-right: 22px; }
.ns .search:focus { outline: 0; }
.ns .cart-head { position: sticky; top: 0; z-index: 2; background: var(--panel); margin-right: 4px; padding-top: 2px; }
.ns .mods .pill { height: 28px; padding: 0 10px; font-size: 13px; } .ns .mods-ok { margin-left: auto; width: 52px; padding: 0; }
.ns .line .price { white-space: nowrap; }
.ns .pay-promo .btn-s { height: var(--h-field); }
.ns .mods { gap: 5px; padding: 8px; } .ns .mods .pill { padding: 0 9px; } .ns .mods .mg { margin: 0 0 0 2px; } .ns .mods-ok { width: 44px; }
.hint-row .ht { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .hint-row .grow { overflow: hidden; }
.ns .panel h2, .ns .panel .hd h2 { white-space: nowrap; }
.ns .col.right > .panel:last-child { flex: none; } .ns .r-top { flex: 1 1 0; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; gap: var(--gap); } .ns .r-top > .panel { flex-shrink: 0; } .ns .r-top > .panel.grow { flex-shrink: 1; min-height: 130px; } .ns .hist-panel { min-height: 130px; } .ns .slots .acc-b { max-height: 250px; overflow-y: auto; }
.ns .bigin { border: 0; border-radius: 6px; } .ns .bigin:hover { background: var(--bg); }
.ns .t-say { margin-top: 6px; font-size: 12px; }

/* ===== список заказов (макет 04) ===== */
.orders { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: var(--gap); padding: var(--gap); }
.orders .panel { background: var(--panel); border: 1px solid var(--card-line); border-radius: var(--r-card); padding: 14px; } .orders .panel.grow { flex: 1 1 0; min-height: 0; display: flex; flex-direction: column; }
.orders .scroll { overflow: auto; min-height: 0; flex: 1 1 0; }
.orders input, .orders select { height: var(--h-field); padding: 0 10px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--panel); color: var(--fg); font: inherit; }
.orders .frow1 { display: flex; align-items: center; gap: 10px; } .orders .osearch { flex: 1; min-width: 0; height: 40px; border: 1.5px solid var(--ink); font-size: 14px; } .orders .org-f { width: 170px; } .orders .day-f { width: 140px; } .orders .dayrange { display: flex; align-items: center; gap: 6px; position: relative; } .orders .day-f.bad { border-color: #e5484d; background: var(--err-bg); outline: 1px solid #e5484d; } .orders .day-msg { margin-left: auto; padding: 2px 8px; white-space: nowrap; font-size: 12px; background: var(--err-bg); border: 1px solid #e5484d; border-radius: 4px; } .orders .day-msg:empty { display: none; }
.orders .btn-l { height: var(--h-field); padding: 0 16px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--panel); font-weight: 500; cursor: pointer; } .orders .auto { font-size: 12px; margin: 0; white-space: nowrap; min-width: 118px; }
.orders .seg { display: inline-flex; border: 1px solid var(--line); border-radius: var(--r-ctl); overflow: hidden; background: var(--panel); flex: none; } .orders .seg-b { height: 38px; padding: 0 14px; border: 0; background: var(--panel); color: var(--fg); font: inherit; font-weight: 500; white-space: nowrap; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; } .orders .seg-b + .seg-b { border-left: 1px solid var(--line); } .orders .seg-b.on { background: var(--ink); color: var(--on-ink); font-weight: 600; }
.orders .sh-badge.site { background: var(--site-bg); color: var(--site-fg); box-sizing: border-box; width: 32px; min-width: 32px; padding: 0; } .orders .sh-badge.site.none { visibility: hidden; }
.orders .frow2 { display: flex; align-items: center; gap: 8px; margin-top: 10px; } .orders .spills { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; flex: 1; } .orders .lbl { font-size: 12px; color: var(--muted); }
.orders .sp.s-x .dot { background: var(--muted); } .orders .sp { display: inline-flex; align-items: center; gap: 7px; height: var(--h-small); padding: 0 12px; border: 1px solid var(--line); border-radius: var(--r-pill); background: var(--panel); font: inherit; font-size: 13px; font-weight: 500; cursor: pointer; } .orders .sp.on { background: var(--ink); border-color: var(--ink); color: var(--on-ink); font-weight: 600; } .orders .sp.on .n { color: #d9d2c8; } .orders .sp.on.s-x .dot { background: var(--panel); }
.orders .hidden-by { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: var(--r-ctl); background: var(--cb-fff4d6); color: var(--cf-6b4e00); font-weight: 500; } .orders .hidden-by .btn-show { height: 30px; padding: 0 12px; border: 0; border-radius: var(--r-ctl); background: var(--ink); color: var(--on-ink); font: inherit; font-weight: 600; cursor: pointer; } .orders .sp .n { color: var(--muted); font-weight: 400; display: inline-block; min-width: 3ch; text-align: left; font-variant-numeric: tabular-nums; }
.orders .dot { width: 9px; height: 9px; border-radius: 50%; background: #cfc8bf; } .s-err .dot { background: var(--accent); } .s-cook .dot { background: #e6b800; } .s-done .dot { background: #3aa56a; } .s-way .dot { background: #4a86d9; } .s-pre .dot { background: #8e6fd1; } .s-site .dot { background: #ffd23f; } .s-closed .dot { background: #9c9389; } .s-off .dot { background: var(--cb-e2dcd4); }
.orders .link { border: 0; background: none; color: var(--muted); text-decoration: underline; font: inherit; font-size: 13px; cursor: pointer; padding: 0 4px; }
.orders .legend { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: var(--muted); white-space: nowrap; } .orders .legend .sw { width: 10px; height: 10px; border-radius: 3px; background: var(--warn-bg); }
.orders .opoint h2 { margin: 6px 0 4px; font-size: 13px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; } .orders .opoint h2 .sub { font-weight: 400; text-transform: none; letter-spacing: 0; color: var(--muted); font-size: 13px; }
.orders .opoint h3 { margin: 10px 0 4px; font-size: 14px; font-weight: 600; } .orders .fold { cursor: pointer; user-select: none; }
.orders .otable { width: 100%; border-collapse: collapse; background: var(--panel); font-size: 14px; }
.orders .otable th { position: sticky; top: 0; z-index: 1; background: var(--panel); text-align: left; font-size: 12px; font-weight: 400; color: var(--muted); padding: 6px 8px; border-bottom: 1px solid var(--hair); white-space: nowrap; } .orders .otable th.num { text-align: right; } .orders .otable th.sorted { color: var(--fg); font-weight: 700; }
.orders .otable .sort { border: 0; background: none; padding: 0; font: inherit; color: inherit; cursor: pointer; display: inline-flex; align-items: center; gap: 5px; }
.orders .otable .si { width: 8px; height: 12px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; opacity: 0; transition: opacity .12s; }
.orders .otable .si path { opacity: .3; } .orders .otable .si path.act { opacity: 1; }
.orders .otable th:hover .si, .orders .otable .sort:focus-visible .si { opacity: .7; } .orders .otable th .si.on { opacity: 1; }  /* активная — не бледнеет под курсором */
.orders .otable td { padding: 9px 8px; border-bottom: 1px solid var(--hair); vertical-align: top; } .orders .otable td.no { font-weight: 700; } .orders .otable td.num { text-align: right; white-space: nowrap; font-weight: 700; } .orders .otable td.tm, .orders .otable td.ph { white-space: nowrap; } .orders .otable td.tm .due { font-weight: 700; }
.orders .otable td.cmt { max-width: 340px; font-size: 13px; } .orders .otable tr.orow { cursor: pointer; } .orders .otable tr.orow:hover td { background: var(--soft); }
.orders .otable tr.r-site td { background: var(--row-site); } .orders .otable tr.r-late td { background: var(--row-late); } .orders .otable tr.r-err td { background: var(--row-err); }
.orders .otable tr.r-arch { cursor: default; } .orders .otable tr.r-arch td { color: var(--muted, #666); }
.orders .otable tr.k-closed td, .orders .otable tr.k-off td { color: var(--muted); } .orders .otable tr.k-off td.no, .orders .otable tr.k-off td.tm { text-decoration: line-through; }
.orders .stp { display: inline-block; padding: 3px 9px; border-radius: 6px; font-size: 13px; font-weight: 600; background: var(--st-wait-bg); color: var(--st-wait-fg); white-space: nowrap; }
.stp.s-cook { background: var(--st-cook-bg); color: var(--st-cook-fg); } .stp.s-done { background: var(--st-done-bg); color: var(--st-done-fg); } .stp.s-way { background: var(--st-way-bg); color: var(--st-way-fg); } .stp.s-pre { background: var(--st-pre-bg); color: var(--st-pre-fg); } .stp.s-err { background: var(--st-err-bg); color: var(--st-err-fg); } .stp.s-site { background: var(--st-site-bg); color: var(--st-site-fg); } .stp.s-closed, .stp.s-off { background: var(--bg); color: var(--muted); }
.orders .late { color: var(--accent); font-size: 12px; font-weight: 600; margin-top: 3px; } .orders .ext { font-size: 12px; font-weight: 400; color: var(--muted); }
.cpbanner, .opbanner { background: var(--bar-bg); border-bottom: 1px solid var(--bar-line); color: var(--warn-fg); padding: 8px 14px; font-size: 14px; }
.orders .otable { table-layout: fixed; } .orders .otable th:nth-child(1) { width: 140px; } .orders .otable th:nth-child(2) { width: 150px; } .orders .otable th:nth-child(3) { width: 165px; } .orders .otable th:nth-child(4) { width: 100px; }
.orders .otable th:nth-child(5) { width: 90px; } .orders .otable th:nth-child(6) { width: 150px; } .orders .otable th:nth-child(7) { width: 150px; } .orders .otable th:nth-child(8) { width: 90px; } .orders .otable th:nth-child(9) { width: 110px; } .orders .otable th:nth-child(10) { width: 200px; } .orders .otable th:nth-child(11) { width: 190px; }
.orders .otable td.tb { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }  /* «Принял»: логин оператора */
.orders .otable td { overflow-wrap: break-word; } .orders .otable td.no, .orders .otable td.kd { white-space: nowrap; }
/* блоки точек: точка — карточка, «Открытые»/«Закрытые» — подразделы со сдвигом вправо и чертой слева */
.orders .opoint { border: 1px solid var(--card-line); border-radius: 12px; padding: 6px 14px 12px; margin-bottom: 14px; background: var(--panel); }
.orders .opoint.folded { padding-bottom: 6px; }
.orders .opoint h2 { font-size: 14px; padding-bottom: 6px; border-bottom: 1px solid var(--hair); } .orders .opoint.folded h2 { border-bottom: 0; padding-bottom: 0; }
.orders .opart { margin: 10px 0 0 18px; padding-left: 12px; border-left: 3px solid var(--hair); } .orders .opart.p-open { border-left-color: #e6b800; }
.orders .opart.p-off { border-left-color: #e5c4c2; } .orders .opart.p-off .orow { opacity: .75; }
.orders .who-f { width: 170px; height: 32px; font-size: 13px; } .orders .who-f.on { border-color: var(--ink); font-weight: 600; }
.orders .opart h3 { margin: 4px 0 6px; } .orders .opart > .muted { margin: 0 0 4px; }
/* длинные адрес/комментарий/состав — в одну строку; стрелка в конце строки разворачивает её целиком */
.orders .otable .cl { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden; }
.orders .otable tr.open .cl { display: block; -webkit-line-clamp: unset; }
.orders .otable th.mr { width: 40px; } .orders .otable td.mr { padding: 4px 4px 0 0; text-align: right; }
.orders .otable .more { width: 30px; height: 30px; border: 1px solid var(--hair); border-radius: 8px; background: var(--panel); color: var(--muted); cursor: pointer; font-size: 0; position: relative; }
.orders .otable .more::before { content: ""; position: absolute; left: 10px; top: 8px; width: 8px; height: 8px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg); }
.orders .otable tr.open .more::before { top: 12px; transform: rotate(-135deg); } .orders .otable .more:hover { color: var(--fg); border-color: var(--muted); }

/* готовый заказ (макеты 06–08): состав без полей ввода */
.ns .cart-head.ro, .ns .order.ro .line { grid-template-columns: minmax(0, 1fr) 90px 150px 70px 92px; } .ns .order.ro .line { align-items: start; }
.ns .ro-name { align-items: flex-start; } .ns .ro-note { font-size: 12px; margin-top: 2px; } .ns .qty-ro { text-align: center; color: var(--muted); } .ns .ro-cmt { font-size: 13px; }
.ns .subtotal { flex: none; text-align: right; padding-top: 10px; color: var(--muted); } .ns .subtotal b { color: var(--fg); font-size: 16px; margin-left: 6px; } .ns .small { font-size: 12px; }

/* ===== открытый заказ, агрегатор, заказ сайта (макеты 06–08) ===== */
.viewbar { flex: none; display: flex; align-items: center; gap: 14px; min-height: var(--h-strip); padding: 6px 14px; background: var(--bar-bg); border-bottom: 1px solid var(--bar-line); color: var(--warn-fg); } .viewbar .sp { flex: 1; } .viewbar button.primary { height: 30px; padding: 0 14px; border-radius: var(--r-ctl); }
.ns .kv { display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 8px 12px; align-items: center; margin: 6px 0; } .ns .kv-k { color: var(--muted); font-size: 13px; } .ns .kv-v { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; min-width: 0; }
.ns .kv-site { grid-template-columns: 150px minmax(0, 1fr); gap: 6px 12px; align-items: start; } .ns .kv-site .kv-v { display: block; }
.ns .oacts { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 10px; } .ns .stp { display: inline-block; padding: 3px 10px; border-radius: 6px; font-size: 13px; font-weight: 600; background: var(--st-wait-bg); color: var(--st-wait-fg); }
.ns .late { color: var(--accent); font-size: 12px; font-weight: 600; }
.ns .t-sub { margin-top: 4px; font-size: 12px; }
.ns .g-info1 { margin-top: 8px; } .ns .g-info.g-info3 { grid-template-columns: minmax(0, 1fr) auto 140px; } .ns .acc-panel { padding: 4px 14px; } .ns .acc-panel .scroll { margin: 0 -2px; padding: 0 2px; }
.ns .acc { border-bottom: 1px solid var(--hair); } .ns .acc:last-child { border-bottom: 0; }
.ns .acc-h { display: flex; align-items: center; gap: 10px; width: 100%; min-height: 46px; padding: 0; border: 0; background: none; text-align: left; font: inherit; cursor: pointer; color: var(--fg); }
.ns .acc-t { font-size: 12px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--st-wait-fg); } .ns .acc-s { font-size: 12px; color: var(--muted); } .ns .acc-h .arr { width: 14px; text-align: center; color: var(--muted); }
.ns .acc.off .acc-t { color: #9c9389; } .ns .acc.off .acc-h { cursor: default; } .ns .acc-b { padding: 0 0 14px; }
.ns .addbox { display: grid; gap: 8px; } .ns .addbox .row { display: flex; align-items: center; gap: 8px; margin: 0; } .ns .addbox .row .grow { flex: 1; }
.ns .addres { display: grid; border: 1px solid var(--card-line); border-radius: var(--r-ctl); overflow: hidden; } .ns .addres:empty { display: none; } .ns .addres button.ghost { margin: 0; border: 0; border-bottom: 1px solid var(--hair); border-radius: 0; background: var(--panel); text-align: left; padding: 7px 10px; height: auto; }
.ns .addsel .hitem { display: flex; align-items: center; gap: 8px; padding: 4px 0; } .ns .addsel .hitem span { flex: 1; } .ns .addsel .amt { width: 60px; text-align: center; } .ns .addsel button { width: 28px; padding: 0; }
.ns .addbox button.primary { height: var(--h-field); padding: 0 16px; } .ns .cancel { display: grid; gap: 8px; } .ns .cancel button.danger { height: var(--h-field); justify-self: start; color: #fff; background: var(--accent); border-color: var(--accent); font-weight: 600; padding: 0 16px; }
.ns .rej-row { display: flex; gap: 8px; margin-top: 8px; } .ns .rej-row .btn-s { height: var(--h-field); }
.ns .site-panel .note { margin: 6px 0; }
.bottom .foot-res { display: flex; gap: 8px; flex-wrap: wrap; } .rchip { display: inline-flex; align-items: center; height: 28px; padding: 0 10px; border-radius: 6px; font-size: 13px; font-weight: 500; } .rchip.ok { background: var(--ok-bg); color: var(--ok-fg); } .rchip.err { background: var(--err-bg); color: var(--err-fg); }
.ns .cmt-edit { width: 100%; height: auto; padding: 8px 10px; resize: none; }
.ns [inert] input, .ns [inert] select, .ns [inert] textarea { background: var(--soft); border-color: var(--cl-e6e0d8); color: var(--fg); } .ns select:disabled { background: var(--soft); color: var(--fg); opacity: 1; } .ns .seg-b:disabled { opacity: 1; }
.ns .time[inert] .seg { opacity: .6; }
.ns .bigin::-webkit-inner-spin-button, .ns .bigin::-webkit-clear-button { display: none; -webkit-appearance: none; }

/* ===== журнал звонков (макет 05) ===== */
.jpage { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: var(--gap); padding: var(--gap); }
.jpage .panel { background: var(--panel); border: 1px solid var(--card-line); border-radius: var(--r-card); padding: 14px; } .jpage .panel.grow { flex: 1 1 0; min-height: 0; display: flex; flex-direction: column; } .jpage .scroll { overflow: auto; min-height: 0; flex: 1 1 0; }
.jfilters { display: flex; align-items: center; gap: 12px; } .jfilters .sp { flex: 1; } .jfilters .small, .jpage .small { font-size: 12px; }
.jpage input { height: var(--h-field); padding: 0 10px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--panel); font: inherit; } .jpage .jday { width: 140px; } .jpage .jnum { width: 220px; }
table.calls { width: 100%; border-collapse: collapse; } table.calls th { position: sticky; top: 0; background: var(--panel); text-align: left; font-size: 12px; font-weight: 400; color: var(--muted); padding: 6px 10px; border-bottom: 1px solid var(--hair); }
table.calls td { padding: 8px 10px; border-bottom: 1px solid var(--hair); vertical-align: middle; } table.calls td.no { font-weight: 700; } table.calls tr.missed td { background: var(--row-err); }
.dir { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 50%; background: var(--cb-e8f0fd); color: var(--cf-163e75); font-size: 14px; } .dir.out { background: var(--cb-f1eee9); color: var(--muted); }
.res { display: inline-block; padding: 3px 8px; border-radius: 6px; font-size: 12px; font-weight: 700; background: var(--bg); color: var(--muted); } .res.r-answered { background: var(--ok-bg); color: var(--ok-fg); } .res.r-missed { background: var(--accent); color: #fff; } .res.r-noconnect { background: var(--warn-bg); color: var(--cf-5a3300); } .res.r-blocked { background: var(--ink); color: var(--on-ink); }
.jpage .btn-s { height: var(--h-small); padding: 0 12px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--panel); font: inherit; font-size: 13px; cursor: pointer; } .jpage td.rec audio { height: 36px; vertical-align: middle; }

/* ===== вход и «сессия истекла» (макет 11) ===== */
.login { max-width: 380px; margin: 14vh auto 0; display: grid; gap: 14px; background: var(--panel); border: 1px solid var(--card-line); border-radius: 14px; padding: 28px; box-shadow: 0 10px 30px rgba(31, 27, 23, .12); }
.login h1, .login h2 { margin: 0; font-size: 20px; font-weight: 700; text-transform: none; letter-spacing: 0; color: var(--fg); } .login label { display: grid; gap: 4px; font-size: 12px; color: var(--muted); }
.login input { height: 40px; padding: 0 12px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--panel); font: inherit; font-size: 14px; color: var(--fg); } .login input[readonly] { background: var(--soft); }
.login button[type=submit] { height: 42px; border: 0; border-radius: var(--r-ctl); background: var(--accent); color: #fff; font: inherit; font-weight: 700; cursor: pointer; } .login button.link { border: 0; background: none; color: var(--muted); text-decoration: underline; font: inherit; font-size: 13px; cursor: pointer; justify-self: center; }
.login .muted { margin: 0; font-size: 13px; } .login .error { margin: 0; font-size: 13px; }
.reauth { position: fixed; inset: 0; background: rgba(60, 55, 48, .55); display: flex; align-items: center; justify-content: center; z-index: 1000; } .reauth .login { margin: 0; box-shadow: 0 16px 40px rgba(0, 0, 0, .25); }

/* ===== свои окна (макет 10) ===== */
.modal { background: rgba(60, 55, 48, .55); } .modal-box { border-radius: 12px; padding: 22px 24px; width: min(440px, 92vw); box-shadow: 0 16px 40px rgba(0, 0, 0, .25); }
.modal-box h3 { margin: 0 0 8px; font-size: 17px; font-weight: 700; } .m-text { margin: 0 0 18px; color: var(--muted); font-size: 14px; }
.m-btns { display: flex; justify-content: flex-end; gap: 8px; margin: 0; } .m-btns button { height: 38px; padding: 0 16px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--panel); font: inherit; font-weight: 500; cursor: pointer; }
.m-btns button.danger, .m-btns button.primary { background: var(--accent); border-color: var(--accent); color: #fff; font-weight: 600; } .m-input { height: 38px; padding: 0 12px; border: 1px solid var(--line); border-radius: var(--r-ctl); font: inherit; }

/* ===== настройки (макеты 12–14) ===== */
.settings { display: grid; grid-template-columns: 270px minmax(0, 1400px); gap: 20px; padding: 16px; align-items: start; justify-content: center; }
.settings .snav-wrap { position: sticky; top: calc(var(--shell-h, 92px) + 57px); align-self: start; }  /* под шапкой и вкладками */
.settings .smain [id] { scroll-margin-top: calc(var(--shell-h, 92px) + 57px); }  /* клик в левом меню: заголовок раздела не уходит под вкладки */
.settings .panel { background: var(--panel); border: 1px solid var(--card-line); border-radius: var(--r-card); padding: 16px 22px; margin: 0 0 14px; }
.snav { padding: 14px 14px 10px; } .snav-h { margin: 12px 0 6px 6px; font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); } .snav-h:first-child { margin-top: 2px; }
.snav select { width: 100%; height: 38px; padding: 0 8px; border: 1px solid var(--line); border-radius: var(--r-ctl); margin-bottom: 8px; font: inherit; }
.snav-i { display: flex; align-items: center; width: 100%; height: 36px; padding: 0 10px; border: 0; border-radius: var(--r-ctl); background: none; text-align: left; font: inherit; color: var(--fg); cursor: pointer; } .snav-i:hover { background: var(--bg); } .snav-i.on { background: var(--ink); color: var(--on-ink); font-weight: 600; } .snav-t { margin-left: auto; font-size: 11px; color: var(--muted); } .snav-i.on .snav-t { color: #d9d2c8; }
.settings .smain { min-width: 0; }
.sec-h { display: flex; align-items: baseline; gap: 12px; padding-bottom: 12px; margin-bottom: 4px; border-bottom: 1px solid var(--hair); } .sec-h h2 { margin: 0; font-size: 20px; font-weight: 700; text-transform: none; letter-spacing: 0; color: var(--fg); } .sec-h .small { font-size: 12px; }
.settings .srow { display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: 20px; padding: 14px 0; border-bottom: 1px solid var(--hair); } .settings .srow:last-of-type { border-bottom: 0; }
.settings .slab h3 { margin: 0; font-size: 14px; font-weight: 700; } .settings .slab p.muted { margin: 4px 0 0; font-size: 12px; } .settings .sctl { min-width: 0; display: grid; gap: 8px; align-content: start; }
.settings input:not([type=checkbox]):not([type=radio]):not([type=color]), .settings select, .settings textarea { height: var(--h-field); padding: 0 10px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--panel); font: inherit; color: var(--fg); max-width: 100%; } .settings textarea { height: auto; padding: 8px 10px; min-height: 60px; }
.settings input[type=color] { width: 32px; height: 32px; padding: 2px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); }
.settings button { border-radius: var(--r-ctl); } .settings button.f-add { height: 30px; padding: 0 12px; border: 1px dashed var(--line); background: var(--panel); font-size: 13px; justify-self: start; color: var(--muted); } .settings button.f-del { width: 28px; height: 28px; padding: 0; border: 1px solid var(--err-line); background: var(--err-bg); color: var(--accent); }
.settings button[type=submit], .settings .primary { background: var(--accent); border-color: var(--accent); color: #fff; font-weight: 600; height: var(--h-field); padding: 0 18px; border: 1px solid var(--accent); }
.settings .frow { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 0; } .settings .frow input { min-width: 0; }
.settings .chip { background: var(--bg); border: 1px solid var(--card-line); border-radius: 999px; padding: 2px 6px 2px 12px; } .settings .chip .chip-x { color: var(--muted); }
.settings .ltable { width: 100%; font-size: 13px; border-collapse: collapse; } .settings .ltable th { text-align: left; font-size: 12px; font-weight: 400; color: var(--muted); padding: 6px 8px; border-bottom: 1px solid var(--hair); } .settings .ltable td { padding: 8px; border-bottom: 1px solid var(--hair); vertical-align: middle; } .settings .ltable td.b { font-weight: 700; }
.settings .streets { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px 16px; margin-top: 10px; } .settings .srch { display: flex; align-items: center; gap: 12px; margin: 10px 0; } .settings .srch input { width: 300px; }
.settings .telrow { padding: 8px 0; border-bottom: 1px solid var(--hair); } .settings .telrow .row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 4px 0; }
.settings .hist .row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 8px 0; } .settings .hist .h-log { white-space: pre-wrap; max-height: 220px; overflow: auto; margin: 4px 0 0; } .settings .hist .h-state p { margin: 4px 0; }
.settings .fsbranch { border: 1px solid var(--card-line); border-radius: var(--r-card); padding: 12px 14px; margin: 12px 0; }
.settings .error { color: var(--err-fg); } .settings p.error { background: var(--err-bg); padding: 8px 12px; border-radius: 6px; }
.settings .sform { margin: 0; }
.savebar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 50; margin: 0; padding: 12px 24px; border-radius: 0; border-top: 1px solid var(--bar-line); background: var(--bar-bg); } .savebar .sb-msg { font-size: 14px; } .savebar .sb-msg.warn { font-weight: 600; } .savebar .row { display: flex; gap: 8px; margin: 0; } .savebar .sb-cancel { height: var(--h-field); padding: 0 16px; border: 1px solid var(--line); background: var(--panel); }
.settings .cp-admin { padding: 16px 22px; } .settings .cp-admin .ltable td input[type=text], .settings .cp-admin .cp-phr { width: 100%; }
.settings .gf-admin { padding: 16px 22px; } .gf-tab { border-collapse: collapse; margin: 6px 0 14px; } .gf-tab th, .gf-tab td { padding: 6px 14px 6px 0; text-align: left; vertical-align: top; } .gf-tab tr.cp-off td { opacity: .55; } .gf-tab td:nth-child(2) { min-width: 180px; } .gf-tab .gf-dishes { max-width: 640px; } .gf-many summary { cursor: pointer; } .gf-many .small { margin-top: 4px; } .gf-tab .gf-retry { margin-top: 4px; }
@media (max-width: 1500px) { .settings { grid-template-columns: 240px minmax(0, 1fr); } .settings .srow { grid-template-columns: 240px minmax(0, 1fr); } .settings .streets { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.settings input[type=number] { width: 140px; } .savebar .row { flex-direction: row-reverse; }

/* доставки на время (макеты 01, 02) */
.ns .slots { padding: 4px 14px; } .ns .slots .acc-h { min-height: 46px; } .ns .slots .acc-b { padding: 0 0 12px; } .ns .sl-sub { margin: 0 0 8px; }
.ns .slgrid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; } .ns .slot { display: grid; gap: 2px; justify-items: center; padding: 6px 4px; border: 2px solid transparent; border-radius: var(--r-ctl); background: var(--bg); color: var(--fg); font: inherit; font-size: 12px; cursor: pointer; } .ns .slot b { font-size: 14px; }
.ns .slot.almost { background: var(--st-cook-bg); color: var(--st-cook-fg); } .ns .slot.busy { background: var(--accent); color: #fff; } .ns .slot.sel { border-color: var(--ink); }
.ns .sllegend { display: flex; gap: 14px; margin-top: 10px; font-size: 12px; color: var(--muted); } .ns .sllegend span { display: inline-flex; align-items: center; gap: 5px; } .ns .sllegend .sw { width: 12px; height: 12px; border-radius: 3px; background: var(--bg); border: 1px solid var(--card-line); } .ns .sllegend .sw.almost { background: var(--st-cook-bg); } .ns .sllegend .sw.busy { background: var(--accent); } .ns .sllegend .sw.sel { background: var(--panel); border: 2px solid var(--ink); }
.ns .slot-warn { display: inline-flex; align-items: center; gap: 8px; padding: 4px 10px; border-radius: 6px; background: var(--err-bg); color: var(--err-fg); font-size: 12px; font-weight: 600; } .ns .slot-warn:empty { display: none; }
.ns .bigin { width: 76px; padding: 0; }  /* «ЧЧ:ММ» жирным 20px; шире — шапка «Время» не влезает в строку */
/* настройки: вкладки «Общие | город», копирование из другого города, группы улиц */
.settings .stabs { grid-column: 1 / -1; display: flex; gap: 6px; border-bottom: 1px solid var(--card-line); position: sticky; top: var(--shell-h, 92px); z-index: 15; background: var(--bg); }
.settings .stab { height: 40px; padding: 0 20px; border: 0; border-bottom: 3px solid transparent; border-radius: 0; background: none; font: inherit; font-weight: 600; color: var(--muted); cursor: pointer; }
.settings .stab.on { color: var(--fg); border-bottom-color: var(--accent); }
.settings .sec-h .copy-from { margin-left: auto; height: 30px; padding: 0 12px; border: 1px solid var(--line); background: var(--panel); font-size: 13px; cursor: pointer; } .settings .sec-h .copy-from + .copy-from { margin-left: 0; }
.settings .copy-miss p { margin: 8px 0 0; } .settings .copy-miss ul { margin: 4px 0 0; padding-left: 20px; font-size: 13px; }
.settings .shared-diff p { margin: 6px 0; }
.settings .sgroup { border-top: 1px solid var(--hair); padding: 6px 0; } .settings .sgroup > summary { cursor: pointer; font-size: 15px; padding: 4px 0; } .settings .sgroup .sg-n { color: var(--muted); font-size: 13px; margin-left: 8px; }
.settings .sgroup .sg-note:empty { display: none; }

.settings .sauce-row { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; } .settings .sauce-row .sr-words { flex: 1; min-width: 0; }
.settings .sauce-row .sr-nums { display: flex; gap: 6px; } .settings .sauce-row .sr-n { display: flex; flex-direction: column; font-size: 11px; color: var(--muted); } .settings .sauce-row .sr-n input { width: 78px; }
.settings .sauce-row .sr-skipl { white-space: nowrap; font-size: 13px; } .settings .sauce-row .f-mv { width: 30px; }
.settings .agg-row { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; } .settings .agg-row .agg-name { width: 180px; } .settings .agg-row .agg-keys { flex: 1; min-width: 0; }
/* Окно уже 1536 px: масштаб упирается в 0,8 и экран заказа уже 1920 «дизайнерских» px — колонки делят ширину в тех же пропорциях
   (иначе правая колонка сжимается в полоску и оплата вылезает за окно); шапка «Время» переносит «будет готов к …» на вторую строку */
@media (max-width: 1535px) {
  .ns { grid-template-columns: minmax(0, 740fr) minmax(0, 600fr) minmax(0, 532fr); }
  /* шапка «Время» в одну строку и в узкой средней колонке: без заголовка (режимы и так видны), кнопки и время плотнее */
  .ns .t-top { gap: 8px; } .ns .t-top h2 { display: none; } .ns .t-top .seg-b { padding: 0 10px; }
  .ns .bigtime { font-size: 18px; } .ns .bigin { font-size: 18px; width: 68px; }
}
/* шапка «Время»: кнопки режима не сжимаются (обрезалось «Ко времени»), «будет готов к …» при нехватке места — второй строкой */
.ns .t-top { flex-wrap: wrap; row-gap: 6px; } .ns .t-top .seg { flex: none; }
/* «Мои настройки» оператора */
.me-page { max-width: 760px; margin: 20px auto; padding: 0 16px; }
.me-sec { padding: 20px 24px; } .me-sec .sec-h { display: flex; align-items: baseline; gap: 14px; } .me-sec .sec-h h2 { margin: 0; } .me-sec h3 { margin: 18px 0 4px; }
.me-tones { display: grid; gap: 8px; margin: 12px 0; }
.me-tone { display: flex; align-items: center; gap: 12px; padding: 10px 14px; border: 1px solid var(--line); border-radius: 10px; background: var(--panel); cursor: pointer; }
.me-tone.on { border-color: var(--ink); box-shadow: inset 0 0 0 1px var(--ink); }
.me-name { flex: 1; display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.me-volrow { display: flex; align-items: center; gap: 12px; margin-top: 14px; } .me-vol { width: 260px; } .me-play { flex: none; min-width: 130px; }
.me-msg.ok { color: var(--cf-1f7a3a); }
/* персоны (палочки) под составом заказа */
.ns .pers { flex: none; display: flex; align-items: center; gap: 6px; margin-top: 8px; font-size: 13px; }
.ns .pers .lbl { color: var(--muted); margin-right: 4px; } .ns .pers .pers-n { min-width: 22px; text-align: center; font-size: 15px; }
.ns .pers .qty-b { flex: none; width: 28px; height: 28px; padding: 0; border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--panel); font-size: 15px; line-height: 1; cursor: pointer; }
.ns .pers .qty-b:disabled { opacity: .4; cursor: default; }
/* добавки блюда: панель поверх подсказок — блюдо сверху, группы плитками, «Готово» внизу */
.ns .modbox { position: absolute; inset: 0; z-index: 4; background: var(--panel); border-radius: var(--r-card); display: flex; }
.ns .modp { display: flex; flex-direction: column; flex: 1 1 auto; min-height: 0; padding: 14px; }
.ns .modp-hd { display: flex; gap: 12px; align-items: flex-start; padding-bottom: 10px; border-bottom: 1px solid var(--hair); }
.ns .modp-t { font-size: 17px; font-weight: 700; } .ns .modp-sum { font-size: 17px; white-space: nowrap; }
.ns .modp-body { flex: 1 1 0; min-height: 0; overflow-y: auto; overflow-x: hidden; padding: 8px 2px; }
.ns .mgrp { padding: 8px 0 10px; border-bottom: 1px solid var(--hair); } .ns .mgrp:last-child { border-bottom: 0; }
.ns .mgrp .mg, .ns .mgrp-i .mg { display: flex; gap: 8px; align-items: baseline; margin-bottom: 6px; } .ns .mgrp.need .mg b { color: var(--accent); }
.ns .mgrp .mg-items { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-auto-flow: column; gap: 5px 6px; }
.ns .mgrp .mod-p { display: flex; align-items: center; gap: 6px; min-width: 0; height: auto; min-height: 32px; padding: 3px 8px; border-radius: var(--r-ctl); text-align: left; line-height: 1.15; font-size: 12.5px; }
.ns .mod-p .mp { color: var(--muted); white-space: nowrap; } .ns .mod-p.on { background: var(--ink); border-color: var(--ink); color: var(--on-ink); } .ns .mod-p.on .mp { color: #ddd; }
.ns .modp-ft { display: flex; gap: 12px; align-items: center; justify-content: space-between; padding-top: 10px; border-top: 1px solid var(--hair); }
.ns .modp-ft .mods-ok { margin: 0; width: auto; height: 38px; padding: 0 28px; background: var(--accent); }
.ns .mod-sum.on { color: var(--fg); font-weight: 600; } .ns .mod-sum.on::before { content: "▸ "; color: var(--accent); }
.ns .mgrp-i .mg-items { display: flex; flex-wrap: wrap; gap: 5px; }
/* комментарий к заказу и палочки — одна строка; пустая строка ЧС места не занимает; звонки клиента и слоты — узкие сворачиваемые панели */
.ns .cmt-row { flex: none; display: flex; align-items: flex-end; gap: 16px; margin-top: 8px; } .ns .cmt-row .cmt-order { flex: 0 1 460px; min-width: 0; margin-top: 0; } .ns .cmt-row .pers { margin: 0 0 1px; }
.ns .panel.client { padding-bottom: 22px; } .ns .client > .bl-line { position: absolute; left: 14px; right: 14px; bottom: 3px; margin: 0; }
.ns .slots .acc-h { min-height: 38px; } .ns .calls-b { max-height: 260px; overflow-y: auto; }
.ns .add-pay { align-items: center; } .ns .add-pay .nowrap { white-space: nowrap; } .ns .add-pay .primary { display: grid; justify-items: center; align-content: center; gap: 1px; line-height: 1; padding: 0 16px; min-width: 110px; }
.ns .add-pay .go-sum { font-size: 15px; } .ns .add-pay .go-t { font-size: 11px; font-weight: 500; }
/* настройки: свёрнутый раздел — только заголовок */
.settings .sec > .sec-h { cursor: pointer; } .settings .sec > .sec-h h2::before { content: "▾ "; color: var(--muted); font-weight: 400; }
.settings .sec.folded > .sec-h h2::before { content: "▸ "; } .settings .sec.folded > :not(.sec-h) { display: none; } .settings .sec.folded > .sec-h { border-bottom: 0; padding-bottom: 0; margin-bottom: 0; }
.cp-admin .ltable.hide-off tr.cp-off { display: none; }
.settings .fold-all { display: flex; gap: 10px; padding: 0 0 8px; font-size: 12px; } .settings .fold-all .link { padding: 0; }

/* звонки клиента и плеер записи */
.call-r { border-bottom: 1px solid var(--line); padding: 3px 0; font-size: 13px; }
.call-h { display: grid; grid-template-columns: 16px auto 44px minmax(0, 1fr) 30px; gap: 8px; align-items: center; min-height: 28px; }
.call-dt { white-space: nowrap; } .call-len { white-space: nowrap; text-align: right; } .call-op { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.call-play { width: 28px; height: 26px; padding: 0; border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--panel); cursor: pointer; }
.call-pl { padding: 4px 0 2px; }
.player { display: flex; align-items: center; gap: 6px; min-width: 0; } .player audio { flex: 1; min-width: 0; height: 34px; }
.call-pl .player audio, td.rec .player audio { min-width: 200px; }
.player .rates { display: flex; gap: 2px; flex: none; }
.player .rate { height: 26px; padding: 0 6px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--panel); font: inherit; font-size: 12px; cursor: pointer; }
.player .rate.on { background: var(--accent); border-color: var(--accent); color: #fff; }
.ns .mgrp .mod-p .mn { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; } .ns .mgrp .mod-p .mp { flex: none; margin-left: auto; white-space: nowrap; font-variant-numeric: tabular-nums; opacity: .8; }
.ns .mg-pre { font-size: 12px; } .ns .mg-kind + .mg-kind { margin-top: 8px; } .ns .mg-kt { margin-bottom: 4px; text-transform: uppercase; letter-spacing: .03em; font-size: 11px; }
.mod-p .mn { white-space: normal; }
.mgrp-i .mod-p .mp { margin-left: 4px; }
.cp-btn { flex: none; white-space: nowrap; } .cp-row select { min-width: 0; }
/* открытый заказ: узкая правая колонка — выбор группы и серии на всю ширину, «Выдать» в той же строке */
.acc-panel .cp-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr) auto; gap: 6px; padding: 4px 0; }
.acc-panel .cp-row .tag, .acc-panel .cp-row > .grow { display: none; } .acc-panel .cp-row select { max-width: none; width: 100%; }
.ns .addres button.ghost { display: flex; gap: 10px; align-items: baseline; } .ns .addres button.ghost .ap { flex: none; color: var(--muted); font-variant-numeric: tabular-nums; }
.ns .addres button.ghost.cur, .ns .addres button.ghost:hover { background: var(--bg); }
/* промокоды в настройках: компактная таблица */
.cp-tbl td, .cp-tbl th { padding: 3px 6px; vertical-align: middle; } .cp-tbl td:nth-child(2), .cp-tbl td:nth-child(3) { white-space: nowrap; }
.cp-tbl .cp-phr { width: 100%; min-width: 160px; height: 30px; } .cp-tbl .cp-csvn { height: 30px; } .cp-tbl .cp-csvs { white-space: nowrap; } .cp-tbl .cp-menu { font-size: 12px; }
/* меню сайта: «Не показывать на сайте» */
.fsmenu details > summary { cursor: pointer; padding: 6px 0; font-weight: 500; user-select: none; } .fsmenu details > summary:hover { color: var(--accent); }
.fsmenu details { scroll-margin-top: calc(var(--shell-h, 92px) + 56px); }
.fs-hlist { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 2px 12px; max-height: 420px; overflow-y: auto; margin-top: 8px; padding: 4px; border: 1px solid var(--line); border-radius: var(--r-ctl); }
.fs-hi { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: 8px; align-items: baseline; padding: 4px 6px; border-radius: 4px; cursor: pointer; }
.fs-hi:hover { background: var(--soft); } .fs-hi.on { background: var(--err-bg); } .fs-hi input { grid-row: span 2; align-self: center; }
.fs-hi .fs-hn { overflow-wrap: anywhere; } .fs-hi .fs-hg-n { font-size: 11px; }
/* настройки: переход из меню слева не прячет заголовок раздела под шапкой и вкладками */
.settings .sec, .settings [id] { scroll-margin-top: calc(var(--shell-h, 92px) + 56px); }
/* «Названия добавок» в настройках: таблица по группам, своё название выделено */
.mn-hint { max-width: 900px; margin: 0 0 12px; } .mn-wrap { width: 100%; } .mn-bar { display: flex; gap: 16px; align-items: center; margin-bottom: 10px; } .settings .mn-q { width: 360px; }
.mn-tbl { width: 100%; border-collapse: separate; border-spacing: 0; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.mn-tbl thead th { background: var(--cb-f4f4f4); text-align: left; font-size: 12px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--cf-777); padding: 10px 12px; border-bottom: 1px solid var(--line); }
.mn-tbl td { padding: 3px 12px; border-bottom: 1px solid var(--cl-f1f1f1); vertical-align: middle; } .mn-tbl th:first-child, .mn-tbl td:first-child { width: 46%; }
.mn-tbl .mn-pr { width: 100px; white-space: nowrap; text-align: right; font-variant-numeric: tabular-nums; }
.mn-tbl tr.mn-gh td { background: var(--cb-f9f6f1); padding-top: 8px; padding-bottom: 8px; border-top: 2px solid var(--cl-e4ddd2); } .mn-tbl tbody:first-of-type tr.mn-gh td { border-top: 0; }
.mn-tbl tr.mn-i:hover td { background: var(--cb-fffbf2); } .mn-tbl .mn-full { color: var(--cf-555); }
.settings .mn-tbl input.mn-in:not([type=checkbox]):not([type=radio]) { width: 100%; height: 30px; padding: 0 8px; border: 1px solid transparent; border-radius: 6px; background: transparent; box-shadow: none; }
.settings .mn-tbl input.mn-in:not([type=checkbox]):not([type=radio]):hover { border-color: var(--line); background: var(--panel); } .settings .mn-tbl input.mn-in:not([type=checkbox]):not([type=radio]):focus { border-color: #888; background: var(--panel); outline: none; }
.settings .mn-tbl input.mn-in:not([type=checkbox]):not([type=radio]).own { background: var(--cb-fff1c9); border-color: var(--cl-f0d08a); font-weight: 600; } .settings .mn-tbl tr.mn-gh input.mn-in:not([type=checkbox]):not([type=radio]) { font-weight: 700; }
.settings .mn-tbl input.mn-in:not([type=checkbox]):not([type=radio])::placeholder { color: #aaa; font-style: italic; } .mn-tbl .mn-auto { font-size: 12px; margin-left: 6px; }
/* палочки: − N + сверху, «Без палочек» под ними; не выбрано ни то, ни другое при отправке — красная рамка */
.ns .pers { flex-direction: row; align-items: center; gap: 4px; padding: 3px 6px; border: 1px solid transparent; border-radius: var(--r-ctl); }
.ns .pers .pers-q { display: flex; align-items: center; gap: 6px; } .ns .pers .qty-b { width: 24px; height: 24px; font-size: 14px; }
/* под комментарием: «Без васаби / имбиря / соевого / палочек» — пастельные, нажатая темнее (вкл/выкл) */
.ns .no-row { flex: none; display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.ns .no-b { height: 26px; padding: 0 10px; border: 1px solid var(--line); border-radius: var(--r-pill); background: var(--panel); font-size: 12px; font-weight: 500; cursor: pointer; white-space: nowrap; }
.ns .no-b:disabled { opacity: .4; cursor: default; }
.ns .no-wasabi { background: var(--cb-eaf4e4); border-color: var(--cl-cfe3c4); color: var(--cf-3f6b32); } .ns .no-wasabi.on { background: #8cbf78; border-color: #6fa95a; color: #fff; }
.ns .no-ginger { background: var(--cb-fbe9e6); border-color: var(--cl-f0cdc6); color: var(--cf-9a4335); } .ns .no-ginger.on { background: #d98576; border-color: #c96b5a; color: #fff; }
.ns .no-soy { background: var(--cb-f3ebe2); border-color: var(--cl-e2d3c2); color: var(--cf-6b4a2f); } .ns .no-soy.on { background: #a57c58; border-color: #8c6544; color: #fff; }
.ns .no-chop.on { background: var(--fg, var(--ink)); border-color: var(--fg, var(--ink)); color: #fff; } .ns .no-chop.need { border-color: var(--accent); background: var(--err-bg); color: var(--accent); }
.ns .pers.need { border-color: var(--accent); background: var(--err-bg); } .ns .pers.need .lbl { color: var(--accent); font-weight: 600; }
/* «ПОЗВ» под полем «Домофон» */
.ns .address .pozv { display: inline-flex; align-items: center; justify-content: center; height: 32px; padding: 0 12px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--panel); font-size: 12px; font-weight: 600; letter-spacing: .03em; text-align: center; cursor: pointer; }
.ns .address .pozv:hover { border-color: var(--accent); color: var(--accent); }
.ns .redel-pick .row > button.primary { white-space: nowrap; flex: none; } .ns .redel-addr { margin: 4px 0 8px; }
/* «Не раньше»: нажата — тёмная, как выбранный режим времени */
.ns .time .t-nb { height: 34px; padding: 0 12px; white-space: nowrap; } .ns .time .t-nb.on { background: var(--fg, var(--ink)); border-color: var(--fg, var(--ink)); color: #fff; }

.sc-org { margin-top: 10px; } .sc-rules { display: grid; gap: 10px; margin: 8px 0; }
.sc-rule { border: 1px solid var(--line); border-radius: var(--r-ctl); padding: 10px 12px; display: grid; gap: 8px; }
.sc-rule .frow { flex-wrap: wrap; } .sc-name { width: 260px; } .sc-days { display: inline-flex; gap: 4px; } .sc-d { min-width: 38px; } .sc-d.on { background: var(--fg); color: #fff; border-color: var(--fg); }
.sc-pick { position: relative; max-width: 520px; } .sc-add { width: 100%; height: var(--h-field); padding-left: 32px; border-radius: var(--r-ctl);
  background: var(--panel) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%235f574f' stroke-width='2'%3E%3Ccircle cx='7' cy='7' r='5'/%3E%3Cpath d='m11 11 4 4'/%3E%3C/svg%3E") no-repeat 10px 50%; }
.sc-pop { position: absolute; z-index: 30; left: 0; right: 0; top: calc(100% + 4px); max-height: 360px; overflow: auto; background: var(--panel); border: 1px solid var(--card-line); border-radius: var(--r-card); box-shadow: 0 10px 28px rgba(31,27,23,.14); padding: 4px; }
.sc-pop.up { top: auto; bottom: calc(100% + 4px); }
/* выбор одного блюда (ролл месяца, акции): поле названия + тот же список по категориям; не из меню — жёлтая рамка */
.sc-pick.one { display: inline-block; flex: none; } .sc-pick.one .sc-pop { min-width: 360px; } .sc-pick.one input.miss { border-color: #d9a514; background: var(--cb-fffaf0); }
.p-onl { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; font-size: 13px; } .p-offrow > .sc-pick input, .p-offrow > .p-phrase { opacity: .55; }
.gf-new .sc-pick { flex: 1 1 320px; min-width: 280px; }
.sc-g { display: flex; align-items: center; gap: 6px; position: sticky; top: -4px; background: var(--panel); border-top: 1px solid var(--hair); padding: 2px 0; z-index: 1; } .sc-g:first-child { border-top: 0; }
.settings .sc-gh { flex: 1; display: flex; align-items: center; gap: 8px; border: 0; background: none; text-align: left; padding: 7px 8px; border-radius: 6px; } .settings .sc-gh:hover { background: var(--cb-f6f4f0); }
.sc-gh .chev { width: 12px; color: var(--muted); font-size: 11px; } .sc-cnt { margin-left: auto; font-size: 12px; color: var(--muted); background: var(--bg); border-radius: var(--r-pill); padding: 1px 8px; } .sc-cnt.on { background: var(--fg); color: #fff; }
.settings .sc-gall { flex: none; height: 26px; padding: 0 10px; font-size: 12px; border: 1px dashed var(--line); background: var(--panel); color: var(--muted); border-radius: var(--r-pill); } .settings .sc-gall:hover { color: var(--fg); border-color: var(--fg); }
.settings .sc-gall.on { border-style: solid; color: var(--accent); border-color: var(--err-line); }
.sc-o { display: flex; align-items: center; gap: 8px; padding: 6px 8px 6px 28px; border-radius: 6px; cursor: pointer; font-size: 13px; } .sc-o:hover, .sc-o.cur { background: var(--bg); }
.sc-o .ck { width: 18px; height: 18px; flex: none; display: inline-grid; place-items: center; border: 1px solid var(--line); border-radius: 5px; font-size: 12px; color: #fff; }
.sc-o.on .ck { background: var(--fg); border-color: var(--fg); } .sc-o.on { font-weight: 500; } .sc-none { padding: 10px; color: var(--muted); font-size: 13px; }
.sc-acts { margin-left: auto; display: inline-flex; align-items: center; gap: 12px; } .sc-cpw { position: relative; }
.settings .sc-copy { height: var(--h-small); padding: 0 12px; border: 1px solid var(--line); background: var(--panel); font-size: 13px; }
.sc-cpm { position: absolute; z-index: 30; right: 0; top: calc(100% + 4px); min-width: 220px; background: var(--panel); border: 1px solid var(--card-line); border-radius: var(--r-card); box-shadow: 0 10px 28px rgba(31,27,23,.14); padding: 4px; display: grid; }
.sc-cph { font-size: 12px; color: var(--muted); padding: 6px 10px 4px; } .settings .sc-cpt { border: 0; background: none; text-align: left; padding: 8px 10px; border-radius: 6px; font-weight: 500; } .settings .sc-cpt:hover { background: var(--bg); }
.sc-cpnote { font-size: 13px; } .sc-cpnote:empty { display: none; } .sc-cpnote.ok { color: var(--ok); } .sc-cpnote.warn { color: var(--warn-fg); } .sc-cpnote.error { color: var(--accent); } .sc-items { display: flex; flex-wrap: wrap; gap: 6px; } .sc-item { display: inline-flex; align-items: center; gap: 4px; padding: 3px 4px 3px 10px; border-radius: 14px; background: var(--bg); font-size: 13px; }
.sc-item .x { border: 0; background: none; cursor: pointer; font-size: 15px; line-height: 1; padding: 0 4px; color: var(--muted); } 
/* «Начислить баллы»: сумма (только цифры) + причина + кнопка в одну строку; подтверждение — тёмная кнопка «Точно? Начислить N» */
.client .bonus-pill { display: inline-flex; align-items: center; gap: 4px; }
.client .poplink.tp-plus { width: 20px; height: 20px; margin: 0 -6px 0 4px; padding: 0; border-radius: 50%; border: 1px solid var(--accent); background: var(--panel); color: var(--accent); font-size: 15px; font-weight: 700; line-height: 1; text-decoration: none; display: inline-flex; align-items: center; justify-content: center; }
.client .poplink.tp-plus:hover, .client .poplink.tp-plus.on { background: var(--accent); color: #fff; }
.tp { display: flex; flex-direction: column; gap: 8px; }
.tp .tp-head { margin: 0; font-size: 13px; }
.tp-row { display: flex; align-items: center; gap: 8px; }
.tp-n { display: inline-flex; align-items: center; gap: 6px; flex: none; font-size: 13px; color: var(--muted); }
.tp-n .tp-sum { width: 86px; height: var(--h-field); text-align: right; font-size: 18px; font-weight: 700; font-variant-numeric: tabular-nums; border-radius: var(--r-ctl); }
.tp-row .tp-reason { flex: 1 1 auto; min-width: 0; height: var(--h-field); border-radius: var(--r-ctl); }
.tp-row .tp-go { flex: none; height: var(--h-field); padding: 0 16px; border-radius: var(--r-ctl); white-space: nowrap; }
.tp-row .tp-go.danger { background: var(--ink); border-color: var(--ink); color: var(--on-ink); }
.tp .tp-msg { min-height: 18px; font-size: 13px; margin: 0; } .tp .tp-msg.ok { color: var(--ok); font-weight: 600; }
.tp .tp-recent { margin: 0; line-height: 1.5; }

/* Настройки → Общие → Подсказки оператору */
.hn-tab { border-collapse: collapse; width: 100%; max-width: 900px; } .hn-tab th { text-align: left; font-size: 12px; font-weight: 400; color: var(--muted); padding: 4px 8px; }
.hn-tab td { padding: 6px 8px; border-top: 1px solid var(--hair); vertical-align: top; } .hn-tab td:first-child { width: 300px; } .hn-tab .hn-ph { width: 100%; } .hn-l { display: inline-flex; align-items: center; gap: 4px; cursor: pointer; }
.copy-miss .warn { color: var(--warn-fg); font-weight: 500; } .copy-miss .ok { color: var(--ok-fg); }
.settings .k-line { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin: 0 0 8px; }
.settings .k-chk { display: inline-flex; align-items: center; gap: 4px; }
.settings .k-more { margin: 8px 0; } .settings .k-more summary { cursor: pointer; font-weight: 600; }
.settings .k-warn, .settings .k-extra, .settings .k-busy-extra { width: 4.5em; }
.settings .k-names { width: 260px; height: 72px; } .settings .k-more .k-line { display: inline-flex; vertical-align: top; margin-right: 18px; }

.k-qr { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.k-qr-img { width: 180px; height: 180px; object-fit: contain; background: var(--panel); border: 1px solid var(--cl-d9dee6); border-radius: 8px; }

/* булавка у сворачиваемых разделов нового заказа: серая — не закреплено, яркая — закреплено */
.ns .acc-row { display: flex; align-items: center; gap: 4px; } .ns .acc-row .acc-h { flex: 1; min-width: 0; }
.ns .pin { flex: none; width: 28px; height: 28px; padding: 0; border: 0; border-radius: 6px; background: none; font-size: 14px; line-height: 1; cursor: pointer; filter: grayscale(1); opacity: .35; }
.ns .pin:hover { opacity: .8; background: var(--bg); } .ns .pin.on { filter: none; opacity: 1; background: var(--err-bg); }
/* настройки курьеров: кнопки-переключатели вместо ввода текстом; горит — выбрано */
.settings .k-chips { display: inline-flex; flex-wrap: wrap; gap: 6px; }
.settings .k-chip { height: 32px; padding: 0 12px; border: 1px solid var(--cl-c9c2b8); border-radius: 16px; background: var(--panel); color: var(--fg); font-size: 14px; cursor: pointer; }
.settings .k-chip:hover { border-color: var(--ink); }
.settings .k-chip[aria-pressed="true"] { background: var(--ink); border-color: var(--ink); color: var(--on-ink); font-weight: 600; }
.settings .k-types { display: flex; flex-direction: column; gap: 8px; }
.settings .k-type, .settings .k-trow { display: grid; grid-template-columns: 220px minmax(0, 1fr); align-items: center; gap: 12px; }
.settings .k-type-n { font-weight: 600; overflow-wrap: anywhere; }
/* нижняя плашка «Сохранить» прибита к низу окна — запас снизу, чтобы последний раздел (Кудрово) можно было докрутить и раскрыть */
.settings .smain { padding-bottom: 120px; }

/* Карта курьеров (/couriers и окно «Где курьер»): OpenStreetMap через Leaflet */
.cm-page { flex: 1; min-height: 0; display: grid; grid-template-columns: 360px minmax(0, 1fr); gap: var(--gap); padding: var(--gap); }
.cm-side { display: flex; flex-direction: column; gap: 10px; min-height: 0; overflow: auto; }
.cm-mapbox { padding: 0; overflow: hidden; display: flex; } .cm-map { flex: 1; min-height: 300px; isolation: isolate; }  /* слои Leaflet (z 400+) не лезут поверх меню шапки */
.cm-hd { display: flex; align-items: center; gap: 10px; } .cm-hd h2 { margin: 0; font-size: 16px; } .cm-hd .sp, .cm-row .sp { flex: 1; }
.cm-cities { display: flex; gap: 6px; flex-wrap: wrap; }
.cm-city { height: var(--h-small); padding: 0 12px; border: 1px solid var(--line); border-radius: var(--r-pill); background: var(--panel); color: var(--fg); font: inherit; cursor: pointer; }
.cm-city.on { background: var(--fg); border-color: var(--fg); color: #fff; }
.cm-list { display: flex; flex-direction: column; gap: 8px; }
.cm-c { border: 1px solid var(--card-line); border-radius: var(--r-card); padding: 8px 10px; display: flex; flex-direction: column; gap: 4px; }
.cm-row { display: flex; align-items: center; gap: 8px; }
.cm-who { border: 0; background: none; padding: 0; font: inherit; font-weight: 600; color: var(--fg); cursor: pointer; text-align: left; } .cm-who:disabled { cursor: default; }
.cm-who:hover:not(:disabled) { text-decoration: underline; }
.cm-age.f-old { color: var(--warn-fg); } .cm-age.f-lost, .cm-age.f-none { color: var(--err-fg); }
.cm-ords { margin: 2px 0 0; padding-left: 18px; font-size: 13px; display: flex; flex-direction: column; gap: 2px; }
.cm-dot { display: inline-block; width: 14px; height: 14px; border-radius: 50%; border: 2px solid #fff; box-shadow: 0 0 0 1px rgba(0,0,0,.35); flex: none; }
.cm-dot.f-old { opacity: .65; } .cm-dot.f-lost, .cm-dot.f-none { opacity: .35; }
.cm-pin > span, .cm-ord > span { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }
.leaflet-div-icon.cm-pin, .leaflet-div-icon.cm-ord { background: none; border: 0; }
.cm-pin .cm-dot { width: 18px; height: 18px; }
.cm-name { padding: 1px 6px; border-radius: 6px; background: rgba(255,255,255,.92); font: 600 12px var(--font); color: var(--fg); box-shadow: 0 1px 3px rgba(0,0,0,.3); }
.cm-sq { min-width: 22px; height: 20px; padding: 0 4px; justify-content: center; border: 2px solid; border-radius: 5px; background: var(--panel); font: 600 11px var(--font); color: var(--fg); cursor: pointer; }
.cm-modal { position: fixed; inset: 0; z-index: 1000; background: rgba(0,0,0,.35); display: flex; align-items: center; justify-content: center; }
.cm-box { width: min(1100px, 92vw); height: min(720px, 86vh); display: flex; flex-direction: column; gap: 10px; }
.cm-box .cm-map { border-radius: var(--r-ctl); overflow: hidden; }
/* пропущенный, не дошедший до очереди (ночь, приветствие): серая пометка «мимо очереди» */
.ph-miss .ph-nq, .sh-pop .ph-nq { padding: 1px 6px; border-radius: 6px; background: var(--st-wait-bg); color: var(--st-wait-fg); font-size: 11px; font-weight: 600; }

/* «Сменить курьера» в открытом заказе */
.cpick { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.cpick .error { flex-basis: 100%; margin: 0; }
.cpick-c { display: inline-flex; align-items: center; gap: 6px; }
.cpick-c.cur { opacity: .6; }
.cpick-dot { width: 8px; height: 8px; border-radius: 50%; background: #9ca3af; flex: none; }
.cpick-dot.on { background: #16a34a; }

/* «Перезвонили, не отвечает» — в полоске пропущенных */
.sh-noans { display: flex; align-items: center; gap: 6px; flex: 0 1 auto; min-width: 0; overflow: hidden; }
.ph-na { display: inline-flex; align-items: center; flex: none; }
.ph-miss.na { border-color: var(--line); background: var(--cb-f3f1ee); color: var(--ink, var(--cf-2a2622)); border-radius: var(--r-pill) 0 0 var(--r-pill); }
.ph-na .x { height: var(--h-small); padding: 0 9px; border: 1px solid var(--line); border-left: 0; border-radius: 0 var(--r-pill) var(--r-pill) 0; background: var(--panel); color: var(--muted); cursor: pointer; font-size: 15px; }
.ph-na .x:hover { color: var(--err-fg); }


/* Тёмная тема (theme.js ставит html[data-theme=dark]): те же токены, тёмные значения */
html[data-theme="dark"] {
  color-scheme: dark;
  --bg: #141210; --panel: #1f1c19; --fg: #ece6df; --muted: #a8a096;
  --card-line: #38322c; --hair: #2c2723; --line: #4a423b;
  --accent: #e8364f; --ok: #4cbf75;
  --ok-bg: #173323; --ok-fg: #8fe0ad; --warn-bg: #3a2a10; --warn-fg: #f3c27a; --err-bg: #3b161c; --err-fg: #ff9aa8;
  --site-bg: #ffd23f; --site-fg: #3d2e00; --bar-bg: #3a3112; --bar-line: #6b5a1f;
  --st-wait-bg: #34302b; --st-wait-fg: #ddd6cd; --st-cook-bg: #4a3d0f; --st-cook-fg: #ffe08a; --st-done-bg: #173323; --st-done-fg: #8fe0ad;
  --st-way-bg: #16294a; --st-way-fg: #9cc3ff; --st-pre-bg: #2c2347; --st-pre-fg: #c9b6ff;
  --row-late: #2f2416; --row-err: #33181d; --row-site: #2f2a14;
  --soft: #272320; --soft2: #2c2825; --hover: #3b1d22; --ink: #ece6df; --on-ink: #141210; --err-line: #6b2a35; --field: #26221f;
  --cb-e2dcd4: #453c2f;
  --cb-e8f0fd: #142135;
  --cb-eaf4e4: #263d19;
  --cb-eef4ff: #121d30;
  --cb-f1eee9: #332c20;
  --cb-f3ebe2: #3e2d1a;
  --cb-f3f1ee: #2d2820;
  --cb-f4f4f4: #232323;
  --cb-f4f6f8: #1a2229;
  --cb-f6f4f0: #2d271b;
  --cb-f9f6f1: #302615;
  --cb-fbe9e6: #381a15;
  --cb-fbf9f6: #2b2213;
  --cb-fff1c9: #483d1b;
  --cb-fff4d6: #403518;
  --cb-fff7e0: #393016;
  --cb-fff8f8: #2a1010;
  --cb-fffaf0: #2f2512;
  --cb-fffbf2: #2d2511;
  --cf-163e75: #a0bee7;
  --cf-1a7a1a: #9ae69a;
  --cf-1f7a3a: #97e5ae;
  --cf-2a2622: #e2dfdb;
  --cf-3f6b32: #afd4a4;
  --cf-555: #b7b7b7;
  --cf-5a3300: #f0dcc2;
  --cf-6b4a2f: #d7bba4;
  --cf-6b4e00: #eddeb6;
  --cf-777: #9a9a9a;
  --cf-9a4335: #d2887c;
  --cf-b00020: #e18798;
  --cl-a9c7f2: #314b71;
  --cl-bfe3cd: #306e48;
  --cl-c9c2b8: #63594b;
  --cl-cfe3c4: #466a32;
  --cl-d9dee6: #394457;
  --cl-e2d3c2: #6b5033;
  --cl-e4ddd2: #5d4e38;
  --cl-e6e0d8: #584a38;
  --cl-f0cdc6: #68362c;
  --cl-f0d08a: #7d6635;
  --cl-f1f1f1: #3f3f3f;
}
.settings .n-rule { border: 1px solid var(--line); border-radius: var(--r-ctl); padding: 8px 10px; margin: 0 0 8px; }
.settings .n-rule .n-text, .settings .n-pos, .settings .n-neg { width: 100%; }
.settings .n-ch { margin: 0 0 4px; } .settings .n-ch b { min-width: 120px; } .settings .n-up, .settings .n-down { height: 28px; padding: 0 8px; } .settings .n-ch input.n-ch-lim { width: 70px; margin: 0 4px; }
.settings .n-stats { margin-top: 8px; font-size: 13px; }

/* Отзывы: список обращений слева, переписка справа */
.rv-filters { flex-wrap: wrap; } .rv-filters .rv-q { width: 280px; } .rv-filters select { height: var(--h-field); border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--panel); font: inherit; padding: 0 8px; } .rv-filters label { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.rv-foot { display: flex; align-items: center; gap: 8px; } .rv-ord { font-size: 12px; } .rv-take-i { margin-left: auto; height: 28px; padding: 0 14px; border: 0; border-radius: var(--r-ctl); background: var(--accent); color: #fff; font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; } .rv-take-i:disabled { opacity: .6; }
.rv-state { display: flex; align-items: center; gap: 12px; } .rv-state .rv-take { height: var(--h-small); padding: 0 18px; border: 0; border-radius: var(--r-ctl); background: var(--accent); color: #fff; font: inherit; font-weight: 600; cursor: pointer; }
.rv-body { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr) minmax(340px, 440px); gap: var(--gap); }
.rv-chat { min-height: 0; display: flex; flex-direction: column; gap: 10px; }
.rv-order { min-height: 0; overflow-y: auto; border: 1px solid var(--line); border-radius: var(--r-ctl); padding: 14px 16px; display: flex; flex-direction: column; gap: 6px; align-self: start; max-height: 100%; box-sizing: border-box; }
.rv-oh { display: flex; gap: 10px; align-items: baseline; justify-content: space-between; } .rv-olink { font-size: 20px; font-weight: 700; color: var(--accent); } .rv-okind { font-weight: 600; }
.rv-owhen { color: var(--accent); font-weight: 600; font-size: 13px; } .rv-oclient { font-weight: 500; } .rv-oaddr { font-size: 13px; } .rv-order .small, .rv-ocour, .rv-opay { font-size: 13px; }
.rv-oitems { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); padding: 6px 0; margin-top: 4px; display: flex; flex-direction: column; gap: 6px; }
.rv-oi { display: grid; grid-template-columns: minmax(0, 1fr) auto 76px; gap: 10px; align-items: baseline; font-size: 14px; } .rv-oq { color: var(--muted, #6e6e73); } .rv-os { text-align: right; white-space: nowrap; }
.rv-omods { font-size: 12px; line-height: 1.3; } .rv-ototal { display: flex; justify-content: space-between; font-size: 16px; } .rv-ocmt { border-top: 1px solid var(--line); padding-top: 6px; font-size: 13px; white-space: pre-wrap; }
.rv .rv-cols { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(320px, 420px) minmax(0, 1fr); gap: var(--gap); }
.rv .rv-left, .rv .rv-pane { min-height: 0; display: flex; flex-direction: column; gap: 10px; }
.rv-tabs { display: flex; gap: 6px; } .rv-tab { height: var(--h-small); padding: 0 14px; border: 1px solid var(--line); border-radius: var(--r-pill); background: var(--panel); font: inherit; cursor: pointer; } .rv-tab.on { background: var(--accent); border-color: var(--accent); color: #fff; }
.rv-list { display: flex; flex-direction: column; gap: 6px; }
.rv-item { text-align: left; border: 1px solid var(--line); border-left: 4px solid var(--line); border-radius: var(--r-ctl); background: var(--panel); padding: 8px 10px; font: inherit; cursor: pointer; }
.rv-item.k-negative { border-left-color: #d64545; } .rv-item.k-unclear { border-left-color: #e0a800; } .rv-item.k-again { border-left-color: #4a7bd0; }
.rv-item.on { background: var(--st-wait-bg); } .rv-item.unread .rv-row b::after { content: " •"; color: var(--accent); }
.rv-row { display: flex; gap: 8px; align-items: baseline; } .rv-row b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .rv-kind { font-size: 12px; } .rv-at { margin-left: auto; font-size: 12px; white-space: nowrap; }
.rv-prev { font-size: 13px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; margin: 2px 0; } .rv-who { font-size: 12px; } .rv-free { color: #d64545; }
.rv-head { display: flex; flex-direction: column; gap: 2px; } .rv-name { font-size: 16px; } .rv-state { font-size: 13px; }
.rv-thread { flex: 1 1 0; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; gap: 8px; padding: 4px 0; }
.rv-m { max-width: 75%; padding: 8px 12px; border-radius: 12px; background: var(--st-wait-bg); } .rv-m.out { align-self: flex-end; background: #e6f2ea; } .rv-m.fail { background: #fbe9e9; }
.rv-mt { white-space: pre-wrap; } .rv-mi { font-size: 12px; margin-top: 2px; }
.rv-ph { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; } .rv-ph img { display: block; max-width: 220px; max-height: 220px; border-radius: 6px; object-fit: cover; cursor: zoom-in; }
.rv-reply { display: flex; flex-direction: column; gap: 8px; } .rv-text { width: 100%; box-sizing: border-box; padding: 8px 10px; border: 1px solid var(--line); border-radius: var(--r-ctl); font: inherit; resize: vertical; }
.rv-acts { display: flex; gap: 8px; }
.rv-sys { align-self: center; padding: 2px 0; } .rv-old { display: flex; flex-direction: column; gap: inherit; opacity: .6; } .rv-state .rv-reopen { height: var(--h-small); padding: 0 14px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--panel); color: inherit; font: inherit; cursor: pointer; } .rv-btns { display: flex; gap: 8px; margin-left: auto; }
.rv-acts button { height: var(--h-field); padding: 0 16px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--panel); font: inherit; cursor: pointer; } .rv-acts button.primary { background: var(--accent); border-color: var(--accent); color: #fff; } .rv-acts button:disabled { opacity: .5; cursor: default; }
.rv-none { margin: 12px 0; } .rv-msg { font-size: 13px; } .sh-rev .sh-badge { margin-left: 6px; }
html[data-theme="dark"] .rv-m.out { background: #1f3a2a; } html[data-theme="dark"] .rv-m.fail { background: #45201f; }
.time .t-times { float: right; display: grid; grid-template-columns: max-content max-content; gap: 1px 12px; margin: 6px 0 0 16px; padding-left: 14px; border-left: 1px solid var(--hair); font-size: 12px; } .panel.time::after { content: ""; display: block; clear: both; } .time .t-times > div { display: contents; }

/* WhatsApp в настройках уведомлений: QR на белом — читается и в тёмной теме */
.n-wa { margin-top: 8px; }
.n-wa-qr { display: block; margin-top: 6px; background: #fff; padding: 6px; border-radius: 6px; }
/* открытый/закрытый заказ: «Сохранить» у «Информации о клиенте» */
.ns .g-info .info-act { display: flex; align-items: flex-end; gap: 6px; padding-bottom: 2px; } .ns .g-info .info-act .error { font-size: 12px; }
/* экран точки (/point/<код>): монитор 23" на точке — крупнее, без шапки КЦ */
body.pt { font-size: 16px; } body.pt .cm-page { grid-template-columns: 440px minmax(0, 1fr); flex: 1; min-height: 0; }
body.pt .cm-hd h2 { font-size: 20px; } body.pt .cm-ords { font-size: 15px; } body.pt .cm-name { font-size: 14px; } body.pt .cm-sq { font-size: 13px; }
.k-screens { display: flex; flex-direction: column; gap: 6px; } .k-scr { flex-wrap: wrap; align-items: center; gap: 8px; } .k-scr-url { word-break: break-all; font-size: 13px; }
/* имя в заказе не совпадает с базой: оператор уточнит у клиента */
.name-mark { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 6px; padding: 6px 10px; border-radius: 8px; background: var(--err-bg); color: var(--err-fg); font-size: 13px; }
.name-mark .grow { flex: 1; min-width: 200px; } .name-mark[hidden] { display: none; }
.t-early.late { color: var(--err-fg); font-weight: 600; }
/* Настройки → Цены */
.pr-box .frow { gap: 8px; } .pr-q { min-width: 280px; } .pr-cols { display: flex; flex-wrap: wrap; gap: 6px 14px; margin: 8px 0; align-items: center; }
.pr-col { display: inline-flex; gap: 4px; align-items: center; } .pr-lab { font-size: 13px; padding: 2px 4px; }
.pr-tbl { max-height: 70vh; overflow: auto; } .pr-table { border-collapse: collapse; font-size: 14px; width: 100%; }
.pr-table th { position: sticky; top: 0; background: var(--panel); text-align: left; font-size: 12px; font-weight: 400; color: var(--muted); padding: 4px 8px; border-bottom: 1px solid var(--hair); }
.pr-table td { padding: 4px 8px; border-bottom: 1px solid var(--hair); } .pr-table .num { text-align: right; white-space: nowrap; }
.pr-table td.pr-off { color: var(--muted); text-decoration: line-through; } .pr-table td.pr-diff { background: var(--row-late); } .pr-menu { font-size: 12px; color: var(--err-fg); } .pr-diffn { color: var(--err-fg); font-weight: 600; }
.pr-set input.pr-pct { width: 70px; flex: none; } .pr-set input.pr-lab { width: auto; flex: none; }
.pr-set { display: grid; gap: 8px; margin: 8px 0; } .pr-line { display: flex; flex-wrap: wrap; gap: 6px 14px; align-items: center; }
.pr-pct { width: 64px; font-size: 13px; padding: 2px 4px; text-align: right; } .pr-pcth { color: var(--ok-fg, #1a7f37); font-weight: 600; }
.pr-table tr.pr-grp td { background: var(--soft); font-weight: 600; } .pr-new { color: var(--ok-fg, #1a7f37); font-weight: 700; } .pr-sum { font-weight: 600; }
.pr-orderline { padding: 8px 10px; border-radius: var(--r-ctl); background: var(--soft); } .pr-order:disabled { opacity: .5; cursor: not-allowed; } .pr-done { color: var(--ok-fg, #1a7f37); font-weight: 700; }
.pr-arrow { border: 0; background: none; font: inherit; cursor: pointer; padding: 0 6px 0 0; width: 22px; } .pr-ptsbtn { margin-left: auto; }
.of-admin textarea { width: min(640px, 100%); } .of-admin .of-l { min-width: 260px; display: inline-block; } .of-stats th, .of-stats td { padding: 4px 12px; text-align: left; }
.rom-tbl td, .rom-tbl th { padding: 2px 8px; text-align: left; }
.rom-cur { background: var(--accent-soft, #eef6ee); }
.rom-out { white-space: pre-wrap; font-size: 13px; max-height: 320px; overflow: auto; }
.rom-cand { min-width: 340px; }

/* Настройки города (08.11.2026): оплата столбцами, чек на кухню ровной сеткой, подарки плашками, номера строками */
.settings .sctl .ztab { width: auto; } .settings .sctl .ztab th { text-align: left; padding-right: 24px; } .settings .pay-tbl { width: auto; } .settings .pay-tbl th { text-align: left; padding-right: 24px; } .settings .pay-tbl td { padding-right: 24px; } .settings .pay-tbl select { min-width: 220px; }
.settings .pay-cols { display: flex; flex-wrap: wrap; gap: 12px 40px; }
.settings .pay-col { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; }
.settings .kr-grid { display: grid; grid-template-columns: max-content 90px max-content; gap: 8px 10px; align-items: center; }
.settings .kr-grid input { width: 90px !important; }
.settings .gp-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.settings .gp-chip.miss { border-color: var(--err-line); color: var(--err-fg); }
.settings .lr-rows { display: flex; flex-direction: column; gap: 6px; margin-bottom: 6px; }

/* Курьеры (08.11.2026): телефоны ровной сеткой; QR — поле «перетащите картинку сюда» */
.settings .k-grid { display: grid; grid-template-columns: max-content 220px; gap: 8px 12px; align-items: center; }
.settings .k-grid input { width: 100%; box-sizing: border-box; } .settings input.k-transfer { width: 220px; max-width: 100%; }
.settings .k-qr-drop { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; max-width: 420px; min-height: 96px; padding: 16px; margin: 8px 0;
  border: 2px dashed var(--line); border-radius: var(--r-ctl); background: var(--soft); text-align: center; cursor: pointer; }
.settings .k-qr-drop:hover, .settings .k-qr-drop.over { border-color: var(--accent); background: var(--panel); }
.settings .k-qr-drop.over .k-qr-drop-t { color: var(--accent); }
.settings .k-qr-drop input[type=file] { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.settings .k-qr-drop-t { font-weight: 600; }

/* Уведомления (08.11.2026): номера для рассылки — карточками с состоянием; QR подписан, к какому каналу и городу */
.settings .gw-cards { display: flex; flex-wrap: wrap; gap: 16px; }
.settings .gw-card { flex: 0 1 340px; padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--panel); display: flex; flex-direction: column; gap: 6px; }
.settings .gw-card.on { border-color: #8fd0a9; } .settings .gw-card.off { border-color: var(--err-line); }
.settings .gw-h { display: flex; align-items: center; gap: 4px; } .settings .gw-pill { margin-left: auto; padding: 1px 10px; border-radius: var(--r-pill); font-size: 12px; font-weight: 600; }
.settings .gw-card.on .gw-pill { background: var(--ok-bg); color: var(--ok-fg); } .settings .gw-card.off .gw-pill { background: var(--err-bg); color: var(--err-fg); }
.settings .gw-card.wait .gw-pill { background: var(--soft); color: var(--muted); }
.settings .gw-me { font-size: 18px; font-weight: 600; } .settings .gw-last { font-weight: 600; color: var(--err-fg); }
.settings .gw-qr { margin: 4px 0; } .settings .gw-qr img { display: block; border: 1px solid var(--line); border-radius: 6px; }
.settings .gw-alert { margin-top: 14px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; } .settings .gw-alert > .muted { flex-basis: 100%; }

/* Цены (08.11.2026): % — в шапке столбца, панель повышения над таблицей, статус строкой с разделителями */
.pr-top { display: flex; align-items: center; gap: 8px; margin: 4px 0 8px; } .pr-top .pr-sp { flex: 1; } .pr-top .pr-ptsbtn { margin-left: 0; }
.pr-pts { display: flex; flex-wrap: wrap; gap: 6px 16px; align-items: center; padding: 8px 10px; margin-bottom: 8px; border: 1px solid var(--hair); border-radius: var(--r-ctl); }
.pr-msg { display: flex; flex-wrap: wrap; gap: 4px 0; font-size: 13px; margin-bottom: 10px; } .pr-msg > span + span::before { content: "·"; margin: 0 8px; color: var(--line); }
.pr-msg .pr-done { flex-basis: 100%; }
.pr-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; padding: 10px 12px; margin-bottom: 10px; border-radius: var(--r-ctl); background: var(--soft); }
.pr-actions .pr-sum { flex: 1; min-width: 260px; font-weight: 400; } .pr-actions.ready { background: var(--ok-bg); } .pr-actions.ready .pr-sum b { color: var(--ok-fg); }
.pr-table th.pr-colh { vertical-align: bottom; } .pr-table .pr-cl { font-size: 12px; color: var(--muted); margin-bottom: 4px; }
.pr-pctw { display: inline-flex; align-items: center; gap: 3px; color: var(--fg); font-size: 13px; } .pr-pctw input.pr-pct { width: 56px; } .pr-pctw { gap: 6px; font-weight: 600; }
.pr-table th.pr-dish { vertical-align: bottom; } .pr-dh { display: flex; align-items: center; gap: 14px; color: var(--fg); font-size: 13px; }
.pr-table tr.pr-grp.on td { background: var(--ok-bg); }

/* «− число +» в настройках (08.11.2026): без стрелочек браузера */
.settings input[type=number] { -moz-appearance: textfield; appearance: textfield; text-align: center; }
.settings input[type=number]::-webkit-inner-spin-button, .settings input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.settings .nstep { display: inline-flex; align-items: stretch; vertical-align: middle; border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--panel); overflow: hidden; }
.settings .nstep input[type=number] { border: 0 !important; border-radius: 0; box-shadow: none; min-width: 48px; height: 34px; padding: 0 4px; background: transparent; }
.settings .nstep input[type=number]:focus { outline: none; } .settings .nstep:focus-within { border-color: var(--accent); box-shadow: 0 0 0 2px var(--accent-soft, rgba(200,30,50,.15)); }
.settings button.nstep-b { width: 32px; min-width: 32px; height: auto; padding: 0; border: 0; border-radius: 0; background: var(--soft); color: var(--fg); font-size: 18px; font-weight: 600; line-height: 1; }
.settings button.nstep-b:hover { background: var(--hover); color: var(--accent); } .settings .nstep-dn { border-right: 1px solid var(--hair) !important; } .settings .nstep-up { border-left: 1px solid var(--hair) !important; }
.settings .nstep:has(input:disabled) { opacity: .5; }
.settings .pay-2col { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 40px; }
.settings .pay-2col .srow { grid-template-columns: minmax(0, 1fr); gap: 8px; } .settings .pay-2col > div > .srow:last-child { border-bottom: 0; }
/* поле для файла (история заказов): как QR у курьеров */
.settings .fdrop { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; width: 420px; max-width: 100%; min-height: 90px; padding: 14px;
  border: 2px dashed var(--line); border-radius: var(--r-ctl); background: var(--soft); text-align: center; cursor: pointer; }
.settings .fdrop:hover, .settings .fdrop.over { border-color: var(--accent); background: var(--panel); }
.settings .fdrop input[type=file] { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; } .settings .fdrop-t { font-weight: 600; }
.settings .h-drop { align-items: center; }
/* каналы: перетаскивание за «⋮⋮» */
 .settings .n-copyw { display: inline-flex; gap: 6px; }

/* каналы уведомлений — карточками (08.11.2026) */
.settings .n-casc { display: flex; flex-direction: column; gap: 8px; max-width: 640px; user-select: none; }
.settings .n-ch { display: flex; align-items: center; gap: 12px; min-height: 52px; padding: 8px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--panel);
  cursor: grab; touch-action: none; transition: box-shadow .15s, border-color .15s; }
.settings .n-ch:hover { border-color: var(--muted); } .settings .n-ch:not(.on) { opacity: .65; }
.settings .n-ch.drag { cursor: grabbing; box-shadow: 0 8px 24px rgba(0,0,0,.15); border-color: var(--accent); opacity: 1; position: relative; z-index: 2; }
.settings .n-casc.sorting, .settings .n-casc.sorting * { cursor: grabbing !important; }
.settings .n-grip { color: var(--muted); font-size: 18px; line-height: 1; }
.settings .n-ico { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 10px; color: #fff; font-size: 12px; font-weight: 700; flex: none; }
.settings .n-ico-max { background: #5b3df5; } .settings .n-ico-mxp { background: #8e7bff; } .settings .n-ico-tg { background: #2aa3e0; } .settings .n-ico-vk { background: #2f6fd6; }
.settings .n-ico-wa { background: #25a35a; } .settings .n-ico-sms { background: #7a7a7a; font-size: 11px; }
.settings .n-ch-name { display: inline-flex; align-items: center; gap: 8px; cursor: pointer; } .settings .n-ch-st { margin-left: auto; } .settings .n-lim { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; }
.settings .n-lim + .n-ch-st { margin-left: 8px; } .settings .n-lim, .settings .n-ch-st { white-space: nowrap; } .settings .n-casc { max-width: 720px; }
/* оплата: «Точка» не сжимается; «Срок доставки»/таймер курьеров — колонки по содержимому (крутилки шире поля) */
.settings .pay-tbl th:first-child, .settings .pay-tbl td:first-child { white-space: nowrap; } .settings .pay-tbl select { min-width: 0; width: 100%; max-width: 240px; }
.settings .kr-grid { grid-template-columns: max-content max-content max-content; } .settings .kr-grid input { width: 56px !important; }
.settings .cp-pick { position: relative; max-width: 460px; } .settings .cp-pick .sc-o { padding-left: 10px; }
.settings .n-ico-img { width: 36px; height: 36px; border-radius: 10px; flex: none; object-fit: contain; pointer-events: none; }
.settings .n-ch.drag { transition: none; }

/* Общий дизайн списков-карточек (08.11.2026): перетаскивание, отступы между строками везде одинаковые, всё по левому краю */
.settings .srt { display: flex; flex-direction: column; gap: 8px; user-select: none; }
.settings .srt > * { border: 1px solid var(--line); border-radius: 10px; background: var(--panel); padding: 8px 12px; cursor: grab; touch-action: none; margin: 0 !important; }
.settings .srt > *:hover { border-color: var(--muted); }
.settings .srt > .drag { cursor: grabbing; box-shadow: 0 8px 24px rgba(0,0,0,.15); border-color: var(--accent); position: relative; z-index: 2; transition: none; }
.settings .srt.sorting, .settings .srt.sorting * { cursor: grabbing !important; }
.settings .srt-grip { color: var(--muted); font-size: 18px; line-height: 1; flex: none; }
.settings .sh-grid { display: grid; grid-template-columns: minmax(0, 560px) minmax(240px, 380px); gap: 24px; align-items: start; }
.settings .sh-left { display: flex; flex-direction: column; gap: 10px; }
.settings .sh-head { display: flex; align-items: center; gap: 8px; }
.settings .sh-head .sh-del { margin-left: auto; border: 0; background: none; color: var(--muted); font-size: 20px; line-height: 1; padding: 4px 6px; cursor: pointer; }
.settings .sh-head .sh-del:hover { color: var(--accent); }
.settings .sh-rest { position: sticky; top: calc(var(--shell-h, 0px) + 64px); border: 1px dashed var(--line); border-radius: 12px; padding: 12px 14px; }
.settings .sh-rest h3 { margin: 0 0 2px; font-size: 15px; }
.settings .sh-rest-l { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.settings .sh-card .cp-add { width: 100%; }
.settings .sh-card { display: flex; gap: 12px; align-items: flex-start; }
.settings .sh-card > .srt-grip { height: 36px; display: flex; align-items: center; transform: translateY(2px); }  /* по центру строки с выбором цеха (высота .csel-b) */
.settings .sh-card .gp-chip .srt-grip { display: inline-flex; align-items: center; height: 1em; }
.settings .sh-body { flex: 1; display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.settings .sh-name { font-weight: 600; }
.settings .sh-card .gp-chips.srt { align-items: flex-start; gap: 6px; }
.settings .sh-card .gp-chips.srt > .gp-chip { display: inline-flex; align-items: center; gap: 8px; padding: 4px 10px; border-radius: 999px; }
.settings .sh-card .gp-chips.srt > .gp-none { border: 0; padding: 0; background: none; cursor: default; }
.settings .srt-list { margin-bottom: 10px; max-width: 980px; }
/* соевый: слова | не считать | три числа — колонки выровнены во всех карточках */
.settings .sauce-row { display: grid !important; grid-template-columns: 18px minmax(200px, 1fr) max-content repeat(3, max-content) 32px; gap: 12px; align-items: center; }
.settings .sauce-row .sr-nums { display: contents; } .settings .sauce-row .sr-n { display: flex; flex-direction: column; gap: 2px; font-size: 11px; color: var(--muted); }
.settings .sauce-row .sr-words { width: 100%; }
/* кусочки: слово | число «кусочков» | × — узко и ровно */
.settings .pc-row { display: grid; grid-template-columns: 18px minmax(200px, 320px) max-content 32px; gap: 12px; align-items: center; }
.settings .srt-list:has(.pc-row) { max-width: 560px; }
.settings .pc-nl, .settings .pc-defl { display: inline-flex; align-items: center; gap: 8px; } .settings .pc-defl { margin-top: 10px; }
/* числа: поле по содержимому (ширина ставится в JS), без лишнего минимума */
.settings .nstep input[type=number] { min-width: 0 !important; }
/* строки «подпись — поле» друг под другом: одинаковый зазор */
.settings .sctl > .frow + .frow, .settings .sctl > label.frow + label.frow, .settings .of-admin label.frow, .settings .ev-admin label.frow, .settings .k-line + .k-line { margin-top: 8px; }
.settings .of-admin label.frow, .settings .ev-admin label.frow { display: flex; align-items: center; gap: 10px; }
.settings th { text-align: left; }
.settings .f-del { flex: none; }

/* свои выпадающие списки и галочки (08.11.2026) */
.settings .csel { position: relative; display: inline-flex; vertical-align: middle; max-width: 100%; }
.settings .csel > select { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; pointer-events: none; }
.settings button.csel-b { position: relative; min-width: 140px; max-width: 100%; height: 36px; padding: 0 34px 0 12px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--panel);
  color: var(--fg); font: inherit; font-size: 14px; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.settings button.csel-b::after { content: ""; position: absolute; right: 13px; top: 50%; width: 7px; height: 7px; margin-top: -6px; border: solid var(--muted); border-width: 0 2px 2px 0; transform: rotate(45deg); transition: transform .15s; }
.settings .csel.open button.csel-b { border-color: var(--accent); } .settings .csel.open button.csel-b::after { transform: rotate(-135deg); margin-top: -2px; }
.settings button.csel-b:hover { border-color: var(--muted); } .settings .csel.dis { opacity: .5; }
.settings .csel-pop { position: absolute; z-index: 30; left: 0; top: calc(100% + 4px); min-width: 100%; width: max-content; max-width: 480px; overflow: auto; background: var(--panel);
  border: 1px solid var(--card-line); border-radius: var(--r-card); box-shadow: 0 10px 28px rgba(31,27,23,.14); padding: 4px; }
.settings .csel-pop.up { top: auto; bottom: calc(100% + 4px); }
.settings .csel-o { display: flex; align-items: center; gap: 8px; padding: 7px 10px; border-radius: 6px; cursor: pointer; font-size: 14px; white-space: nowrap; }
.settings .csel-o:hover, .settings .csel-o.cur { background: var(--hover); } .settings .csel-o.on { font-weight: 600; } .settings .csel-o .ck { width: 14px; color: var(--accent); }
.settings .pay-tbl .csel, .settings .pay-tbl button.csel-b { width: 100%; }
.settings input[type=checkbox] { appearance: none; -webkit-appearance: none; width: 18px; height: 18px; margin: 0; flex: none; border: 1.5px solid var(--line); border-radius: 5px; background: var(--panel);
  display: inline-grid; place-content: center; vertical-align: middle; transition: background .1s, border-color .1s; }
.settings input[type=checkbox]::after { content: ""; width: 5px; height: 9px; margin-top: -2px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg) scale(0); transition: transform .1s; }
.settings input[type=checkbox]:checked { background: var(--accent); border-color: var(--accent); } .settings input[type=checkbox]:checked::after { transform: rotate(45deg) scale(1); }
.settings input[type=checkbox]:hover { border-color: var(--muted); } .settings input[type=checkbox]:checked:hover { border-color: var(--accent); }
.settings input[type=checkbox]:disabled { opacity: .5; } .settings input[type=checkbox]:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.settings .pc-ed > .f-add { margin-right: 16px; } .settings .sauce-ed > .f-add, .settings .pc-ed > .f-add { margin-top: 2px; }

/* офферы и вечерний баланс: поля во второй колонке — одной ширины, под самое широкое (кроме длинных текстов) */
.settings .of-admin label.frow > input:not([type=checkbox]):not(.of-wide), .settings .of-admin label.frow > .nstep { width: 220px; min-width: 220px; box-sizing: border-box; }
.settings .of-admin label.frow > .csel { min-width: 220px; }
.settings .of-admin label.frow > .nstep > input[type=number] { flex: 1; width: auto !important; }
.settings .of-admin label.frow > .csel > button.csel-b { width: 100%; min-width: 0; }
.settings .of-admin label.frow > input.of-wide { width: 460px; max-width: 100%; }

/* Свои список и календарь (controls.js) на «Новом заказе», «Заказах» и в их окнах: поле то же, системная стрелка/значок заменены своими */
:is(.ns, .orders, .modal-box, .vkc) select:not([multiple]) { -webkit-appearance: none; appearance: none; padding-right: 30px; text-overflow: ellipsis; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%238d847a' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 11px center; background-size: 10px 6px; }
:is(.ns, .orders, .modal-box, .vkc) select:not([multiple]):disabled { cursor: default; background-image: none; }
input.cdate, :is(.ns, .orders, .modal-box, .vkc) :is(input[type=date], input.dmy) { padding-right: 34px; background-repeat: no-repeat; background-position: right 10px center; background-size: 16px 16px; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' stroke='%238d847a' stroke-width='1.5'%3E%3Crect x='1.75' y='2.75' width='12.5' height='11.5' rx='2'/%3E%3Cpath d='M1.75 6.25h12.5M5 1v3M11 1v3' stroke-linecap='round'/%3E%3C/svg%3E"); }
:is(.ns, .orders, .modal-box, .vkc) :is(input[type=date], input.dmy)::-webkit-calendar-picker-indicator { display: none; }
input.cdate:disabled, input.cdate[readonly], [inert] input.cdate, :is(.ns, .orders, .modal-box, .vkc) :is(input[type=date], input.dmy):disabled, .ns [inert] input[type=date] { background-image: none; cursor: default; }
:is(.ns, .orders, .modal-box, .vkc) input[type=number] { -moz-appearance: textfield; appearance: textfield; }
:is(.ns, .orders, .modal-box, .vkc) input[type=number]::-webkit-inner-spin-button, :is(.ns, .orders, .modal-box, .vkc) input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
:is(.ns, .orders, .modal-box, .vkc) input[type=checkbox] { -webkit-appearance: none; appearance: none; display: inline-grid; place-content: center; width: 16px; height: 16px; min-width: 16px; margin: 0; padding: 0;
  vertical-align: -3px; border: 1.5px solid var(--line); border-radius: 4px; background: var(--panel); cursor: pointer; transition: background .12s, border-color .12s; }
:is(.ns, .orders, .modal-box, .vkc) input[type=checkbox]::after { content: ""; width: 4px; height: 8px; margin-top: -2px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg) scale(0); transition: transform .12s; }
:is(.ns, .orders, .modal-box, .vkc) input[type=checkbox]:checked { background: var(--accent); border-color: var(--accent); }
:is(.ns, .orders, .modal-box, .vkc) input[type=checkbox]:checked::after { transform: rotate(45deg) scale(1); }
:is(.ns, .orders, .modal-box, .vkc) input[type=checkbox]:hover:not(:checked) { border-color: var(--muted); }
:is(.ns, .orders, .modal-box, .vkc) input[type=checkbox]:disabled { opacity: .5; cursor: default; }
:is(.ns, .orders, .modal-box, .vkc) input[type=checkbox]:focus-visible { outline: 2px solid var(--ink); outline-offset: 2px; }
.cpop { position: fixed; z-index: 3000; overflow: auto; max-width: 480px; background: var(--panel); border: 1px solid var(--card-line); border-radius: var(--r-card);
  box-shadow: 0 10px 28px rgba(31, 27, 23, .16); padding: 4px; color: var(--fg); font-size: 14px; }
.cpop .csel-o { display: flex; align-items: center; gap: 8px; padding: 7px 10px; border-radius: 6px; cursor: pointer; white-space: nowrap; }
.cpop .csel-o:hover, .cpop .csel-o.cur { background: var(--hover); } .cpop .csel-o.on { font-weight: 600; } .cpop .csel-o.dis { opacity: .45; cursor: default; }
.cpop .csel-o .ck { width: 14px; flex: none; color: var(--accent); }
.ccal { padding: 10px; width: 272px; min-width: 0 !important; }
.ccal .cc-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; } .ccal .cc-head b { font-size: 14px; }
.ccal button { font: inherit; color: var(--fg); background: none; border: 0; cursor: pointer; }
.ccal .cc-nav { width: 30px; height: 30px; border-radius: 6px; font-size: 18px; line-height: 1; } .ccal .cc-nav:hover { background: var(--soft); }
.ccal .cc-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.ccal .cc-w { text-align: center; font-size: 11px; color: var(--muted); padding: 4px 0; }
.ccal .cc-d { height: 32px; border-radius: 6px; font-size: 13px; } .ccal .cc-d:hover:not(:disabled) { background: var(--hover); }
.ccal .cc-d.today { box-shadow: inset 0 0 0 1px var(--line); font-weight: 600; } .ccal .cc-d.on { background: var(--ink); color: var(--on-ink); font-weight: 600; }
.ccal .cc-d:disabled { color: var(--line); cursor: default; }
.ccal .cc-today { display: block; width: 100%; margin-top: 8px; height: 32px; border-radius: 6px; border: 1px solid var(--line) !important; font-weight: 600; } .ccal .cc-today:hover { background: var(--soft); }
.ns .address select { padding-right: 42px; }  /* «Район» шириной по тексту: та же ширина, что с системной стрелкой — соседние поля не сдвигаются */
.ns .address .free input[type=checkbox] { margin: -1.5px; }  /* 16px на вид, место — как у системного 13px: подпись не сдвигается */

/* Мотивация курьеров */
.cp-page { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: var(--gap); padding: var(--gap); }
.cp-top { display: flex; flex-direction: column; gap: 6px; } .cp-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; } .cp-bar .sp { flex: 1; }
.cp-bar .dayrange { display: flex; align-items: center; gap: 6px; } .cp-d { width: 140px; } .cp-msg { margin: 0; font-size: 12px; } .cp-msg:empty { display: none; }
.cp-chk { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }
.cp-tab { min-height: 0; display: flex; } .cp-body { flex: 1; overflow: auto; }
.cp-t { width: 100%; border-collapse: collapse; font-size: 14px; } .cp-t th { position: sticky; top: 0; background: var(--panel); text-align: left; font-size: 12px; font-weight: 400; color: var(--muted); padding: 6px 10px; border-bottom: 1px solid var(--hair); }
.cp-t td { padding: 8px 10px; border-bottom: 1px solid var(--hair); } .cp-t .num { text-align: right; white-space: nowrap; } .cp-t .b { font-weight: 700; }
.cp-r { cursor: pointer; } .cp-r:hover { background: var(--hover, #f6f3ef); } .cp-r.open { background: #faf7f2; } .cp-arr { display: inline-block; width: 16px; color: var(--muted); } .cp-n { font-weight: 600; }
.cp-diff { color: #b42318; font-weight: 600; } .cp-tot td { font-weight: 600; border-top: 2px solid var(--hair); border-bottom: 0; }
.cp-det > td { padding: 0 10px 10px 36px; background: #faf7f2; } .cp-sub { width: 100%; border-collapse: collapse; font-size: 13px; } .cp-sub th { position: static; background: none; padding: 4px 8px; }
.cp-sub td { padding: 4px 8px; border-bottom: 1px solid var(--hair); }
.cp-tabs { margin-bottom: 2px; }
.cp-set .cp-lead { margin: 0 0 8px; } .cp-roles, .cp-zones { display: flex; flex-direction: column; gap: 10px; }
.cp-role { display: flex; align-items: center; gap: 10px; } .cp-badge { min-width: 34px; height: 26px; padding: 0 8px; display: inline-flex; align-items: center; justify-content: center; border-radius: 6px; background: var(--ink); color: var(--on-ink); font-weight: 700; font-size: 13px; letter-spacing: 0; }
.cp-rname { width: 220px; } .cp-rsum, .cp-zsum { width: 110px; } .cp-addroles { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 8px; } .cp-addroles:empty { display: none; }
.cp-zone { border: 1px solid var(--card-line); border-radius: var(--r-card); padding: 12px 14px; display: flex; flex-direction: column; gap: 10px; background: var(--panel); }
.cp-zl { display: flex; align-items: center; gap: 10px; } .cp-zl .sp { flex: 1; } .cp-zname { width: 280px; font-weight: 600; } .cp-plus { color: var(--muted); font-weight: 600; }
.cp-zf { display: grid; grid-template-columns: 170px minmax(0, 1fr); align-items: start; gap: 10px; } .cp-zlab { display: flex; flex-direction: column; gap: 2px; padding-top: 4px; color: var(--muted); font-size: 13px; }
.cp-zroles { display: flex; flex-wrap: wrap; gap: 6px; } .cp-addzone { align-self: flex-start; margin-top: 4px; }
.cp-pl { display: flex; flex-direction: column; gap: 6px; } .cp-pl-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.cp-pl-i { display: flex; align-items: center; gap: 6px; min-height: 30px; padding: 2px 4px 2px 10px; border: 1px solid var(--card-line); border-radius: 8px; background: var(--soft); }
.cp-pl-t { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.cp-pl-x { border: 0; background: none; color: var(--muted); font-size: 16px; line-height: 1; padding: 2px 6px; cursor: pointer; border-radius: 4px; } .cp-pl-x:hover { background: var(--hover); color: var(--fg); }
.cp-pl-none { font-size: 13px; } .cp-pl-add { position: relative; } .cp-pl-btn { font-size: 13px; }
.cp-pl-pop { position: absolute; z-index: 20; top: 100%; left: 0; width: 420px; max-height: 320px; overflow: auto; margin-top: 4px; padding: 6px; background: var(--panel); border: 1px solid var(--line); border-radius: 10px; box-shadow: 0 8px 24px rgba(0,0,0,.12); }
.cp-pl-q { width: 100%; box-sizing: border-box; margin-bottom: 4px; } .cp-pl-o { padding: 7px 10px; border-radius: 6px; cursor: pointer; font-size: 13px; } .cp-pl-o:hover { background: var(--soft); } .cp-pl-own { color: var(--accent); } .cp-pl-empty { padding: 8px 10px; font-size: 13px; }
.cp-dayrow { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; } .cp-day { display: flex; gap: 6px; flex-wrap: wrap; } .cp-sbar { padding-top: 6px; }
.cp-iiko.on { background: var(--ink); color: var(--on-ink); border-color: var(--ink); }
.cp-tabs { display: inline-flex; align-self: flex-start; border: 1px solid var(--line); border-radius: var(--r-ctl); overflow: hidden; background: var(--panel); flex: none; }
.cp-tabs .seg-b { height: 34px; padding: 0 14px; border: 0; background: var(--panel); color: var(--fg); font: inherit; font-weight: 500; cursor: pointer; } .cp-tabs .seg-b + .seg-b { border-left: 1px solid var(--line); }
.cp-tabs .seg-b.on { background: var(--ink); color: var(--on-ink); font-weight: 600; cursor: default; }
.cp-r:hover { background: var(--soft); }
.cp-sub a { color: var(--fg); font-weight: 600; text-decoration: none; border-bottom: 1px solid var(--line); } .cp-sub a:hover { border-color: var(--fg); }
.cp-zh { display: inline-flex; flex-direction: column; align-items: flex-end; line-height: 1.25; white-space: normal; max-width: 170px; text-align: right; } .cp-zh small { font-size: 11px; }
.cp-zc { color: var(--fg); } .cp-ztitle { min-width: 180px; font-size: 15px; }
.cp-t .sort, .cp-sub .sort { border: 0; background: none; padding: 0; font: inherit; color: inherit; cursor: pointer; display: inline-flex; align-items: center; gap: 5px; }
.cp-t th.num .sort, .cp-sub th.num .sort { flex-direction: row; } .cp-t th.num, .cp-sub th.num { text-align: right; }
.cp-t .si, .cp-sub .si { width: 8px; height: 12px; fill: none; stroke: currentColor; stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; opacity: 0; transition: opacity .12s; flex: none; }
.cp-t .si path, .cp-sub .si path { opacity: .3; } .cp-t .si path.act, .cp-sub .si path.act { opacity: 1; }
.cp-t th:hover .si, .cp-sub th:hover .si { opacity: .7; } .cp-t th .si.on, .cp-sub th .si.on { opacity: 1; } .cp-t th.sorted, .cp-sub th.sorted { color: var(--fg); font-weight: 600; }

/* «Новое блюдо» (/dishes): блоки разного тона, свои поля и списки вместо системных */
.nd-page { flex: 1; min-height: 0; display: flex; flex-direction: column; gap: var(--gap); padding: var(--gap); }
.nd-top { display: flex; align-items: center; gap: 12px; padding: 10px 14px; background: var(--panel); border: 1px solid var(--card-line); border-radius: var(--r-card); }
.nd-top h1 { margin: 0; font-size: 18px; } .nd-top-s { color: var(--muted); font-size: 13px; } .nd-top .sp { flex: 1; }
.nd-msg { font-size: 13px; color: var(--muted); max-width: 520px; } .nd-msg.err { color: var(--err-fg); }
.nd-cols { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: var(--gap); }
.nd-col { min-height: 0; display: flex; flex-direction: column; gap: var(--gap); overflow: auto; padding-right: 2px; } .nd-col-r { overflow: hidden; }
.nd-blk { background: var(--panel); border: 1px solid var(--card-line); border-radius: var(--r-card); padding: 0 14px 14px; display: flex; flex-direction: column; gap: 10px; flex: none; }
.nd-bh { display: flex; align-items: baseline; gap: 10px; margin: 0 -14px; padding: 10px 14px; border-radius: var(--r-card) var(--r-card) 0 0; border-bottom: 1px solid var(--card-line); }
.nd-bh h2 { margin: 0; font-size: 14px; font-weight: 600; letter-spacing: .02em; text-transform: uppercase; } .nd-bs { color: var(--muted); font-size: 12px; }
.nd-b-base .nd-bh { background: var(--cb-fff7e0); } .nd-b-card .nd-bh { background: var(--cb-eef4ff); }
.nd-b-comp .nd-bh { background: var(--cb-eaf4e4); } .nd-b-tech .nd-bh { background: var(--cb-f3ebe2); }
.nd-b-comp { flex: 1; min-height: 0; }
.nd-f { display: flex; flex-direction: column; gap: 4px; min-width: 0; } .nd-l { font-size: 12px; color: var(--muted); display: flex; gap: 6px; align-items: baseline; } .nd-hint { font-size: 11px; opacity: .8; }
.nd-grid2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; } .nd-grid3 { display: grid; grid-template-columns: auto minmax(0, 1fr) 150px; gap: 10px; align-items: end; }
.nd-in { height: var(--h-field); box-sizing: border-box; width: 100%; padding: 0 10px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--field); color: var(--fg); font-size: 14px; outline: none; }
.nd-in:focus, .nd-cb:focus-visible, .nd-combo.open .nd-cb { border-color: var(--fg); box-shadow: 0 0 0 3px rgba(31, 27, 23, .08); }
.nd-ta { height: auto; padding: 8px 10px; resize: vertical; line-height: 1.4; min-height: 56px; }
.nd-num { text-align: right; font-variant-numeric: tabular-nums; }
.nd-suf { position: relative; } .nd-suf .nd-in { padding-right: 34px; } .nd-suf span { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); color: var(--muted); font-size: 13px; pointer-events: none; }
.nd-ro { height: var(--h-field); display: flex; align-items: center; padding: 0 10px; border: 1px dashed var(--line); border-radius: var(--r-ctl); color: var(--muted); font-size: 13px; }
.nd-note { margin: 0; font-size: 12px; color: var(--muted); }
.nd-seg { display: inline-flex; height: var(--h-field); padding: 3px; gap: 3px; box-sizing: border-box; background: var(--soft); border: 1px solid var(--line); border-radius: var(--r-ctl); }
.nd-seg-b { border: 0; background: none; padding: 0 14px; border-radius: 6px; font-size: 13px; color: var(--muted); cursor: pointer; } .nd-seg-b:hover { color: var(--fg); }
.nd-seg-b.on { background: var(--panel); color: var(--fg); font-weight: 600; box-shadow: 0 1px 2px rgba(0,0,0,.12); }
.nd-combo { position: relative; min-width: 0; }
.nd-cb { width: 100%; height: var(--h-field); display: flex; align-items: center; gap: 8px; padding: 0 10px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--field); color: var(--fg); cursor: pointer; text-align: left; font-size: 14px; outline: none; }
.nd-cb:hover { border-color: var(--muted); } .nd-cb-v { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .nd-ph { color: var(--muted); }
.nd-cb-ar { width: 7px; height: 7px; border-right: 1.5px solid var(--muted); border-bottom: 1.5px solid var(--muted); transform: translateY(-2px) rotate(45deg); flex: none; }
.nd-combo.open .nd-cb-ar { transform: translateY(2px) rotate(-135deg); }
.nd-pop { position: absolute; z-index: 30; top: calc(100% + 4px); left: 0; min-width: 100%; width: max(100%, 380px); padding: 6px; box-sizing: border-box; background: var(--panel); border: 1px solid var(--line); border-radius: 10px; box-shadow: 0 10px 28px rgba(0,0,0,.14); }
.nd-pop-q { margin-bottom: 6px; } .nd-pop-l { max-height: 300px; overflow: auto; }
.nd-opt { display: flex; align-items: baseline; gap: 10px; padding: 7px 10px; border-radius: 6px; cursor: pointer; font-size: 13px; } .nd-opt.hi { background: var(--soft); } .nd-opt.sel .nd-opt-t { font-weight: 600; }
.nd-opt-t { flex: 1; min-width: 0; } .nd-opt-s { color: var(--muted); font-size: 12px; white-space: nowrap; } .nd-opt-none { color: var(--muted); } .nd-pop-empty { padding: 8px 10px; font-size: 13px; color: var(--muted); }
.nd-base-row { display: flex; gap: 10px; } .nd-base-cb { flex: 1; }
.nd-btn { height: var(--h-field); padding: 0 16px; border-radius: var(--r-ctl); border: 1px solid var(--line); background: var(--panel); color: var(--fg); font-size: 14px; cursor: pointer; white-space: nowrap; }
.nd-btn:hover { border-color: var(--fg); } .nd-btn-ghost { background: var(--soft); }
.nd-btn-main { background: var(--accent); border-color: var(--accent); color: #fff; font-weight: 600; } .nd-btn-main:hover { filter: brightness(1.06); border-color: var(--accent); }
.nd-btn:disabled { opacity: .5; cursor: default; filter: none; }
.nd-tbl-w { flex: 1; min-height: 0; overflow: auto; border: 1px solid var(--hair); border-radius: var(--r-ctl); }
.nd-tbl { width: 100%; border-collapse: collapse; font-size: 13px; }
.nd-tbl th { position: sticky; top: 0; z-index: 1; background: var(--soft); text-align: left; font-weight: 500; color: var(--muted); font-size: 12px; padding: 8px; border-bottom: 1px solid var(--card-line); }
.nd-tbl td { padding: 6px 8px; border-bottom: 1px solid var(--hair); vertical-align: middle; } .nd-tbl tr:last-child td { border-bottom: 0; }
.nd-c-n { width: 28px; color: var(--muted); text-align: right; } .nd-c-a { width: 110px; } .nd-c-a .nd-in { height: var(--h-small); } .nd-c-x { width: 96px; }
.nd-c-name { min-width: 0; } .nd-ing { display: block; font-weight: 500; } .nd-tags { display: flex; gap: 4px; margin-top: 3px; flex-wrap: wrap; }
.nd-tag { font-size: 11px; padding: 1px 7px; border-radius: var(--r-pill); background: var(--soft); color: var(--muted); border: 1px solid var(--hair); } .nd-tag-ns { background: var(--warn-bg); color: var(--warn-fg); border-color: transparent; }
.nd-mv { display: flex; gap: 2px; justify-content: flex-end; }
.nd-ic { width: 28px; height: 28px; padding: 0; border: 1px solid transparent; border-radius: 6px; background: none; color: var(--muted); cursor: pointer; font-size: 14px; line-height: 1; }
.nd-ic:hover:not(:disabled) { background: var(--soft); border-color: var(--hair); color: var(--fg); } .nd-ic:disabled { opacity: .3; cursor: default; } .nd-ic-x:hover:not(:disabled) { background: var(--hover); color: var(--accent); }
.nd-empty { margin: 0; padding: 18px; text-align: center; color: var(--muted); font-size: 13px; }
.nd-comp-foot { display: flex; align-items: center; gap: 12px; } .nd-add { width: 360px; } .nd-add .nd-cb { border-style: dashed; color: var(--accent); } .nd-add .nd-ph { color: var(--accent); }
.nd-tot { margin-left: auto; color: var(--muted); font-size: 13px; } .nd-tot-v { color: var(--fg); font-weight: 600; font-variant-numeric: tabular-nums; }
.nd-in-w { max-width: 360px; }
.nd-b-done { padding: 10px 16px; flex-direction: row; align-items: center; gap: 16px; border-color: var(--ok); background: var(--ok-bg); } .nd-done-tx { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; } .nd-b-done.warn { border-color: var(--warn-fg); background: var(--warn-bg); }
.nd-done-t { font-weight: 600; font-size: 15px; } .nd-done-s { font-size: 13px; } .nd-done-e { font-size: 12px; color: var(--err-fg); } .nd-done-a { display: flex; gap: 8px; flex: none; }
.nd-loading { padding: 20px; } .nd-err-blk { padding: 16px; color: var(--err-fg); }

/* отзывы с сайта FoodSoul: метка «хороший/плохой · решение», кнопки публикации — сегментом */
.rv-item.k-site { border-left-color: #8a6fd1; } .rv-kind { white-space: nowrap; } .rv-st { display: inline-block; padding: 1px 8px; border-radius: 10px; font-size: 11px; font-weight: 600; white-space: nowrap; }
.rv-st.neg { background: #fbe4e4; color: #a52a2a; } .rv-st.pos { background: #e3f3e3; color: #1f6b2a; } .rv-st-p { font-weight: 500; opacity: .8; }
.rv-site { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 6px; padding: 8px 10px; border: 1px solid var(--line); border-radius: var(--r-ctl); background: var(--panel); font-size: 13px; }
.rv-seg { display: inline-flex; gap: 8px; } .rv-seg button { height: var(--h-small); padding: 0 14px; border: 1px solid; border-radius: var(--r-ctl); background: transparent; font: inherit; font-weight: 600; cursor: pointer; }
/* «Опубликовать на сайте» — зелёная, «Не публиковать» — красная; выбранная — залита; в тёмной теме — светлее, чтобы читалось */
.rv-seg .rv-pub { --c: #1f7a34; --bg: #e6f4e9; } .rv-seg .rv-hide { --c: #b3261e; --bg: #fbe7e5; }
html[data-theme="dark"] .rv-seg .rv-pub { --c: #5fd17f; --bg: rgba(95, 209, 127, .14); } html[data-theme="dark"] .rv-seg .rv-hide { --c: #ff7b72; --bg: rgba(255, 123, 114, .14); }
.rv-seg button { color: var(--c); border-color: var(--c); } .rv-seg button:not(:disabled):hover { background: var(--bg); }
.rv-seg .rv-pub.on { background: #1f7a34; border-color: #1f7a34; color: #fff; } .rv-seg .rv-hide.on { background: #b3261e; border-color: #b3261e; color: #fff; }
html[data-theme="dark"] .rv-seg .rv-pub.on { background: #2e9e4f; border-color: #2e9e4f; } html[data-theme="dark"] .rv-seg .rv-hide.on { background: #c9372c; border-color: #c9372c; }
.rv-seg button:disabled { cursor: default; opacity: 1; }
html[data-theme="dark"] .rv-st.neg { background: rgba(255, 123, 114, .16); color: #ff9b94; } html[data-theme="dark"] .rv-st.pos { background: rgba(95, 209, 127, .16); color: #7fdc98; }
.rv-simg { margin-left: auto; font-size: 13px; }

/* список заказов за длинный период: «Показать ещё» в конце раздела */
.otable tr.omore td { padding: 10px 12px; text-align: center; background: transparent; } .otable tr.omore .link { margin-left: 12px; }
.nd-b-photo .nd-bh { background: var(--cb-eef4ff); }
.nd-ph { display: flex; gap: 14px; align-items: flex-start; }
.nd-ph-img { width: 180px; height: 135px; flex: none; border-radius: 10px; background: var(--soft); display: grid; place-items: center; overflow: hidden; box-shadow: 0 0 0 1px var(--hair); }
.nd-ph-img img { width: 100%; height: 100%; object-fit: cover; }
.nd-ph-a { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }