*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#0f1117;--bg2:#161b27;--bg3:#1e2535;--bg4:#252d3d;
  --border:#2a3347;--border2:#3a4560;
  --text:#e2e8f0;--text2:#94a3b8;--text3:#64748b;
  --accent:#3b82f6;--accent2:#1d4ed8;--accent-glow:rgba(59,130,246,0.15);
  --green:#10b981;--green-bg:rgba(16,185,129,0.12);--green-text:#34d399;
  --amber:#f59e0b;--amber-bg:rgba(245,158,11,0.12);--amber-text:#fbbf24;
  --red:#ef4444;--red-bg:rgba(239,68,68,0.12);--red-text:#f87171;
  --blue-text:#60a5fa;
  --accent-border:rgba(59,130,246,0.3);
  --green-border:rgba(16,185,129,0.3);
  --amber-border:rgba(245,158,11,0.3);
  --red-border:rgba(239,68,68,0.3);
  --shadow:0 8px 24px rgba(0,0,0,0.4);
  --shadow-sm:0 1px 4px rgba(0,0,0,0.3);
  --shadow-left:-4px 0 24px rgba(0,0,0,0.5);
  --shadow-lg:0 25px 60px rgba(0,0,0,0.5);
  --radius:6px;--radius-lg:10px;
  --font-mono:'JetBrains Mono',monospace;
  --font:'Noto Sans',sans-serif;
}
:root[data-theme="light"]{
  --bg:#f1f5f9;--bg2:#ffffff;--bg3:#e2e8f0;--bg4:#cbd5e1;
  --border:#d1d5db;--border2:#94a3b8;
  --text:#0f172a;--text2:#475569;--text3:#64748b;
  --accent:#2563eb;--accent2:#1d4ed8;--accent-glow:rgba(37,99,235,0.12);
  --green:#059669;--green-bg:rgba(5,150,105,0.10);--green-text:#047857;
  --amber:#d97706;--amber-bg:rgba(217,119,6,0.10);--amber-text:#b45309;
  --red:#dc2626;--red-bg:rgba(220,38,38,0.10);--red-text:#b91c1c;
  --blue-text:#2563eb;
  --accent-border:rgba(37,99,235,0.3);
  --green-border:rgba(5,150,105,0.3);
  --amber-border:rgba(217,119,6,0.3);
  --red-border:rgba(220,38,38,0.3);
  --shadow:0 8px 24px rgba(15,23,42,0.10);
  --shadow-sm:0 1px 4px rgba(15,23,42,0.12);
  --shadow-left:-4px 0 24px rgba(15,23,42,0.15);
  --shadow-lg:0 25px 60px rgba(15,23,42,0.15);
}

body{font-family:var(--font);background:var(--bg);color:var(--text);font-size:13px;line-height:1.5;overflow:hidden;}
::-webkit-scrollbar{width:5px;height:5px}
::-webkit-scrollbar-track{background:var(--bg2)}
::-webkit-scrollbar-thumb{background:var(--border2);border-radius:3px}
button{font-family:var(--font);cursor:pointer;}
input,select,textarea{font-family:var(--font);cursor:text;}

/* LAYOUT */
.app{display:flex;height:100vh;overflow:hidden;}
.sidebar{width:200px;flex-shrink:0;background:var(--bg2);border-right:1px solid var(--border);display:flex;flex-direction:column;}
.main{flex:1;display:flex;flex-direction:column;overflow:hidden;}
.topbar{background:var(--bg2);border-bottom:1px solid var(--border);padding:10px 20px;display:flex;align-items:center;gap:10px;flex-shrink:0;}
.content{flex:1;overflow-y:auto;overflow-x:hidden;padding:18px 20px;}

/* SIDEBAR */
.logo-block{padding:14px 14px 12px;border-bottom:1px solid var(--border);}
.logo-img{display:block;width:100%;max-width:170px;height:auto;border-radius:6px;}
:root[data-theme="light"] .logo-img,
:root[data-theme="light"] .auth-logo img{filter:invert(1) grayscale(1) opacity(0.8);}
/* Совместимость со свёрнутым сайдбаром */
.sidebar.collapsed .logo-img{max-width:38px;object-fit:cover;object-position:left;}

