/*!
 * shell.css — единый каркас страниц входа, «вход не настроен» и ошибок 403/404/500 для всех модулей Svitex.
 * Подключать ПОСЛЕ svitex-erp-ui.css → disk.css (блок .dk-auth, как на портале) → header.css (общая шапка .svx-hd).
 * Ничего не рисует заново: только соединяет готовые части и добавляет
 *  1) меню модулей на знаке SVITEX без JS (чекбокс + :hover/:focus-visible/:focus-within);
 *  2) тёмную тему без JS (prefers-color-scheme), если JS не поставил html.light;
 *  3) сцены конвейера из pages/{404,403,error}.html, перекрашенные в токены (работают в тёмной теме).
 * Модуль задаётся body[data-module] и --svx-service; всё остальное общее.
 */
/* ── 0. Тёмная тема без JS: копия токенов html.dark из svitex-erp-ui.css ── */
@media (prefers-color-scheme:dark){html:not(.light){
  --svx-ink:#EDEDED; --svx-mid:#A3A3A3; --svx-faint:#8F8F8F; --svx-light:#5E5E5E; --svx-hair:#3A3A3A;
  --svx-ctl:#6E6E6E; --svx-row-line:#262626;
  --svx-ink-hover:#D4D4D4; --svx-hover-bg:#222222; --svx-sel-bg:#2A2A2A;
  --svx-focus-ring:#333333; --svx-error-bg:#1F1F1F; --svx-bg:#171717; --svx-field:#1C1C1C;
  --svx-on-ink:#171717; --svx-backdrop:rgba(0,0,0,.6);
  --raised:#1C1C1C; color-scheme:dark}}
html.light{color-scheme:light}
@media (prefers-color-scheme:dark){html:not(.light) .svx-hd-theme .moon{display:none}html:not(.light) .svx-hd-theme .sun{display:block}}

/* ── 1. Страница ── */
body.sh{margin:0;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;background:var(--svx-bg);color:var(--ink);font-family:var(--font)}
.sh .dk-auth{flex:1;min-height:0;grid-template-rows:1fr auto;width:100%;max-width:1280px;margin:0 auto;box-sizing:border-box}
.sh .dk-auth>footer{grid-column:1/-1}

/* ── 2. Шапка: только знак с меню модулей + (с JS) кнопка темы. Поиск, чат, модули-плитки, аватар — после входа ── */
.sh-hd .svx-hd-brand{cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent;gap:4px;height:40px}
.sh-sw{position:relative;display:flex;align-items:center}
.sh-sw-t{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.sh-sw-t:focus-visible+.svx-hd-brand{outline:2px solid var(--ink);outline-offset:4px;border-radius:6px}
/* Закрыто — visibility:hidden (не в порядке Tab). Задержка скрытия 0.12s нужна, чтобы фокус успел перейти
   с чекбокса на первый пункт меню: без неё меню исчезает в момент blur и фокус падает на body. */
.sh-menu{display:block;visibility:hidden;opacity:0;transition:visibility 0s .12s,opacity .12s;animation:none}
.sh-sw-t:checked~.sh-menu,.sh-sw-t:focus-visible~.sh-menu,.sh-menu:focus-within{visibility:visible;opacity:1;transition-delay:0s}
@media (hover:hover) and (min-width:901px){.sh-sw:hover .sh-menu{visibility:visible;opacity:1;transition-delay:0s}
  .sh-sw:hover::after{content:"";position:absolute;left:-14px;top:100%;width:360px;height:12px}}
.sh-sw.sh-x .sh-menu{visibility:hidden!important;opacity:0!important;transition:none!important}
.sh-sw-t:checked+.svx-hd-brand .svx-hd-chev{transform:rotate(180deg);color:var(--ink)}
@media (hover:hover) and (min-width:901px){.sh-sw:hover .svx-hd-chev{transform:rotate(180deg);color:var(--ink)}}
.sh-menu .svx-mi .here{margin-left:auto}
.svx-hd-theme[hidden]{display:none!important}

/* ── 3. Hero модуля (левая колонка .art, как на портале) ── */
.sh-name{margin:0;display:flex;align-items:center;justify-content:center;gap:10px;font-size:30px;line-height:1.15;font-weight:700;letter-spacing:-.01em;text-align:center}
.sh-name .sh-ld{width:40px;height:40px;flex:none}
.sh-name .svx-hd-i{width:28px;height:28px}
.sh .pt-login-art{display:grid;place-items:center;width:100%}
.sh .pt-login-art svg{width:160px;height:160px}
.pt-login-mods{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:8px}
.pt-login-mods li{display:inline-flex;align-items:center;gap:6px;padding:4px 12px 4px 8px;border-radius:var(--svx-r-pill);box-shadow:inset 0 0 0 1.5px var(--svx-ctl);font-size:13px;font-weight:600;color:var(--ink)}
.pt-login-mods .pt-i{width:16px;height:16px}

/* ── 4. Карточка (блок «Войти» с портала; на страницах ошибок — текст и кнопки) ── */
.sh .card a.submit{display:block;box-sizing:border-box;text-align:center;text-decoration:none}
.sh-actions{display:grid;gap:10px;margin-top:8px}
.sh-actions .submit{margin-top:0}
.sh-btn,.sh-link{font-family:var(--font)}
.sh-btn{display:block;box-sizing:border-box;padding:10px 20px;font-size:16px;font-weight:600;text-align:center;text-decoration:none;color:var(--ink);background:var(--svx-bg);
  border:2px solid var(--svx-ctl);border-radius:var(--svx-r-pill);transition:background var(--svx-t),border-color var(--svx-t)}
.sh-btn:hover{background:var(--svx-hover-bg);border-color:var(--ink)}
.sh-btn:focus-visible,.sh-link:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.sh-link{justify-self:center;padding:6px 2px;font-size:15px;color:var(--muted);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1.5px}
.sh-link:hover{color:var(--ink)}
.sh-code{display:inline-block;margin:0 0 10px;padding:2px 10px;border-radius:var(--svx-r-pill);box-shadow:inset 0 0 0 1.5px var(--svx-ctl);font:700 12px/1.6 var(--mono);letter-spacing:.04em;color:var(--ink)}
.sh .card .alt.meta{font:12px/1.4 var(--mono);color:var(--muted)}
.sh .err-box .svx-err{display:flex;gap:8px;align-items:flex-start}

/* ── 5. Сцены конвейера (из pages/*.html), цвета → токены ── */
.sh .art .scene{max-width:620px}
.scene{width:100%;max-width:620px;height:auto;display:block;margin:0 auto}
.scene *{vector-effect:non-scaling-stroke}
.scene .dk,.scene .md,.scene .lt,.scene .xl,.scene .ghost{fill:var(--svx-bg);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.scene .dk{stroke:var(--svx-ink)}.scene .md{stroke:var(--svx-mid)}.scene .lt{stroke:var(--svx-light);fill:none}.scene .xl{stroke:var(--svx-hair);fill:none;stroke-width:1.5}
.scene .ghost{stroke:var(--svx-light);fill:none;stroke-dasharray:5 6}
.scene .marks{animation:mk 2s linear infinite}@keyframes mk{to{transform:translateX(40px)}}
.scene .roll{transform-box:fill-box;transform-origin:50% 50%;animation:rl 2s linear infinite}@keyframes rl{to{transform:rotate(360deg)}}
.scene .boxride{animation:ride 1s ease-in-out infinite}@keyframes ride{0%,100%{transform:translateY(0)}50%{transform:translateY(-1.5px)}}
.scene .flapl{transform-box:fill-box;transform-origin:0% 100%;animation:fl 2s ease-in-out infinite}
.scene .flapr{transform-box:fill-box;transform-origin:100% 100%;animation:fr 2s ease-in-out infinite}
@keyframes fl{0%,100%{transform:rotate(0)}50%{transform:rotate(8deg)}}@keyframes fr{0%,100%{transform:rotate(0)}50%{transform:rotate(-8deg)}}
.scene .qmark{animation:q 2s ease-in-out infinite}@keyframes q{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.scene .ghostp path{animation:ants 2s linear infinite}@keyframes ants{to{stroke-dashoffset:-22}}
.scene .ghostp{animation:gp 3s ease-in-out infinite}@keyframes gp{0%,100%{opacity:1}50%{opacity:.35}}
.scene .boxbump{animation:bump 2s ease-in-out infinite}@keyframes bump{0%,100%{transform:translateX(0)}45%{transform:translateX(7px)}60%{transform:translateX(0)}}
.scene .arm{transform-box:fill-box;transform-origin:100% 50%;animation:am 2s ease-in-out infinite}@keyframes am{0%,100%{transform:rotate(0)}45%{transform:rotate(-1.5deg)}}
.scene .lock{transform-box:fill-box;transform-origin:50% 100%;animation:lk 2s ease-in-out infinite}@keyframes lk{0%,40%,100%{transform:rotate(0)}48%{transform:rotate(-4deg)}56%{transform:rotate(4deg)}64%{transform:rotate(-2deg)}}
.scene .ghostp path,.scene .ghostp circle,.scene .ghostp rect{animation:ants 2s linear infinite}@keyframes ants{to{stroke-dashoffset:-22}}
.scene .warn{animation:wb 1.2s steps(1) infinite}@keyframes wb{0%{opacity:1}50%{opacity:.2}}
.scene .wrench{transform-box:fill-box;transform-origin:50% 100%;animation:wr 2.5s ease-in-out infinite}
@keyframes wr{0%,100%{transform:rotate(0)}50%{transform:rotate(-5deg)}}
.scene .gearg{transform-box:fill-box;transform-origin:50% 50%;animation:gr 3s ease-in-out infinite}
@keyframes gr{0%,100%{transform:rotate(0)}50%{transform:rotate(14deg)}}
.scene .smoke{opacity:0;animation:sm 3s ease-out infinite}.scene .s2{animation-delay:-1.5s}
@keyframes sm{0%{opacity:0;transform:translateY(8px)}30%{opacity:1}100%{opacity:0;transform:translateY(-14px)}}
.scene [fill="#fff"]{fill:var(--svx-bg)}

/* ── 6. Телефон ── */
@media (max-width:900px){
  .sh .dk-auth{display:block;padding:0 16px}
  .sh .art{padding:20px 0 12px;gap:14px}
  .sh .pt-login-art svg{width:96px;height:96px}
  .sh-name{font-size:24px}.sh-name .sh-ld{width:32px;height:32px}
  .sh .dk-auth .tag{display:block;font-size:15px}  /* портал прячет .tag на телефоне; здесь это текст модуля — показываем */
  .sh .card{padding:20px 18px 18px;margin-bottom:8px}
  .sh .dk-auth h1{font-size:24px}
}

/* ── 7. Движение, контраст, печать ── */
@media (prefers-reduced-motion:reduce){.scene *,.scene,.sh .svx-ld *{transition:none!important}  /* hero движется и при reduced-motion: это часть дизайна (решение 10.11.2026) */
  /* svitex-erp-ui.css гасит все transition через *{…!important}; задержку скрытия меню (не анимация) возвращаем */
  .sh-menu{transition:visibility 0s .12s!important}.sh-sw-t:checked~.sh-menu,.sh-menu:focus-within,.sh-sw-t:focus-visible~.sh-menu,.sh-sw:hover .sh-menu,.sh-sw.sh-x .sh-menu{transition:none!important}}
@media (forced-colors:active){.sh-sw-t:focus-visible+.svx-hd-brand{outline-color:Highlight}}
@media print{.sh-hd .sh-menu,.svx-hd-theme{display:none!important}}

/* ── 8. Доступ, сессия, мета ── */
.sh-meta{margin:12px 0 16px;padding:0;display:grid;gap:10px}
.sh-meta>div{display:grid;gap:2px}
.sh-meta dt{margin:0;font-size:12px;font-weight:600;color:var(--muted);letter-spacing:.02em}
.sh-meta dd{margin:0;font-size:15px;color:var(--ink)}
.sh-meta code,.sh-mail code{font:13px/1.4 var(--mono);padding:1px 6px;border-radius:6px;box-shadow:inset 0 0 0 1.5px var(--svx-ctl)}
.sh-field{display:grid;gap:6px;margin:0 0 14px;font-size:14px;font-weight:600;color:var(--ink)}
.sh-field .opt{font-weight:500;color:var(--muted)}
.sh-field textarea{font:15px/1.4 var(--font);padding:10px 12px;border:2px solid var(--svx-ctl);border-radius:12px;background:var(--svx-field,var(--svx-bg));color:var(--ink);resize:vertical;min-height:72px}
.sh-field textarea:focus-visible{outline:2px solid var(--ink);outline-offset:2px;border-color:var(--ink)}
.sh-note{margin:0 0 12px;padding:10px 12px;border-radius:12px;box-shadow:inset 0 0 0 1.5px var(--svx-ctl);font-size:14px;color:var(--ink)}
.sh .card button.submit{width:100%;cursor:pointer;border:0}

/* ── 9. Широкая витрина (notifications / approvals) ── */
.sh-auth-wide.dk-auth{max-width:1100px}
.sh-wide{max-width:100%}
.sh-h2{margin:22px 0 10px;font-size:16px;font-weight:700}
.sh-mail{margin:0 0 14px;padding:14px 16px;border-radius:14px;box-shadow:inset 0 0 0 1.5px var(--svx-ctl)}
.sh-mail-h{margin:0 0 8px;font-weight:700}
.sh-mail-acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.sh-pre{margin:0;padding:12px 14px;border-radius:12px;box-shadow:inset 0 0 0 1.5px var(--svx-ctl);font:12px/1.45 var(--mono);white-space:pre-wrap;color:var(--ink);background:var(--svx-field,var(--svx-bg));overflow:auto}
.sh-demo-toast{margin:0 0 16px;padding:12px 14px;border-radius:var(--svx-r-pill);box-shadow:inset 0 0 0 2px var(--ink);font-size:14px;font-weight:600;text-align:center}
.sh-demo-toast a{color:var(--ink);font-weight:700}

/* ── 10. Колокольчик и выпадающий список ── */
.sh-bell{position:relative}
.sh-bell-n{position:absolute;top:2px;right:2px;min-width:16px;height:16px;padding:0 4px;border-radius:999px;background:var(--ink);color:var(--svx-on-ink,#fff);font:700 10px/16px var(--font);text-align:center}
.sh-ntf{position:absolute;right:12px;top:52px;z-index:40;width:min(360px,calc(100vw - 24px));padding:10px;border-radius:14px;background:var(--svx-bg);box-shadow:inset 0 0 0 2px var(--svx-ctl),0 12px 32px var(--svx-backdrop,rgba(0,0,0,.12))}
.sh-ntf-h{margin:4px 8px 10px;font-size:13px;font-weight:700}
.sh-ntf-list{list-style:none;margin:0;padding:0;display:grid;gap:6px;max-height:320px;overflow:auto}
.sh-ntf-i{display:grid;gap:8px;padding:10px;border-radius:12px;box-shadow:inset 0 0 0 1.5px var(--svx-hair)}
.sh-ntf-i.new{box-shadow:inset 0 0 0 1.5px var(--ink)}
.sh-ntf-i .tx{font-size:13px;line-height:1.35}
.sh-ntf-i .acts{display:flex;flex-wrap:wrap;gap:6px}
.sh-ntf-all{display:block;margin:8px 8px 2px;font-size:13px;color:var(--muted);text-align:center}
.sh-mini{font:600 13px var(--font);padding:6px 12px;border-radius:var(--svx-r-pill);border:2px solid var(--ink);background:var(--ink);color:var(--svx-on-ink,#fff);cursor:pointer;text-decoration:none}
.sh-mini.ghost,.a.sh-mini.ghost{background:var(--svx-bg);color:var(--ink);border-color:var(--svx-ctl)}
a.sh-mini{display:inline-block;box-sizing:border-box;color:var(--svx-on-ink,#fff)}

/* ── 11. Approvals table ── */
.sh-filters{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px}
.sh-chip{font:600 13px var(--font);padding:6px 12px;border-radius:var(--svx-r-pill);border:1.5px solid var(--svx-ctl);background:var(--svx-bg);color:var(--ink);cursor:pointer}
.sh-chip.on{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.sh-table-wrap{overflow:auto;margin:0 -4px;padding:0 4px}
.sh-table{width:100%;border-collapse:collapse;font-size:13px}
.sh-table th,.sh-table td{padding:10px 8px;border-bottom:1.5px solid var(--svx-hair);text-align:left;vertical-align:top}
.sh-table th{font-size:12px;color:var(--muted);font-weight:700}
.sh-table .muted{color:var(--muted);font-size:12px}
.sh-table .acts{white-space:nowrap}
.sh-pill{display:inline-block;padding:2px 10px;border-radius:999px;font:700 12px/1.6 var(--font);box-shadow:inset 0 0 0 1.5px var(--svx-ctl)}
.sh-pill.ok{box-shadow:inset 0 0 0 1.5px var(--ink)}
@media (max-width:900px){
  .sh-ntf{right:8px;top:48px}
  .sh-table th:nth-child(3),.sh-table td:nth-child(3){display:none}
}

/* ── 12. Решение Александра 10.11.2026: довходовый хедер без меню, подпись, спрайт без inline style, --svx-service без <style> ── */
.sh-sprite{position:absolute;width:0;height:0;overflow:hidden}
body.sh[data-module="svitex"]{--svx-service:none}
body.sh[data-module="arm"]{--svx-service:"arm"}
body.sh[data-module="drive"]{--svx-service:"drive"}
body.sh[data-module="chat"]{--svx-service:"chat"}
body.sh[data-module="colors"]{--svx-service:"colors"}
body.sh[data-module="id"]{--svx-service:"id"}
body.sh[data-module="logistics"]{--svx-service:"logistics"}
body.sh[data-module="sales"]{--svx-service:"sales"}
body.sh[data-module="tasks"]{--svx-service:"tasks"}
body.sh[data-module="production"]{--svx-service:"production"}
body.sh[data-module="stock"]{--svx-service:"stock"}
body.sh[data-module="reports"]{--svx-service:"reports"}

.sh-hd-guest{display:flex;align-items:center;gap:8px}
.sh-hd-guest .sh-wordmark{display:flex;align-items:center;height:40px;margin-right:12px;padding:0;color:var(--ink);text-decoration:none}
.sh-hd-guest .svx-hd-theme{display:inline-grid;place-items:center} /* видна и без JS; переключает только shell.js */

/* ── 13. Выбор организации, одобрение, неизвестное приложение, таймер ── */
.sh-orgs{list-style:none;margin:0 0 16px;padding:0;display:grid;gap:8px}
.sh-orgs label{display:grid;grid-template-columns:auto 1fr;gap:2px 10px;align-items:center;padding:12px 14px;border-radius:14px;box-shadow:inset 0 0 0 1.5px var(--svx-ctl);cursor:pointer}
.sh-orgs label:has(input:checked){box-shadow:inset 0 0 0 2px var(--ink)}
.sh-orgs input{grid-row:1/span 2;accent-color:var(--ink)}
.sh-orgs .nm{font-weight:700}
.sh-orgs .ds{grid-column:2;font-size:13px;color:var(--muted)}
.sh-tline-80{--left:80%}
.sh-tline-87{--left:87%}
.sh-count{font:700 14px/1.4 var(--font)}
.sh[data-page="approvals"] .dk-auth,.sh-auth-wide.dk-auth{grid-template-columns:minmax(0,1fr);max-width:1100px}
.sh[data-page="approvals"] .art{display:none}
.sh-auth-wide .card.sh-wide{width:100%;max-width:none;box-sizing:border-box}
.sh-deny-reason{margin-top:8px}
.sh-hd[data-svx-header-mode="authed"] .sh-sw{position:relative}

.svx-auth-wrap{align-self:center;display:flex;flex-direction:column;align-items:stretch;gap:12px;width:100%;max-width:var(--svx-auth-w,360px);justify-self:center}
.svx-auth-wrap>.card{width:100%;max-width:none;margin:0}
.svx-auth-sign{margin:0;text-align:center;font-size:12px;line-height:16px;color:var(--ink-2,#6B6B6B)}

.sh-bignum-inline{display:inline-block;font:700 22px/1.2 var(--font);padding:8px 16px}

.sh-hd-guest .svx-hd-theme{margin-left:auto}
