/* Mobile layout and accessible controls using the classic CRM palette. */
.nav-sheet{width:min(560px,calc(100% - 24px));max-height:85dvh;padding:22px;border:1px solid var(--line);border-radius:20px;background:var(--surface);color:var(--ink);box-shadow:var(--shadow-h)}
.nav-sheet::backdrop{background:rgba(25,24,23,.45);backdrop-filter:blur(3px)}
.nav-sheet-head{display:flex;align-items:center;justify-content:space-between;gap:12px;position:sticky;top:-22px;background:var(--surface);padding:10px 0;z-index:1}
.nav-sheet-head h2{font-size:22px;margin:0}
.nav-sheet-section h3{font-size:12px;color:var(--ink-2);margin:22px 0 9px;text-transform:uppercase;letter-spacing:.09em}
.nav-sheet-section>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.nav-sheet-link{font:inherit;font-size:14px;text-align:left;min-height:48px;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--surface-2);color:var(--ink);cursor:pointer}
.nav-sheet-link.on{border-color:var(--accent);color:var(--accent-ink);background:var(--accent-soft)}
:where(button,a,input,select,summary):focus-visible{outline:3px solid var(--accent);outline-offset:3px}
@media(max-width:760px){
  .app-inner{gap:8px;min-height:66px}
  .brand{min-width:0}
  .brand .sub{display:none}
  .brand .logo{font-size:17px;white-space:nowrap}
  .profile{width:40px;min-width:40px;height:44px;padding:8px}
  .bnav{padding:8px 8px calc(8px + env(safe-area-inset-bottom));gap:4px}
  .bnav-item{min-width:0;min-height:48px;gap:5px;padding:4px 2px;font-size:10px}
  .bnav-item svg{width:21px;height:21px}
  main{padding:10px 14px calc(100px + env(safe-area-inset-bottom))}
  .btn,.chip,.tab,.nav-sheet-link{min-height:44px}
  .btn.sm{min-height:40px}
  input:not([type="checkbox"]):not([type="radio"]),select,textarea{font-size:16px!important;max-width:100%}
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]),select{min-height:44px}   /* поля — той же высоты, что кнопки и чипы (look-gloss, 24.09.2026) */
  .toolbar{gap:8px}
  .periods{flex-wrap:nowrap;overflow-x:auto;max-width:100%;padding-bottom:5px;scrollbar-width:thin}
  .periods .chip{flex:none}
  .tabs{scroll-padding:12px}
  .sk-form .sk-form-actions,.sk-doc .sk-form-actions{position:sticky;bottom:calc(78px + env(safe-area-inset-bottom));z-index:21;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:10px;box-shadow:var(--shadow)}
  /* закреплённая кнопка не должна накрывать последнюю строку — оставляем под ней воздух (Benny 18.09.2026) */
  .sk-form:has(.sk-form-actions),.sk-doc:has(.sk-form-actions){padding-bottom:96px}
  .sk-doc .tbl-wrap:last-of-type{margin-bottom:10px}
  .sk-form-actions .hint{flex-basis:100%;overflow-wrap:anywhere}
  .sk-form-actions .hint:empty{display:none}
  .nav-sheet{margin:auto auto 12px;max-height:85dvh;padding:18px;border-radius:22px}
  .nav-sheet-head{top:-18px}
}
@media(max-width:360px){.app-inner{padding:8px 10px;gap:5px}.profile{min-width:34px;width:34px}.brand .logo{font-size:15px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}
@media print{.bnav,.nav-sheet,.profile{display:none!important}.sk-form .sk-form-actions,.sk-doc .sk-form-actions{position:static}}

button,a,summary{touch-action:manipulation}
.nav-sheet{overscroll-behavior:contain}
@media(max-width:760px){
  .sk-editor .sk-scan{flex-wrap:wrap;gap:6px}
  .sk-editor .sk-scan input{min-width:0;width:calc(100% - 30px)}
  .sk-editor [data-sk-id="skScanMsg"]{flex-basis:100%}
  .sk-editor .sk-tbl{display:block;min-width:0;width:100%}
  .sk-editor .sk-tbl thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .sk-editor .sk-tbl tbody{display:block}
  .sk-editor .sk-tbl .sk-entry{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"thumb remove" "article article" "name name" "variant stock" "qty price" "sum sum";gap:7px 14px;margin:10px 0;padding:14px;border:1px solid var(--line);border-radius:12px;background:var(--surface);position:relative}
  .sk-editor .sk-entry td{display:block;border:0;padding:0;white-space:normal;text-align:left;min-width:0;overflow-wrap:anywhere}
  .sk-editor .sk-entry td[data-field="thumb"]{grid-area:thumb}
  .sk-editor .sk-entry td[data-field="article"]{grid-area:article;font-size:12px;color:var(--ink-2)}
  .sk-editor .sk-entry td[data-field="name"]{grid-area:name;font-weight:600;font-size:16px;padding-right:25px}
  .sk-editor .sk-entry td[data-field="variant"]{grid-area:variant;color:var(--ink-2)}
  .sk-editor .sk-entry td[data-field="stock"]{grid-area:stock;text-align:right}
  .sk-editor .sk-entry td[data-field="qty"]{grid-area:qty}
  .sk-editor .sk-entry td[data-field="price"]{grid-area:price}
  .sk-editor .sk-entry td[data-field="sum"]{grid-area:sum;text-align:right;font-size:18px;font-weight:600;padding-top:6px}
  .sk-editor .sk-entry td[data-field="remove"]{grid-area:remove;position:absolute;right:4px;top:4px}
  .sk-editor .sk-entry td[data-label]::before{content:attr(data-label);display:block;font-size:11px;color:var(--ink-2);margin-bottom:4px}
  .sk-editor .sk-entry input[type=number]{width:100%;min-height:44px;text-align:left;padding:8px 12px}
  .sk-editor .sk-tbl tfoot{display:block;background:var(--surface-2);border-radius:10px;padding:12px}
  .sk-editor .sk-tbl tfoot tr{display:flex;gap:10px;align-items:center}
  .sk-editor .sk-tbl tfoot td{border:0;padding:0;white-space:normal}
  .sk-editor .sk-tbl tfoot td:nth-child(2)::after{content:" шт"}
  .sk-editor .sk-tbl tfoot td:nth-child(4){margin-left:auto;font-size:18px}
  .sk-editor .sk-tbl tfoot td:empty{display:none}
  .sk-editor .sk-tbl tbody>tr:not(.sk-entry){display:block;padding:12px 0}
  .sk-editor .sk-tbl tbody>tr:not(.sk-entry)>td{display:block;white-space:normal}
  .sk-pay label{display:flex;align-items:center;min-height:44px;gap:5px}
  .sk-editor :is(input,button,select){scroll-margin-bottom:180px}
}

/* Результат сканирования: длинное название переносится внутри экрана телефона. */
@media(max-width:760px){
  .sk-home{grid-template-columns:minmax(0,1fr)}
  .sk-home-main,.sk-home-side{min-width:0}
  div.sk-pick{width:100%;min-width:0;max-width:100%}
  .sk-pick .sk-pick-item{max-width:100%;white-space:normal;text-align:left}
  .sk-pick-item>.sk-thumb{flex-shrink:0}
  .sk-pick-item>span:last-child{min-width:0;overflow-wrap:anywhere}
}
@media(max-width:380px){
  .sk-editor .sk-tbl .sk-entry{grid-template-areas:"thumb remove" "article article" "name name" "variant stock" "qty qty" "price price" "sum sum"}
  .sk-editor .sk-entry .sk-step input.sk-qty{padding:8px 4px;min-width:48px;text-align:center}
}