/* Monkey Club — спокойный деловой стиль */
:root{
  --bg:#f3f4f6; --panel:#ffffff; --panel2:#f8f9fa; --line:#e4e7eb; --line2:#d1d5db;
  --text:#1f2328; --muted:#6b7280;
  --accent:#1e7b3c; --accent-d:#17632f; --accent-bg:#eaf5ee; --btn-text:#fff;
  --red:#c0262d; --red-bg:#fdeeee; --amber:#a86400; --amber-bg:#fff6e5; --blue:#1d5fa8;
  --side:#16191d; --side2:#22262b; --side-text:#b8bec6; --brand:#8fd14f;
  --input-bg:#fff; --hover:#fafbfc; --bar:#9cc9a9; --placeholder:#9aa1a9;
  --ok-border:#b9dcc5; --ok-text:#155d2c; --err-border:#efc0c2; --err-text:#9b1c22; --amber-border:#f0d49a;
  --night-bg:#eaf1fb; --night-border:#c3d6ef; --shadow:0 1px 2px rgba(16,24,40,.04); --focus:rgba(30,123,60,.12);
  --r:8px;
}
/* ---------- темы ---------- */
html[data-theme=dark]{
  --bg:#111315; --panel:#1a1d21; --panel2:#202428; --line:#2c3136; --line2:#3a4046; --text:#e6e8eb; --muted:#9aa1a9;
  --accent:#3fa35f; --accent-d:#348a50; --accent-bg:#16281d; --btn-text:#fff;
  --red:#ff6b6b; --red-bg:#2d1717; --amber:#e0a340; --amber-bg:#2a2213; --blue:#6aa8ff;
  --side:#0b0c0e; --side2:#1c1f23; --input-bg:#15181b; --hover:#22262b; --bar:#3d7a52; --placeholder:#6b7280;
  --ok-border:#2f5c3d; --ok-text:#8fd6a5; --err-border:#6e2a2a; --err-text:#ffb3b3; --amber-border:#6b5320;
  --night-bg:#16233a; --night-border:#2c4670; --shadow:none; --focus:rgba(63,163,95,.25); color-scheme:dark;
}
html[data-theme=monkey]{
  --bg:#0d0f0c; --panel:#151813; --panel2:#1c2019; --line:#2a3025; --line2:#353c30; --text:#e9eee4; --muted:#8d9786;
  --accent:#8fd14f; --accent-d:#a6e36a; --accent-bg:#1b2610; --btn-text:#10140c;
  --red:#ff6b6b; --red-bg:#2e1313; --amber:#ffb84d; --amber-bg:#261d0e; --blue:#5db7ff;
  --side:#080a07; --side2:#1a1f15; --side-text:#b9c4ad; --brand:#9ef01a;
  --input-bg:#0f120d; --hover:#1a1e17; --bar:#5d8f2a; --placeholder:#667060;
  --ok-border:#4d7a1c; --ok-text:#b7f07a; --err-border:#6e2a2a; --err-text:#ffb3b3; --amber-border:#6b5320;
  --night-bg:#142033; --night-border:#2c4670; --shadow:none; --focus:rgba(143,209,79,.25); color-scheme:dark;
}
html[data-theme=blue]{
  --bg:#eef2f7; --panel:#fff; --panel2:#f5f8fc; --line:#dde4ee; --line2:#c9d3e1; --text:#1a2433; --muted:#627089;
  --accent:#1d5fa8; --accent-d:#174d89; --accent-bg:#e7f0fb; --focus:rgba(29,95,168,.15);
  --side:#0f2340; --side2:#1a3358; --side-text:#b9c8de; --brand:#5aa0ff; --bar:#8fb6e3;
  --ok-border:#b8cdea; --ok-text:#174d89;
}
html[data-theme=sepia]{
  --bg:#f4efe6; --panel:#fffdf8; --panel2:#f8f3ea; --line:#e6dccb; --line2:#d6c9b3; --text:#2b2419; --muted:#7a6d5a;
  --accent:#8a5a1f; --accent-d:#6f4816; --accent-bg:#f5ead9; --focus:rgba(138,90,31,.15);
  --side:#2b2419; --side2:#3a3124; --side-text:#d3c6b2; --brand:#e0a95b; --input-bg:#fffdf8; --hover:#faf5ec;
  --bar:#cfae80; --ok-border:#e0c9a4; --ok-text:#6f4816;
}
@media (prefers-color-scheme: dark){
  html[data-theme=auto]{
    --bg:#111315; --panel:#1a1d21; --panel2:#202428; --line:#2c3136; --line2:#3a4046; --text:#e6e8eb; --muted:#9aa1a9;
    --accent:#3fa35f; --accent-d:#348a50; --accent-bg:#16281d; --red:#ff6b6b; --red-bg:#2d1717; --amber:#e0a340;
    --amber-bg:#2a2213; --blue:#6aa8ff; --side:#0b0c0e; --side2:#1c1f23; --input-bg:#15181b; --hover:#22262b;
    --bar:#3d7a52; --placeholder:#6b7280; --ok-border:#2f5c3d; --ok-text:#8fd6a5; --err-border:#6e2a2a;
    --err-text:#ffb3b3; --amber-border:#6b5320; --night-bg:#16233a; --night-border:#2c4670; --shadow:none;
    --focus:rgba(63,163,95,.25); color-scheme:dark;
  }
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text);
  font:14.5px/1.5 "Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline}