.nav{flex:1;padding:6px 0;overflow-y:auto;}
.nav-sect{font-size:9px;font-weight:600;color:var(--text3);padding:10px 14px 3px;text-transform:uppercase;letter-spacing:0.08em;}
.nav-item{display:flex;align-items:center;gap:8px;padding:8px 14px;font-size:12px;color:var(--text2);cursor:pointer;transition:all 0.12s;border-left:2px solid transparent;}
.nav-item:hover{background:var(--bg3);color:var(--text);}
.nav-item.active{background:var(--accent-glow);color:var(--accent);border-left-color:var(--accent);font-weight:500;}
.nav-item svg{width:14px;height:14px;flex-shrink:0;stroke:currentColor;fill:none;stroke-width:2;}
.sidebar-bottom{padding:10px 14px;border-top:1px solid var(--border);cursor:pointer;position:relative;}
.sidebar-bottom:hover{background:var(--bg3);}
.av{width:28px;height:28px;border-radius:50%;background:var(--accent-glow);border:1px solid var(--accent);color:var(--accent);display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:700;flex-shrink:0;}
.u-name{font-size:11px;font-weight:500;}
.u-role{font-size:9px;color:var(--text3);}

/* TOPBAR */
.page-title{font-size:14px;font-weight:600;flex:1;}
.topbar-btn{display:inline-flex;align-items:center;justify-content:center;gap:5px;padding:7px 14px;border-radius:var(--radius);font-size:11px;font-weight:500;border:1px solid var(--border2);background:var(--bg3);color:var(--text2);cursor:pointer;transition:all 0.12s;height:32px;box-sizing:border-box;white-space:nowrap;}
.topbar-btn:hover{border-color:var(--accent);color:var(--accent);}
.topbar-btn svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2;}
.btn-accent{background:var(--accent);color:#fff;border-color:var(--accent);}
.btn-accent:hover{background:var(--accent2);color:#fff;}

/* PANELS */
.panel{display:none;}
.panel.active{display:block;}

/* CARDS */
.card{background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius-lg);padding:14px 16px;margin-bottom:14px;}
.card-hd{font-size:11px;font-weight:600;color:var(--text2);text-transform:uppercase;letter-spacing:0.06em;margin-bottom:12px;}
.two-col{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;}
.two-col > .card{min-width:0;overflow:hidden;}
.two-col > .card .arc-tbl-wrap,.two-col > .card .arc-tbl-scroller{overflow-x:auto;}

/* Панель "База архив изделий" — колонки с ручкой перетаскивания ширины */
#arc-two-col{grid-template-columns:var(--arc-split-left,1fr) 8px var(--arc-split-right,1fr);gap:8px;}
.arc-col-resizer{cursor:col-resize;display:flex;align-items:center;justify-content:center;user-select:none;touch-action:none;}
.arc-col-resizer-grip{width:4px;height:48px;border-radius:2px;background:var(--border);transition:background .15s;}
.arc-col-resizer:hover .arc-col-resizer-grip,.arc-col-resizer.dragging .arc-col-resizer-grip{background:var(--accent);}

/* BADGE */
.badge{display:inline-flex;align-items:center;padding:2px 7px;border-radius:4px;font-size:10px;font-weight:600;font-family:var(--font-mono);}
.b-blue{background:var(--accent-glow);color:var(--blue-text);border:1px solid var(--accent-border);}
.b-green{background:var(--green-bg);color:var(--green-text);border:1px solid var(--green-border);}
.b-amber{background:var(--amber-bg);color:var(--amber-text);border:1px solid var(--amber-border);}
.b-red{background:var(--red-bg);color:var(--red-text);border:1px solid var(--red-border);}
.b-gray{background:var(--bg4);color:var(--text3);border:1px solid var(--border);}

/* TABLE */
.tbl-wrap{border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;}
table{width:100%;border-collapse:collapse;font-size:12px;}
thead th{background:var(--bg3);padding:8px 10px;text-align:left;font-size:9px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:0.07em;border-bottom:1px solid var(--border);white-space:nowrap;}
tbody td{padding:8px 10px;border-bottom:1px solid var(--border);color:var(--text);vertical-align:middle;}
tbody tr:last-child td{border-bottom:none;}
tbody tr:hover td{background:var(--bg3);}
.mono{font-family:var(--font-mono);font-size:11px;}

/* FORM */
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px;}
.form-row3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin-bottom:10px;}
.form-field{margin-bottom:10px;}
.form-lbl{font-size:10px;font-weight:600;color:var(--text3);text-transform:uppercase;letter-spacing:0.06em;display:block;margin-bottom:4px;}
.form-lbl.req::after{content:" *";color:var(--red-text);}
.form-inp{text-overflow:ellipsis;width:100%;padding:7px 10px;border:1px solid var(--border2);border-radius:var(--radius);font-size:12px;background:var(--bg3);color:var(--text);transition:border-color 0.12s;}
.form-inp:focus{outline:none;border-color:var(--accent);background:var(--bg4);}
.form-inp::placeholder{color:var(--text3);}

/* STATUS MESSAGES */
.msg{padding:10px 14px;border-radius:var(--radius);margin-bottom:12px;font-size:12px;display:none;}
.msg.show{display:block;}
.msg-err{background:var(--red-bg);border:1px solid var(--red-border);color:var(--red-text);}
.msg-ok{background:var(--green-bg);border:1px solid var(--green-border);color:var(--green-text);}
.msg-warn{background:var(--amber-bg);border:1px solid var(--amber-border);color:var(--amber-text);}

