:root{--bg:#f5f5ff;--violet:#4b3cff;--violet-light:#6055fe;--pale:#958dff;--text:#242348;--muted:#7c7a9b;--line:#e7e5ff;--border:#d6d1ff;--red:#f05276;--shadow:0 14px 45px rgba(68,52,189,.075)}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:14px/1.5 Inter,Arial,sans-serif}button,input{font:inherit}button{cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed}.hidden{display:none!important}.shell{max-width:1480px;margin:auto;padding:0 28px}.header{height:90px;display:flex;align-items:center;justify-content:space-between;gap:20px;border-bottom:1px solid #e5e2ff}.brand{display:flex;align-items:center;gap:15px}.brand-mark{font-size:30px;font-weight:750;letter-spacing:-1.9px;color:var(--violet)}.brand-mark span{font-weight:400}.brand-sub{border-left:1px solid #d2cdfb;padding-left:15px;font-size:10px;letter-spacing:2.1px;font-weight:800;color:#9390bd}.header-right{display:flex;align-items:center;gap:12px}.portal,.user-pill{border-radius:30px;padding:8px 15px;background:white;color:#777199;font-size:12px}.user-pill{font-weight:650;color:var(--text)}.outline{border:1px solid var(--border);background:#fff;color:var(--violet);border-radius:10px;padding:10px 17px;font-weight:650}.intro{display:flex;align-items:center;justify-content:space-between;margin:34px 0 26px}.eyebrow{font-size:10px;color:var(--violet);font-weight:800;letter-spacing:2.2px}.intro h1{font-size:32px;letter-spacing:-.7px;margin:8px 0 1px}.intro p{color:var(--muted);margin:0}.status{color:#399a7a;background:#e7f9f0;border:1px solid #cef0df;border-radius:50px;padding:9px 15px;font-size:12px;font-weight:700}.dashboard-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:stretch}.card{min-width:0;background:#fff;border:1px solid #edebff;border-radius:19px;padding:25px;box-shadow:var(--shadow)}.section-close,.section-search{min-height:248px}.history-card,.tree-card{min-height:480px}.card-heading{display:flex;gap:14px;align-items:center;margin-bottom:23px}.card-heading h2{margin:0 0 2px;font-size:19px;letter-spacing:-.3px}.card-heading p{margin:0;color:var(--muted);font-size:12px}.card-icon{display:grid;place-items:center;flex:0 0 41px;height:41px;background:#f0eeff;color:var(--violet);font-size:23px;border-radius:12px}.card label{display:block;font-weight:650;font-size:12px;margin-bottom:8px}.select-row{display:flex;gap:10px;align-items:stretch}.suggest-wrap{flex:1;position:relative;min-width:0}input{width:100%;height:45px;border:1px solid var(--border);border-radius:10px;padding:0 14px;background:#faf9ff;outline:none;color:var(--text)}input:focus{border-color:var(--violet);box-shadow:0 0 0 3px #eeecff}.button{background:var(--violet);color:white;border:0;border-radius:10px;padding:11px 20px;font-weight:700;white-space:nowrap;min-height:44px}.button:hover:not(:disabled){background:#3829ee}.button.danger{background:var(--violet)}.button.danger:hover:not(:disabled){background:#e24670}.selected{font-size:12px;margin-top:12px;color:var(--violet);font-weight:650;min-height:17px}.hint{margin-top:16px;border-radius:9px;padding:11px 13px;color:#8279b5;background:#f6f4ff;font-size:11px}.suggestions{position:absolute;left:0;right:0;top:49px;max-height:255px;overflow:auto;background:#fff;border:1px solid var(--border);border-radius:10px;box-shadow:0 14px 32px #25205024;z-index:20;padding:5px}.suggestions button{width:100%;text-align:left;padding:10px;border:0;background:transparent;border-radius:7px;font-size:12px;color:var(--text)}.suggestions button:hover{background:#f0eeff}.suggestions .none{padding:12px;color:var(--muted);font-size:12px}table{width:100%;border-collapse:separate;border-spacing:0 8px;text-align:left;font-size:12px}th{padding:12px 11px;color:#9690b6;background:#f3f1ff;font-size:11px;font-weight:700}th:first-child,td:first-child{border-radius:8px 0 0 8px}th:last-child,td:last-child{border-radius:0 8px 8px 0}td{padding:13px 11px;background:#f8f7ff;color:#48436b}td:nth-child(2){font-weight:650}td.empty{text-align:center;color:var(--muted);padding:36px;background:#faf9ff}.table-scroll{overflow:auto;max-height:350px}.table-footer{margin-top:12px;border-top:1px solid var(--line);padding-top:12px;color:var(--muted);font-size:11px}.tree-toolbar{display:flex;justify-content:space-between;align-items:center;background:#f5f3ff;color:#7770a1;border-radius:9px;padding:9px 12px;font-size:11px;font-weight:650}.text-btn{border:0;background:transparent;color:var(--violet);font-size:11px;font-weight:700}.tree{max-height:340px;min-height:275px;overflow:auto;padding:10px 0}.tree-item{padding-left:0}.tree-line{display:flex;gap:10px;align-items:center;padding:7px 10px;margin:3px 0;border-radius:9px;background:#f8f7ff}.tree-line.checked{background:#eeecff}.tree-toggle{border:0;background:transparent;color:var(--violet);width:18px;font-size:13px;padding:0}.tree-toggle.blank{visibility:hidden}.tree-label{flex:1;font-size:12px;font-weight:600}.tree-check{width:18px;height:18px;accent-color:var(--violet);cursor:pointer}.tree-children{margin-left:21px;border-left:2px solid #dcd7ff;padding-left:12px}.tree-bottom{display:flex;justify-content:space-between;gap:14px;align-items:center;border-top:1px solid var(--line);padding-top:16px}.tree-notice{max-width:56%;font-size:11px;color:var(--muted)}.empty-state{text-align:center;padding:70px 10px;color:#a8a2c4}.empty-state div{font-size:35px;color:var(--pale)}.empty-state p{font-size:12px}.toast{position:fixed;right:24px;top:20px;z-index:100;padding:14px 20px;max-width:440px;background:#29224d;color:#fff;border-radius:11px;box-shadow:0 12px 30px #0002;display:none}.toast.show{display:block}.toast.error{background:#b32f59}.modal-backdrop{position:fixed;inset:0;z-index:50;background:#18113f88;display:grid;place-items:center;padding:20px}.modal{background:white;border-radius:20px;width:min(450px,100%);padding:30px;text-align:center;box-shadow:0 35px 100px #0003}.modal-icon{font-size:36px;color:var(--violet)}.modal h3{font-size:22px;margin:10px 0}.modal p{color:var(--muted);line-height:1.6}.modal-actions{display:flex;gap:12px;justify-content:center;margin-top:25px}.login{background:linear-gradient(140deg,#6055fe,#4b3cff);border-radius:25px;padding:95px 30px;margin:65px auto;text-align:center;color:white}.login h1{font-size:32px}.login p{color:#e1ddff}.login-icon{font-size:40px}.login-button{display:inline-block;background:white;color:var(--violet);text-decoration:none;margin-top:24px}.login-note{font-size:12px;margin-top:20px}footer{padding:30px 0;color:#a29cbf;text-align:center;font-size:11px}@media(max-width:900px){.dashboard-grid{grid-template-columns:1fr}.intro h1{font-size:26px}.status{display:none}.header{height:auto;padding:20px 0}.brand-sub{display:none}}@media(max-width:520px){.shell{padding:0 13px}.header-right{gap:5px}.portal{display:none}.card{padding:17px}.select-row{flex-direction:column}.button{width:100%}.tree-bottom{flex-direction:column;align-items:stretch}.tree-notice{max-width:none}.intro{margin-top:25px}.intro h1{font-size:24px}}

/* Отдельный экран авторизации в стиле фирменного макета LaRiba */
body.login-mode{background:#4b3cff;min-height:100vh}
body.login-mode .shell{max-width:none;padding:0;min-height:100vh}
body.login-mode .header,body.login-mode footer{display:none}
.login-page{min-height:100vh;position:relative;display:flex;align-items:center;justify-content:center;padding:48px 24px 68px;overflow:hidden;background:#4b3cff;color:#fff;isolation:isolate}
.login-page:before{content:"";position:absolute;inset:0;z-index:-1;opacity:.23;background:radial-gradient(ellipse at 38% 47%,#8577ff 0%,transparent 65%),repeating-linear-gradient(125deg,transparent 0 100px,rgba(140,125,255,.18) 100px 125px,transparent 125px 230px)}
.login-panel{width:min(552px,100%);min-height:606px;border-radius:38px;background:rgba(151,138,255,.49);display:flex;align-items:flex-start;justify-content:center;position:relative;overflow:hidden}
.login-panel:before{content:"";position:absolute;inset:0;opacity:.13;background:radial-gradient(ellipse at 30% 20%,#d3caff 0%,transparent 42%),repeating-linear-gradient(130deg,transparent 0 115px,rgba(74,55,195,.5) 120px 145px,transparent 150px 260px);pointer-events:none}
.login-panel-content{z-index:1;display:flex;flex-direction:column;align-items:center;width:100%;padding:81px 24px 36px;text-align:center}
.login-panel h1{font-size:30px;line-height:1.23;font-weight:400;letter-spacing:-.4px;margin:0;color:white}
.login-action{display:flex;align-items:center;justify-content:center;width:264px;max-width:100%;height:67px;border-radius:17px;background:#cec3ff;color:#080517;font-size:30px;font-weight:700;text-decoration:none;margin-top:91px;transition:background .15s,transform .15s;box-shadow:none}
.login-action:hover{background:#e2dcff;transform:translateY(-1px)}.login-action:focus-visible{outline:3px solid white;outline-offset:4px}
.login-error{width:min(420px,100%);margin:24px auto 0;padding:12px 14px;border:1px solid rgba(255,255,255,.5);border-radius:12px;background:rgba(83,29,110,.4);font-size:14px;color:white}
.login-caption{position:absolute;bottom:17px;left:10px;right:10px;text-align:center;color:#cfcaff;font-size:11px;letter-spacing:.2px}
@media(max-width:600px){.login-page{padding:24px 18px 60px}.login-panel{min-height:520px;border-radius:30px}.login-panel-content{padding-top:85px}.login-panel h1{font-size:26px}.login-action{margin-top:85px}}




/* LaRiba Orcamid final */
.brand-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    gap: 6px;
}

.brand-text .brand-sub {
    display: block;
    margin: 0;
}

.brand-credit {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    padding: 6px 12px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1;
    text-transform: none;
    white-space: nowrap;
    color: #6E669C;
    background: linear-gradient(135deg, rgba(75, 60, 255, 0.10) 0%, rgba(129, 118, 255, 0.18) 50%, rgba(173, 165, 255, 0.22) 100%);
    border: 1px solid rgba(75, 60, 255, 0.12);
    box-shadow: 0 6px 18px rgba(75, 60, 255, 0.08);
    backdrop-filter: blur(4px);
}

.brand-credit strong {
    margin-left: 4px;
    font-weight: 700;
    background: linear-gradient(90deg, #4B3CFF 0%, #7A6BFF 55%, #9C92FF 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.brand-credit::before {
    content: "✦";
    margin-right: 6px;
    font-size: 10px;
    color: #6F63FF;
    opacity: 0.9;
}

@media (max-width: 600px) {
    .brand-text {
        gap: 4px;
    }

    .brand-credit {
        font-size: 9px;
        padding: 5px 10px;
        white-space: normal;
    }
}
/* === LaRiba Admin: Fit to Screen === */

@media (min-width: 901px) and (min-height: 650px) {

    html, body {
        height: 100%;
        min-height: 0;
        overflow: hidden;
    }

    .shell {
        height: 100dvh;
        min-height: 0;
        display: flex;
        flex-direction: column;
        overflow: hidden;
        box-sizing: border-box;
    }

    .header {
        flex: 0 0 auto;
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .intro {
        flex: 0 0 auto;
        margin-top: 12px;
        margin-bottom: 14px;
    }

    #dashboard {
        flex: 1 1 auto;
        min-height: 0;
        display: flex;
        flex-direction: column;
    }

    .dashboard-grid {
        flex: 1 1 auto;
        min-height: 0;
        height: 100%;
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
        grid-template-rows: auto minmax(0, 1fr);
        gap: 14px;
        padding-bottom: 8px;
    }

    .dashboard-grid > .card {
        min-height: 0;
        min-width: 0;
        margin: 0;
    }

    .section-close,
    .section-search {
        padding: 17px 20px;
    }

    .history-card,
    .tree-card {
        display: flex;
        flex-direction: column;
        overflow: hidden;
        padding: 17px 20px;
    }

    .history-card .table-scroll {
        flex: 1 1 auto;
        min-height: 0;
        overflow-y: auto;
        overflow-x: auto;
    }

    .tree-card .tree {
        flex: 1 1 auto;
        min-height: 0;
        overflow-y: auto;
        overflow-x: hidden;
    }

    .history-card .table-footer,
    .tree-card .tree-bottom,
    .tree-card .tree-toolbar {
        flex-shrink: 0;
    }

    .shell > footer {
        flex: 0 0 auto;
        margin-top: auto;
        padding-top: 5px;
        padding-bottom: 6px;
    }
}

/* На небольших экранах разрешаем обычную прокрутку */
@media (max-width: 900px), (max-height: 649px) {

    html, body {
        height: auto;
        overflow-y: auto;
    }

    .shell {
        height: auto;
        min-height: 100dvh;
        overflow: visible;
    }

    #dashboard,
    .dashboard-grid {
        height: auto;
        overflow: visible;
    }
}


/* === LaRiba Admin: Full Height Card Content === */

@media (min-width: 901px) and (min-height: 650px) {

    /* Нижние карточки */
    .dashboard-grid > .history-card,
    .dashboard-grid > .tree-card {
        display: flex !important;
        flex-direction: column !important;
        min-height: 0 !important;
        height: 100% !important;
    }

    /* Таблица истории занимает доступную высоту */
    .history-card .table-scroll {
        flex: 1 1 0 !important;
        min-height: 0 !important;
        height: auto !important;
        max-height: none !important;
        overflow-y: auto !important;
    }

    /* Счётчик закреплён снизу */
    .history-card .table-footer {
        flex: 0 0 auto !important;
        margin-top: auto !important;
    }

    /* Дерево отделов занимает доступное пространство */
    .tree-card .tree {
        display: block !important;
        flex: 1 1 0 !important;
        min-height: 0 !important;
        height: auto !important;
        max-height: none !important;
        overflow-y: auto !important;
        overflow-x: hidden !important;
    }

    /* Нижний блок с кнопкой закреплён у края */
    .tree-card .tree-bottom {
        flex: 0 0 auto !important;
        margin-top: auto !important;
        padding-top: 12px !important;
    }

    /* Все промежуточные элементы остаются в структуре */
    .tree-card .tree-toolbar,
    .history-card .card-heading,
    .tree-card .card-heading {
        flex-shrink: 0 !important;
    }
}


/* === LaRiba: адаптивный порядок блоков === */

@media (max-width: 900px) {

    .dashboard-grid {
        display: flex !important;
        flex-direction: column !important;
        gap: 18px !important;
        height: auto !important;
        min-height: 0 !important;
        overflow: visible !important;
    }

    /* 1. Завершение рабочего дня */
    .dashboard-grid > .section-close {
        order: 1 !important;
    }

    /* 2. История завершений */
    .dashboard-grid > .history-card {
        order: 2 !important;
    }

    /* 3. Контроль отделов */
    .dashboard-grid > .section-search {
        order: 3 !important;
    }

    /* 4. Отделы сотрудника */
    .dashboard-grid > .tree-card {
        order: 4 !important;
    }

    .dashboard-grid > .card {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        flex: 0 0 auto !important;
        box-sizing: border-box;
    }

    /* Внутренняя прокрутка больших списков */
    .history-card .table-scroll {
        max-height: 350px;
        overflow-y: auto;
    }

    .tree-card .tree {
        max-height: 450px;
        overflow-y: auto;
    }
}



/* === LaRiba: Compact Dashboard Layout === */

@media (min-width: 901px) and (min-height: 650px) {

    #dashboard {
        padding-top: 12px !important;
        min-height: 0 !important;
    }

    .dashboard-grid {
        grid-template-rows: auto minmax(0, 1fr) !important;
        gap: 14px !important;
        flex: 1 1 auto !important;
        min-height: 0 !important;
    }

    .dashboard-grid > .section-close,
    .dashboard-grid > .section-search {
        padding: 16px 20px !important;
    }

    .dashboard-grid > .history-card,
    .dashboard-grid > .tree-card {
        min-height: 0 !important;
        height: 100% !important;
        padding: 18px 20px !important;
    }

    .history-card .table-scroll,
    .tree-card .tree {
        flex: 1 1 0 !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow-y: auto !important;
    }

    .history-card .table-footer,
    .tree-card .tree-bottom {
        flex-shrink: 0 !important;
        margin-top: auto !important;
    }
}

@media (max-width: 900px) {
    #dashboard {
        padding-top: 12px !important;
    }

    .dashboard-grid > .history-card {
        min-height: 320px !important;
    }

    .dashboard-grid > .tree-card {
        min-height: 420px !important;
    }
}