/* «Зарплаты» — дизайн-система в стилистике «Опер.расходов»/ЛК (бирюза · Inter · мягкие тона). */ :root{ --bg:#eef1f5; --panel:#ffffff; --ink:#1f2c38; --ink-soft:#5a6b7b; --muted:#93a2b1; --line:#e3e9ef; --line-strong:#d3dde6; --accent:#16b3c4; --accent-ink:#0f8d9b; --accent-soft:#e6f7f9; --navy:#16323f; --ok:#25b07a; --ok-soft:#e7f6ef; --warn:#e9a23b; --warn-soft:#fbf1de; --info:#2f80b5; --info-soft:#e7f1fa; --danger:#e8607f; --danger-soft:#fdeef2; --radius:14px; --radius-lg:16px; --radius-sm:10px; --shadow:0 8px 28px rgba(22,50,63,.07); --shadow-sm:0 1px 2px rgba(22,50,63,.05); } *{box-sizing:border-box} html{font-size:13px} body{margin:0;font:13px/1.55 'Inter',-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased} a{color:var(--accent-ink);text-decoration:none} a:hover{text-decoration:underline} h1{font-family:'Unbounded','Inter',sans-serif;font-size:23px;font-weight:700;margin:0 0 5px;letter-spacing:-.02em;color:var(--ink);line-height:1.15} h2{font-size:15px;font-weight:700;margin:0} .muted{color:var(--muted)} .mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:11.5px} .req{color:var(--danger);font-weight:700} /* ---------- каркас ---------- */ .app{display:flex;flex-direction:column;min-height:100vh} .hdr{display:flex;align-items:center;justify-content:space-between;height:62px;padding:0 22px;background:var(--panel);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:40} .hdr-brand{display:flex;align-items:center;gap:11px} /* гамбургер мобильного меню — скрыт на десктопе */ .nav-burger{display:none;flex-direction:column;justify-content:center;gap:4px;width:38px;height:38px;padding:9px;border:none;background:none;cursor:pointer;flex:none;border-radius:10px} .nav-burger:hover{background:var(--accent-soft,#eafaf6)} .nav-burger span{display:block;height:2px;width:100%;background:var(--ink,#1e2a33);border-radius:2px;transition:transform .26s,opacity .2s} .app.nav-open .nav-burger span:nth-child(1){transform:translateY(6px) rotate(45deg)} .app.nav-open .nav-burger span:nth-child(2){opacity:0} .app.nav-open .nav-burger span:nth-child(3){transform:translateY(-6px) rotate(-45deg)} .nav-backdrop{display:none} .nav-fab{display:none} @media(max-width:720px),(orientation:landscape) and (max-height:520px) and (max-width:1024px){.nav-backdrop{display:block}} .brand-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--accent);color:#fff;font-size:17px;font-weight:800;flex:none} .brand-name{font-family:'Unbounded','Inter',sans-serif;font-weight:700;font-size:14.5px;color:var(--ink);letter-spacing:-.01em} .brand-sub{font-size:11px;color:var(--muted);margin-top:1px} .hdr-right{display:flex;align-items:center;gap:16px} .actor-sw{display:flex;align-items:center;gap:8px} .actor-sw .muted{font-size:12px} .actor-sw select{padding:8px 11px;font-size:12.5px;font-weight:600;border-radius:9px;background:#fff;border:1.5px solid var(--line);max-width:290px} .who{display:flex;align-items:center;gap:10px;padding-left:15px;border-left:1px solid var(--line)} .who-txt{text-align:right} .who-name{font-weight:700;font-size:12.5px;color:var(--ink)} .who-role{font-size:11px;color:var(--muted)} .avatar{width:38px;height:38px;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;font-weight:800;font-size:13.5px;flex:none} .body{display:flex;flex:1;min-height:0} .side{width:230px;flex:0 0 230px;background:var(--panel);border-right:1px solid var(--line);display:flex;flex-direction:column;padding:16px 14px} .nav-link{display:flex;align-items:center;gap:11px;padding:10px 13px;border-radius:11px;color:var(--ink-soft);margin-bottom:3px;font-size:13.5px;font-weight:700} .nav-link:hover{background:var(--accent-soft);color:var(--accent-ink);text-decoration:none} .nav-link.active{background:var(--accent);color:#fff} .nav-ico{width:18px;height:18px;flex:none;display:grid;place-items:center} .nav-ico svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round} .badge{margin-left:auto;background:var(--danger);color:#fff;border-radius:20px;padding:0 7px;font-size:11px;font-weight:700;line-height:18px} .nav-link.active .badge{background:rgba(255,255,255,.3)} .side-foot{margin-top:auto} .sf-card{background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:11px 12px;font-size:11px;line-height:1.55;color:var(--ink-soft)} .sf-cap{font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);margin-bottom:3px;font-weight:700} .main{flex:1;min-width:0;display:flex;flex-direction:column;overflow:auto} .page{padding:24px 26px;max-width:1140px;width:100%} .page--wide{max-width:none} .page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:10px} .back{display:inline-flex;align-items:center;gap:4px;margin-bottom:10px;color:var(--muted);font-size:12.5px;font-weight:600} .back:hover{color:var(--ink);text-decoration:none} .flash{background:var(--ok-soft);color:#1c7d57;border:1px solid #bfe6d3;border-radius:10px;padding:10px 14px;margin-bottom:16px;font-weight:600} /* ---------- формы ---------- */ /* ВАЖНО: password/email/tel/search раньше НЕ попадали в базовый стиль — на экране входа поле пароля выглядело чужим (тонкая рамка, другая высота), рядом со стилизованным логином. */ select,input[type=text],input[type=number],input[type=password],input[type=email],input[type=tel],input[type=search],input[type=date],input[type=month],input[type=time],input[type=datetime-local],input:not([type]),textarea{font:inherit;color:var(--ink);background:#fbfcfd;border:1.5px solid var(--line);border-radius:10px;padding:9px 11px} select:hover{border-color:var(--muted)} select:focus,input:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);background:#fff} .period-open{display:flex;gap:12px;align-items:flex-end} .period-open label{display:flex;flex-direction:column;gap:5px;font-size:11px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.03em} .period-open select{min-width:130px;font-weight:600} /* ---------- кнопки ---------- */ .btn{display:inline-flex;align-items:center;gap:7px;padding:9px 14px;border-radius:9px;border:1.5px solid var(--line);background:#fff;color:var(--ink);cursor:pointer;font:inherit;font-weight:700;font-size:13px;line-height:1;white-space:nowrap;transition:all .14s} .btn:hover{border-color:var(--muted);text-decoration:none} .btn.primary{background:var(--accent);border-color:var(--accent);color:#fff} .btn.primary:hover{background:var(--accent-ink);border-color:var(--accent-ink);box-shadow:0 4px 12px rgba(22,179,196,.28)} .btn.ghost{background:transparent;border-color:transparent;color:var(--ink-soft)} .btn.ghost:hover{background:var(--accent-soft);color:var(--accent-ink)} .btn.xs{padding:6px 11px;font-size:12px;border-radius:8px} .btn.ok{background:var(--ok-soft);border-color:transparent;color:var(--ok)} .btn.ok:hover{background:#d8f0e3} .btn.danger{background:var(--danger-soft);border-color:transparent;color:var(--danger)} .btn.danger:hover{background:#fbe0e7} /* ---------- чипы статусов ---------- */ .tag{display:inline-flex;align-items:center;font-size:11px;border-radius:7px;padding:2px 9px;background:#eef2f5;color:var(--ink-soft);font-weight:700;white-space:nowrap} .tag.st-submitted{background:var(--warn-soft);color:#9a6b16} .tag.st-approved{background:var(--ok-soft);color:var(--ok)} .tag.st-rejected{background:var(--danger-soft);color:var(--danger)} /* ---------- канбан периодов ---------- */ .combo-card{position:relative;overflow:hidden;display:flex;justify-content:space-between;align-items:center;gap:16px;background:linear-gradient(120deg,var(--navy),#1c4353);color:#fff;border-radius:var(--radius-lg);padding:18px 22px;margin-bottom:20px;box-shadow:var(--shadow);transition:transform .16s,box-shadow .16s} /* мягкий бирюзовый блик справа для «финансового» акцента */ .combo-card::after{content:"";position:absolute;right:-40px;top:-60px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,rgba(22,179,196,.22),transparent 70%);pointer-events:none} .combo-card:hover{text-decoration:none;transform:translateY(-2px);box-shadow:0 14px 34px rgba(22,50,63,.16)} .combo-cap{font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:#8fd6df;font-weight:700} .combo-title{font-family:'Unbounded','Inter',sans-serif;font-weight:700;font-size:16px;margin-top:2px} .combo-sub{font-size:12px;color:#b9cdd6;margin-top:3px} .combo-r{text-align:right} .combo-sum{font-family:'Unbounded','Inter',sans-serif;font-size:20px;font-weight:700} .combo-r .muted{color:#9fc0ca} .year-row{margin-bottom:22px} .year-cap{font-family:'Unbounded','Inter',sans-serif;font-size:13px;color:var(--muted);font-weight:700;margin-bottom:10px;letter-spacing:.02em} .cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(178px,1fr));gap:12px} .pcard{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:14px 15px;box-shadow:var(--shadow-sm);transition:transform .14s,box-shadow .14s,border-color .14s;display:block} .pcard:hover{text-decoration:none;border-color:var(--accent);box-shadow:var(--shadow);transform:translateY(-2px)} .pcard.is-active{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)} .pcard-top{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:9px} .pcard-mo{font-weight:700;font-size:13.5px} .pcard-sum{font-family:'Unbounded','Inter',sans-serif;font-size:18px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums} .pcard-foot{font-size:11px;margin-top:4px} /* ---------- ведомость ---------- */ .ph-sum{text-align:right;flex:none;line-height:1.05} .ph-sum-cap{font-size:8.5px;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);font-weight:700} .ph-sum-val{font-family:'Unbounded','Inter',sans-serif;font-size:15px;font-weight:700;color:var(--accent-ink)} .svod{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:13px 16px;margin-bottom:18px;box-shadow:var(--shadow-sm)} .svod-cap{font-size:10.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:700;margin-bottom:9px} .svod-list{display:flex;flex-wrap:wrap;gap:8px} .svod-item{display:flex;flex-direction:column;gap:2px;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:7px 12px;min-width:150px;transition:border-color .14s,background .14s} .svod-item:hover{border-color:var(--line-strong);background:#fff} .svod-name{font-size:11px;color:var(--ink-soft);font-weight:600} .svod-val{font-weight:700;font-variant-numeric:tabular-nums;color:var(--ink)} /* --- категории (папки) ведомостей: сворачиваемый заголовок над группой компаний --- */ .cat-fold{display:flex;align-items:center;gap:9px;cursor:pointer;user-select:none;margin:0 0 7px;padding:5px 12px;background:var(--accent-soft);border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:8px;transition:background .15s} .cat-fold:hover{background:#daf1f4} .cat-fold-chev{color:var(--accent-ink);font-size:12px;line-height:1;transition:transform .18s} .cat-fold.collapsed .cat-fold-chev{transform:rotate(-90deg)} .cat-fold-name{font-family:'Unbounded','Inter',sans-serif;font-weight:600;font-size:13px;color:var(--accent-ink);letter-spacing:-.01em} .cat-fold-mgr{font-size:11px;color:var(--accent-ink);font-weight:600;background:#fff;border:1px solid var(--line);border-radius:12px;padding:1px 9px;white-space:nowrap} .cat-fold-n{margin-left:auto;font-size:11.5px;color:var(--muted);font-weight:500} .cat-group{display:block} .cat-group.collapsed{display:none} .dept-block{margin-bottom:26px} .dept-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;row-gap:8px;margin-bottom:9px;padding-left:11px;border-left:3px solid var(--accent);border-radius:2px} .dept-head .dept-title{flex:0 0 auto} .dept-block:has(.dept-dot.is-free) .dept-head{border-left-color:var(--warn)} .dept-title{display:flex;align-items:center;gap:9px;font-family:'Unbounded','Inter',sans-serif;font-weight:600;font-size:14.5px;color:var(--ink);letter-spacing:-.01em} .dept-dot{width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)} .dept-dot.is-free{background:var(--warn);box-shadow:0 0 0 3px var(--warn-soft)} .dept-n{font-family:'Inter';font-weight:700;font-size:11px;color:var(--ink-soft);background:var(--bg);border:1px solid var(--line);border-radius:20px;padding:2px 10px} .grid-wrap{border:1px solid var(--line);border-radius:var(--radius);overflow:auto;box-shadow:var(--shadow-sm);background:#fff} .empty-state{background:var(--panel);border:1px dashed var(--line-strong);border-radius:var(--radius);padding:44px 40px;text-align:center;color:var(--muted);font-size:13.5px;line-height:1.6} /* Jspreadsheet — вписываем в дизайн */ .jgrid .jexcel_content{font:13px/1.4 'Inter',sans-serif} .jgrid table.jexcel > thead > tr > td{background:#f7f9fb;color:var(--ink-soft);font-weight:700;font-size:10.5px;text-transform:uppercase;letter-spacing:.03em;border-color:var(--line);padding-top:8px;padding-bottom:8px} .jgrid table.jexcel > tbody > tr > td{border-color:var(--line);font-variant-numeric:tabular-nums;padding-top:6px;padding-bottom:6px} /* строки-данные: спокойный зебра-фон для читаемости плотной таблицы */ .jgrid table.jexcel > tbody > tr:nth-child(even) > td{background:#fcfdfe} .jgrid table.jexcel > tbody > tr:hover > td{background:var(--accent-soft)} /* первый столбец-подпись «прибит» слева — sticky, непрозрачный фон */ .jgrid table.jexcel > tbody > tr > td:first-child{text-align:left!important;color:var(--ink);font-weight:600;background:#fbfcfd;position:sticky;left:0;z-index:2;box-shadow:1px 0 0 var(--line)} .jgrid table.jexcel > thead > tr > td:first-child{position:sticky;left:0;z-index:3;box-shadow:1px 0 0 var(--line)} .jgrid table.jexcel > tbody > tr:hover > td:first-child{background:#eef7f8} /* строки-итоги — выразительнее; sticky-подпись перекрашивается в тон */ .jgrid td.row-total{background:#eef8fa!important;font-weight:800;color:var(--accent-ink);box-shadow:inset 0 1px 0 var(--line-strong)} .jgrid table.jexcel > tbody > tr > td.row-total:first-child{background:#e4f4f6!important;color:var(--accent-ink)} /* строки-реквизиты — спокойные, приглушённые */ .jgrid td.row-info{background:#fcfbf7!important;color:var(--ink-soft);font-style:italic;font-size:12px} .jgrid table.jexcel > tbody > tr > td.row-info:first-child{background:#faf8f1!important;font-style:normal} /* мягкие состояния согласования (ASMR-тон, без агрессивного алого) */ .jgrid td.st-submitted{background:var(--warn-soft)!important;box-shadow:inset 0 0 0 1px #f0d59a} .jgrid td.st-approved{background:var(--ok-soft)!important;box-shadow:inset 0 0 0 1px #bfe6d3} .jgrid td.st-rejected{background:var(--danger-soft)!important;box-shadow:inset 0 0 0 1px #f3c4d0} /* выделенная ячейка сетки — в бирюзе, а не дефолтном синем */ .jgrid table.jexcel > tbody > tr > td.highlight{background:var(--accent-soft)!important} .jgrid .jexcel_content{border-radius:var(--radius)} /* ---------- согласование ---------- */ .rev-emp{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);margin-bottom:14px;box-shadow:var(--shadow-sm);overflow:hidden} .rev-emp-head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;background:#f7f9fb;border-bottom:1px solid var(--line)} .rev-emp-name{font-weight:700} .rev-cells{padding:10px 16px;display:flex;flex-wrap:wrap;gap:8px} .rev-cell{display:flex;flex-direction:column;gap:1px;background:var(--warn-soft);border:1px solid #f0d59a;border-radius:9px;padding:6px 11px;min-width:110px} .rev-cell b{font-variant-numeric:tabular-nums;font-size:14px;color:#7d5510} .rev-cell span{font-size:11px;color:#9a6b16} .rev-actions{display:flex;gap:8px;align-items:center;padding:10px 16px;border-top:1px solid var(--line);background:#fbfcfd} .rev-actions input[type=text]{flex:1;min-width:180px} /* ---------- админка ---------- */ .tbl{width:100%;border-collapse:collapse;font-size:12.5px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-sm)} .tbl th{text-align:left;color:var(--muted);font-weight:700;padding:9px 13px;border-bottom:1px solid var(--line);font-size:10.5px;text-transform:uppercase;letter-spacing:.04em;background:#f7f9fb} .tbl td{padding:8px 13px;border-bottom:1px solid var(--line);vertical-align:middle} .tbl tbody tr:last-child td{border-bottom:none} .tbl tbody tr:hover{background:#f6fafb} .tbl .num{text-align:center;font-variant-numeric:tabular-nums;font-weight:700} .rolechip{display:inline-block;font-size:10.5px;border-radius:6px;padding:1px 8px;font-weight:700;background:#eef2f5;color:var(--ink-soft)} .rolechip.head{background:var(--accent-soft);color:var(--accent-ink)} .rolechip.manager{background:#e9eefb;color:#3856a5} .rolechip.finance{background:var(--warn-soft);color:#9a6b16} .rolechip.admin{background:var(--navy);color:#fff} .panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:16px 18px;margin-bottom:16px} .panel h2{margin-bottom:12px} .form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px} .form-grid label{display:flex;flex-direction:column;gap:5px;font-size:11px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.03em} .form-grid .full{grid-column:1/-1} .danger-zone{border:1px solid #f3c4d0;background:var(--danger-soft);border-radius:var(--radius);padding:14px 16px;display:flex;justify-content:space-between;align-items:center;gap:12px} /* колокол */ .bell{position:relative} .bell-btn{width:38px;height:38px;border-radius:10px;border:1.5px solid var(--line);background:#fff;color:var(--ink-soft);cursor:pointer;display:grid;place-items:center;position:relative} .bell-btn svg{width:18px;height:18px} .bell-badge{position:absolute;top:-5px;right:-5px;background:var(--danger);color:#fff;border-radius:20px;font-size:10px;font-weight:700;padding:0 5px;line-height:16px} .bell-drop{position:absolute;right:0;top:46px;width:320px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);z-index:50;overflow:hidden;display:flex;flex-direction:column;max-height:min(70vh,520px)} .bell-drop[hidden]{display:none} /* ловушка: display:flex перебивал атрибут hidden → окно висело постоянно */ .bell-head{padding:10px 14px;font-weight:800;border-bottom:1px solid var(--line);font-size:12.5px;flex:none} .bell-empty{padding:18px;color:var(--ok,#25b07a);text-align:center;font-size:12.5px;font-weight:600} .bell-list{overflow-y:auto;flex:1} .bell-item{display:flex;align-items:center;gap:9px;padding:8px 13px;border-bottom:1px solid var(--line);color:var(--ink);font-size:12px} .bell-item:last-child{border-bottom:none} .bell-item:hover{background:var(--accent-soft,#e6f7f9);text-decoration:none} .bell-item .dot{width:8px;height:8px;border-radius:50%;flex:none} .bell-item-tx{display:flex;flex-direction:column;gap:1px;min-width:0;flex:1;line-height:1.25} .bell-item-tx b{font-size:12px;font-weight:700} .bell-item-tx .muted{font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .bell-item-go{flex:none;color:var(--muted);font-size:13px;opacity:0;transition:opacity .12s} .bell-item:hover .bell-item-go{opacity:1;color:var(--accent-ink)} .bell-more{padding:8px 14px;text-align:center;font-size:11px;color:var(--muted);border-top:1px solid var(--line);flex:none} .dot--wait{background:var(--warn)} .dot--rej{background:var(--rej,#d9534f)} /* тосты */ .toast{position:fixed;bottom:22px;left:50%;transform:translateX(-50%) translateY(12px);background:var(--navy);color:#fff;padding:11px 20px;border-radius:11px;font-weight:600;font-size:12.5px;box-shadow:0 10px 30px rgba(22,50,63,.22);opacity:0;transition:all .25s;z-index:100} .toast.show{opacity:1;transform:translateX(-50%) translateY(0)} .toast--err{background:var(--danger)} /* ---------- лёгкая адаптивность ---------- */ @media (max-width:900px){ .side{width:198px;flex-basis:198px} .page{padding:20px 18px} .actor-sw select{max-width:170px} } @media (max-width:720px),(orientation:landscape) and (max-height:520px) and (max-width:1024px){ html{font-size:12.5px} /* шапка НЕ липкая — уезжает при скролле, не ест место (по просьбе). Меню при этом доступно через плавающую ☰ */ .hdr{position:static} .nav-fab{position:fixed;top:9px;left:9px;z-index:65;width:40px;height:40px;border-radius:12px;border:1px solid var(--line); background:rgba(255,255,255,.92);backdrop-filter:blur(6px);box-shadow:0 4px 14px -4px rgba(20,40,50,.35); display:none;flex-direction:column;justify-content:center;align-items:center;gap:4px;cursor:pointer;padding:10px} .nav-fab span{display:block;height:2px;width:18px;background:var(--ink);border-radius:2px} body.hdr-gone .nav-fab{display:flex} .app.nav-open .nav-fab{display:none} /* МОБИЛЬНОЕ МЕНЮ — выдвижной drawer слева (гамбургер в шапке), а не горизонтальная лента */ .nav-burger{display:flex} .side{position:fixed;top:0;left:0;height:100vh;height:100dvh;width:270px;max-width:82vw;flex:none;z-index:80; transform:translateX(-100%);transition:transform .26s cubic-bezier(.4,0,.2,1);overflow-y:auto; border-right:1px solid var(--line);box-shadow:6px 0 28px -12px rgba(20,40,50,.4);padding-top:16px} .app.nav-open .side{transform:none} .side-foot{display:block} .nav-link{margin-bottom:3px;white-space:normal;padding:12px 14px;font-size:14.5px} /* крупнее тап-зоны */ .nav-backdrop{position:fixed;inset:0;background:rgba(18,32,40,.42);z-index:70;opacity:0;visibility:hidden;transition:opacity .26s;backdrop-filter:blur(1px)} .app.nav-open .nav-backdrop{opacity:1;visibility:visible} .hdr{padding:0 12px;gap:8px} .hdr-right{gap:10px} .actor-sw .muted{display:none} .who-txt{display:none} .page-head{flex-direction:column} .ph-sum{text-align:left} } /* ---------- экран входа ---------- */ .login-body{margin:0;min-height:100vh;display:grid;place-items:center;background:radial-gradient(120% 120% at 80% 0,#e6f7f9,var(--bg));font-family:'Inter',sans-serif} .login-card{width:360px;max-width:92vw;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow);padding:26px 26px 22px} .login-brand{display:flex;align-items:center;gap:11px;margin-bottom:18px} .login-title{font-family:'Unbounded','Inter',sans-serif;font-size:19px;margin:0 0 14px} .login-form{display:flex;flex-direction:column;gap:12px} .login-form label{display:flex;flex-direction:column;gap:5px;font-size:11px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.03em} .login-form input{font-size:14px} .login-err{background:var(--danger-soft);color:var(--danger);border:1px solid #f3c4d0;border-radius:9px;padding:9px 12px;margin-bottom:12px;font-weight:600;font-size:12.5px} .login-demo{margin-top:18px;border-top:1px dashed var(--line-strong);padding-top:14px} .login-demo-cap{font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:700;margin-bottom:8px} .login-demo-grid{display:grid;grid-template-columns:auto 1fr;gap:5px 10px;align-items:center;font-size:12px} .login-demo-grid span{color:var(--ink-soft);font-weight:600} .login-demo-grid code{background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:2px 8px;font-family:ui-monospace,Menlo,monospace;font-size:11.5px;color:var(--accent-ink);justify-self:start} /* импersonation-баннер + выход */ .imp-banner{display:flex;align-items:center;gap:10px;background:var(--warn-soft);border:1px solid #f0d59a;color:#9a6b16;border-radius:10px;padding:8px 13px;margin-bottom:16px;font-weight:600;font-size:12.5px} .imp-banner a{margin-left:auto;font-weight:700} .logout-btn{width:38px;height:38px;border-radius:10px;border:1.5px solid var(--line);background:#fff;color:var(--ink-soft);cursor:pointer;display:grid;place-items:center} .logout-btn:hover{border-color:var(--danger);color:var(--danger)} .logout-btn svg{width:17px;height:17px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round} /* ================= ВЕДОМОСТЬ v2 (полный экран, табель, ячейки) ================= */ .main:has(.led-top){overflow:auto} .page--wide{padding:18px 20px} .led-top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:14px} .led-top h1{font-size:21px} /* свод-фильтр */ .svod-list{display:flex;flex-wrap:wrap;gap:8px} .svod-item{display:flex;flex-direction:column;gap:1px;background:var(--bg);border:1.5px solid var(--line);border-radius:10px;padding:7px 13px;min-width:150px;transition:all .13s} .svod-item:hover{text-decoration:none;border-color:var(--accent);transform:translateY(-1px)} .svod-item.is-active{border-color:var(--accent);background:var(--accent-soft)} .svod-item .svod-name{font-size:11px;color:var(--ink-soft);font-weight:700} .svod-item .svod-val{font-weight:800;font-variant-numeric:tabular-nums;color:var(--ink)} /* обёртка со скроллом */ .tbl-scroll{overflow:auto;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);background:#fff;max-height:74vh} /* общие таблицы-сетки */ table.grid{border-collapse:separate;border-spacing:0;font-size:11px;font-variant-numeric:tabular-nums;width:auto;min-width:100%} table.grid th,table.grid td{border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:0;height:23px} table.grid thead th{position:sticky;top:0;z-index:3;background:#f4f7f9;color:var(--ink-soft);font-weight:700;font-size:10.5px;text-align:center;padding:3px 6px;border-bottom:2px solid var(--line-strong);white-space:nowrap} table.grid td{text-align:right;font-variant-numeric:tabular-nums;padding:0 6px} table.grid .rowhdr{position:sticky;left:0;z-index:2;background:#fbfcfd;text-align:left;color:var(--ink-soft);font-weight:600;font-size:10.5px;padding:1px 8px;min-width:164px;border-right:2px solid var(--line-strong)} table.grid thead th.rowhdr{z-index:4;background:#eef3f5} /* табель выходов */ .tabel .daycell{white-space:nowrap} .tabel .daycell b{color:var(--ink)} .tabel .daycell .muted{font-size:9.5px} .tabel tr.is-weekend td{background:#fbf7f2} .tabel tr.is-weekend .rowhdr{background:#f7efe6;color:#a9743a} .tabel .acell{text-align:center} .tabel input.att{width:100%;height:21px;border:none;background:transparent;text-align:center;font:inherit;font-size:11px;font-variant-numeric:tabular-nums;padding:0} .tabel input.att:focus{outline:2px solid var(--accent);outline-offset:-2px;background:#fff} .tabel tr.wk-sub td{background:#eef6f7;font-weight:700;color:var(--accent-ink);border-bottom:1px solid var(--line-strong)} .tabel tr.wk-sub .rowhdr{background:#e3f2f4;color:var(--accent-ink)} .tabel tr.tot-row td{background:#f2fafb;font-weight:800;color:var(--accent-ink);height:24px} .tabel tr.tot-row .rowhdr{background:#e3f2f4} /* матрица компонентов */ .matrix tr.row-total td{background:#f2fafb!important;font-weight:800;color:var(--accent-ink)} .matrix tr.row-total .rowhdr{background:#e6f4f6} .matrix tr.row-info td{background:#fcfbf7;color:var(--ink-soft);font-style:italic} .mcell{position:relative} .mcell .ro{display:block;padding:0 2px;color:var(--ink)} .mcell input.val{width:100%;height:21px;border:none;background:transparent;text-align:right;font:inherit;font-size:11px;font-variant-numeric:tabular-nums;padding:0 2px;color:var(--ink)} .mcell input.val:focus{outline:2px solid var(--accent);outline-offset:-2px;background:#fff;border-radius:4px} /* статусы ячеек (ASMR-тона) */ .mcell.st-submitted{background:var(--warn-soft)} .mcell.st-approved{background:var(--ok-soft)} .mcell.st-rejected{background:var(--danger-soft);box-shadow:inset 0 0 0 1px #f3c4d0} /* Маркер комментария = тонкая цветная полоска СЛЕВА, цвет = состояние ячейки (синий уголок убран). */ .mcell.has-comment,.mcell.has-cmt{position:relative} .mcell.has-comment::before,.mcell.has-cmt::before{content:"";position:absolute;top:0;bottom:0;left:0;width:3px;z-index:2;pointer-events:none;background:var(--cmt-c,#e6b34d)} /* тот же уголок-маркер для «Бонусной части» (bonus_fin), где есть комментарий оплаты — фон фиолетовый не меняем */ .cell-dots{position:absolute;top:0;right:1px;border:none;background:transparent;color:var(--muted);cursor:pointer;font-size:12px;line-height:1;padding:0 2px;opacity:.45;z-index:3} .cell-dots:hover{opacity:1;color:var(--accent-ink)} .pay-pop-emp{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:8px} .pay-pop-sum{font-weight:800;font-size:14px;color:var(--accent-ink);font-variant-numeric:tabular-nums;white-space:nowrap} .mcell.st-submitted.has-comment{background:var(--warn-soft)} .mcell.st-rejected.has-comment{background:var(--danger-soft)} /* цвет полоски-маркера по состоянию ячейки (matrix): жёлтая/зелёная/красная */ .mcell.st-submitted{--cmt-c:#e6b34d} .mcell.st-approved{--cmt-c:var(--ok,#25b07a)} .mcell.st-rejected{--cmt-c:var(--danger)} /* тулбар ячейки */ .cell-tools{position:absolute;top:1px;right:1px;display:none;gap:2px;background:rgba(255,255,255,.96);border:1px solid var(--line);border-radius:7px;padding:2px;box-shadow:var(--shadow-sm);z-index:5} .mcell:hover .cell-tools{display:flex} .ct{width:22px;height:22px;border:none;background:transparent;border-radius:5px;cursor:pointer;font-size:12px;display:grid;place-items:center;line-height:1} .ct:hover{background:var(--bg)} .ct.ok{color:var(--ok)}.ct.no{color:var(--danger)}.ct.send{color:var(--accent-ink)}.ct.cmt{filter:grayscale(.1)} /* ---------- богатая шапка колонки сотрудника ---------- */ .grid thead th.emp-col{padding:0;vertical-align:top;min-width:96px;max-width:108px} .eh{padding:3px 6px;text-align:left;line-height:1.18} .eh-name{font-weight:800;font-size:11px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .eh-name .eh-first{font-weight:600;color:var(--ink-soft)} .eh-pos{font-size:9px;color:var(--muted);text-transform:none;letter-spacing:0;margin:0 0 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .eh-rates{display:flex;gap:4px} .eh-rate{display:flex;flex-direction:column;background:var(--bg);border-radius:4px;padding:1px 4px;flex:1;min-width:0} .eh-rate i{font-style:normal;font-size:7.5px;color:var(--muted);text-transform:uppercase;letter-spacing:.01em;white-space:nowrap} .eh-rate b{font-size:9.5px;color:var(--ink);font-variant-numeric:tabular-nums} /* ---------- поповер комментария ---------- */ .cmt-pop{position:absolute;z-index:80;width:274px;background:var(--panel);border:1px solid var(--line-strong);border-radius:12px;box-shadow:var(--shadow);overflow:hidden} .cmt-head{display:flex;align-items:center;gap:5px;padding:6px 10px;background:#f4f7f9;border-bottom:1px solid var(--line);font-size:10.5px;font-weight:700;color:var(--ink-soft);cursor:move;user-select:none} .cmt-grip{color:var(--muted);letter-spacing:-2px} .cmt-x{margin-left:auto;border:none;background:transparent;font-size:16px;line-height:1;color:var(--muted);cursor:pointer} .cmt-x:hover{color:var(--danger)} .cmt-body{padding:8px} .cmt-cap{font-size:10px;font-weight:700;letter-spacing:.04em;color:var(--muted);margin-bottom:5px} .cmt-body textarea{width:100%;min-height:30px;resize:vertical;font-size:12.5px;border:1.5px solid var(--line);border-radius:8px;padding:6px 9px;background:#fbfcfd} .cmt-body textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft);background:#fff} .cmt-files{display:flex;flex-direction:column;gap:4px;margin-top:8px} .cmt-file{display:flex;align-items:center;gap:6px;background:var(--info-soft);border-radius:7px;padding:3px 8px;font-size:11.5px} .cmt-file a{color:var(--info);flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .cmt-file button{border:none;background:transparent;color:var(--muted);cursor:pointer;font-size:14px} .cmt-file button:hover{color:var(--danger)} .cmt-foot{display:flex;align-items:center;gap:8px;margin-top:9px} .cmt-clip{width:32px;height:32px;border:1.5px solid var(--line);border-radius:9px;display:grid;place-items:center;cursor:pointer;color:var(--ink-soft);flex:none} .cmt-clip:hover{border-color:var(--accent);color:var(--accent-ink)} .cmt-clip svg{width:16px;height:16px} .cmt-fname{flex:1;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .cmt-foot .cmt-ico{margin-left:auto} /* ---- иконочный ряд действий поповера: единый размер, цвет по действию, мгновенная подсказка data-tip ---- */ .cmt-ico-row{display:flex;flex-wrap:wrap;gap:6px} .cmt-ico{width:34px;height:34px;flex:none;display:grid;place-items:center;border-radius:9px;border:1.5px solid var(--line);background:#fff;color:var(--ink-soft);cursor:pointer;padding:0;transition:all .14s} .cmt-ico svg{width:18px;height:18px} .cmt-ico:hover{transform:translateY(-1px)} .cmt-ico.accent{background:var(--accent-soft);border-color:transparent;color:var(--accent-ink)} .cmt-ico.accent:hover{background:var(--accent);color:#fff} .cmt-ico.ok{background:var(--ok-soft);border-color:transparent;color:var(--ok)} .cmt-ico.ok:hover{background:var(--ok);color:#fff} .cmt-ico.danger{background:var(--danger-soft);border-color:transparent;color:var(--danger)} .cmt-ico.danger:hover{background:var(--danger);color:#fff} .cmt-ico.pay{background:#efe9fb;border-color:transparent;color:#7c5cd6} .cmt-ico.pay:hover{background:#7c5cd6;color:#fff} .cmt-ico.ghost{background:transparent;color:var(--muted)} .cmt-ico.ghost:hover{background:var(--bg);color:var(--ink)} .cell-clip{position:absolute;bottom:0;left:11px;font-size:9px;pointer-events:none;opacity:.75} /* сдвинут правее уголка-комментария */ /* ================= v3: ячейки-таблица, чипы, календарь, карточки ================= */ /* ячейки как в таблице: выделение по всей ячейке, без «пилюли» */ .mcell.editable{cursor:cell} .mcell input.val:focus,.tabel input.att:focus{outline:none;border-radius:0;background:#fff;box-shadow:none} .mcell.editable:focus-within,.acell.editable:focus-within{box-shadow:inset 0 0 0 2px var(--accent);background:#fff;z-index:3} /* «+» для комментария в левом верхнем углу — на любой заполняемой */ .cell-plus{position:absolute;top:0;left:0;width:13px;height:13px;border:none;background:transparent;color:var(--muted);font-size:12px;line-height:11px;cursor:pointer;opacity:.32;padding:0;z-index:4} .mcell:hover .cell-plus{opacity:.7} .cell-plus:hover{opacity:1!important;color:var(--accent-ink)} .cell-plus.has{opacity:1;color:var(--info);font-weight:800} /* квадрат-протяжка (fill-handle) справа-внизу */ .fill-handle{position:absolute;right:-1px;bottom:-1px;width:7px;height:7px;background:var(--accent);border:1px solid #fff;cursor:crosshair;opacity:0;z-index:6} .mcell.editable:focus-within .fill-handle,.acell.editable:focus-within .fill-handle{opacity:1} /* только при фокусе — чтобы не было «двух точек» с кнопкой-меню на hover */ .fill-target{box-shadow:inset 0 0 0 1px var(--accent)!important;background:var(--accent-soft)!important} body.filling{cursor:crosshair;user-select:none} /* фильтр по компаниям (чипы) */ .cofilter{display:flex;gap:8px;overflow-x:auto;padding-bottom:5px;margin-bottom:8px;align-items:center} .cofilter.catfilter{margin-bottom:8px} .catfilter-cap{font-size:12px;font-weight:700;color:var(--ink-soft);flex:none} .cochip.catchip{padding:6px 12px;font-size:12.5px;border-radius:9px} .cochip.catchip.is-active{background:var(--teal,#0d9488);border-color:var(--teal,#0d9488);color:#fff} /* выпадающий выбор ведомости */ .led-dd{display:inline-flex;align-items:center;gap:9px;background:#fff;border:1.5px solid var(--line);border-radius:11px;padding:6px 12px;flex:none} .led-dd-cap{font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)} .led-dd-sel{border:none;background:transparent;font:inherit;font-weight:700;color:var(--ink);font-size:14px;min-width:220px;max-width:340px;cursor:pointer;outline:none;padding:2px 4px} .led-dd-sel:focus{color:var(--accent)} .cochip.co-off{opacity:.6;border-style:dashed} .co-badge-off{background:var(--warn-soft,#fbf1de);color:#b26a00;font-size:9px;font-weight:800;border-radius:5px;padding:1px 5px;margin-left:6px} /* компактные карточки компаний (режим «Все ведомости» — быстрый обзор) */ .cat-group-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:12px} .dept-card{display:flex;flex-direction:column;gap:8px;background:var(--panel,#fff);border:1px solid var(--line);border-radius:12px;padding:14px 16px;text-decoration:none;color:var(--ink);transition:border-color .13s,box-shadow .13s,transform .08s;box-shadow:var(--shadow-sm)} .dept-card:hover{border-color:var(--accent);box-shadow:0 6px 18px rgba(22,50,63,.1);transform:translateY(-1px)} .dept-card .dc-name{display:flex;align-items:center;gap:8px;font-weight:800;font-size:14px;line-height:1.25} .dept-card .dc-meta{font-size:12.5px;color:var(--muted)} .dept-card .dc-meta b{color:var(--ink);font-variant-numeric:tabular-nums} .dept-card .dc-open{font-size:11.5px;font-weight:700;color:var(--accent);margin-top:2px} /* Пункт 4: плитка компании закрыта фин-блоком — фиолетовая */ .dept-card.dc-closed{position:relative;background:#f6f2ff;border-color:#7c3aed;box-shadow:0 2px 10px rgba(124,58,237,.12)} .dept-card.dc-closed:hover{border-color:#6d28d9;box-shadow:0 6px 18px rgba(124,58,237,.2)} .dept-card.dc-closed .dc-name,.dept-card.dc-closed .dc-open{color:#5b21b6} .dept-card .dc-closed-badge{position:absolute;top:10px;right:12px;font-size:9.5px;font-weight:800;color:#fff;background:#7c3aed;border-radius:6px;padding:2px 7px;letter-spacing:.02em} /* фин-блок: подсветка ведомостей, присланных на оплату / оплаченных */ .dept-card.dc-topay{position:relative;border-color:var(--info,#2f80b5);background:var(--info-soft,#eaf3fb);box-shadow:0 2px 10px rgba(47,128,181,.14)} .dept-card.dc-topay:hover{border-color:var(--info,#2f80b5);box-shadow:0 6px 18px rgba(47,128,181,.2)} .dept-card .dc-topay-badge{position:absolute;top:10px;right:12px;font-size:9.5px;font-weight:800;color:#fff;background:var(--info,#2f80b5);border-radius:6px;padding:2px 7px;white-space:nowrap} .dept-card .dc-topay-badge.dc-adv-badge{background:var(--warn,#e9a23b)} /* аванс на оплате — янтарный, чтобы отличать от зарплаты */ .dept-card.dc-paidall{position:relative;border-color:#25b07a;background:#eefaf4} .dept-card .dc-paid-badge{position:absolute;top:10px;right:12px;font-size:9.5px;font-weight:800;color:#fff;background:#25b07a;border-radius:6px;padding:2px 7px;white-space:nowrap} .dept-card.dc-unconf{border-style:dashed;opacity:.75} .dc-off{color:#b26a00;font-weight:700} /* не запущенная ведомость (видна только админу) — приглушённая, штриховая рамка */ .dept-card.dc-inactive{position:relative;border-style:dashed;border-color:#c3c8d0;background:repeating-linear-gradient(135deg,#fafbfc,#fafbfc 9px,#f2f4f7 9px,#f2f4f7 18px);opacity:.9} .dept-card.dc-inactive .dc-name,.dept-card.dc-inactive .dc-open{color:#7a828e} .dept-card .dc-off-badge{position:absolute;top:10px;right:12px;font-size:9.5px;font-weight:800;color:#fff;background:#94a0ad;border-radius:6px;padding:2px 7px;white-space:nowrap;letter-spacing:.02em} .cochip.co-runoff{border-style:dashed;border-color:#c3c8d0;background:#f6f7f9;color:#7a828e} .cochip.co-runoff .co-name{color:#7a828e} /* админ: переключатель «запуска» ведомости в списке (Админка → Ведомости) */ .dept-run{display:inline-flex;align-items:center;gap:7px;cursor:pointer;user-select:none;white-space:nowrap} .dept-run input{position:absolute;opacity:0;width:0;height:0} .dept-run-sw{position:relative;width:34px;height:19px;border-radius:19px;background:#cbd2da;transition:background .16s;flex:none} .dept-run-sw::after{content:"";position:absolute;top:2px;left:2px;width:15px;height:15px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.25);transition:transform .16s} .dept-run.on .dept-run-sw{background:#25b07a} .dept-run.on .dept-run-sw::after{transform:translateX(15px)} .dept-run-txt{font-size:11.5px;font-weight:700;color:#8a929c} .dept-run.on .dept-run-txt{color:#1c8f63} /* поиск ведомости в обзоре */ .ov-search-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px} .ov-search{display:flex;align-items:center;gap:9px;background:var(--panel,#fff);border:1.5px solid var(--line);border-radius:11px;padding:9px 14px;color:var(--muted);max-width:420px;flex:1 1 240px} .ov-taskbtn{display:inline-flex;align-items:center;gap:7px;border:1.5px solid var(--line);background:#fff;border-radius:11px;padding:9px 14px;font:inherit;font-size:13px;font-weight:700;color:var(--ink-soft);cursor:pointer;white-space:nowrap;transition:all .13s} .ov-taskbtn:hover{border-color:var(--accent,#16b3c4)} .ov-taskbtn.on{background:var(--accent,#16b3c4);border-color:var(--accent,#16b3c4);color:#fff;box-shadow:0 1px 4px rgba(22,179,196,.4)} .ov-search input{border:none;background:transparent;font:inherit;font-size:14px;color:var(--ink);width:100%;outline:none} .ov-search:focus-within{border-color:var(--accent)} /* «Войти как» — кастомный дропдаун с поиском */ .asw{position:relative;display:flex;align-items:center;gap:8px} .asw-btn{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1.5px solid var(--line);border-radius:10px;padding:7px 11px;font:inherit;font-size:13px;font-weight:600;color:var(--ink);cursor:pointer;max-width:240px} .asw-btn:hover{border-color:var(--accent)} .asw-cur{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:180px} .asw-pop{position:absolute;top:calc(100% + 6px);right:0;width:320px;max-width:88vw;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 14px 40px rgba(22,50,63,.18);z-index:140;overflow:hidden} .asw-search-wrap{display:flex;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid var(--line);color:var(--muted)} .asw-search-wrap input{border:none;background:transparent;font:inherit;font-size:14px;color:var(--ink);width:100%;outline:none} .asw-list{max-height:min(60vh,440px);overflow-y:auto;padding:5px} .asw-item{display:flex;flex-direction:column;gap:1px;padding:7px 10px;border-radius:8px;text-decoration:none;color:var(--ink)} .asw-item:hover{background:var(--accent-soft,#e6f4f2)} .asw-item.is-cur{background:var(--accent);color:#fff} .asw-item.is-cur .asw-meta{color:rgba(255,255,255,.85)} .asw-nm{font-weight:600;font-size:13px} .asw-meta{font-size:11px;color:var(--muted)} .asw-empty{padding:14px;text-align:center;color:var(--muted);font-size:13px} /* 3 кнопки отправки: выходы+штрафы (зелёная) / бонусы (фиолетовая) / всё (синяя) */ .led-send3{display:inline-flex;gap:6px;align-items:center;flex-wrap:nowrap} .led-send3 .ls-work{background:#e7f6ef;border-color:#25b07a;color:#177c56} .led-send3 .ls-work:hover{background:#d6efe3;border-color:#1c9268} .led-send3 .ls-bonus{background:#f1e9fb;border-color:#8b5cf6;color:#6d3fd6} .led-send3 .ls-bonus:hover{background:#e8dcfa;border-color:#7a4ae0} .led-send3 .ls-avans{background:#e6f1fa;border-color:#2f80b5;color:#1c5f8a} .led-send3 .ls-avans:hover{background:#d6e8f6;border-color:#256a99} .led-send3 .ls-all{background:var(--accent);border-color:var(--accent);color:#fff} .led-send3 .lst-arr{font-weight:800;margin:0 1px} /* переводы по периодам (история ведомостей сотрудника) */ .dh-list{display:flex;flex-direction:column;gap:5px;margin-bottom:6px} .dh-row{display:flex;align-items:center;gap:8px;background:var(--accent-soft,#e6f4f2);border-radius:8px;padding:5px 10px;font-size:12.5px} .dh-row span{flex:1} .dh-add{display:flex;gap:6px;align-items:center;flex-wrap:wrap} .dh-add input,.dh-add select{height:32px} .cochip{display:inline-flex;align-items:center;gap:7px;background:#fff;border:1.5px solid var(--line);border-radius:11px;padding:8px 13px;white-space:nowrap;font-weight:700;color:var(--ink-soft);flex:none;transition:all .13s} .cochip:hover{text-decoration:none;border-color:var(--accent);color:var(--accent-ink)} .cochip.is-active{background:var(--accent);border-color:var(--accent);color:#fff} .co-name{font-size:12.5px} .co-badge{font-size:8.5px;font-weight:800;background:var(--info-soft);color:var(--info);border-radius:5px;padding:2px 5px;letter-spacing:.03em} .cochip.is-active .co-badge{background:rgba(255,255,255,.24);color:#fff} .co-badge.all{background:var(--navy);color:#fff} /* правка суммы бонуса/аванса прямо в «Согласовании» */ .rv-edit{display:inline-flex;align-items:center;gap:3px} .rv-edit-inp{width:82px;text-align:right;border:1.5px solid var(--line);border-radius:7px;padding:3px 6px;font:inherit;font-weight:700;background:#fffdf5} .rv-edit-inp:focus{outline:none;border-color:var(--teal,#0d9488);background:#fff} .rv-edit-cur{font-weight:700;color:var(--muted);font-size:12px} .rv-edit-save{border:1px solid #25b07a;background:#e7f6ef;color:#177c56;border-radius:7px;width:24px;height:24px;cursor:pointer;font-weight:800;line-height:1;display:inline-flex;align-items:center;justify-content:center;padding:0} .rv-edit-save:hover{background:#177c56;color:#fff;border-color:#177c56} /* ШТРАФ — значение красным (в ведомости: и при вводе, и при показе) + красная строка в согласовании */ .mcell.cell-penalty,.mcell.cell-penalty .ro{color:#d11f3a!important} .mcell.cell-penalty .cell-in.val{color:#d11f3a!important;font-weight:700} .rv-cell-row.rv-penalty td{background:#fdecec!important} .rv-cell-row.rv-penalty .rv-goto,.rv-cell-row.rv-penalty .num b{color:#c0273f!important;font-weight:700} /* ОПЛАЧЕННЫЙ аванс: ЗАЛИВКА ячейки фиолетовым, а ТЕКСТ значения — тёмный/читаемый (не фиолетовый шрифт) */ .mcell.adv-paid{background:#d8c8f5!important;box-shadow:inset 0 0 0 1px #c3aef0!important} .mcell.adv-paid .ro,.mcell.adv-paid .cell-in.val{color:#241653!important;font-weight:700!important} .mcell.adv-paid::after{color:#5b21b6!important} /* Пункт 3: бейдж «ждёт меня» на чипе подразделения + чип «только с задачами» */ .co-await{font-size:11px;font-weight:800;min-width:18px;height:18px;padding:0 5px;display:inline-flex;align-items:center;justify-content:center;border-radius:9px;background:var(--warn,#e8a33d);color:#fff;box-shadow:0 1px 2px rgba(160,110,20,.35)} .cochip.has-await{border-color:var(--warn,#e8a33d)} .cochip.is-active .co-await{background:#fff;color:var(--accent-ink,#1d5c54)} .cochip.co-taskonly{border-style:dashed;color:#8a6d1f} .cochip.co-taskonly.is-active{background:var(--warn-soft,#fbf1de);border-color:var(--warn,#e8a33d);border-style:solid;color:#8a6d1f} /* Пункт 5: заголовок-группа подразделения в таблицах фин-блока (Зарплаты/Бонусы) */ tr.rv-grp td{background:var(--navy-soft,#eef2f8);padding:7px 12px;border-top:2px solid var(--line);position:sticky;left:0} tr.rv-grp .rv-grp-nm{font-weight:800;font-size:12px;letter-spacing:.02em;color:var(--navy,#26374d);text-transform:uppercase} tr.rv-grp .rv-grp-cnt{margin-left:10px;font-size:10.5px;font-weight:700;color:#fff;background:var(--warn,#e8a33d);border-radius:7px;padding:2px 7px} /* Пункт 4: закрытая фин-блоком ведомость — «горит фиолетовым» в списке + кнопка закрытия */ .cochip.co-closed{border-color:#7c3aed;background:#f3efff;color:#5b21b6} .cochip.co-closed .co-name{color:#5b21b6} .cochip.co-closed.is-active{background:#7c3aed;border-color:#7c3aed;color:#fff} .cochip.co-closed.is-active .co-name{color:#fff} .co-badge-closed{font-size:8.5px;font-weight:800;background:#7c3aed;color:#fff;border-radius:5px;padding:2px 5px;letter-spacing:.02em} .cochip.is-active .co-badge-closed{background:rgba(255,255,255,.28)} .btn.vclose{border-color:#c9b6f0;color:#5b21b6;background:#f6f2ff} .btn.vclose:hover{background:#ece3ff;border-color:#7c3aed} .btn.vclose.is-closed{background:#7c3aed;border-color:#7c3aed;color:#fff} /* кнопка периода + календарь */ .led-top-l{display:flex;flex-direction:column;align-items:flex-start} .led-top-l .back{margin-bottom:6px} .period-btn{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1.5px solid var(--line);border-radius:10px;padding:8px 13px;cursor:pointer;font:inherit;font-weight:700;color:var(--ink);margin-top:6px} .period-btn:hover{border-color:var(--accent)} .period-btn svg{width:16px;height:16px;color:var(--accent-ink)} .period-btn .caret{color:var(--muted);font-size:10px} .period-btn.lg{font-size:14px;padding:10px 16px} .cal-pop[hidden]{display:none} .cal-pop{position:absolute;z-index:90;width:216px;background:#fff;border:1px solid var(--line-strong);border-radius:13px;box-shadow:var(--shadow);padding:10px} .cal-head{margin-bottom:2px} .cal-cap{font-size:9px;font-weight:800;color:var(--accent-ink);letter-spacing:.07em;text-transform:uppercase} .cal-yr{display:flex;align-items:center;justify-content:space-between;margin:4px 0 9px} .cal-yr b{font-family:'Unbounded','Inter',sans-serif;font-size:15px;color:var(--ink);letter-spacing:.01em} .cal-nav{border:none;background:var(--bg);width:24px;height:24px;border-radius:7px;cursor:pointer;font-size:14px;color:var(--ink-soft);line-height:1;display:grid;place-items:center;transition:background .12s,color .12s} .cal-nav:hover{background:var(--accent-soft);color:var(--accent-ink)} .cal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-bottom:8px} .cal-mo{border:none;background:var(--bg);border-radius:8px;padding:8px 0;cursor:pointer;font:inherit;font-weight:700;font-size:11px;color:var(--ink-soft);transition:background .12s,color .12s,transform .1s} .cal-mo:hover{background:var(--accent-soft);color:var(--accent-ink)} .cal-mo.is-sel{background:var(--accent);color:#fff;box-shadow:0 3px 9px -3px rgba(22,179,196,.55)} .cal-all{width:100%;border:1px dashed var(--accent);background:var(--accent-soft);color:var(--accent-ink);border-radius:9px;padding:7px;cursor:pointer;font:inherit;font-weight:700;font-size:11px;transition:background .12s} .cal-all:hover{background:#d6f2f5} /* карточка канбана (скрин 4) */ .pcard{position:relative;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px 18px;box-shadow:var(--shadow-sm);transition:all .15s;display:block} .pcard:hover{text-decoration:none;border-color:var(--accent);box-shadow:var(--shadow);transform:translateY(-2px)} .pcard.is-active{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)} .pcard-mo{font-family:'Unbounded','Inter',sans-serif;font-weight:700;font-size:15px;color:var(--accent-ink);display:flex;align-items:center;gap:7px;margin-bottom:12px} .pcard-dot{width:7px;height:7px;border-radius:50%;background:var(--warn);flex:none} .pcard-sum{font-family:'Unbounded','Inter',sans-serif;font-weight:700;font-size:24px;color:var(--ink);line-height:1} .pcard-sum .rub{font-size:15px;color:var(--muted);font-weight:600} .pcard-foot{font-size:11.5px;color:var(--muted);margin-top:9px} .pcard-arrow{position:absolute;right:16px;bottom:14px;color:var(--accent);opacity:0;transition:.15s;font-size:17px;font-weight:700} .pcard:hover .pcard-arrow{opacity:1} /* ================= v4: прокрутка/sticky, ячейки-zip, Да/Нет, стоп, управление ================= */ /* единая область прокрутки — сама .main; таблицы без своего скролла → sticky работает по-настоящему */ .tbl-scroll{overflow:visible;max-height:none;border:none;box-shadow:none;border-radius:0;background:transparent} table.grid{border-top:1px solid var(--line);border-left:1px solid var(--line);border-radius:0} table.grid thead th{top:0} /* второй таблице (матрице) — заголовок липнет тоже к верху .main */ .dept-block .tbl-scroll+.tbl-scroll table.grid thead th{top:0} /* ячейки как в zip (скрин 4): скруглённое бирюзовое выделение, цифры по центру */ .mcell input.val,.tabel input.att{text-align:center;border-radius:6px} .mcell.editable:focus-within,.acell.editable:focus-within{box-shadow:none;background:transparent} .mcell input.val:focus,.tabel input.att:focus{outline:none;box-shadow:inset 0 0 0 2px var(--accent);background:#fff;border-radius:6px} /* зелёный «+» в левом верхнем углу */ .cell-plus{color:var(--ok);font-weight:800;border-radius:0 0 5px 0} .cell-plus:hover{background:var(--ok-soft);color:var(--ok)} .cell-plus.has{color:var(--info);opacity:1} /* ПЛАН 135% — Да/Нет */ .yn-cell{padding:1px 3px;text-align:center} .mcell.yn-cell{text-align:center;vertical-align:middle} /* Да/Нет по центру. НЕ display:flex — иначе выпадает из табличной раскладки (ячейки не выравниваются по колонкам) */ /* суммы авто-ячеек (Бонусная часть фин-блок / налог портал) — по центру, моноширинно */ .mcell.cell-auto{text-align:center} .mcell.cell-auto .portal-val{display:inline-block} /* Да/Нет read-only бейдж — по центру ячейки-индикатора */ .yn-cell .yn-badge{display:inline-block;margin:0 auto} .yn{display:flex;gap:3px;justify-content:center;align-items:center;height:100%} .yn-b{border:1px solid var(--line);background:#fff;border-radius:6px;font:inherit;font-size:10px;font-weight:700;padding:2px 8px;cursor:pointer;color:var(--muted);line-height:1.3} .yn-b:hover{border-color:var(--muted)} .yn-b.yes.on{background:var(--ok);border-color:var(--ok);color:#fff} .yn-b.no.on{background:var(--danger);border-color:var(--danger);color:#fff} .yn-badge{font-size:10px;font-weight:800;padding:2px 8px;border-radius:6px;color:var(--muted)} .yn-badge.yes{background:var(--ok-soft);color:var(--ok)} .yn-badge.no{background:var(--danger-soft);color:var(--danger)} /* стоп-сотрудник */ .mcell.stopped{background:repeating-linear-gradient(45deg,#f7f8fa,#f7f8fa 5px,#eef1f4 5px,#eef1f4 10px)!important;color:var(--muted)} .mcell.stopped .ro,.mcell.stopped input{color:var(--muted)} th.stopped .eh,th.stopped{opacity:.55} .stopbadge{display:inline-block;font-size:7.5px;font-weight:800;background:var(--danger);color:#fff;border-radius:4px;padding:1px 4px;letter-spacing:.03em;vertical-align:middle} .stopbadge.abs{position:absolute;top:3px;left:6px;z-index:2} /* управление сотрудником в шапке колонки */ .emp-ctl{position:absolute;top:2px;right:2px;display:none;gap:2px;z-index:3} .emp-col:hover .emp-ctl{display:flex} .emp-ctl form{margin:0;display:inline} .emp-ctl-b{width:17px;height:17px;border:none;background:rgba(255,255,255,.92);border-radius:4px;cursor:pointer;font-size:9px;line-height:1;color:var(--ink-soft);padding:0;box-shadow:var(--shadow-sm)} .emp-ctl-b:disabled{opacity:.32;cursor:not-allowed;box-shadow:none} .emp-ctl-b.is-locked{opacity:.4;box-shadow:none;cursor:help} .emp-ctl-b:hover{background:var(--bg)} .emp-ctl-b.del:hover{background:var(--danger-soft);color:var(--danger)} /* действия в поповере комментария */ .cmt-actions{display:flex;flex-direction:column;gap:7px;margin-top:9px;padding-top:9px;border-top:1px solid var(--line)} .cmt-actions:empty{display:none;margin:0;padding:0;border:none} /* добавить сотрудника — кнопка в шапке направления */ .dept-head .btn.xs{white-space:nowrap} .grid thead th.emp-col{position:relative} /* ================= v5: единая таблица — одна закреплённая шапка ================= */ .ledger-scroll{overflow:auto;max-height:calc(100vh - 186px);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);background:#fff} .ledger-table{border-top:none;border-left:none} /* закреплённая шапка (ФИО/должность/ставки) — липнет к верху контейнера. Слои (низ→верх): обычная ячейка 0 · ячейка в фокусе 5 · триггер-меню ⋯ 6 · липкая левая колонка 20 · липкая шапка 21 · угол (шапка×левая) 23. Так триггер выше соседа-в-фокусе (не перекрывается), но уходит ПОД липкие при прокрутке. */ /* префикс table. — чтобы перебить более специфичные общие правила table.grid thead th (z-index:3) и table.grid .rowhdr (2) */ table.ledger-table thead th{position:sticky;top:0;z-index:21} table.ledger-table thead th.rowhdr{z-index:23} table.ledger-table .rowhdr{position:sticky;left:0;z-index:20} /* строки-разделители секций */ .sect-row td{background:var(--accent-soft);height:20px;border-bottom:1px solid var(--line-strong);border-right-color:var(--accent-soft)} .sect-row .rowhdr{background:var(--accent-soft)!important;color:var(--accent-ink);font-weight:800;font-size:9.5px;text-transform:uppercase;letter-spacing:.04em} /* ================= v6: одинаковые ячейки (fixed layout), параметры строками ================= */ .ledger-table{table-layout:fixed;width:auto} .ledger-table col.col-hdr{width:174px} .ledger-table col.col-emp{width:96px} /* шапка колонки — только ФИО, по центру, невысокая */ .ledger-table thead th.emp-col{vertical-align:middle;min-width:0;max-width:none;height:auto;padding:0} .ledger-table .eh{padding:5px 6px;text-align:center;line-height:1.15} .ledger-table .eh-name{font-weight:800;font-size:11px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .ledger-table .eh-first{font-weight:600;font-size:10px;color:var(--ink-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} /* строки-параметры (должность/ставки) */ .param-row td{background:#fbfcfd;height:22px} .param-row .rowhdr{color:var(--ink-soft);font-weight:700} .pcell{text-align:center;font-variant-numeric:tabular-nums;color:var(--ink);padding:0 4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .pcell.pos{font-size:10px;color:var(--ink-soft)} /* вкладки админки */ .adm-tabs{display:flex;gap:6px;margin-bottom:16px;border-bottom:1px solid var(--line)} .adm-tab{padding:9px 15px;font-weight:700;font-size:13px;color:var(--ink-soft);border-bottom:2px solid transparent;margin-bottom:-1px} .adm-tab:hover{color:var(--accent-ink);text-decoration:none} .adm-tab.is-active{color:var(--accent-ink);border-bottom-color:var(--accent)} .adm-tab-n{font-size:10px;background:var(--bg);border-radius:20px;padding:1px 7px;color:var(--muted);font-weight:700} /* ================= v7: фикс закрепления строки-шапки + типы ячеек ================= */ /* БАГ был тут: emp-col имел position:relative и перебивал sticky → «клеилась одна ячейка». sticky сам является containing block для абсолютных .emp-ctl/.stopbadge, relative не нужен. */ .ledger-table thead th.emp-col,.grid thead th.emp-col{position:sticky!important;top:0;z-index:5} table.ledger-table thead th.emp-col{z-index:21} /* шапка ведомости выше триггера-меню (6), но угол (23) выше неё */ table.ledger-table thead th.rowhdr{z-index:23} /* ячейка-список (select) */ .cell-sel{width:100%;height:22px;border:none;background:transparent;font:inherit;font-size:10.5px;text-align:center;color:var(--ink);cursor:pointer;padding:0 2px} .cell-sel:focus{outline:none;box-shadow:inset 0 0 0 2px var(--accent);border-radius:6px;background:#fff} /* строка ИТОГО К ВЫПЛАТЕ — акцент */ .row-total.grand td{background:#e9f7f9!important;color:var(--accent-ink);font-weight:800} .row-total.grand .rowhdr{background:#d9f0f3!important} /* ================= v8: конструктор ведомости + красивые фильтры ================= */ .cnstr-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:6px} @media(max-width:920px){.cnstr-grid{grid-template-columns:1fr}} .cnstr-blk{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--shadow-sm)} .cnstr-blk-head{padding:11px 14px 10px;border-bottom:1px solid var(--line);position:relative} .cnstr-blk-head::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px} .blk-accrual .cnstr-blk-head{background:var(--ok-soft)} .blk-accrual .cnstr-blk-head::before{background:var(--ok)} .blk-deduction .cnstr-blk-head{background:var(--danger-soft)} .blk-deduction .cnstr-blk-head::before{background:var(--danger)} .blk-indicator .cnstr-blk-head{background:var(--info-soft)} .blk-indicator .cnstr-blk-head::before{background:var(--info)} .cnstr-blk-title{font-family:'Unbounded','Inter',sans-serif;font-weight:700;font-size:13px} .blk-accrual .cnstr-blk-title{color:#1c7d57} .blk-deduction .cnstr-blk-title{color:var(--danger)} .blk-indicator .cnstr-blk-title{color:var(--info)} .cnstr-blk-hint{font-size:10.5px;color:var(--ink-soft);margin-top:2px} .cnstr-rows{padding:11px 12px;display:flex;flex-direction:column;gap:7px;flex:1} .cnstr-row{display:flex;flex-wrap:wrap;gap:6px;align-items:center;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:5px 7px;transition:border-color .12s} .cnstr-row:focus-within{border-color:var(--accent);background:#fff} .cnstr-label{flex:1;min-width:0;border:none!important;background:transparent!important;padding:4px 6px!important;font-size:12.5px;box-shadow:none!important} .cnstr-type{flex:none;width:88px} .cnstr-opts{flex:1 0 100%;order:3;font-size:11.5px;padding:6px 9px;background:#fff} .cnstr-del{flex:none;border:none;background:transparent;color:var(--muted);cursor:pointer;font-size:13px;width:22px;height:22px;border-radius:6px;display:grid;place-items:center} .cnstr-del:hover{background:var(--danger-soft);color:var(--danger)} .cnstr-empty{color:var(--muted);font-size:11.5px;padding:8px 4px;text-align:center;font-style:italic} .cnstr-add{margin:0 12px 12px;align-self:flex-start} /* красивые select-фильтры (везде, кроме ячеек ведомости) */ select:not(.cell-sel){appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2393a2b1' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;padding-right:30px!important} .filters{background:var(--panel)!important;border:1px solid var(--line)!important;border-radius:var(--radius)!important;box-shadow:var(--shadow-sm)} .filters label{font-size:10.5px} .filters select{font-weight:600;min-width:190px} /* ================= v9: модалка добавления/увольнения + отметка «уволен» ================= */ .addm[hidden]{display:none} .addm{position:fixed;inset:0;background:rgba(22,50,63,.28);display:grid;place-items:center;z-index:120} .addm-box{width:400px;max-width:92vw;background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow);overflow:hidden;animation:addmIn .16s ease} @keyframes addmIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}} .addm-head{display:flex;align-items:center;justify-content:space-between;padding:13px 16px;background:#f4f7f9;border-bottom:1px solid var(--line);font-weight:700;font-size:13.5px} .addm-x{border:none;background:transparent;font-size:18px;color:var(--muted);cursor:pointer;line-height:1} .addm-x:hover{color:var(--danger)} .addm-tabs{display:flex;gap:4px;padding:10px 12px 0} .addm-tab{border:none;background:transparent;padding:7px 12px;border-radius:8px 8px 0 0;font:inherit;font-weight:700;font-size:12.5px;color:var(--ink-soft);cursor:pointer;border-bottom:2px solid transparent} .addm-tab.is-active{color:var(--accent-ink);border-bottom-color:var(--accent);background:var(--accent-soft)} .addm-n{font-size:10px;background:var(--bg);border-radius:20px;padding:1px 6px;color:var(--muted)} .addm-body{max-height:46vh;overflow:auto;padding:10px 14px} .addm-list{display:flex;flex-direction:column;gap:6px} .addm-list[hidden]{display:none} .addm-row{display:flex;align-items:center;justify-content:space-between;gap:10px;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:7px 11px} .addm-row[hidden]{display:none!important} /* поиск: атрибут hidden должен прятать строку (иначе display:flex его перебивает) */ /* ── окно «Оплатить всех» (фин-блок) ── */ .payall-btn{white-space:nowrap} .pa-body{padding:16px} .pa-intro{font-size:12.5px;color:var(--ink-soft);margin-bottom:12px;line-height:1.5} .pa-filters{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding-bottom:11px;border-bottom:1px solid var(--line);margin-bottom:10px} .pa-fcap{font-size:11px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.03em} .pa-chk{display:inline-flex;align-items:center;gap:6px;font-size:13px;cursor:pointer;user-select:none} .pa-chk.t-of{color:#2f6f9e}.pa-chk.t-ip{color:#6d3fd6}.pa-chk.t-sz{color:#1c8a5c}.pa-chk.t-ne{color:#b8781a} .pa-list-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px} .pa-sum{font-size:13px;font-weight:800;color:var(--teal,#0d9488)} .pa-list{max-height:46vh;overflow:auto;display:flex;flex-direction:column;gap:5px;padding-right:2px} .pa-row{display:grid;grid-template-columns:minmax(150px,1fr) auto minmax(0,150px) auto;align-items:center;gap:12px;padding:8px 11px;border-radius:9px;background:var(--bg);border:1px solid transparent;transition:border-color .12s} .pa-row:hover{border-color:var(--line)} .pa-row[hidden]{display:none} .pa-name{font-size:13px} .pa-type-b{font-size:9.5px;font-weight:800;border-radius:6px;padding:2px 8px;color:#fff;white-space:nowrap;justify-self:start} .pa-type-b.t-ОФ{background:#2f80b5}.pa-type-b.t-ИП{background:#8a5cf0}.pa-type-b.t-СЗ{background:#25a06b}.pa-type-b.t-NE{background:#c98a1e} /* «Официальные ИП» — цветовой акцент чипов-фильтров и заголовков групп по типу оформления */ .cochip.ipv-cochip.is-active.t-ОФ{border-color:#2f80b5;color:#2f6f9e}.cochip.ipv-cochip.is-active.t-ИП{border-color:#8a5cf0;color:#6d3fd6}.cochip.ipv-cochip.is-active.t-СЗ{border-color:#25a06b;color:#1c8a5c}.cochip.ipv-cochip.is-active.t-NE{border-color:#c98a1e;color:#b8781a} .rv-grp.rv-grp-type{border-left:3px solid var(--line)} .rv-grp.rv-grp-type.t-ОФ{border-left-color:#2f80b5}.rv-grp.rv-grp-type.t-ИП{border-left-color:#8a5cf0}.rv-grp.rv-grp-type.t-СЗ{border-left-color:#25a06b}.rv-grp.rv-grp-type.t-NE{border-left-color:#c98a1e} .ipv-deptfilter{display:inline-flex;align-items:center;gap:6px;margin-left:auto;font-size:12px} .ipv-df-cap{color:var(--muted);font-weight:700} .ipv-df-sel{border:1.5px solid var(--line);border-radius:9px;padding:6px 10px;font:inherit;font-weight:600;color:var(--ink);background:#fff;cursor:pointer;max-width:220px} .ipv-df-sel:focus{outline:none;border-color:var(--teal,#0d9488)} .pa-dept{font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .pa-amt{font-weight:800;min-width:96px;text-align:right;font-size:13.5px} .pa-empty{color:var(--muted);text-align:center;padding:22px;font-style:italic} .pa-comment{display:flex;flex-direction:column;gap:5px;font-size:12px;font-weight:700;color:var(--ink-soft);margin-top:14px} .pa-comment input{border:1.5px solid var(--line);border-radius:10px;padding:10px 12px;font:inherit;font-weight:600;color:var(--ink)} .pa-comment input:focus{outline:none;border-color:var(--teal,#0d9488)} .pa-req{color:#c0392b;font-weight:700} .pa-foot{display:flex;gap:10px;margin-top:14px} /* значки действий в согласовании (✓ + 💸) — в строку, а не в столбик */ .rv-act-c{display:flex;gap:6px;align-items:center;justify-content:flex-end;flex-wrap:nowrap} .addm-name{font-size:12.5px;font-weight:600} .addm-row form{margin:0} .addm-empty{color:var(--muted);font-size:12px;text-align:center;padding:14px;font-style:italic} /* поиск + занятые (уже в другой ведомости) в диалоге добавления */ .addm-search-wrap{padding:0 0 4px} .addm-search{width:100%;box-sizing:border-box;border:1.5px solid var(--line);border-radius:9px;padding:8px 10px;font:inherit;background:#fff} .addm-search:focus{outline:none;border-color:var(--teal,#0d9488)} .addm-row.is-busy{opacity:.7;background:#faf7f0} .addm-busy{font-size:11px;font-weight:700;color:#b26a00;background:var(--warn-soft,#fbf1de);border-radius:7px;padding:3px 8px;white-space:nowrap} .addm-foot{padding:11px 14px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:8px;align-items:center;background:#fbfcfd} .addm-new{display:flex;gap:6px;flex-wrap:wrap;align-items:center;flex:1} .addm-new[hidden]{display:none} .addm-new input{padding:6px 9px;font-size:12.5px;flex:1;min-width:90px} /* отметка «уволен» в шапке колонки */ .eh-dism{font-size:8px;font-weight:800;color:#fff;background:var(--danger);border-radius:4px;padding:1px 4px;display:inline-block;margin-top:2px;letter-spacing:.02em} /* ================= v10: этапы цепочки согласования ================= */ /* ячейки ведомости по этапам */ .mcell.st-s_head{background:var(--warn-soft)} .mcell.st-s_manager{background:#e7f1fa} .mcell.st-s_finance{background:#efe8fb} .mcell.st-approved{background:var(--ok-soft)} .mcell.st-rejected{background:var(--danger-soft);box-shadow:inset 0 0 0 1px #f3c4d0} .mcell.st-s_head.has-comment,.mcell.st-s_manager.has-comment,.mcell.st-s_finance.has-comment,.mcell.st-rejected.has-comment{} /* чипы статусов */ .tag.st-s_head{background:var(--warn-soft);color:#9a6b16} .tag.st-s_manager{background:#e7f1fa;color:var(--info)} .tag.st-s_finance{background:#efe8fb;color:#6b46c1} .tag.st-approved{background:var(--ok-soft);color:var(--ok)} .tag.st-rejected{background:var(--danger-soft);color:var(--danger)} /* легенда этапов */ .stage-legend{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:12px;font-size:11px;color:var(--ink-soft)} .stage-legend .sl{display:inline-flex;align-items:center;gap:5px} /* Сворачиваемая ВЕРХНЯЯ ПАНЕЛЬ ведомости (чипы + фильтры + легенда) — одним движением, плавно, без «дёрганья». */ .led-controls{overflow:hidden;transition:max-height .32s ease,opacity .24s ease;max-height:640px;opacity:1} .led-controls.is-folded{max-height:0;opacity:0} .led-fold-btn{display:inline-flex;align-items:center;gap:5px;background:var(--panel,#fff);border:1px solid var(--line);border-radius:9px;padding:7px 12px;font-size:12px;font-weight:700;color:var(--ink-soft);cursor:pointer;transition:background .15s,border-color .15s,color .15s;white-space:nowrap;line-height:1} .led-fold-btn:hover{border-color:var(--accent);color:var(--accent)} .led-fold-btn .lfb-car{transition:transform .28s ease;display:inline-block;font-size:10px} .led-fold-btn.is-folded .lfb-car{transform:rotate(-90deg)} .led-fold-btn.is-folded{background:var(--accent-soft,#eaf3f2);border-color:var(--accent);color:var(--accent-ink,#1d5c54)} .stage-legend .dot{width:10px;height:10px;border-radius:3px;display:inline-block} .stage-legend .d-head{background:var(--warn)} .stage-legend .d-mgr{background:var(--info)} .stage-legend .d-fin{background:#7c5cbf} .stage-legend .d-ok{background:var(--ok)} .stage-legend .d-rej{background:var(--danger)} .stage-legend .arr{color:var(--muted)} /* чекбоксы возврата в очереди */ .rev-cell{cursor:pointer} .rev-cell input.rev-chk{margin-right:2px} /* ===== Админка: роли (фильтр-чипы, массовое действие, матрица прав) ===== */ /* Чипы фильтра по ролям над таблицей сотрудников */ .role-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px} .rf-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:20px;font-size:12px;font-weight:700;color:var(--ink-soft);background:var(--panel);border:1.5px solid var(--line);box-shadow:var(--shadow-sm)} .rf-chip:hover{border-color:var(--accent);color:var(--accent-ink);text-decoration:none} .rf-chip.is-active{background:var(--accent);border-color:var(--accent);color:#fff} .rf-chip .rf-n{font-size:10.5px;font-weight:700;background:var(--bg);color:var(--muted);border-radius:20px;padding:1px 7px;min-width:16px;text-align:center} .rf-chip.is-active .rf-n{background:rgba(255,255,255,.25);color:#fff} /* Колонка чекбоксов в таблице сотрудников */ .tbl .rm-chk{text-align:center;width:34px} .tbl .rm-chk input{cursor:pointer;width:15px;height:15px;accent-color:var(--accent);vertical-align:middle} /* Панель массового назначения роли */ .bulk-bar{display:flex;flex-wrap:wrap;align-items:flex-end;gap:14px;margin-top:14px;padding:13px 16px;background:var(--accent-soft);border:1.5px solid var(--accent);border-radius:var(--radius);box-shadow:var(--shadow-sm)} .bulk-bar .bulk-count{font-size:13px;font-weight:700;color:var(--accent-ink);align-self:center} .bulk-bar .bulk-count b{color:var(--ink)} .bulk-bar .bulk-lbl{display:flex;flex-direction:column;gap:5px;font-size:11px;color:var(--accent-ink);font-weight:700;text-transform:uppercase} .bulk-bar .bulk-lbl select{padding:8px 11px;font-size:12.5px;font-weight:600;border-radius:9px;background:#fff;border:1.5px solid var(--line)} /* Вкладка «Права ролей»: карточки + матрица */ .role-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-bottom:20px} .role-card{background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:12px 13px} .role-card .rolechip{margin-bottom:8px} .role-card-desc{font-size:11.5px;line-height:1.5;color:var(--ink-soft)} .role-matrix .rm-cap{font-weight:600;color:var(--ink)} .role-matrix .rm-col{text-align:center} .role-matrix .rm-cell{text-align:center} .role-matrix tbody tr:hover{background:#f6fafb} .role-matrix .rm-yes{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--ok-soft);color:var(--ok);font-weight:800;font-size:13px} .role-matrix .rm-no{color:var(--muted);font-weight:700} /* ================= v11: доступы (логин/пароль) ================= */ .creds-box{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:10px 13px;margin-top:2px} .creds-info code{background:#fff;border:1px solid var(--line);border-radius:6px;padding:2px 9px;font-family:ui-monospace,Menlo,monospace;font-size:12.5px;color:var(--accent-ink);font-weight:700} .creds-act{display:flex;gap:8px} /* ================= v12: шестерёнка ведомости + левая панель согласования ================= */ .led-top-r{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end} .gear{position:relative} .gear-btn{width:31px;height:31px;border-radius:9px;border:1.5px solid var(--line);background:#fff;color:var(--ink-soft);cursor:pointer;display:grid;place-items:center} .gear-btn:hover{border-color:var(--accent);color:var(--accent-ink)} .gear-btn svg{width:16px;height:16px} .gear-menu[hidden]{display:none} .gear-menu{position:absolute;right:0;top:46px;width:290px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow);z-index:60;overflow:hidden;padding:6px} .gear-cap{font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:700;padding:6px 8px 4px} .gear-item{display:flex;align-items:center;gap:8px;width:100%;text-align:left;border:none;background:transparent;padding:9px 8px;border-radius:8px;font:inherit;font-weight:700;font-size:13px;color:var(--ink);cursor:pointer} .gear-item:hover{background:var(--accent-soft);color:var(--accent-ink)} .gear-item .gi-ico{color:var(--accent)} .gear-hint{font-size:11px;color:var(--muted);padding:2px 8px 6px} .emp-ctl-b.send{color:var(--accent-ink)} .emp-ctl-b.send:hover{background:var(--accent-soft)} /* согласование — мастер-деталь */ .rev-layout{display:flex;gap:16px;align-items:flex-start} .rev-side{flex:0 0 250px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:8px;position:sticky;top:78px} .rev-side-cap{font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:700;padding:8px 10px 6px} .rev-side-item{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:9px 11px;border-radius:10px;color:var(--ink);margin-bottom:2px} .rev-side-item:hover{background:var(--bg);text-decoration:none} .rev-side-item.is-active{background:var(--accent-soft)} .rev-side-item.is-active .rsi-name{color:var(--accent-ink)} .rsi-name{font-weight:700;font-size:12.5px;line-height:1.25} .rev-badge{flex:none;background:var(--warn);color:#fff;border-radius:20px;font-size:11px;font-weight:800;padding:1px 8px;min-width:22px;text-align:center} .rev-side-item.is-active .rev-badge{background:var(--accent)} .rev-main{flex:1;min-width:0} .rev-hint{font-size:12px;padding:0 16px 10px} /* шестерёнка: разделитель + опасный пункт */ .gear-sep{height:1px;background:var(--line);margin:6px 4px} .gear-item.danger{color:var(--danger)} .gear-item.danger:hover{background:var(--danger-soft);color:var(--danger)} /* фикс: единая таблица не должна растягиваться на 100% при малом числе колонок (иначе одна колонка сотрудника занимает пол-экрана) — ширина строго по колонкам */ .ledger-table{min-width:0!important} /* ================= v13: личная панель сотрудника (заполняет пустоту справа) ================= */ .dept-block.emp-mode .emp-row{display:flex;gap:18px;align-items:flex-start} .dept-block.emp-mode .ledger-scroll{flex:0 0 auto} .emp-summary{flex:1;min-width:300px;display:flex;flex-direction:column;gap:14px;position:sticky;top:16px} .es-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:16px 18px} .es-hero{background:linear-gradient(135deg,var(--navy),#1c4353);color:#fff;border:none;position:relative;overflow:hidden} .es-hero::after{content:"";position:absolute;right:-40px;top:-50px;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,rgba(22,179,196,.22),transparent 70%)} .es-name{font-family:'Unbounded','Inter',sans-serif;font-weight:700;font-size:18px} .es-pos{font-size:12px;color:#b9cdd6;margin-top:2px} .es-total{margin-top:14px;position:relative;z-index:1} .es-cap{font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:700} .es-hero .es-cap{color:#8fd6df} .es-val{font-family:'Unbounded','Inter',sans-serif;font-weight:700;font-size:26px;margin-top:2px} .es-stats{display:flex;gap:10px;margin-top:14px;position:relative;z-index:1} .es-stat{flex:1;background:rgba(255,255,255,.1);border-radius:10px;padding:8px 6px;text-align:center} .es-stat span{display:block;font-weight:800;font-size:15px;font-variant-numeric:tabular-nums} .es-stat i{font-style:normal;font-size:10px;color:#b9cdd6} .es-badges{display:flex;flex-wrap:wrap;gap:7px;margin-top:9px} .es-b{font-size:11.5px;font-weight:700;border-radius:8px;padding:4px 10px} .es-b.b-prog{background:var(--warn-soft);color:#9a6b16} .es-b.b-ok{background:var(--ok-soft);color:var(--ok)} .es-b.b-rej{background:var(--danger-soft);color:var(--danger)} .es-b.b-draft{background:var(--bg);color:var(--ink-soft)} .es-rej-card{border-color:#f3c4d0;background:var(--danger-soft)} .es-rejrow{background:#fff;border-radius:9px;padding:8px 11px;margin-top:8px} .es-rejrow b{display:block;font-size:12.5px;color:var(--ink)} .es-rejrow span{font-size:11.5px;color:var(--danger)} @media(max-width:820px){.dept-block.emp-mode .emp-row{flex-direction:column}.dept-block.emp-mode .ledger-scroll{width:100%}} /* удалены неиспользуемые классы панели сотрудника (.emp-summary/.es-*/.emp-mode/.emp-row) — переопределяются ниже, не рендерятся */ /* ================================================================================== v14 · ПОЛИРОВКА: цельная, современная, аккуратная дизайн-система Единые: токены статусов · тени залипания · типографика чисел · отступы · состояния ================================================================================== */ :root{ /* согласованная, мягкая (не «кислотная») палитра этапов согласования */ --stage-head:#e8973a; --stage-head-soft:#fbf1de; --stage-head-ink:#9a6b16; --stage-head-line:#f0d59a; --stage-mgr:#2f80b5; --stage-mgr-soft:#e7f1fa; --stage-mgr-ink:#2166a0; --stage-mgr-line:#c3ddf1; --stage-fin:#7c5cbf; --stage-fin-soft:#efe8fb; --stage-fin-ink:#6b46c1; --stage-fin-line:#d9cdf3; --stage-ok:#25b07a; --stage-ok-soft:#e7f6ef; --stage-ok-ink:#1c7d57; --stage-ok-line:#bfe6d3; --stage-rej:#e8607f; --stage-rej-soft:#fdeef2; --stage-rej-ink:#c53f60; --stage-rej-line:#f3c4d0; /* тени залипания шапки/первого столбца — мягкие, «держат» таблицу */ --sticky-x:2px 0 6px -3px rgba(22,50,63,.16); /* тень справа у sticky-колонки */ --sticky-y:0 4px 8px -5px rgba(22,50,63,.20); /* тень снизу у sticky-шапки */ --focus-ring:0 0 0 3px var(--accent-soft); } /* ---------- глобальная типографика: числа всегда табличные ---------- */ .pcard-sum,.combo-sum,.ph-sum-val,.svod-val,.pcell,.mcell,.rev-cell b,.tbl .num,.creds-info code{font-variant-numeric:tabular-nums} :focus-visible{outline:none} /* ---------- каркас: чуть глубже иерархия шапки/сайдбара ---------- */ .hdr{box-shadow:0 1px 0 var(--line)} .nav-link{transition:background .14s,color .14s} .nav-link.active{box-shadow:0 4px 12px -4px rgba(22,179,196,.5)} /* ================================================================================== ВЕДОМОСТЬ — премиальная плотная финансовая таблица ================================================================================== */ /* обёртка: аккуратная рамка + мягкая тень, скругления не «режут» sticky */ .ledger-scroll{border-color:var(--line-strong);border-radius:var(--radius);box-shadow:0 4px 16px -8px rgba(22,50,63,.14),0 1px 3px rgba(22,50,63,.05)} /* сетка: тоньше и спокойнее линии, ровная плотность */ .ledger-table th,.ledger-table td{border-right-color:var(--line);border-bottom-color:var(--line)} .ledger-table td{height:23px} /* закреплённая шапка колонок — мягкая тень снизу при залипании, чистый тон */ .ledger-table thead th.emp-col{background:linear-gradient(#fafcfd,#f2f6f9);box-shadow:var(--sticky-y);border-bottom:1px solid var(--line-strong)} .ledger-table thead th.rowhdr{background:#eef3f5;box-shadow:var(--sticky-x),var(--sticky-y)} .ledger-table .eh-name{letter-spacing:-.01em} /* первый (липкий) столбец — тень справа, «отрывающая» его от прокрутки */ .ledger-table .rowhdr{box-shadow:var(--sticky-x)} .ledger-table thead th.rowhdr{box-shadow:var(--sticky-x),var(--sticky-y)} /* строки-параметры — деликатнее */ .param-row td{background:#fbfcfd} .param-row .rowhdr{background:#f6f9fb;color:var(--ink-soft);font-weight:700} .pcell.pos{color:var(--muted)} /* секции-разделители — различимы, но не крикливы: спокойная бирюзовая лента */ .sect-row td{background:linear-gradient(#eef7f8,#e8f4f6);border-bottom:1px solid var(--line-strong);border-top:1px solid #d4ebee;border-right-color:transparent;height:21px} .sect-row .rowhdr{background:linear-gradient(#e6f4f6,#ddf0f2)!important;color:var(--accent-ink);font-weight:800;letter-spacing:.05em} /* строки-итоги: тоновая иерархия — подытоги мягче, «К ВЫПЛАТЕ» — акцентная */ .tabel tr.tot-row td,.matrix tr.row-total td,.row-total td{background:#f1fafb!important;font-weight:800;color:var(--accent-ink);box-shadow:inset 0 1px 0 var(--line-strong)} .tabel tr.tot-row .rowhdr,.matrix tr.row-total .rowhdr,.row-total .rowhdr{background:#e6f4f6!important;color:var(--accent-ink)} .row-total.grand td{background:linear-gradient(#e3f5f7,#d9f0f3)!important;color:var(--accent-ink);font-weight:800;box-shadow:inset 0 1px 0 #bfe6ea,inset 0 -1px 0 #bfe6ea} .row-total.grand .rowhdr{background:linear-gradient(#d5eef1,#cbe9ec)!important;color:var(--accent-ink)} /* реквизиты — тихие */ .matrix tr.row-info td,.row-info td{background:#fcfbf7!important;color:var(--muted);font-style:italic} .row-info .rowhdr{background:#faf8f1!important;font-style:normal;color:var(--ink-soft)} /* выходные дни — тёплый нейтральный, а не «тревожный» */ .tabel tr.is-weekend td{background:#faf6f0} .tabel tr.is-weekend .rowhdr{background:#f4ece2;color:#9c6f3e} .daycell b{font-weight:700} .daycell .muted{color:var(--muted)} /* hover строки — единая деликатная подсветка (кроме служебных строк) */ .ledger-table tbody tr:not(.sect-row):not(.tot-row):not(.row-total):not(.row-info):hover td{background:var(--accent-soft)} .ledger-table tbody tr:not(.sect-row):not(.tot-row):not(.row-total):not(.row-info):hover .rowhdr{background:#e4f4f6} /* ---------- статусы ячеек: единая мягкая палитра этапов ---------- */ .mcell.st-s_head{background:var(--stage-head-soft);box-shadow:inset 0 0 0 1px var(--stage-head-line)} .mcell.st-s_manager{background:var(--stage-mgr-soft);box-shadow:inset 0 0 0 1px var(--stage-mgr-line)} /* Руководитель: ячейки, ОТПРАВЛЕННЫЕ им управляющему (s_manager), — мягкая жёлтая диагональная полоска («я отправил, ждёт управляющего»). Только в виде руководителя — у управляющего это «ждёт меня» (сплошной). #3 */ .role-head .mcell.st-s_manager{background:repeating-linear-gradient(45deg,var(--warn-soft,#fbf1de),var(--warn-soft,#fbf1de) 6px,#fdf7ea 6px,#fdf7ea 12px);box-shadow:inset 0 0 0 1px var(--warn,#e0a800)} .mcell.st-s_finance{background:var(--stage-fin-soft);box-shadow:inset 0 0 0 1px var(--stage-fin-line)} .mcell.st-approved{background:var(--stage-ok-soft);box-shadow:inset 0 0 0 1px var(--stage-ok-line)} .mcell.st-rejected{background:var(--stage-rej-soft);box-shadow:inset 0 0 0 1px var(--stage-rej-line)} .mcell.st-submitted{background:var(--stage-head-soft);box-shadow:inset 0 0 0 1px var(--stage-head-line)} /* комментарий не должен «стирать» статусный контур */ .mcell.has-comment{background:transparent} /* синий фон-маркер убран — теперь маркер = цветная полоска слева */ .mcell.st-s_head.has-comment{background:var(--stage-head-soft)} .mcell.st-s_manager.has-comment{background:var(--stage-mgr-soft)} .mcell.st-s_finance.has-comment{background:var(--stage-fin-soft)} .mcell.st-rejected.has-comment{background:var(--stage-rej-soft)} .mcell.has-comment::before{border:0;top:0;bottom:0;left:0;right:auto;width:3px;background:var(--cmt-c,#9aa0a6)} /* фокус ячейки — чёткая бирюзовая рамка, поверх соседей */ .mcell.editable:focus-within,.acell.editable:focus-within{position:relative;z-index:4} .mcell input.val:focus,.tabel input.att:focus{box-shadow:inset 0 0 0 2px var(--accent);background:#fff;border-radius:6px} /* тулбар/значки ячейки — мягче */ .cell-tools{border-color:var(--line-strong);border-radius:8px;box-shadow:0 4px 12px -4px rgba(22,50,63,.2)} .stopbadge{box-shadow:0 1px 2px rgba(22,50,63,.15)} /* Да/Нет — единые радиусы/переходы */ .yn-b{transition:all .12s;border-radius:7px} .yn-badge{border-radius:7px} /* ---------- заголовок направления ---------- */ .dept-head{padding:2px 0 2px 12px;border-left-width:3px} .dept-title{letter-spacing:-.01em} .dept-n{background:#fff;border-color:var(--line-strong)} /* ---------- свод-фильтр компаний (чипы) ---------- */ .cochip{border-radius:11px;box-shadow:var(--shadow-sm);transition:all .14s} .cochip:hover{transform:translateY(-1px);box-shadow:0 4px 12px -6px rgba(22,50,63,.2)} .cochip.is-active{box-shadow:0 4px 12px -4px rgba(22,179,196,.4)} /* ---------- легенда этапов — как аккуратная плашка ---------- */ .stage-legend{background:var(--panel);border:1px solid var(--line);border-radius:11px;padding:8px 13px;box-shadow:var(--shadow-sm)} .stage-legend .dot{border-radius:4px;box-shadow:0 1px 2px rgba(22,50,63,.12)} /* ---------- итог к выплате в шапке ---------- */ .ph-sum-val{letter-spacing:-.01em} /* ================================================================================== СОГЛАСОВАНИЕ — чистый мастер-деталь ================================================================================== */ .rev-side{border-color:var(--line-strong);box-shadow:0 4px 16px -8px rgba(22,50,63,.12)} .rev-side-item{transition:background .13s;border:1px solid transparent} .rev-side-item:hover{background:var(--bg)} .rev-side-item.is-active{background:var(--accent-soft);border-color:#cceef1} .rsi-name .muted{font-size:11px;font-weight:600} .rev-emp{border-color:var(--line-strong);box-shadow:0 4px 16px -8px rgba(22,50,63,.12)} .rev-emp-head{background:linear-gradient(#f8fafb,#f3f7f9)} /* ячейки-чипы согласования — единый мягкий стиль (по умолчанию — «на согласовании») */ .rev-cell{background:var(--stage-head-soft);border-color:var(--stage-head-line);border-radius:10px;transition:all .13s;cursor:pointer} .rev-cell:hover{border-color:var(--stage-head);box-shadow:0 3px 8px -4px rgba(22,50,63,.2)} .rev-cell:has(input:checked){background:var(--stage-rej-soft);border-color:var(--stage-rej)} .rev-cell b{color:var(--stage-head-ink)} .rev-cell:has(input:checked) b{color:var(--stage-rej-ink)} .rev-cell span{color:var(--stage-head-ink)} .rev-cell input.rev-chk{accent-color:var(--accent);width:14px;height:14px} .rev-actions{background:#fbfcfd;gap:9px} /* ================================================================================== КАНБАН / КАРТОЧКИ ПЕРИОДОВ ================================================================================== */ .combo-card{box-shadow:0 10px 30px -12px rgba(22,50,63,.32)} .pcard{border-color:var(--line);transition:transform .15s,box-shadow .15s,border-color .15s} .pcard:hover{box-shadow:0 10px 24px -12px rgba(22,50,63,.24)} .pcard.is-active{box-shadow:0 0 0 2px var(--accent),0 8px 20px -12px rgba(22,179,196,.4)} /* ================================================================================== АДМИНКА — единые вкладки, матрица, конструктор ================================================================================== */ .adm-tab{transition:color .13s,border-color .13s;border-radius:8px 8px 0 0} .adm-tab:hover{background:var(--accent-soft)} .adm-tab.is-active{background:transparent} .role-matrix .rm-yes{box-shadow:inset 0 0 0 1px var(--stage-ok-line)} .role-card{transition:border-color .14s,box-shadow .14s} .role-card:hover{border-color:var(--line-strong);box-shadow:var(--shadow-sm)} .rolechip.manager{background:var(--stage-mgr-soft);color:var(--stage-mgr-ink)} .rolechip.finance{background:var(--stage-head-soft);color:var(--stage-head-ink)} .cnstr-blk{border-color:var(--line-strong)} .cnstr-row{transition:border-color .12s,box-shadow .12s} .cnstr-row:focus-within{box-shadow:var(--focus-ring)} /* ================================================================================== ОБЩИЕ КОМПОНЕНТЫ — единые радиусы/тени/состояния ================================================================================== */ .btn{transition:all .14s} .btn:active{transform:translateY(1px)} .btn.ok{color:var(--stage-ok-ink)} .btn.danger{color:var(--stage-rej-ink)} .tag.st-s_manager{background:var(--stage-mgr-soft);color:var(--stage-mgr-ink)} .tag.st-s_finance{background:var(--stage-fin-soft);color:var(--stage-fin-ink)} .tag.st-s_head,.tag.st-submitted{background:var(--stage-head-soft);color:var(--stage-head-ink)} .tag.st-approved{background:var(--stage-ok-soft);color:var(--stage-ok-ink)} .tag.st-rejected{background:var(--stage-rej-soft);color:var(--stage-rej-ink)} .gear-btn,.bell-btn,.logout-btn{transition:all .14s} .gear-menu,.bell-drop,.cal-pop,.cmt-pop{border-color:var(--line-strong);box-shadow:0 12px 32px -12px rgba(22,50,63,.28),0 2px 8px rgba(22,50,63,.06)} .gear-item,.bell-item{transition:background .12s,color .12s} .svod-item{box-shadow:var(--shadow-sm)} .panel,.tbl{border-color:var(--line-strong)} /* ---------- вход ---------- */ .login-card{box-shadow:0 20px 50px -20px rgba(22,50,63,.28),0 2px 8px rgba(22,50,63,.06)} .login-demo-grid code{transition:border-color .13s} /* ---------- модалки ---------- */ .addm-box{box-shadow:0 24px 60px -20px rgba(22,50,63,.4)} .addm-row{transition:border-color .12s,background .12s} .addm-row:hover{border-color:var(--line-strong);background:#fff} /* ================= v15: фокус=границы, центр итогов, панель сотрудника ================= */ /* фокус ячейки — БЕЗ скруглённого «ореола», подсвечиваем границы синим (чёткий прямоугольник) */ .mcell input.val,.tabel input.att,.mcell .cell-sel,.acell input.att{border-radius:0!important} .mcell input.val:focus,.tabel input.att:focus,.acell input.att:focus,.mcell .cell-sel:focus{outline:none!important;box-shadow:none!important;background:#fff!important} .mcell.editable:focus-within,.acell.editable:focus-within{box-shadow:inset 0 0 0 2px var(--accent)!important;border-radius:0!important;background:#fff;z-index:4;position:relative} /* итоговые/вычисляемые цифры — по центру (как вводимые) */ .row-total td,.tot-row td,.matrix tr.row-total .mcell,.tabel tr.tot-row td{text-align:center!important} .row-total .rowhdr,.tot-row .rowhdr{text-align:left!important} /* спокойная панель сотрудника (заполняет пустоту, ненавязчиво) */ .dept-block.emp-mode .emp-row{display:flex;gap:20px;align-items:flex-start} .dept-block.emp-mode .ledger-scroll{flex:0 0 auto} .emp-aside{flex:1;min-width:280px;position:sticky;top:16px;display:flex;flex-direction:column;gap:12px} .emp-aside-card{position:relative;overflow:hidden;background:linear-gradient(135deg,var(--accent-soft),#f5fbfc);border:1px solid var(--line);border-radius:18px;padding:26px 28px;box-shadow:var(--shadow-sm)} .ea-rub{position:absolute;right:-6px;bottom:-38px;font-family:'Unbounded','Inter',sans-serif;font-size:150px;font-weight:800;color:rgba(22,179,196,.10);line-height:1;pointer-events:none;user-select:none} .ea-cap{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--accent-ink);font-weight:700;position:relative} .ea-val{font-family:'Unbounded','Inter',sans-serif;font-weight:700;font-size:40px;color:var(--ink);margin-top:8px;position:relative;font-variant-numeric:tabular-nums;line-height:1} .ea-val span{font-size:22px;color:var(--muted)} .ea-sub{font-size:12px;color:var(--muted);position:relative;margin-top:2px} .ea-status{display:inline-block;margin-top:18px;font-size:12px;font-weight:700;border-radius:8px;padding:6px 12px;position:relative} .ea-status.b-prog{background:var(--warn-soft);color:#9a6b16} .ea-status.b-rej{background:var(--danger-soft);color:var(--danger)} .ea-status.b-draft{background:#fff;color:var(--ink-soft);border:1px solid var(--line)} .emp-aside-hint{font-size:12px;color:var(--muted);padding:0 6px;line-height:1.5} @media(max-width:820px){.dept-block.emp-mode .emp-row{flex-direction:column}.dept-block.emp-mode .ledger-scroll{width:100%}} /* шестерёнка: ведомость уже отправлена */ .gear-item.is-done{color:var(--ok);cursor:default;opacity:.9} .gear-item.is-done:hover{background:transparent} /* ================= v16: согласование по-ячейке + пометка «ждёт» ================= */ .rv-cells{padding:8px 16px 14px;display:flex;flex-direction:column;gap:7px} .rv-cell{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:7px 11px} .rv-cell-l{display:flex;align-items:baseline;gap:10px;min-width:0} .rv-cell-v{font-variant-numeric:tabular-nums;font-size:14px;min-width:64px} .rv-cell-lbl{font-size:12.5px;color:var(--ink-soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .rv-cell-act{display:flex;align-items:center;gap:6px;margin:0} .rv-cmt{width:200px;padding:6px 9px!important;font-size:12px} /* колонка «по УРВ» в раскрытии сотрудника (сравнение с табелем) */ .rv-urv{white-space:nowrap;font-size:12px} .rv-urv-cap{font-size:9px;font-weight:800;text-transform:uppercase;color:var(--muted);margin-right:6px;letter-spacing:.04em} .rv-urv-b{color:var(--ok,#12a594);font-weight:700} .rv-urv-b.short{color:#b07a12} .rv-urv-miss{color:var(--danger,#c0392b);font-weight:700} .rv-urv-zero{color:var(--muted);font-weight:700} /* урв=0 (нет полной отметки) → прочерк, а не «✓ 0ч» */ .rv-cell-act .btn.xs{padding:6px 10px} /* пометка «ждёт вашего согласования» в шапке колонки + подсветка колонки */ .emp-wait{position:absolute;top:2px;left:4px;font-size:8px;font-weight:800;background:var(--warn);color:#fff;border-radius:4px;padding:1px 5px;z-index:3;white-space:nowrap} .emp-wait:hover{text-decoration:none;background:#c98a1f} .ledger-table thead th.emp-col.has-wait{box-shadow:inset 0 3px 0 var(--warn)} /* ================= v17: фикс шапки-кнопок + статус-строка + согласование v3 ================= */ /* панель управления колонкой — статичный видимый ряд НАД фамилией (не всплывашка поверх имени) */ .emp-ctl{position:static;transform:none;display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:2px;background:var(--bg,#f4f8f9);border:none;border-radius:0;padding:3px 2px;box-shadow:none;border-bottom:1px solid var(--line);z-index:8} .emp-col:hover .emp-ctl{display:flex} .emp-ctl form{margin:0;display:flex} .emp-ctl-b{width:18px;height:18px;border:none;background:#fff;border-radius:5px;cursor:pointer;font-size:10px;line-height:1;color:var(--ink-soft);display:grid;place-items:center;box-shadow:var(--shadow-sm)} .emp-ctl-b[hidden]{display:none!important} /* display:grid перебивает атрибут hidden — вернуть скрытие для toggled кнопок отправки */ .emp-ctl-b:hover{background:var(--accent-soft);color:var(--accent-ink)} .emp-ctl-b.del:hover{background:var(--danger-soft);color:var(--danger)} .emp-ord{display:inline-flex;gap:2px} .emp-ctl-b.ord{color:var(--accent-ink,#0d7a6b);font-size:8px} .emp-ctl-b.ord:hover{background:var(--accent-soft,#eafaf6)} /* мягкая подсветка перемещённой колонки (не перебивает фон ячейки — inset-тень) */ @keyframes colMoved{from{box-shadow:inset 0 0 0 200px rgba(22,179,196,.18)}to{box-shadow:inset 0 0 0 200px rgba(22,179,196,0)}} .ledger-table td.col-moved,.ledger-table th.col-moved{animation:colMoved .6s ease} .emp-ctl-b.send{color:var(--accent-ink)} /* строка «Согласование» в секции Статус */ .pcell.stat{padding:2px} .wait-chip{display:inline-block;font-size:9.5px;font-weight:800;background:var(--warn);color:#fff;border-radius:20px;padding:2px 8px;white-space:nowrap;border:none;cursor:pointer;font-family:inherit} .wait-chip:hover{filter:brightness(1.06)} /* клик по «N ждёт» — подсветка ячеек, ждущих согласования (остаёмся в ведомости) */ .mcell.rev-wait-flash,.acell.rev-wait-flash{animation:revWaitPulse 3.2s ease;position:relative;z-index:4} @keyframes revWaitPulse{0%,100%{box-shadow:inset 0 0 0 2px transparent}15%,55%{box-shadow:inset 0 0 0 2px var(--warn,#e0a800),0 0 0 3px var(--warn-soft,#fbf1de)}} .wait-chip:hover{text-decoration:none;background:#c98a1f} .stage-chip{display:inline-block;font-size:9.5px;font-weight:700;border-radius:20px;padding:2px 8px;white-space:nowrap;background:var(--bg);color:var(--ink-soft)} .stage-chip.st-rejected{background:var(--danger-soft);color:var(--danger)} .stage-chip.st-s_head{background:var(--warn-soft);color:#9a6b16} .stage-chip.st-approved{background:var(--ok-soft);color:var(--ok)} /* согласование v3: аккордеон */ .rev-acc{display:flex;flex-direction:column;gap:10px;max-width:920px} .rev-item{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);overflow:hidden} .rev-item[open]{box-shadow:var(--shadow)} .rev-sum{list-style:none;display:flex;align-items:center;gap:12px;padding:13px 16px;cursor:pointer;user-select:none} .rev-sum::-webkit-details-marker{display:none} .rev-chev{color:var(--muted);transition:transform .15s;font-size:11px} .rev-item[open] .rev-chev{transform:rotate(90deg)} .rev-sum-l{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px} .rev-sum-l .rev-emp-name{font-weight:700;font-size:14px} .rev-sum-r{display:flex;align-items:center;gap:8px} .rev-inline{margin:0;display:inline-flex} .rev-round{width:30px;height:30px;border-radius:50%;border:1.5px solid;cursor:pointer;font-size:13px;font-weight:800;display:grid;place-items:center;background:#fff;transition:all .12s;line-height:1} .rev-round.ok{border-color:#bfe6d3;color:var(--ok)} .rev-round.ok:hover{background:var(--ok);color:#fff;border-color:var(--ok)} .rev-round.no{border-color:#f3c4d0;color:var(--danger)} .rev-round.no:hover{background:var(--danger);color:#fff;border-color:var(--danger)} .rev-round.lg{width:34px;height:34px;font-size:15px} .rev-body{border-top:1px solid var(--line);padding:8px 16px 14px;display:flex;flex-direction:column;gap:6px} .rev-line{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:7px 12px} .rev-line-l{display:flex;align-items:baseline;gap:10px;min-width:0;flex-wrap:wrap} .rev-line-v{font-variant-numeric:tabular-nums;font-size:14px;min-width:60px} .rev-line-lbl{font-size:12.5px;color:var(--ink-soft)} .rev-line-cmt{font-size:11.5px;color:var(--info);background:var(--info-soft);border-radius:6px;padding:1px 7px} .rev-line-act{display:flex;gap:6px;flex:none} /* v18 — Битрикс-матрица прав (построчно: чит./ред. × себя/отдел/все) */ .role-matrix.bitrix th,.role-matrix.bitrix td{border:1px solid var(--line)} .role-matrix.bitrix .rm-cap-h,.role-matrix.bitrix .rm-col{background:var(--panel-2,#f6fafb)} .role-matrix.bitrix .rm-col{border-bottom:none} .role-matrix.bitrix .rm-sub{font-size:10.5px;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.03em;padding:3px 4px;background:var(--panel-2,#f6fafb)} .role-matrix.bitrix .rm-cap{white-space:nowrap;padding-right:14px} .role-matrix.bitrix .rm-cell{padding:4px} .role-matrix.bitrix .rm-review td{background:#fbfdfe} .scope-sel{width:100%;min-width:58px;border:1px solid var(--line);border-radius:7px;padding:3px 4px;font-size:11.5px;font-weight:600;cursor:pointer;background:#fff;text-align:center} .scope-sel.sc-none{color:var(--muted);background:#fafafa} .scope-sel.sc-self{color:var(--info);background:var(--info-soft)} .scope-sel.sc-dept{color:#0d7a6b;background:var(--ok-soft)} .scope-sel.sc-all{color:#fff;background:var(--accent)} .scope-sel:focus{outline:2px solid var(--accent);outline-offset:1px} /* ================================================================================== v19 — АДМИНКА: визуальная полировка и разнообразие вкладок (только оформление; имена полей/логика не затрагиваются) ================================================================================== */ /* ---------- Заголовок вкладки: подзаголовок-«лид» под панелью ---------- */ .adm-lead{display:flex;align-items:flex-start;gap:10px;font-size:12.5px;line-height:1.55;color:var(--ink-soft);background:linear-gradient(120deg,var(--accent-soft),#f5fbfc);border:1px solid var(--line);border-radius:var(--radius-sm);padding:11px 14px;margin-bottom:16px} .adm-lead .adm-lead-ic{flex:none;width:26px;height:26px;border-radius:8px;display:grid;place-items:center;background:#fff;border:1px solid var(--line);font-size:14px} .adm-lead b{color:var(--ink)} /* ========================================================= 1) СОТРУДНИКИ — фильтр-чипы, панель фильтров, строки ========================================================= */ /* цветовое кодирование чипов-ролей в фильтре (перекликается с .rolechip) */ .role-chips{align-items:center} .rf-chip.is-active{box-shadow:0 4px 12px -4px rgba(22,179,196,.4)} .role-chips .rf-sep{width:1px;height:20px;background:var(--line-strong);margin:0 2px} /* панель фильтров — чуть заметнее «полка» */ .filters{align-items:center} .filters .flt-tail{margin-left:auto;display:flex;align-items:center;gap:10px} /* таблица сотрудников: аватар-инициалы + моно-логин как чип */ .emp-name-cell{display:flex;align-items:center;gap:10px;min-width:0} .emp-ava{flex:none;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;font-weight:800;font-size:12px;color:#fff;background:var(--accent);letter-spacing:-.02em;text-transform:uppercase} .emp-ava.r-employee{background:#8494a3} .emp-ava.r-head{background:var(--accent)} .emp-ava.r-manager{background:var(--stage-mgr)} .emp-ava.r-finance{background:var(--stage-head)} .emp-ava.r-admin{background:var(--navy)} .emp-name-main{display:flex;flex-direction:column;gap:1px;min-width:0} .emp-name-main b{line-height:1.25} .emp-login-chip{display:inline-flex;align-items:center;gap:4px;font-family:ui-monospace,Menlo,monospace;font-size:10.5px;color:var(--muted);background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:0 6px;width:max-content;max-width:100%} .emp-login-chip.is-none{color:var(--danger);background:var(--danger-soft);border-color:transparent} .emp-login-chip.is-shared{color:var(--accent-ink);background:var(--accent-soft);border-color:transparent} /* доступ по роли (общий вход) — не тревожный */ .tbl td .rolechip{vertical-align:middle} .tbl tbody tr:hover .emp-ava{transform:scale(1.05)} .emp-ava{transition:transform .12s} /* «Сгенерировать доступы» — акцентный вид ключа */ .creds-gen-btn{background:var(--accent-soft);border-color:transparent;color:var(--accent-ink)} .creds-gen-btn:hover{background:#d5f0f3;border-color:transparent} /* ========================================================= 2) ДОЛЖНОСТИ / ПОДРАЗДЕЛЕНИЯ — компактные справочники ========================================================= */ /* строка добавления в справочник — как «инлайн-форма» на плашке */ .ref-add{display:flex;gap:8px;align-items:center;background:var(--bg);border:1px solid var(--line);border-radius:var(--radius-sm);padding:8px;max-width:480px;margin-bottom:16px} .ref-add input[type=text]{flex:1;background:#fff} /* мягкие «пилюли» источника в справочнике должностей */ .src-pill{display:inline-flex;align-items:center;gap:5px;font-size:10.5px;font-weight:700;border-radius:20px;padding:2px 10px;background:#eef2f5;color:var(--ink-soft)} .src-pill.is-tony{background:var(--stage-mgr-soft);color:var(--stage-mgr-ink)} .src-pill.is-tony::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--stage-mgr)} .src-pill.is-manual::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--muted)} /* компактнее счётчик «сотрудников» */ .cnt-pill{display:inline-block;min-width:22px;text-align:center;font-variant-numeric:tabular-nums;font-weight:700;font-size:11.5px;color:var(--ink-soft);background:var(--bg);border-radius:20px;padding:1px 8px} .cnt-pill.is-zero{color:var(--muted);background:transparent;font-weight:600} /* ========================================================= 3) ВЕДОМОСТИ (конструктор) — блоки типов ячеек ========================================================= */ /* тип ячейки в строке конструктора — цветная метка перед селектом типа */ .cnstr-type{font-weight:600} /* лёгенда типов ячеек над сеткой блоков */ .cnstr-legend{display:flex;flex-wrap:wrap;gap:14px;margin:2px 0 14px;font-size:11.5px;color:var(--ink-soft)} .cnstr-legend .cl-item{display:inline-flex;align-items:center;gap:6px} .cnstr-legend .cl-dot{width:9px;height:9px;border-radius:3px;flex:none} .cl-dot.money{background:var(--ok)} .cl-dot.text{background:var(--muted)} .cl-dot.list{background:var(--info)} /* счётчик строк в шапке блока */ .cnstr-blk-head{display:flex;align-items:center;gap:10px} .cnstr-blk-head .cnstr-blk-txt{flex:1;min-width:0} .cnstr-blk-count{flex:none;font-size:10.5px;font-weight:800;font-variant-numeric:tabular-nums;background:#fff;border:1px solid var(--line);border-radius:20px;padding:1px 9px;color:var(--ink-soft)} /* ========================================================= 4) ПРАВА РОЛЕЙ — Битрикс-матрица (главная вкладка) ========================================================= */ /* обёртка со скроллом: не режем закруглённые углы, ровная рамка */ .role-matrix.bitrix{border-collapse:separate;border-spacing:0;width:100%;min-width:640px} .role-matrix.bitrix th,.role-matrix.bitrix td{border-width:0 1px 1px 0;border-style:solid;border-color:var(--line)} .role-matrix.bitrix thead th{border-top-width:0} /* залипающая шапка при вертикальной прокрутке */ .role-matrix.bitrix thead th{position:sticky;z-index:5;background:var(--panel-2,#f6fafb)} .role-matrix.bitrix thead tr:first-child th{top:0} .role-matrix.bitrix thead tr:nth-child(2) th{top:34px} /* залипающий первый столбец «Возможность» */ .role-matrix.bitrix .rm-cap-h{position:sticky;left:0;z-index:6} .role-matrix.bitrix .rm-cap{position:sticky;left:0;z-index:4;background:#fff;font-weight:700;color:var(--ink);box-shadow:1px 0 0 var(--line)} .role-matrix.bitrix tbody tr:hover .rm-cap{background:#f2fbfc} /* заголовок роли — крупнее «пилюля», разделитель групп ролей потолще */ .role-matrix.bitrix .rm-col{text-align:center;padding:9px 6px 8px;border-bottom:none;border-left:2px solid var(--line-strong)} .role-matrix.bitrix .rm-col .rolechip{font-size:11px;padding:3px 11px} .role-matrix.bitrix .rm-sub{text-align:center;border-bottom:2px solid var(--line-strong)} /* тонкая вертикальная граница между «чит.» и «ред.» одной роли */ .role-matrix.bitrix .rm-cell:nth-of-type(odd of .rm-cell){border-left:2px solid var(--line-strong)} .role-matrix.bitrix thead th.rm-col{border-left:2px solid var(--line-strong)} .role-matrix.bitrix thead th.rm-sub:nth-of-type(odd){border-left:2px solid var(--line-strong)} /* hover строки — мягкая подсветка всей строки возможности */ .role-matrix.bitrix tbody tr:hover td{background:#f6fafb} .role-matrix.bitrix tbody tr:hover .rm-review td{background:#f2fbfc} /* строка «Согласует этап» — акцент снизу */ .role-matrix.bitrix .rm-review td{background:#fbfdfe;border-top:2px solid var(--line-strong)} .role-matrix.bitrix .rm-review .rm-cap{background:#fbfdfe} .role-matrix.bitrix .rm-review select{width:100%;font-size:11.5px;font-weight:600;padding:5px 8px;background:#fff} /* scope-селекторы: чуть выразительнее, «all» с лёгкой тенью */ .scope-sel{transition:background .12s,color .12s,box-shadow .12s} .scope-sel:hover{border-color:var(--accent)} .scope-sel.sc-dept{border-color:transparent} .scope-sel.sc-self{border-color:transparent} .scope-sel.sc-all{border-color:transparent;box-shadow:0 2px 6px -2px rgba(22,179,196,.5)} .scope-sel.sc-none{border-color:var(--line)} /* легенда scope под матрицей */ .scope-legend{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:14px;font-size:11.5px;color:var(--ink-soft)} .scope-legend .sl-item{display:inline-flex;align-items:center;gap:7px} .scope-legend .sl-key{display:inline-grid;place-items:center;min-width:44px;font-size:11px;font-weight:700;border-radius:7px;padding:2px 8px} .sl-key.sc-none{color:var(--muted);background:#f2f2f2} .sl-key.sc-self{color:var(--info);background:var(--info-soft)} .sl-key.sc-dept{color:#0d7a6b;background:var(--ok-soft)} .sl-key.sc-all{color:#fff;background:var(--accent)} @media(max-width:720px),(orientation:landscape) and (max-height:520px) and (max-width:1024px){ .adm-lead{font-size:12px} .emp-ava{width:26px;height:26px;font-size:11px} } /* v20 — слой оплаты фин-блока (строка «Оплата», кнопки, статусы) */ .dept-head-act{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end;row-gap:8px;margin-left:auto} .dept-head-act > form{margin:0} .btn.send-fin{white-space:nowrap} .pay-row .rowhdr{color:var(--accent);font-weight:700} .pcell.pay{padding:4px 6px} .pay-act{display:inline-flex;gap:4px;align-items:center;justify-content:center;flex-wrap:wrap} .pay-b{border:1px solid var(--line);border-radius:7px;padding:2px 7px;font-size:11px;font-weight:700;cursor:pointer;background:#fff;line-height:1.5} /* «₽ Оплачено» пока НЕ оплачено — ЖЁЛТАЯ (активная, ждёт действия); после оплаты чип «✓ Оплачено» зелёный */ .pay-b.ok{color:#8a6d1f;border-color:#f0d79a;background:var(--warn-soft,#fbf1de)} .pay-b.ok:hover{background:var(--warn,#e8a33d);color:#fff;border-color:var(--warn,#e8a33d)} .pay-b.no{color:var(--muted)} .pay-b.no:hover{color:#fff;background:var(--rej,#d9534f);border-color:var(--rej,#d9534f)} .pay-chip{display:inline-block;font-size:11px;font-weight:700;border-radius:20px;padding:2px 9px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle} .pay-chip.paid{color:#0d7a6b;background:var(--ok-soft)} .pay-chip.rej{color:#b23c3c;background:#fdecec} .pay-chip.pend{color:var(--info);background:var(--info-soft)} .pcell.pay.p-paid{background:color-mix(in srgb,var(--ok-soft) 45%,transparent)} .pcell.pay.p-rejected{background:#fdf3f3} /* v21 — экран согласования */ /* — шапка страницы */ .rev-head{align-items:center} .rev-head-sub{display:flex;flex-wrap:wrap;gap:8px;margin-top:9px} .rev-pill{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;color:var(--ink-soft);background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:4px 12px;line-height:1.3} .rev-pill b{color:var(--ink);font-weight:800} .rev-pill-stage{background:var(--accent-soft);border-color:transparent;color:var(--accent-ink)} .rev-pill-stage b{color:var(--accent-ink)} /* — аккордеон */ .rev-acc{gap:11px} .rev-item{transition:box-shadow .16s,border-color .16s} .rev-item:hover{border-color:var(--line-strong)} .rev-item[open]{border-color:var(--accent-soft)} .rev-sum{gap:11px;padding:12px 15px;transition:background .12s} .rev-sum:hover{background:#fbfdfe} .rev-item[open] .rev-sum{background:linear-gradient(180deg,#fbfdfe,transparent)} .rev-ava{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:13px;color:var(--accent-ink);background:var(--accent-soft);letter-spacing:0} .rev-sum-l{gap:2px} .rev-sum-l .rev-emp-name{font-weight:700;font-size:14px;line-height:1.2;letter-spacing:-.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .rev-sum-meta{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .rev-sum-r{gap:9px} .rev-badge{background:var(--accent-soft);color:var(--accent-ink);font-size:11px;font-weight:800;min-width:24px;height:22px;display:inline-grid;place-items:center;padding:0 7px;border-radius:20px} .rev-item[open] .rev-badge{background:var(--accent);color:#fff} /* — круглые кнопки */ .rev-round{width:31px;height:31px;border-width:1.5px;font-size:13px;transition:transform .12s,background .12s,color .12s,border-color .12s,box-shadow .12s} .rev-round.ok{border-color:#bfe6d3;color:var(--ok);background:var(--ok-soft)} .rev-round.ok:hover{background:var(--ok);color:#fff;border-color:var(--ok);box-shadow:0 4px 10px rgba(37,176,122,.28);transform:translateY(-1px)} .rev-round.no{border-color:#f2cdd7;color:var(--danger);background:var(--danger-soft)} .rev-round.no:hover{background:var(--danger);color:#fff;border-color:var(--danger);box-shadow:0 4px 10px rgba(232,96,127,.26);transform:translateY(-1px)} .rev-round:active{transform:translateY(0) scale(.94)} .rev-round.lg{width:35px;height:35px;font-size:15px} /* — тело: строки позиций */ .rev-body{padding:6px 14px 12px;gap:6px} .rev-body{animation:revBodyIn .18s ease} @keyframes revBodyIn{from{opacity:0;transform:translateY(-3px)}to{opacity:1;transform:none}} .rev-line{align-items:center;gap:12px;background:#fbfcfd;border-color:var(--line);border-radius:11px;padding:8px 8px 8px 13px;transition:border-color .12s,background .12s} .rev-line:hover{border-color:var(--line-strong);background:#fff} .rev-line-l{flex-direction:column;align-items:flex-start;gap:5px;flex:1} .rev-line-top{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;min-width:0} .rev-line-v{font-size:14.5px;font-weight:800;color:var(--ink);min-width:0} .rev-line-lbl{font-size:12px;color:var(--ink-soft);font-weight:600} .rev-line-cmt{display:inline-flex;align-items:flex-start;gap:6px;font-size:11.5px;color:var(--info);background:var(--info-soft);border-radius:8px;padding:4px 9px;line-height:1.4;max-width:100%} .rev-cmt-ico{flex:none;font-size:11px;line-height:1.4;opacity:.9} .rev-line-act{gap:6px;align-self:flex-start} /* — пустое состояние */ .rev-empty{padding:48px 40px} .rev-empty-mark{font-size:34px;color:var(--accent);margin-bottom:10px;line-height:1} .rev-empty-title{font-family:'Unbounded','Inter',sans-serif;font-size:16px;font-weight:700;color:var(--ink);margin-bottom:4px;letter-spacing:-.01em} .rev-empty-sub{font-size:13px;color:var(--muted)} @media(max-width:720px),(orientation:landscape) and (max-height:520px) and (max-width:1024px){ .rev-line{flex-wrap:wrap} .rev-line-act{align-self:auto} } /* v22 — плавный фокус ячейки (свечение всех границ) + hover-комментарий */ .mcell,.acell{transition:box-shadow .15s ease, background-color .15s ease} .mcell.editable:focus-within,.acell.editable:focus-within{box-shadow:inset 0 0 0 2px var(--accent), 0 0 0 3px var(--accent-soft)!important;background:#fff!important;border-radius:6px;z-index:5} .mcell input.val:focus,.tabel input.att:focus,.acell input.att:focus{box-shadow:none!important;outline:none} .cell-tip{position:fixed;max-width:260px;background:#243b44;color:#fff;font-size:11.5px;line-height:1.45;padding:7px 10px;border-radius:9px;box-shadow:0 8px 22px rgba(0,0,0,.20);z-index:9999;pointer-events:none;white-space:pre-wrap;opacity:0;transform:translateY(-3px);transition:opacity .12s ease,transform .12s ease} .cell-tip.show{opacity:1;transform:translateY(0)} .cell-tip::before{content:"💬 ";opacity:.85} /* v23 — детализация в панели сотрудника (начислено + разбивка) */ .ea-detail{margin:12px 0 4px;border-top:1px solid var(--line);padding-top:10px;display:flex;flex-direction:column;gap:5px} .ea-drow{display:flex;justify-content:space-between;align-items:baseline;font-size:12px;color:var(--ink-soft)} .ea-drow b{font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums} .ea-drow.total{margin-top:4px;padding-top:7px;border-top:1px dashed var(--line);font-size:12.5px} .ea-drow.total span{font-weight:600;color:var(--ink)} .ea-drow.total b{color:var(--accent)} /* v24 — кнопка отправки из статуса сотрудника + «Ведомость отправлена» */ .ea-send-form{margin-top:14px} .ea-send{width:100%;border:none;border-radius:11px;padding:11px 14px;font:inherit;font-size:13.5px;font-weight:700;color:#fff;background:linear-gradient(135deg,var(--accent),#12a594);cursor:pointer;box-shadow:0 4px 14px rgba(20,165,148,.28);transition:transform .12s ease,box-shadow .12s ease} .ea-send:hover{transform:translateY(-1px);box-shadow:0 7px 20px rgba(20,165,148,.34)} .ea-send:active{transform:translateY(0)} .ea-status.is-sent{margin-top:14px;background:var(--ok-soft);color:#0d7a6b;border:1px solid var(--ok-soft);font-weight:700;opacity:.9} .ea-status-note{margin-top:8px;font-size:11.5px;text-align:center} .ea-status-note.rej{color:#b23c3c} /* v25 — в ячейке: причина возврата + активность (поповер) */ .cmt-rej{background:#fdf0f2;border:1px solid #f3c4d0;border-radius:9px;padding:8px 10px;margin-bottom:8px} .cmt-rej b{display:block;font-size:12px;color:#b23c3c;margin-bottom:2px} .cmt-rej-txt{font-size:12px;color:var(--ink);line-height:1.4;white-space:pre-wrap} .cmt-activity{font-size:11px;color:var(--muted);margin-bottom:8px;padding:3px 2px} /* v26 — построчные права вычетов в матрице */ .role-matrix.bitrix .rm-group td.rm-cap{font-weight:700} .role-matrix.bitrix .rm-ded td{background:#fcfdfe} .role-matrix.bitrix .rm-ded-cap{padding-left:18px;font-weight:500;color:var(--ink-soft);white-space:nowrap} .role-matrix.bitrix .rm-ded .scope-sel{min-width:52px} /* v27 — раздел авансов (фин-блок) + оплата аванса на ячейке */ .adv-sums{display:flex;gap:10px} .adv-sum{display:flex;flex-direction:column;gap:2px;padding:8px 14px;border-radius:11px;background:var(--panel-2,#f6fafb);border:1px solid var(--line)} .adv-sum span{font-size:11px;color:var(--muted)} .adv-sum b{font-size:16px;font-variant-numeric:tabular-nums} .adv-sum.await b{color:var(--accent)} .adv-sum.paid b{color:#0d7a6b} .adv-tbl td{vertical-align:middle} .adv-row.is-paid td{background:#f4effd} /* оплаченный аванс — фиолетовая заливка строки */ .adv-row.is-await td{background:#f3fbfa} .adv-chip{display:inline-block;font-size:11px;font-weight:700;border-radius:20px;padding:2px 9px} .adv-chip.await{color:var(--accent);background:var(--accent-soft)} .adv-chip.paid{color:#5b3fc4;background:#ece3ff} .adv-chip.rej{color:#b23c3c;background:#fdecec} .adv-chip.prog{color:var(--info);background:var(--info-soft)} .adv-chip.draft{color:var(--muted);background:#f2f4f6} .adv-act{display:flex;gap:6px;justify-content:flex-end;white-space:nowrap} .cmt-paid{text-align:center;font-size:12px;font-weight:700;color:#0d7a6b;background:var(--ok-soft);border-radius:9px;padding:6px} .cmt-payhint{font-size:11px;font-weight:600;color:#9a6b16;background:var(--warn-soft,#fbf1de);border:1px solid #f0d59a;border-radius:8px;padding:6px 9px;margin-top:6px;line-height:1.3} .mcell.adv-paid{box-shadow:none} .mcell.adv-paid::after{content:"₽";position:absolute;top:1px;left:2px;font-size:9px;font-weight:800;color:#5b3fc4;opacity:.75} @keyframes cellFlash{0%,100%{box-shadow:inset 0 0 0 2px transparent}30%{box-shadow:inset 0 0 0 3px var(--accent),0 0 0 4px var(--accent-soft)}} .cell-flash{animation:cellFlash 1.3s ease 2} /* v28 — блокировка/разблокировка ячеек + закрытие периода */ /* замок — в НИЖНЕМ ПРАВОМ углу (не налезает на ⋯ вверху справа), оранжевый */ .cell-lock{position:absolute;bottom:1px;right:1px;top:auto;left:auto;width:11px;height:11px;line-height:0;opacity:.95;color:#e6890f;pointer-events:none} .cell-lock svg{display:block;width:11px;height:11px} /* убираем baseline-зазор инлайнового svg — иначе замок «висел в середине» */ /* фин-блок: заметный ₽-значок «оплатить» в НИЖНЕМ-ЛЕВОМ углу (чтобы не сталкивался с ⋮-меню в верхнем-правом). z-index выше ⋮ (6) и содержимого — кнопка действия всегда кликабельна и в самом первом плане. */ .cell-pay-badge{position:absolute;bottom:1px;left:1px;right:auto;top:auto;width:16px;height:16px;padding:0;border:none;border-radius:5px;background:#1c8f63;color:#fff;font-size:11px;font-weight:800;line-height:16px;text-align:center;cursor:pointer;box-shadow:0 1px 3px rgba(0,0,0,.28);opacity:.95;transition:transform .1s,opacity .1s;z-index:9} .cell-pay-badge:hover{opacity:1;transform:scale(1.14);background:#16805a} .mcell.cell-frozen{background:repeating-linear-gradient(45deg,#f4f6f8,#f4f6f8 6px,#eceff2 6px,#eceff2 12px)} /* J: аванс заблокирован до оплаты предыдущего — приглушён, замок */ .mcell.adv-locked{background:repeating-linear-gradient(45deg,#f7f8fa,#f7f8fa 5px,#eef1f4 5px,#eef1f4 10px)!important;cursor:not-allowed} .mcell.adv-locked .ro,.mcell.adv-locked .cell-in{color:var(--muted);opacity:.7} .ml-av-row.adv-locked{opacity:.55} .ml-av-row.adv-locked .ml-av-lockhint{font-size:10px;color:var(--muted)} .emp-ctl-b.on{background:#fde8ec;color:#b23c3c} .period-lock-banner{display:flex;align-items:center;gap:12px;padding:11px 16px;border-radius:12px;margin:0 0 14px;background:#fff7ed;border:1px solid #fed7aa} .period-lock-banner.full{background:#fdf0f2;border-color:#f3c4d0} .plb-ic{font-size:20px} /* v29 — фильтры согласования + статус-чип позиции + повторная отправка */ .rev-filters{display:flex;gap:12px;align-items:flex-end;flex-wrap:wrap;margin:0 0 14px} .rev-flt{display:flex;flex-direction:column;gap:4px;font-size:11px;color:var(--muted);font-weight:600} .rev-flt select{min-width:150px;border:1px solid var(--line);border-radius:9px;padding:7px 9px;font:inherit;font-size:12.5px;font-weight:600;color:var(--ink);background:#fff;cursor:pointer} .rev-flt select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)} .rev-flt-clear{align-self:center;font-size:12px;color:var(--muted);text-decoration:none;padding-bottom:8px} .rev-flt-clear:hover{color:#b23c3c} .rev-line-st{font-size:10.5px;font-weight:700;border-radius:20px;padding:1px 8px;white-space:nowrap} .rev-line-st.st-s_head{color:#8a6d1f;background:var(--stage-head-soft,#fdf6e3)} .rev-line-st.st-s_manager{color:#1f5c8a;background:var(--stage-mgr-soft,#e7f1fa)} .rev-line-st.st-approved{color:#0d7a6b;background:var(--ok-soft)} .rev-line-st.st-paid{color:#fff;background:var(--ok,#25b07a);box-shadow:inset 0 0 0 1px rgba(0,0,0,.06)} .rev-line-st.st-rejected{color:#b23c3c;background:#fdecec} .rv-gtag.paid{color:#fff;background:var(--ok,#25b07a)} /* ================================================================================== v30 — редизайн согласования (только визуал; имена полей/JS-контракты не тронуты) ================================================================================== */ /* ---------- Шапка: иконка-бейдж + «лид» с пилюлями ---------- */ .rev-head{display:flex;align-items:center;gap:15px;margin-bottom:18px} .rev-head-ic{flex:none;width:46px;height:46px;border-radius:14px;display:grid;place-items:center;font-size:22px; background:linear-gradient(135deg,var(--accent-soft),#f3fbfc);border:1px solid var(--line);box-shadow:var(--shadow-sm)} .rev-head-main{min-width:0} .rev-head-main h1{line-height:1.15} .rev-head-sub{display:flex;flex-wrap:wrap;gap:8px;margin-top:9px} .rev-pill{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;color:var(--ink-soft); background:var(--panel);border:1px solid var(--line);border-radius:20px;padding:4px 12px;line-height:1.3;box-shadow:var(--shadow-sm)} .rev-pill b{color:var(--ink);font-weight:800} .rev-pill-stage{background:linear-gradient(120deg,var(--accent-soft),#f2fbfc);border-color:transparent;color:var(--accent-ink)} .rev-pill-stage b{color:var(--accent-ink)} .rev-pill-count{background:var(--panel-2,#f6fafb)} /* ---------- Фильтры: аккуратная «полка» с подписью и мягкими селектами ---------- */ .rev-filters{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:0 0 16px; background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:10px 14px;box-shadow:var(--shadow-sm)} .rev-flt-cap{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:800;letter-spacing:.03em; text-transform:uppercase;color:var(--muted);padding-right:4px} .rev-flt-cap::before{content:"⚙";font-size:13px;opacity:.7} .rev-flt{display:flex;align-items:center;gap:7px;font-size:11px;color:var(--muted);font-weight:600; background:var(--bg);border:1px solid var(--line);border-radius:10px;padding:4px 6px 4px 11px} .rev-flt>span{white-space:nowrap;letter-spacing:.01em} .rev-flt select{min-width:130px;border:1px solid transparent;border-radius:8px;padding:6px 26px 6px 9px;font:inherit; font-size:12.5px;font-weight:700;color:var(--ink);background:#fff;cursor:pointer; appearance:none;-webkit-appearance:none; background-image:url("data:image/svg+xml;utf8,"); background-repeat:no-repeat;background-position:right 9px center} .rev-flt select:hover{border-color:var(--line-strong)} .rev-flt select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)} .rev-flt-clear{display:inline-flex;align-items:center;font-size:12px;font-weight:600;color:var(--muted); text-decoration:none;padding:6px 11px;border-radius:9px;transition:color .12s,background .12s} .rev-flt-clear:hover{color:#b23c3c;background:var(--danger-soft)} /* ---------- Аккордеон: воздух, мягкая тень, плавное раскрытие ---------- */ .rev-acc{display:flex;flex-direction:column;gap:12px;max-width:940px} .rev-item{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm); overflow:hidden;transition:box-shadow .18s,border-color .18s,transform .18s} .rev-item:hover{border-color:var(--line-strong)} .rev-item[open]{border-color:#cceef1;box-shadow:var(--shadow)} .rev-sum{list-style:none;display:flex;align-items:center;gap:12px;padding:13px 16px;cursor:pointer;user-select:none;transition:background .13s} .rev-sum::-webkit-details-marker{display:none} .rev-sum:hover{background:#fbfdfe} .rev-item[open] .rev-sum{background:linear-gradient(180deg,#f9fdfe,transparent)} .rev-chev{flex:none;width:20px;height:20px;display:grid;place-items:center;color:var(--muted);font-size:10px; border-radius:6px;background:var(--bg);transition:transform .18s,background .13s,color .13s} .rev-item[open] .rev-chev{transform:rotate(90deg);background:var(--accent-soft);color:var(--accent-ink)} .rev-ava{flex:none;width:36px;height:36px;border-radius:11px;display:grid;place-items:center;font-weight:800;font-size:15px; color:#fff;background:linear-gradient(135deg,var(--accent),var(--accent-ink));letter-spacing:-.01em; box-shadow:0 3px 8px -3px rgba(20,165,148,.5)} .rev-sum-l{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px} .rev-sum-l .rev-emp-name{font-weight:700;font-size:14.5px;line-height:1.2;letter-spacing:-.01em;color:var(--ink); white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .rev-sum-meta{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .rev-sum-r{display:flex;align-items:center;gap:10px} .rev-badge{flex:none;background:var(--accent-soft);color:var(--accent-ink);font-size:11px;font-weight:800;min-width:24px; height:22px;display:inline-grid;place-items:center;padding:0 8px;border-radius:20px} .rev-item[open] .rev-badge{background:var(--accent);color:#fff} /* массовые действия (принять всё / вернуть всё) — сгруппированы на «полке» */ .rev-bulk{display:inline-flex;align-items:center;gap:6px;padding:3px;border-radius:12px;background:var(--bg);border:1px solid var(--line)} .rev-inline{margin:0;display:inline-flex} /* круглые кнопки ✓/✗ — мягкие фоны, спокойный ховер */ .rev-round{width:31px;height:31px;border-radius:50%;border:1.5px solid;cursor:pointer;font-size:13px;font-weight:800; display:grid;place-items:center;background:#fff;line-height:1; transition:transform .12s,background .12s,color .12s,border-color .12s,box-shadow .12s} .rev-round.ok{border-color:#bfe6d3;color:var(--ok);background:var(--ok-soft)} .rev-round.ok:hover{background:var(--ok);color:#fff;border-color:var(--ok);box-shadow:0 4px 10px rgba(37,176,122,.28);transform:translateY(-1px)} .rev-round.no{border-color:#f2cdd7;color:var(--danger);background:var(--danger-soft)} .rev-round.no:hover{background:var(--danger);color:#fff;border-color:var(--danger);box-shadow:0 4px 10px rgba(232,96,127,.24);transform:translateY(-1px)} .rev-round:active{transform:translateY(0) scale(.94)} .rev-round.lg{width:34px;height:34px;font-size:15px} /* ---------- Тело: строки-позиции ---------- */ .rev-body{border-top:1px solid var(--line);padding:8px 14px 13px;display:flex;flex-direction:column;gap:7px; animation:revBodyIn .2s ease} @keyframes revBodyIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}} .rev-line{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fbfcfd; border:1px solid var(--line);border-radius:12px;padding:9px 9px 9px 14px;transition:border-color .12s,background .12s,box-shadow .12s} .rev-line:hover{border-color:var(--line-strong);background:#fff;box-shadow:var(--shadow-sm)} .rev-line-l{display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-width:0;flex:1} .rev-line-top{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;min-width:0} .rev-line-v{font-variant-numeric:tabular-nums;font-size:15px;font-weight:800;color:var(--ink);letter-spacing:-.01em} .rev-line-lbl{font-size:12px;color:var(--ink-soft);font-weight:600} .rev-line-st{font-size:10.5px;font-weight:800;border-radius:20px;padding:2px 9px;white-space:nowrap;letter-spacing:.01em} .rev-line-st.st-s_head{color:#8a6d1f;background:var(--stage-head-soft,#fdf6e3)} .rev-line-st.st-s_manager{color:#1f5c8a;background:var(--stage-mgr-soft,#e7f1fa)} .rev-line-st.st-approved{color:#0d7a6b;background:var(--ok-soft)} .rev-line-st.st-rejected{color:#b23c3c;background:var(--danger-soft)} /* «Не оплачено» (фин-блок ещё не нажал «Оплачено») — ЖЁЛТЫМ; «Оплачено» — зелёным (st-approved выше) */ .rev-line-st.st-topay{color:#9a6b16;background:var(--warn-soft,#fbf1de);box-shadow:inset 0 0 0 1px #f0d79a} /* Удержание в фин-блоке: сотрудник, помеченный управляющим «не платить» — красный замок, оплата недоступна */ .rev-line-st.st-held{color:#b23c3c;background:var(--danger-soft)} .rv-row.rv-held{background:var(--danger-soft,#fdeef2)} .rv-row.rv-held td{opacity:.96} .rv-held-reason{margin-top:3px;font-size:10.5px;color:var(--danger);font-weight:600;max-width:220px;white-space:normal;line-height:1.35} .rev-round.held{border:1.5px solid #f2cdd7;color:var(--danger);background:var(--danger-soft);cursor:not-allowed} .rv-fd-pay.held{padding:6px 2px} .rv-held-note{font-size:11px;color:var(--danger);font-weight:700} .rev-line-cmt{display:inline-flex;align-items:flex-start;gap:6px;font-size:11.5px;color:var(--info); background:var(--info-soft);border-radius:9px;padding:5px 10px;line-height:1.45;max-width:100%} .rev-cmt-ico{flex:none;font-size:11px;line-height:1.45;opacity:.9} .rev-line-act{display:flex;gap:6px;flex:none;align-self:center} /* ---------- Пустое состояние ---------- */ .rev-empty{padding:52px 40px;background:linear-gradient(180deg,var(--panel),#fbfdfe);border:1px dashed var(--line-strong)} .rev-empty-mark{width:60px;height:60px;margin:0 auto 14px;border-radius:50%;display:grid;place-items:center; font-size:28px;color:var(--accent-ink);background:var(--accent-soft)} .rev-empty-title{font-family:'Unbounded','Inter',sans-serif;font-size:17px;font-weight:700;color:var(--ink); margin-bottom:5px;letter-spacing:-.01em} .rev-empty-sub{font-size:13px;color:var(--muted)} /* ---------- Поп-ап возврата ---------- */ .rej-box{width:420px;max-width:92vw} .rej-head{display:flex;align-items:center;gap:9px} .rej-head-ic{display:grid;place-items:center;width:24px;height:24px;border-radius:8px;flex:none; background:var(--danger-soft);color:var(--danger);font-size:13px;font-weight:800} .rej-form{padding:16px} .rej-target{display:flex;align-items:baseline;gap:7px;flex-wrap:wrap;margin-bottom:6px;font-size:13.5px} .rej-target b{color:var(--ink);font-weight:800} .rej-dot{color:var(--muted)} .rej-what{color:var(--ink-soft)} .rej-note{font-size:11.5px;color:var(--muted);margin-bottom:11px;line-height:1.45} .rej-cmt{width:100%;min-height:88px;border:1px solid var(--line);border-radius:11px;padding:10px 12px;font:inherit; font-size:13px;line-height:1.5;resize:vertical;background:var(--bg);transition:border-color .12s,box-shadow .12s,background .12s} .rej-cmt:focus{outline:none;border-color:var(--danger);background:#fff;box-shadow:0 0 0 3px var(--danger-soft)} .rej-actions{display:flex;gap:10px;margin-top:14px} /* ---------- Адаптив ---------- */ @media(max-width:720px),(orientation:landscape) and (max-height:520px) and (max-width:1024px){ .rev-head{gap:12px;margin-bottom:14px} .rev-head-ic{width:40px;height:40px;font-size:19px;border-radius:12px} .rev-filters{padding:10px} .rev-flt{flex:1 1 auto} .rev-flt select{min-width:0;width:100%;flex:1} .rev-sum{gap:10px;padding:12px 13px} .rev-ava{width:32px;height:32px;font-size:13px} .rev-line{flex-wrap:wrap} .rev-line-act{align-self:flex-end;margin-left:auto} } /* v31 — согласование как таблица (чипы-категории, КТО/ФИО, мультивыбор, авансы) */ .rv-head{display:flex;align-items:center;gap:14px} .rv-head-ic{width:44px;height:44px;border-radius:13px;display:grid;place-items:center;font-size:22px;background:var(--accent-soft);flex:none} /* чипы категорий */ .rv-chips{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0 12px} .rv-chip{display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border-radius:22px;background:#fff;border:1px solid var(--line);font-size:12.5px;font-weight:700;color:var(--ink-soft);text-decoration:none;transition:all .14s ease} .rv-chip:hover{border-color:var(--accent);color:var(--accent)} .rv-chip .rv-n{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;border-radius:10px;background:var(--panel-2,#eef3f5);color:var(--muted);font-size:11px;font-weight:800} .rv-chip.is-active{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:0 3px 10px rgba(20,165,148,.28)} .rv-chip.is-active .rv-n{background:rgba(255,255,255,.28);color:#fff} .rv-chip.st-rejected.is-active{background:#d9534f;border-color:#d9534f;box-shadow:0 3px 10px rgba(217,83,79,.28)} .rv-chip.st-approved.is-active{background:#0d9488;border-color:#0d9488} .rv-chip.st-adv.is-active{background:#7c5cff;border-color:#7c5cff;box-shadow:0 3px 10px rgba(124,92,255,.28)} /* КТО/ФИО */ .rv-selectors{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:12px} .rv-sel{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);border-radius:11px;padding:5px 8px 5px 12px;font-size:11.5px;font-weight:700;color:var(--muted)} .rv-sel select{border:none;background:transparent;font:inherit;font-size:12.5px;font-weight:700;color:var(--ink);cursor:pointer;outline:none;padding-right:4px} /* панель массовых действий */ .rv-bulk{display:flex;align-items:center;gap:8px;margin-bottom:12px;padding:8px 14px;border-radius:12px;background:var(--panel-2,#f6fafb);border:1px solid var(--line);width:fit-content;opacity:.6;transition:all .15s ease} .rv-bulk.has-sel{opacity:1;background:#fff;border-color:var(--accent);box-shadow:0 3px 12px rgba(20,165,148,.14)} .rv-bulk-cnt{font-size:12.5px;color:var(--ink-soft);margin-right:4px} .rv-bulk-cnt b{color:var(--accent)} .rv-bulk-b{width:30px;height:30px;border-radius:9px;border:1px solid var(--line);background:#fff;cursor:pointer;font-size:13px;display:grid;place-items:center;transition:all .12s ease} .rv-bulk-b.ok{color:#0d9488}.rv-bulk-b.ok:hover{background:var(--ok-soft)} .rv-bulk-b.no{color:#d9534f}.rv-bulk-b.no:hover{background:#fdecec} .rv-bulk-b.lock:hover,.rv-bulk-b.unlock:hover{background:var(--panel-2,#eef3f5)} /* таблица позиций */ .rv-tbl{width:100%} .rv-tbl thead th{font-size:10.5px;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);font-weight:700;padding:8px 12px;text-align:left;border-bottom:1px solid var(--line)} .rv-tbl th.num,.rv-tbl td.num{text-align:center} .rv-tbl th.rv-act-h,.rv-tbl th.rv-chk-h{text-align:center;width:1%} .rv-row td{padding:11px 12px;border-bottom:1px solid var(--line);vertical-align:middle;font-size:13px} .rv-row{position:relative} .rv-row td:first-child{border-left:3px solid transparent} .rv-row.is-wait td:first-child{border-left-color:var(--accent)} .rv-row.st-rejected td:first-child{border-left-color:#d9534f} .rv-row.st-rejected{background:#fdf4f5} .rv-row.st-approved td:first-child{border-left-color:#0d9488} .rv-row:hover{background:#f6fbfc} .rv-cmt-txt{font-size:11.5px;color:var(--info);background:var(--info-soft);border-radius:7px;padding:2px 8px;display:inline-block;max-width:220px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle} .rv-act{display:flex;gap:6px;justify-content:center;align-items:center} .rev-round.lock{background:#fff;border:1px solid var(--line);color:var(--muted)} .rev-round.lock:hover{border-color:var(--accent);color:var(--accent)} .rev-line-st.st-draft{color:var(--muted);background:#f2f4f6} /* секция авансов */ .rv-section{display:flex;align-items:center;gap:9px;margin:22px 0 10px;font-family:'Unbounded',sans-serif;font-size:14px;font-weight:600;color:var(--ink)} .rv-section-ic{font-size:17px} .rv-section-n{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:#efeaff;color:#7c5cff;font-size:11px;font-weight:800} /* месяц-чип в заголовке секции — сразу видно, за какой месяц позиции */ .rv-section-mo{margin-left:auto;padding:2px 10px;border-radius:999px;background:var(--accent-soft,#e6f7f9);color:var(--accent-ink,#0f8d9b);font-family:'Inter',sans-serif;font-size:11.5px;font-weight:700;letter-spacing:.2px} .rv-adv thead th{background:#faf9ff} @media(max-width:720px),(orientation:landscape) and (max-height:520px) and (max-width:1024px){.rv-tbl th:nth-child(3),.rv-tbl td:nth-child(3){display:none}.rv-cmt-txt{max-width:110px}} /* v32 — отклонённая ячейка в ведомости — явно красная */ .mcell.st-rejected{background:#fdecec!important;box-shadow:inset 0 0 0 2px #e07a86!important} .mcell.st-rejected::after{content:"возврат";position:absolute;bottom:0;left:2px;font-size:8px;font-weight:800;color:#c0392b;opacity:.7;letter-spacing:.02em} .acell.st-rejected::after{content:""} /* v33 — панель сотрудника: компактнее + меньшая кнопка */ .emp-aside{flex:1;min-width:260px;max-width:340px;position:sticky;top:16px;display:flex;flex-direction:column;gap:10px} .emp-aside-card{position:relative;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:16px;padding:0;box-shadow:0 4px 18px rgba(20,60,70,.06)} .emp-aside-card .ea-rub{display:none} .ea-top{padding:16px 18px 14px;background:linear-gradient(135deg,var(--accent-soft),#f3fafb);border-bottom:1px solid var(--line)} .ea-cap{font-size:10.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--accent-ink);font-weight:800;position:static;margin:0} .ea-val{font-family:'Unbounded','Inter',sans-serif;font-weight:700;font-size:30px;color:var(--ink);margin-top:4px;font-variant-numeric:tabular-nums;line-height:1.05} .ea-val .ea-cur{font-size:16px;color:var(--muted);font-weight:600} .ea-sub{font-size:11px;color:var(--muted);margin-top:1px} .ea-detail{margin:0;border-top:none;padding:12px 18px;display:flex;flex-direction:column;gap:6px} .ea-drow{font-size:12px} .ea-drow.total{margin-top:5px;padding-top:8px} .ea-send-form{padding:0 14px 14px} .ea-send{width:100%;border:none;border-radius:10px;padding:10px 14px;font:inherit;font-size:13px;font-weight:700;color:#fff;background:linear-gradient(135deg,var(--accent),#12a594);cursor:pointer;box-shadow:0 3px 10px rgba(20,165,148,.24);transition:transform .12s ease,box-shadow .12s ease} .ea-send:hover{transform:translateY(-1px);box-shadow:0 6px 16px rgba(20,165,148,.3)} .ea-state{margin:0 14px 14px;padding:9px 12px;border-radius:10px;font-size:12px;font-weight:700;text-align:center} .ea-state.sent{background:var(--ok-soft);color:#0d7a6b} .ea-state.rej{background:#fdecec;color:#b23c3c} .ea-state.draft{background:var(--panel-2,#f2f5f7);color:var(--muted)} .emp-aside-hint{font-size:11.5px;color:var(--muted);padding:0 4px;line-height:1.5} /* v34 — согласование: премиальные чипы по стадиям + компактная таблица-карточка */ :root{ --stg-all:#0d9488; --stg-draft:#64748b; --stg-head:#d99a2b; --stg-mgr:#2b6fd9; --stg-approved:#0d9488; --stg-rejected:#e0455a; --stg-adv:#7c5cff; } .rv-chips{display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin:18px 0 14px} .rv-chip{display:inline-flex;align-items:center;gap:8px;padding:7px 8px 7px 14px;border-radius:999px;background:#fff;border:1px solid var(--line);font-size:12.5px;font-weight:650;color:var(--ink-soft);text-decoration:none;line-height:1;transition:transform .12s ease,box-shadow .12s ease,background .12s ease,border-color .12s ease} .rv-chip:hover{transform:translateY(-1px);border-color:#cfd8dc} .rv-chip .rv-n{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;font-size:11px;font-weight:800;background:#eef2f4;color:var(--muted)} /* цвет бейджа-счётчика под стадию */ .rv-chip.stg-all .rv-n{background:color-mix(in srgb,var(--stg-all) 16%,#fff);color:var(--stg-all)} .rv-chip.stg-s_head .rv-n{background:color-mix(in srgb,var(--stg-head) 18%,#fff);color:#a9720f} .rv-chip.stg-s_manager .rv-n{background:color-mix(in srgb,var(--stg-mgr) 15%,#fff);color:var(--stg-mgr)} .rv-chip.stg-approved .rv-n{background:color-mix(in srgb,var(--stg-approved) 16%,#fff);color:var(--stg-approved)} .rv-chip.stg-rejected .rv-n{background:color-mix(in srgb,var(--stg-rejected) 16%,#fff);color:var(--stg-rejected)} .rv-chip.stg-adv .rv-n{background:color-mix(in srgb,var(--stg-adv) 15%,#fff);color:var(--stg-adv)} /* активный чип — залит цветом своей стадии */ .rv-chip.is-active{color:#fff;border-color:transparent} .rv-chip.is-active .rv-n{background:rgba(255,255,255,.26);color:#fff} .rv-chip.stg-all.is-active{background:var(--stg-all);box-shadow:0 4px 12px color-mix(in srgb,var(--stg-all) 40%,transparent)} .rv-chip.stg-draft.is-active{background:var(--stg-draft);box-shadow:0 4px 12px color-mix(in srgb,var(--stg-draft) 40%,transparent)} .rv-chip.stg-s_head.is-active{background:var(--stg-head);box-shadow:0 4px 12px color-mix(in srgb,var(--stg-head) 40%,transparent)} .rv-chip.stg-s_manager.is-active{background:var(--stg-mgr);box-shadow:0 4px 12px color-mix(in srgb,var(--stg-mgr) 40%,transparent)} .rv-chip.stg-approved.is-active{background:var(--stg-approved);box-shadow:0 4px 12px color-mix(in srgb,var(--stg-approved) 40%,transparent)} .rv-chip.stg-rejected.is-active{background:var(--stg-rejected);box-shadow:0 4px 12px color-mix(in srgb,var(--stg-rejected) 40%,transparent)} .rv-chip.stg-adv.is-active{background:var(--stg-adv);box-shadow:0 4px 12px color-mix(in srgb,var(--stg-adv) 40%,transparent)} /* нулевые — приглушены */ .rv-chip.is-zero{opacity:.5;font-weight:550;background:transparent;border-color:transparent} .rv-chip.is-zero:hover{opacity:.85;background:#fff} .rv-chip.is-zero .rv-n{background:#f1f4f6;color:#aeb7bc} .rv-chip-div{width:1px;height:22px;background:var(--line);margin:0 4px} /* селекторы КТО/ФИО — компактные пилюли */ .rv-selectors{gap:8px} .rv-sel{border-radius:999px;padding:6px 10px 6px 13px} /* панель массовых действий — пилюля */ .rv-bulk{border-radius:999px;padding:7px 8px 7px 15px} /* таблица — единая карточка */ .rv-tbl-wrap{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:0 4px 18px rgba(20,60,70,.05)} /* широкая таблица «Согласования» должна ГОРИЗОНТАЛЬНО прокручиваться внутри, а не обрезаться wrapper'ом (перебиваем глобальный .tbl-scroll{overflow:visible}). max-height:none наследуется → вертикальной полосы нет, только горизонтальная при переполнении. */ .rv-tbl-wrap .tbl-scroll{margin:0;overflow:auto} .rv-tbl{border-collapse:separate;border-spacing:0} .rv-tbl thead th{background:#fbfdfe;padding:11px 14px;position:sticky;top:0;z-index:1} .rv-tbl tbody tr:last-child td{border-bottom:none} .rv-row td{padding:12px 14px} .rv-row td:first-child{border-left-width:3px} .rv-row.is-wait{background:#f7fcfb} .rv-chk,.rv-all{width:16px;height:16px;accent-color:var(--accent);cursor:pointer} .rev-line-st{font-size:11px;font-weight:750;border-radius:999px;padding:3px 10px} .rv-row.is-wait .rev-line-st{background:var(--accent);color:#fff} .rev-round{width:30px;height:30px;font-size:13px} @media(max-width:820px){.rv-tbl th:nth-child(3),.rv-tbl td:nth-child(3){display:table-cell}} /* v35 — видимая кнопка отправки аванса на ячейке */ .cell-send{position:absolute;top:50%;right:2px;transform:translateY(-50%);width:20px;height:20px;border:none;border-radius:6px;background:var(--accent);color:#fff;font-size:10px;line-height:1;cursor:pointer;display:grid;place-items:center;box-shadow:0 1px 4px rgba(20,165,148,.35);z-index:4;transition:transform .1s ease,background .12s ease} .cell-send:hover{transform:translateY(-50%) scale(1.12)} .cell-send.off{background:#c3ccd0;box-shadow:none;cursor:default} .mcell.editable:focus-within .cell-send{right:14px} /* v36 — современная ячейка + мягкий плавный фокус + тред комментариев/действий */ .mcell.editable{cursor:text;transition:box-shadow .2s cubic-bezier(.4,0,.2,1),background-color .2s ease} .mcell input.val,.tabel input.att,.acell input.att{transition:none} .mcell.editable:focus-within,.acell.editable:focus-within{ box-shadow:inset 0 0 0 1.5px var(--accent), 0 0 0 4px color-mix(in srgb,var(--accent) 14%,transparent)!important; background:#fff!important;border-radius:9px;z-index:6} .mcell input.val,.tabel input.att{height:24px;font-size:12px;font-weight:600;letter-spacing:.01em} .mcell input.val:focus,.tabel input.att:focus,.acell input.att:focus{box-shadow:none!important;outline:none;color:var(--ink)} .mcell.editable .cell-plus{transition:opacity .18s ease,transform .18s ease} .mcell.editable:focus-within .cell-plus{opacity:1} .cell-send{transition:transform .16s cubic-bezier(.34,1.56,.64,1),background .15s ease,box-shadow .15s ease} .cell-send:hover{transform:translateY(-50%) scale(1.18)} .cell-send:active{transform:translateY(-50%) scale(.94)} /* поповер: тред + добавление комментария */ .cmt-body .cmt-cap{font-size:12px;font-weight:800;color:var(--ink);letter-spacing:0;text-transform:none;margin-bottom:7px} .cmt-thread{max-height:140px;overflow-y:auto;display:flex;flex-direction:column;gap:5px;padding:1px 1px 2px;margin-bottom:7px} .cmt-thread .cmt-empty{font-size:11px;color:var(--muted);text-align:center;padding:5px 0} .cmt-msg{background:var(--panel-2,#f5f8fa);border:1px solid var(--line);border-radius:10px;border-left:3px solid var(--muted);padding:7px 10px} .cmt-msg.k-submit{border-left-color:var(--info);background:var(--info-soft)} .cmt-msg.k-approve{border-left-color:#0d9488;background:var(--ok-soft)} .cmt-msg.k-reject{border-left-color:#e0455a;background:#fdecec} .cmt-msg.k-comment{border-left-color:#94a3b8} .cmt-msg-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:3px} .cmt-msg-kind{font-size:11px;font-weight:800;color:var(--ink)} .cmt-msg-meta{font-size:10.5px;color:var(--muted);white-space:nowrap} .cmt-msg-text{font-size:12.5px;color:var(--ink);line-height:1.45;white-space:pre-wrap;word-break:break-word} .cmt-add{border-top:1px solid var(--line);padding-top:7px} .cmt-add textarea{min-height:28px;max-height:64px} /* v37 — числовые значения ячеек по центру (в т.ч. авансы), с разделителями */ .mcell .ro{text-align:center;font-weight:700} .mcell.info .ro,.mcell .ro.info{text-align:left} .row-info .ro{text-align:left} /* v38 — шапка раздела авансов (календарь + суммы) */ .adv-head-r{display:flex;align-items:center;gap:12px;flex-wrap:wrap} /* v39 — flash как плавный авто-тост (не персистентный баннер) */ .flash-toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,20px);z-index:9998;background:#243b44;color:#fff;font-size:13px;font-weight:600;padding:11px 20px;border-radius:12px;box-shadow:0 10px 30px rgba(0,0,0,.22);opacity:0;transition:opacity .25s ease,transform .25s ease;pointer-events:none;max-width:90vw} .flash-toast.show{opacity:1;transform:translate(-50%,0)} /* Фин-блок: «Отменить оплату» — нейтральная таблетка (не путается с ₽/✕), понятно что это откат */ .rev-round.pay-undo{width:auto;border-radius:9px;padding:0 12px;gap:5px;font-size:12px;font-weight:700;color:#5a6b7a;background:#eef2f6;border:1px solid #d4dde5} .rev-round.pay-undo:hover{background:#5a6b7a;color:#fff;border-color:#5a6b7a;box-shadow:0 3px 8px rgba(90,107,122,.25);transform:translateY(-1px)} /* v40 — кнопка отката согласования */ .rev-round.recall,.rv-bulk-b.recall{color:#8a6d1f;background:#fff} .rev-round.recall:hover,.rv-bulk-b.recall:hover{background:#fdf6e3;border-color:#e6c86a} /* v41 — групповые строки в маршруте авансов */ .adm-grouprow td{background:var(--panel-2,#f2f5f7);font-weight:800;font-size:11px;text-transform:uppercase;letter-spacing:.03em;color:var(--muted);padding:6px 12px} /* v42 — компактный фильтр-дропдаун с чекбоксами (КТО/ФИО) */ .flt-bar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:12px} .flt-dd{position:relative} .flt-dd-btn{display:inline-flex;align-items:center;gap:7px;background:#fff;border:1px solid var(--line);border-radius:11px;padding:7px 13px;font:inherit;font-size:12.5px;font-weight:600;color:var(--ink);cursor:pointer;transition:border-color .12s ease,box-shadow .12s ease} .flt-dd-btn:hover{border-color:#cfd8dc} .flt-dd-btn.has{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)} .flt-dd-cap{font-size:10.5px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.03em} .flt-dd-btn b{font-weight:700} .flt-dd-car{color:var(--muted);font-size:10px} .flt-dd-panel{position:absolute;top:calc(100% + 6px);left:0;z-index:50;min-width:210px;max-height:280px;overflow-y:auto;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 30px rgba(20,60,70,.16);padding:6px} .flt-dd-opt{display:flex;align-items:center;gap:9px;padding:7px 9px;border-radius:8px;font-size:12.5px;color:var(--ink);cursor:pointer} .flt-dd-opt:hover{background:var(--panel-2,#f2f5f7)} .flt-dd-opt input{width:15px;height:15px;accent-color:var(--accent);cursor:pointer} .flt-clear{align-self:center;font-size:12px;color:var(--muted);text-decoration:none} .flt-clear:hover{color:#b23c3c} /* v43 — кнопки согласовать/вернуть ведомость сотрудника в шапке колонки */ .emp-ctl-b.ok{color:#0d9488} .emp-ctl-b.ok:hover{background:var(--ok-soft)} .emp-ctl-b.no{color:#d9534f} .emp-ctl-b.no:hover{background:#fdecec} /* v44 — под-заголовки групп строк в ведомости */ .grp-row .rowhdr.grp{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);background:var(--panel-2,#eef3f5);padding:5px 10px} .grp-row td{background:var(--panel-2,#eef3f5);border-bottom:1px solid var(--line)} /* v45 — профессиональная ячейка аванса: кнопка отправки не наезжает на число, спокойный плоский вид */ .mcell:has(.cell-send) input.val, .mcell:has(.cell-send) .ro{padding-right:20px} .cell-send{ position:absolute; top:50%; right:2px; left:auto; bottom:auto; transform:translateY(-50%); width:16px; height:16px; padding:0; margin:0; border:none; border-radius:5px; background:var(--accent-soft); color:var(--accent-ink); font-size:9px; line-height:1; cursor:pointer; display:grid; place-items:center; box-shadow:none; opacity:.9; transition:background .12s ease, color .12s ease, opacity .12s ease, transform .08s ease; } .cell-send:hover{background:var(--accent); color:#fff; opacity:1; transform:translateY(-50%)} .cell-send:active{transform:translateY(-50%) scale(.9)} .cell-send.off, .cell-send.off:hover{background:#e5e9eb; color:#9aa6ab; cursor:default; opacity:.85; transform:translateY(-50%)} /* держим кнопку на месте при фокусе — fill-handle в самом углу, не конфликтует */ .mcell.editable:focus-within .cell-send{right:2px} /* v46 — переверстка согласования под макет (бирюза) */ /* карточка-таблица: скруглённая рамка, тонкие разделители, липкая шапка-капс */ .rv-tbl-wrap{border-radius:var(--radius-lg);border-color:var(--line);box-shadow:0 6px 22px rgba(22,50,63,.06)} .rv-tbl thead th{background:#f7f9fb;color:var(--muted);font-size:10.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;border-bottom:1px solid var(--line)} .rv-tbl tbody td{border-bottom:1px solid #eef2f5} .rv-row{transition:background .12s ease} .rv-row:hover{background:#f4fbfc} .rv-row.is-sel{background:var(--accent-soft)} .rv-row.is-sel:hover{background:#dbf3f6} .rv-row.is-sel td:first-child{border-left-color:var(--accent)} /* ФИО как кликабельная ячейка раскрытия */ .rv-name{display:inline-flex;align-items:center;gap:7px;cursor:pointer;user-select:none;color:var(--ink)} .rv-name.is-adv{cursor:default} .rv-adv-tag{font-size:9.5px;font-weight:800;text-transform:uppercase;letter-spacing:.03em;color:var(--warn,#e9a23b);background:var(--warn-soft,#fbf1de);border-radius:5px;padding:1px 6px;white-space:nowrap} .rv-row-adv td{background:rgba(233,162,59,.04)} /* строка аванса — лёгкий янтарный фон, чтобы отличать от зарплаты */ .rv-name b{font-weight:700} .rv-name:hover{color:var(--accent-ink)} .rv-name-car{color:var(--muted);flex:none;transition:transform .16s ease} .rv-row.is-open .rv-name-car{transform:rotate(180deg);color:var(--accent-ink)} .rv-row.is-open{background:var(--accent-soft)} /* строка деталей */ .rv-detail>td{background:#f7fafb;padding:14px 22px 16px 46px;border-bottom:1px solid var(--line)!important} /* Z3: раскрытие сотрудника в Бонусах/Авансах — «требует согласования» vs «согласовано ранее» */ .rv-gsplit{display:flex;gap:18px;flex-wrap:wrap;padding:8px 4px} .rv-gcol{flex:1;min-width:220px} .rv-gcol-cap{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;margin-bottom:6px} .rv-gcol.req .rv-gcol-cap{color:#9a6b16} .rv-gcol.done .rv-gcol-cap{color:var(--ok,#25b07a)} .rv-gitem{display:flex;align-items:center;gap:8px;padding:5px 9px;border-radius:8px;background:var(--warn-soft,#fbf1de);margin-bottom:5px;font-size:12.5px} .rv-gitem.is-done{background:var(--ok-soft,#e7f6ef);opacity:.9} .rv-gitem .rv-goto,.rv-gitem .rv-gdone-l{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-decoration:none;color:var(--accent-ink,#0f8d9b)} .rv-gitem .rv-gdone-l{color:var(--ink-soft)} .rv-gitem .num{font-weight:800;white-space:nowrap} .rv-gtag.ok{font-size:9.5px;font-weight:800;color:var(--ok,#25b07a);white-space:nowrap} .rv-gact{display:inline-flex;gap:4px} .rv-need{color:#9a6b16} .rv-done{color:var(--ok,#25b07a);font-weight:700} .rv-detail-grid{display:grid;grid-template-columns:1fr 1fr 1.5fr;gap:22px} .rv-detail-cap{font-size:10px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);margin-bottom:4px} .rv-detail-val{font-size:12.5px;color:var(--ink)} .rv-detail-val.has-cmt{color:var(--stage-rej-ink)} /* панель массовых действий — «N выбрано · сумма» слева, действия справа */ .rv-bulk{width:100%;justify-content:flex-start} .rv-bulk .rv-bulk-cnt{margin-right:auto} .rv-bulk-sum b{color:var(--accent-ink);font-variant-numeric:tabular-nums} /* именованные текстовые кнопки в панели (согласовать / вернуть / снять) */ .rv-bulk-txt{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 14px;border-radius:9px;border:1.5px solid var(--line);background:#fff;font:inherit;font-weight:700;font-size:12.5px;cursor:pointer;transition:all .13s ease;white-space:nowrap} .rv-bulk-txt.primary{background:var(--accent);border-color:var(--accent);color:#fff} .rv-bulk-txt.primary:hover{background:var(--accent-ink);border-color:var(--accent-ink);box-shadow:0 4px 12px rgba(22,179,196,.28)} .rv-bulk-txt.danger{color:var(--stage-rej-ink);border-color:var(--stage-rej-line);background:#fff} .rv-bulk-txt.danger:hover{background:var(--stage-rej-soft)} .rv-bulk-txt.ghost{border-color:transparent;background:transparent;color:var(--ink-soft);font-weight:600} .rv-bulk-txt.ghost:hover{color:var(--ink);background:var(--panel-2,#eef3f5)} /* иконки-действия строки: квадратные с рамкой (переопределяем «круглые») */ .rv-act{gap:6px} .rev-round{width:30px;height:30px;border-radius:9px;border:1.5px solid var(--line);background:#fff;font-size:13px} .rev-round.ok{color:var(--stage-ok-ink);border-color:var(--stage-ok-line);background:#fff} .rev-round.ok:hover{background:var(--stage-ok-soft);color:var(--stage-ok-ink);border-color:var(--stage-ok);box-shadow:none;transform:none} .rev-round.no{color:var(--stage-rej-ink);border-color:var(--stage-rej-line);background:#fff} .rev-round.no:hover{background:var(--stage-rej-soft);color:var(--stage-rej-ink);border-color:var(--stage-rej);box-shadow:none;transform:none} .rev-round.lock,.rev-round.recall{border-color:var(--line);color:var(--muted);background:#fff} .rev-round.lock:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-soft)} /* бейджи статусов с цветной точкой (цвета из токенов приложения) */ .rev-line-st{display:inline-flex;align-items:center;gap:6px;font-weight:750} .rev-line-st::before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor;flex:none} .rv-row.is-wait .rev-line-st::before{background:#fff} /* футер таблицы */ .rv-foot{display:flex;justify-content:space-between;align-items:center;padding:11px 18px;background:#fbfdfe;border-top:1px solid var(--line);font-size:12.5px;color:var(--muted)} .rv-foot b{color:var(--ink)} .rv-foot-total b{color:var(--accent-ink);font-size:13.5px;font-variant-numeric:tabular-nums} /* блок авансов — визуально выделенная отдельная секция */ .rv-adv-block{margin-top:24px;padding-top:4px;border-top:1px dashed var(--line-strong)} .rv-adv-wrap{box-shadow:0 6px 22px rgba(124,92,255,.07)} .rv-adv thead th{background:#faf8ff} /* v47 — согласование: строка = сотрудник, раскрытие = его ячейки */ .rv-emp-tbl tbody tr.rv-emp{cursor:default} .rv-emp-tbl tbody tr.rv-emp>td{padding-top:11px;padding-bottom:11px} .rv-emp-tbl tbody tr.rv-emp.is-wait{background:linear-gradient(90deg,var(--accent-soft) 0 3px,transparent 3px)} .rv-emp-chk{width:15px;height:15px;accent-color:var(--accent)} .rv-exp-b{font-size:13px;letter-spacing:1px} /* вложенная таблица ячеек сотрудника */ .rv-emp-det>td{background:var(--panel-2,#f4f8f9);padding:0 0 0 34px;border-bottom:1px solid var(--line)} /* разбивка «за что оплата» (фин-блок) */ .rv-fin-det{padding:10px 16px 12px 0} .rv-fin-det-cap{font-size:9.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:800;margin-bottom:6px} .rv-fin-det-tbl{border-collapse:collapse;min-width:300px;max-width:480px} .rv-fin-det-tbl .rv-fd-c{width:22px;text-align:center;padding-left:4px} .rv-fin-det-tbl .rv-pos-chk{cursor:pointer;accent-color:var(--accent,#12a594)} .rv-fin-det-tbl .rv-fd-ok{color:var(--ok,#0d9488);font-weight:800} .rv-fin-det-tbl tr.rv-fd-paid{background:#efe8fc} /* оплаченная позиция в разбивке — фиолетовая заливка строки (как в ведомости) */ .rv-fin-det-tbl tr.rv-fd-paid .rv-fd-l{text-decoration:line-through;color:#5b3fc4} .rv-fin-det-tbl tr.rv-fd-paid .rv-fd-v{color:#5b3fc4} .rv-fd-pay{display:flex;align-items:center;gap:8px;margin-top:8px} .rv-fin-det-tbl td{padding:4px 10px;font-size:12.5px;border-bottom:1px solid var(--line)} .rv-fin-det-tbl .rv-fd-l{color:var(--ink-soft)} .rv-fin-det-tbl .rv-fd-v{text-align:right;font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap} .rv-fin-det-tbl .rv-fd-v.neg{color:var(--danger)} .rv-fin-det-tbl .rv-fd-sub td{color:var(--muted);font-size:11.5px;border-bottom:none;padding-top:6px} .rv-fin-det-tbl .rv-fd-total td{border-top:2px solid var(--line-strong);border-bottom:none;padding-top:7px;font-weight:800;color:var(--ink)} .rv-fin-det-tbl .rv-fd-total .rv-fd-v{color:var(--accent-ink)} .rv-cell-tbl{width:100%;border-collapse:collapse;margin:2px 0} .rv-cell-tbl td{padding:7px 12px;border-bottom:1px solid var(--line);font-size:12.5px;background:transparent;vertical-align:middle} .rv-cell-tbl tr:last-child td{border-bottom:none} .rv-cell-tbl tr.is-wait{box-shadow:inset 3px 0 0 var(--accent)} .rv-cell-tbl tr.is-sel td{background:var(--accent-soft)} .rv-cell-chk{width:34px;text-align:center} .rv-cell-chk input{width:14px;height:14px;accent-color:var(--accent)} .rv-cell-lbl{font-weight:600;color:var(--ink)} .rv-cell-act{text-align:right;width:120px} .rv-cell-tbl .rv-act{justify-content:flex-end} /* v48 — маркер комментария фин-блока при оплате аванса (виден в ячейке, текст — при наведении) */ .cell-paycmt{position:absolute;left:11px;bottom:0;font-size:9px;line-height:1;color:var(--accent-ink,#0f766e);cursor:help;z-index:5;font-weight:700} /* сдвинут правее уголка-комментария */ .mcell.adv-paid .cell-paycmt{color:#5b3fc4} .cell-paycmt:hover{transform:scale(1.25)} /* v49 — экран сотрудника «Моя ведомость» (раскладка по employee.html, гамма бирюза) */ .ml{display:flex;flex-direction:column;gap:14px;padding:2px} .ml-top{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap} .ml-top-l{display:flex;align-items:center;gap:12px;flex-wrap:wrap} .ml-top-l h1{margin:0;font-size:22px;font-weight:800} .ml .period-btn{display:flex;align-items:center;gap:8px;border:1px solid var(--line);background:#fff;border-radius:10px;padding:7px 12px;font-weight:700;color:var(--ink)} .ml .period-btn svg{width:16px;height:16px;color:var(--accent)} .ml .period-btn .caret{color:var(--muted);font-size:11px} .ml-stage{font-size:12px} .ml-top-r{display:flex;gap:10px;flex-wrap:wrap;align-items:center} .ml-rate{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);border:1px solid var(--line);border-radius:999px;padding:5px 12px;background:var(--panel,#f7faf9)} .ml-ps-btn{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:#1d7c4d;border:1.5px solid #1d7c4d;border-radius:999px;padding:5px 13px;background:#fff;text-decoration:none;white-space:nowrap;transition:background .15s,color .15s} .ml-ps-btn:hover{background:#1d7c4d;color:#fff} /* #2 pjax-фильтры: лёгкое затемнение блока во время догрузки (без белого мигания страницы) */ #ledgerSwap{transition:opacity .12s ease} #ledgerSwap.ledswap-loading{opacity:.55;pointer-events:none} /* #7 память фильтра: ненавязчивая кнопка «вернуть прошлый фильтр» при заходе в ту же ведомость */ .filt-restore{display:flex;align-items:center;gap:4px;margin:0 0 10px} .filt-restore .fr-btn{display:inline-flex;align-items:center;gap:6px;font:inherit;font-size:12px;font-weight:600;color:var(--accent-ink,#0d7a6b);background:var(--acc-soft,#eafaf6);border:1px solid #bfe9e0;border-radius:999px 4px 4px 999px;padding:6px 12px;cursor:pointer;transition:background .15s} .filt-restore .fr-btn:hover{background:#d7f4ec} .filt-restore .fr-btn b{font-weight:800} .filt-restore .fr-x{font:inherit;font-size:12px;line-height:1;color:var(--muted,#7a8792);background:var(--acc-soft,#eafaf6);border:1px solid #bfe9e0;border-left:none;border-radius:4px 999px 999px 4px;padding:6px 9px;cursor:pointer} .filt-restore .fr-x:hover{background:#d7f4ec;color:var(--ink,#1e2a33)} .ml-rate b{color:var(--ink)} .ml-lock-banner{background:var(--warn-soft,#fef3e2);border:1px solid var(--warn,#e0a800);border-radius:10px;padding:9px 14px;font-size:13px} /* KPI */ .ml-kpis{display:grid;grid-template-columns:repeat(5,1fr);gap:10px} .ml-kpi{background:#fff;border:1px solid var(--line);border-radius:12px;padding:10px 14px;display:flex;flex-direction:column;gap:3px} .ml-kpi-cap{font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted)} .ml-kpi-val{font-size:19px;font-weight:800;font-variant-numeric:tabular-nums} .ml-kpi-val.neg{color:var(--danger,#c0392b)} .ml-kpi.dark{background:var(--ink,#0f1b16);border-color:var(--ink,#0f1b16)} .ml-kpi.dark .ml-kpi-cap{color:#8aa39a} .ml-kpi.dark .ml-kpi-val{color:var(--accent-soft,#8fe3c8)} /* layout */ .ml-cols{display:grid;grid-template-columns:1fr 330px;gap:14px;align-items:start} .ml-col{display:flex;flex-direction:column;gap:14px;min-width:0} .ml-card{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden} .ml-card-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 14px;border-bottom:1px solid var(--line)} .ml-card-head h2{margin:0;font-size:13px;font-weight:800} .ml-note{font-size:11.5px;color:var(--muted)} .ml-note b{color:var(--ink)} /* календарь выходов */ .ml-days{display:grid;grid-template-columns:repeat(15,1fr);gap:5px;padding:12px 14px} .ml-day{position:relative;min-height:48px;border-radius:9px;border:1px solid var(--line);background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;padding:3px 2px;user-select:none} .ml-day.editable{cursor:pointer} .ml-day.editable:hover{border-color:var(--accent)} .ml-day-num{font-weight:700;font-size:12.5px;line-height:1.15} .ml-day-wd{font-size:9px;color:var(--muted);line-height:1.15} .ml-day.is-weekend{background:var(--panel-2,#f1f5f3);color:var(--muted)} .ml-day.is-out{background:var(--accent,#0f766e);border-color:var(--accent,#0f766e);color:#fff} .ml-day.is-out .ml-day-wd{color:rgba(255,255,255,.82)} .ml-day.st-s_head,.ml-day.st-s_manager{box-shadow:inset 0 0 0 2px var(--warn,#e0a800)} .ml-day.st-approved{box-shadow:inset 0 0 0 2px var(--ok,#0d9488)} .ml-day.st-rejected{box-shadow:inset 0 0 0 2px var(--danger,#c0392b)} /* маленькая круглая «+» слева-сверху ячейки: белая (видна и на зелёном выходе), появляется при наведении */ .ml-day-plus{position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;border:none;background:#fff;color:var(--green,#25b07a);font-size:13px;font-weight:700;line-height:16px;padding:0;text-align:center;display:none;box-shadow:0 1px 4px rgba(16,25,19,.3);z-index:2;transition:transform .1s ease} .ml-day:hover .ml-day-plus{display:block} .ml-day-plus:active{transform:scale(.9)} .ml-day-cmt{display:none;position:absolute;top:4px;right:4px;width:6px;height:6px;border-radius:50%;background:var(--warn,#f59e0b)} .ml-day.has-cmt .ml-day-cmt{display:block} /* авансы */ .ml-av-grid{display:grid;grid-template-columns:1fr 150px 150px 120px;align-items:center;gap:8px;padding:8px 14px;border-bottom:1px solid var(--line);font-size:13px} .ml-av-grid:last-child{border-bottom:none} .ml-av-grid.head{font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)} .ml-av-grid .r{text-align:right} .ml-av-title{display:flex;align-items:center;gap:6px;font-weight:600} .ml-av-plus{width:16px;height:16px;border:none;background:transparent;color:var(--muted);cursor:pointer;font-size:13px;line-height:1;padding:0} .ml-av-plus.has{color:var(--info,#2563eb)} .ml-av-plus:hover{color:var(--accent-ink)} .ml-av-in{width:130px;border:1px solid var(--line);border-radius:8px;padding:6px 10px;font-weight:700;text-align:right;font-variant-numeric:tabular-nums;background:var(--panel,#f7faf9)} .ml-av-in:focus{outline:2px solid var(--accent);background:#fff} .ml-av-val{font-weight:700;font-variant-numeric:tabular-nums} .ml-av-send{background:var(--accent-soft,#dff2ec);color:var(--accent-ink,#0f766e);border:1px solid transparent;border-radius:8px;padding:6px 12px;font-weight:600;font-size:12px;cursor:pointer} .ml-av-send:hover{background:var(--accent);color:#fff} /* начисления/вычеты */ .ml-nv{display:grid;grid-template-columns:1fr 1fr} .ml-nv>div:first-child{border-right:1px solid var(--line)} .ml-krow{display:flex;justify-content:space-between;gap:10px;padding:8px 14px;border-bottom:1px solid var(--line);font-size:12.5px} .ml-krow:last-child{border-bottom:none} .ml-krow span{color:var(--ink-soft,#55635c)} .ml-krow .dim{color:var(--muted);font-size:11px} .ml-krow .neg{color:var(--danger,#c0392b)} .ml-krow.total{background:var(--panel,#f7faf9);font-weight:700} .ml-krow.total span{color:var(--ink)} /* сайдбар / отправка */ .ml-sent{background:var(--ok-soft,#e2f6e9);color:var(--ok,#0d9488);border:1px solid var(--ok-line,#bfe8cc);border-radius:11px;padding:12px;font-weight:600;font-size:13px;display:flex;flex-direction:column;gap:3px;text-align:center} .ml-sent .muted{font-weight:400;font-size:11px} .ml-send{width:100%;background:var(--accent,#0f766e);color:#fff;border:none;border-radius:11px;padding:12px;font-size:13.5px;font-weight:600;cursor:pointer} .ml-send:hover{background:var(--accent-ink,#0c5f57)} .ml-hint{font-size:11.5px;color:var(--muted);padding:8px 2px 0} .ml-hint.rej{color:var(--danger,#c0392b)} .ml-side-hint{font-size:11.5px;color:var(--muted);padding:2px} /* статус-бейджи (скоуп .ml, чтобы не задеть другие экраны) */ .ml .tag{display:inline-flex;align-items:center;gap:5px;border-radius:999px;padding:3px 9px;font-size:11px;font-weight:600;background:var(--panel-2,#eef3f1);color:var(--ink-soft,#55635c)} .ml .tag.st-draft{background:#eef1f0;color:#556} .ml .tag.st-submitted{background:var(--warn-soft,#fef4e2);color:var(--warn-ink,#b54708)} .ml .tag.st-approved{background:var(--ok-soft,#e2f6e9);color:var(--ok-ink,#14683a)} .ml .tag.st-rejected{background:var(--danger-soft,#fdebe9);color:var(--danger-ink,#b42318)} @media (max-width:1000px){.ml-cols{grid-template-columns:1fr}.ml-kpis{grid-template-columns:repeat(2,1fr)}.ml-days{grid-template-columns:repeat(10,1fr)}} /* v50 — доп.сумма дня, поповер дня, зелёный акцент, кнопка «Очистить» (экран сотрудника) */ :root{ --green:#25b07a; --green-dark:#0d7a6b; --green-soft:#e7f6ef; --green-line:#bfe6d3; } /* в тон кнопке «Оплачено» (--ok) */ /* выход = зелёный (акцент по просьбе) */ .ml-day.is-out{background:var(--green);border-color:var(--green);color:#fff} .ml-day.is-out .ml-day-wd{color:rgba(255,255,255,.85)} .ml-day.is-out .ml-day-extra{color:#0f7a43} .ml-day.editable:hover{border-color:var(--green)} /* доп.сумма без выхода = оранжевый контур; с выходом — зелёный, сумма показана */ .ml-day.has-extra:not(.is-out){border-color:#e08a1e;box-shadow:inset 0 0 0 1px #e08a1e} .ml-day-extra{font-size:9px;font-weight:800;line-height:1.1;color:#c2740f;white-space:nowrap} .ml-day-penbadge{white-space:nowrap;font-size:9px;line-height:1.1} /* кнопки — зелёный акцент */ .ml-send{background:var(--green)} .ml-send:hover{background:var(--green-dark)} .ml-av-send{background:var(--green-soft);color:var(--green);border-color:var(--green-line)} .ml-av-send:hover{background:var(--green);color:#fff} .ml-day-plus:hover{background:var(--green);color:#fff} .ml-clear{width:100%;margin-top:8px;background:#fff;color:var(--muted);border:1px solid var(--line);border-radius:11px;padding:9px;font-size:12.5px;font-weight:600;cursor:pointer} .ml-clear:hover{background:var(--danger-soft,#fdecec);color:var(--danger,#c0392b);border-color:var(--danger-line,#f4c7c0)} /* поповер дня */ .pop-overlay{position:fixed;inset:0;background:rgba(16,25,19,.28);display:none;align-items:center;justify-content:center;z-index:60} .pop-overlay.is-open{display:flex} .ml-pop{width:360px;max-width:94vw;background:#fff;border-radius:14px;box-shadow:0 24px 60px -12px rgba(16,25,19,.4);overflow:hidden} .ml-pop-head{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;border-bottom:1px solid var(--line);background:var(--panel,#f7faf9)} .ml-pop-cap{font-size:12px;font-weight:600;color:var(--ink-soft,#55635c)} .ml-pop-x{width:24px;height:24px;border:none;background:transparent;color:var(--muted);font-size:16px;cursor:pointer;border-radius:7px} .ml-pop-x:hover{background:var(--line)} .ml-pop-body{padding:12px 14px 13px;display:flex;flex-direction:column;gap:9px} .ml-pop-title{font-size:14px;font-weight:800} .ml-pop-out{width:100%;border:1px solid var(--line);border-radius:9px;padding:9px;font-size:12.5px;font-weight:600;background:#fff;color:var(--ink);cursor:pointer} .ml-pop-out:hover{border-color:var(--green)} .ml-pop-out.is-out{background:var(--green);border-color:var(--green);color:#fff} .ml-pop-cap2{font-size:10.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:5px} .ml-stepper{display:flex;gap:6px;align-items:center} .ml-step-btn{width:30px;height:30px;border-radius:8px;border:1px solid var(--line);background:var(--panel,#f7faf9);font-size:15px;font-weight:700;color:var(--ink-soft,#55635c);cursor:pointer} .ml-step-btn:hover{background:var(--line)} .ml-step-in{flex:1;border:1px solid var(--line);border-radius:8px;padding:6px 10px;font-size:14px;font-weight:700;text-align:center;background:var(--panel,#f7faf9);min-width:0} .ml-step-in:focus{outline:2px solid var(--green);background:#fff} .ml-step-cur{font-size:13px;color:var(--muted)} .ml-pop-note{font-size:11px;color:var(--muted);margin-top:4px;line-height:1.35} .ml-pop-thread{display:flex;flex-direction:column;gap:5px;max-height:118px;overflow:auto} .ml-pop-empty{text-align:center;color:var(--muted);font-size:12px;padding:6px 0} .ml-pop-msg{background:var(--panel,#f7faf9);border-radius:9px;padding:7px 10px} .ml-pop-msg-meta{font-size:10.5px;color:var(--muted);margin-bottom:2px} .ml-pop-msg-text{font-size:12.5px;color:var(--ink)} .ml-pop textarea{width:100%;min-height:54px;border:1px solid var(--line);border-radius:9px;padding:7px 10px;font-size:13px;resize:vertical;background:var(--panel,#f7faf9);font-family:inherit} .ml-pop textarea:focus{outline:2px solid var(--green);background:#fff} .ml-pop-foot{display:flex;gap:8px} .ml-pop-btn{flex:1;border-radius:9px;padding:10px 12px;font-size:12.5px;font-weight:700;cursor:pointer;border:1px solid var(--line);transition:background .12s,color .12s,border-color .12s;white-space:nowrap} .ml-pop-btn.ghost{background:#fff;color:var(--ink-soft,#55635c)} .ml-pop-btn.ghost:hover{background:var(--panel,#f7faf9);border-color:var(--ink-soft,#55635c)} .ml-pop-btn.primary{background:var(--green);color:#fff;border-color:var(--green)} .ml-pop-btn.primary:hover{background:var(--green-dark)} .ml-pop-add{background:var(--green);color:#fff;border:none;border-radius:9px;padding:9px 18px;font-size:13px;font-weight:600;cursor:pointer} .ml-kpi-val.extra{color:#c2740f} /* v51 — панель колонки: столбик, цвета по кнопкам, заливка активной (по просьбе) */ .emp-ctl{position:static;transform:none;display:flex;flex-direction:column;align-items:stretch;gap:3px;background:transparent;border:none;border-radius:0;padding:4px 6px 5px;box-shadow:none;border-bottom:1px solid var(--line);z-index:8} .emp-col:hover .emp-ctl{display:flex} .emp-ctl form{margin:0;display:flex;width:100%} .emp-ctl-b{width:100%;height:20px;border:none;background:#fff;border-radius:6px;cursor:pointer;font-size:10px;line-height:1;color:var(--ink-soft);display:grid;place-items:center;box-shadow:var(--shadow-sm);transition:background .12s ease,color .12s ease,transform .06s ease} .emp-ctl-b:active{transform:scale(.94)} /* Отправить — зелёная при наведении/нажатии */ .emp-ctl-b.send{color:var(--green-dark)} .emp-ctl-b.send:hover,.emp-ctl-b.send:active{background:var(--green);color:#fff} /* Согласовать всё — зелёная; Вернуть всё — красная */ .emp-ctl-b.ok{color:var(--green-dark)} .emp-ctl-b.ok:hover,.emp-ctl-b.ok:active{background:var(--green);color:#fff} .emp-ctl-b.no{color:var(--danger)} .emp-ctl-b.no:hover,.emp-ctl-b.no:active{background:var(--danger);color:#fff} /* Замочек — одна кнопка блок/разблок; при блокировке залито */ .emp-ctl-b.lock{color:var(--ink-soft)} .emp-ctl-b.lock:hover{background:var(--bg,#eef3f5)} .emp-ctl-b.lock.on{background:#475569;color:#fff} .emp-ctl-b.lock.on:hover{background:#334155} /* Удержание («не платить») — при наведении красная; когда стоит — залито мягко-красным (🔒) */ .emp-ctl-b.hold{color:var(--ink-soft)} .emp-ctl-b.hold:hover,.emp-ctl-b.hold:active{background:var(--danger-soft);color:var(--danger)} .emp-ctl-b.hold.on{background:var(--danger);color:#fff} .emp-ctl-b.hold.on:hover{background:#d94b6b} /* Пауза — жёлтая при наведении; на стопе залито жёлтым */ .emp-ctl-b.pause{color:var(--ink-soft)} .emp-ctl-b.pause:hover,.emp-ctl-b.pause:active{background:var(--warn);color:#fff} .emp-ctl-b.pause.on{background:var(--warn);color:#fff} /* Крестик — красный при наведении/нажатии */ .emp-ctl-b.del{color:var(--ink-soft)} .emp-ctl-b.del:hover,.emp-ctl-b.del:active{background:var(--danger);color:#fff} /* v52 — быстрые действия по наведению на ячейку (согласовать/вернуть/блок-разблок) для руководителя/управляющего */ .cell-rev{position:absolute;top:1px;right:1px;display:none;gap:2px;z-index:7} .mcell:hover .cell-rev{display:flex} .crev{width:15px;height:15px;border:none;border-radius:4px;background:#fff;color:var(--ink-soft);font-size:9px;line-height:1;cursor:pointer;display:grid;place-items:center;box-shadow:var(--shadow-sm);padding:0;transition:background .1s,color .1s} .crev.ok:hover{background:var(--green,#25b07a);color:#fff} .crev.no:hover{background:var(--danger);color:#fff} .crev.lock:hover{background:var(--bg,#eef3f5)} .crev.lock.on{background:#475569;color:#fff} /* v62 — ⋮-меню действий ячейки: одна кнопка в углу, действия скрыты в поповере (вместо налезающих кнопок) */ /* триггер меню действий по ячейке (в углу). z-index:6 — ВЫШЕ соседней ячейки в фокусе (5), чтобы её белый фон/рамка не перекрывали ⋯, но НИЖЕ липких элементов (левая колонка 20, шапка 21, угол 23) — при прокрутке точка уходит ЗА них. Само меню (.cell-menu) — z-index:95. */ .cell-menu-wrap{position:absolute;top:1px;right:1px;left:auto;z-index:6} /* триггер «ещё действия» (⋯) — нейтральный и приглушённый, чтобы не бросался в глаза; проявляется при наведении на ячейку, при наведении/открытии окрашивается акцентом */ .cell-menu-btn{width:16px;height:14px;border:none;background:transparent;color:var(--muted,#9aa7b0);font-size:15px;line-height:12px;font-weight:700;letter-spacing:.02em;cursor:pointer;padding:0;opacity:.3;border-radius:4px;transition:opacity .12s,color .12s,background .12s} .mcell:hover .cell-menu-btn,.acell:hover .cell-menu-btn{opacity:.7} .cell-menu-btn:hover{opacity:1;color:var(--accent-ink,#0d7a6b);background:var(--accent-soft)} .cell-menu-wrap.open .cell-menu-btn{opacity:1;color:var(--accent-ink,#0d7a6b);background:var(--accent-soft)} /* если под точкой есть непрочитанный комментарий — синий сигнал */ .cell-menu-wrap:has(.cm-comment.has) .cell-menu-btn{opacity:1;color:var(--info)} .cell-menu[hidden]{display:none} /* поповер: значки В СТРОЧКУ на переднем плане (без белого фона-коробки), плавно, position:fixed */ .cell-menu{position:fixed;top:0;left:0;background:transparent;border:none;box-shadow:none;padding:2px;z-index:95; display:flex;flex-direction:row;gap:4px;align-items:center;transform-origin:left center;animation:cmIn .15s cubic-bezier(.34,1.4,.5,1)} @keyframes cmIn{from{opacity:0;transform:translateX(-8px) scale(.8)}to{opacity:1;transform:none}} /* каждый значок — отдельный «плавающий» кружок с тенью (на переднем плане над ячейками) */ .cm-item{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border:none;padding:0;border-radius:50%; background:#fff;box-shadow:0 3px 10px -2px rgba(20,50,63,.4),0 0 0 1px rgba(20,50,63,.07); font:inherit;color:var(--ink);cursor:pointer;transition:transform .1s,background .1s,color .1s} .cm-item:hover{transform:scale(1.14)} .cm-item>span:not(.cm-gl){display:none} /* подписи скрыты — только значок + мгновенная подсказка (data-tip) */ .cm-item svg{width:13px;height:13px;flex:none;display:block} .cm-item .cm-gl{flex:none;text-align:center;font-weight:800;font-size:13px;display:inline-block;line-height:1} .cm-item:hover{background:var(--accent-soft);color:var(--accent-ink)} .cm-item.cm-comment.has{color:var(--info)} .cm-item.cm-send{color:var(--accent-ink,#0d7a6b)} .cm-item.cm-send:hover{background:var(--accent-soft);color:var(--accent-ink)} .cm-item.cm-send.off{color:var(--muted);opacity:.75} .cm-item.cm-send.rej{color:var(--danger)} .cm-item.cm-ok{color:var(--ok,#25b07a)} .cm-item.cm-ok:hover{background:var(--ok-soft,#e7f6ef);color:var(--ok,#1f9268)} .cm-item.cm-no{color:var(--danger)} .cm-item.cm-no:hover{background:var(--danger-soft);color:var(--danger)} .cm-item.cm-lock,.cm-item.cm-unlock{color:var(--ink-soft)} .cm-item.cm-lock.on,.cm-item.cm-unlock{color:#b9821f} .cm-item.cm-pay{color:#5b3fc4} .cm-item.cm-pay:hover{background:#efe8fb;color:#5b3fc4} /* v53 — матрица: клик-выход в дне (как у сотрудника) + доп.сумма/штраф в дне */ .day-row .acell.editable{cursor:pointer} .day-mark{display:block;text-align:center;font-weight:800;font-size:11px;color:var(--green,#25b07a);line-height:1.4;min-height:14px} .day-mark.day-hrs{color:var(--teal,#0d9488);font-variant-numeric:tabular-nums} .day-row .acell.day-out{background:var(--green-soft,#e7f6ef)} .day-row .acell.day-out .day-mark{color:var(--green,#25b07a)} /* инлайн-ввод часов (часовая ставка) */ .day-hr-inp{width:100%;box-sizing:border-box;border:1px solid var(--teal,#0d9488);border-radius:5px;background:#fff;text-align:center;font:800 11px/1.3 inherit;color:var(--ink);padding:2px 1px;outline:none} /* бейдж «фикс» на строке оклада */ .rate-badge{display:inline-block;font-size:9px;font-weight:800;letter-spacing:.3px;text-transform:uppercase;color:var(--teal,#0d9488);background:var(--accent-soft,#e6f4f2);border-radius:5px;padding:1px 5px;vertical-align:middle} .day-ex{display:block;text-align:center;font-size:8.5px;font-weight:800;color:#c2740f;line-height:1} .day-ex.neg{color:var(--danger,#c0392b)} .cmt-extra{border-top:1px solid var(--line);padding-top:6px;margin-top:2px} .cmt-extra-cap{font-size:9.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin-bottom:3px} .cmt-extra-row{display:flex;gap:6px;align-items:flex-end} .cmt-extra-f{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px} .cmt-extra-f>span{font-size:9.5px;font-weight:800;letter-spacing:.02em} .cmt-extra-f--add>span{color:var(--ok,#0d9488)} .cmt-extra-f--pen>span{color:var(--danger,#e0455a)} /* input.cmt-extra-in — специфичность выше глобального input:not([type]), иначе паддинг 9px делал поля высокими */ input.cmt-extra-in{width:100%;height:26px;border:1px solid var(--line);border-radius:6px;padding:2px 8px;font-size:12.5px;font-weight:700;text-align:right;min-width:0;background:var(--bg,#f7faf9)} .cmt-extra-f--add input.cmt-extra-in:focus{outline:2px solid var(--ok,#25b07a);background:#fff} .cmt-extra-f--pen input.cmt-extra-in:focus{outline:2px solid var(--danger,#e0455a);background:#fff} .cmt-extra-hint{font-size:9.5px;line-height:1.3;color:var(--muted);margin-top:3px} /* v54 — «Моя ведомость»: центрирование + шире + компактнее строк/ячеек */ .ml{max-width:1440px;margin:0 auto} .ml-kpi{padding:7px 13px;gap:2px} .ml-kpi-val{font-size:17px} .ml-card-head{padding:6px 14px} .ml-days{gap:4px;padding:9px 12px} .ml-day{min-height:44px} .ml-av-grid{padding:5px 14px} .ml-av-grid.head{padding:5px 14px} .ml-av-in{padding:5px 10px} .ml-krow{padding:6px 14px} .ml-nv .ml-krow{padding:6px 14px} /* v55 — «Моя ведомость»: центр + компактные авансы со степперами +/− + подсветка статусов */ .ml{max-width:1280px} /* центрируется (margin:auto из v54) на большинстве экранов */ /* авансы: 4 колонки, компактно */ .ml-av-grid{grid-template-columns:130px minmax(180px,1fr) 150px 120px;padding:5px 14px;font-size:12.5px;align-items:center;gap:10px} .ml-av-grid.head{padding:6px 14px} .ml-av-title{font-weight:600;font-size:12.5px} .ml-av-input{display:flex;align-items:center;gap:5px;justify-content:flex-start;min-width:0} .ml-av-in{width:110px;flex:none;padding:5px 9px;font-size:13px} .ml-av-step{width:24px;height:24px;flex:none;border:1px solid var(--line);background:var(--bg,#f4f8f9);border-radius:6px;font-size:15px;font-weight:700;color:var(--ink-soft);cursor:pointer;display:grid;place-items:center;line-height:1;padding:0} .ml-av-step:hover{background:var(--green,#25b07a);color:#fff;border-color:var(--green,#25b07a)} .ml-av-send{white-space:nowrap} /* подсветка строки: отправлено = жёлтым, оплачено = зелёным, возврат = красным */ .ml-av-grid.av-sent{background:var(--warn-soft,#fef4e2)} .ml-av-grid.av-paid{background:var(--green-soft,#e7f6ef)} .ml-av-grid.av-rej{background:var(--danger-soft,#fdecec)} /* v56 — кнопка разблокировки ячейки (reopen) на hover-панели */ .crev.unlock{color:var(--green,#25b07a)} .crev.unlock:hover{background:var(--green,#25b07a);color:#fff} /* v58 — согласованный день: жёлтая рамка (как «на согласовании») + замок-состояние. Правило перекрывает day-out (зелёный ✓-фон) и st-s_manager (синий) более высокой специфичностью и порядком. */ .day-row .acell.day-appr{background:var(--warn-soft,#fbf1de)!important;box-shadow:inset 0 0 0 1.6px #e6b34d!important} .day-row .acell.day-appr .day-mark{color:#b9821f} .day-row .acell.day-appr.day-out{background:var(--warn-soft,#fbf1de)!important} /* постоянная иконка замка в углу согласованного/заблокированного дня */ .day-row .acell .cell-lock{color:#c68a1e;opacity:.9} .day-row .acell .cell-lock svg{display:block;width:11px;height:11px} /* кнопка-разблокировка на согласованном дне — показываем закрытый замок (текущее состояние), клик снимает */ .crev.unlock.on{color:#b9821f;background:#fff} .crev.unlock.on:hover{background:#e6b34d;color:#fff} /* v59 — карточка периода: teal-hero в компактной сетке (натянуто из card.html) */ .cards{grid-template-columns:repeat(auto-fill,minmax(216px,1fr));gap:14px} .pcard{position:relative;overflow:hidden;display:block;padding:15px 16px 14px;border-radius:20px; background:linear-gradient(160deg,#fff 0%,#f7fbfb 52%,#eef8f7 100%); border:1px solid var(--line);box-shadow:0 10px 26px -18px rgba(22,50,63,.4),0 1px 2px rgba(22,50,63,.04); transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease} .pcard:hover{text-decoration:none;transform:translateY(-3px);border-color:var(--accent); box-shadow:0 20px 38px -20px rgba(22,179,196,.5),0 2px 6px rgba(22,50,63,.06)} .pcard.is-active{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent),0 14px 30px -18px rgba(22,179,196,.5)} .pcard-glow{position:absolute;top:-58px;right:-44px;width:164px;height:164px;border-radius:50%;pointer-events:none; background:radial-gradient(circle,rgba(22,179,196,.22),rgba(22,179,196,0) 68%);transition:transform .2s ease} .pcard:hover .pcard-glow{transform:scale(1.12)} .pcard-head{position:relative;display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px} .pcard-mo{display:flex;align-items:center;gap:7px;font-family:'Unbounded','Inter',sans-serif;font-weight:700;font-size:15px;color:var(--accent-ink)} .pcard-dot{width:7px;height:7px;border-radius:50%;background:var(--warn);flex:none;box-shadow:0 0 0 3px var(--warn-soft)} .pcard-ring{position:relative;width:44px;height:44px;flex:none} .pcard-ring svg{width:44px;height:44px;display:block} .pcard-ring .rbg{fill:none;stroke:rgba(22,50,63,.09);stroke-width:4} .pcard-ring .rfg{fill:none;stroke:url(#pcardGrad);stroke-width:4;stroke-linecap:round;transition:stroke-dasharray .4s ease} .pcard-ring-txt{position:absolute;inset:0;display:grid;place-items:center;font-size:11.5px;font-weight:800;color:var(--accent-ink);font-variant-numeric:tabular-nums} .pcard-sum{position:relative;font-family:'Unbounded','Inter',sans-serif;font-weight:700;font-size:23px;color:var(--ink);line-height:1;font-variant-numeric:tabular-nums} .pcard-sum .rub{font-size:14px;color:var(--accent);font-weight:700;margin-left:1px} .pcard-foot{position:relative;display:flex;align-items:center;gap:8px;margin-top:12px;font-size:11.5px} .pcard-chip{display:inline-flex;align-items:center;gap:6px;background:var(--accent-soft);border:1px solid rgba(22,179,196,.24); border-radius:10px;padding:4px 9px 4px 5px;font-weight:700;color:var(--accent-ink)} .pcard-chip .cdot{width:16px;height:16px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent-ink));display:grid;place-items:center;color:#fff;flex:none} .pcard-of{color:var(--muted);font-weight:600} .pcard-empty .pcard-chip{background:rgba(22,50,63,.05);border-color:rgba(22,50,63,.1);color:#6e827c} .pcard-empty .pcard-chip .cdot{background:#b8c2c9} /* v60 — мягкая заливка колонки сотрудника по стадии (согласовано мной / отправлено / возврат) — не режет глаза */ .emp-col.col-approved{box-shadow:inset 0 3px 0 var(--stage-ok); background-image:linear-gradient(180deg,var(--stage-ok-soft),transparent 60%)} .emp-col.col-s_head{box-shadow:inset 0 3px 0 var(--stage-head); background-image:linear-gradient(180deg,var(--stage-head-soft),transparent 60%)} .emp-col.col-s_manager{box-shadow:inset 0 3px 0 var(--stage-mgr); background-image:linear-gradient(180deg,var(--stage-mgr-soft),transparent 60%)} .emp-col.col-rejected{box-shadow:inset 0 3px 0 var(--stage-rej); background-image:linear-gradient(180deg,var(--stage-rej-soft),transparent 60%)} /* сами статусные ячейки — чуть бледнее, чтобы залитая колонка была спокойной */ .mcell.st-s_head{background:color-mix(in srgb,var(--stage-head-soft) 62%,#fff)} .mcell.st-s_manager{background:color-mix(in srgb,var(--stage-mgr-soft) 62%,#fff)} .mcell.st-s_finance{background:color-mix(in srgb,var(--stage-fin-soft) 62%,#fff)} .mcell.st-approved{background:color-mix(in srgb,var(--stage-ok-soft) 62%,#fff)} /* v61 — ролевые фильтры ведомости/согласования (чипы, как на макете) */ .fbar{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:0 0 8px} .fbar-cap{font-size:10.5px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin-right:2px} .fchip{display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border-radius:11px;background:var(--panel);border:1px solid var(--line); color:var(--ink-soft);font-size:12.5px;font-weight:600;line-height:1;transition:border-color .12s,background .12s,color .12s,box-shadow .12s;white-space:nowrap} .fchip{transition:border-color .15s,color .15s,transform .1s,box-shadow .15s} .fchip:hover{text-decoration:none;border-color:var(--accent);color:var(--accent-ink);transform:translateY(-1px);box-shadow:0 3px 8px -5px rgba(22,179,196,.6)} .fchip.is-active{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:0 4px 12px -4px rgba(22,179,196,.5)} .fchip.is-empty{opacity:.5} .fchip-n{display:inline-grid;place-items:center;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:var(--accent-soft);color:var(--accent-ink);font-size:10.5px;font-weight:800} .fchip.is-active .fchip-n{background:rgba(255,255,255,.28);color:#fff} .fchip.reset{border-color:transparent;color:var(--muted);font-weight:700} .fchip.reset:hover{background:var(--danger-soft,#fdecec);color:var(--danger,#c0392b);border-color:transparent} /* v62 — бейдж «сколько отправить» в кнопке шестерёнки (частичная отправка) */ .gear-badge{display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 5px;margin-left:auto;border-radius:9px;background:var(--accent);color:#fff;font-size:11px;font-weight:800} .gear-item.is-done .gear-badge{background:var(--ok)} /* v63 — форма сотрудника: аккуратная сетка */ .emp-form{display:flex;flex-direction:column;gap:6px} .ef-section{padding:14px 0;border-top:1px solid var(--line)} .ef-section:first-child{padding-top:2px;border-top:none} .ef-cap{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--accent-ink);font-weight:800;margin-bottom:11px} /* стабильная 2-колоночная сетка (ровные ряды одинаковой высоты) */ .ef-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px;align-items:start} .ef-grid .full{grid-column:1 / -1} .ef-grid label{display:flex;flex-direction:column;gap:6px;font-size:11px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.03em;min-width:0} .ef-note{text-transform:none;font-weight:400;color:var(--muted);letter-spacing:0} /* единая высота полей ~40px, скругление, аккуратный фокус (наследует :root focus-ring) */ .emp-form input[type=text],.emp-form input[type=date],.emp-form select{height:40px;border-radius:var(--radius-sm);border:1.5px solid var(--line);background:#fbfcfd;width:100%;transition:border-color .14s,box-shadow .14s,background .14s} .emp-form input::placeholder{color:var(--muted);opacity:.85} /* «Должность»: select + кнопка ＋ в один ряд, кнопка не переносится */ .ef-inline{display:flex;gap:8px;align-items:stretch} .ef-inline select{flex:1 1 auto;min-width:0} .ef-inline .ef-add{flex:none;height:40px;width:40px;justify-content:center;padding:0;font-size:16px;line-height:1} /* «Ставка действует с»: поле даты + компактная иконка-подсказка «?» */ .ef-with-hint{display:flex;gap:8px;align-items:center} .ef-with-hint input[type=date]{flex:1 1 auto;min-width:0} .ef-help{flex:none;width:22px;height:22px;border-radius:50%;display:inline-grid;place-items:center;background:var(--accent-soft);color:var(--accent-ink);font-size:12px;font-weight:800;cursor:help;text-transform:none;user-select:none} .ef-help:hover,.ef-help:focus{background:var(--accent);color:#fff;outline:none} /* чекбоксы «Видит подразделения» — ровные чипы */ .ef-checks{display:flex;flex-wrap:wrap;gap:8px 14px;padding:4px 0 2px} .ef-check{flex-direction:row!important;align-items:center;gap:6px;text-transform:none;font-weight:500;font-size:12.5px;color:var(--ink);letter-spacing:0} .ef-check input{margin:0} /* история ставки */ .ef-history{margin-top:2px} .ef-subcap{font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:700;margin-bottom:6px} .ef-tags{display:flex;flex-wrap:wrap;gap:6px} /* чекбокс «Активен» — обычный ряд, не капс */ .ef-active{flex-direction:row!important;align-items:center;gap:9px;text-transform:none;letter-spacing:0} .ef-active input{margin:0} .ef-active span{font-weight:600;color:var(--ink);font-size:13px} /* кнопки внизу */ .ef-actions{display:flex;gap:10px;align-items:center;margin-top:18px;padding-top:16px;border-top:1px solid var(--line)} /* адаптив: узкий экран → 1 колонка */ @media (max-width:720px),(orientation:landscape) and (max-height:520px) and (max-width:1024px){ .ef-grid{grid-template-columns:1fr} } /* v64 — форма сотрудника: компактнее + мягче скругления + аккуратные кнопки (поверх v63) */ .panel:has(.emp-form){max-width:920px} .emp-form{gap:2px} .ef-section{padding:12px 0} .ef-section:first-child{padding-top:0} .ef-cap{font-size:10.5px;letter-spacing:.05em;color:var(--accent-ink);margin-bottom:9px;display:flex;align-items:center;gap:8px} .ef-cap::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--line),transparent)} .ef-grid{gap:9px 14px} .ef-grid label{gap:5px;font-size:10px;letter-spacing:.04em;color:var(--muted)} /* поля: компактнее (36px), мягкое скругление, чистый фон, приятный фокус */ .emp-form input[type=text],.emp-form input[type=date],.emp-form select{ height:36px;padding:0 11px;border-radius:10px;border:1px solid var(--line);background:#fff; font-size:13px;color:var(--ink);box-shadow:0 1px 1px rgba(22,50,63,.02)} .emp-form select{padding-right:28px;cursor:pointer} .emp-form input:hover,.emp-form select:hover{border-color:var(--line-strong)} .emp-form input:focus,.emp-form select:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)} .emp-form input::placeholder{color:var(--muted);opacity:.7} /* кнопка ＋ и иконка-«?» — под новую высоту 36 */ .ef-inline{gap:7px} .ef-inline .ef-add{height:36px;width:36px;border-radius:10px;font-size:15px;background:var(--accent-soft);border-color:transparent;color:var(--accent-ink)} .ef-inline .ef-add:hover{background:var(--accent);color:#fff} .ef-with-hint{gap:7px} .ef-help{width:20px;height:20px;font-size:11px} /* чекбоксы-подразделения → мягкие пилюли */ .ef-checks{gap:6px} .ef-check{padding:5px 10px;border:1px solid var(--line);border-radius:8px;background:#fff;font-size:12px;transition:border-color .12s,background .12s} .ef-check:hover{border-color:var(--accent);background:var(--accent-soft)} .ef-check:has(input:checked){border-color:var(--accent);background:var(--accent-soft);color:var(--accent-ink);font-weight:600} .ef-check input{accent-color:var(--accent)} /* история ставки — компактные чипы */ .ef-tags .tag{background:var(--accent-soft);color:var(--accent-ink);border-radius:8px;font-weight:600} /* креды-бокс — мягче */ .creds-box{border-radius:12px;padding:9px 12px} /* «Активен» → аккуратный переключаемый чип */ .ef-active{display:inline-flex;padding:7px 13px;border:1px solid var(--line);border-radius:10px;background:#fff;width:auto!important;gap:8px;cursor:pointer;transition:border-color .12s,background .12s} .ef-active:has(input:checked){border-color:var(--ok);background:var(--ok-soft)} .ef-active:has(input:checked) span{color:var(--ok)} .ef-active input{accent-color:var(--ok)} /* кнопки внизу — крупнее, скруглённее, с мягкой тенью у «Сохранить» */ .ef-actions{margin-top:14px;padding-top:14px;gap:8px} .ef-actions .btn{height:40px;padding:0 20px;border-radius:11px} .ef-actions .btn.primary{box-shadow:0 6px 16px -6px rgba(22,179,196,.5)} .ef-actions .btn.primary:hover{transform:translateY(-1px)} /* v65 — форма сотрудника: фирменная тема (карточки-секции, аватар, бирюзовые акценты) */ .emp-panel{position:relative;overflow:hidden} /* Форма сотрудника как модальное окно (сразу по центру, без скролла страницы) */ .emp-modal-ov{position:fixed;inset:0;background:rgba(22,50,63,.32);z-index:100;animation:empOvIn .16s ease} @keyframes empOvIn{from{opacity:0}to{opacity:1}} .emp-panel.emp-modal{position:fixed;z-index:101;top:50%;left:50%;transform:translate(-50%,-50%); width:min(920px,94vw);max-height:92vh;overflow:auto;box-shadow:0 24px 70px rgba(22,50,63,.28);animation:empModIn .18s cubic-bezier(.2,.8,.2,1)} @keyframes empModIn{from{opacity:0;transform:translate(-50%,-46%) scale(.98)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}} body.emp-modal-lock{overflow:hidden} .emp-modal .ef-head{position:relative} .emp-modal-x{position:absolute;top:-2px;right:-2px;width:34px;height:34px;border:none;background:transparent;color:var(--muted);font-size:19px;line-height:1;cursor:pointer;border-radius:9px;transition:background .12s,color .12s} .emp-modal-x:hover{background:var(--line);color:var(--ink)} /* Пагинация списка сотрудников */ .emp-pager{display:flex;align-items:center;gap:6px;margin:12px 2px 4px;flex-wrap:wrap} .emp-pager-info{font-size:12px;color:var(--muted);margin-right:8px} .emp-pager-b{min-width:32px;height:30px;padding:0 9px;border:1px solid var(--line);background:#fff;border-radius:8px;font:inherit;font-size:12.5px;color:var(--ink);cursor:pointer;transition:border-color .12s,background .12s} .emp-pager-b:hover:not(:disabled){border-color:var(--accent);background:var(--accent-soft)} .emp-pager-b.is-cur{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:700} .emp-pager-b:disabled{opacity:.4;cursor:default} /* Направление без настроенной ведомости (плейсхолдер для админа) */ .dept-unconf .duc-body{display:flex;align-items:center;gap:16px;padding:20px 22px;background:var(--panel,#fff);border:1px dashed var(--line);border-radius:12px} .dept-unconf .duc-ico{font-size:26px;opacity:.8} .dept-unconf .duc-txt{display:flex;flex-direction:column;gap:3px;flex:1} .dept-unconf .duc-txt b{font-size:14px;color:var(--ink)} .dept-unconf .duc-txt span{font-size:12.5px;color:var(--muted);line-height:1.45} /* чипы-управляющие в панели категорий */ .cat-mgrs{display:flex;flex-wrap:wrap;gap:6px} .cat-mgr-chip{border:1.5px solid var(--line);background:#fff;border-radius:20px;padding:4px 12px;font:inherit;font-size:12.5px;font-weight:600;color:var(--ink-soft);cursor:pointer;transition:all .12s} .cat-mgr-chip:hover{border-color:var(--accent)} .cat-mgr-chip.on{background:var(--accent);border-color:var(--accent);color:#fff} .cat-mgr-chip.on::before{content:"✓ "} .emp-panel::before{content:"";position:absolute;top:-70px;right:-50px;width:220px;height:220px;border-radius:50%; background:radial-gradient(circle,rgba(22,179,196,.10),transparent 70%);pointer-events:none} /* шапка формы: аватар + имя + чип роли */ .ef-head{display:flex;align-items:center;gap:13px;margin-bottom:16px;position:relative} .ef-avatar{flex:none;width:46px;height:46px;border-radius:14px;display:grid;place-items:center; background:linear-gradient(150deg,#19c7b4,var(--accent-ink));color:#fff;font-weight:800;font-size:17px; box-shadow:0 8px 20px -6px rgba(16,190,168,.5);font-family:'Unbounded','Inter',sans-serif} .ef-head-txt h2{margin:0;font-size:19px;line-height:1.1} .ef-head-sub{font-size:12px;color:var(--muted);margin-top:3px;display:flex;align-items:center;gap:8px} .ef-role-chip{display:inline-flex;align-items:center;padding:2px 9px;border-radius:8px;background:var(--accent-soft); color:var(--accent-ink);font-size:11px;font-weight:700;letter-spacing:.01em} /* секции → мягкие карточки */ .emp-form{gap:11px} .ef-section{padding:14px 16px;border:1px solid var(--line);border-radius:14px; background:linear-gradient(180deg,#fbfeff,#fff);box-shadow:0 1px 2px rgba(22,50,63,.03)} .ef-section:first-child{padding-top:14px} /* капс-заголовок секции с бирюзовой точкой, без линии */ .ef-cap{margin-bottom:12px;color:var(--accent-ink);font-size:10.5px;letter-spacing:.06em} .ef-cap::after{display:none} .ef-cap::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--accent); box-shadow:0 0 0 3px var(--accent-soft);flex:none} /* поля — чуть теплее фон, фокус ярче */ .emp-form input[type=text],.emp-form input[type=date],.emp-form select{background:#fff;border-color:var(--line)} .emp-form input:focus,.emp-form select:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)} /* кнопки внизу: «Сохранить» — градиент */ .ef-actions{border-top:none;padding-top:6px;margin-top:4px} .ef-actions .btn.primary{background:linear-gradient(135deg,#19c7b4,var(--accent-ink));border-color:transparent; box-shadow:0 8px 20px -8px rgba(16,190,168,.55)} .ef-actions .btn.primary:hover{filter:brightness(1.04);transform:translateY(-1px)} .ef-actions .btn.ghost{color:var(--muted)} /* v66 — карточка сотрудника: плотнее и РОВНО (ровная сетка направлений, компактные секции/поля) */ .emp-panel.emp-modal{width:min(880px,94vw)} .ef-head{margin-bottom:12px;gap:11px} .ef-avatar{width:42px;height:42px;border-radius:12px;font-size:16px;box-shadow:0 6px 16px -6px rgba(16,190,168,.5)} .ef-head-txt h2{font-size:17.5px} .emp-form{gap:9px} .ef-section{padding:12px 14px;border-radius:12px} .ef-section:first-child{padding-top:12px} .ef-cap{margin-bottom:10px} .ef-grid{gap:9px 12px} .emp-form input[type=text],.emp-form input[type=date],.emp-form select{height:34px;font-size:12.5px} /* РОВНАЯ сетка направлений — одинаковые колонки вместо рваного переноса; имя в одну строку с многоточием (полное — в title) */ .ef-checks{display:grid;grid-template-columns:repeat(auto-fill,minmax(188px,1fr));gap:6px;padding:2px 0 0} .ef-check{display:flex;align-items:center;gap:7px;min-width:0;padding:6px 10px;border-radius:9px;font-size:12px;line-height:1.25} .ef-checks .ef-check>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0} /* многоточие ТОЛЬКО для сетки направлений */ .ef-check input{flex:none;margin:0} /* переводы по периодам + кнопки — под новую высоту */ .dh-add input,.dh-add select{height:34px} .dh-row{padding:5px 10px;font-size:12px} .ef-actions .btn{height:38px} /* v67 — доводка нижней части карточки до конца: month-инпуты, полноширинные чекбоксы-плашки, ставка */ .emp-form input[type=month]{height:34px;padding:0 11px;border-radius:10px;border:1px solid var(--line);background:#fff;font-size:12.5px;color:var(--ink);width:100%;font-family:inherit} .emp-form input[type=month]:hover{border-color:var(--line-strong)} .emp-form input[type=month]:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)} /* полноширинный чекбокс (Фиксированный оклад / доступ к вкладке) — аккуратная плашка, подпись переносится (без обрезки) */ .ef-check.full{align-items:flex-start;padding:9px 12px;border:1px solid var(--line);border-radius:10px;background:linear-gradient(180deg,#fbfeff,#fff);text-transform:none;font-weight:600} .ef-check.full:has(input:checked){border-color:var(--accent);background:var(--accent-soft)} .ef-check.full>span{white-space:normal;overflow:visible;line-height:1.4} .ef-check.full input{margin-top:2px} /* блок «Ставка» — аккуратная плашка с кнопкой */ .ef-rate{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:11px 13px;border:1px solid var(--line);border-radius:11px;background:var(--accent-soft)} .ef-rate-cap{font-size:10px;text-transform:uppercase;letter-spacing:.05em;color:var(--accent-ink);font-weight:800;display:block;margin-bottom:2px} .ef-rate-vals{font-size:13.5px;color:var(--ink)} .ef-rate-btn{flex:none;height:34px} /* мини-таблица истории (трудоустройство/ставка) — компактнее */ .ef-section .tbl{font-size:12px} .ef-subcap{font-size:10px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:800} /* v66 — авансы: раскрытие строки + журнал действий (компактный, референс «действия по ячейке») */ .adv-tbl .adv-exp-h,.adv-tbl .adv-exp-c{width:34px;text-align:center;padding-left:6px;padding-right:2px} .adv-exp-b{width:24px;height:24px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink-soft); display:inline-grid;place-items:center;cursor:pointer;transition:transform .16s ease,background .12s,border-color .12s,color .12s} .adv-exp-b:hover{background:var(--accent-soft);border-color:var(--accent);color:var(--accent-ink)} .adv-exp-b.is-open{transform:rotate(180deg);background:var(--accent);border-color:var(--accent);color:#fff} .adv-exp-b.is-empty{opacity:.4} .adv-row.is-open>td{background:var(--accent-soft)} .adv-det>td{padding:0!important;background:#fbfdfe;border-bottom:1px solid var(--line)} .adv-det-box{padding:12px 16px 14px;display:flex;flex-direction:column;gap:12px} /* закреплённый сверху последний комментарий */ .adv-lastcmt{background:linear-gradient(180deg,#fff,#f7fbfc);border:1px solid var(--line);border-left:3px solid var(--accent); border-radius:10px;padding:9px 13px} .adv-lastcmt-cap{font-size:9.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--accent-ink);font-weight:800;margin-bottom:3px} .adv-lastcmt-txt{font-size:13px;color:var(--ink);font-weight:600;line-height:1.4} .adv-lastcmt-meta{font-size:11px;color:var(--muted);margin-top:3px} /* журнал действий: компактные строки с цветной точкой */ .adv-acts-cap{font-size:9.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:800;margin-bottom:7px} .adv-act-item{display:flex;align-items:baseline;gap:8px;padding:5px 0;border-top:1px dashed var(--line);font-size:12.5px} .adv-act-item:first-of-type{border-top:none} .adv-act-dot{flex:none;width:8px;height:8px;border-radius:50%;background:var(--muted);align-self:center} .adv-act-dot.k-submit{background:var(--warn)} .adv-act-dot.k-approve{background:var(--ok)} .adv-act-dot.k-paid{background:var(--ok)} .adv-act-dot.k-reject{background:var(--danger,#c0392b)} .adv-act-dot.k-recall{background:var(--ink-soft)} .adv-act-dot.k-comment{background:var(--accent)} .adv-act-kind{color:var(--ink);font-weight:600} .adv-act-txt{font-weight:400;color:var(--ink-soft)} .adv-act-meta{margin-left:auto;color:var(--muted);font-size:11px;white-space:nowrap;padding-left:10px} .adv-act-empty{font-size:12px;color:var(--muted)} @media (max-width:640px),(orientation:landscape) and (max-height:520px) and (max-width:1024px){.adv-act-item{flex-wrap:wrap}.adv-act-meta{margin-left:16px}} /* v67 — изоляция ячеек по фильтру + авансовая группа + тултип последнего комментария */ /* при активном фильтре несовпавшие ячейки гаснут, совпавшие — на месте и «всплывают» */ body[data-fmatch] .mcell[data-status]{opacity:.22;filter:grayscale(.55);transition:opacity .15s,filter .15s} body[data-fmatch] .mcell[data-status]:hover{opacity:.8;filter:none} body[data-fmatch="draft"] .mcell[data-status="draft"], body[data-fmatch="s_head"] .mcell[data-status="s_head"], body[data-fmatch="s_manager"] .mcell[data-status="s_manager"], body[data-fmatch="approved"] .mcell[data-status="approved"], body[data-fmatch="rejected"] .mcell[data-status="rejected"], body[data-fmatch="adv-draft"] .mcell[data-advstate="draft"], body[data-fmatch="adv-unpaid"] .mcell[data-advstate="unpaid"], body[data-fmatch="adv-paid"] .mcell[data-advstate="paid"]{opacity:1!important;filter:none!important;position:relative;z-index:1; box-shadow:0 0 0 2px var(--accent-soft),0 3px 10px -2px rgba(22,179,196,.3)} /* авансовая группа в панели фильтров */ .fbar-div{width:1px;height:20px;background:var(--line-strong);margin:0 3px;display:inline-block} .fbar-cap-adv{color:var(--accent-ink);margin-right:0} .fchip-adv{border-style:dashed} .fchip-adv.is-active{border-style:solid} /* чипы «Оформление» — цветная точка типа (ОФ синий · Самозанятый бирюза · ИП фиолет · Не указан оранж) */ .etype-chip .et-dot{width:8px;height:8px;border-radius:50%;flex:none;background:var(--et-c,#9aa7b0)} .etype-chip.et-of{--et-c:#2f80b5} .etype-chip.et-sz{--et-c:#12a594} .etype-chip.et-ip{--et-c:#7c3aed} .etype-chip.et-none{--et-c:#e6890f} .etype-chip.et-none:not(.is-active){border-color:#f0cf9a;background:#fdf6ec} .etype-chip.is-active .et-dot{background:#fff} /* #1 строка активных фильтров */ /* #6 облегчённая строка активных фильтров: без «кричащей» рамки — тонкий акцент слева + мягкий фон */ .active-filters{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:2px 0 12px;padding:6px 12px 6px 11px;background:var(--accent-soft,#eafaf6);border:none;border-left:3px solid var(--accent,#12a594);border-radius:4px 10px 10px 4px} .af-cap{font-size:10.5px;font-weight:800;color:var(--accent-ink,#0d7a6b);text-transform:uppercase;letter-spacing:.04em} .af-chip{display:inline-flex;align-items:center;gap:7px;padding:5px 10px;border-radius:9px;background:#fff;border:1px solid var(--line,#e3e9ee);color:var(--ink);font-size:12.5px;font-weight:600;text-decoration:none;transition:border-color .15s,color .15s} .af-chip:hover{background:var(--danger-soft,#fdecec);border-color:var(--danger,#c0392b);color:var(--danger,#c0392b)} .af-chip .af-x{font-size:11px;font-weight:800;opacity:.6} .af-chip:hover .af-x{opacity:1} .af-clear{margin-left:auto;font-size:12px;font-weight:800;color:var(--muted);text-decoration:none;padding:4px 8px;border-radius:8px} .af-clear:hover{background:var(--danger-soft,#fdecec);color:var(--danger,#c0392b)} /* #4 умный пустой экран */ .empty-state .es-title{font-size:14px;font-weight:700;margin-bottom:10px;color:var(--ink)} .empty-state .es-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:center} .es-btn{display:inline-flex;align-items:center;padding:8px 14px;border-radius:10px;background:var(--accent,#12a594);color:#fff;font-size:12.5px;font-weight:700;text-decoration:none;border:1px solid var(--accent,#12a594)} .es-btn:hover{background:var(--accent-ink,#0d7a6b)} .es-btn.ghost{background:#fff;color:var(--muted);border-color:var(--line)} .es-btn.ghost:hover{background:var(--panel);color:var(--ink);border-color:var(--accent)} /* тултип «последний комментарий» при наведении на ячейку */ #cellTip{position:fixed;z-index:220;max-width:280px;background:#1f2c38;color:#fff;font-size:12px;line-height:1.45; padding:8px 11px;border-radius:9px;box-shadow:0 10px 28px rgba(22,50,63,.3);pointer-events:none;opacity:0;transform:translateY(3px); transition:opacity .12s,transform .12s;white-space:normal} #cellTip.show{opacity:1;transform:translateY(0)} #cellTip .ct-cap{font-size:9px;text-transform:uppercase;letter-spacing:.05em;color:#8fd6df;font-weight:800;margin-bottom:3px} /* v68 — ставка через поп-ап (виджет в форме + модалка изменения) */ .ef-rate{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap; border:1px solid var(--line);border-radius:12px;padding:11px 14px;background:linear-gradient(180deg,#fbfeff,#fff)} .ef-rate-view{display:flex;flex-direction:column;gap:3px;min-width:0} .ef-rate-cap{font-size:9.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--accent-ink);font-weight:800} .ef-rate-vals{font-size:14px;color:var(--ink);font-weight:600;display:flex;align-items:center;gap:6px;flex-wrap:wrap} .ef-rate-vals b{font-family:'Unbounded','Inter',sans-serif;font-size:15px;font-variant-numeric:tabular-nums} .ef-rate-sep{color:var(--muted)} .ef-rate-histn{font-size:10.5px;font-weight:700;color:var(--accent-ink);background:var(--accent-soft);border-radius:7px;padding:2px 8px} .ef-rate-view.is-changed .ef-rate-vals b{color:var(--accent-ink)} .ef-rate-btn{flex:none;height:34px;border-radius:9px;background:var(--accent-soft);border-color:transparent;color:var(--accent-ink);font-weight:700} .ef-rate-btn:hover{background:var(--accent);color:#fff} /* модалка */ .rate-pop-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px 12px} .rate-pop-grid .full{grid-column:1/-1} .rate-pop-grid label{display:flex;flex-direction:column;gap:5px;font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:700} .rate-pop-grid input{height:38px;padding:0 11px;border:1px solid var(--line);border-radius:10px;background:#fff;font-size:13px;color:var(--ink)} .rate-pop-grid input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)} .rate-pop-note{font-size:11.5px;line-height:1.5;color:var(--ink-soft);background:var(--warn-soft,#fbf1de);border-radius:9px;padding:8px 11px;margin:11px 0} .rate-pop-hist{margin-bottom:12px} .rate-hist-list{display:flex;flex-direction:column;gap:5px;max-height:150px;overflow:auto} .rate-hist-item{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:12.5px; border:1px solid var(--line);border-radius:9px;padding:6px 11px;background:#fbfdfe} .rate-hist-from{color:var(--muted);font-weight:600} .rate-hist-val{color:var(--ink);font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap} .rate-pop-act{display:flex;gap:10px;margin-top:4px} /* v69 — раскрытие детализации вычетов у сотрудника (только заполненное) */ .ml-ded-head.has{cursor:pointer;border-radius:8px;transition:background .12s} .ml-ded-head.has:hover{background:var(--accent-soft)} .ml-ded-head .ml-ded-car{display:inline-block;vertical-align:-1px;margin-right:4px;color:var(--muted);transition:transform .16s ease} .ml-ded-head.is-open .ml-ded-car{transform:rotate(180deg);color:var(--accent-ink)} .ml-ded-list{margin:2px 0 4px;padding:6px 8px;background:var(--bg,#eef1f5);border-radius:9px;display:flex;flex-direction:column;gap:2px} .ml-ded-item{display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:12px;padding:3px 4px;color:var(--ink-soft)} .ml-ded-item span{color:var(--ink-soft)} .ml-ded-item b{font-variant-numeric:tabular-nums} /* v70 — согласованные ячейки: зелёные ПОЛОСКИ в ячейке (как серые frozen, только зелёные) вместо рамки */ .mcell.st-approved{ background:repeating-linear-gradient(45deg,#eafaf3,#eafaf3 7px,#d6f0e3 7px,#d6f0e3 14px)!important; box-shadow:none!important} .day-row .acell.day-appr, .day-row .acell.day-appr.day-out{ background:repeating-linear-gradient(45deg,#eafaf3,#eafaf3 7px,#d6f0e3 7px,#d6f0e3 14px)!important; box-shadow:none!important} .day-row .acell.day-appr .day-mark{color:var(--ok,#25b07a)} /* если ячейка и согласована, и заморожена — зелёные полоски (не серые). НО оплаченный аванс/бонус — фиолетовая заливка (исключаем). */ .mcell.st-approved.cell-frozen:not(.adv-paid):not(.cell-paid){background:repeating-linear-gradient(45deg,#eafaf3,#eafaf3 7px,#d6f0e3 7px,#d6f0e3 14px)!important} /* тред комментариев: кнопка «Показать все / Свернуть» + свёрнутая часть */ .cmt-thread-toggle{display:block;width:100%;text-align:left;background:var(--accent-soft);border:none;border-radius:8px; color:var(--accent-ink);font-size:11.5px;font-weight:700;padding:6px 10px;cursor:pointer;margin-bottom:6px} .cmt-thread-toggle:hover{background:var(--accent);color:#fff} .cmt-thread-earlier{display:flex;flex-direction:column;gap:6px;margin-bottom:6px} /* v71 — фикс: свёрнутая часть треда действительно скрывается (hidden перебивался display:flex) */ .cmt-thread-earlier[hidden]{display:none!important} /* v72 — у сотрудника: дни, заблокированные руководителем/управляющим — замок + приглушённый вид */ .ml-day.ml-day-locked{cursor:default;box-shadow:inset 0 0 0 2px #94a3b8} .ml-day.ml-day-locked.editable:hover,.ml-day.ml-day-locked:hover{border-color:var(--line)} .ml-day.ml-day-locked.is-out{background:#eef2f5;border-color:#cbd5e1;color:var(--ink)} .ml-day.ml-day-locked.is-out .ml-day-wd{color:var(--muted)} .ml-day-lock{position:absolute;top:2px;right:3px;color:#64748b;line-height:1;pointer-events:none} .ml-day-lock svg{display:block} .ml-day.ml-day-locked.is-out .ml-day-lock{color:#475569} /* v73 — тултип: скрываем капу когда её нет (data-tip показывает только текст) */ #cellTip .ct-cap[hidden]{display:none} /* уголок-значок комментария — в ЛЕВЫЙ НИЖНИЙ угол (замок теперь в правом нижнем, ⋯ вверху справа) */ .mcell.has-comment::before{top:0;bottom:0;left:0;right:auto;border:0;width:3px;background:var(--cmt-c,#9aa0a6)} /* v75 — авто-ячейка «налог портал» (без замка) + вкладка «Налоги» в админке */ .mcell.cell-auto{background:#f6f8fa;color:var(--ink-soft)} .mcell.cell-auto .portal-val{font-variant-numeric:tabular-nums} .tax-cur{margin:2px 0 14px;font-size:13.5px;color:var(--ink-soft)} .tax-cur-val{color:var(--accent-ink);font-family:'Unbounded','Inter',sans-serif} .tax-form{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;background:linear-gradient(180deg,#fbfeff,#fff);border:1px solid var(--line);border-radius:12px;padding:14px 16px;max-width:520px} .tax-form label{display:flex;flex-direction:column;gap:5px;font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:700} .tax-form input{height:38px;padding:0 11px;border:1px solid var(--line);border-radius:10px;background:#fff;font-size:13px;min-width:150px} .tax-form input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)} .tax-form .btn{height:38px} .tax-hist{margin-top:16px} /* v76 — строка «Оплата»: одна строка на состояние (не увеличивать ячейку) + кнопка отмены */ .pay-act{flex-wrap:nowrap!important;white-space:nowrap} .pay-b.undo{color:var(--muted);padding:2px 6px;font-size:12px;line-height:1.3} .pay-b.undo:hover{color:var(--accent-ink);background:var(--accent-soft);border-color:var(--accent)} .pcell.pay .pay-chip{max-width:none} /* v77 — согласование: компактнее */ /* — шапка: плотнее, меньше вертикали */ .rv-head{gap:12px;margin-bottom:2px} .rv-head-ic{width:38px;height:38px;border-radius:11px;font-size:18px} .rv-head h1{font-size:19px;line-height:1.15} .rv-head .muted{font-size:12px;margin-top:1px} /* — общий вертикальный ритм: убрать лишние отступы между блоками */ .rv-chips{gap:6px;margin:12px 0 8px} .flt-bar{gap:6px;margin-bottom:8px} .rv-bulk{margin-bottom:8px} /* — чип-фильтры: ниже, тоньше, компактный счётчик */ .rv-chip{padding:5px 7px 5px 12px;font-size:12px;font-weight:600;gap:6px;border-radius:999px} .rv-chip .rv-n{min-width:17px;height:17px;padding:0 5px;font-size:10.5px;font-weight:700} .rv-chip:hover{transform:none;border-color:var(--accent);color:var(--accent-ink)} .rv-chip.is-active{font-weight:650} .rv-chip.is-active:hover{color:#fff} .rv-chip.is-zero{font-weight:500} .rv-chip-div{height:16px;margin:0 2px} /* — КТО/ФИО: тот же рост и вид, что у чипов */ .flt-dd-btn{padding:5px 11px;font-size:12px;font-weight:600;gap:6px} .flt-dd-cap{font-size:9.5px} .flt-dd-car{font-size:9px} .flt-clear{font-size:11.5px} /* — панель массовых действий: компактнее и ровный ряд */ .rv-bulk{gap:6px;padding:5px 6px 5px 13px;border-radius:999px} .rv-bulk-cnt{font-size:12px;margin-right:2px} .rv-bulk-txt{height:30px;padding:0 12px;font-size:12px;border-radius:8px;gap:5px} .rv-bulk-b{width:30px;height:30px;border-radius:8px;font-size:12.5px} /* — таблица: строки чуть ниже, ячейки компактнее */ .rv-tbl thead th{padding:8px 12px;font-size:10px} .rv-row td{padding:8px 12px;font-size:12.5px} .rv-emp-tbl tbody tr.rv-emp>td{padding-top:8px;padding-bottom:8px} .rv-cell-tbl td{padding:5px 11px;font-size:12px} .rv-cmt-txt{font-size:11px;padding:2px 7px;max-width:200px} /* — статус-чипы мельче, действия аккуратнее */ .rev-line-st{font-size:10.5px;padding:2px 9px;gap:5px} .rev-round{width:28px;height:28px;font-size:12.5px;border-radius:8px} .rv-act{gap:5px} /* — футер компактнее */ .rv-foot{padding:8px 16px;font-size:12px} /* — секция авансов: меньше вертикального разрыва */ .rv-section{margin:16px 0 8px;font-size:13px} .rv-adv-block{margin-top:18px} /* v78 — баннер статуса оплаты у сотрудника (заметный) */ .ml-paid{display:flex;flex-direction:column;gap:2px;padding:12px 14px;border-radius:12px;margin-bottom:12px; background:linear-gradient(135deg,var(--ok-soft,#e7f6ef),#f2fbf6);border:1px solid #bfe6d3} .ml-paid b{font-size:15px;color:var(--ok,#25b07a);font-family:'Unbounded','Inter',sans-serif} .ml-paid span{font-size:11.5px;color:var(--ink-soft)} .ml-paid.pend{background:linear-gradient(135deg,var(--warn-soft,#fbf1de),#fdf8ee);border-color:#f0dcae} .ml-paid.pend b{color:#b9821f} .ml-paid.rej{background:linear-gradient(135deg,var(--danger-soft,#fdecec),#fef4f4);border-color:#f3c4c4} .ml-paid.rej b{color:var(--danger,#c0392b)} /* v79 — фин-раздел согласования: полировка */ /* Раздел «Согласование · оплата» переиспользует классы rv-* и наследует компактность v77. Здесь — только доводка того, что специфично для фин-очереди. */ /* — сводка «К оплате» в шапке рядом с заголовком (справа) */ .rv-head{align-items:center} .rv-fin-sum{margin-left:auto;display:flex;flex-direction:column;align-items:flex-end;gap:1px; padding:5px 12px;border-radius:11px;background:var(--accent-soft);border:1px solid var(--accent-line,#bfe6de);white-space:nowrap} .rv-fin-sum-cap{font-size:9.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)} .rv-fin-sum b{font-size:14px;font-variant-numeric:tabular-nums;color:var(--accent-ink);letter-spacing:-.01em;line-height:1.1} /* — кнопка «↗ в ведомость»: нейтрально-акцентная, аккуратный якорь без подчёркивания */ .rev-round.rv-exp-b{border-color:var(--line);color:var(--muted);background:#fff;text-decoration:none;font-weight:700} .rev-round.rv-exp-b:hover{border-color:var(--accent);color:var(--accent);background:var(--accent-soft); box-shadow:0 4px 10px rgba(20,160,150,.14);transform:translateY(-1px)} /* — кнопка «↩ отменить/вернуть на оплату» в фин-очереди: тёплый нейтрал (как recall в согласовании) */ .rev-round.recall{border-color:var(--line);color:#8a6d1f;background:#fff;font-weight:800;text-decoration:none} .rev-round.recall:hover{background:#fdf6e3;border-color:#e6c86a;color:#8a6d1f; box-shadow:0 4px 10px rgba(200,168,80,.16);transform:translateY(-1px)} /* — статус-чипы стадий оплаты (скоуп .rv-fin-tbl): ⏳ На оплате (тёплый/ожидание) · ✓ Оплачено (зелёный) · ↩ Отклонено (красный). Скоуп важен: st-s_manager в общем согласовании = «У управляющего» (синий) — его не трогаем. */ .rv-fin-tbl .rev-line-st.st-s_manager{color:#8a6d1f;background:var(--stage-head-soft,#fdf6e3)} .rv-fin-tbl .rev-line-st.st-approved{color:#0d7a6b;background:var(--ok-soft)} .rv-fin-tbl .rev-line-st.st-rejected{color:#b23c3c;background:var(--danger-soft)} /* — колонка «Действия» в фин-очереди: ровный ряд по правому краю, одинаковые кнопки */ .rv-fin-tbl .rv-act{gap:6px;justify-content:flex-end} /* — комментарий-причина оплаты: тот же вид, что в согласовании */ .rv-cmt-txt{color:var(--info);background:var(--info-soft)} /* — футер фин-очереди: «На оплате» акцентной суммой (как «Итого» в согласовании) */ .rv-foot-total b{color:var(--accent-ink)} /* — пустое состояние: наследует .rev-empty, дополнительной вертикали не добавляем */ /* v80 — аванс: жёлтые полоски у отправленного + фильтр «Аванс» скрывает всё, кроме авансовых строк */ /* отправлен на согласование (s_head/s_manager) → жёлтые диагональные полоски */ .mcell[data-isadv="1"].st-s_head, .mcell[data-isadv="1"].st-s_manager{ background:repeating-linear-gradient(45deg,#fdf6e3,#fdf6e3 7px,#f6e7bf 7px,#f6e7bf 14px)!important} /* при активном фильтре «Аванс …» — в матрице видны только авансовые строки + шапка с сотрудниками */ body[data-fmatch^="adv-"] .ledger-table tbody tr:not(.avans-row):not(.av-status-row){display:none} body[data-fmatch^="adv-"] .avans-row .mcell{opacity:1!important;filter:none!important} /* v81→фикс: полностью ОПЛАЧЕННЫЙ аванс — ФИОЛЕТОВАЯ заливка (было зелёное — конфликтовало с v82 ниже) */ .mcell.adv-paid{background:#d8c8f5!important;box-shadow:none!important} .mcell.adv-paid .cell-paycmt{color:#5b3fc4} /* v82 — ЕДИНАЯ цветовая логика по стадии (дни + авансы): полоски→сплошной→фиолетовый */ /* --- ДНИ (ведомость) --- */ /* в работе / на согласовании (выход отмечен, не согласован управляющим) → зелёные ПОЛОСКИ */ .day-row .acell.day-out{background:repeating-linear-gradient(45deg,#eafaf3,#eafaf3 7px,#d1efe0 7px,#d1efe0 14px)!important;box-shadow:none!important} .day-row .acell.day-out .day-mark{color:var(--ok,#25b07a)} /* согласовано управляющим (approved) → СПЛОШНОЙ зелёный */ .day-row .acell.day-out.day-appr{background:#c7ecd9!important} /* оплачено фин-блоком → ФИОЛЕТОВЫЙ */ .day-row .acell.day-out.day-paid{background:#d8c8f5!important;box-shadow:none!important} .day-row .acell.day-out.day-paid .day-mark{color:#5b3fc4} /* --- АВАНСЫ (та же логика) --- */ .mcell[data-isadv="1"].st-s_head, .mcell[data-isadv="1"].st-s_manager{background:repeating-linear-gradient(45deg,#eafaf3,#eafaf3 7px,#d1efe0 7px,#d1efe0 14px)!important;box-shadow:none!important} .mcell[data-isadv="1"].st-approved:not(.adv-paid){background:#c7ecd9!important;box-shadow:none!important} .mcell.adv-paid{background:#d8c8f5!important;box-shadow:none!important} .mcell.adv-paid .cell-paycmt{color:#5b3fc4} /* --- СОТРУДНИК (Моя ведомость) дни: те же три стадии --- */ .ml-day.is-out{background:repeating-linear-gradient(45deg,#eafaf3,#eafaf3 7px,#d1efe0 7px,#d1efe0 14px)!important;border-color:#bfe6d3!important;color:var(--ink)!important} .ml-day.is-out .ml-day-wd{color:var(--ink-soft)!important} .ml-day.is-out.ml-day-appr{background:#c7ecd9!important} .ml-day.is-out.ml-day-paid{background:#d8c8f5!important;border-color:#c3aef0!important;color:#3f2a8f!important} /* v82b — легенда цветов ячеек (все роли) */ .color-legend{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin:2px 0 14px;padding:9px 14px; background:var(--panel,#fff);border:1px solid var(--line);border-radius:12px;font-size:11.5px;color:var(--ink-soft)} .color-legend .cl-cap{font-weight:800;font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted)} .color-legend .cl-item{display:inline-flex;align-items:center;gap:7px;font-weight:600} .color-legend .cl-sw{width:22px;height:15px;border-radius:5px;border:1px solid rgba(22,50,63,.12);flex:none} .cl-sw.cl-work{background:repeating-linear-gradient(45deg,#eafaf3,#eafaf3 4px,#d1efe0 4px,#d1efe0 8px)} /* swatch'и совпадают с цветами реальных ячеек ведомости */ .cl-sw.cl-head{background:var(--stage-head-soft,#fdf3d9);border-color:var(--stage-head-line,#ecd9a3)} .cl-sw.cl-mgr{background:var(--stage-mgr-soft,#e7f1fa);border-color:var(--stage-mgr-line,#c4ddf0)} .cl-sw.cl-appr{background:var(--stage-ok-soft,#c7ecd9);border-color:var(--stage-ok-line,#a9dcc4)} .cl-sw.cl-rej{background:var(--stage-rej-soft,#fdecec);border-color:#e07a86} .cl-sw.cl-paid{background:#d8c8f5;border-color:#c3aef0} .cl-sw.cl-advpaid{background:#fff;box-shadow:inset 0 0 0 2px var(--ok,#12a594);display:inline-grid;place-items:center;font-size:9px;font-weight:800;color:#0d7a6b} .cl-sw.cl-frozen{background:repeating-linear-gradient(45deg,#f4f6f8,#f4f6f8 6px,#eceff2 6px,#eceff2 12px)} /* v82c — авансы в «Моей ведомости»: три стадии как в общей ведомости */ .ml-av-grid.av-sent{background:repeating-linear-gradient(45deg,#eafaf3,#eafaf3 7px,#d1efe0 7px,#d1efe0 14px)!important} .ml-av-grid.av-appr{background:#c7ecd9!important} .ml-av-grid.av-paidfin{background:#d8c8f5!important;box-shadow:none!important} .mcell.adv-paid::after{color:#5b3fc4!important} /* v83 — верхняя кнопка «Отправить управляющему» + модалка предупреждения (бонусы / ПЛАН 135%) */ .led-send-top{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;font-weight:700} .led-send-top .lst-arr{opacity:.85;font-weight:800} .led-send-top .lst-n{display:inline-flex;align-items:center;justify-content:center;min-width:19px;height:19px;padding:0 5px; border-radius:9px;background:rgba(255,255,255,.24);font-size:11.5px;font-weight:800} .send-warn-modal{position:fixed;inset:0;z-index:900;display:flex;align-items:center;justify-content:center; background:rgba(20,34,42,.34);backdrop-filter:blur(2px);padding:20px} .send-warn-modal[hidden]{display:none!important} .swm-card{width:min(480px,94vw);background:var(--panel,#fff);border:1px solid var(--line);border-radius:16px; box-shadow:0 24px 60px -18px rgba(20,40,50,.4);overflow:hidden;animation:swmIn .18s cubic-bezier(.4,0,.2,1)} @keyframes swmIn{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}} .swm-head{display:flex;align-items:center;gap:10px;padding:15px 18px;font-size:15px; background:#fbf3e3;border-bottom:1px solid #f0e0bf;color:#8a6412} .swm-head .swm-ic{font-size:17px} .swm-body{padding:16px 18px;display:flex;flex-direction:column;gap:12px} .swm-lead{margin:0;font-size:13px;color:var(--ink-soft)} .swm-grp{background:var(--soft,#f6f8fa);border:1px solid var(--line);border-radius:11px;padding:10px 12px} .swm-grp-t{display:flex;align-items:center;gap:7px;font-weight:800;font-size:12.5px;color:var(--ink);margin-bottom:4px} .swm-dot{width:9px;height:9px;border-radius:50%;flex:none} .swm-dot.b{background:#e0a52a}.swm-dot.p{background:#6e56d6} .swm-names{font-size:12px;color:var(--ink-soft);line-height:1.5} .swm-foot{display:flex;justify-content:flex-end;gap:9px;padding:13px 18px;border-top:1px solid var(--line);background:var(--soft,#fafbfc)} .swm-head .swm-x{margin-left:auto;border:0;background:none;color:#a9863a;font-size:20px;line-height:1;cursor:pointer;padding:0 2px;opacity:.7} .swm-head .swm-x:hover{opacity:1} /* заполнить-и-отправить: широкая карта, компактные поля ввода прямо в окне */ .sfill-modal .swm-card{width:min(560px,95vw)} .sfill-modal .swm-body{max-height:min(64vh,560px);overflow:auto} .sfill-bulk{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:9px 11px;background:#f2f7f6;border:1px solid var(--line);border-radius:10px} .sfill-bulk .sfill-lbl{font-weight:800;font-size:12px} .sfill-list{display:flex;flex-direction:column;gap:9px} .sfill-card{background:var(--soft,#f6f8fa);border:1px solid var(--line);border-radius:11px;padding:10px 12px} .sfill-name{font-weight:800;font-size:13px;color:var(--ink);margin-bottom:7px} .sfill-field{display:flex;align-items:center;gap:9px;margin-top:6px} /* «Компенсация налогов» обязательна: при попытке отправить без Да/Нет поле подёргивается как ошибка (мягко, в тёплом тоне) */ .sfill-plan.sfill-shake{animation:sfillShake .45s cubic-bezier(.36,.07,.19,.97) both;border-radius:8px} @keyframes sfillShake{ 0%,100%{transform:translateX(0);box-shadow:0 0 0 0 transparent} 10%,30%,50%,70%{transform:translateX(-4px);box-shadow:0 0 0 2px var(--warn-soft,#fbf1de)} 20%,40%,60%,80%{transform:translateX(4px);box-shadow:0 0 0 2px var(--warn-soft,#fbf1de)} } .sfill-plan.sfill-shake .sfill-lbl{color:var(--warn,#c98a00);font-weight:700} /* КОМПАКТНОЕ окно «Отправить управляющему»: шире, мультиколонки, поиск, низкие строки */ .sfill-modal .swm-card{width:min(880px,96vw)} .sfill-modal .swm-body{max-height:min(70vh,600px)} .swm-head .swm-search{display:flex;align-items:center;gap:7px;margin-left:auto;background:var(--panel,#fff);border:1px solid var(--line);border-radius:9px;padding:5px 10px;color:var(--muted);max-width:220px} .swm-head .swm-search input{border:0;background:transparent;font:inherit;font-size:13px;color:var(--ink);width:100%;outline:none} .swm-head .swm-x{margin-left:8px} .sfill-modal .sfill-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:8px;align-items:start} .sfill-modal .sfill-card{padding:8px 10px} .sfill-modal .sfill-name{margin-bottom:4px;font-size:12.5px} .sfill-modal .sfill-field{margin-top:3px;gap:6px} .sfill-modal .sfill-lbl{font-size:11.5px} .sfill-modal .sfill-in{flex:0 0 84px;width:84px;padding:3px 7px} .swm-send3{display:inline-flex;gap:6px;align-items:center;flex-wrap:wrap;margin-left:auto} .swm-send3 .ls-work{background:#e7f6ef;border-color:#25b07a;color:#177c56} .swm-send3 .ls-bonus{background:#f1e9fb;border-color:#8b5cf6;color:#6d3fd6} .swm-send3 .ls-avans{background:#e6f1fa;border-color:#2f80b5;color:#1c5f8a} .swm-send3 .ls-all{background:var(--accent);border-color:var(--accent);color:#fff} /* аванс к отправке в карточке окна отправки */ .sfill-adv{margin-top:6px;padding-top:6px;border-top:1px dashed #e0d6b8} .sfill-adv-cap{font-size:10px;font-weight:700;color:#1c5f8a;margin-bottom:3px} .sfill-adv-row{display:flex;justify-content:space-between;gap:8px;font-size:11px;color:var(--ink)} .sfill-adv-row b{font-variant-numeric:tabular-nums} .sfill-adv-btn{margin-top:5px;width:100%;border:1px solid #2f80b5;background:#e6f1fa;color:#1c5f8a;border-radius:7px;padding:4px 8px;font-size:11px;font-weight:700;cursor:pointer} .sfill-adv-btn:hover{background:#d6e8f6} .sfill-adv-btn:disabled{opacity:.6;cursor:default} .sfill-lbl{flex:1 1 auto;font-size:12.5px;color:var(--ink-soft)} .sfill-in{flex:0 0 108px;width:108px;padding:5px 8px;border:1px solid var(--line);border-radius:8px; font-size:13px;font-variant-numeric:tabular-nums;text-align:right;background:#fff;color:var(--ink)} .sfill-in:focus{outline:none;border-color:var(--brand,#0f8a7e);box-shadow:0 0 0 2px rgba(15,138,126,.14)} .sfill-seg{display:inline-flex;flex:none;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:#fff} .sfill-seg-b{border:0;background:none;padding:5px 13px;font-size:12.5px;font-weight:700;cursor:pointer;color:var(--ink-soft)} .sfill-seg-b+.sfill-seg-b{border-left:1px solid var(--line)} .sfill-seg-b.on{background:var(--brand,#0f8a7e);color:#fff} .sfill-bulk .sfill-seg-b{border:1px solid var(--line);border-radius:8px;padding:4px 12px} .sfill-note{font-size:11.5px;color:var(--ink-soft);margin-top:5px;font-style:italic} .sfill-sent{margin-top:6px;padding-top:6px;border-top:1px dashed #cfe6d4} .sfill-sent-cap{font-size:10px;font-weight:700;color:#2f7d4f;margin-bottom:3px} .sfill-sent-row{display:flex;justify-content:space-between;gap:8px;font-size:11px;color:var(--ink)} .sfill-sent-row b{font-variant-numeric:tabular-nums;color:#2f7d4f} /* v84 — менеджер полей ведомости: карточки-строки + модалка добавить/изменить/архив */ .cnstr-legend .cl-dot.arch{background:#d8c8f5} .fld-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px;margin-top:4px} .fld-blk{background:var(--panel,#fff);border:1px solid var(--line);border-radius:14px;padding:12px;display:flex;flex-direction:column;gap:9px} .fld-blk.blk-accrual{border-top:3px solid #34b98a} .fld-blk.blk-deduction{border-top:3px solid #e0a52a} .fld-blk.blk-indicator{border-top:3px solid #6e8bd6} .fld-blk-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px} .fld-blk-title{font-weight:800;font-size:13.5px;color:var(--ink)} .fld-blk-hint{font-size:10.5px;color:var(--muted);margin-top:1px} .fld-blk-count{flex:none;min-width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;padding:0 6px; border-radius:11px;background:var(--soft,#f1f4f6);font-size:11.5px;font-weight:800;color:var(--ink-soft)} .fld-rows{display:flex;flex-direction:column;gap:6px;min-height:6px} .fld-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px;cursor:pointer; background:var(--soft,#f7f9fa);border:1px solid var(--line);border-radius:10px;transition:border-color .15s,background .15s,box-shadow .15s} .fld-row:hover{border-color:#9fd8c2;background:#fff;box-shadow:0 2px 8px -4px rgba(20,50,60,.2)} .fld-row.is-archived{opacity:.62;background:repeating-linear-gradient(45deg,#f4f0fb,#f4f0fb 6px,#ece3fa 6px,#ece3fa 12px)} .fld-row-main{display:flex;align-items:center;gap:8px;min-width:0} .fld-row-label{font-weight:600;font-size:12.5px;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .fld-type-badge{flex:none;font-size:9.5px;font-weight:800;text-transform:uppercase;letter-spacing:.03em;padding:2px 6px;border-radius:6px} .fld-type-badge.t-money{background:#e0f4ec;color:#12805c} .fld-type-badge.t-text{background:#eef0f3;color:#5b6672} .fld-type-badge.t-list{background:#e7edfb;color:#3f5aa8} .fld-row-meta{display:flex;align-items:center;gap:7px;flex:none} .fld-arch-chip{font-size:10px;font-weight:700;color:#6e56d6;background:#efe8fc;border:1px solid #d8c8f5;border-radius:7px;padding:2px 6px;white-space:nowrap} .fld-row-edit{flex:none;width:24px;height:24px;border:none;background:transparent;border-radius:7px;cursor:pointer;color:var(--muted);font-size:13px;transition:background .15s,color .15s} .fld-row:hover .fld-row-edit{color:var(--ink);background:rgba(20,50,60,.06)} .fld-empty{font-size:11.5px;color:var(--muted);padding:6px 2px} .fld-add{align-self:flex-start;margin-top:2px} /* модалка поля */ .fld-modal{position:fixed;inset:0;z-index:920;display:flex;align-items:center;justify-content:center;padding:20px; background:rgba(20,34,42,.4);backdrop-filter:blur(2px)} .fld-modal[hidden]{display:none!important} .fld-modal-card{width:min(440px,94vw);background:var(--panel,#fff);border:1px solid var(--line);border-radius:16px;overflow:hidden; box-shadow:0 24px 60px -18px rgba(20,40,50,.45);animation:swmIn .18s cubic-bezier(.4,0,.2,1)} .fld-modal-head{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;font-size:15px;border-bottom:1px solid var(--line)} .fld-modal-x{border:none;background:transparent;font-size:15px;color:var(--muted);cursor:pointer;line-height:1} .fld-modal-x:hover{color:var(--ink)} .fld-modal-body{padding:16px 18px;display:flex;flex-direction:column;gap:13px} .fld-f{display:flex;flex-direction:column;gap:5px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.03em;color:var(--muted)} .fld-f input,.fld-f select{font-family:inherit;font-size:13.5px;font-weight:500;text-transform:none;letter-spacing:0;color:var(--ink); padding:9px 11px;border:1px solid var(--line);border-radius:9px;background:#fff;transition:border-color .15s,box-shadow .15s} .fld-f input:focus,.fld-f select:focus{outline:none;border-color:#34b98a;box-shadow:0 0 0 3px rgba(52,185,138,.16)} .fld-f-hint{font-size:10.5px;font-weight:500;text-transform:none;letter-spacing:0;color:var(--muted);line-height:1.4} .fld-modal-foot{display:flex;align-items:center;gap:9px;padding:13px 18px;border-top:1px solid var(--line);background:var(--soft,#fafbfc)} .fld-foot-sp{flex:1} .fld-del-btn{color:#c0392b;border-color:#eecfca} .fld-del-btn:hover{background:#fdecea;border-color:#e0a99f} /* v84b — панель переименования системных итогов */ .sys-labels-panel{margin-top:16px} .sys-labels-form{display:flex;flex-wrap:wrap;align-items:flex-end;gap:14px} .sys-labels-form .fld-f{flex:1;min-width:180px} /* v85 — статус «согласовано руководителем» (h_approved): держится у руководителя до отправки */ .mcell.st-h_approved{background:color-mix(in srgb,var(--stage-ok-soft,#e4f6ec) 45%,#fff)} .mcell[data-isadv="1"].st-h_approved{background:repeating-linear-gradient(45deg,#eafaf3,#eafaf3 7px,#d1efe0 7px,#d1efe0 14px)!important;box-shadow:none!important} .stage-chip.st-h_approved{background:#e4f6ec;color:#1f7a52} /* v86 — статус-строки: чип «оплачено» + построчные статусы авансов в одной ячейке + строка «Бонус» */ .stage-chip.st-paid{background:#efe8fc;color:#6e56d6} .pcell.stat.av-multi{padding-top:3px;padding-bottom:3px} .av-multi .av-line{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:1px 0} .av-multi .av-line + .av-line{margin-top:2px;border-top:1px dashed var(--line)} .av-multi .av-line-l{font-size:10px;color:var(--ink-soft);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .av-multi .stage-chip{flex:none} .bonus-status-row .rowhdr{font-weight:700} /* v87 — статус «согласовано управляющим» (m_approved): держится у управляющего до отправки в фин-блок */ .mcell.st-m_approved{background:color-mix(in srgb,var(--stage-ok-soft,#e4f6ec) 45%,#fff)} .mcell[data-isadv="1"].st-m_approved{background:repeating-linear-gradient(45deg,#eafaf3,#eafaf3 7px,#d1efe0 7px,#d1efe0 14px)!important;box-shadow:none!important} .stage-chip.st-m_approved{background:#e4f6ec;color:#1f7a52} .emp-ctl-b.send.fin{color:#7c5cff} /* v88 — бонус оплачен → фиолетовая заливка (как дни/авансы) + закруглённые иконки отправки/возврата */ .mcell.cell-paid{background:#d8c8f5!important;box-shadow:none!important} .mcell.cell-paid .ro,.mcell.cell-paid .val{color:#3f2a8f} .cell-send svg,.emp-ctl-b svg{display:block;pointer-events:none} .cell-send{display:inline-flex;align-items:center;justify-content:center} /* v89 — чип и секция «Бонусы» в согласовании */ .rv-chip.stg-bonus.is-active{background:#d8c8f5;border-color:#c3aef0;color:#3f2a8f} .rv-chip.stg-bonus .rv-n{background:#efe8fc;color:#6e56d6} .rv-bonus-block .rv-section-ic{filter:none} /* v90 — отклонённая ячейка = красные полоски; штраф (доп −) жирным красным; кнопка повторной отправки дня */ .mcell.st-rejected{background:repeating-linear-gradient(45deg,#fdecec,#fdecec 7px,#f6c9d0 7px,#f6c9d0 14px)!important;box-shadow:inset 0 0 0 1px #eaa7b1!important} .day-row .acell.st-rejected,.day-row .acell.day-out.st-rejected{background:repeating-linear-gradient(45deg,#fdecec,#fdecec 7px,#f6c9d0 7px,#f6c9d0 14px)!important;box-shadow:inset 0 0 0 1px #eaa7b1!important} .day-ex.neg{color:var(--danger,#c0392b)!important;font-weight:800} .dop-ex{font-weight:700} .dop-ex.neg{color:var(--danger,#c0392b);font-weight:800} .ml-day-extra.neg{color:var(--danger,#c0392b)!important} /* инлайн-кнопка «повторно отправить день» на отклонённой ячейке */ .day-resend{position:absolute;right:2px;bottom:2px;width:16px;height:16px;display:inline-flex;align-items:center;justify-content:center; border:none;border-radius:5px;background:var(--accent,#12a594);color:#fff;cursor:pointer;padding:0;z-index:3} .day-resend.rej{background:var(--danger,#c0392b)} .day-resend svg{width:10px;height:10px} .day-resend:hover{filter:brightness(1.08)} /* v90b — «Моя ведомость»: отклонённый день красные полоски + кнопка повторной отправки */ .ml-day.st-rejected{background:repeating-linear-gradient(45deg,#fdecec,#fdecec 6px,#f6c9d0 6px,#f6c9d0 12px)!important;border-color:#eaa7b1!important} /* «Отправить» на дне — спокойный акцент (как «Отправить» в «Ведомости»), не красный */ .ml-day-resend{position:absolute;right:3px;bottom:3px;width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center; border:none;border-radius:6px;background:var(--accent-soft,#e6f7f9);color:var(--accent-ink,#0f8d9b);cursor:pointer;font-size:11px;line-height:1;padding:0;z-index:3} .ml-day-resend:hover{background:var(--accent,#16b3c4);color:#fff} /* одна кнопка «отправить все доп.суммы» + переход к возвратам (Моя ведомость сотрудника) */ .ml-send-extra{display:block;width:100%;margin-top:10px;padding:9px 12px;border:none;border-radius:10px;background:var(--accent,#16b3c4);color:#fff;font-weight:700;font-size:12.5px;cursor:pointer} .ml-send-extra:hover{filter:brightness(1.06)} .ml-rej-jump{display:inline-flex;align-items:center;gap:6px;margin-bottom:8px;padding:7px 11px;border:1px solid #f0c4c4;border-radius:9px;background:var(--danger-soft,#fdecec);color:var(--danger,#c0392b);font-weight:700;font-size:12px;cursor:pointer} .ml-rej-jump svg{width:13px;height:13px} .ml-rej-jump:hover{background:var(--danger,#c0392b);color:#fff} .ml-day-flash{animation:mlDayFlash 1.8s ease} @keyframes mlDayFlash{0%,100%{box-shadow:none}30%{box-shadow:0 0 0 3px var(--danger,#c0392b)}} /* v91 — кнопки отправки в панели согласования (как в ведомости) */ .rv-bulk-sp{flex:1} .rv-bulk-txt.send{display:inline-flex;align-items:center;gap:6px;background:var(--accent,#12a594);color:#fff;border-color:transparent;font-weight:700} .rv-bulk-txt.send:hover{filter:brightness(1.06)} .rv-bulk-txt.send svg{display:block} /* v92 — единая кнопка «Вернуть» в массовой панели согласования */ .rv-bulk-txt.recall{color:#8a6d1f;border-color:#e6c86a;background:#fff} .rv-bulk-txt.recall:hover{background:#fdf6e3} .rv-bulk-txt.recall svg{display:block} .rev-round.recall svg{display:block;width:13px;height:13px} /* v93 — отправлено управляющему (s_manager) → ЖЁЛТАЯ полоска (визуально «ушло наверх, ждёт») */ .day-row .acell.day-out.st-s_manager{background:repeating-linear-gradient(45deg,#fdf7e3,#fdf7e3 7px,#f2e0a6 7px,#f2e0a6 14px)!important;box-shadow:none!important} .day-row .acell.day-out.st-s_manager .day-mark{color:#a9820f} .mcell.st-s_manager{background:repeating-linear-gradient(45deg,#fdf7e3,#fdf7e3 7px,#f2e0a6 7px,#f2e0a6 14px)!important;box-shadow:none!important} .mcell[data-isadv="1"].st-s_manager{background:repeating-linear-gradient(45deg,#fdf7e3,#fdf7e3 7px,#f2e0a6 7px,#f2e0a6 14px)!important;box-shadow:none!important} .stage-chip.st-s_manager,.rev-line-st.st-s_manager{background:#fbf1cf;color:#8a6a12} /* v94 — подсветка ячейки при переходе из «Согласования» (?goto) */ .goto-flash{animation:gotoFlash 2.6s cubic-bezier(.4,0,.2,1);position:relative;z-index:7} @keyframes gotoFlash{0%{box-shadow:none}12%,55%{box-shadow:inset 0 0 0 2px var(--accent,#12a594),0 0 0 4px var(--accent-soft,#d7f0ec)}100%{box-shadow:none}} /* ссылка «перейти в ячейку» в согласовании */ .rv-goto{color:inherit;text-decoration:none;cursor:pointer;border-bottom:1px dashed transparent} .rv-goto:hover{color:var(--accent-ink,#0d7a6b);border-bottom-color:currentColor} /* оплаченная ячейка (бонус/аванс/выход) — СПЛОШНАЯ фиолетовая заливка НА ВСЮ ячейку, без рамки и ₽-значка (перекрывает все прежние стили) */ .mcell.adv-paid,.mcell.cell-paid,.day-row .acell.day-paid{background:#d8c8f5!important;box-shadow:none!important} .mcell.adv-paid::after,.mcell.cell-paid::after{content:none!important;display:none!important} .mcell.adv-paid .ro,.mcell.adv-paid .val,.mcell.cell-paid .ro,.mcell.cell-paid .val{color:#3f2a8f!important} .mcell.adv-paid .cell-paycmt{display:none!important} /* ГАРАНТИЯ: оплаченный аванс/бонус — фиолетовая заливка ДАЖЕ если ячейка approved+frozen (перебиваем зелёные полоски по специфичности) */ .mcell.st-approved.cell-frozen.adv-paid, .mcell.st-approved.adv-paid, .mcell.adv-paid.cell-frozen, .mcell.st-approved.cell-frozen.cell-paid, .mcell.cell-paid.cell-frozen{background:#d8c8f5!important;box-shadow:none!important} /* --- АУДИТ: модалка «История ведомости» --- */ .hist-box{width:600px;max-width:94vw;display:flex;flex-direction:column;max-height:82vh} .hist-filters{display:flex;align-items:center;flex-wrap:wrap;gap:8px 10px;padding:11px 14px;border-bottom:1px solid var(--line);background:#fafbfc} .hist-emp{padding:6px 10px;font-size:12px;font-weight:600;border-radius:8px;max-width:190px} .hist-chips{display:flex;flex-wrap:wrap;gap:5px} .hchip{border:1.5px solid var(--line);background:#fff;color:var(--ink-soft);border-radius:20px;padding:4px 11px;font:inherit;font-size:11.5px;font-weight:700;cursor:pointer;transition:all .13s;line-height:1.2} .hchip:hover{border-color:var(--muted)} .hchip.on{background:var(--accent);border-color:var(--accent);color:#fff} .hchip.cat.on{background:var(--navy);border-color:var(--navy)} .hist-feed{overflow:auto;padding:8px 12px 14px;flex:1;min-height:120px} .hist-empty{text-align:center;color:var(--muted);font-size:12.5px;padding:34px 10px} .hi-row{display:flex;gap:11px;padding:9px 8px;border-bottom:1px solid var(--line)} .hi-row:last-child{border-bottom:none} .hi-ico{flex:none;width:26px;height:26px;border-radius:8px;display:grid;place-items:center;font-size:13px;background:#eef2f5;color:var(--ink-soft)} .hi-ico.k-appr{background:var(--ok-soft);color:var(--ok)} .hi-ico.k-rej{background:var(--danger-soft);color:var(--danger)} .hi-ico.k-pay{background:#efe7fb;color:#7c5cd6} .hi-ico.k-submit{background:var(--accent-soft);color:var(--accent-ink)} .hi-ico.k-fin{background:var(--warn-soft);color:#9a6b16} .hi-ico.k-lock{background:#eef2f5;color:var(--ink-soft)} .hi-ico.k-edit,.hi-ico.k-view{background:#eef2f5;color:var(--muted)} .hi-body{flex:1;min-width:0} .hi-line1{font-size:12.5px;line-height:1.4;display:flex;flex-wrap:wrap;gap:5px;align-items:baseline} .hi-act{font-weight:700} .hi-act.k-appr{color:var(--ok)} .hi-act.k-rej{color:var(--danger)} .hi-act.k-pay{color:#7c5cd6} .hi-act.k-submit{color:var(--accent-ink)} .hi-act.k-fin{color:#9a6b16} .hi-emp{font-weight:700;color:var(--ink)} .hi-cell{background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:1px 7px;font-size:11px;color:var(--ink-soft)} .hi-line2{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline;margin-top:2px;font-size:11px;color:var(--muted)} .hi-who{font-weight:600;color:var(--ink-soft)} .hi-txt{color:var(--ink-soft);font-style:italic} /* ===== Импорт табеля УРВ (тест-фича) ===== */ .imp-wrap{max-width:920px} .imp-topbar{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;margin-bottom:14px} .imp-title{font-family:'Unbounded','Inter',sans-serif;font-size:20px;font-weight:700;margin:0;display:flex;align-items:center;gap:9px} .imp-back{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:8px;background:var(--bg);color:var(--ink-soft);text-decoration:none;font-size:16px;transition:background .15s} .imp-back:hover{background:var(--accent-soft);color:var(--accent-ink)} .imp-badge{font-family:'Inter',sans-serif;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;background:var(--accent-soft);color:var(--accent-ink);padding:2px 8px;border-radius:20px} .imp-sub{font-size:12px;margin-top:3px} .imp-summary{display:flex;align-items:center;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--muted)} .imp-summary b{color:var(--ink);font-variant-numeric:tabular-nums} .imp-cflag{color:var(--danger)} .imp-drop{display:flex;align-items:center;gap:12px;margin-bottom:18px;flex-wrap:wrap} .imp-dz{flex:1;min-width:280px;display:flex;align-items:center;gap:13px;padding:14px 16px;border:1.5px dashed var(--accent);border-radius:12px;background:var(--accent-soft);color:var(--accent-ink);cursor:pointer;transition:all .14s} .imp-dz:hover,.imp-dz.drag{background:#daf3f6;border-color:var(--accent-ink)} .imp-dz input[type=file]{display:none} .imp-dz-txt{display:flex;flex-direction:column;gap:2px;line-height:1.3} .imp-dz-txt b{font-size:13.5px;color:var(--ink)} .imp-dz-txt .muted{font-size:11px} .imp-empty{padding:30px;text-align:center;border:1px solid var(--line);border-radius:12px;background:var(--panel)} .imp-list{display:flex;flex-direction:column;gap:9px} .imp-emp{border:1px solid var(--line);border-radius:11px;background:var(--panel);padding:11px 13px;box-shadow:var(--shadow-sm)} .imp-emp-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:9px} .imp-emp-id{display:flex;align-items:center;gap:9px;font-size:13.5px} .imp-chip{font-size:11px;font-weight:600;padding:2px 9px;border-radius:20px;white-space:nowrap} .imp-chip.ok{background:var(--ok-soft);color:var(--ok)} .imp-chip.warn{background:#fef3d8;color:#b07a12} .imp-chip.none{background:var(--bg);color:var(--muted)} .imp-chip.none.warn-empty{background:var(--danger-soft,#fde8ec);color:var(--danger,#c0392b);font-weight:700} .imp-pick{font-size:12px;padding:5px 9px;border:1px solid var(--line);border-radius:8px;background:#fff;max-width:230px} .imp-grid{display:flex;flex-wrap:wrap;gap:3px} .imp-day{width:22px;height:22px;display:grid;place-items:center;border-radius:5px;font-size:10.5px;font-weight:600;position:relative;background:var(--bg);color:#b7c2c9;border:1px solid transparent;cursor:default} .imp-day.empty{color:#cdd6db} .imp-day.on{background:var(--accent-soft);color:var(--accent-ink);border-color:#c4e9ee} .imp-day.on.short{background:#fef1d3;color:#b07a12;border-color:#f2dca2} .imp-day.on.noin{box-shadow:inset 0 0 0 1.5px var(--danger)} .imp-day.onlyled{background:#efeaff;color:#6b4fd0;border-color:#d9cffa} /* день есть в ведомости, но НЕТ в файле */ .imp-day.onlyled.locked{opacity:.6} .imp-dot{position:absolute;top:2px;right:2px;width:5px;height:5px;border-radius:50%;background:var(--danger)} .imp-xflag{color:#6b4fd0} .imp-actions{display:flex;align-items:center;gap:10px;margin:2px 0 14px} .imp-conf-sec{font-weight:700;font-size:12px;color:var(--ink-soft);margin:10px 0 2px;text-transform:uppercase;letter-spacing:.03em} .imp-conf-sec:first-child{margin-top:0} .imp-extra-row{flex-direction:row!important;align-items:center;gap:10px;cursor:pointer} .imp-extra-row .cd{min-width:150px} .imp-extra-row .ce{flex:1;color:var(--ink-soft)} .imp-extra-row .cx{display:inline-flex;align-items:center;gap:5px;white-space:nowrap;font-size:12px} .imp-emp-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-top:9px;font-size:12px;color:var(--muted)} .imp-counts b{color:var(--ink)} .imp-legend{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:11px;margin-top:14px} .imp-legend .imp-day{width:18px;height:18px;font-size:9px;margin:0 2px} .imp-conf-body{padding:12px 16px;max-height:50vh;overflow:auto} .imp-conf-row{display:flex;flex-direction:column;gap:2px;padding:8px 0;border-bottom:1px solid var(--line);font-size:12.5px} .imp-conf-row:last-child{border-bottom:none} .imp-conf-row .cd{font-weight:700;color:var(--ink)} .imp-conf-row .ce{color:var(--muted)} .imp-conf-row .ci{color:var(--accent-ink)} .imp-conf-foot{padding:11px 16px;border-top:1px solid var(--line);background:#f4f7f9} .imp-conf-note{font-size:11px;margin-bottom:8px} .imp-conf-btns{display:flex;justify-content:flex-end;gap:8px} /* ===== День со штрафом УРВ / отклонение (по мотивам дизайн-макета) ===== */ /* Розовый фон + жирная красная ЛЕВАЯ полоса-акцент + тонкая рамка; значок-треугольник ⚠ и красное число. */ /* Специфичность 3 класса — перебивает зелёную штриховку day-out и статус-фоны. */ .day-row .acell.day-pen, .day-row .acell.day-out.day-pen, .day-row .acell.day-appr.day-pen{ background:var(--danger-soft)!important; /* мягкий розовый фон */ box-shadow:inset 3px 0 0 var(--danger), inset 0 0 0 1px #f3c4d0 !important; /* красная левая полоса + тонкая рамка */ } .day-row .acell.day-pen .day-mark{color:var(--danger)!important} /* нарушение из трекера (короткая смена / нет отметки) БЕЗ начисленного штрафа — нет правила УРВ: тонкая красная полоска снизу, чтобы обратить внимание */ .day-row .acell.day-viol{position:relative} /* нарушение (короткая смена / нет отметки) — красная полоска СЛЕВА (как статус-полоса), а не снизу; перекрывает зелёную has-comment */ .day-row .acell.day-viol::after{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;border-radius:0;background:var(--danger,#d9534f);pointer-events:none;z-index:4} /* ЛК сотрудника — переключатель дневной сетки (Часы/Выходы ⇆ Суммы) + значение часов/суммы в ячейке дня */ .ml-days-tgl{display:inline-flex;gap:2px;background:var(--soft,#f2f5f7);border-radius:9px;padding:2px;margin-left:auto} .mldt-btn{border:none;background:transparent;font:inherit;font-size:11.5px;font-weight:700;color:var(--muted);padding:4px 11px;border-radius:7px;cursor:pointer;white-space:nowrap} .mldt-btn.is-active{background:#fff;color:var(--accent,#0e9e90);box-shadow:0 1px 3px rgba(0,0,0,.08)} .ml-day-val{display:block;font-size:10.5px;font-weight:800;line-height:1;color:var(--accent,#0e9e90);font-variant-numeric:tabular-nums;margin-top:2px} .ml-day-val[hidden]{display:none} .ml-day.ml-day-paid .ml-day-val{color:#7c5cff} .ml-day.ml-day-pen .ml-day-val{color:var(--danger,#d9534f)} /* почасовик отработал >10ч за день — янтарная подсветка (проверить: переработка). Штраф (day-pen, красный с !important) перекрывает. */ .day-row .acell.day-hrs-high{ background:#fff3d9; box-shadow:inset 3px 0 0 #e6a23c, inset 0 0 0 1px #f0d79a; } .day-row .acell.day-hrs-high .day-mark.day-hrs{color:#c67c11} /* почасовик >12ч/день — цифры выделяем отдельно (красные, крупнее) */ .day-mark.day-hrs.day-hrs-over{color:#c0392b;font-weight:900;font-size:12.5px} /* итоговая строка «Отработано, часов» */ .tot-row.hours-row .hours-cell{text-align:center;font-weight:700;font-variant-numeric:tabular-nums;color:var(--teal,#0d9488)} .tot-row.hours-row .hours-cell.est{color:var(--ink-soft);font-weight:600} /* кнопка-фильтр «>10 ч» в тулбаре */ .hrs-filter-btn{border:1px solid #e6a23c;background:#fff7ea;color:#b06f10;border-radius:8px;padding:5px 10px;font-size:12px;font-weight:700;cursor:pointer;white-space:nowrap} .hrs-filter-btn:hover{background:#fdeccf} .hrs-filter-btn.on{background:#e6a23c;color:#fff;box-shadow:0 1px 4px rgba(230,162,60,.4)} /* приглушённые дни ≤10ч при активном фильтре */ .hrs-dim{opacity:.22;transition:opacity .15s} .hrs-dim:hover{opacity:.6} /* цвет полоски-маркера комментария по состоянию дня (зелёный выход / жёлтый на согласовании / фиолетовый оплачен / красный штраф-возврат) */ .day-row .acell.day-out{--cmt-c:var(--ok,#25b07a)} .day-row .acell.day-appr,.day-row .acell.st-s_head,.day-row .acell.st-s_manager,.day-row .acell.day-out.st-s_manager{--cmt-c:#e6b34d} .day-row .acell.day-paid,.day-row .acell.day-out.day-paid{--cmt-c:#7b5cd6} .day-row .acell.st-rejected,.day-row .acell.day-pen{--cmt-c:var(--danger)} /* накопленный штраф под суммой в итоговой ячейке «Выходы, ₽» */ .tot-pen{display:block;color:var(--danger);font-weight:800;font-size:9px;line-height:1;margin-top:1px;font-variant-numeric:tabular-nums} /* отдельная строка «Штраф за отметку» — красным, минус от выходов (не бонус) */ .tot-row.pen-row .rowhdr{color:var(--danger)} .tot-row.pen-row .pen-cell{color:var(--danger);font-weight:800;font-variant-numeric:tabular-nums} /* штраф в дне «Моей ведомости» (сотрудник видит то же, что руководитель): красная рамка + красная сумма */ .ml-day.ml-day-pen{box-shadow:inset 0 0 0 2px var(--danger)!important} .ml-day-penbadge{color:var(--danger);font-weight:800} /* согласование: день с косяком УРВ — красным, «Начислено · штраф · итого» в одной ячейке */ .rv-cell-row.rv-has-pen{background:var(--danger-soft)} .rv-pen-cell{color:var(--danger);font-variant-numeric:tabular-nums;white-space:nowrap} .rv-pen-b{font-weight:800} .day-pen-badge{display:block;text-align:center;font-size:9px;font-weight:800;line-height:1; color:var(--danger);margin-top:-1px;white-space:nowrap;font-variant-numeric:tabular-nums;position:relative;z-index:1; max-width:100%;overflow:hidden;text-overflow:ellipsis} /* #110: приход–уход из трекера — тонкая справочная строка под отметкой дня, всегда на виду у руководителя */ .day-io{display:block;text-align:center;font-size:8px;font-weight:600;line-height:1.15;color:var(--muted,#98a2b0); white-space:nowrap;font-variant-numeric:tabular-nums;letter-spacing:-.2px;margin-top:-1px; max-width:100%;overflow:hidden;text-overflow:ellipsis} .mode-daysum .day-io{display:none} /* в режиме «Суммы за день» ячейку не перегружаем */ /* #105: показатель «Компенсация налогов» (Да/Нет) ждёт подтверждения согласующего — мягкая янтарная подсветка (не агрессивная) */ /* «Компенсация налогов» = «Да» ждёт подтверждения управляющего → ЗЕЛЁНАЯ подсветка (видно отдельно). «Нет» сюда не попадает (resolved на отправке). */ .rv-cell-row.rv-plan{background:var(--ok-soft,#e7f6ef)} .rv-cell-row.rv-plan .rv-cell-lbl{box-shadow:inset 3px 0 0 var(--ok,#25b07a)} .rv-plan-tag{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:999px;background:var(--ok,#25b07a);color:#fff;font-size:9.5px;font-weight:800;letter-spacing:.2px;vertical-align:middle} /* #4c: строка «Компенсация налогов» подсвечивается целиком — Да = зелёным, Нет = красным (по значению показателя) */ .rv-cell-row.rv-plan-yes{background:var(--ok-soft,#e7f6ef)} .rv-cell-row.rv-plan-yes .rv-cell-lbl{box-shadow:inset 3px 0 0 var(--ok,#25b07a)} .rv-cell-row.rv-plan-no{background:var(--danger-soft,#fdeef2)} .rv-cell-row.rv-plan-no .rv-cell-lbl{box-shadow:inset 3px 0 0 var(--danger,#e8607f)} /* #4d: строки под-группы «Показатели» (Да/Нет) — та же подсветка целиком */ .rv-plan-line.rv-plan-yes>td{background:var(--ok-soft,#e7f6ef)} .rv-plan-line.rv-plan-no>td{background:var(--danger-soft,#fdeef2)} .mcell.yn-cell.yn-await{background:var(--ok-soft,#e7f6ef);box-shadow:inset 0 0 0 2px var(--ok,#25b07a)} /* Заблокированный авто-штраф УРВ в попапе дня (нельзя править, только читать) */ /* штраф УРВ в попапе — компактная строка (как поля штраф/доп.сумма) */ .cmt-urv{background:var(--danger-soft);border:1px solid #f3c4d0;border-radius:7px;padding:5px 8px;margin-bottom:7px} .cmt-urv-row{display:flex;align-items:baseline;justify-content:space-between;gap:8px} .cmt-urv-cap{font-size:11px;font-weight:700;color:var(--danger);white-space:nowrap} .cmt-urv-sum{font-size:12px;font-weight:800;color:var(--danger);font-variant-numeric:tabular-nums;white-space:nowrap} .cmt-urv-note{font-size:10px;color:var(--muted);line-height:1.3;margin-top:2px} /* Кнопка «Обновить из трекера» — крутящаяся иконка во время запроса */ .attend-ico{display:inline-block;font-weight:700} .attend-loading{opacity:.75;cursor:progress} .attend-loading .attend-ico{animation:attend-spin .8s linear infinite} @keyframes attend-spin{to{transform:rotate(360deg)}} /* «Обновить по всем» на экране «Ведомости» + модалка результата/сверки ростера */ .ph-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end} .attend-all-btn{white-space:nowrap} .att-card{width:min(560px,94vw)} .att-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px} .att-stat{background:var(--soft,#fafbfc);border:1px solid var(--line);border-radius:12px;padding:11px 13px;text-align:center} .att-stat-n{font-size:23px;font-weight:800;letter-spacing:-.5px;line-height:1;color:var(--ink)} .att-stat.warn .att-stat-n{color:#b26a00} .att-stat-c{font-size:11px;color:var(--muted);margin-top:5px;line-height:1.25} .att-ok{margin-top:14px;background:var(--ok-soft,#e9f7f0);color:#1c7d57;border:1px solid #bfe6d3;border-radius:12px;padding:12px 14px;font-weight:600;font-size:13px} .att-warn-h{margin-top:16px;background:#fff6ec;border:1px solid #f2d7ad;border-radius:12px;padding:11px 14px} .att-warn-h b{color:#b26a00;font-size:14px} .att-warn-sub{font-size:12px;color:var(--muted);margin-top:5px;line-height:1.45} .att-unm{list-style:none;margin:10px 0 0;padding:0;max-height:230px;overflow:auto;border:1px solid var(--line);border-radius:12px} .att-unm li{padding:8px 13px;font-size:13px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:8px} .att-unm li:last-child{border-bottom:none} .att-unm li::before{content:"";width:6px;height:6px;border-radius:50%;background:#e0932e;flex:none} /* попап диагностики «не сопоставлено с трекером» */ .att-unm-ov{position:fixed;inset:0;background:rgba(18,32,40,.42);backdrop-filter:blur(2px);z-index:120;display:flex;align-items:center;justify-content:center;padding:20px} .att-unm-ov[hidden]{display:none} .att-unm-card{position:relative;background:#fff;border-radius:16px;box-shadow:0 24px 60px -18px rgba(20,40,50,.5);max-width:560px;width:100%;max-height:82vh;overflow:auto;padding:20px 22px} .att-unm-x{position:absolute;top:12px;right:12px;width:30px;height:30px;border:none;background:var(--panel,#f1f4f6);border-radius:9px;cursor:pointer;font-size:15px;color:var(--muted)} .att-unm-pop-h b{font-size:15px;color:#b26a00} .att-unm2{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-direction:column;gap:8px} .att-unm2 li{border:1px solid var(--line);border-radius:12px;padding:10px 13px} .att-unm2 .au-name{font-weight:700;font-size:14px;color:var(--ink)} .att-unm2 .au-reason{font-size:12px;color:#b26a00;margin-top:2px} .att-unm2 .au-hints{font-size:12.5px;color:var(--ink-soft);margin-top:5px} .att-unm2 .au-hints b{color:var(--accent-ink,#0f8d9b);font-weight:700} /* диалог «убрать сотрудника»: только этот месяц / с этого и далее */ .emp-rm-ov{position:fixed;inset:0;background:rgba(18,32,40,.42);backdrop-filter:blur(2px);z-index:130;display:flex;align-items:center;justify-content:center;padding:20px} .emp-rm-ov[hidden]{display:none} .emp-rm-card{background:#fff;border-radius:16px;box-shadow:0 24px 60px -18px rgba(20,40,50,.5);max-width:400px;width:100%;padding:22px} .emp-rm-t{font-size:16px;font-weight:700;color:var(--ink)} .emp-rm-sub{font-size:13px;color:var(--muted);margin:6px 0 16px} .emp-rm-b{display:block;width:100%;text-align:left;border:1.5px solid var(--line);background:#fff;border-radius:12px;padding:12px 14px;margin-bottom:9px;cursor:pointer;font:inherit;font-size:14px;font-weight:700;color:var(--ink);transition:all .13s} .emp-rm-b span{display:block;font-size:12px;font-weight:500;color:var(--muted);margin-top:2px} .emp-rm-b.month:hover{border-color:var(--accent,#16b3c4);background:var(--accent-soft,#eafaf6)} .emp-rm-b.onward:hover{border-color:var(--danger,#d9534f);background:var(--danger-soft,#fdecec)} .emp-rm-cancel{display:block;width:100%;text-align:center;border:none;background:none;color:var(--muted);font:inherit;font-size:13px;padding:8px;cursor:pointer;margin-top:2px} /* Вкладки финблока: «К оплате» (бирюза) / «Авансы» (фиолетовый) */ .fin-tabs{display:flex;gap:8px;margin:2px 0 18px;border-bottom:1px solid var(--line)} .fin-tab{display:inline-flex;align-items:center;gap:8px;padding:10px 18px 12px;margin-bottom:-1px;font-size:14px;font-weight:700;color:var(--muted);border-bottom:2.5px solid transparent;border-radius:10px 10px 0 0;transition:color .15s,background .15s,border-color .15s;text-decoration:none;white-space:nowrap} .fin-tab:hover{color:var(--ink);background:var(--soft,#fafbfc)} .fin-tab-ic{font-size:16px;line-height:1} .fin-tab-n{min-width:20px;height:20px;padding:0 6px;display:inline-flex;align-items:center;justify-content:center;font-size:11.5px;font-weight:800;border-radius:999px;background:#eef2f5;color:var(--muted)} .fin-tab.pay.is-active{color:var(--accent,#0e9e90);border-bottom-color:var(--accent,#0e9e90);background:var(--accent-soft,#e9f8f5)} .fin-tab.pay.is-active .fin-tab-n{background:var(--accent,#0e9e90);color:#fff} .fin-tab.adv.is-active{color:#6d4bff;border-bottom-color:#7c5cff;background:#f4f1ff} .fin-tab.adv.is-active .fin-tab-n{background:#7c5cff;color:#fff} .fin-tab.adv .fin-tab-n{background:#efeafe;color:#6d4bff} .fin-tab.bonus.is-active{color:#b8860b;border-bottom-color:#e0a800;background:#fdf6e3} .fin-tab.bonus.is-active .fin-tab-n{background:#e0a800;color:#fff} .fin-tab.bonus .fin-tab-n{background:#fbf0d0;color:#b8860b} /* Сумма к выплате в окне «Оплатить» финблока */ .pay-sum-row{margin:2px 0 10px;padding:9px 12px;background:var(--accent-soft,#e9f8f5);border:1px solid #bfe6d3;border-radius:10px;font-size:13px;color:#1c7d57;font-weight:600} .pay-sum-row b{font-size:16px;font-weight:800;color:#0d7a6b} /* v79 — согласование: макс. компактная таблица под макет (аватар + низкие строки) */ /* заголовки: 11px uppercase, приглушённые */ .rv-tbl thead th{padding:7px 12px;font-size:11px;letter-spacing:.05em;font-weight:800;color:var(--muted)} /* строки основной таблицы (сотрудник) — низкие */ .rv-emp-tbl tbody tr.rv-emp>td{padding-top:5px;padding-bottom:5px;font-size:12.5px;line-height:1.2;vertical-align:middle} .rv-row td{padding:5px 12px} /* аватар-кружок с инициалами */ .rv-name{gap:9px} .rv-ava{flex:none;width:27px;height:27px;border-radius:50%;display:inline-grid;place-items:center; background:var(--accent-soft);color:var(--accent-ink);font-size:10.5px;font-weight:800;letter-spacing:.02em;line-height:1} .rv-emp.is-wait .rv-ava{background:var(--accent);color:#fff} .rv-name b{font-size:13px;line-height:1.2} .rv-name-car{width:11px;height:11px} /* «Кто» / позиция — мелким серым */ .rv-emp-tbl tbody tr.rv-emp>td.muted{font-size:11.5px;color:var(--muted)} /* сумма — жирная, tabular */ .rv-emp-tbl tbody tr.rv-emp>td.num b{font-variant-numeric:tabular-nums} /* комментарий-чип компактнее */ .rv-cmt-txt{font-size:11px;padding:2px 8px;max-width:190px;line-height:1.35} /* статус-пилюли: бирюза для «ждёт», нейтраль для прочих; мелкий шрифт */ .rev-line-st{font-size:10.5px;font-weight:750;padding:2px 9px;gap:5px;border-radius:999px} .rv-row.is-wait .rev-line-st{background:var(--accent);color:#fff} .rv-emp .rev-line-st.st-is-wait{background:var(--accent);color:#fff} /* круглые кнопки действий чуть меньше */ .rv-act{gap:5px} .rev-round{width:27px;height:27px;font-size:12px;border-radius:50%} /* раскрытая вложенная таблица дня — очень плотная */ .rv-cell-tbl td{padding:4px 11px;font-size:12px;line-height:1.25} .rv-cell-lbl{font-size:12px} .rv-urv,.rv-urv-cap{font-size:11px} /* калькуляция дня: компактно, штраф мягко-красный (не кричащий) */ .rv-pen-cell{color:var(--ink);font-size:11.5px} .rv-pen-b{color:var(--danger);font-weight:800} .rv-cell-row.rv-has-pen{background:color-mix(in srgb,var(--danger-soft) 55%,transparent)} /* тонкие разделители + мягкий hover */ .rv-emp-tbl tbody td{border-bottom:1px solid #eef2f5} .rv-row.rv-emp:hover{background:#f5fbfc} /* футер и секции плотнее */ .rv-foot{padding:6px 16px;font-size:11.5px} .rv-section{margin:14px 0 6px;font-size:13px} .rv-adv-block{margin-top:16px} /* секции авансов/бонусов — те же низкие строки */ .rv-adv tbody tr.rv-row>td{padding-top:5px;padding-bottom:5px} /* ============ v35 — KPI-карточки согласования + пагинация ============ */ /* ряд KPI-карточек: иконка+подпись сверху, крупное число, тонкий прогресс-бар. На узком — горизонтальный скролл. */ .rv-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(106px,1fr));gap:9px;margin:18px 0 16px} .rv-kpi{position:relative;display:flex;flex-direction:column;gap:7px;padding:12px 13px 11px;background:#fff;border:1px solid var(--line);border-radius:14px;text-decoration:none;box-shadow:0 1px 2px rgba(22,50,63,.04);transition:transform .13s ease,box-shadow .13s ease,border-color .13s ease} .rv-kpi:hover{transform:translateY(-2px);border-color:#cfd8dc;box-shadow:0 6px 18px rgba(22,50,63,.08)} .rv-kpi-top{display:flex;align-items:center;gap:6px;min-height:16px} .rv-kpi-ic{font-size:13px;line-height:1;flex:none} .rv-kpi-lbl{font-size:11px;font-weight:700;letter-spacing:.02em;color:var(--ink-soft);text-transform:uppercase;line-height:1.15;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .rv-kpi-n{font-family:'Unbounded','Inter',sans-serif;font-size:24px;font-weight:700;line-height:1;color:var(--ink);font-variant-numeric:tabular-nums} .rv-kpi-bar{height:4px;border-radius:999px;background:#eef2f5;overflow:hidden} .rv-kpi-bar>span{display:block;height:100%;border-radius:999px;background:var(--stg-all);transition:width .3s ease} /* цвет прогресс-бара по стадии */ .rv-kpi.stg-all .rv-kpi-bar>span{background:var(--stg-all)} .rv-kpi.stg-approved .rv-kpi-bar>span{background:var(--stg-approved)} .rv-kpi.stg-rejected .rv-kpi-bar>span{background:var(--stg-rejected)} .rv-kpi.stg-adv .rv-kpi-bar>span{background:var(--stg-adv)} .rv-kpi.stg-bonus .rv-kpi-bar>span{background:#7c5cff} /* активная карточка — выделена бирюзой (либо цветом своей стадии) */ .rv-kpi.is-active{border-color:var(--stg-all);box-shadow:0 4px 14px color-mix(in srgb,var(--stg-all) 22%,transparent)} .rv-kpi.is-active .rv-kpi-lbl{color:var(--stg-all)} .rv-kpi.stg-rejected.is-active{border-color:var(--stg-rejected);box-shadow:0 4px 14px color-mix(in srgb,var(--stg-rejected) 22%,transparent)} .rv-kpi.stg-rejected.is-active .rv-kpi-lbl{color:var(--stg-rejected)} .rv-kpi.stg-adv.is-active{border-color:var(--stg-adv);box-shadow:0 4px 14px color-mix(in srgb,var(--stg-adv) 22%,transparent)} .rv-kpi.stg-adv.is-active .rv-kpi-lbl{color:var(--stg-adv)} .rv-kpi.stg-bonus.is-active{border-color:#7c5cff;box-shadow:0 4px 14px color-mix(in srgb,#7c5cff 22%,transparent)} .rv-kpi.stg-bonus.is-active .rv-kpi-lbl{color:#6e56d6} /* нулевые (кроме «Отклонено») — приглушены */ .rv-kpi.is-zero{opacity:.62} .rv-kpi.is-zero:hover{opacity:1} .rv-kpi.is-zero .rv-kpi-n{color:var(--muted)} @media(max-width:640px),(orientation:landscape) and (max-height:520px) and (max-width:1024px){ .rv-kpis{display:flex;overflow-x:auto;gap:9px;padding-bottom:4px;-webkit-overflow-scrolling:touch;scrollbar-width:thin} .rv-kpi{flex:0 0 128px} .rv-kpi-n{font-size:21px} } /* пагинация основной таблицы */ .rv-pager{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;padding:11px 18px;background:#fbfdfe;border-top:1px solid var(--line);font-size:12.5px;color:var(--ink-soft)} .rv-pager[hidden]{display:none!important} /* атрибут hidden не перебивал display:flex — прячем явно (одна страница → пейджер не нужен) */ .rv-pager-info b{color:var(--ink);font-variant-numeric:tabular-nums} .rv-pager-pages{display:flex;align-items:center;gap:4px} .rv-pg-btn{min-width:28px;height:28px;padding:0 8px;border:1px solid var(--line);background:#fff;border-radius:8px;color:var(--ink-soft);font:inherit;font-weight:700;font-size:12.5px;cursor:pointer;font-variant-numeric:tabular-nums;transition:all .12s ease} .rv-pg-btn:hover:not(:disabled){border-color:var(--stg-all);color:var(--stg-all)} .rv-pg-btn.is-active{background:var(--stg-all);border-color:var(--stg-all);color:#fff;box-shadow:0 2px 8px color-mix(in srgb,var(--stg-all) 32%,transparent)} .rv-pg-btn.rv-pg-nav{font-size:15px;line-height:1} .rv-pg-btn:disabled{opacity:.4;cursor:default} .rv-pager-size{display:inline-flex;align-items:center;gap:7px;color:var(--muted);font-weight:600;white-space:nowrap} .rv-pager-size select{padding:5px 9px;font-size:12.5px;font-weight:700;border-radius:8px;border:1.5px solid var(--line);background:#fff;color:var(--ink)} @media(max-width:640px),(orientation:landscape) and (max-height:520px) and (max-width:1024px){.rv-pager{padding:9px 14px;font-size:12px}.rv-pager-size{font-size:11.5px}} /* ═══════════════════════════════════════════════════════════════ Категории ведомостей — карточки, чипы, кнопки (дизайн-система) ═══════════════════════════════════════════════════════════════ */ .cat-cards{display:flex;flex-direction:column;gap:14px;margin-bottom:18px} .cat-card{position:relative;border:1px solid var(--line);border-radius:var(--radius);background:#fff;padding:16px 18px;box-shadow:var(--shadow-sm);transition:border-color .14s ease,box-shadow .14s ease} .cat-card:hover{border-color:var(--line-strong);box-shadow:0 4px 16px rgba(22,50,63,.06)} /* верх карточки: имя категории (инлайн-редактор) + правило + удалить */ .cat-card-top{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;flex-wrap:wrap} .cat-form{flex:1;min-width:280px;margin:0} .cat-name-wrap{display:flex;align-items:center;gap:7px} .cat-name-wrap::before{content:"📁";font-size:15px;line-height:1;opacity:.85} .cat-name-input{flex:1;min-width:180px;font-family:'Unbounded','Inter',sans-serif;font-size:15px;font-weight:700;letter-spacing:-.01em;color:var(--ink);border:1.5px solid transparent;background:transparent;border-radius:8px;padding:4px 8px;transition:all .13s ease} .cat-name-input:hover{background:var(--accent-soft)} .cat-name-input:focus{background:#fff;border-color:var(--accent);outline:none;box-shadow:0 0 0 3px var(--accent-soft)} /* блок правила УРВ — компактная полоска, поля по базовой линии */ .cat-rule{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px;margin-top:12px;padding:10px 12px;background:var(--bg);border:1px solid var(--line);border-radius:var(--radius-sm)} .cat-rule-toggle{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:700;color:var(--ink);cursor:pointer;margin:0;align-self:center;white-space:nowrap} .cat-rule-toggle input{width:15px;height:15px;accent-color:var(--accent);cursor:pointer;margin:0} .cat-fld{display:flex;flex-direction:column;gap:3px;margin:0} .cat-fld-lbl{font-size:10px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--ink-soft)} .cat-rule input[type=date],.cat-rule input[type=text]{border:1.5px solid var(--line);border-radius:7px;background:#fff;font:inherit;font-size:12px;padding:5px 7px;color:var(--ink);transition:border-color .12s ease,box-shadow .12s ease} .cat-rule input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)} .cat-fld-day input{width:56px;text-align:center;font-variant-numeric:tabular-nums} .cat-fld-pct input{width:52px;text-align:center;font-variant-numeric:tabular-nums} .cat-rule .btn{margin-left:auto;align-self:flex-end} .cat-hint{font-size:11px;color:var(--muted);margin-top:6px;line-height:1.4} /* «тихая» кнопка удаления — danger только на hover */ .cat-del{margin:0;flex:none} .btn.cat-del-btn{border-color:transparent;background:transparent;color:var(--muted)} .btn.cat-del-btn:hover{background:var(--danger-soft);color:var(--danger);border-color:transparent} /* разделитель + секция ведомостей */ .cat-divider{height:1px;background:var(--line);margin:14px 0 12px} .cat-sec-head{display:flex;align-items:center;gap:8px;margin-bottom:9px} .cat-sec-title{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-soft)} .cat-count-badge{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 7px;border-radius:20px;background:var(--accent-soft);color:var(--accent-ink);font-size:11px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1} /* строка чипов ведомостей + «добавить» */ .cat-ved-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center} .cat-ved-chip{display:inline-flex;align-items:center;gap:6px;background:var(--accent-soft);border:1px solid #c3e7ec;color:var(--accent-ink);border-radius:20px;padding:5px 6px 5px 13px;font-size:12.5px;font-weight:600;line-height:1;transition:border-color .12s ease,box-shadow .12s ease} .cat-ved-chip:hover{border-color:var(--accent);box-shadow:0 1px 4px rgba(22,179,196,.14)} .cat-ved-x{border:none;background:transparent;color:var(--accent-ink);border-radius:50%;width:19px;height:19px;display:inline-grid;place-items:center;line-height:1;cursor:pointer;font-size:14px;opacity:.55;transition:all .12s ease} .cat-ved-x:hover{background:#fff;color:var(--danger);opacity:1} /* призрачный селект «+ добавить ведомость» */ .cat-add-sel{font:inherit;font-size:12.5px;font-weight:700;border:1.5px dashed var(--accent);color:var(--accent-ink);border-radius:20px;padding:5px 12px;background:#fff;cursor:pointer;transition:all .13s ease} .cat-add-sel:hover{background:var(--accent-soft);border-color:var(--accent-ink)} .cat-add-sel:focus{outline:none;box-shadow:0 0 0 3px var(--accent-soft)} /* пустая категория — приятная подсказка */ .cat-empty{display:inline-flex;align-items:center;gap:6px;font-size:12px;color:var(--muted);font-style:italic;padding:5px 2px} .cat-empty::before{content:"↦";font-style:normal;font-weight:700;color:var(--accent);opacity:.7} /* «Что видит управляющий» — чипы-тумблеры уже есть (.cat-mgr-chip), лёгкая доводка */ .cat-mgr-chip{border-radius:20px} @media(max-width:640px),(orientation:landscape) and (max-height:520px) and (max-width:1024px){ .cat-card{padding:14px} .cat-rule{gap:10px} .cat-rule .btn{margin-left:0} } /* ── меню-вкладки админки: чуть заметнее активная, аккуратные бейджи ── */ .adm-tab{position:relative} .adm-tab-n{background:var(--bg);color:var(--muted);border:1px solid var(--line);font-weight:800;font-variant-numeric:tabular-nums;transition:all .13s ease} .adm-tab:hover .adm-tab-n{border-color:var(--accent);color:var(--accent-ink)} .adm-tab.is-active .adm-tab-n{background:var(--accent-soft);border-color:transparent;color:var(--accent-ink)} /* ---------- Окно «Отправить всё в фин-блок» (препросмотр: уйдёт / не уйдёт) ---------- */ .finm-back{position:fixed;inset:0;z-index:120;display:flex;align-items:center;justify-content:center;padding:24px; background:rgba(22,50,63,.34);backdrop-filter:blur(3px);animation:finmFade .16s ease} .finm-back[hidden]{display:none!important} @keyframes finmFade{from{opacity:0}to{opacity:1}} .finm{width:min(560px,100%);max-height:88vh;display:flex;flex-direction:column;background:var(--panel); border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow);overflow:hidden; animation:finmPop .18s cubic-bezier(.2,.9,.3,1.1)} @keyframes finmPop{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}} .finm-head{display:flex;align-items:flex-start;gap:12px;padding:16px 18px 14px;border-bottom:1px solid var(--line)} .finm-ic{flex:none;width:38px;height:38px;border-radius:11px;display:grid;place-items:center;font-size:19px; background:var(--accent-soft)} .finm-ttl{font-size:15px;font-weight:650;color:var(--ink);letter-spacing:-.1px} .finm-sub{font-size:12px;color:var(--ink-soft);margin-top:2px} .finm-x{margin-left:auto;flex:none;width:28px;height:28px;border:none;background:transparent;border-radius:8px; color:var(--muted);font-size:15px;cursor:pointer;transition:background .12s,color .12s} .finm-x:hover{background:var(--line);color:var(--ink)} .finm-body{padding:14px 18px;overflow:auto;display:flex;flex-direction:column;gap:12px} .finm-loading,.finm-empty{padding:22px 4px;text-align:center;color:var(--ink-soft);font-size:13px} .finm-sec{border:1px solid var(--line);border-radius:var(--radius-sm);overflow:hidden} .finm-sec.ok{border-color:var(--ok-soft);background:linear-gradient(0deg,var(--ok-soft),var(--ok-soft)),var(--panel)} .finm-sec.warn{border-color:var(--warn-soft)} .finm-sec-h{display:flex;align-items:center;gap:8px;padding:10px 12px;font-size:13px;font-weight:600;color:var(--ink)} .finm-sec.ok .finm-sec-h{color:var(--ok)} .finm-sec.warn .finm-sec-h{color:var(--warn);background:var(--warn-soft)} .finm-badge{flex:none;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:700;color:#fff} .finm-badge.ok{background:var(--ok)} .finm-badge.warn{background:var(--warn)} .finm-cnt{margin-left:auto;font-size:11.5px;font-weight:600;color:var(--ink-soft)} .finm-names{display:flex;flex-wrap:wrap;gap:6px;padding:0 12px 12px} .finm-chip{display:inline-flex;align-items:center;gap:5px;padding:4px 8px;border-radius:8px;font-size:12px; background:var(--panel);border:1px solid var(--ok-soft);color:var(--ink)} .finm-chip i{font-style:normal;font-size:10.5px;font-weight:700;color:var(--ok);background:var(--ok-soft); border-radius:5px;padding:1px 5px} .finm-plist{max-height:34vh;overflow:auto;padding:2px 12px 10px;display:flex;flex-direction:column;gap:8px} .finm-prow{display:flex;gap:10px;align-items:flex-start;padding-top:8px;border-top:1px solid var(--line)} .finm-prow:first-child{border-top:none;padding-top:2px} .finm-pname{flex:none;min-width:130px;font-size:12.5px;font-weight:600;color:var(--ink);display:flex;flex-direction:column;gap:1px} .finm-pname small{font-weight:400;font-size:11px;color:var(--muted)} .finm-ptags{display:flex;flex-wrap:wrap;gap:5px} .finm-tag{font-size:11.5px;padding:3px 8px;border-radius:7px;background:var(--warn-soft);color:var(--ink);border:1px solid #f0dcb0} .finm-tag b{font-weight:600;color:var(--warn)} .finm-foot{display:flex;justify-content:flex-end;gap:8px;padding:12px 18px;border-top:1px solid var(--line);background:var(--panel-2,#f8fbfc)} .finm-btn{padding:9px 16px;border-radius:10px;font-size:13px;font-weight:600;cursor:pointer;border:1px solid transparent;transition:all .13s} .finm-btn.ghost{background:transparent;border-color:var(--line-strong);color:var(--ink-soft)} .finm-btn.ghost:hover{background:var(--line);color:var(--ink)} .finm-btn.primary{background:var(--accent);color:#fff;box-shadow:0 2px 8px rgba(20,165,148,.22)} .finm-btn.primary:hover{background:var(--accent-ink)} .finm-btn.primary:disabled{background:var(--line-strong);color:var(--muted);cursor:not-allowed;box-shadow:none} /* ---------- Переключатель дневных ячеек: отметки ⇆ суммы за день ---------- */ .daysum-btn{border:1px solid var(--accent,#16b3c4);background:var(--accent-soft,#e6f7f9);color:var(--accent-ink,#0f8d9b); border-radius:8px;padding:5px 10px;font-size:12px;font-weight:700;cursor:pointer;white-space:nowrap;display:inline-flex;align-items:center;gap:5px;transition:all .13s} .daysum-btn .dsb-ico{font-weight:800} .daysum-btn:hover{background:#d5f1f4} .daysum-btn.on{background:var(--accent,#16b3c4);color:#fff;box-shadow:0 1px 4px rgba(22,179,196,.4)} /* базовая рублёвая сумма дня — скрыта, пока не включён режим «Суммы» */ .day-sum{display:none;text-align:center;font-weight:800;font-size:10px;color:var(--ink,#1f2c38);line-height:1.35; font-variant-numeric:tabular-nums;min-height:14px} .day-row .acell.day-appr .day-sum{color:#1c7d57} .day-row .acell.day-paid .day-sum{color:#5b3fc4} .mode-daysum .day-row .acell .day-mark{display:none} .mode-daysum .day-row .acell .day-sum{display:block} /* в режиме «Суммы» доп/штраф крупнее (акцент на деньгах) */ .mode-daysum .day-ex{font-size:9.5px} /* режим «Часы за день» */ .day-hours{display:none;text-align:center;font-weight:800;font-size:10.5px;color:var(--teal,#0d9488);line-height:1.35;font-variant-numeric:tabular-nums;min-height:14px} .day-hours.est{color:#c98a1e} /* 9 ч по умолчанию — нет отметок вход/уход (приглушённо-янтарный) */ .mode-dayhours .day-row .acell .day-mark,.mode-dayhours .day-row .acell .day-sum{display:none} .mode-dayhours .day-row .acell .day-hours{display:block} .mode-dayhours .day-io{display:none} /* дропдаун выбора вида дневных ячеек */ .dayview-dd{position:relative;display:inline-block} .dayview-menu{position:absolute;top:calc(100% + 5px);right:0;z-index:60;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 32px -10px rgba(20,40,50,.28);padding:5px;min-width:210px} .dayview-opt{display:flex;align-items:center;gap:9px;width:100%;text-align:left;border:none;background:none;font:inherit;font-size:13px;font-weight:600;color:var(--ink);padding:9px 10px;border-radius:9px;cursor:pointer} .dayview-opt:hover{background:var(--accent-soft,#eafaf6)} .dayview-opt .dvo-ico{flex:none;width:18px;text-align:center;font-weight:800;color:var(--accent-ink,#0f8d9b)} .dayview-opt .dvo-hint{margin-left:auto;font-size:11px;font-weight:500;color:var(--muted)} /* ---------- Матрица прав: категории + булевы cap'ы ---------- */ .role-matrix .rm-cat td{background:linear-gradient(0deg,var(--accent-soft,#e6f7f9),var(--accent-soft,#e6f7f9)),#fff; color:var(--accent-ink,#0f8d9b);font-weight:800;font-size:12px;letter-spacing:.02em;text-transform:uppercase; padding:9px 12px;border-top:2px solid var(--accent,#16b3c4)} .role-matrix .rm-cat-ic{margin-right:5px;font-size:13px} .role-matrix .rm-cat-hint{font-weight:500;text-transform:none;color:var(--ink-soft);letter-spacing:0;font-size:11.5px} .role-matrix .rm-cap-hint{display:block;font-weight:400;font-size:10.5px;color:var(--muted);text-transform:none;letter-spacing:0;margin-top:1px} .role-matrix .rm-bool .rm-cap{font-weight:600} .role-matrix .rm-chk{display:inline-flex;align-items:center;gap:5px;text-transform:none;font-weight:500;font-size:12px;color:var(--ink-soft);cursor:pointer} .role-matrix .rm-chk input{cursor:pointer;width:15px;height:15px;accent-color:var(--accent,#16b3c4)} .role-matrix .rm-chk-locked{color:var(--muted);cursor:default} .role-matrix .rm-chk-locked input{cursor:default} .role-matrix .rm-rvsel{width:100%;max-width:150px} /* ═══════════ Дашборд аналитики зарплат ═══════════ */ /* Спокойный «финансовый» дашборд: бирюзовые бары-спарклайны за текстом, табличные числа, семантика штраф/УРВ мягкими предупреждающими тонами. */ .dash{display:flex;flex-direction:column;gap:20px} /* — шапка — */ .dash-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap} .dash-eyebrow{font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;color:var(--accent-ink);font-weight:800;margin-bottom:4px} .dash-title{font-family:'Unbounded','Inter',sans-serif;font-size:24px;font-weight:700;letter-spacing:-.02em;color:var(--ink);line-height:1.1;margin:0} .dash-monthf{display:flex;align-items:center;gap:9px;flex:none} .dash-monthf label{font-size:10.5px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-weight:800} .dash-monthf select{font-weight:700;font-size:12.5px;padding:9px 13px;min-width:168px;background:var(--panel);border-radius:10px} /* — ряд KPI — */ .dash-kpis{display:grid;grid-template-columns:repeat(6,1fr);gap:12px} .dkpi{position:relative;overflow:hidden;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:13px 15px 14px;box-shadow:var(--shadow-sm);display:flex;flex-direction:column;gap:7px;transition:border-color .14s,box-shadow .14s,transform .14s} .dkpi:hover{border-color:var(--line-strong);box-shadow:var(--shadow);transform:translateY(-1px)} /* тонкая цветная кромка слева = семантика карточки */ .dkpi::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--accent);opacity:.85} .dkpi-cap{font-size:10px;text-transform:uppercase;letter-spacing:.045em;color:var(--muted);font-weight:800;line-height:1.35;min-height:2.7em;display:flex;align-items:flex-start} .dkpi-val{font-family:'Unbounded','Inter',sans-serif;font-size:21px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums;line-height:1;letter-spacing:-.02em;margin-top:auto} .dkpi-val small{font-family:'Inter',sans-serif;font-size:12px;font-weight:700;color:var(--muted);letter-spacing:0} .dkpi.warn::before{background:var(--warn)} .dkpi.warn .dkpi-val{color:#b3781a} .dkpi.danger::before{background:var(--danger)} .dkpi.danger .dkpi-val{color:var(--danger)} /* — сетка двух секций — */ .dash-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:16px;align-items:start} /* — карточка секции — */ .dash-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:16px 18px 6px;overflow:hidden} .dash-card:last-child{padding-bottom:16px} .dash-card-h{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:12px} .dash-card-h h2{font-size:15px;font-weight:700} .dash-card-sub{font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:700;flex:none} /* — таблица по ведомостям — */ .dash-card .tscroll{overflow-x:auto;margin:0 -18px;padding:0 18px} .dash-tbl{width:100%;border-collapse:collapse;font-size:12.5px;min-width:520px} .dash-tbl th{text-align:left;color:var(--muted);font-weight:800;padding:0 12px 9px;font-size:10px;text-transform:uppercase;letter-spacing:.045em;border-bottom:1px solid var(--line);white-space:nowrap} .dash-tbl th.r,.dash-tbl td.r{text-align:right} .dash-tbl td{padding:9px 12px;border-bottom:1px solid var(--line);vertical-align:middle} .dash-tbl tbody tr:last-child td{border-bottom:none} .dash-tbl tbody tr{transition:background .12s} .dash-tbl tbody tr:hover{background:#f6fafb} .dash-tbl td.num{font-variant-numeric:tabular-nums;font-weight:700;color:var(--ink);white-space:nowrap} .dash-tbl td.r{font-variant-numeric:tabular-nums;color:var(--ink-soft);white-space:nowrap} /* штраф — розовый, но не кричит */ .dash-tbl td.neg{color:var(--danger);font-weight:700} /* УРВ-дни — заметное янтарное число в мягкой плашке */ .dash-urv{font-variant-numeric:tabular-nums;font-weight:800;color:#b3781a;background:var(--warn-soft);border-radius:7px;padding:1px 8px;display:inline-block} /* ячейка направления с баром-рейтингом за текстом */ .dash-dept{position:relative;font-weight:700;color:var(--ink);min-width:150px;isolation:isolate} .dash-bar{position:absolute;left:0;bottom:2px;height:6px;border-radius:6px;background:linear-gradient(90deg,rgba(22,179,196,.10),rgba(22,179,196,.34));z-index:-1;transition:width .3s ease;min-width:2px} /* — список нарушителей — */ .dash-viol{display:flex;flex-direction:column;gap:11px} .dviol{display:grid;grid-template-columns:1fr;gap:6px} .dviol-name{font-weight:700;color:var(--ink);font-size:13px;display:flex;align-items:baseline;justify-content:space-between;gap:10px} .dviol-name small{font-weight:600;font-size:11px;color:var(--muted);text-align:right;flex:none} .dviol-bar{position:relative;height:8px;border-radius:6px;background:var(--bg);overflow:hidden} .dviol-bar span{position:absolute;left:0;top:0;bottom:0;border-radius:6px;background:linear-gradient(90deg,var(--warn),var(--danger));min-width:3px;transition:width .3s ease} .dviol-n{font-size:11.5px;color:var(--ink-soft);font-weight:700;font-variant-numeric:tabular-nums} /* — пустое состояние — */ .dash-empty{background:linear-gradient(180deg,var(--panel),var(--ok-soft));border:1px dashed #bfe6d3;border-radius:var(--radius-sm);padding:34px 24px;text-align:center;color:#1c7d57;font-weight:700;font-size:13.5px} /* — адаптив — */ @media (max-width:940px){ .dash-grid{grid-template-columns:1fr} .dash-kpis{grid-template-columns:repeat(3,1fr)} } @media (max-width:640px),(orientation:landscape) and (max-height:520px) and (max-width:1024px){ .dash-kpis{grid-template-columns:repeat(2,1fr)} .dash-title{font-size:20px} .dash-head{align-items:flex-start} .dash-monthf{width:100%} .dash-monthf select{flex:1;min-width:0} .dkpi-cap{min-height:0} } /* ---------- Дашборд: ссылки-провалы + фильтр нарушителей по направлению ---------- */ .dash-dept-lnk{color:inherit;text-decoration:none;position:relative;z-index:1} .dash-dept-lnk:hover{color:var(--accent-ink,#0f8d9b);text-decoration:underline;text-underline-offset:2px} .dash-urv{cursor:pointer;text-decoration:none} a.dash-urv:hover{filter:brightness(.94)} /* строка-нарушитель теперь ссылка */ a.dviol{text-decoration:none;color:inherit;cursor:pointer;border-radius:10px;transition:background .13s,transform .13s} a.dviol:hover{background:var(--accent-soft,#e6f7f9)} a.dviol:focus-visible{outline:2px solid var(--accent,#16b3c4);outline-offset:2px} .dviol-go{margin-left:8px;color:var(--accent,#16b3c4);font-weight:700;opacity:0;transform:translateX(-3px);transition:opacity .13s,transform .13s;display:inline-block} a.dviol:hover .dviol-go{opacity:1;transform:none} /* дропдаун фильтра направлений в шапке карточки */ .dash-viol-f{margin-left:auto;font-size:12.5px;font-weight:600;color:var(--ink,#1f2c38);background:var(--panel,#fff); border:1px solid var(--line-strong,#d3dde6);border-radius:9px;padding:5px 26px 5px 10px;cursor:pointer; max-width:220px;appearance:none;background-image:url("data:image/svg+xml;utf8,"); background-repeat:no-repeat;background-position:right 9px center} .dash-viol-f:hover{border-color:var(--accent,#16b3c4)} /* ═══════════════════════════════════════════════════════════════════ Матрица прав ролей — финальная отделка (перекрывает блоки выше) Язык цвета scope, чтобы «читалось» взглядом: — нет доступа → нейтрально-серое, «пусто», уходит на фон Себя свои записи → спокойный синий (info) Отдел подразделение→ янтарный (warn) — средний уровень Все вся ведомость→ насыщенная бирюза (accent) — самый «сильный» ═══════════════════════════════════════════════════════════════════ */ /* — таблица: ритм, рамки, скролл — */ .role-matrix.bitrix{min-width:680px;font-size:12.5px} .role-matrix.bitrix th,.role-matrix.bitrix td{border-color:var(--line)} .role-matrix.bitrix .rm-cell{padding:5px 6px} .tbl-scroll{scrollbar-width:thin} /* — залипающая шапка (2 ряда) — */ .role-matrix.bitrix thead th{position:sticky;z-index:5;background:#f4f8fa} .role-matrix.bitrix thead tr:first-child th{top:0} .role-matrix.bitrix thead tr:nth-child(2) th{top:39px} .role-matrix.bitrix .rm-col{padding:8px 6px 7px;vertical-align:bottom} .role-matrix.bitrix .rm-col-note{display:block;margin-top:3px;font-size:9px;font-weight:700; text-transform:uppercase;letter-spacing:.05em;color:var(--muted)} .role-matrix.bitrix .rm-sub{background:#f4f8fa;padding:4px 4px 5px} /* — залипающая колонка «Возможность» слева — */ .role-matrix.bitrix .rm-cap-h{position:sticky;left:0;z-index:7;background:#f4f8fa} .role-matrix.bitrix .rm-cap{position:sticky;left:0;z-index:3;background:#fff; box-shadow:1px 0 0 var(--line-strong)} .role-matrix.bitrix tbody tr:hover .rm-cap{background:#f3fbfc} /* — зебра + мягкий ховер строки — */ .role-matrix.bitrix tbody tr.rm-group td, .role-matrix.bitrix tbody tr.rm-bool td, .role-matrix.bitrix tbody tr:not(.rm-cat):not(.rm-ded):nth-of-type(even) td{background:#fbfcfd} .role-matrix.bitrix tbody tr.rm-ded td{background:#fff} .role-matrix.bitrix tbody tr:not(.rm-cat):hover td{background:#f3fbfc} .role-matrix.bitrix tbody tr:not(.rm-cat):hover .rm-cap{background:#eef9fa} /* — визуальная группировка пар ЧИТ./РЕД. под каждой ролью — */ .role-matrix.bitrix .rm-cell:nth-of-type(odd of .rm-cell), .role-matrix.bitrix thead th.rm-col, .role-matrix.bitrix thead th.rm-sub:nth-of-type(odd of .rm-sub){border-left:2px solid var(--line-strong)} /* — категории-разделители: спокойные полосы, а не яркая заливка — */ .role-matrix .rm-cat td{ background:linear-gradient(0deg,#eef4f7,#eef4f7),#fff; color:var(--ink-soft);font-weight:800;font-size:11px;letter-spacing:.04em;text-transform:uppercase; padding:8px 12px;border-top:1px solid var(--line-strong);border-bottom:1px solid var(--line)} .role-matrix .rm-cat-ic{margin-right:6px;font-size:12px;opacity:.85} .role-matrix .rm-cat-hint{font-weight:500;text-transform:none;color:var(--muted);letter-spacing:0;font-size:11px} /* — scope-селектор как компактная цветная «капсула» с кастомной стрелкой — */ .scope-wrap{position:relative;display:block} .scope-sel{-webkit-appearance:none;-moz-appearance:none;appearance:none; width:100%;min-width:58px;border:1px solid transparent;border-radius:8px; padding:4px 11px 4px 5px;font-size:10px;font-weight:700;line-height:1.35;letter-spacing:-.2px; cursor:pointer;text-align:left;box-shadow:none;transition:background .12s,color .12s,box-shadow .12s} .scope-sel::-ms-expand{display:none} .scope-caret{position:absolute;right:5px;top:50%;width:6px;height:6px;margin-top:-3px;pointer-events:none; border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor; transform:rotate(45deg);opacity:.5;color:var(--ink-soft)} /* цвет-семантика уровней (капсула + легенда одним языком) */ .scope-sel.sc-none{color:var(--muted);background:#f1f4f6} .scope-sel.sc-self{color:var(--info);background:var(--info-soft)} .scope-sel.sc-dept{color:#a9701a;background:var(--warn-soft)} .scope-sel.sc-all{color:#fff;background:var(--accent);box-shadow:0 1px 4px -1px rgba(22,179,196,.55)} .scope-wrap .scope-sel.sc-all ~ .scope-caret{color:#fff;opacity:.85} .scope-wrap:has(.sc-none) .scope-caret{opacity:.35} .scope-sel:hover{filter:brightness(.98)} .scope-sel.sc-none:hover{background:#e9edf1} .scope-sel:focus{outline:2px solid var(--accent);outline-offset:1px} /* легенда — те же капсулы */ .scope-legend{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:14px;font-size:11.5px;color:var(--ink-soft)} .scope-legend .sl-item{display:inline-flex;align-items:center;gap:7px} .scope-legend .sl-key{display:inline-grid;place-items:center;min-width:46px;font-size:11px;font-weight:700; border-radius:8px;padding:3px 9px;border:1px solid transparent} .sl-key.sc-none{color:var(--muted);background:#f1f4f6} .sl-key.sc-self{color:var(--info);background:var(--info-soft)} .sl-key.sc-dept{color:#a9701a;background:var(--warn-soft)} .sl-key.sc-all{color:#fff;background:var(--accent)} /* — булевы «может / всегда»: единый аккуратный вид — */ .role-matrix .rm-bool .rm-cap{font-weight:600} .role-matrix .rm-chk{display:inline-flex;align-items:center;gap:6px;text-transform:none; font-weight:600;font-size:12px;color:var(--ink-soft);cursor:pointer} .role-matrix .rm-chk input{cursor:pointer;width:15px;height:15px;accent-color:var(--accent)} .role-matrix .rm-chk-locked{color:var(--muted);cursor:default;font-weight:500} .role-matrix .rm-chk-locked input{cursor:default;opacity:.55} .role-matrix .rm-rvsel{width:100%;max-width:170px;border:1px solid var(--line-strong);border-radius:8px; padding:5px 9px;font-size:11.5px;font-weight:600;background:#fff;color:var(--ink)} /* — колонка АДМИНИСТРАТОР: «всегда полный», приглушена, не отвлекает — */ .role-matrix.bitrix .rm-col-admin{background:#f6f8f9} .role-matrix.bitrix .rm-sub-admin{background:#f6f8f9;color:var(--muted)} .role-matrix.bitrix td.rm-cell-admin{background:#f8fafb} .role-matrix.bitrix tbody tr:not(.rm-cat):nth-of-type(even) td.rm-cell-admin{background:#f4f7f8} .role-matrix.bitrix tbody tr:not(.rm-cat):hover td.rm-cell-admin{background:#eef4f6} .role-matrix.bitrix .rm-cell-admin .scope-sel{opacity:.62;pointer-events:none} .role-matrix.bitrix .rm-cell-admin .scope-caret{display:none} /* — узкий экран: таблица скроллится внутри .tbl-scroll, страница — нет — */ @media(max-width:720px),(orientation:landscape) and (max-height:520px) and (max-width:1024px){ .role-matrix.bitrix{font-size:12px} .role-matrix.bitrix .rm-cap{max-width:150px;white-space:normal} .scope-legend{gap:6px 12px} } /* матрица ролей: единая ширина ячеек скоупа, чтобы капсулы «Себя»/«Отдел» не обрезались */ .role-matrix.bitrix .rm-cell{min-width:66px} .role-matrix.bitrix th.rm-sub{min-width:66px} /* ============================================================ ФИНБЛОК · маршрут-чипы статусов + чипы направлений со счётчиками (единый компонент для «К оплате» и «Авансы») ============================================================ */ /* «На оплате» / «Ждут оплаты» — нейтрально-акцентная (синяя стадия управляющего) */ .rv-chip.stg-mgr .rv-n{background:color-mix(in srgb,var(--stg-mgr) 15%,#fff);color:var(--stg-mgr)} .rv-chip.stg-mgr.is-active{background:var(--stg-mgr);border-color:transparent;box-shadow:0 4px 12px color-mix(in srgb,var(--stg-mgr) 40%,transparent)} /* маршрут статусов — ощутимо отделён от чипов направлений снизу */ .fin-route{margin:16px 0 10px} /* ленты чипов направлений: аккуратный ритм, счётчик прижат к концу */ .rv-cochips{margin:0 0 16px} .cochip.has-cnt{padding-right:9px} .cochip.has-cnt .co-name{margin-right:1px} /* пилюля-счётчик «на оплату/ждут оплаты» */ .co-cnt{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px; font-size:11px;font-weight:800;font-variant-numeric:tabular-nums; background:color-mix(in srgb,var(--accent) 14%,#fff);color:var(--accent-ink);line-height:1} .cochip.is-active .co-cnt{background:rgba(255,255,255,.26);color:#fff} .co-cnt.is-zero{background:#f1f4f6;color:#aeb7bc;font-weight:700} .cochip.is-active .co-cnt.is-zero{background:rgba(255,255,255,.2);color:#fff} /* направления без ожидающих оплаты — приглушены, но видимы (не прячем) */ .cochip.co-dim{opacity:.55} .cochip.co-dim:hover{opacity:1} .cochip.co-dim.is-active{opacity:1} /* ============ КОМПАКТНАЯ ВЕРХНЯЯ ПАНЕЛЬ ВЕДОМОСТИ (в ~3× меньше) + ЭКСПОРТ EXCEL ============ */ .led-top{align-items:center;margin-bottom:10px;gap:12px} .led-top h1{font-size:15px;margin:0} .led-top-l{flex-direction:row;align-items:center;gap:8px;flex-wrap:wrap} .led-top-l .back{margin-bottom:0;font-size:11.5px} .led-top-l .period-btn{padding:4px 9px;font-size:12px} /* кнопки правой части — единый компактный размер */ .led-top-r .btn,.led-top-r .daysum-btn,.led-top-r .hrs-filter-btn,.led-top-r .led-fold-btn,.led-top-r .payall-btn,.led-top-r .xls-btn{ padding:5px 10px;font-size:11.5px;border-radius:8px;line-height:1.15} .led-top-r .daysum-btn .dsb-ico{font-size:11px} .payall-btn{font-size:12px !important;padding:6px 12px !important} /* зелёная кнопка экспорта в Excel + меню */ .xls-exp{position:relative} .xls-btn{display:inline-flex;align-items:center;gap:6px;background:#eaf7f0;border:1.5px solid #2f9e63;color:#1d7c4d;font-weight:700;cursor:pointer;white-space:nowrap} .xls-btn:hover{background:#dcf1e6;border-color:#1d7c4d} .xls-btn .xls-ico{width:16px;height:16px;flex:none} .xls-btn .caret{font-size:9px;opacity:.7} .xls-menu{position:absolute;top:calc(100% + 6px);right:0;min-width:230px;background:#fff;border:1px solid var(--line);border-radius:11px;box-shadow:0 10px 30px rgba(15,30,40,.16);padding:6px;z-index:60} .xls-item{display:flex;align-items:center;gap:9px;padding:9px 11px;border-radius:8px;font-size:12.5px;font-weight:600;color:var(--ink);text-decoration:none;white-space:nowrap} .xls-item:hover{background:#eaf7f0;color:#1d7c4d} .xls-item .xls-mi{font-size:14px;flex:none} /* маленькая кнопка экспорта для сотрудника (Моя ведомость) */ .xls-btn.sm{padding:6px 12px;font-size:12.5px;border-radius:9px} /* ================= УРВ (учёт рабочего времени) — Этап 1/2 ================= */ .urv{--urv-ok:#12a594;--urv-ok-soft:#e9f8f5;--urv-viol:#e0563e;--urv-viol-soft:#fdeee9} .urv-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;margin-bottom:14px} .urv-title h1{margin:0;font-size:22px;font-weight:800;letter-spacing:.01em} .urv-sub{font-size:12.5px;color:var(--muted);margin-top:3px} .urv-viol-dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--urv-viol);vertical-align:middle;margin:0 1px} .urv-period{display:flex;align-items:center;gap:4px;background:var(--panel,#f7faf9);border:1px solid var(--line);border-radius:12px;padding:4px} .urv-nav{width:30px;height:30px;display:grid;place-items:center;border-radius:9px;color:var(--ink);text-decoration:none;font-size:20px;font-weight:700;line-height:1} .urv-nav:hover{background:var(--accent-soft,#eafaf6);color:var(--accent-ink,#0d7a6b)} .urv-period-lbl{font-weight:800;font-size:14px;min-width:130px;text-align:center} .urv-controls{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:12px} .urv-depts{display:flex;gap:7px;flex-wrap:wrap} .urv-chip{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:10px;background:var(--panel,#f7faf9);border:1px solid var(--line);font-size:12.5px;font-weight:600;color:var(--ink);text-decoration:none;transition:border-color .15s,color .15s,transform .1s} .urv-chip:hover{border-color:var(--accent);color:var(--accent-ink);transform:translateY(-1px)} .urv-chip.is-active{background:var(--accent);border-color:var(--accent);color:#fff} .urv-chip-n{font-size:11px;font-weight:800;opacity:.75} .urv-summary{display:flex;gap:16px;font-size:13px;color:var(--muted)} .urv-kpi b{color:var(--ink);font-size:15px;font-weight:800} .urv-kpi-viol b{color:var(--urv-viol)} .urv-empty{padding:40px 20px;text-align:center;color:var(--muted);background:var(--panel,#f7faf9);border:1px solid var(--line);border-radius:14px} .urv-tbl-wrap{overflow:auto;border:1px solid var(--line);border-radius:14px;background:#fff;-webkit-overflow-scrolling:touch} .urv-tbl{border-collapse:separate;border-spacing:0;width:100%;font-size:12px} .urv-tbl th,.urv-tbl td{border-bottom:1px solid #eef2f4;border-right:1px solid #eef2f4} .urv-tbl thead th{position:sticky;top:0;z-index:3;background:#f4f7f9;font-weight:700;color:var(--muted);padding:6px 4px;text-align:center;white-space:nowrap} .urv-name-h,.urv-name{position:sticky;left:0;z-index:2;background:#fff;text-align:left!important;min-width:186px;max-width:220px} .urv-tbl thead th.urv-name-h{z-index:4;background:#f4f7f9} .urv-name{padding:7px 12px;box-shadow:2px 0 6px -4px rgba(22,50,63,.18)} .urv-name b{display:block;font-size:12.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .urv-name-sub{display:block;font-size:10.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .urv-day-h{min-width:34px} .urv-day-h .urv-dn{display:block;font-size:12px;font-weight:800;color:var(--ink)} .urv-day-h .urv-dw{display:block;font-size:9px;text-transform:uppercase;letter-spacing:.02em} .urv-day-h.wknd{background:#eef1f4}.urv-day-h.wknd .urv-dn{color:var(--muted)} .urv-day-h.today{background:var(--accent-soft,#eafaf6)}.urv-day-h.today .urv-dn{color:var(--accent-ink,#0d7a6b)} .urv-cell{text-align:center;vertical-align:middle;height:38px;padding:2px;min-width:34px} .urv-cell.wknd{background:#fafbfc} .urv-cell.today{box-shadow:inset 0 0 0 2px var(--accent-soft,#eafaf6)} .urv-cell.ok{background:var(--urv-ok-soft)} .urv-cell.viol{background:var(--urv-viol-soft)} .urv-cell[data-urv]{cursor:pointer;transition:filter .12s} .urv-cell[data-urv]:hover{filter:brightness(.96)} .urv-cell[data-urv]:focus{outline:2px solid var(--accent);outline-offset:-2px} .urv-mark{display:inline-block;font-weight:800;line-height:1} .urv-mark.ok{color:var(--urv-ok)} .urv-mark.viol{color:#fff;background:var(--urv-viol);width:15px;height:15px;border-radius:50%;font-size:11px} .urv-h{display:block;font-size:10.5px;font-weight:700;color:var(--ink);margin-top:1px} .urv-io{display:block;font-size:8.5px;color:var(--muted);white-space:nowrap;margin-top:1px} .urv-sum-h,.urv-sum{text-align:center;min-width:56px;font-weight:800;background:#fafcfd} .urv-sum{padding:6px 8px;color:var(--ink)} .urv-sum.has-viol{color:var(--urv-viol)} /* тап-попап детали дня (Этап 2) */ .urv-pop-back{position:fixed;inset:0;background:rgba(20,35,45,.28);z-index:120;display:none;align-items:center;justify-content:center;padding:16px} .urv-pop-back.open{display:flex} .urv-pop{background:#fff;border-radius:16px;box-shadow:0 20px 60px rgba(22,50,63,.28);width:340px;max-width:94vw;overflow:hidden;animation:urvPopIn .16s ease} @keyframes urvPopIn{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}} .urv-pop-h{padding:16px 18px 12px;border-bottom:1px solid var(--line)} .urv-pop-h .d{font-size:12px;color:var(--muted);font-weight:600} .urv-pop-h .n{font-size:16px;font-weight:800;margin-top:1px} .urv-pop-badge{display:inline-block;margin-top:7px;font-size:11px;font-weight:800;padding:3px 10px;border-radius:20px} .urv-pop-badge.ok{background:#e9f8f5;color:#0e9e90} .urv-pop-badge.viol{background:#fdeee9;color:#c0402a} .urv-pop-body{padding:14px 18px 18px} .urv-pop-row{display:flex;justify-content:space-between;gap:14px;padding:7px 0;border-bottom:1px dashed var(--line);font-size:13.5px} .urv-pop-row:last-child{border-bottom:none} .urv-pop-row .k{color:var(--muted)} .urv-pop-row .v{font-weight:700;font-variant-numeric:tabular-nums} .urv-pop-row .v.neg{color:#c0402a} .urv-pop-note{margin-top:10px;font-size:12.5px;color:#4a5a66;background:#f6f9fb;border-radius:10px;padding:9px 12px;line-height:1.45} .urv-pop-x{position:absolute;top:12px;right:14px;background:none;border:none;font-size:22px;color:var(--muted);cursor:pointer;line-height:1} .urv-pop-x:hover{color:var(--ink)} /* УРВ Этап 3 — фильтры и режимы отображения */ .urv-filters{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:12px} .urv-search{display:flex;align-items:center;gap:7px;background:#fff;border:1.5px solid var(--line);border-radius:11px;padding:7px 12px;color:var(--muted);min-width:210px;flex:0 1 260px} .urv-search input{border:none;outline:none;font:inherit;font-size:13px;color:var(--ink);width:100%;background:transparent} .urv-ftog{font:inherit;font-size:12.5px;font-weight:600;color:var(--ink);background:#fff;border:1.5px solid var(--line);border-radius:11px;padding:7px 13px;cursor:pointer;transition:all .15s} .urv-ftog:hover{border-color:var(--urv-viol,#e0563e)} .urv-ftog.on{background:var(--urv-viol,#e0563e);border-color:var(--urv-viol,#e0563e);color:#fff} .urv-modes{display:inline-flex;background:var(--panel,#f1f4f6);border:1px solid var(--line);border-radius:11px;padding:2px} .urv-mode{font:inherit;font-size:12.5px;font-weight:700;color:var(--muted);background:transparent;border:none;border-radius:9px;padding:6px 13px;cursor:pointer;transition:all .15s} .urv-mode.is-active{background:#fff;color:var(--accent-ink,#0d7a6b);box-shadow:0 1px 4px rgba(22,50,63,.1)} .urv-shown{font-size:12px;color:var(--muted);margin-left:auto} .urv-row.hidden{display:none} /* режимы: по умолчанию часы (io скрыт); mode-io — наоборот */ .urv .urv-io{display:none} .urv.mode-io .urv-io{display:block} .urv.mode-io .urv-h{display:none} /* ================= УРВ Этап 4 — МОБИЛКА (карточки-аккордеоны + мини-календарь) ================= */ .urv-cards{display:none} .urv-card{background:#fff;border:1px solid var(--line);border-radius:16px;margin-bottom:10px;overflow:hidden;box-shadow:0 1px 3px rgba(22,50,63,.05)} .urv-card.open{box-shadow:0 8px 24px -10px rgba(22,50,63,.22);border-color:#d5e3e0} .uc-head{width:100%;display:flex;align-items:center;gap:12px;padding:13px 14px;background:none;border:none;cursor:pointer;text-align:left;font:inherit} .uc-av{flex:none;width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#19E0C9,#0E9E90);color:#fff;font-weight:800;font-size:14px;display:grid;place-items:center;letter-spacing:.02em} .uc-id{flex:1;min-width:0} .uc-id b{display:block;font-size:15px;font-weight:700;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .uc-id .uc-sub{display:block;font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px} .uc-stats{flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:3px} .uc-stats .uc-h{font-size:13px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums} .uc-stats .uc-v{font-size:10.5px;font-weight:700;color:var(--muted);background:var(--panel,#f1f4f6);border-radius:20px;padding:2px 9px} .uc-stats .uc-v.has{color:#fff;background:var(--urv-viol,#e0563e)} .uc-caret{flex:none;color:var(--muted);font-size:13px;transition:transform .2s;margin-left:2px} .urv-card.open .uc-caret{transform:rotate(180deg)} .uc-cal{padding:4px 14px 16px} .uc-wd{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;margin-bottom:6px} .uc-wd span{text-align:center;font-size:10px;font-weight:700;color:var(--muted);text-transform:uppercase} .uc-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:5px} .uc-day{aspect-ratio:1;border:1px solid #eef2f4;border-radius:9px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;background:#fafbfc;font:inherit;padding:0;min-height:38px} .uc-day.empty{border:none;background:none} .uc-day.wknd{background:#f4f6f8} .uc-day.today{outline:2px solid var(--accent,#16b3c4);outline-offset:-2px} .uc-day.ok{background:var(--urv-ok-soft,#e9f8f5);border-color:#c9ebe4} .uc-day.viol{background:var(--urv-viol,#e0563e);border-color:var(--urv-viol,#e0563e)} .uc-day .ucd-n{font-size:11px;font-weight:700;color:var(--ink);line-height:1.1} .uc-day.viol .ucd-n{color:#fff} .uc-day .ucd-h{font-size:10px;font-weight:800;color:var(--urv-ok,#0e9e90);line-height:1.1} .uc-day.viol .ucd-h{color:#fff} button.uc-day{cursor:pointer;transition:transform .1s} button.uc-day:active{transform:scale(.92)} @media (max-width:640px),(orientation:landscape) and (max-height:520px) and (max-width:1024px){ .page{padding:14px 12px 60px} .urv-head{flex-direction:column;gap:10px} .urv-title h1{font-size:20px} .urv-period{align-self:stretch;justify-content:space-between} .urv-period-lbl{flex:1} .urv-controls{flex-direction:column;align-items:stretch;gap:10px} .urv-depts{overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch;padding-bottom:2px} .urv-depts .urv-chip{white-space:nowrap} .urv-summary{justify-content:space-between} /* липкая шапка фильтров */ .urv-filters{position:sticky;top:0;z-index:8;background:var(--bg,#f4f6f9);padding:10px 0;margin:0 -12px 6px;padding-left:12px;padding-right:12px;box-shadow:0 4px 10px -8px rgba(0,0,0,.2)} .urv-search{flex:1 1 100%} .urv-modes{flex:1} .urv-mode{flex:1;text-align:center} .urv-shown{width:100%;margin-left:0;text-align:center} /* таблица прячется, карточки показываются */ .urv-tbl-wrap{display:none} .urv-cards{display:block} /* попап → bottom-sheet */ .urv-pop-back{align-items:flex-end;padding:0} .urv-pop{width:100%;max-width:none;border-radius:20px 20px 0 0;animation:urvSheetIn .22s ease} .urv-pop-body{padding-bottom:26px} } @keyframes urvSheetIn{from{transform:translateY(100%)}to{transform:none}} /* УРВ — хитмап месяца в свёрнутой карточке (видеть всех разом) + «Развернуть всё» */ .uc-strip{display:flex;gap:2px;padding:0 14px 13px} .uc-strip .us-d{flex:1;height:7px;border-radius:2px;background:#e9edf0} .uc-strip .us-d.wknd{background:#dfe4e8} .uc-strip .us-d.ok{background:#5cc9b8} .uc-strip .us-d.viol{background:var(--urv-viol,#e0563e)} .urv-card.open .uc-strip{display:none} .urv-expand{display:inline-flex;align-items:center;gap:6px;font:inherit;font-size:12.5px;font-weight:700;color:var(--accent-ink,#0d7a6b);background:var(--accent-soft,#eafaf6);border:1px solid #bfe9e0;border-radius:11px;padding:7px 13px;cursor:pointer;transition:all .15s} .urv-expand:hover{background:#d7f4ec} .urv-expand.on{background:var(--accent,#12a594);border-color:var(--accent,#12a594);color:#fff} .urv-expand .ue-ico{font-size:14px;line-height:1} /* на десктопе «Развернуть всё» не нужна — там таблица показывает всех */ @media (min-width:641px){.urv-expand{display:none}} /* ================= ВЕДОМОСТЬ — мобилка: карточки по сотрудникам (транспонирование таблицы) ================= */ .led-mob{display:none} .lm-card{background:#fff;border:1px solid var(--line);border-radius:14px;margin-bottom:10px;overflow:hidden;box-shadow:0 1px 3px rgba(22,50,63,.05)} .lm-card.open{box-shadow:0 8px 24px -10px rgba(22,50,63,.2);border-color:#d5e3e0} .lm-head{width:100%;display:flex;align-items:center;gap:11px;padding:12px 13px;background:none;border:none;text-align:left;font:inherit;cursor:pointer} .lm-av{flex:none;width:38px;height:38px;border-radius:50%;background:linear-gradient(135deg,#19E0C9,#0E9E90);color:#fff;font-weight:800;font-size:13px;display:grid;place-items:center} .lm-id{flex:1;min-width:0} .lm-id b{display:block;font-size:14.5px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .lm-id .lm-sub{display:block;font-size:11px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .lm-stat{flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:3px;max-width:44%} .lm-pay{font-size:14px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap} .lm-chip{font-size:10px;font-weight:700;color:var(--muted);background:var(--panel,#f1f4f6);border-radius:20px;padding:2px 8px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .lm-caret{flex:none;color:var(--muted);font-size:13px;transition:transform .2s} .lm-card.open .lm-caret{transform:rotate(180deg)} .lm-body{padding:2px 13px 12px} .lm-sec{font-size:10.5px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--accent-ink,#0d7a6b);background:var(--accent-soft,#eafaf6);margin:10px -13px 4px;padding:6px 13px} .lm-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 2px;border-bottom:1px solid #f1f5f7;min-height:40px} .lm-row:last-child{border-bottom:none} .lm-lbl{font-size:13px;color:#4a5a66;flex:1;min-width:0} .lm-v{font-size:14px;font-weight:600;color:var(--ink);font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap} .lm-inp{width:132px;flex:none;height:38px;border:1.5px solid var(--line);border-radius:9px;padding:0 11px;font:inherit;font-size:15px;text-align:right;color:var(--ink);font-variant-numeric:tabular-nums} .lm-inp:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft,#eafaf6)} .lm-row.lm-tap{cursor:pointer} .lm-row.lm-tap:active{background:var(--accent-soft,#eafaf6)} .lm-row.lm-tap .lm-v::after{content:"›";color:var(--muted);margin-left:8px;font-weight:700} @media (max-width:640px),(orientation:landscape) and (max-height:520px) and (max-width:1024px){ .ledger-scroll{display:none} /* десктоп-таблица прячется, но остаётся в DOM (источник данных/редактирования) */ .led-mob{display:block} /* шапка направления и кнопки отправки — в столбик, во всю ширину */ .dept-head{flex-direction:column;align-items:stretch;gap:10px} .dept-head-act{justify-content:stretch;flex-wrap:wrap;gap:7px} .dept-head-act .led-send3{display:flex;flex-wrap:wrap;gap:7px;width:100%} .dept-head-act .btn.xs{flex:1 1 auto;min-height:38px;font-size:12.5px} } /* УРВ — шестерёнка второстепенных фильтров (компактно на мобилке) */ .urv-gear{display:none;align-items:center;justify-content:center;width:40px;height:40px;flex:none;border:1.5px solid var(--line);border-radius:11px;background:#fff;font-size:17px;cursor:pointer;color:var(--muted)} .urv-gear:hover,.urv-filters.adv-open .urv-gear{border-color:var(--accent);color:var(--accent-ink)} .urv-adv{display:contents} @media (max-width:640px),(orientation:landscape) and (max-height:520px) and (max-width:1024px){ .urv-head{gap:6px} .urv-title h1{font-size:19px} .urv-sub{display:none} /* подсказку прячем — она есть в попапе */ .urv-controls{gap:8px} .urv-summary{gap:12px;font-size:12px} .urv-filters{gap:8px} .urv-gear{display:inline-flex} .urv-search{flex:1 1 auto;min-width:0} /* второстепенные фильтры — под шестерёнку, разворачиваются на всю ширину */ .urv-adv{display:none;width:100%;order:5;gap:8px;flex-wrap:wrap} .urv-filters.adv-open .urv-adv{display:flex} .urv-adv .urv-ftog{flex:1 1 100%} .urv-adv .urv-modes{flex:1 1 100%} .urv-adv .urv-mode{flex:1} .urv-expand{order:4} .urv-shown{order:6} } /* ================= ОВЗП — окно массового заполнения (фин-блок) ================= */ .ovzp-btn{border-color:#1d7c4d;color:#1d7c4d;background:#fff} .ovzp-btn:hover{background:#1d7c4d;color:#fff} .ovzp-back{position:fixed;inset:0;background:rgba(18,34,44,.4);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);z-index:130;display:none;align-items:center;justify-content:center;padding:16px} .ovzp-back.open{display:flex} .ovzp-win{background:var(--panel);border-radius:16px;box-shadow:0 28px 72px -16px rgba(14,45,58,.42),0 0 0 1px rgba(14,45,58,.05);width:500px;max-width:96vw;max-height:86vh;display:flex;flex-direction:column;overflow:hidden;animation:urvPopIn .16s cubic-bezier(.2,.9,.3,1)} /* шапка */ .ovzp-head{display:flex;align-items:center;gap:10px;padding:11px 14px;background:linear-gradient(180deg,var(--accent-soft) 0%,rgba(230,247,249,0) 100%);border-bottom:1px solid var(--line)} .ovzp-ic{flex:none;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;background:var(--accent);color:#fff;box-shadow:0 5px 12px -5px rgba(22,179,196,.6)} .ovzp-ic svg{width:16px;height:16px} .ovzp-htx{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.15} .ovzp-head b{font-size:14.5px;font-weight:800;letter-spacing:-.01em;color:var(--ink)} .ovzp-dept{font-size:11.5px;color:var(--ink-soft);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .ovzp-dept:empty{display:none} .ovzp-x{flex:none;width:28px;height:28px;border-radius:8px;background:none;border:none;font-size:20px;color:var(--muted);cursor:pointer;line-height:1;display:grid;place-items:center;transition:background .14s,color .14s} .ovzp-x:hover{color:var(--ink);background:rgba(14,45,58,.06)} /* вкладки */ .ovzp-fields{display:flex;flex-wrap:wrap;gap:5px;padding:8px 14px;border-bottom:1px solid var(--line);background:var(--bg)} .ovzp-chip{display:inline-flex;align-items:center;gap:5px;font:inherit;font-size:11.5px;font-weight:700;color:var(--ink-soft);background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:5px 10px;cursor:pointer;transition:color .14s,background .14s,border-color .14s} .ovzp-chip:hover{border-color:var(--accent);color:var(--accent-ink)} .ovzp-chip.on{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:0 3px 9px -3px rgba(22,179,196,.5)} .ovzp-chip-n{font-size:10px;font-weight:800;background:var(--accent-soft);color:var(--accent-ink);border-radius:6px;padding:0 4px;min-width:15px;text-align:center;line-height:1.5} .ovzp-chip.on .ovzp-chip-n{background:rgba(255,255,255,.26);color:#fff} /* тело */ .ovzp-body{overflow-y:auto;padding:0 14px 6px;flex:1} .ovzp-colhead{position:sticky;top:0;z-index:1;display:grid;grid-template-columns:1fr var(--ovc,104px) var(--ovc,104px);gap:8px;padding:8px 0 6px;background:var(--panel);border-bottom:1px solid var(--line-strong)} .ovzp-colhead span{font-size:9.5px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--accent-ink);text-align:right} .ovzp-colhead span:first-child{text-align:left;color:var(--muted)} .ovzp-row2{display:grid;grid-template-columns:1fr var(--ovc,104px) var(--ovc,104px);gap:8px;align-items:center;min-height:38px;padding:3px 0;border-bottom:1px solid var(--line);transition:background .12s} .ovzp-row2:last-child{border-bottom:none} .ovzp-row2:nth-of-type(even){background:rgba(15,141,155,.028)} .ovzp-row2:hover{background:var(--accent-soft)} .ovzp-colhead .rub{color:var(--muted);font-weight:700;margin-left:1px} .ovzp-cnt{font-size:10.5px;font-weight:800;color:var(--accent-ink);background:var(--accent-soft);border-radius:6px;padding:1px 6px;white-space:nowrap} .ovzp-who{display:flex;align-items:center;gap:8px;min-width:0} .ovzp-av{flex:none;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent-ink);font-size:10px;font-weight:800} .ovzp-nm{font-size:12.5px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .ovzp-inp{width:100%;height:32px;border:1px solid var(--line);border-radius:8px;padding:0 9px;font:inherit;font-size:13px;font-weight:600;text-align:right;font-variant-numeric:tabular-nums;color:var(--ink);background:var(--bg);transition:border-color .12s,box-shadow .12s,background .12s} .ovzp-inp:hover{border-color:var(--line-strong)} .ovzp-inp:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2.5px var(--accent-soft);background:var(--panel)} .ovzp-inp.filled{border-color:var(--accent);background:var(--panel);color:var(--accent-ink)} .ovzp-lock{text-align:center;color:var(--muted);font-size:14px} .ovzp-empty{padding:22px;text-align:center;color:var(--muted)} /* подвал */ .ovzp-foot{display:flex;align-items:center;gap:9px;padding:10px 14px;border-top:1px solid var(--line);background:var(--bg)} .ovzp-hint{flex:1;font-size:11px;color:var(--muted);line-height:1.3} .ovzp-foot .btn{padding:7px 14px;font-size:12.5px} @media (max-width:640px),(orientation:landscape) and (max-height:520px) and (max-width:1024px){ .ovzp-win{width:100%;max-width:none;border-radius:18px 18px 0 0;max-height:92vh;--ovc:96px} .ovzp-back{align-items:flex-end;padding:0} .ovzp-nm{font-size:12.5px} .ovzp-inp{font-size:13.5px;height:34px} .ovzp-foot{flex-wrap:wrap}.ovzp-hint{flex:1 1 100%;order:3} } /* мобильная ведомость — правый блок ячейки (комментарий + значение/инпут) и кнопки действий */ .lm-right{display:flex;align-items:center;gap:8px;flex:none} .lm-cmt{flex:none;width:32px;height:32px;border:1px solid var(--line);border-radius:8px;background:#fff;font-size:15px;cursor:pointer;line-height:1;color:var(--muted)} .lm-cmt:active{background:var(--accent-soft,#eafaf6)} .lm-acts{display:flex;flex-wrap:wrap;gap:7px;padding:2px 2px 10px;margin-top:-2px;border-bottom:1px solid #f1f5f7} .lm-act{flex:1 1 auto;min-height:38px;border:1.5px solid var(--line);border-radius:10px;background:#fff;font:inherit;font-size:12.5px;font-weight:700;cursor:pointer;padding:0 12px;white-space:nowrap} .lm-act.send{border-color:var(--accent,#12a594);color:var(--accent-ink,#0d7a6b)} .lm-act.send:active{background:var(--accent,#12a594);color:#fff} .lm-act.ok{border-color:#1c8f63;color:#1c8f63} .lm-act.no{border-color:#d9705a;color:#c0563e} .lm-act.recall{border-color:#8b5cf6;color:#6d3fd6} .lm-act.pay{border-color:#e8a33d;color:#8a6d1f;background:var(--warn-soft,#fbf1de)} /* поповер комментария/оплаты на мобилке — bottom-sheet (иначе позиционируется от скрытой ячейки) */ @media (max-width:640px),(orientation:landscape) and (max-height:520px) and (max-width:1024px){ .cmt-pop{position:fixed!important;left:0!important;right:0!important;bottom:0!important;top:auto!important;width:100%!important;max-width:none;max-height:88vh;overflow-y:auto;overscroll-behavior:contain;border-radius:18px 18px 0 0;z-index:130;box-shadow:0 -8px 40px rgba(20,40,50,.25);padding-bottom:env(safe-area-inset-bottom,0)} .cmt-head{cursor:default} .cmt-body{padding:14px 16px 22px} .cmt-body textarea{min-height:70px;font-size:15px} } /* «Согласование» — явный статус-под-фильтр внутри раздела (Авансы) */ .rv-secfilter{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 10px} .rv-sf{display:inline-flex;align-items:center;gap:6px;font:inherit;font-size:12px;font-weight:700;color:var(--ink);background:var(--panel,#f7faf9);border:1px solid var(--line);border-radius:11px;padding:5px 11px;cursor:pointer;transition:all .14s} .rv-sf:hover{border-color:var(--accent)} .rv-sf.on{background:var(--accent);border-color:var(--accent);color:#fff} .rv-sf-n{font-size:10.5px;font-weight:800;background:var(--accent-soft,#eafaf6);color:var(--accent-ink,#0d7a6b);border-radius:8px;padding:0 5px;min-width:15px;text-align:center} .rv-sf.on .rv-sf-n{background:rgba(255,255,255,.28);color:#fff} .rv-sf.st-rejected.on,.rv-sf.sf-rej.on{background:var(--rej,#d9534f);border-color:var(--rej,#d9534f)} .rv-sf.st-approved.on,.rv-sf.st-m_approved.on,.rv-sf.sf-mine.on,.rv-sf.sf-paid.on{background:#1c8f63;border-color:#1c8f63} .rv-sf.is-zero{opacity:.5} .rv-sf.is-zero .rv-sf-n{background:transparent;color:var(--muted)} /* «Согласование» — мобильная полировка: компактная шапка + колонка действий всегда под рукой */ @media (max-width:640px),(orientation:landscape) and (max-height:520px) and (max-width:1024px){ .rv-head-ic{display:none} .rv-head h1{font-size:19px} .rv-head > div .muted{font-size:11px} /* последняя колонка (Действия) липнет справа при горизонтальном скролле таблицы — кнопки ✓/💸/↩ всегда видны */ .rv-tbl tr.rv-emp > td:last-child, .rv-tbl tr.rv-row > td:last-child{position:sticky;right:0;background:#fff;box-shadow:-5px 0 9px -5px rgba(20,50,60,.16)} .rv-tbl tr.rv-emp.is-wait > td:last-child,.rv-tbl tr.rv-row.is-wait > td:last-child{background:#fffdf5} .rv-tbl thead th:last-child{position:sticky;right:0;z-index:3;background:#f4f7f9} .rv-tbl th,.rv-tbl td{padding-left:9px;padding-right:9px} } /* ============================================================ v68 — единый слой очередей/таблиц (Согласование, Зарплаты·оплата, Официальные ИП, Авансы, Бонусы, УРВ). Правки по замерам реального экрана: подписи KPI обрезались (нужно 128px, было 73), «хром» съедал 59% экрана, числа переносились на 2 строки, чипы направлений уезжали без индикации. ============================================================ */ /* KPI-плитки: подпись переносится (не обрезается), карточка ниже */ .rv-kpis{gap:7px;margin:11px 0 10px} .rv-kpi{padding:9px 11px 9px;gap:5px;border-radius:12px} .rv-kpi-top{align-items:flex-start;min-height:0} .rv-kpi-lbl{white-space:normal;overflow:visible;text-overflow:clip;font-size:9.5px;line-height:1.2;letter-spacing:.03em; display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;min-height:calc(2 * 1.2em)} .rv-kpi-n{font-size:20px} .rv-kpi-bar{height:3px} /* Числа в очередях — одной строкой (было: «21 820 ₽» ломалось надвое, строки прыгали) */ .rv-tbl td.num,.rv-tbl th.num{white-space:nowrap} /* Полоса прокрутки у чипов направлений — видимая подсказка, что список едет вбок */ .cofilter{scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent} .cofilter::-webkit-scrollbar{height:5px} .cofilter::-webkit-scrollbar-thumb{background:var(--line-strong);border-radius:999px} .cofilter::-webkit-scrollbar-track{background:transparent} /* Панель массовых действий и селекторы — чуть компактнее (освобождаем экран под контент) */ .rv-selectors{margin-bottom:9px} /* Шапка раздела и панель массовых действий — компактнее: на экране 720px «хром» занимал 553px (77%), контента почти не было видно. Уменьшаем без потери смысла. */ .rv-head{gap:11px} .rv-head-ic{width:36px;height:36px;border-radius:11px;font-size:18px} .rv-head h1{font-size:20px;margin-bottom:2px} .page-head.rv-head{margin-bottom:8px} .rv-bulk{padding:6px 12px;margin-bottom:9px;gap:7px} .rv-bulk-txt{height:30px;padding:0 12px;font-size:12px} .rv-bulk-b{width:28px;height:28px} /* На тач-устройствах цели остаются крупными (правило 44px из UX-гайда) */ @media (hover:none) and (pointer:coarse){ .rv-bulk-txt{height:38px;padding:0 14px} .rv-bulk-b{width:38px;min-width:38px;height:38px;flex:none} /* flex ужимал ширину до 27px */ .rev-round{width:38px;min-width:38px;height:38px;flex:none} } /* Пункт меню с бейджем: длинная подпись не должна ломать пункт на 2 строки, а бейдж — вылезать за край сайдбара (ловилось на «Официальные ИП»). */ .nav-link{min-width:0} .nav-link>span:not(.nav-ico):not(.badge){flex:1 1 auto;min-width:0;overflow:hidden} .nav-link .badge{flex:none;margin-left:auto} /* Чипы статуса в «Авансах»/«Бонусах» — одной строкой («Ждёт\nоплаты» ломался надвое) */ .adv-chip{white-space:nowrap} /* Пометки в списке ведомостей (админка): что реально применяется, а что висит мёртвым грузом. Единственная рабочая связь — направление.template_id; всё прочее в расчётах не участвует. */ .tmpl-warn{display:inline-block;margin-left:8px;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.03em; color:var(--danger,#e8607f);background:var(--danger-soft,#fdeef2);border-radius:6px;padding:2px 7px;white-space:nowrap;vertical-align:middle} .tmpl-warn.is-dup{color:#9a6b16;background:var(--warn-soft,#fbf1de)} .tmpl-warn.is-multi{color:var(--accent-ink);background:var(--accent-soft);text-transform:none;font-weight:700} .tmpl-dead td{background:rgba(232,96,127,.035)} .tmpl-deadfilter{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:700;color:var(--ink-soft); background:#fff;border:1px solid var(--line);border-radius:9px;padding:6px 11px;cursor:pointer} .tmpl-deadfilter:hover{border-color:var(--accent)} .tmpl-deadfilter input{accent-color:var(--accent);margin:0} /* ============================================================ v69 — мобильный проход (замерено на 375px): страница уезжала вбок на 141px — шапка не помещалась (бургер 38 + бренд 139 + правый блок 311 = 516 при экране 375). ============================================================ */ @media (max-width:560px){ /* «Войти как» — админский переключатель для демо/отладки: на телефоне занимает 151px и ломает всю страницу. Скрываем — на десктопе остаётся как был. */ .actor-sw{display:none} .brand-sub{display:none} /* подзаголовок бренда — лишний на узком экране */ .hdr{padding:0 12px} .hdr-right{gap:8px} .who{padding-left:10px} } /* Тач-цели: правило было завязано только на pointer:coarse и не срабатывало на узких экранах. Дублируем по ширине — кнопки массовых действий и круглые действия остаются нажимаемыми. */ @media (max-width:640px){ .rv-bulk-txt{height:38px;padding:0 14px} .rv-bulk-b{width:38px;min-width:38px;height:38px;flex:none} /* flex ужимал ширину до 27px */ .rev-round{width:38px;min-width:38px;height:38px;flex:none} .flt-dd-btn{min-height:38px} } /* Компактные кнопки .btn.xs (27px) — основные действия фин-блока в строках («₽ Оплатить», «✕ Отклонить»): на телефоне по ним трудно попасть. Поднимаем до 34px — компромисс между рекомендованными 44px и плотностью админских таблиц. */ @media (max-width:640px){ .btn.xs{min-height:34px} .adv-exp-b{width:32px;height:32px} .payall-btn{min-height:36px} /* «Оплатить всех» — ключевое действие фин-блока */ .led-fold-btn{min-width:32px;min-height:32px} /* сворачивание разделов ведомости */ .daysum-btn,.hrs-filter-btn,.xls-btn{min-height:34px} /* тумблеры вида и экспорт в шапке ведомости */ } /* Ручная привязка к трекеру — в попапе «Не сопоставлено» под каждым сотрудником */ .au-link{display:flex;align-items:center;gap:7px;margin-top:7px;flex-wrap:wrap} .au-sel{flex:1 1 220px;min-width:0;height:32px;font-size:12.5px;border:1px solid var(--line);border-radius:8px;background:#fff;padding:0 8px} .au-sel:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)} .au-ok{font-size:12px;font-weight:700;color:var(--ok)} .att-unm2 li.au-done{opacity:.65} @media (max-width:640px){ .au-sel{flex:1 1 100%;height:36px} } /* Статус раздачи доступа в списке сотрудников (админка) */ .creds-chip{display:inline-block;margin-left:6px;font-size:9.5px;font-weight:800;text-transform:uppercase;letter-spacing:.03em; color:var(--muted);background:var(--bg);border-radius:5px;padding:2px 6px;white-space:nowrap;vertical-align:middle} .creds-chip.is-sent{color:var(--ok);background:var(--ok-soft)} .creds-chip.is-nobx{color:#9a6b16;background:var(--warn-soft,#fbf1de)} .creds-send-b{white-space:nowrap} /* Экран смены пароля при первом входе */ .pw-hint{font-size:12.5px;color:var(--ink-soft);line-height:1.5;margin-bottom:14px} .pw-exit{display:block;text-align:center;margin-top:14px;font-size:12px;color:var(--muted)} /* Автосверка с Битриксом: новички без направления — напоминание и метка */ .bx-new-note{display:flex;align-items:center;gap:12px;padding:11px 14px;margin-bottom:10px;border-radius:12px; background:var(--warn-soft,#fbf1de);border:1px solid #f0d79a;font-size:12.5px;color:var(--ink)} .bx-new-ic{font-size:20px;flex:none} .bx-new-note b{font-weight:800} .bx-new-list{font-size:11.5px;color:var(--ink-soft);margin-top:2px} .bx-new-note .btn{margin-left:auto;flex:none} .creds-chip.is-bxnew{color:#9a6b16;background:#fff;border:1px solid #f0d79a} /* Ячейка, внесённая ФИН-БЛОКОМ: согласование не требуется (он последняя инстанция) — фиолетовая метка. Перебивает статусную заливку, поэтому идёт после неё и с !important. */ .ledger-table td.mcell.fin-edit{background:#f3efff!important;box-shadow:inset 3px 0 0 #7c5cff!important} .ledger-table td.mcell.fin-edit .cell-in{background:transparent} .ledger-table td.mcell.fin-edit::after{content:"";position:absolute;top:3px;right:3px;width:5px;height:5px;border-radius:50%;background:#7c5cff;opacity:.75} /* Непрочитанный комментарий (уведомление ещё висит) — метка шире и заметнее */ .mcell.cmt-unread::before{width:4px!important;background:var(--warn,#e9a23b)!important} .mcell.cmt-unread::after{content:"";position:absolute;left:5px;top:4px;width:5px;height:5px;border-radius:50%;background:var(--warn,#e9a23b);z-index:2;pointer-events:none} .dot--cmt{background:var(--accent,#16b3c4)} /* уведомление о комментарии — бирюзовая точка */