/* ARCHIVE */
.arc-info{background:var(--accent-glow);border:1px solid var(--accent-border);border-radius:var(--radius);padding:10px 14px;margin-bottom:14px;}
.arc-info-title{font-size:11px;font-weight:600;color:var(--accent);margin-bottom:6px;display:flex;justify-content:space-between;}
.arc-info ul{margin-left:16px;font-size:11px;color:var(--text2);line-height:1.8;}
.arc-info li span{color:var(--accent);font-family:var(--font-mono);}
.arc-close{background:none;border:none;color:var(--text3);font-size:16px;cursor:pointer;}
.arc-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:14px;}
.arc-meta-item{background:var(--bg3);border:1px solid var(--border);border-radius:var(--radius);padding:8px 10px;}
.arc-meta-lbl{font-size:9px;color:var(--text3);text-transform:uppercase;letter-spacing:0.07em;margin-bottom:3px;}
.arc-meta-val{font-size:12px;font-weight:600;color:var(--text);font-family:var(--font-mono);}
.arc-tbl{width:100%;border-collapse:collapse;font-size:12px;min-width:600px;}
.arc-tbl thead th{background:var(--bg3);padding:8px 10px;text-align:left;font-size:9px;font-weight:700;color:var(--text3);text-transform:uppercase;border-bottom:1px solid var(--border);border-right:1px solid var(--border);white-space:nowrap;position:sticky;top:0;z-index:5;}
.arc-tbl thead th:last-child{border-right:none;}
.arc-tbl tbody td{padding:6px 8px;border-bottom:1px solid var(--border);border-right:1px solid var(--border);}
.arc-tbl tbody td:last-child{border-right:none;}
.arc-tbl tbody tr:last-child td{border-bottom:none;}
.arc-tbl tbody tr:hover td{background:var(--bg3);}
.arc-tbl input,.arc-tbl select{width:100%;background:transparent;border:1px solid transparent;border-radius:4px;padding:4px 6px;font-size:11px;color:var(--text);font-family:var(--font);}
.arc-tbl input[type="number"]{min-width: 55px;}
.arc-tbl input:focus,.arc-tbl select:focus{outline:none;border-color:var(--accent);background:var(--bg4);}
.arc-tbl select option{background:var(--bg3);}

