/*
 * УГ — Документы для аккредитации.
 *
 * Оформление наследуется от сайта ugmus.kz: цвета берутся из переменных темы
 * Kadence (--global-palette*), поэтому при смене палитры темы раздел меняется
 * вместе с сайтом. Запасные значения — фактические цвета сайта на 31.08.2026.
 *
 * Витрина размещается на полноширинном шаблоне Elementor без контейнера,
 * поэтому собственный центрирующий контейнер и отступы задаём здесь — так
 * раздел выглядит одинаково независимо от обёртки страницы.
 */

.ugdocs {
    /* Основной синий темы: ссылки, кнопки. */
    --ug-brand: var(--global-palette1, #2b6cb0);
    --ug-brand-dark: var(--global-palette2, #215387);
    /* Фирменный синий шапки госпиталя и золотой акцент. */
    --ug-deep: #014a99;
    --ug-deep-2: #0a3d75;
    --ug-gold: #b7943c;

    --ug-ink-strong: var(--global-palette3, #1a202c);
    --ug-ink: var(--global-palette4, #2d3748);
    --ug-muted: var(--global-palette6, #718096);
    --ug-soft: var(--global-palette8, #f7fafc);
    --ug-soft-2: var(--global-palette7, #edf2f7);
    --ug-bg: var(--global-palette9, #ffffff);
    /* Границы: палитра темы для них слишком светлая, берём согласованный тон. */
    --ug-line: #dbe3ec;
    --ug-line-soft: #eaeff5;
    --ug-danger: #c2422d;
    --ug-danger-soft: #fbece9;
    --ug-ok: #1a7f4b;

    --ug-display: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --ug-radius: 10px;
    --ug-radius-sm: 8px;
    --ug-pill: 50px;
    --ug-shadow: 0 1px 2px rgba(1, 43, 92, .06), 0 6px 20px rgba(1, 43, 92, .05);
    --ug-shadow-lg: 0 24px 60px rgba(1, 43, 92, .22);

    /* Центрирующий контейнер витрины. */
    max-width: 1180px;
    margin-inline: auto;
    padding: 8px clamp(16px, 4vw, 32px) 72px;
    color: var(--ug-ink);
    line-height: 1.6;
    -webkit-font-smoothing: antialiased;
}

.ugdocs *,
.ugdocs *::before,
.ugdocs *::after { box-sizing: border-box; }

/* ---------- шапка раздела ---------- */

.ugdocs-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px 24px;
    flex-wrap: wrap;
    padding: 24px 28px;
    margin-bottom: 28px;
    border-radius: var(--ug-radius);
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .06), rgba(255, 255, 255, 0)),
        linear-gradient(120deg, var(--ug-deep), var(--ug-deep-2));
    box-shadow: var(--ug-shadow);
    position: relative;
    overflow: hidden;
}

.ugdocs-top::after {
    /* Золотая полоса-акцент снизу шапки. */
    content: "";
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--ug-gold), rgba(183, 148, 60, .25));
}

.ugdocs-top > div:first-child { min-width: 0; }

.ugdocs-title {
    margin: 0 0 4px;
    font-family: var(--ug-display);
    font-weight: 700;
    font-size: clamp(20px, 2.2vw, 27px);
    line-height: 1.2;
    color: #fff;
    letter-spacing: -.01em;
}

.ugdocs-sub {
    margin: 0;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    font-family: var(--ug-display);
    font-size: 14px;
    color: rgba(255, 255, 255, .82);
}

.ugdocs-badge {
    display: inline-flex;
    align-items: center;
    padding: 3px 12px;
    border: 1px solid rgba(183, 148, 60, .8);
    border-radius: var(--ug-pill);
    background: rgba(183, 148, 60, .16);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: #f2d59a;
}

.ugdocs-logout {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 9px 18px;
    border: 1px solid rgba(255, 255, 255, .38);
    border-radius: var(--ug-pill);
    font-family: var(--ug-display);
    font-size: 13px;
    font-weight: 600;
    color: #fff;
    text-decoration: none;
    white-space: nowrap;
    transition: background .15s ease, border-color .15s ease;
}

.ugdocs-logout::before {
    content: "";
    width: 15px; height: 15px;
    background: currentColor;
    -webkit-mask: var(--ug-icon-logout) center / contain no-repeat;
    mask: var(--ug-icon-logout) center / contain no-repeat;
}

.ugdocs-logout:hover { background: rgba(255, 255, 255, .16); border-color: #fff; color: #fff; text-decoration: none; }

/* ---------- раскладка ---------- */

.ugdocs-body {
    display: grid;
    grid-template-columns: 290px minmax(0, 1fr);
    gap: 28px;
    align-items: start;
}

@media (max-width: 900px) {
    .ugdocs-body { grid-template-columns: minmax(0, 1fr); gap: 20px; }
}

/* ---------- разделы ---------- */

.ugdocs-aside {
    border: 1px solid var(--ug-line);
    border-radius: var(--ug-radius);
    background: var(--ug-bg);
    box-shadow: var(--ug-shadow);
    overflow: hidden;
    position: sticky;
    top: 20px;
}

@media (max-width: 900px) {
    .ugdocs-aside { position: static; }
}

.ugdocs-aside-head {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 14px 18px;
    background: var(--ug-deep);
    font-family: var(--ug-display);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #fff;
}

.ugdocs-aside-head::before {
    content: "";
    width: 16px; height: 16px;
    background: currentColor;
    -webkit-mask: var(--ug-icon-folder) center / contain no-repeat;
    mask: var(--ug-icon-folder) center / contain no-repeat;
}

.ugdocs-tree { display: flex; flex-direction: column; max-height: 60vh; overflow-y: auto; }

.ugdocs-sec {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 11px 16px;
    border-bottom: 1px solid var(--ug-line-soft);
    color: var(--ug-ink);
    text-decoration: none;
    font-size: 15px;
    line-height: 1.35;
    transition: background .15s ease, color .15s ease;
}

.ugdocs-sec:last-child { border-bottom: none; }
.ugdocs-sec > span:first-child { flex: 1 1 auto; min-width: 0; }
.ugdocs-sec:hover { background: var(--ug-soft); color: var(--ug-brand); text-decoration: none; }

.ugdocs-sec.is-active {
    background: linear-gradient(90deg, rgba(1, 74, 153, .07), rgba(1, 74, 153, 0));
    box-shadow: inset 3px 0 0 var(--ug-gold);
    font-weight: 600;
    color: var(--ug-deep);
}

.ugdocs-sec-count {
    flex: 0 0 auto;
    min-width: 22px;
    padding: 1px 8px;
    border-radius: var(--ug-pill);
    background: var(--ug-soft-2);
    font-family: var(--ug-display);
    font-size: 11px;
    font-weight: 600;
    text-align: center;
    color: var(--ug-muted);
}

.ugdocs-sec.is-active .ugdocs-sec-count { background: var(--ug-deep); color: #fff; }

.ugdocs-tree-empty {
    padding: 18px 16px;
    color: var(--ug-muted);
    font-size: 14px;
}

.ugdocs-aside-tools {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 14px;
    border-top: 1px solid var(--ug-line);
    background: var(--ug-soft);
}

/* ---------- панель раздела (заголовок + поиск) ---------- */

.ugdocs-main-head {
    display: flex;
    align-items: baseline;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 16px;
}

.ugdocs-main-title {
    margin: 0;
    font-family: var(--ug-display);
    font-weight: 700;
    font-size: clamp(18px, 1.8vw, 22px);
    color: var(--ug-ink-strong);
    line-height: 1.25;
}

.ugdocs-count {
    font-family: var(--ug-display);
    font-size: 13px;
    font-weight: 600;
    color: var(--ug-muted);
}

/* ---------- поиск ---------- */

.ugdocs-search {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 20px;
}

.ugdocs-search-field {
    position: relative;
    flex: 1 1 260px;
    min-width: 0;
}

.ugdocs-search-field::before {
    content: "";
    position: absolute;
    left: 16px; top: 50%;
    transform: translateY(-50%);
    width: 17px; height: 17px;
    background: var(--ug-muted);
    -webkit-mask: var(--ug-icon-search) center / contain no-repeat;
    mask: var(--ug-icon-search) center / contain no-repeat;
    pointer-events: none;
}

.ugdocs-search input[type="search"] {
    width: 100%;
    padding: 11px 16px 11px 42px;
    border: 1px solid var(--ug-line);
    border-radius: var(--ug-pill);
    background: var(--ug-bg);
    font: inherit;
    font-size: 15px;
    color: var(--ug-ink);
    -webkit-appearance: none;
    appearance: none;
}

.ugdocs-search input[type="search"]:focus {
    outline: none;
    border-color: var(--ug-brand);
    box-shadow: 0 0 0 3px rgba(43, 108, 176, .15);
}

.ugdocs-reset {
    font-family: var(--ug-display);
    font-size: 13px;
    color: var(--ug-muted);
    text-decoration: none;
}
.ugdocs-reset:hover { color: var(--ug-brand); text-decoration: underline; }

/* ---------- кнопки ---------- */

.ugdocs-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 11px 22px;
    border: 1px solid var(--ug-brand);
    border-radius: var(--ug-pill);
    background: var(--ug-brand);
    color: #fff;
    font-family: var(--ug-display);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: .03em;
    line-height: 1.2;
    text-transform: uppercase;
    text-decoration: none;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    transition: background .15s ease, border-color .15s ease, color .15s ease, box-shadow .15s ease, transform .05s ease;
}

.ugdocs-btn:hover {
    background: var(--ug-brand-dark);
    border-color: var(--ug-brand-dark);
    color: #fff;
    text-decoration: none;
}
.ugdocs-btn:active { transform: translateY(1px); }

.ugdocs-btn:focus-visible {
    outline: 2px solid var(--ug-deep);
    outline-offset: 2px;
}

.ugdocs-btn-small { padding: 7px 14px; font-size: 11px; letter-spacing: .02em; }

.ugdocs-btn-ghost {
    background: transparent;
    color: var(--ug-brand);
    border-color: var(--ug-brand);
}
.ugdocs-btn-ghost:hover { background: var(--ug-brand); color: #fff; }

.ugdocs-btn-danger {
    background: transparent;
    color: var(--ug-danger);
    border-color: var(--ug-danger);
}
.ugdocs-btn-danger:hover { background: var(--ug-danger); border-color: var(--ug-danger); color: #fff; }

/* Кнопки-иконки в боковой панели. */
.ugdocs-btn-ico::before {
    content: "";
    width: 14px; height: 14px;
    background: currentColor;
    -webkit-mask: var(--ico) center / contain no-repeat;
    mask: var(--ico) center / contain no-repeat;
}
.ugdocs-btn[data-act="add-section"]    { --ico: var(--ug-icon-plus); }
.ugdocs-btn[data-act="rename-section"] { --ico: var(--ug-icon-edit); }
.ugdocs-btn[data-act="delete-section"] { --ico: var(--ug-icon-trash); }

/* ---------- загрузка ---------- */

.ugdocs-drop {
    display: flex;
    flex-direction: column;
    gap: 4px;
    align-items: center;
    justify-content: center;
    padding: 30px 20px;
    margin-bottom: 18px;
    border: 2px dashed var(--ug-line);
    border-radius: var(--ug-radius);
    background: var(--ug-soft);
    text-align: center;
    cursor: pointer;
    transition: border-color .15s ease, background .15s ease;
}

.ugdocs-drop::before {
    content: "";
    width: 34px; height: 34px;
    margin-bottom: 6px;
    background: var(--ug-brand);
    -webkit-mask: var(--ug-icon-upload) center / contain no-repeat;
    mask: var(--ug-icon-upload) center / contain no-repeat;
    transition: transform .15s ease;
}

.ugdocs-drop:hover,
.ugdocs-drop:focus-visible { border-color: var(--ug-brand); background: #f1f6fc; outline: none; }
.ugdocs-drop.is-over { border-color: var(--ug-deep); background: #e7f0fb; }
.ugdocs-drop.is-over::before { transform: translateY(-3px); }

.ugdocs-drop strong {
    font-family: var(--ug-display);
    font-size: 16px;
    font-weight: 600;
    color: var(--ug-deep);
}

.ugdocs-drop span { color: var(--ug-muted); font-size: 14px; }
.ugdocs-drop small { margin-top: 6px; color: var(--ug-muted); font-size: 12px; }

.ugdocs-queue { display: flex; flex-direction: column; gap: 6px; margin-bottom: 18px; }

.ugdocs-queue-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 16px;
    border: 1px solid var(--ug-line);
    border-left-width: 3px;
    border-radius: var(--ug-radius-sm);
    background: var(--ug-bg);
    font-size: 14px;
}

.ugdocs-queue-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.ugdocs-queue-state {
    font-family: var(--ug-display);
    font-size: 12px;
    letter-spacing: .03em;
    text-transform: uppercase;
    color: var(--ug-muted);
    white-space: nowrap;
}

.ugdocs-queue-item.is-done { border-left-color: var(--ug-ok); }
.ugdocs-queue-item.is-done .ugdocs-queue-state { color: var(--ug-ok); }
.ugdocs-queue-item.is-error { border-left-color: var(--ug-danger); background: var(--ug-danger-soft); }
.ugdocs-queue-item.is-error .ugdocs-queue-state { color: var(--ug-danger); }

/* ---------- сообщения ---------- */

.ugdocs-msg:not(:empty) {
    padding: 12px 18px;
    margin-bottom: 18px;
    border: 1px solid var(--ug-line);
    border-left: 3px solid var(--ug-muted);
    border-radius: var(--ug-radius-sm);
    background: var(--ug-soft);
    font-size: 14px;
}

.ugdocs-msg.is-ok { border-left-color: var(--ug-ok); background: #eef7f1; }
.ugdocs-msg.is-error { border-left-color: var(--ug-danger); background: var(--ug-danger-soft); }

/* ---------- таблица документов ---------- */

.ugdocs-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 15px;
    background: var(--ug-bg);
    border: 1px solid var(--ug-line);
    border-radius: var(--ug-radius);
    overflow: hidden;
    box-shadow: var(--ug-shadow);
}

.ugdocs-table th {
    padding: 13px 16px;
    background: var(--ug-soft);
    border-bottom: 1px solid var(--ug-line);
    text-align: left;
    font-family: var(--ug-display);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--ug-muted);
}

.ugdocs-table td {
    padding: 14px 16px;
    border-bottom: 1px solid var(--ug-line-soft);
    vertical-align: middle;
}

.ugdocs-table tbody tr:last-child td { border-bottom: none; }
.ugdocs-table tbody tr { transition: background .12s ease; }
.ugdocs-table tbody tr:hover { background: var(--ug-soft); }

/* Клетка «Документ»: иконка типа + название + имя файла. */
.ugdocs-doc { display: flex; align-items: flex-start; gap: 12px; }

.ugdocs-ext {
    flex: 0 0 auto;
    width: 42px; height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--ug-radius-sm);
    font-family: var(--ug-display);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .02em;
    color: #fff;
    background: var(--ug-muted);
    text-transform: uppercase;
}

.ugdocs-ext[data-ext="pdf"]  { background: #c0392b; }
.ugdocs-ext[data-ext="doc"], .ugdocs-ext[data-ext="docx"] { background: #2b579a; }
.ugdocs-ext[data-ext="xls"], .ugdocs-ext[data-ext="xlsx"] { background: #217346; }
.ugdocs-ext[data-ext="ppt"], .ugdocs-ext[data-ext="pptx"] { background: #d24726; }
.ugdocs-ext[data-ext="jpg"], .ugdocs-ext[data-ext="jpeg"], .ugdocs-ext[data-ext="png"] { background: #7a5cc0; }
.ugdocs-ext[data-ext="zip"]  { background: #6b7280; }

.ugdocs-doc-text { min-width: 0; }

.ugdocs-name {
    display: inline-block;
    font-family: var(--ug-display);
    font-weight: 600;
    font-size: 15px;
    color: var(--ug-deep);
    text-decoration: none;
    line-height: 1.3;
}

.ugdocs-name:hover { color: var(--ug-brand); text-decoration: underline; }

.ugdocs-file {
    display: block;
    margin-top: 3px;
    font-size: 12.5px;
    color: var(--ug-muted);
    word-break: break-word;
}

.ugdocs-col-meta {
    white-space: nowrap;
    font-size: 14px;
    color: var(--ug-muted);
}

.ugdocs-col-act { white-space: nowrap; text-align: right; }
.ugdocs-col-act .ugdocs-btn + .ugdocs-btn { margin-left: 6px; }

/* Компактная адаптивная таблица: на узких экранах — карточки. */
@media (max-width: 720px) {
    .ugdocs-table, .ugdocs-table thead, .ugdocs-table tbody,
    .ugdocs-table tr, .ugdocs-table td { display: block; }
    .ugdocs-table { border-radius: var(--ug-radius); }
    .ugdocs-table thead { display: none; }
    .ugdocs-table tr {
        padding: 14px 16px;
        border-bottom: 1px solid var(--ug-line);
    }
    .ugdocs-table tr:last-child { border-bottom: none; }
    .ugdocs-table td { padding: 0; border: none; }
    .ugdocs-col-meta { display: inline-block; margin-top: 8px; margin-right: 14px; }
    .ugdocs-col-meta::before {
        content: attr(data-label) ": ";
        font-weight: 600;
        color: var(--ug-ink);
    }
    .ugdocs-col-act { text-align: left; margin-top: 12px; }
    .ugdocs-col-act .ugdocs-btn { margin: 0 6px 6px 0; }
    .ugdocs-col-act .ugdocs-btn + .ugdocs-btn { margin-left: 0; }
}

.ugdocs-empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    padding: 48px 24px;
    border: 1px solid var(--ug-line);
    border-radius: var(--ug-radius);
    background: var(--ug-bg);
    color: var(--ug-muted);
    font-size: 15px;
    text-align: center;
}

.ugdocs-empty::before {
    content: "";
    width: 48px; height: 48px;
    background: var(--ug-line);
    -webkit-mask: var(--ug-icon-doc) center / contain no-repeat;
    mask: var(--ug-icon-doc) center / contain no-repeat;
}

/* ---------- вход и служебные экраны ---------- */

.ugdocs-login,
.ugdocs-notice {
    max-width: 440px;
    margin: 24px auto;
    padding: 36px 34px;
    border: 1px solid var(--ug-line);
    border-top: 4px solid var(--ug-deep);
    border-radius: var(--ug-radius);
    background: var(--ug-bg);
    box-shadow: var(--ug-shadow);
}

.ugdocs-login h2,
.ugdocs-notice h2 {
    margin: 0 0 10px;
    font-family: var(--ug-display);
    font-weight: 700;
    font-size: 23px;
    color: var(--ug-deep);
    line-height: 1.2;
}

.ugdocs-lead { margin-bottom: 22px; color: var(--ug-muted); font-size: 15px; }

.ugdocs-notice p { color: var(--ug-ink); }
.ugdocs-notice a { color: var(--ug-brand); }

.ugdocs-login label {
    display: block;
    margin-bottom: 14px;
    font-family: var(--ug-display);
    font-size: 13px;
    font-weight: 600;
    color: var(--ug-ink);
}

.ugdocs-login input[type="text"],
.ugdocs-login input[type="password"] {
    width: 100%;
    padding: 12px 16px;
    margin-top: 6px;
    border: 1px solid var(--ug-line);
    border-radius: var(--ug-radius-sm);
    background: var(--ug-bg);
    font-size: 15px;
    font-weight: 400;
    color: var(--ug-ink);
    -webkit-appearance: none;
    appearance: none;
}

.ugdocs-login input[type="text"]:focus,
.ugdocs-login input[type="password"]:focus {
    outline: none;
    border-color: var(--ug-brand);
    box-shadow: 0 0 0 3px rgba(43, 108, 176, .15);
}

.ugdocs-login .login-remember { font-weight: 400; color: var(--ug-muted); }

.ugdocs-login .login-submit input {
    width: 100%;
    padding: 13px 28px;
    border: 1px solid var(--ug-deep);
    border-radius: var(--ug-pill);
    background: var(--ug-deep);
    color: #fff;
    font-family: var(--ug-display);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    cursor: pointer;
    transition: background .15s ease;
}

.ugdocs-login .login-submit input:hover { background: var(--ug-deep-2); }

/* ---------- диалог изменения ---------- */

.ugdocs-modal {
    position: fixed;
    inset: 0;
    z-index: 100000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(1, 43, 92, .5);
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    animation: ugdocs-fade .15s ease;
}

@keyframes ugdocs-fade { from { opacity: 0; } to { opacity: 1; } }

.ugdocs-modal-box {
    width: 100%;
    max-width: 440px;
    padding: 26px;
    border-radius: var(--ug-radius);
    background: var(--ug-bg);
    box-shadow: var(--ug-shadow-lg);
    animation: ugdocs-pop .16s ease;
}

@keyframes ugdocs-pop { from { transform: translateY(8px) scale(.98); opacity: 0; } to { transform: none; opacity: 1; } }

.ugdocs-modal-title {
    margin: 0 0 18px;
    font-family: var(--ug-display);
    font-weight: 700;
    font-size: 19px;
    color: var(--ug-deep);
    line-height: 1.25;
}

.ugdocs-field {
    display: block;
    margin-bottom: 16px;
}

.ugdocs-field > span {
    display: block;
    margin-bottom: 6px;
    font-family: var(--ug-display);
    font-size: 13px;
    font-weight: 600;
    color: var(--ug-ink);
}

/*
 * Поля формы диалога.
 *
 * Тема (Kadence) задаёт для select собственные рамку и фон более специфичным
 * селектором, поэтому ключевые свойства форсируем через !important, а стрелку
 * select задаём инлайн-иконкой, не завися от переменных контейнера — диалог
 * может рендериться вне .ugdocs.
 */
.ugdocs-field input,
.ugdocs-field select {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 11px 13px !important;
    border: 1px solid var(--ug-line, #dbe3ec) !important;
    border-radius: var(--ug-radius-sm, 8px) !important;
    background-color: #fff !important;
    color: var(--ug-ink, #2d3748) !important;
    font: inherit !important;
    font-size: 15px !important;
    line-height: 1.4 !important;
    box-shadow: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
}

.ugdocs-field select {
    padding-right: 40px !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23718096' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 13px center !important;
    background-size: 16px !important;
    cursor: pointer;
}

.ugdocs-field input:focus,
.ugdocs-field select:focus {
    outline: none;
    border-color: var(--ug-brand, #2b6cb0) !important;
    box-shadow: 0 0 0 3px rgba(43, 108, 176, .15) !important;
}

.ugdocs-modal-bar {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 22px;
}

/* ---------- вкладки ---------- */

.ugdocs-tabs {
    display: flex;
    gap: 2px;
    margin: -10px 0 26px;
    border-bottom: 1px solid var(--ug-line);
}

.ugdocs-tab {
    padding: 12px 22px;
    margin-bottom: -1px;
    border-bottom: 2px solid transparent;
    font-family: var(--ug-display);
    font-weight: 600;
    font-size: 14px;
    color: var(--ug-muted);
    text-decoration: none;
    transition: color .15s ease, border-color .15s ease;
}

.ugdocs-tab:hover { color: var(--ug-brand); text-decoration: none; }

.ugdocs-tab.is-active {
    color: var(--ug-deep);
    border-bottom-color: var(--ug-gold);
}

/* ---------- вкладка «Доступы» ---------- */

.ugdocs-access-intro {
    margin: 0 0 18px;
    max-width: 820px;
    color: var(--ug-muted);
    font-size: 15px;
}

.ugdocs-access-filter { max-width: 380px; margin-bottom: 18px; }

.ugdocs-users { display: flex; flex-direction: column; gap: 14px; }

.ugdocs-user {
    border: 1px solid var(--ug-line);
    border-radius: var(--ug-radius);
    background: var(--ug-bg);
    box-shadow: var(--ug-shadow);
    overflow: hidden;
    transition: box-shadow .2s ease;
}

.ugdocs-user.is-saved { box-shadow: 0 0 0 2px var(--ug-ok); }

.ugdocs-user-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    padding: 13px 18px;
    background: var(--ug-soft);
    border-bottom: 1px solid var(--ug-line);
}

.ugdocs-user-id strong {
    display: block;
    font-family: var(--ug-display);
    font-weight: 600;
    font-size: 15px;
    color: var(--ug-ink-strong);
}

.ugdocs-user-id span { font-size: 13px; color: var(--ug-muted); }

.ugdocs-user-secs {
    display: flex;
    flex-direction: column;
    gap: 9px;
    padding: 16px 18px;
}

.ugdocs-acc-sec {
    display: flex;
    align-items: center;
    gap: 9px;
    font-size: 14px;
    color: var(--ug-ink);
    line-height: 1.35;
    cursor: pointer;
}

.ugdocs-acc-sec input[type="checkbox"] {
    flex: 0 0 auto;
    width: 17px;
    height: 17px;
    margin: 0;
    accent-color: var(--ug-deep);
    cursor: pointer;
}

.ugdocs-access-managers {
    margin-top: 26px;
    padding: 18px;
    border: 1px dashed var(--ug-line);
    border-radius: var(--ug-radius);
    background: var(--ug-soft);
}

.ugdocs-access-managers h3 {
    margin: 0 0 4px;
    font-family: var(--ug-display);
    font-size: 15px;
    font-weight: 600;
    color: var(--ug-ink-strong);
}

.ugdocs-access-managers p { margin: 0 0 10px; color: var(--ug-muted); font-size: 13px; }

.ugdocs-access-managers ul {
    margin: 0; padding: 0; list-style: none;
    display: flex; flex-wrap: wrap; gap: 8px 22px;
}

.ugdocs-access-managers li strong {
    font-family: var(--ug-display);
    font-weight: 600;
    font-size: 14px;
    color: var(--ug-ink);
}

.ugdocs-access-managers li span { margin-left: 6px; font-size: 13px; color: var(--ug-muted); }

/* ---------- иконки (инлайн-SVG в data-URI, без внешних запросов) ---------- */

.ugdocs {
    --ug-icon-folder: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h5l2 3h7a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2z'/%3E%3C/svg%3E");
    --ug-icon-search: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E");
    --ug-icon-upload: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4'/%3E%3Cpath d='M17 8l-5-5-5 5'/%3E%3Cpath d='M12 3v12'/%3E%3C/svg%3E");
    --ug-icon-doc: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/%3E%3Cpath d='M14 2v6h6'/%3E%3C/svg%3E");
    --ug-icon-plus: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E");
    --ug-icon-edit: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20h9'/%3E%3Cpath d='M16.5 3.5a2.12 2.12 0 0 1 3 3L7 19l-4 1 1-4z'/%3E%3C/svg%3E");
    --ug-icon-trash: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 6h18M8 6V4a2 2 0 0 1 2-2h4a2 2 0 0 1 2 2v2m3 0v14a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V6'/%3E%3C/svg%3E");
    --ug-icon-logout: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/%3E%3Cpath d='M16 17l5-5-5-5M21 12H9'/%3E%3C/svg%3E");
    --ug-icon-chevron: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23718096' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}