/* ---------- каркас: меню слева ---------- */
.layout{display:flex;min-height:100vh;background:linear-gradient(to right,var(--side) 224px,var(--bg) 224px)}
.side{width:224px;flex:0 0 224px;background:var(--side);color:var(--side-text);
  display:flex;flex-direction:column;position:sticky;top:0;height:100vh}
.logo{display:flex;align-items:center;gap:10px;padding:20px 20px 18px;color:#fff;font-weight:700;
  font-size:15px;letter-spacing:.3px;border-bottom:1px solid #262a30}
.logo:hover{text-decoration:none}
.logo i{width:30px;height:30px;border-radius:7px;background:var(--brand);color:#111;font-style:normal;
  display:grid;place-items:center;font-weight:800;font-size:15px}
.logo small{display:block;color:#7d848d;font-weight:400;font-size:12px;letter-spacing:0}
.side nav{padding:12px 10px;flex:1;overflow-y:auto}
.side .grp{font-size:11px;color:#6b727b;text-transform:uppercase;letter-spacing:.8px;padding:14px 12px 6px}
.side nav a{display:block;color:var(--side-text);padding:8px 12px;border-radius:6px;margin-bottom:1px;
  border-left:3px solid transparent}
.side nav a:hover{background:var(--side2);color:#fff;text-decoration:none}
.side nav a.on{background:var(--side2);color:#fff;border-left-color:var(--brand)}
.me{padding:14px 20px;border-top:1px solid #262a30;font-size:13px}
.me b{display:block;color:#fff;font-weight:600}
.me span{color:#7d848d}
.me .links{margin-top:8px;display:flex;gap:14px}
.me a,.me .linkbtn{color:var(--side-text);font-size:13px}
.me a:hover,.me .linkbtn:hover{color:#fff}
.content{flex:1;min-width:0}
main{max-width:1240px;margin:0 auto;padding:28px 32px 60px}
main.solo{max-width:none;padding:0}

h1{font-size:22px;font-weight:600;margin:0 0 20px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
h2{font-size:15.5px;font-weight:600;margin:0 0 14px}
h3{font-size:14px;margin:18px 0 8px;color:var(--muted);font-weight:600}
p{margin:0 0 10px}

/* ---------- сетки и карточки ---------- */
.grid{display:grid;gap:16px}
.g2{grid-template-columns:repeat(auto-fit,minmax(340px,1fr))}
.g2x{grid-template-columns:repeat(2,minmax(0,1fr))}
.g3{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.g4{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:20px;min-width:0;
  box-shadow:var(--shadow)}
.mt{margin-top:16px}

.kpi{padding:16px 18px}
.kpi .l{color:var(--muted);font-size:13px}
.kpi .v{font-size:24px;font-weight:600;margin-top:6px;font-variant-numeric:tabular-nums;letter-spacing:-.2px}
.kpi .s{color:var(--muted);font-size:12.5px;margin-top:4px}
.kpi.hl{border-top:3px solid var(--accent);padding-top:14px}

.pos{color:var(--accent)}.neg{color:var(--red)}.warn{color:var(--amber)}.mut,.muted{color:var(--muted)}

/* ---------- таблицы ---------- */
table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
th,td{padding:9px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}
th{color:var(--muted);font-weight:600;font-size:12.5px;background:var(--panel2);border-bottom:1px solid var(--line2)}
tr:last-child td{border-bottom:0}
td.r,th.r{text-align:right}
tbody tr:hover td,tr:hover td{background:var(--hover)}
.tw{overflow-x:auto}
.card.tw{padding:0}
.card.tw>h2{padding:18px 20px 0}
.card.tw>table{margin-top:0}

/* ---------- формы ---------- */
form.inline{display:inline}
label{display:block;font-size:13px;color:var(--muted);margin:0 0 5px}
input,select,textarea{width:100%;background:var(--input-bg);border:1px solid var(--line2);color:var(--text);
  border-radius:6px;padding:8px 10px;font:inherit}
input::placeholder,textarea::placeholder{color:var(--placeholder)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--focus)}
input[type=checkbox]{width:auto;accent-color:var(--accent);margin-right:6px}
input[type=file]{padding:6px}
.f{margin-bottom:14px}
.row{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}
.hrow{display:flex;gap:8px;align-items:end;flex-wrap:wrap}
.hrow>*{flex:1;min-width:110px}
.hrow>button,.hrow>.btn{flex:0 0 auto;min-width:0}

button,.btn{display:inline-block;background:var(--accent);color:var(--btn-text);border:1px solid var(--accent);border-radius:6px;
  padding:8px 16px;font:inherit;font-weight:600;cursor:pointer;line-height:1.4}
button:hover,.btn:hover{background:var(--accent-d);border-color:var(--accent-d);text-decoration:none}
.btn2{background:var(--panel);color:var(--text);border:1px solid var(--line2)}
.btn2:hover{background:var(--panel2);border-color:var(--muted)}
.sm{padding:4px 10px;font-size:13px;font-weight:500}
.danger{background:var(--panel);color:var(--red);border:1px solid var(--err-border)}
.danger:hover{background:var(--red-bg);border-color:var(--red)}
.linkbtn{background:none;border:0;padding:0;font-weight:400;cursor:pointer}
.linkbtn:hover{background:none}

/* ---------- сообщения, метки ---------- */
.flash{padding:11px 14px;border-radius:6px;margin-bottom:16px;border:1px solid}
.flash.ok{background:var(--accent-bg);border-color:var(--ok-border);color:var(--ok-text)}
.flash.err{background:var(--red-bg);border-color:var(--err-border);color:var(--err-text)}
.alert{border:1px solid var(--amber-border);background:var(--amber-bg);padding:12px 16px;border-radius:var(--r);margin-bottom:16px}
.alert table td{border-color:var(--amber-border)}
.alert tr:hover td{background:transparent}
.tag{display:inline-block;padding:1px 9px;border-radius:4px;font-size:12px;font-weight:500;
  background:var(--panel2);border:1px solid var(--line);color:var(--muted);vertical-align:middle}
.tag.day{background:var(--amber-bg);border-color:var(--amber-border);color:var(--amber)}
.tag.night{background:var(--night-bg);border-color:var(--night-border);color:var(--blue)}
.tag.new,.tag.open{background:var(--accent-bg);border-color:var(--ok-border);color:var(--accent)}
.tag.work{background:var(--amber-bg);border-color:var(--amber-border);color:var(--amber)}
.tag.rejected{background:var(--red-bg);border-color:var(--err-border);color:var(--red)}

/* ---------- график ---------- */
.bars{display:flex;align-items:flex-end;gap:6px;height:170px;padding:10px 0 24px;border-bottom:1px solid var(--line)}
.bars>*{flex:1;max-width:44px;background:var(--bar);border-radius:3px 3px 0 0;min-height:2px;position:relative;display:block}
.bars>*:hover{background:var(--accent);text-decoration:none}
.bars>* span{position:absolute;bottom:-20px;left:50%;transform:translateX(-50%);font-size:11px;color:var(--muted);white-space:nowrap}

details summary{cursor:pointer;color:var(--accent);margin:8px 0;font-weight:500}

/* ---------- вход ---------- */
.login-wrap{min-height:100vh;display:grid;place-items:center;padding:20px;background:var(--side)}
.center{width:100%;max-width:380px;margin:60px auto}
.login-wrap .center{margin:0}
.login-logo{display:flex;align-items:center;gap:12px;margin-bottom:22px}
.login-logo i{width:40px;height:40px;border-radius:9px;background:var(--brand);color:#111;font-style:normal;
  display:grid;place-items:center;font-weight:800;font-size:19px}
.login-logo b{display:block;font-size:17px}
.login-logo span{color:var(--muted);font-size:13px}
.w100{width:100%}

/* ---------- сдача смены ---------- */
.sales-grid{display:grid;gap:8px 12px;grid-template-columns:repeat(auto-fill,minmax(270px,1fr))}
.sales-grid .it{display:flex;align-items:center;gap:10px;background:var(--panel2);border:1px solid var(--line);
  border-radius:6px;padding:6px 8px 6px 12px;margin:0;color:var(--text)}
.sales-grid .it span{flex:1;font-size:14px}
.sales-grid .it small{display:block;color:var(--muted);font-size:12px}
.sales-grid .it input{width:76px;text-align:right;padding:6px 8px}
.sticky-total{position:sticky;bottom:0;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);
  padding:14px 20px;margin-top:16px;display:flex;gap:24px;align-items:center;flex-wrap:wrap;
  box-shadow:0 -4px 16px rgba(16,24,40,.06)}
.sticky-total div{color:var(--muted);font-size:13px}
.sticky-total b{display:block;color:var(--text);font-size:16px;font-variant-numeric:tabular-nums}
.sticky-total b.neg{color:var(--red)}.sticky-total b.pos{color:var(--accent)}
.presets{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-bottom:18px}
.spacer{height:16px}
.small{font-size:13px}
.nowrap{white-space:nowrap}

code{background:var(--panel2);border:1px solid var(--line);border-radius:4px;padding:1px 6px;font-size:13px;word-break:break-all}
.kvgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:0 32px}
.side nav a.mob{display:none}


/* ---------- вкладки, полосы категорий ---------- */
.tabs{display:flex;gap:4px;flex-wrap:wrap;align-items:center;border-bottom:1px solid var(--line2);margin:0 0 16px}
.tabs>a:not(.btn){padding:9px 14px;color:var(--muted);border-bottom:2px solid transparent;margin-bottom:-1px;font-weight:500}
.tabs>a:not(.btn):hover{color:var(--text);text-decoration:none}
.tabs>a.on{color:var(--text);border-bottom-color:var(--accent)}
.tabs .btn{margin-bottom:6px}
.catbars{display:grid;gap:6px}
.catbars .cb{display:grid;grid-template-columns:minmax(90px,170px) 1fr auto;gap:10px;align-items:center;font-size:13.5px}
.catbars .cb span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.catbars .cb i{display:block;height:10px;background:var(--bar);border-radius:2px;min-width:2px}
.catbars .cb b{font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.checks{display:flex;flex-wrap:wrap;gap:6px 16px}
.checks label{margin:0;color:var(--text);font-size:14px}
.modgrid{display:grid;gap:0 14px;grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.modgrid .wide{grid-column:1/-1}
.fieldrow{border-bottom:1px solid var(--line);padding:8px 0}
.fieldrow .hrow>*{min-width:70px}
.fieldrow .hrow>div:first-of-type{flex:3 1 170px}
.fieldrow .hrow>div:nth-of-type(2){flex:2 1 150px;max-width:none!important}
details.inline-edit{display:inline-block;text-align:left}
details.inline-edit[open]{display:block;background:var(--panel2);padding:8px;border-radius:6px;margin-top:4px}
details.inline-edit form{margin-top:6px}
details.inline-edit summary{margin:0}
.filters .hrow>*{min-width:120px}

/* ---------- главная: блоки ---------- */
.dash-head{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.dash-head h1{margin:0}
.dash-head #dash-edit-btn{margin-left:auto}
.dash{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;align-items:start}
.widget{position:relative;min-width:0;overflow-x:auto}
.widget.w1{grid-column:span 1}.widget.w2{grid-column:span 2}.widget.w4{grid-column:span 4}
.widget h2{font-size:14px;color:var(--muted);font-weight:600;margin-bottom:10px}
.bignum{font-size:26px;font-weight:650;font-variant-numeric:tabular-nums;letter-spacing:-.3px;line-height:1.2}
.bignum small{font-size:15px;color:var(--muted);font-weight:500}
.wtools{display:none;position:absolute;top:8px;right:8px;gap:3px;z-index:2}
.wtools button{padding:2px 7px;font-size:12px;background:var(--panel);color:var(--text);border:1px solid var(--line2);font-weight:500}
.wtools button:hover{background:var(--panel2)}
.whandle{cursor:grab;padding:2px 6px;color:var(--muted);font-size:15px;line-height:1}
.dash-bar{display:none;position:sticky;top:0;z-index:20;background:var(--amber-bg);border:1px solid var(--amber-border);border-radius:var(--r);
  padding:10px 14px;margin-bottom:14px;align-items:center;gap:10px;flex-wrap:wrap;font-size:13.5px}
.spacer-flex{flex:1}
.dash-hidden{display:none}
body.dash-editing .dash-bar{display:flex}
body.dash-editing .dash-hidden{display:block}
body.dash-editing #dash-edit-btn{display:none}
body.dash-editing .wtools{display:flex}
body.dash-editing .widget{outline:2px dashed var(--line2);outline-offset:2px;cursor:move;padding-top:44px}
body.dash-editing .widget :is(input,select,textarea,button:not(.wtools button),a){pointer-events:none}
.widget.dragging{opacity:.4}
@media (max-width:1100px){.dash{grid-template-columns:repeat(2,minmax(0,1fr))}.widget.w4,.widget.w2{grid-column:span 2}}
@media (max-width:640px){.dash{grid-template-columns:1fr}.widget.w1,.widget.w2,.widget.w4{grid-column:span 1}
  .dash-head #dash-edit-btn{margin-left:0}}

/* ---------- печать (расчётный лист, отчёты) ---------- */
@media print{
  .side,.noprint,.presets,.tabs .btn,.dash-bar,#dash-edit-btn,.flash{display:none!important}
  .layout{background:#fff}
  body,main{background:#fff}
  main{padding:0;max-width:none}
  .card{box-shadow:none;border:0;padding:0}
}

/* ---------- телефон / узкий экран ---------- */
@media (max-width:900px){
  .layout{flex-direction:column;background:var(--bg)}
  /* шапка телефона: логотип + пользователь в одну строку, меню ниже с прокруткой */
  .side{width:auto;flex:none;height:auto;position:sticky;top:0;z-index:10;display:grid;grid-template-columns:minmax(0,1fr) auto;max-width:100vw}
  .logo{grid-row:1;grid-column:1;padding:10px 14px;border-bottom:0;font-size:14px}
  .logo small{display:none}
  .logo i{width:26px;height:26px;font-size:13px}
  .me{grid-row:1;grid-column:2;border-top:0;display:flex;align-items:center;gap:12px;padding:10px 14px;text-align:right}
  .me span{display:none}
  .me b{font-weight:500;font-size:13px;max-width:110px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .me .links{margin:0;gap:10px}
  .me .links a{display:none}
  .side nav{grid-row:2;grid-column:1/-1;display:flex;overflow-x:auto;min-width:0;padding:0 8px 8px;gap:2px;
    scrollbar-width:none;-webkit-overflow-scrolling:touch;border-top:1px solid #262a30;padding-top:6px}
  .side nav::-webkit-scrollbar{display:none}
  .side .grp{display:none}
  .side nav a{white-space:nowrap;border-left:0;border-bottom:2px solid transparent;border-radius:4px;padding:7px 11px;font-size:14px}
  .side nav a.on{border-bottom-color:var(--brand)}
  main{padding:16px 12px 50px}
  h1{font-size:19px;margin-bottom:14px}
  .card{padding:16px}
  .kpi{padding:12px 14px}
  .kpi .v{font-size:19px}
  .kpi .s{font-size:12px}
  .g2,.g2x,.kvgrid{grid-template-columns:1fr}
  .side nav a.mob{display:block}
  .g4,.g3{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .grid{gap:12px}
  /* 16px в полях — иначе iPhone приближает страницу при вводе */
  input,select,textarea{font-size:16px;padding:10px}
  button,.btn{padding:10px 16px}
  .sm{padding:6px 11px}
  th,td{padding:8px 10px}
  .presets .hrow{width:100%;margin-left:0!important}
  .sticky-total{gap:10px 18px;padding:12px 14px}
  .sticky-total button{width:100%}
  .sales-grid{grid-template-columns:1fr}
  .hide-m{display:none}
  .sticky-total{padding:10px 12px;gap:6px 16px}
  .sticky-total b{font-size:15px}
}
@media (max-width:380px){
  .g4,.g3{grid-template-columns:1fr}
}
}

.kv td{padding:8px 0}
.kv td:first-child{color:var(--muted)}
.kv tr:hover td{background:transparent}

/* ---------- права, iCafe, темы ---------- */
.permgrid{display:grid;gap:4px 28px;grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.permgrid h3{margin:10px 0 6px}
label.perm{display:flex;gap:8px;align-items:flex-start;color:var(--text);font-size:14px;margin:0 0 6px}
label.perm input{margin-top:3px}
.heat td{padding:0;text-align:center;font-size:11px;min-width:26px;height:26px;border:1px solid var(--panel)}
.heat th{font-size:11px;padding:4px;text-align:center;background:none;border:0}
.heat td.h{color:var(--btn-text)}
.hbar{display:flex;align-items:flex-end;gap:3px;height:140px;padding-bottom:20px;border-bottom:1px solid var(--line)}
.hbar div{flex:1;background:var(--bar);position:relative;min-height:1px;border-radius:2px 2px 0 0}
.hbar div span{position:absolute;bottom:-18px;left:50%;transform:translateX(-50%);font-size:10px;color:var(--muted)}
.ok-row td{background:transparent}
.bad{color:var(--red);font-weight:600}
.themes{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.themes label{margin:0;cursor:pointer}
.themes input{display:none}
.tcard{border:2px solid var(--line);border-radius:10px;overflow:hidden;background:var(--panel)}
.themes input:checked+.tcard{border-color:var(--accent);box-shadow:0 0 0 3px var(--focus)}
.tprev{display:flex;height:84px}
.tprev .s{width:34%}.tprev .m{flex:1;padding:10px;display:grid;gap:6px;align-content:start}
.tprev .m i{display:block;height:10px;border-radius:3px}
.tcard b{display:block;padding:8px 12px;color:var(--text);font-size:14px}
.icbox{background:var(--panel2);border:1px solid var(--line);border-radius:6px;padding:12px 14px;font-size:14px}

/* ---------- раздел «Смены» ---------- */
.shift-status{display:flex;align-items:center;gap:10px;font-size:15px;margin:0 0 22px;color:var(--muted)}
.shift-status b{color:var(--text)}
.dot{width:10px;height:10px;border-radius:50%;background:var(--line2);display:inline-block}
.dot.on{background:var(--accent);box-shadow:0 0 0 4px var(--accent-bg)}
.bigbtns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;max-width:760px}
.bigbtn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-height:190px;
  border-radius:14px;border:2px solid var(--line);background:var(--panel);color:var(--text);font-size:21px;font-weight:650;
  text-align:center;box-shadow:var(--shadow);transition:transform .08s, border-color .15s}
.bigbtn span{font-size:30px;width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:var(--panel2)}
.bigbtn small{font-size:13px;font-weight:400;color:var(--muted)}
a.bigbtn:hover{text-decoration:none;border-color:var(--accent);transform:translateY(-2px)}
.bigbtn.open span{background:var(--accent);color:var(--btn-text)}
.bigbtn.close span{background:var(--red);color:#fff}
.bigbtn.off{opacity:.5;cursor:not-allowed}
.center-link{max-width:760px;text-align:center;margin-top:22px}
.step{display:flex;gap:16px;margin-bottom:14px;max-width:980px}
.step.attn{border-color:var(--red)}
.stepn{flex:0 0 32px;height:32px;border-radius:50%;background:var(--accent);color:var(--btn-text);display:grid;place-items:center;font-weight:700}
.stepb{flex:1;min-width:0}
.stepb h2{margin-top:4px}
.readonly{padding:9px 10px;border:1px dashed var(--line2);border-radius:6px;background:var(--panel2);color:var(--text)}
.readonly.ok{color:var(--accent);border-style:solid;border-color:var(--ok-border);background:var(--accent-bg)}
.agree{display:flex;gap:8px;align-items:center;color:var(--text);margin:8px 0 12px;font-size:14.5px}
.stock-table input{max-width:100px;text-align:right;padding:6px 8px}
.stock-table input[readonly]{background:transparent;border-color:transparent;font-weight:600}
.stock-table tr.changed td{background:var(--amber-bg)}
.stock-total{margin-top:12px;padding:10px 14px;border-radius:6px;background:var(--red-bg);border:1px solid var(--err-border);color:var(--text)}
.stock-total b{color:var(--red)}
select.picker{font-weight:600;cursor:pointer;background:var(--panel2);max-width:520px}
.short-table tfoot td{border-top:2px solid var(--line2);background:var(--panel2)}
.filebox input[type=file]{background:var(--panel2)}
@media (max-width:640px){.bigbtns{grid-template-columns:1fr}.bigbtn{min-height:130px;font-size:19px}.step{gap:10px}.stepn{flex-basis:26px;height:26px;font-size:13px}}

.meterbox{margin:4px 0 8px;padding:12px 14px;border-radius:8px;background:var(--accent-bg);border:1px solid var(--ok-border);color:var(--text);font-size:15px}
.meterbox b{font-size:17px}
.meterbox.bad{background:var(--red-bg);border-color:var(--err-border);color:var(--red)}
.lastkwh{max-width:760px;text-align:center;margin:18px 0 0;color:var(--muted)}
.lastkwh b{color:var(--text)}

.backbtn{display:inline-flex;align-items:center;gap:6px;padding:9px 16px;margin:0 0 16px;border-radius:8px;
  background:var(--panel);border:1px solid var(--line2);color:var(--text);font-weight:600;font-size:14.5px}
.backbtn:hover{text-decoration:none;border-color:var(--accent);color:var(--accent)}
.backrow{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:16px}
.backrow .backbtn{margin:0}

.quitform{margin-top:10px}
.quitbtn{color:#e58b8b!important;font-size:13px}
.quitbtn:hover{color:#ff9b9b!important}
@media (max-width:900px){.quitform{display:none}}

/* долги: корзина и карточки сотрудников */
.debtform .picker{width:100%}
.qty{display:inline-flex;align-items:center;gap:4px}
.qty .q{width:64px;text-align:right}
.qty button{min-width:30px;padding:4px 0}
.tag.done{background:var(--accent-bg);border-color:var(--ok-border);color:var(--accent)}
.debtcards{display:grid;gap:10px}
.debtcard{background:var(--panel);border:1px solid var(--line);border-left:4px solid var(--red);border-radius:10px;overflow:hidden}
.debtcard.clear{border-left-color:var(--accent)}
.debtcard>summary{list-style:none;display:flex;align-items:center;gap:14px;padding:14px 16px;margin:0;cursor:pointer;color:var(--text);font-weight:400}
.debtcard>summary::-webkit-details-marker{display:none}
.debtcard>summary:hover{background:var(--panel2)}
.debtcard[open]>summary{border-bottom:1px solid var(--line);background:var(--panel2)}
.dc-ava{flex:0 0 42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:var(--accent-bg);color:var(--accent);font-weight:700;font-size:18px;border:1px solid var(--ok-border)}
.dc-who{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px}
.dc-who b{font-size:16px}
.dc-sum{flex:0 0 auto;display:flex;flex-direction:column;align-items:flex-end;text-align:right}
.dc-sum b{font-size:19px;white-space:nowrap}
.dc-arrow{flex:0 0 auto;color:var(--muted);transition:transform .15s}
.debtcard[open] .dc-arrow{transform:rotate(180deg)}
.dc-body{padding:12px 16px 16px}
.dc-body>form{margin-bottom:10px}
.dc-table tr.repaid td{color:var(--muted)}
.dc-table tr.dc-foot td{border-top:2px solid var(--line2);background:var(--panel2)}
@media (max-width:640px){.debtcard>summary{gap:10px;padding:12px}.dc-ava{flex-basis:34px;height:34px;font-size:15px}.dc-sum b{font-size:16px}.dc-body{padding:10px}}
.show-m{display:none}
.dc-time{margin-left:4px}
.dc-arrow::before{content:"";display:block;width:8px;height:8px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);margin-top:-4px}
.debtcard[open] .dc-arrow::before{transform:rotate(-135deg);margin-top:4px}
.debtcard[open] .dc-arrow{transform:none}
@media (max-width:640px){
  .show-m{display:table-cell}
  .dc-table td.when{white-space:normal}
  .dc-time{display:block;margin-left:0}
  .qty .q{width:48px}
  .qty button{min-width:26px}
  .short-table td,.short-table th,.dc-table td,.dc-table th{padding:8px 6px}
}

/* зарплата: период, детализация */
.payperiod{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;padding:12px 16px;margin-bottom:14px}
.pp-presets{display:flex;flex-wrap:wrap;gap:6px}
.pp-custom{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:0}
.pp-custom label{margin:0;flex:0 0 auto;min-width:0;color:var(--muted);font-size:13px}
.pp-custom input[type=date]{max-width:160px;padding:6px 8px}
.pp-now{margin-left:auto;font-size:14px;color:var(--muted)}
.pp-now b{color:var(--text)}
.pr-row{cursor:pointer}
.pr-row:hover td{background:var(--panel2)}
.pr-arrow{display:inline-block;width:8px;height:8px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(-45deg);margin:0 10px 2px 0;transition:transform .15s}
.pr-row.open .pr-arrow{transform:rotate(45deg)}
.pr-row.open td{background:var(--panel2)}
.pr-detail>td{background:var(--panel2);padding:4px 16px 16px 36px}
.pr-lines{width:100%}
.pr-lines th{background:transparent}
.pr-lines tr.pr-sum td{border-top:2px solid var(--line2)}
.tag.k-shift{background:var(--panel2)}
.tag.k-bonus{background:var(--accent-bg);border-color:var(--ok-border);color:var(--accent)}
.tag.k-fine,.tag.k-debt,.tag.k-short,.tag.k-minus{background:var(--red-bg);border-color:var(--err-border);color:var(--red)}
.histfilter{align-items:flex-end;padding:12px 16px;margin-bottom:14px}
.histfilter label{font-size:13px}
.repaybox{border:1px solid var(--line);border-radius:8px;padding:6px 14px 12px}
.repaybox[open]{background:var(--panel2)}
.dchk,#d_all{width:18px;height:18px;cursor:pointer}
@media (max-width:640px){.pp-now{margin-left:0;width:100%}.pr-detail>td{padding:4px 6px 12px}}
.pr-lines tr.off td{text-decoration:line-through;opacity:.45}
/* iCafe: смены кассиров */
table.ish tr.bad td{background:var(--red-bg)}
table.ish tr.weak td{background:var(--amber-bg)}
code.path{display:inline-block;margin:4px 0;padding:3px 8px;background:var(--panel2);border:1px solid var(--line);border-radius:5px;font-size:12.5px;word-break:break-all}

/* журнал iCafe и «Контроль» */
.jfilter{display:flex;flex-wrap:wrap;gap:8px 10px;align-items:flex-end;padding:12px 16px;margin-bottom:14px}
.jfilter>div{display:flex;flex-direction:column;min-width:0}
.jfilter label{font-size:12.5px;margin:0 0 3px}
.jfilter input,.jfilter select{padding:6px 8px;max-width:170px}
.jfilter .chk{flex-direction:row;display:flex;gap:5px;align-items:center;font-size:13px;margin:0 0 8px}
table.jt td{padding-top:6px;padding-bottom:6px;font-size:13.5px}
.jdet{max-width:420px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--muted)}
tr.ev-topup td,tr.ev-qrtopup td{background:var(--accent-bg)}
tr.ev-free td{background:var(--amber-bg)}
tr.ev-staff_update td,tr.ev-resetpassword td{background:var(--red-bg)}
.ctl-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;margin-bottom:6px}
.ctl-tile{display:flex;flex-direction:column;gap:2px;padding:12px 14px;border-radius:10px;border:1px solid var(--line);background:var(--panel);color:var(--text)}
.ctl-tile:hover{text-decoration:none;border-color:var(--accent)}
.ctl-tile .n{font-size:26px;font-weight:700;line-height:1.1}
.ctl-tile .t{font-size:13px;color:var(--muted)}
.ctl-tile.bad{border-color:var(--err-border);background:var(--red-bg)}
.ctl-tile.bad .n{color:var(--red)}
.ctl-tile.ok .n{color:var(--accent)}
.ctl-tile.none .n{color:var(--muted)}
.ctl h3{padding:0 20px;margin:16px 0 6px;font-size:15px}
.ctl-p{padding:0 20px;margin:0 0 10px}
.ctl tr.bad td{background:var(--red-bg)}
.ctl-more{padding:4px 20px 14px}
.ctl-more table{margin-top:8px}
.ctl-scroll{max-height:460px;overflow:auto}
.ctl-more .ctl-scroll{max-height:560px}

/* заявки */
.reqgrid{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}
.reqgrid>.f:nth-child(1){flex:0 0 150px}
.reqgrid>.f:nth-child(2){flex:0 1 300px}
#rpcbox{flex:0 0 170px}
.reqgrid .rtext{flex:1 1 260px}
.reqgrid .rbtn{flex:0 0 auto}
.reqgrid .f{margin:0}
.reqgrid .rbtn button{height:42px}
.reqcol h2{margin-bottom:10px}
.req{border:1px solid var(--line);border-left:4px solid var(--amber);border-radius:8px;padding:10px 12px;margin:0 0 10px;background:var(--panel)}
.req.st-work{border-left-color:var(--blue)}
.req.st-done{border-left-color:var(--accent);opacity:.75}
.req.st-rejected{border-left-color:var(--red);opacity:.6}
.req-top{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.req-cat{font-weight:600;font-size:14px}
.req-date{margin-left:auto;color:var(--muted);font-size:12.5px}
.req-text{margin:6px 0 4px;font-size:15px}
.req-adm{display:flex;gap:6px;margin-top:8px;flex-wrap:wrap}
.req-adm select{max-width:140px}
.req-adm input{flex:1;min-width:120px}
.tag.pcbadge{background:var(--night-bg);border-color:var(--night-border);color:var(--blue)}
@media (max-width:640px){.reqgrid>.f,#rpcbox,.reqgrid .rtext,.reqgrid .rbtn{flex:1 1 100%}.reqgrid .rbtn button{width:100%}}
.req-answer{margin-top:8px;padding:8px 12px;border-radius:8px;background:var(--accent-bg);border:1px solid var(--ok-border);color:var(--text);font-size:14.5px}
.req-answer .ra-who{display:block;font-size:12px;font-weight:600;color:var(--accent);margin-bottom:2px}
@media (max-width:640px){.reqgrid>.f:nth-child(1),.reqgrid>.f:nth-child(2){flex:1 1 100%}}

/* склад */
.stock-actions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.sa-card h2{display:flex;align-items:center;gap:8px}
.sa-ico{display:inline-flex;width:26px;height:26px;border-radius:50%;align-items:center;justify-content:center;font-size:15px;font-weight:700}
.sa-ico.in{background:var(--accent-bg);color:var(--accent)}
.sa-ico.new{background:var(--night-bg);color:var(--blue)}
.sa-ico.out{background:var(--red-bg);color:var(--red)}
.sa-card textarea{width:100%}
@media (max-width:1100px){.stock-actions{grid-template-columns:1fr}}
.rep-range{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:flex-end;padding:12px 16px;margin:0 0 14px}
.rep-range label{font-size:12.5px;margin:0 0 3px}
.rep-range .hrow{flex-wrap:nowrap;gap:6px}
.rep-range input[type=date]{max-width:160px}.rep-range input[type=time]{max-width:140px;min-width:120px}
.rep-range .muted{flex:1 1 260px}
.qtytag{display:inline-block;margin-left:4px;padding:0 7px;border-radius:4px;background:var(--panel2);border:1px solid var(--line);color:var(--text);font-size:12px;white-space:nowrap}

/* ---------- график смен ---------- */
.sch-nav{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:12px}
.sch-nav .sch-week{font-size:16px;padding:0 6px}
.sch-nav input[type=date]{width:auto;padding:5px 8px}
.sch-nav form.inline{display:inline-flex}
.sched{min-width:760px}
.sched th,.sched td{text-align:center;vertical-align:middle;padding:7px 5px}
.sched th span{display:block;font-weight:400;color:var(--muted);font-size:12px}
.sched .l{text-align:left;min-width:150px}
.sched td.l b,.sched td.l span{display:block}
.sched td.today,.sched th.today{background:var(--accent-bg)}
.sched th.we{color:var(--red,#c0392b)}
.sched tr.me td.l b{color:var(--accent)}
.sched select.sc{width:auto;min-width:84px;padding:5px 6px;font-size:13px}
.sched select.sc[data-v=day]{background:var(--amber-bg);border-color:var(--amber-border);color:var(--amber)}
.sched select.sc[data-v=night]{background:var(--night-bg);border-color:var(--night-border);color:var(--blue)}
.sched select.sc[data-v=both]{background:var(--accent-bg);border-color:var(--ok-border);color:var(--accent);font-weight:600}
.sb{display:inline-block;padding:3px 9px;border-radius:999px;font-size:12px;font-weight:600;border:1px solid}
.sb.day{background:var(--amber-bg);border-color:var(--amber-border);color:var(--amber)}
.sb.night{background:var(--night-bg);border-color:var(--night-border);color:var(--blue)}
.sb.both{background:var(--accent-bg);border-color:var(--ok-border);color:var(--accent)}
.sched tfoot td{font-size:13px;line-height:1.35;border-top:1px solid var(--line2)}
.sched tfoot tr.sum td.l .sb{margin-right:6px}
.sched tfoot td .cash{font-weight:700}
.sched tfoot td.nocash{background:var(--red-bg,#fdecec);color:var(--red,#c0392b)}
.sched tfoot td.now{outline:2px solid var(--accent);outline-offset:-2px}
.sched td.cnt{color:var(--muted)}
.print-only{display:none}
@media print{.print-only{display:block}.sched select.sc{border:0;appearance:none;background:none!important}.sticky-total{display:none!important}}
/* ---------- на смене (главная) ---------- */
.duty{display:flex;gap:14px;align-items:center;flex-wrap:wrap;padding:14px 18px;margin-bottom:16px;border-left:4px solid var(--accent)}
.duty .ico{font-size:22px}
.duty .who{font-size:17px}
.duty .who b{font-size:18px}
.duty .role{color:var(--muted);font-size:13px}
.duty .meta{color:var(--muted);font-size:13px;margin-top:2px}
.duty .nxt{margin-left:auto;text-align:right;font-size:13px;color:var(--muted)}
.duty.duty-warn{border-left-color:var(--amber)}
.duty .alertline{color:var(--amber);font-size:13px;margin-top:3px}
@media (max-width:900px){.duty .nxt{margin-left:0;text-align:left}}
.sched td.l span.sb{display:inline-block}
@media (max-width:900px){.duty .ico{display:none}}
.sch-sum{padding:0}
.sch-sum>summary{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:14px 18px;cursor:pointer;list-style:none}
.sch-sum>summary::-webkit-details-marker{display:none}
.sch-sum>summary::before{content:"▸";color:var(--muted);transition:transform .15s}
.sch-sum[open]>summary::before{transform:rotate(90deg)}
.sch-sum .sum-t{font-weight:700;font-size:15px}
.sch-sum .sum-s{font-size:13px}
.sch-sum .sum-h{margin-left:auto}
.sch-sum[open] .sum-h{display:none}
.sch-sum>.tw,.sch-sum>p{padding:0 18px 14px}
.sched-sum{min-width:700px}
.sched-sum tbody td{font-size:13px;line-height:1.35;height:52px}
.sched-sum td .cash{font-weight:700}
.sched-sum td.nocash{background:var(--red-bg,#fdecec);color:var(--red,#c0392b)}
.sched-sum td.now{outline:2px solid var(--accent);outline-offset:-2px}
.sched-sum td.l .sb{margin-right:6px}
@media print{.sch-sum .sum-h{display:none}.sch-sum>summary::before{display:none}}
.sch-sum .sum-t{color:var(--text)}
@media (min-width:1101px){.sticky-total.sch-bar{flex-wrap:nowrap}.sticky-total.sch-bar button{width:auto;white-space:nowrap}}
.danger-zone>summary{color:var(--red);cursor:pointer}.danger-zone{padding:14px 20px}
/* ---------- регулярные платежи / кредит ---------- */
.credit-card{border-left:4px solid var(--blue)}
.credit-card.off{opacity:.65;border-left-color:var(--line2)}
.cc-head{display:flex;gap:12px;align-items:flex-start;flex-wrap:wrap}
.cc-actions{margin-left:auto;display:flex;gap:6px}
.credit-card .kpi{padding:10px 0}
.seg{display:flex;gap:8px;flex-wrap:wrap}
.seg label{display:flex;gap:8px;align-items:center;padding:9px 14px;border:1px solid var(--line2);border-radius:10px;cursor:pointer;margin:0;color:var(--text);font-size:14px}
.seg label:has(input:checked){border-color:var(--accent);background:var(--accent-bg)}
.seg input{width:auto}
.info-line{padding:10px 14px;border-radius:10px;background:var(--night-bg);border:1px solid var(--night-border);font-size:14px}
.code-like{font-family:ui-monospace,Consolas,monospace;background:var(--panel2);border:1px solid var(--line);padding:2px 8px;border-radius:6px}