/* Цвета строк по уровням */
.arc-row-0 td{background:rgba(16,185,129,0.12);border-left:3px solid #10b981}
.arc-row-1 td{background:rgba(245,158,11,0.10);border-left:3px solid #f59e0b}
.arc-row-2 td{background:rgba(59,130,246,0.08);border-left:3px solid #3b82f6}
.arc-row-3 td{background:rgba(139,92,246,0.07);border-left:3px solid #8b5cf6}
.arc-row-4 td{background:rgba(236,72,153,0.06);border-left:3px solid #ec4899}

/* Бейджи уровней */
.lvl-badge{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;font-size:11px;font-weight:700;font-family:monospace}
.lvl-0{background:#10b981;color:#fff}
.lvl-1{background:#f59e0b;color:#fff}
.lvl-2{background:#3b82f6;color:#fff}
.lvl-3{background:#8b5cf6;color:#fff}
.lvl-4{background:#ec4899;color:#fff}
.arc-del-btn{background:none;border:1px solid var(--border);border-radius:4px;color:var(--text3);padding:3px 7px;font-size:12px;transition:all 0.12s;}
.arc-del-btn:hover{background:var(--red-bg);border-color:var(--red);color:var(--red-text);}
.arc-del-btn:disabled{opacity:0.3;cursor:not-allowed;}
.arc-actions{display:flex;gap:8px;margin-bottom:10px;flex-wrap:wrap;}
.arc-btn{display:inline-flex;align-items:center;justify-content:center;gap:5px;padding:7px 14px;border-radius:var(--radius);font-size:11px;font-weight:500;border:1px solid var(--border2);background:var(--bg3);color:var(--text2);cursor:pointer;transition:all 0.12s;height:32px;box-sizing:border-box;white-space:nowrap;}
.arc-btn:hover{background:var(--bg4);color:var(--text);}
.arc-btn svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2;}
.arc-btn.primary{background:var(--accent);color:#fff;border-color:var(--accent);}
.arc-btn.primary:hover{background:var(--accent2);}
.arc-btn.danger{background:var(--red-bg);color:var(--red-text);border-color:var(--red-border);}
/* .arc-tbl-scroller{overflow-x:auto;max-height:380px;overflow-y:auto;} */
.arc-tbl-scroller{overflow-x:auto;overflow-y:auto;}
.selected-row td{outline:2px solid var(--accent);outline-offset:-1px;}

/* TECH OPS TABLE */
.ops-table-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:var(--radius-lg);}
.ops-table{width:100%;border-collapse:collapse;font-size:11px;min-width:1000px;}
.ops-table th{background:var(--bg3);padding:7px 8px;text-align:left;font-size:9px;font-weight:700;color:var(--text3);text-transform:uppercase;border-bottom:1px solid var(--border);border-right:1px solid var(--border);white-space:nowrap;position:sticky;top:0;}
.ops-table th:last-child{border-right:none;}
.ops-table td{padding:5px 6px;border-bottom:1px solid var(--border);border-right:1px solid var(--border);vertical-align:middle;}
.ops-table td:last-child{border-right:none;}
.ops-table tr:last-child td{border-bottom:none;}
.ops-table tr:hover td{background:var(--bg3);}
.ops-table tr.final-op td{background:rgba(16,185,129,0.05);}
.ops-table input[type=text],.ops-table input[type=number],.ops-table select,.ops-table textarea{width:100%;background:transparent;border:1px solid transparent;border-radius:3px;padding:4px 5px;font-size:11px;color:var(--text);font-family:var(--font);}
.ops-table input:focus,.ops-table select:focus{outline:none;border-color:var(--accent);background:var(--bg4);}
.ops-table select option{background:var(--bg3);}
.ops-table input[type=checkbox]{width:14px;height:14px;accent-color:var(--accent);cursor:pointer;}
.ops-table .del-btn{background:none;border:1px solid var(--border);border-radius:3px;color:var(--text3);padding:2px 6px;font-size:11px;cursor:pointer;}
.ops-table .del-btn:hover{background:var(--red-bg);border-color:var(--red);color:var(--red-text);}
.ops-table .op-drag-handle{cursor:grab;color:var(--text3);font-size:14px;text-align:center;user-select:none;display:block;}
.ops-table .op-drag-handle:active{cursor:grabbing;}
.ops-table tr.sortable-ghost{opacity:0.35;}
.op-tool-picker-btn{flex-shrink:0;padding:3px 6px;background:var(--bg3);border:1px solid var(--border);border-radius:3px;color:var(--text3);cursor:pointer;font-size:10px;}
.op-tool-picker-btn:hover{background:var(--bg4);color:var(--text);}
#op-tool-picker-menu{display:none;position:fixed;min-width:240px;max-height:280px;overflow-y:auto;background:var(--bg3);border:1px solid var(--border2);border-radius:var(--radius,6px);box-shadow:var(--shadow);z-index:2000;padding:6px;}
#op-tool-picker-menu.show{display:block;}
#op-tool-picker-search{width:100%;margin-bottom:6px;font-size:12px;}
.op-tool-picker-empty{font-size:11px;color:var(--text3);padding:8px 6px;}
.op-tool-picker-item{display:flex;align-items:center;gap:7px;padding:5px 6px;border-radius:4px;font-size:12px;color:var(--text2);cursor:pointer;}
.op-tool-picker-item:hover{background:var(--bg4);color:var(--text);}
.op-tool-picker-item input{cursor:pointer;}
.ops-table input[readonly]{color:var(--amber-text);font-family:var(--font-mono);}

/* COMBOBOX */
.combo-wrap{position:relative;}
.combo-dropdown{position:absolute;top:100%;left:0;right:0;background:var(--bg3);border:1px solid var(--border2);border-radius:var(--radius);z-index:100;max-height:180px;overflow-y:auto;display:none;box-shadow:var(--shadow);}
.combo-dropdown.show{display:block;}
.combo-item{padding:7px 10px;font-size:12px;cursor:pointer;color:var(--text2);}
.combo-item:hover{background:var(--accent-glow);color:var(--accent);}

/* AUTH */
.auth-screen{display:none;position:fixed;inset:0;z-index:500;background:var(--bg);align-items:center;justify-content:center;}
.auth-screen.show{display:flex;}
.auth-bg-grid{position:absolute;inset:0;background-image:linear-gradient(var(--border) 1px,transparent 1px),linear-gradient(90deg,var(--border) 1px,transparent 1px);background-size:40px 40px;opacity:0.35;}
.auth-wrap{position:relative;z-index:1;width:100%;max-width:400px;padding:20px;}
.auth-logo{text-align:center;margin-bottom:24px;}
.auth-logo-name{font-family:var(--font-mono);font-size:20px;font-weight:700;color:var(--accent);}
.auth-logo-sub{font-size:11px;color:var(--text3);margin-top:3px;}
.auth-card{background:var(--bg2);border:1px solid var(--border2);border-radius:var(--radius-lg);padding:24px;box-shadow:var(--shadow-lg);}
.auth-tabs{display:flex;margin-bottom:20px;border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;}
.auth-tab{flex:1;padding:8px;text-align:center;font-size:12px;font-weight:600;cursor:pointer;background:transparent;color:var(--text3);border:none;transition:all 0.15s;}
.auth-tab.active{background:var(--accent-glow);color:var(--accent);}
.auth-form{display:none;}
.auth-form.active{display:block;}
.auth-lbl{font-size:10px;font-weight:700;color:var(--text3);text-transform:uppercase;letter-spacing:0.07em;display:block;margin-bottom:4px;}
.auth-inp{width:100%;padding:9px 11px;border:1px solid var(--border2);border-radius:var(--radius);font-size:13px;background:var(--bg3);color:var(--text);margin-bottom:12px;transition:border-color 0.12s;}
.auth-inp:focus{outline:none;border-color:var(--accent);}
.auth-inp::placeholder{color:var(--text3);}
.auth-btn{width:100%;padding:10px;border-radius:var(--radius);font-size:13px;font-weight:600;border:none;background:var(--accent);color:#fff;cursor:pointer;transition:all 0.15s;}
.auth-btn:hover{background:var(--accent2);}
.auth-err{font-size:11px;color:var(--red-text);background:var(--red-bg);border:1px solid var(--red-border);border-radius:var(--radius);padding:8px 10px;margin-bottom:12px;display:none;}
.auth-err.show{display:block;}
.auth-role-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:12px;}
.auth-role-btn{padding:8px 6px;border:1px solid var(--border);border-radius:var(--radius);background:var(--bg3);color:var(--text2);cursor:pointer;text-align:center;transition:all 0.12s;font-family:var(--font);}
.auth-role-btn.sel{border-color:var(--accent);background:var(--accent-glow);color:var(--accent);}
.auth-role-name{font-size:11px;font-weight:600;}
.auth-footer{text-align:center;margin-top:12px;font-size:10px;color:var(--text3);}

/* USER MENU */
.user-menu{position:absolute;bottom:52px;left:0;right:0;background:var(--bg3);border:1px solid var(--border2);border-radius:var(--radius-lg);padding:5px;box-shadow:var(--shadow);display:none;z-index:50;margin:0 4px;}
.user-menu.show{display:block;}
.user-menu-item{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:var(--radius);font-size:12px;color:var(--text2);cursor:pointer;}
.user-menu-item:hover{background:var(--bg4);color:var(--text);}
.user-menu-item svg{width:13px;height:13px;stroke:currentColor;fill:none;stroke-width:2;flex-shrink:0;}
.user-menu-item.danger{color:var(--red-text);}
.user-menu-item.danger:hover{background:var(--red-bg);}
.user-menu-sep{height:1px;background:var(--border);margin:3px 0;}

/* SETTINGS MENU */
.sidebar-settings-btn{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;margin-left:auto;flex-shrink:0;background:transparent;border:none;border-radius:var(--radius);color:var(--text2);cursor:pointer;padding:0;transition:all 0.12s;}
.sidebar-settings-btn:hover{background:var(--bg4);color:var(--accent);}
.sidebar-settings-btn svg{width:14px;height:14px;stroke:currentColor;fill:none;stroke-width:1.8;}
.settings-menu{position:absolute;bottom:52px;left:0;right:0;background:var(--bg3);border:1px solid var(--border2);border-radius:var(--radius-lg);padding:5px;box-shadow:var(--shadow);display:none;z-index:50;margin:0 4px;}
.settings-menu.show{display:block;}
.settings-row{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:var(--radius);}
.settings-label{font-size:12px;color:var(--text2);}
.settings-value{margin-left:auto;font-size:11px;color:var(--text3);}
.theme-switch{position:relative;display:inline-block;width:32px;height:18px;flex-shrink:0;cursor:pointer;}
.theme-switch input{opacity:0;width:0;height:0;position:absolute;}
.theme-switch-slider{position:absolute;inset:0;background:var(--bg4);border:1px solid var(--border2);border-radius:18px;transition:background 0.15s;box-sizing:border-box;}
.theme-switch-slider::before{content:"";position:absolute;top:2px;left:2px;width:12px;height:12px;background:var(--text2);border-radius:50%;transition:transform 0.15s,background 0.15s;}
.theme-switch input:checked + .theme-switch-slider{background:var(--accent);border-color:var(--accent);}
.theme-switch input:checked + .theme-switch-slider::before{transform:translateX(14px);background:#fff;}

/* TOAST */
.toast{display:none;position:fixed;bottom:20px;right:20px;background:var(--bg3);border:1px solid var(--green);color:var(--green-text);border-radius:var(--radius-lg);padding:10px 16px;font-size:12px;z-index:200;gap:8px;align-items:center;box-shadow:var(--shadow);}
.toast.show{display:flex;}

.combo-dd{position:absolute;top:100%;left:0;right:0;background:var(--bg3);border:1px solid var(--border2);border-radius:6px;z-index:9999;max-height:200px;overflow-y:auto;display:none;box-shadow:var(--shadow)}
.combo-dd.show{display:block}


/* ====================== ЛИЧНЫЙ КАБИНЕТ ====================== */
#personal-cabinet {
    position: fixed ;
    top: 0 ;
    left: 0 ;
    width: 100vw ;
    height: 100vh ;
    background: rgba(0, 0, 0, 0.85) ;
    display: none ;
    align-items: center ;
    justify-content: center ;
    z-index: 10000 ;
    opacity: 1 ;
}

#personal-cabinet.modal-visible {
    display: flex ;
}

.modal-content {
    background: var(--bg2);
    border: 1px solid var(--border2);
    border-radius: var(--radius-lg, 12px);
    padding: 28px ;
    box-shadow: var(--shadow-lg) ;
}

/* Панели архива — фиксированная высота, скроллинг внутри */
#ogt-content-arc .two-col{align-items:start}
#ogt-content-arc #arc-two-col{align-items:stretch}
#ogt-content-arc .two-col > .card{
  height:calc(100vh - 190px);
  overflow:hidden;
  min-width:0;
  margin-bottom:0;
  display:flex;
  flex-direction:column;
}
#ogt-content-arc .two-col > .card .card-hd,
#ogt-content-arc .two-col > .card .arc-actions,
#ogt-content-arc .two-col > .card .form-inp,
#ogt-content-arc .two-col > .card > div:last-child{
  flex-shrink:0;
}
#ogt-content-arc .two-col > .card .arc-tbl-scroller{
  flex:1;
  min-height:0;
  overflow-x:auto;
  overflow-y:auto;
}


.chrome-tabs{display:flex;gap:0;border-bottom:2px solid var(--border);margin-bottom:16px;padding:0 4px}
.chrome-tab{display:inline-flex;align-items:center;gap:6px;padding:10px 20px;font-size:13px;font-weight:600;color:var(--text3);cursor:pointer;border:1px solid transparent;border-bottom:none;border-radius:8px 8px 0 0;position:relative;top:2px;transition:all 0.15s}
.chrome-tab:hover{color:var(--text);background:var(--bg3)}
.chrome-tab.active{color:var(--accent);background:var(--bg2);border-color:var(--border);border-bottom:2px solid var(--bg2)}
.chrome-tab svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2;flex-shrink:0}
/* В ОГТ много вкладок — подписи в одну строку, при нехватке ширины панель вкладок прокручивается */
#panel-tech-department .chrome-tabs{overflow-x:auto;overflow-y:hidden}
#panel-tech-department .chrome-tab{white-space:nowrap;flex-shrink:0}


/* ==================== COLLAPSIBLE SIDEBAR ==================== */
.sidebar {
  width: 260px;
  transition: width 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  overflow: hidden;
}

.sidebar.collapsed {
  width: 68px;
}

/* ==================== COLLAPSIBLE SIDEBAR ==================== */
.sidebar {
  width: 260px ;           /* увеличиваем ширину по умолчанию */
  transition: width 0.35s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  overflow: hidden;
}

.sidebar.collapsed {
  width: 68px ;
}

/* Кнопка сворачивания */
.toggle-sidebar-btn {
  position: absolute;
  top: 20px;
  right: -16px;
  width: 34px;
  height: 34px;
  background: var(--bg3);
  color: var(--text);
  border: 2px solid var(--border);
  border-radius: 50%;
  cursor: pointer;
  font-size: 18px;
  z-index: 100;
  box-shadow: var(--shadow);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s;
}

.sidebar.collapsed .toggle-sidebar-btn {
  right: 8px;
}

/* Текст при сворачивании */
.menu-text {
  transition: all 0.3s ease;
  white-space: nowrap;
}

.sidebar.collapsed .menu-text {
  opacity: 0;
  width: 0;
  overflow: hidden;
}

/* Секции */
.nav-sect {
  transition: all 0.3s ease;
}

.sidebar.collapsed .nav-sect {
  opacity: 0;
  height: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

/* .sidebar.collapsed .logo-line2 {
  display: none;
} */

/* ==================== COLLAPSIBLE SIDEBAR ==================== */
/* Единый размер кнопок */
.arc-btn[style*="font-size"]{font-size:11px}
.arc-btn[style*="padding"]{padding:7px 14px}
button.arc-btn,button.topbar-btn{line-height:1}

/* ==================== КАТАЛОГ НОМЕНКЛАТУРЫ ==================== */
.two-col1-2{display:grid;grid-template-columns:0.5fr 1.5fr;gap:14px;overflow:hidden;}

.nomNav{
  height:100%;
  overflow:auto;
  width:auto;
  padding-left:20px;
  margin-left:-6px;
  color:var(--text2);
  max-height: calc(100vh - 230px);
}

.childUl{padding-left:20px;}

.childLi span:hover,
.parentLi span:hover{text-decoration:underline;}

.childLi span.selected,
.parentLi span.selected{outline-style:solid;outline-color:var(--text2);}

.cat-tbl-scroller{
  max-height: calc(100vh - 270px);
  overflow-y:auto;
  overflow-x:auto;
}

.nomNavList li.hasChildren{list-style-type:disclosure-closed;}
.nomNavList li.hasChildren[open]{list-style-type:disclosure-open;}


/* ==================== Стили модалок ==================== */
.del-column, .update-column{
  width: 20px;
}

.del-btn, .update-btn{
  background: none;
  border: 1px solid var(--border);
  border-radius: 3px;
  color: var(--text3);
  padding: 2px 5px;
  font-size: 11px;
  cursor: pointer;
}

.update-btn {
  padding: 2px 4px;
}

.del-btn:hover{
  background: var(--red-bg);
  border-color: var(--red);
  color: var(--red-text);
}

.update-btn:hover{
  background: var(--green-bg);
  border-color: var(--green);
  color: var(--green-text);

}

.table-container{
     overflow-x: auto; 
     border: 1px solid var(--border); 
     border-radius: var(--radius-lg, 12px); 
     max-height: calc(100vh - 200px);
}

table thead{
  position: sticky;
  top: 0;
}

.btn-accent{
  padding: 7px 14px;
  border: 0;
  border-radius: 6px;
}

.toolbar{
  display: flex;
  gap: 8px;
  margin-bottom: 14px;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
}

.topbar-btn{
  padding: 12px 22px;
  font-size: 14px;
}

.cancel-btn {
  margin-left: auto;
}


.modal-footer {
    display: flex;
    gap: 10px;
    padding-top: 12px;
    border-top: 1px solid var(--border);
}

.form-row:has(.form-inp[name='id'])  {
  display: none;
}

.modal{
  position: fixed;
  inset: 0;
  z-index: 300;
  background: rgba(0, 0, 0, 0.7);
  display: flex;
  align-items: center;
  justify-content: center;
  
}


table tr > :not(:first-child):not(:last-child){

  border-left: 1px solid var(--border);
  border-right: 1px solid var(--border);
}

td input[type="checkbox"] {
  accent-color: var(--bg4);
  width: 16px;
  height: 16px;
  cursor: pointer;
  box-shadow: 0 0 0 2px var(--border2);
}

td:has(input[type="checkbox"]),
td:has(a) {
  text-align: center;
}




td input::-webkit-file-upload-button {
  cursor: pointer;
}

td input[type="number"] {
  max-width: 100%;
}

.tech-department_sections td a {
  color: var(--text2);
  ;
  white-space: nowrap;
  background: var(--bg3);
  border: 1px solid var(--border2);
  width: auto;
  display: block;
  margin: 0px 0px 2px 0px;
  padding: 2px;
  border-radius: var(--radius);
  text-decoration: none;
}

.tech-department_sections td a:hover {
  background: var(--bg4);
  color: var(--text);
}

.table-container thead th {
  text-align: center;
  text-wrap: balance;
}


input[type="date"]::-webkit-calendar-picker-indicator, input[type="month"]::-webkit-calendar-picker-indicator {
  filter: invert(1);
  z-index: 0;
}


.table-container thead {
  z-index: 10;
}

button.uploadButton {

  border: 1px dashed var(--border);
  background: transparent;
  color: var(--text3);
  padding: 7px 6px;;
  ;
  border-radius: var(--radius);
}

.fileUpload {
  display: flex;
  align-content: center;
  align-items: center;
  justify-content: center;
  flex-wrap: nowrap;
  column-gap: 4px;
}

.tech-department_sections .fileUpload a {
  padding: 5px 10px;
  margin: 0px;
}

.fileUpload input[type="file"] {
  display: none;
  max-width: 35px;
  cursor: pointer;
  padding: 5px 10px;
}


select.form-inp {
  min-width: 100px;
  cursor: pointer;
}

select.highPriority {
  color: var(--red-text);
  border-color: var(--red-text)
}

select.mediumPriority {
  color: var(--amber-text);
  border-color: var(--amber-text)
}

select.lowPriority {
  color: var(--green-text);
  border-color: var(--green-text)
}

select option {
  color: var(--text);
}


.search-select-dropdown {
  position: absolute;
  /* width: 100%; */
  max-height: 240px;
  overflow-y: auto;
  margin: 6px 0 0 0;
  padding: 0;
  list-style: none;
  border: 1px solid #d9d9d9;
  background: #fff;
  border-radius: 6px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  z-index: 1000;
  position: absolute;
  background: var(--bg2);
  border: 1px solid var(--border);

}


.search-select-item {
  padding: 8px 12px;
  cursor: pointer;
  transition: background 0.1s linear;
  padding: 7px 10px;
  font-size: 12px;
  cursor: pointer;
  color: var(--text2);
}

.search-select-item:hover {
  background: var(--accent-glow);
  color: var(--accent);
}

.search-select-item[data-selected="true"] {
  color: var(--accent);
}

tbody tr td.empty-row, tbody tr td.empty-row-centred  {
  text-align: left;
  color: var(--text3);
  cursor: default;
  background-color: var(--bg);
}

tbody tr td.empty-row-centred {
  text-align: center;
}

select:disabled,
input:disabled,
button:disabled,
input[type="checkbox"]:disabled {
  cursor: not-allowed;
  opacity: 0.7;
}

.del-btn:hover:disabled, .action-btn:hover:disabled {
  background: none;
  border-color: var(--border);
  color: var(--text3);
}

td input[type="checkbox"]:checked {
  accent-color: var(--bg4);
}

.placeholder {
  display: flex;
  color: var(--text2);
  justify-content: center;
}

.toast.show.error {
  border-color: var(--red);
  color: var(--red-text);
}

#tech-section-tasks_plan tbody td {
  height: 1px;
}

#tech-section-tasks_plan tbody td:has(.tasks_card) {
  min-width: 175px;
}

td .tasks_card {
  display: flex;
  flex-direction: column;
  height: 100%; 
}


td .tasks_slot {
  flex-grow: 1;
  min-height: 40px;
  position: relative;
  padding: 4px 0px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

td .tech_task {
  background-color: var(--bg4);
  border-left: 3px solid var(--text3);
  border-radius: 3px;
  padding: 2px 5px;
  margin-bottom: 2px;
  font-size: 10px;
  cursor: pointer;
  /* transition: 0.1s; */
  width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  position: relative;
}

td .tech_task.high_priority {
  border-color: var(--red-text);
  background-color: var(--red-bg);
}
td .tech_task.low_priority {
  border-color: var(--green-text);
  background-color: var(--green-bg);
}
td .tech_task.medium_priority {
  border-color: var(--amber-text);
  background-color: var(--amber-bg);
}

td .tech_task:hover{
  transform: scale(1.05);
  border-color: var(--text);
  z-index: 5;
}

td .task-hours{
  font-weight: bold;
  color: var(--text3);
  float: right;
  margin-left: 4px;
}

td .tasks_total{
  margin-top: auto;
  font-size: 10px;
  color: var(--text3);
  text-align: right;
  border-top: 1px dashed var(--border2);
  padding-top: 2px;
}

td .tasks_total.overload, td .workload.overload {
  color: var(--red-text);
  
}

td .workload{
  text-align: right;
  font-weight: bold;
  min-width: 40px;
}

.bigaccent_text {
  font-weight: bold;
  font-size: 1.5em;
}

.smallaccent_text{
  font-weight: bold;
  font-size: 1.3em
}

/*Для борьбы с просвечиванием границ шапок таблиц при скроле таблицы*/
.table-container table {
  border-collapse: separate;
  border-spacing: 0;
}

.table-container table tr > :not(:first-child) { 
  border-left: 1px solid var(--border);
  border-right: 0px solid var(--border); 
}

.width_50 {
  width: 50%;
}

.btn-green:hover {
  background-color: var(--green-bg);
  color: var(--green-text);
  border-color: var(--green-text);
}

.actionbar {
  text-align: center;
}

.action-btn {
  background: none;
  border: 1px solid var(--border);
  border-radius: 3px;
  color: var(--text3);
  padding: 4px 5px;
  font-size: 12px;
  cursor: pointer;

}

.action-btn:hover{
  border: 1px solid var(--amber-text);
  color: var(--amber-text);
  background: var(--amber-bg);
}

#tech-section-tasks_list table th{
  padding: 8px 4px;
}


#tech-section-tasks_list table td:has(select), #tech-section-tasks_list table td:has(input) , #tech-section-tasks_list table td:has(div[class="fileUpload"]){
  padding: 8px 4px;
}

#tech-section-tasks_list table td .form-inp {
  padding: 7px 6px;
}

button:focus, a.fileLink:focus {
  outline: 1px solid var(--accent);
}

.commentary_column_text {
  min-width : 700px; 
  overflow-wrap: break-word;
}

.toolbar_filters {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  margin-right: auto;
  gap: 8px;
}

.toolbar_filters select, .toolbar_filters input{
  width: fit-content;
}