/*
 * РОССКЛАД — единая дизайн-система сайта (кабинет клиента и админ-панель).
 *
 * Один файл на обе части: токены (цвета, шрифт, отступы, радиусы, тени,
 * размеры полей и кнопок), каркас страницы (верхняя панель, боковое меню,
 * рабочая область, нижние вкладки на телефоне) и общие компоненты
 * (карточки, таблицы, статусы, кнопки, поля, вкладки-фильтры, пагинация,
 * пустые состояния, заглушки загрузки).
 *
 * Старые классы страниц (.card, .badge, .error и т.п.) продолжают работать —
 * их внешний вид задаётся здесь же через те же токены, поэтому все
 * страницы получают новый стиль без переписывания разметки.
 *
 * Внешних шрифтов и библиотек нет: системный шрифт, чистый CSS.
 */

/* ============================================================ токены */
:root {
    /* фирменный красный — только для главных действий и активного пункта */
    --rk-red: #e5223a;
    --rk-red-hover: #cc1d33;
    --rk-red-press: #b3192c;
    --rk-red-soft: #fdecee;
    --rk-red-line: #f8c9cf;
    --rk-red-ring: rgba(229, 34, 58, 0.22);

    /* навигация: тёмный сине-графитовый */
    --rk-nav-bg: #121722;
    --rk-nav-bg-2: #171d2a;
    --rk-nav-field: #1f2635;
    --rk-nav-hover: rgba(255, 255, 255, 0.06);
    --rk-nav-line: rgba(255, 255, 255, 0.07);
    --rk-nav-text: #c9cdd6;
    --rk-nav-muted: #7c8396;

    /* поверхности */
    --rk-bg: #f3f5f8;
    --rk-surface: #ffffff;
    --rk-surface-2: #f7f8fa;
    --rk-surface-3: #eef1f5;
    --rk-border: #e5e8ee;
    --rk-border-strong: #d3d8e1;

    /* текст */
    --rk-text: #141922;
    --rk-text-2: #3f4757;
    --rk-muted: #697186;
    --rk-faint: #98a0b0;

    /* состояния */
    --rk-green: #18a058;
    --rk-green-text: #137a43;
    --rk-green-soft: #e7f6ee;
    --rk-orange: #ef7d17;
    --rk-orange-text: #b8590b;
    --rk-orange-soft: #fff1e2;
    --rk-blue: #2f6fec;
    --rk-blue-text: #1f56c4;
    --rk-blue-soft: #e8f0ff;
    --rk-violet-text: #5b45c9;
    --rk-violet-soft: #efecff;
    --rk-danger: #d92d20;
    --rk-danger-soft: #fdecea;
    --rk-gray-text: #586174;
    --rk-gray-soft: #eef0f4;

    /* типографика */
    --rk-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --rk-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    --rk-fs-xs: 12px;
    --rk-fs-sm: 13px;
    --rk-fs-md: 14px;
    --rk-fs-base: 15px;
    --rk-fs-lg: 17px;
    --rk-fs-xl: 20px;
    --rk-fs-2xl: 26px;
    --rk-fs-num: 30px;

    /* отступы */
    --rk-s1: 4px;
    --rk-s2: 8px;
    --rk-s3: 12px;
    --rk-s4: 16px;
    --rk-s5: 20px;
    --rk-s6: 24px;
    --rk-s7: 32px;

    /* радиусы */
    --rk-r-sm: 8px;
    --rk-r: 10px;
    --rk-r-lg: 14px;
    --rk-r-xl: 18px;
    --rk-r-pill: 999px;

    /* тени */
    --rk-shadow-xs: 0 1px 2px rgba(16, 24, 40, 0.05);
    --rk-shadow: 0 1px 2px rgba(16, 24, 40, 0.04), 0 4px 16px rgba(16, 24, 40, 0.05);
    --rk-shadow-hover: 0 2px 4px rgba(16, 24, 40, 0.05), 0 10px 24px rgba(16, 24, 40, 0.08);
    --rk-shadow-pop: 0 16px 40px rgba(16, 24, 40, 0.18), 0 2px 6px rgba(16, 24, 40, 0.08);

    /* поля и кнопки */
    --rk-control-h: 42px;
    --rk-control-h-sm: 34px;
    --rk-control-h-lg: 48px;

    /* каркас */
    --rk-topbar-h: 64px;
    --rk-sidebar-w: 240px;
    --rk-rail-w: 76px;
    --rk-pad: 28px;
    --rk-gap: 18px;
    --rk-tabs-h: 62px;

    /* движение */
    --rk-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
    --rk-dur: 0.16s;

    /* Старые имена переменных: ими пользуются встроенные стили страниц. */
    --bg: var(--rk-bg);
    --card: var(--rk-surface);
    --border: var(--rk-border);
    --text: var(--rk-text);
    --muted: var(--rk-muted);
    --accent: var(--rk-red);
    --accent-hover: var(--rk-red-hover);
    --accent-soft: var(--rk-red-soft);
    --danger: var(--rk-danger);
    --danger-soft: var(--rk-danger-soft);
    --success: var(--rk-green-text);
    --success-soft: var(--rk-green-soft);
    --warning: var(--rk-orange-text);
    --warning-soft: var(--rk-orange-soft);
    --dark: var(--rk-nav-bg);
    --radius: 12px;
    --shadow: var(--rk-shadow);
}

/* ============================================================ основа */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--rk-topbar-h) + 12px); }
body {
    margin: 0;
    font-family: var(--rk-font);
    font-size: var(--rk-fs-base);
    line-height: 1.5;
    color: var(--rk-text);
    background: var(--rk-bg);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
}
img, svg, video { max-width: 100%; }
a { color: var(--rk-red); text-decoration: none; }
a:hover { text-decoration: underline; }
h1, h2, h3, h4 { color: var(--rk-text); }
h1 { font-size: var(--rk-fs-2xl); font-weight: 800; letter-spacing: -0.02em; line-height: 1.2; margin: 0 0 16px; }
h2 { font-size: var(--rk-fs-lg); font-weight: 700; letter-spacing: -0.01em; line-height: 1.3; margin: 0 0 12px; }
h3 { font-size: var(--rk-fs-base); font-weight: 700; margin: 0 0 8px; }
p { margin: 0 0 10px; }
h1 > svg, h2 > svg, h3 > svg { width: 1.1em; height: 1.1em; vertical-align: -0.18em; margin-right: 4px; color: var(--rk-text-2); }
.rk-card-head h2 > svg, .rk-card-head h3 > svg { margin-right: 0; }
hr { border: 0; border-top: 1px solid var(--rk-border); margin: 16px 0; }
.num, .rk-num { font-variant-numeric: tabular-nums; }
.muted { color: var(--rk-muted); }
.small { font-size: var(--rk-fs-sm); }
.rk-nowrap { white-space: nowrap; }
.rk-sr { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
[hidden] { display: none !important; }
/* Элементы только для компьютера / только для телефона (версию для телефона не меняем). */
@media (max-width: 767px) { .rk-desktop-only { display: none !important; } }
@media (min-width: 768px) { .rk-mobile-only { display: none !important; } }

/* Видимый фокус для работы с клавиатуры — на всех интерактивных элементах. */
:focus-visible { outline: 2px solid var(--rk-red); outline-offset: 2px; border-radius: 6px; }
.rk-topbar :focus-visible, .rk-sidebar :focus-visible { outline-color: #fff; }

/* ============================================================ каркас */
.rk-topbar {
    position: sticky; top: 0; z-index: 60;
    height: var(--rk-topbar-h);
    display: flex; align-items: center; gap: 14px;
    padding: 0 20px 0 16px;
    background: var(--rk-nav-bg);
    border-bottom: 1px solid var(--rk-nav-line);
    color: #fff;
}
.rk-brand {
    display: flex; align-items: center; gap: 10px; flex: none;
    width: calc(var(--rk-sidebar-w) - 16px);
    color: #fff; text-decoration: none;
}
.rk-brand:hover { text-decoration: none; }
.rk-brand img { height: 28px; width: auto; display: block; }
.rk-brand span { font-weight: 800; font-size: 17px; letter-spacing: 0.04em; }
.rk-topbar .rk-burger { display: none; }

.rk-search { position: relative; flex: 1 1 auto; max-width: 560px; min-width: 0; }
.rk-search form { margin: 0; }
.rk-search input[type="search"], .rk-search input {
    width: 100%; height: 42px; min-height: 0;
    padding: 0 14px 0 42px;
    border-radius: 11px;
    border: 1px solid rgba(255, 255, 255, 0.08);
    background: var(--rk-nav-field);
    color: #fff; font-size: var(--rk-fs-md);
    box-shadow: none;
}
.rk-search input::placeholder { color: var(--rk-nav-muted); }
.rk-search input[type="search"]:hover { border-color: rgba(255, 255, 255, 0.16); }
.rk-search input[type="search"]:focus, .rk-search input:focus { border-color: rgba(255, 255, 255, 0.28); background: #252d3e; box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.06); outline: none; }
.rk-search .rk-search-ic { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); color: var(--rk-nav-muted); display: flex; pointer-events: none; }
.rk-search .rk-search-ic svg { width: 18px; height: 18px; }
.rk-suggest {
    position: absolute; left: 0; right: 0; top: calc(100% + 8px);
    background: #fff; color: var(--rk-text);
    border: 1px solid var(--rk-border); border-radius: var(--rk-r-lg);
    box-shadow: var(--rk-shadow-pop); padding: 6px; z-index: 70;
}
.rk-suggest a {
    display: flex; align-items: center; gap: 10px;
    padding: 10px 12px; border-radius: var(--rk-r);
    color: var(--rk-text); text-decoration: none; font-size: var(--rk-fs-md);
}
.rk-suggest a:hover, .rk-suggest a.is-active { background: var(--rk-surface-2); text-decoration: none; }
.rk-suggest a svg { width: 18px; height: 18px; color: var(--rk-muted); flex: none; }
.rk-suggest b { font-weight: 700; overflow-wrap: anywhere; }
.rk-suggest .rk-suggest-hint { margin-left: auto; color: var(--rk-faint); font-size: var(--rk-fs-xs); white-space: nowrap; }

.rk-topbar-spacer { flex: 1 1 auto; }
.rk-topbar-actions { display: flex; align-items: center; gap: 6px; flex: none; }
.rk-icon-btn {
    position: relative; display: inline-flex; align-items: center; justify-content: center;
    width: 42px; height: 42px; border-radius: 11px;
    color: var(--rk-nav-text); background: transparent; border: 0; padding: 0; margin: 0;
    cursor: pointer; text-decoration: none;
    transition: background var(--rk-dur) var(--rk-ease), color var(--rk-dur) var(--rk-ease);
}
.rk-icon-btn:hover { background: var(--rk-nav-hover); color: #fff; text-decoration: none; }
.rk-icon-btn svg { width: 22px; height: 22px; }
.rk-icon-btn .rk-badge-dot {
    position: absolute; top: 4px; right: 3px;
    min-width: 18px; height: 18px; padding: 0 5px;
    border-radius: 9px; background: var(--rk-red); color: #fff;
    font-size: 10.5px; font-weight: 700; line-height: 18px; text-align: center;
    box-shadow: 0 0 0 2px var(--rk-nav-bg);
}
.rk-user { position: relative; }
.rk-user-btn {
    display: flex; align-items: center; gap: 10px;
    height: 46px; padding: 4px 10px 4px 5px; margin: 0 0 0 4px;
    border-radius: 12px; border: 0; background: transparent; color: #fff;
    cursor: pointer; font: inherit; font-size: var(--rk-fs-md); font-weight: 600;
    max-width: 280px;
}
.rk-user-btn:hover { background: var(--rk-nav-hover); }
.rk-user-btn .rk-user-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 170px; text-align: left; line-height: 1.25; }
.rk-user-btn .rk-user-role { display: block; color: var(--rk-nav-muted); font-size: 11.5px; font-weight: 500; }
.rk-user-btn .rk-chev { width: 16px; height: 16px; color: var(--rk-nav-muted); flex: none; transition: transform var(--rk-dur) var(--rk-ease); }
.rk-user.is-open .rk-chev { transform: rotate(180deg); }
.rk-avatar {
    width: 36px; height: 36px; border-radius: 50%; flex: none;
    display: inline-flex; align-items: center; justify-content: center;
    background: linear-gradient(140deg, #3b4459, #283041);
    color: #fff; font-weight: 700; font-size: 14px; letter-spacing: 0.02em;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12);
}
.rk-avatar.is-lg { width: 46px; height: 46px; font-size: 17px; }

/* Выпадающее меню (профиль, уведомления) */
.rk-menu {
    position: absolute; right: 0; top: calc(100% + 8px); z-index: 80;
    min-width: 248px; padding: 6px;
    background: #fff; color: var(--rk-text);
    border: 1px solid var(--rk-border); border-radius: var(--rk-r-lg);
    box-shadow: var(--rk-shadow-pop);
    opacity: 0; transform: translateY(-4px) scale(0.98); transform-origin: top right;
    visibility: hidden; pointer-events: none;
    transition: opacity var(--rk-dur) var(--rk-ease), transform var(--rk-dur) var(--rk-ease), visibility 0s linear var(--rk-dur);
}
.is-open > .rk-menu { opacity: 1; transform: none; visibility: visible; pointer-events: auto; transition-delay: 0s; }
.rk-menu-head { padding: 10px 12px 12px; border-bottom: 1px solid var(--rk-border); margin-bottom: 6px; }
.rk-menu-head b { display: block; font-size: var(--rk-fs-md); overflow-wrap: anywhere; }
.rk-menu-head span { color: var(--rk-muted); font-size: var(--rk-fs-sm); overflow-wrap: anywhere; }
.rk-menu a, .rk-menu button.rk-menu-item {
    display: flex; align-items: center; gap: 10px; width: 100%;
    padding: 9px 12px; margin: 0; border-radius: var(--rk-r);
    color: var(--rk-text); background: transparent; border: 0;
    font: inherit; font-size: var(--rk-fs-md); font-weight: 500; text-align: left;
    text-decoration: none; cursor: pointer;
}
.rk-menu a:hover, .rk-menu button.rk-menu-item:hover { background: var(--rk-surface-2); text-decoration: none; }
.rk-menu a svg { width: 18px; height: 18px; color: var(--rk-muted); flex: none; }
.rk-menu .rk-menu-sep { height: 1px; background: var(--rk-border); margin: 6px 4px; }
.rk-menu .rk-menu-danger, .rk-menu .rk-menu-danger svg { color: var(--rk-danger); }
.rk-menu.is-wide { width: 380px; max-width: calc(100vw - 24px); }
.rk-menu-scroll { max-height: min(460px, 70vh); overflow-y: auto; }
.rk-notice {
    display: block; padding: 10px 12px; border-radius: var(--rk-r);
    color: var(--rk-text); text-decoration: none;
}
.rk-notice:hover { background: var(--rk-surface-2); text-decoration: none; }
.rk-notice b { display: block; font-size: var(--rk-fs-md); }
.rk-notice span { display: block; color: var(--rk-muted); font-size: var(--rk-fs-sm); overflow-wrap: anywhere; }
.rk-notice time { display: block; color: var(--rk-faint); font-size: var(--rk-fs-xs); margin-top: 2px; }
.rk-notice.is-unread b::before { content: ""; display: inline-block; width: 7px; height: 7px; border-radius: 50%; background: var(--rk-red); margin: 0 7px 1px 0; vertical-align: middle; }
.rk-menu-foot { border-top: 1px solid var(--rk-border); margin-top: 6px; padding-top: 6px; }

/* Боковое меню */
.rk-sidebar {
    position: fixed; z-index: 50;
    top: var(--rk-topbar-h); left: 0; bottom: 0;
    width: var(--rk-sidebar-w);
    display: flex; flex-direction: column;
    padding: 16px 12px 16px;
    background: linear-gradient(180deg, var(--rk-nav-bg) 0%, #0f141e 100%);
    border-right: 1px solid var(--rk-nav-line);
    overflow-y: auto; overscroll-behavior: contain;
    scrollbar-width: thin; scrollbar-color: rgba(255, 255, 255, 0.15) transparent;
}
.rk-nav { display: flex; flex-direction: column; gap: 3px; }
.rk-nav-title {
    padding: 16px 12px 6px; margin: 0;
    color: var(--rk-nav-muted); font-size: 11px; font-weight: 700;
    letter-spacing: 0.08em; text-transform: uppercase;
}
.rk-nav-title:first-child { padding-top: 2px; }
.rk-nav-link {
    position: relative; display: flex; align-items: center; gap: 12px;
    min-height: 44px; padding: 0 12px; border-radius: 11px;
    color: var(--rk-nav-text); text-decoration: none;
    font-size: 14.5px; font-weight: 500; line-height: 1.2;
    transition: background var(--rk-dur) var(--rk-ease), color var(--rk-dur) var(--rk-ease), box-shadow var(--rk-dur) var(--rk-ease);
}
.rk-nav-link:hover { background: var(--rk-nav-hover); color: #fff; text-decoration: none; }
.rk-nav-link svg { width: 20px; height: 20px; flex: none; opacity: 0.92; }
.rk-nav-link .rk-nav-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rk-nav-link.is-active {
    background: var(--rk-red); color: #fff; font-weight: 650;
    box-shadow: 0 8px 20px rgba(229, 34, 58, 0.28);
}
.rk-nav-count {
    margin-left: auto; flex: none;
    min-width: 20px; height: 20px; padding: 0 6px;
    border-radius: 10px; background: var(--rk-red); color: #fff;
    font-size: 11px; font-weight: 700; line-height: 20px; text-align: center;
}
.rk-nav-link.is-active .rk-nav-count { background: #fff; color: var(--rk-red); }
/* ПК: подпись активного пункта не обрезается рядом со счётчиком («Требуют действия 1») */
@media (min-width: 1200px) {
    .rk-nav-link { gap: 11px; }
    .rk-nav-link.is-active { font-weight: 600; }
    .rk-nav-link .rk-nav-count { margin-right: -2px; }
}
.rk-nav-link.is-muted { color: var(--rk-nav-muted); }
.rk-sidebar-foot { margin-top: auto; padding-top: 18px; }
.rk-promo {
    position: relative; overflow: hidden;
    padding: 16px; border-radius: var(--rk-r-lg);
    background: linear-gradient(160deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.02));
    border: 1px solid rgba(255, 255, 255, 0.08);
    color: #fff;
}
.rk-promo svg { width: 34px; height: 34px; color: #fff; opacity: 0.9; margin-bottom: 8px; }
.rk-promo b { display: block; font-size: 14px; line-height: 1.3; margin-bottom: 4px; }
.rk-promo p { color: var(--rk-nav-muted); font-size: 12.5px; margin: 0 0 12px; line-height: 1.4; }
.rk-promo .rk-btn { min-height: 32px; height: 32px; padding: 0 14px; font-size: 13px; }
.rk-sidebar-info { color: var(--rk-nav-muted); font-size: 12px; line-height: 1.5; padding: 12px; border-top: 1px solid var(--rk-nav-line); margin-top: 12px; }
.rk-sidebar-info b { color: #fff; font-weight: 600; }

.rk-backdrop {
    position: fixed; inset: 0; z-index: 45; background: rgba(10, 14, 22, 0.5);
    opacity: 0; visibility: hidden; transition: opacity 0.2s var(--rk-ease), visibility 0s linear 0.2s;
}

/* Рабочая область */
.rk-shell { padding-left: var(--rk-sidebar-w); min-height: calc(100vh - var(--rk-topbar-h)); }
main.rk-main {
    display: block;
    width: 100%; max-width: 1320px;
    margin: 0 auto;
    padding: 24px var(--rk-pad) 48px;
    animation: rk-page-in 0.2s var(--rk-ease);
}
main.rk-main.rk-w-full { max-width: 1680px; }
main.rk-main.rk-w-md { max-width: 1080px; }
main.rk-main.rk-w-sm { max-width: 780px; }
@keyframes rk-page-in { from { opacity: 0; transform: translateY(4px); } to { opacity: 1; transform: none; } }

/* Нижние вкладки — только на телефоне */
.rk-tabs { display: none; }

/* ------------------------------------------------------------ планшет: узкая полоса значков */
@media (max-width: 1199px) and (min-width: 768px) {
    :root { --rk-pad: 22px; }
    .rk-brand { width: auto; }
    .rk-sidebar { width: var(--rk-rail-w); padding: 12px 10px; }
    .rk-shell { padding-left: var(--rk-rail-w); }
    .rk-nav-title { font-size: 0; padding: 8px 0 4px; height: 1px; border-top: 1px solid var(--rk-nav-line); margin: 8px 6px 4px; }
    .rk-nav-title:first-child { display: none; }
    .rk-nav-link { justify-content: center; padding: 0; min-height: 48px; }
    .rk-nav-link .rk-nav-label { display: none; }
    .rk-nav-link .rk-nav-count {
        position: absolute; top: 4px; right: 4px; margin: 0;
        min-width: 17px; height: 17px; line-height: 17px; font-size: 10px; padding: 0 4px;
        box-shadow: 0 0 0 2px var(--rk-nav-bg);
    }
    .rk-sidebar-foot, .rk-sidebar-info { display: none; }
    .rk-user-btn .rk-user-name { max-width: 120px; }
}

/* ------------------------------------------------------------ телефон */
@media (max-width: 767px) {
    :root { --rk-pad: 14px; --rk-topbar-h: 58px; --rk-fs-2xl: 22px; }
    body.rk-has-tabs { padding-bottom: calc(var(--rk-tabs-h) + env(safe-area-inset-bottom, 0px)); }
    .rk-topbar { gap: 4px; padding: 0 8px 0 6px; }
    .rk-topbar .rk-burger { display: inline-flex; }
    .rk-brand { width: auto; gap: 8px; min-width: 0; }
    .rk-brand img { height: 22px; }
    .rk-brand span { font-size: 15px; }
    .rk-search { display: none; }
    .rk-topbar.is-searching .rk-search {
        display: block; position: absolute; left: 8px; right: 8px; top: 8px; max-width: none;
    }
    .rk-topbar.is-searching .rk-search input { height: 42px; }
    .rk-search-toggle { display: inline-flex !important; }
    .rk-user-btn { padding: 4px; margin: 0; }
    .rk-user-btn .rk-user-name, .rk-user-btn .rk-chev { display: none; }
    .rk-avatar { width: 34px; height: 34px; font-size: 13px; }
    .rk-icon-btn { width: 40px; height: 40px; }
    .rk-hide-mobile { display: none !important; }

    /* Боковое меню — выезжающая панель по кнопке меню */
    .rk-sidebar {
        top: 0; z-index: 90; width: min(300px, 86vw);
        transform: translateX(-102%);
        transition: transform 0.24s var(--rk-ease);
        padding-top: 18px;
        box-shadow: none;
    }
    body.rk-drawer-open .rk-sidebar { transform: none; box-shadow: var(--rk-shadow-pop); }
    body.rk-drawer-open .rk-backdrop { opacity: 1; visibility: visible; transition-delay: 0s; z-index: 85; }
    body.rk-drawer-open { overflow: hidden; }
    .rk-shell { padding-left: 0; }
    main.rk-main { padding: 16px var(--rk-pad) 28px; }

    .rk-tabs {
        position: fixed; left: 0; right: 0; bottom: 0; z-index: 55;
        display: flex; align-items: stretch;
        padding: 4px 4px calc(4px + env(safe-area-inset-bottom, 0px));
        background: rgba(255, 255, 255, 0.97);
        backdrop-filter: saturate(1.4) blur(10px);
        -webkit-backdrop-filter: saturate(1.4) blur(10px);
        border-top: 1px solid var(--rk-border);
    }
    .rk-tabs a {
        position: relative; flex: 1 1 0; min-width: 0;
        display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
        min-height: 54px; padding: 4px 2px; border-radius: 12px;
        color: var(--rk-muted); text-decoration: none;
        font-size: 11px; font-weight: 600; line-height: 1.1; text-align: center;
        -webkit-tap-highlight-color: transparent;
    }
    .rk-tabs a svg { width: 23px; height: 23px; }
    .rk-tabs a.is-active { color: var(--rk-red); }
    .rk-tabs a.is-active::after { content: ""; position: absolute; top: 0; left: 30%; right: 30%; height: 3px; border-radius: 0 0 3px 3px; background: var(--rk-red); }
    .rk-tabs a:active { background: var(--rk-surface-3); }
    .rk-tabs .rk-tab-count {
        position: absolute; top: 4px; left: calc(50% + 6px);
        min-width: 17px; height: 17px; padding: 0 4px; border-radius: 9px;
        background: var(--rk-red); color: #fff; font-size: 10px; font-weight: 700; line-height: 17px; text-align: center;
        box-shadow: 0 0 0 2px #fff;
    }
    .rk-tabs.is-dark { background: var(--rk-nav-bg); border-top-color: var(--rk-nav-line); }
    .rk-tabs.is-dark a { color: var(--rk-nav-muted); }
    .rk-tabs.is-dark a.is-active { color: #fff; }
    .rk-tabs.is-dark a:active { background: var(--rk-nav-hover); }
    .rk-tabs.is-dark .rk-tab-count { box-shadow: 0 0 0 2px var(--rk-nav-bg); }
}
@media (min-width: 768px) {
    .rk-search-toggle { display: none !important; }
}

/* ============================================================ заголовок страницы */
.rk-crumbs {
    display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
    margin: 0 0 10px; padding: 0; list-style: none;
    color: var(--rk-muted); font-size: var(--rk-fs-sm);
}
.rk-crumbs a { color: var(--rk-muted); text-decoration: none; }
.rk-crumbs a:hover { color: var(--rk-text); }
.rk-crumbs li { display: inline-flex; align-items: center; gap: 6px; }
.rk-crumbs li + li::before { content: ""; width: 6px; height: 6px; border-right: 1.6px solid var(--rk-faint); border-top: 1.6px solid var(--rk-faint); transform: rotate(45deg); margin-right: 4px; }
.rk-crumbs li[aria-current] { color: var(--rk-text-2); font-weight: 600; }

.rk-page-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px 24px; flex-wrap: wrap; margin: 0 0 22px; }
.rk-page-head h1 { margin: 0; }
.rk-page-head .rk-sub { margin: 6px 0 0; color: var(--rk-muted); font-size: var(--rk-fs-md); max-width: 720px; }
.rk-page-head .rk-page-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.rk-page-head .rk-page-title { min-width: 0; }
.rk-page-head .rk-page-title h1 { overflow-wrap: anywhere; }

/* ============================================================ сетки */
.rk-grid { display: grid; gap: var(--rk-gap); }
.rk-grid > * { min-width: 0; }
.rk-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--rk-gap); margin-bottom: var(--rk-gap); }
.rk-stats.is-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.rk-stats.is-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }
.rk-layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: var(--rk-gap); align-items: start; }
.rk-layout.is-wide-aside { grid-template-columns: minmax(0, 1fr) 380px; }
.rk-layout > * { min-width: 0; }
.rk-stack { display: flex; flex-direction: column; gap: var(--rk-gap); min-width: 0; }
.rk-stack > .card, .rk-stack > .rk-card { margin-bottom: 0; }
.rk-cols-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--rk-gap); }
.rk-cols-2 > * { min-width: 0; }
.rk-auto-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(var(--rk-min, 260px), 1fr)); gap: var(--rk-gap); }
.rk-sticky { position: sticky; top: calc(var(--rk-topbar-h) + 16px); }
@media (max-width: 1439px) {
    .rk-layout { grid-template-columns: minmax(0, 1fr) 300px; }
    .rk-layout.is-wide-aside { grid-template-columns: minmax(0, 1fr) 340px; }
}
@media (max-width: 1439px) {
    .rk-stats.is-6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1279px) {
    .rk-layout, .rk-layout.is-wide-aside { grid-template-columns: minmax(0, 1fr) 300px; }
}
@media (max-width: 1099px) {
    .rk-layout, .rk-layout.is-wide-aside { grid-template-columns: minmax(0, 1fr); }
    /* Важные карточки боковой колонки (порядок заказа, клиент) на узком экране — сверху, остальные — внизу. */
    .rk-layout > .rk-aside-split { display: contents; }
    .rk-layout > .rk-aside-split > .rk-order-top-1 { order: -2; margin: 0; }
    .rk-layout > .rk-aside-split > .rk-order-top-2 { order: -1; margin: 0; }
    .rk-layout > .rk-aside-split > .card { margin: 0; }
    .rk-sticky { position: static; }
    .rk-layout .rk-aside-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--rk-gap); }
    .rk-layout .rk-aside-grid > * { margin: 0; }
}
@media (max-width: 1023px) {
    .rk-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
    :root { --rk-gap: 12px; }
    .rk-cols-2 { grid-template-columns: minmax(0, 1fr); }
    .rk-layout .rk-aside-grid { grid-template-columns: minmax(0, 1fr); }
    .rk-stats.is-6, .rk-stats.is-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .rk-page-head { align-items: flex-start; margin-bottom: 16px; }
    .rk-page-head .rk-page-actions { width: 100%; }
    .rk-page-head .rk-page-actions .rk-btn { flex: 1 1 auto; }
    .rk-order-first { order: -1; }
}

/* ============================================================ карточки */
.card, .rk-card {
    background: var(--rk-surface);
    border: 1px solid var(--rk-border);
    border-radius: var(--rk-r-lg);
    box-shadow: var(--rk-shadow);
    padding: 20px 22px;
    margin-bottom: var(--rk-gap);
    min-width: 0;
    overflow-wrap: anywhere;
}
.rk-card.is-flush { padding: 0; }
.rk-card.is-tight { padding: 16px 18px; }
.rk-card-head {
    display: flex; align-items: center; justify-content: space-between; gap: 8px 12px; flex-wrap: wrap;
    margin: 0 0 14px;
}
.rk-card.is-flush > .rk-card-head { padding: 18px 22px 0; }
.rk-card-head h2, .rk-card-head h3 { margin: 0; display: flex; align-items: center; gap: 10px; font-size: var(--rk-fs-lg); }
.rk-card-head h2 svg, .rk-card-head h3 svg { width: 20px; height: 20px; color: var(--rk-text-2); flex: none; }
.rk-card-link {
    display: inline-flex; align-items: center; gap: 4px; flex: none;
    color: var(--rk-red); font-size: var(--rk-fs-sm); font-weight: 600; text-decoration: none; white-space: nowrap;
}
.rk-card-link:hover { text-decoration: underline; }
.rk-card-link svg { width: 15px; height: 15px; }
.rk-card-foot { margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--rk-border); }
.rk-card.is-attention { background: linear-gradient(180deg, #fff6f7 0%, #fff 140px); border-color: var(--rk-red-line); }
.rk-card.is-attention .rk-card-head h2 { color: var(--rk-red); }
.rk-card.is-attention .rk-card-head h2 svg { color: var(--rk-red); }
.rk-section-title { font-size: var(--rk-fs-xs); font-weight: 700; letter-spacing: 0.06em; text-transform: uppercase; color: var(--rk-muted); margin: 0 0 10px; }

/* Метки «ключ — значение» внутри карточек */
.rk-kv { display: flex; flex-direction: column; gap: 0; margin: 0; }
.rk-kv > div { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; padding: 9px 0; border-bottom: 1px solid var(--rk-border); }
.rk-kv > div:last-child { border-bottom: 0; }
.rk-kv dt { color: var(--rk-muted); font-size: var(--rk-fs-md); margin: 0; }
.rk-kv dd { margin: 0; font-weight: 600; text-align: right; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.rk-kv .is-total dt, .rk-kv .is-total dd { color: var(--rk-text); font-weight: 800; font-size: var(--rk-fs-lg); }

/* ============================================================ карточки показателей */
.rk-stat {
    position: relative; display: flex; flex-direction: column; gap: 6px;
    min-height: 132px; padding: 18px 18px 16px;
    border-radius: var(--rk-r-lg);
    background: var(--rk-surface); border: 1px solid var(--rk-border); box-shadow: var(--rk-shadow);
    color: var(--rk-text); text-decoration: none;
    transition: transform var(--rk-dur) var(--rk-ease), box-shadow var(--rk-dur) var(--rk-ease), border-color var(--rk-dur) var(--rk-ease);
    overflow: hidden;
}
a.rk-stat:hover { transform: translateY(-2px); box-shadow: var(--rk-shadow-hover); text-decoration: none; }
.rk-stat-top { display: flex; align-items: center; gap: 12px; }
.rk-stat-ic {
    width: 40px; height: 40px; border-radius: 11px; flex: none;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--rk-surface-3); color: var(--rk-text-2);
}
.rk-stat-ic svg { width: 22px; height: 22px; }
.rk-stat-label { font-size: var(--rk-fs-md); font-weight: 600; color: var(--rk-text-2); line-height: 1.25; }
.rk-stat-value { margin-top: auto; font-size: var(--rk-fs-num); font-weight: 800; letter-spacing: -0.02em; line-height: 1.1; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.rk-stat-foot { display: flex; align-items: center; justify-content: space-between; gap: 8px; color: var(--rk-muted); font-size: var(--rk-fs-sm); }
.rk-stat-foot svg { width: 18px; height: 18px; color: var(--rk-text-2); transition: transform var(--rk-dur) var(--rk-ease); flex: none; }
a.rk-stat:hover .rk-stat-foot svg { transform: translateX(3px); }
.rk-stat.tone-blue { background: linear-gradient(160deg, #f3f7ff 0%, #fff 70%); border-color: #dfe8fb; }
.rk-stat.tone-blue .rk-stat-ic { background: var(--rk-blue-soft); color: var(--rk-blue); }
.rk-stat.tone-red { background: linear-gradient(160deg, #fff4f5 0%, #fff 70%); border-color: #f7dde0; }
.rk-stat.tone-red .rk-stat-ic { background: var(--rk-red-soft); color: var(--rk-red); }
.rk-stat.tone-orange { background: linear-gradient(160deg, #fff7ef 0%, #fff 70%); border-color: #f8e5d2; }
.rk-stat.tone-orange .rk-stat-ic { background: var(--rk-orange-soft); color: var(--rk-orange); }
.rk-stat.tone-green { background: linear-gradient(160deg, #f1faf5 0%, #fff 70%); border-color: #d8efe2; }
.rk-stat.tone-green .rk-stat-ic { background: var(--rk-green-soft); color: var(--rk-green); }
.rk-stat.tone-violet .rk-stat-ic { background: var(--rk-violet-soft); color: var(--rk-violet-text); }
.rk-stat.tone-gray .rk-stat-ic { background: var(--rk-gray-soft); color: var(--rk-gray-text); }
.rk-stat.is-active { box-shadow: 0 0 0 2px var(--rk-red), var(--rk-shadow); border-color: transparent; }
.rk-stat.is-compact { min-height: 0; padding: 14px 16px; }
.rk-stat.is-compact .rk-stat-value { font-size: 24px; margin-top: 4px; }
@media (max-width: 767px) {
    .rk-stat { min-height: 112px; padding: 14px; }
    .rk-stat-ic { width: 34px; height: 34px; }
    .rk-stat-ic svg { width: 19px; height: 19px; }
    .rk-stat-value { font-size: 24px; }
    .rk-stat-label { font-size: var(--rk-fs-sm); }
}

/* ============================================================ статусы */
.rk-status {
    display: inline-flex; align-items: center; gap: 6px;
    height: 26px; padding: 0 10px; border-radius: 7px;
    font-size: 12.5px; font-weight: 600; line-height: 1; white-space: nowrap;
    background: var(--rk-gray-soft); color: var(--rk-gray-text);
    max-width: 100%;
}
.rk-status > span { overflow: hidden; text-overflow: ellipsis; }
.rk-status::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; flex: none; opacity: 0.85; }
.rk-status.is-plain::before { display: none; }
.rk-status.tone-blue { background: var(--rk-blue-soft); color: var(--rk-blue-text); }
.rk-status.tone-red { background: var(--rk-red-soft); color: #c4182e; }
.rk-status.tone-orange { background: var(--rk-orange-soft); color: var(--rk-orange-text); }
.rk-status.tone-green { background: var(--rk-green-soft); color: var(--rk-green-text); }
.rk-status.tone-violet { background: var(--rk-violet-soft); color: var(--rk-violet-text); }
.rk-status.tone-gray { background: var(--rk-gray-soft); color: var(--rk-gray-text); }
.rk-status.is-sm { height: 22px; padding: 0 8px; font-size: 11.5px; }
.rk-status.is-wrap { white-space: normal; height: auto; min-height: 26px; padding: 5px 10px; line-height: 1.3; }
/* На широком ПК статус документа — в одну строку */
@media (min-width: 1200px) { .rk-table .rk-status.is-wrap { white-space: nowrap; } }

/* ============================================================ кнопки */
/* Обычные кнопки страниц размер берут из отступов (на многих страницах
   свои отступы прямо в разметке), кнопки .rk-btn — из высоты. */
.rk-btn,
button,
input[type="submit"],
.btn {
    display: inline-flex; align-items: center; justify-content: center; gap: 8px;
    padding: 10px 18px;
    border-radius: var(--rk-r); border: 1px solid transparent;
    background: var(--rk-red); color: #fff;
    font-family: inherit; font-size: var(--rk-fs-md); font-weight: 600; line-height: 1.2;
    text-align: center; text-decoration: none; cursor: pointer;
    white-space: normal; overflow-wrap: anywhere;
    transition: background var(--rk-dur) var(--rk-ease), border-color var(--rk-dur) var(--rk-ease), color var(--rk-dur) var(--rk-ease), box-shadow var(--rk-dur) var(--rk-ease), transform 0.06s ease;
    -webkit-tap-highlight-color: transparent;
}
.rk-btn:hover, button:hover, .btn:hover, input[type="submit"]:hover { background: var(--rk-red-hover); text-decoration: none; color: #fff; }
.rk-btn:active, button:active, .btn:active { transform: translateY(1px); }
.rk-btn:focus-visible, button:focus-visible, .btn:focus-visible { outline: none; box-shadow: 0 0 0 3px var(--rk-red-ring); }
.rk-btn svg, button svg, .btn svg { width: 18px; height: 18px; flex: none; }
.rk-btn:disabled, button:disabled, .btn.is-disabled, .rk-btn.is-disabled {
    opacity: 0.5; cursor: not-allowed; transform: none; box-shadow: none;
}
.rk-btn { min-height: var(--rk-control-h); padding: 0 18px; white-space: nowrap; overflow-wrap: normal; }
.rk-btn.is-wrap { white-space: normal; overflow-wrap: anywhere; padding-top: 8px; padding-bottom: 8px; }
.rk-btn-primary { background: var(--rk-red); color: #fff; box-shadow: 0 4px 12px rgba(229, 34, 58, 0.22); }
.rk-btn-primary:hover { background: var(--rk-red-hover); }
button.secondary, .btn.secondary, .rk-btn-secondary, .rk-btn.secondary {
    background: #fff; color: var(--rk-text); border-color: var(--rk-border-strong); box-shadow: var(--rk-shadow-xs);
}
button.secondary:hover, .btn.secondary:hover, .rk-btn-secondary:hover, .rk-btn.secondary:hover { background: var(--rk-surface-2); color: var(--rk-text); border-color: #c4cad5; }
.rk-btn-ghost { background: transparent; color: var(--rk-text-2); border-color: transparent; }
.rk-btn-ghost:hover { background: var(--rk-surface-3); color: var(--rk-text); }
.rk-btn-danger { background: var(--rk-danger); color: #fff; }
.rk-btn-danger:hover { background: #b42318; }
.rk-btn-dark { background: var(--rk-nav-bg); color: #fff; }
.rk-btn-dark:hover { background: #222a3a; }
.rk-btn-sm, button.small, .btn.small { padding: 6px 12px; font-size: var(--rk-fs-sm); border-radius: 9px; }
.rk-btn.rk-btn-sm { min-height: var(--rk-control-h-sm); padding: 0 12px; }
.rk-btn-lg { min-height: var(--rk-control-h-lg); padding: 0 22px; font-size: var(--rk-fs-base); border-radius: 12px; }
.rk-btn-block { width: 100%; }
.rk-btn-icon { width: var(--rk-control-h); padding: 0; }
.rk-btn-icon.rk-btn-sm { width: var(--rk-control-h-sm); padding: 0; }
.rk-btn.rk-btn-icon { padding: 0; }
.rk-btn.is-loading, button.is-loading { position: relative; color: transparent !important; pointer-events: none; }
.rk-btn.is-loading::after, button.is-loading::after {
    content: ""; position: absolute; left: 50%; top: 50%; width: 18px; height: 18px; margin: -9px 0 0 -9px;
    border-radius: 50%; border: 2px solid rgba(255, 255, 255, 0.5); border-top-color: #fff;
    animation: rk-spin 0.7s linear infinite;
}
button.secondary.is-loading::after, .rk-btn-secondary.is-loading::after { border-color: rgba(20, 25, 34, 0.25); border-top-color: var(--rk-text); }
@keyframes rk-spin { to { transform: rotate(360deg); } }
.rk-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.rk-actions.is-end { justify-content: flex-end; }

/* ============================================================ поля */
label { display: block; font-size: var(--rk-fs-sm); font-weight: 600; color: var(--rk-text-2); margin: 14px 0 6px; }
input[type="text"], input[type="email"], input[type="password"], input[type="number"], input[type="tel"],
input[type="search"], input[type="url"], input[type="date"], input[type="datetime-local"], input[type="month"],
input:not([type]), select, textarea {
    width: 100%; min-height: var(--rk-control-h);
    padding: 9px 13px;
    border: 1px solid var(--rk-border-strong); border-radius: var(--rk-r);
    background: #fff; color: var(--rk-text);
    font-family: inherit; font-size: var(--rk-fs-base); line-height: 1.35;
    transition: border-color var(--rk-dur) var(--rk-ease), box-shadow var(--rk-dur) var(--rk-ease);
}
input::placeholder, textarea::placeholder { color: var(--rk-faint); }
input:hover, select:hover, textarea:hover { border-color: #bfc6d2; }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--rk-red); box-shadow: 0 0 0 3px var(--rk-red-ring); }
input:disabled, select:disabled, textarea:disabled { background: var(--rk-surface-2); color: var(--rk-muted); cursor: not-allowed; }
input[aria-invalid="true"], select[aria-invalid="true"], textarea[aria-invalid="true"] { border-color: var(--rk-danger); }
select {
    appearance: none; -webkit-appearance: none;
    padding-right: 36px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23697186' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    background-repeat: no-repeat; background-position: right 12px center; background-size: 16px;
    cursor: pointer;
}
textarea { min-height: 96px; resize: vertical; }
input[type="checkbox"], input[type="radio"] { width: 18px; height: 18px; accent-color: var(--rk-red); margin: 0; vertical-align: middle; }
input[type="file"] { font-size: var(--rk-fs-sm); max-width: 100%; }
/* На ПК кнопка выбора файла — в стиле остальных кнопок (на телефоне — как раньше) */
@media (min-width: 768px) {
    input[type="file"] { color: var(--rk-muted); }
    input[type="file"]::file-selector-button {
        height: 36px; padding: 0 14px; margin-right: 10px;
        border: 1px solid var(--rk-border-strong, #d5dae3); border-radius: var(--rk-r);
        background: var(--rk-surface); color: var(--rk-text);
        font: inherit; font-weight: 600; cursor: pointer;
        transition: background var(--rk-dur) var(--rk-ease), border-color var(--rk-dur) var(--rk-ease);
    }
    input[type="file"]::file-selector-button:hover { background: var(--rk-surface-2, #f6f7f9); border-color: #c3c9d4; }
}
.rk-field { margin-bottom: 14px; }
.rk-field label { margin-top: 0; }
.rk-hint { color: var(--rk-muted); font-size: var(--rk-fs-sm); margin-top: 6px; }
.rk-field-error { color: var(--rk-danger); font-size: var(--rk-fs-sm); margin-top: 6px; }
.rk-form { max-width: 720px; }
.rk-form-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 16px; }
@media (max-width: 640px) { .rk-form-row { grid-template-columns: minmax(0, 1fr); } }
.rk-input-ic { position: relative; }
.rk-input-ic > svg { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); width: 18px; height: 18px; color: var(--rk-faint); pointer-events: none; }
.rk-input-ic > input { padding-left: 40px; }

/* ============================================================ сообщения */
.error, .rk-alert-error, .success, .success-banner, .rk-alert {
    display: flex; align-items: flex-start; gap: 10px;
    padding: 12px 14px; margin: 0 0 16px;
    border-radius: var(--rk-r); border: 1px solid transparent;
    font-size: var(--rk-fs-md); line-height: 1.45;
    overflow-wrap: anywhere;
}
.error::before, .rk-alert-error::before, .success::before, .success-banner::before {
    content: ""; flex: none; width: 18px; height: 18px; margin-top: 1px;
    background: currentColor;
    -webkit-mask: var(--rk-alert-ic) center / contain no-repeat; mask: var(--rk-alert-ic) center / contain no-repeat;
}
.error, .rk-alert-error {
    background: var(--rk-danger-soft); color: #b42318; border-color: #f6cfcb;
    --rk-alert-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7.5v5.5M12 16.5h.01'/%3E%3C/svg%3E");
}
.success, .success-banner {
    background: var(--rk-green-soft); color: var(--rk-green-text); border-color: #c9ead7;
    --rk-alert-ic: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='m8 12.5 2.7 2.5L16 9.5'/%3E%3C/svg%3E");
}
.rk-alert.tone-info { background: var(--rk-blue-soft); color: var(--rk-blue-text); border-color: #d3e1fb; }
.rk-alert.tone-warn { background: var(--rk-orange-soft); color: var(--rk-orange-text); border-color: #f6dcc0; }
.rk-alert.tone-red { background: var(--rk-red-soft); color: #b8172b; border-color: var(--rk-red-line); }
.rk-alert svg { width: 18px; height: 18px; flex: none; margin-top: 1px; }

/* ============================================================ таблицы */
table { width: 100%; border-collapse: collapse; }
.rk-table-wrap {
    width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch;
    border: 1px solid var(--rk-border); border-radius: var(--rk-r);
    background: #fff;
}
.rk-card > .rk-table-wrap:last-child { margin-bottom: 0; }
.rk-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: var(--rk-fs-md); }
.rk-table th {
    position: sticky; top: 0; z-index: 2;
    background: var(--rk-surface-2); color: var(--rk-muted);
    font-size: var(--rk-fs-sm); font-weight: 600; text-align: left; white-space: nowrap;
    padding: 11px 14px; border-bottom: 1px solid var(--rk-border);
    text-transform: none; letter-spacing: 0;
}
.rk-table td {
    padding: 13px 14px; border-bottom: 1px solid var(--rk-border);
    vertical-align: middle; color: var(--rk-text);
    overflow-wrap: normal;
}
.rk-table tbody tr:last-child td { border-bottom: 0; }
.rk-table tbody tr { transition: background var(--rk-dur) var(--rk-ease); }
.rk-table tbody tr:hover { background: #fafbfc; }
.rk-table tr[data-href] { cursor: pointer; }
.rk-table tr[data-href]:focus-visible { outline: 2px solid var(--rk-red); outline-offset: -2px; }
.rk-table .is-num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.rk-table .is-center { text-align: center; }
.rk-table .is-actions { text-align: right; white-space: nowrap; width: 1%; }
.rk-table .is-shrink { width: 1%; white-space: nowrap; }
.rk-table .rk-cell-main { font-weight: 650; color: var(--rk-text); white-space: nowrap; }
.rk-table .rk-cell-main a { color: inherit; text-decoration: none; }
.rk-table .rk-cell-main a:hover { color: var(--rk-red); }
.rk-table .rk-cell-sub { color: var(--rk-muted); font-size: var(--rk-fs-sm); margin-top: 2px; line-height: 1.35; }
.rk-table .rk-cell-clip { max-width: 320px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rk-table .rk-cell-wrap { min-width: 170px; max-width: 280px; white-space: normal; overflow-wrap: break-word; line-height: 1.4; }
.rk-table tr.is-attention td:first-child { box-shadow: inset 3px 0 0 var(--rk-red); }
.rk-table th a { color: inherit; text-decoration: none; display: inline-flex; align-items: center; gap: 4px; }
.rk-table th a:hover { color: var(--rk-text); }
.rk-table th a svg { width: 13px; height: 13px; }
.rk-table th.is-sorted { color: var(--rk-text); }
.rk-table-wrap.is-scroll { max-height: calc(100vh - 220px); overflow: auto; }
.rk-row-chevron { color: var(--rk-faint); width: 18px; height: 18px; vertical-align: middle; transition: transform var(--rk-dur) var(--rk-ease), color var(--rk-dur) var(--rk-ease); }
tr:hover .rk-row-chevron { color: var(--rk-text-2); transform: translateX(2px); }
.rk-thumbs { display: flex; align-items: center; }
.rk-thumbs img, .rk-thumbs .rk-thumb-more {
    width: 34px; height: 34px; border-radius: 8px; object-fit: cover; flex: none;
    border: 2px solid #fff; background: var(--rk-surface-3); margin-left: -8px;
}
.rk-thumbs img:first-child { margin-left: 0; }
.rk-thumbs .rk-thumb-more { display: inline-flex; align-items: center; justify-content: center; font-size: 11px; font-weight: 700; color: var(--rk-muted); }
img.is-broken { visibility: hidden; }

/* Таблица → карточки на телефоне: строки становятся блоками с подписями. */
@media (max-width: 767px) {
    .rk-table-wrap.is-stack { border: 0; background: transparent; overflow: visible; }
    .rk-table.is-stack, .rk-table.is-stack tbody, .rk-table.is-stack tr, .rk-table.is-stack td { display: block; width: 100%; }
    .rk-table.is-stack thead { display: none; }
    .rk-table.is-stack tr {
        position: relative; margin: 0 0 10px; padding: 12px 14px;
        border: 1px solid var(--rk-border); border-radius: var(--rk-r-lg); background: #fff;
        box-shadow: var(--rk-shadow-xs);
        display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 6px 14px;
    }
    .rk-table.is-stack td:first-child, .rk-table.is-stack td.is-actions, .rk-table.is-stack td.rk-span { grid-column: 1 / -1; }
    .rk-table.is-stack td:empty { display: none; }
    .rk-table.is-stack tr.is-attention { border-color: var(--rk-red-line); box-shadow: inset 3px 0 0 var(--rk-red); }
    .rk-table.is-stack tr.is-attention td:first-child { box-shadow: none; }
    .rk-table.is-stack td { padding: 2px 0; border: 0; text-align: left; white-space: normal; min-width: 0; }
    .rk-table.is-stack td:first-child { padding-bottom: 6px; border-bottom: 1px solid var(--rk-border); margin-bottom: 2px; }
    .rk-table.is-stack td.is-actions .rk-btn { width: 100%; }
    .rk-table.is-stack td.is-actions .rk-actions .rk-btn { width: auto; flex: 1 1 auto; }
    .rk-table.is-stack td[data-label]::before {
        content: attr(data-label); display: block;
        color: var(--rk-faint); font-size: 11.5px; font-weight: 600; margin-bottom: 1px;
    }
    .rk-table.is-stack td.is-num { text-align: left; }
    .rk-table.is-stack td.is-actions { text-align: left; width: auto; padding-top: 8px; }
    .rk-table.is-stack .rk-cell-clip, .rk-table.is-stack .rk-cell-wrap { max-width: none; min-width: 0; white-space: normal; }
    .rk-table.is-stack .rk-stack-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0 12px; }
    .rk-table.is-stack .rk-hide-stack { display: none; }
    .rk-table.is-stack .rk-cell-main { white-space: normal; }
}

/* Старые таблицы страниц — тот же вид */
table:not(.rk-table) th, table:not(.rk-table) td { text-align: left; padding: 10px 10px; border-bottom: 1px solid var(--rk-border); font-size: var(--rk-fs-md); overflow-wrap: anywhere; }
table:not(.rk-table) th { color: var(--rk-muted); font-weight: 600; font-size: var(--rk-fs-sm); background: var(--rk-surface-2); }
table:not(.rk-table) tr:last-child td { border-bottom: 0; }
table:not(.rk-table) tbody tr:hover { background: #fafbfc; }
.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* ============================================================ панель фильтров, вкладки, пагинация */
.rk-toolbar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 0 0 16px; }
.rk-toolbar form { display: contents; }
.rk-toolbar .rk-grow { flex: 1 1 260px; min-width: 0; }
.rk-toolbar select, .rk-toolbar input { width: auto; min-width: 0; }
.rk-toolbar .rk-grow input { width: 100%; }
.rk-toolbar .rk-count { color: var(--rk-muted); font-size: var(--rk-fs-sm); margin-left: auto; white-space: nowrap; }
@media (min-width: 768px) {
    /* На ПК поле поиска уступает место фильтрам, чтобы кнопка «Найти» не уезжала на вторую строку */
    .rk-toolbar .rk-grow { flex-basis: 200px; }
}
@media (max-width: 767px) {
    .rk-toolbar > *, .rk-toolbar select, .rk-toolbar .rk-btn { flex: 1 1 100%; width: 100%; }
    .rk-toolbar .rk-count { margin-left: 0; }
}

.rk-chips { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; margin: 0 0 16px; padding: 2px; }
.rk-chips::-webkit-scrollbar { display: none; }
.rk-chip {
    display: inline-flex; align-items: center; gap: 7px; flex: none;
    height: 36px; padding: 0 14px; border-radius: var(--rk-r-pill);
    background: #fff; border: 1px solid var(--rk-border); color: var(--rk-text-2);
    font-size: var(--rk-fs-md); font-weight: 600; text-decoration: none; white-space: nowrap;
    transition: background var(--rk-dur) var(--rk-ease), border-color var(--rk-dur) var(--rk-ease), color var(--rk-dur) var(--rk-ease);
}
.rk-chip:hover { border-color: var(--rk-border-strong); color: var(--rk-text); text-decoration: none; }
.rk-chip .rk-chip-count { min-width: 22px; height: 20px; padding: 0 6px; border-radius: 10px; background: var(--rk-surface-3); color: var(--rk-muted); font-size: 11.5px; line-height: 20px; text-align: center; }
.rk-chip.is-active { background: var(--rk-nav-bg); border-color: var(--rk-nav-bg); color: #fff; }
.rk-chip svg { width: 16px; height: 16px; flex: none; }
.rk-chip.is-active .rk-chip-count { background: rgba(255, 255, 255, 0.16); color: #fff; }

.rk-pagination { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 16px; }
.rk-pagination .rk-pages { display: flex; gap: 6px; flex-wrap: wrap; }
.rk-page-link {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 36px; height: 36px; padding: 0 10px; border-radius: 9px;
    border: 1px solid var(--rk-border); background: #fff; color: var(--rk-text-2);
    font-size: var(--rk-fs-md); font-weight: 600; text-decoration: none;
}
.rk-page-link:hover { border-color: var(--rk-border-strong); color: var(--rk-text); text-decoration: none; }
.rk-page-link.is-current { background: var(--rk-nav-bg); border-color: var(--rk-nav-bg); color: #fff; }
.rk-page-link.is-disabled { opacity: 0.45; pointer-events: none; }
.rk-page-link svg { width: 16px; height: 16px; }

/* ============================================================ списки и события */
.rk-list { list-style: none; margin: 0; padding: 0; }
.rk-list > li, .rk-list > a { display: flex; align-items: center; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--rk-border); color: var(--rk-text); text-decoration: none; min-width: 0; }
.rk-list > li:last-child, .rk-list > a:last-child { border-bottom: 0; }
.rk-list > a:hover { text-decoration: none; }
.rk-list > a:hover .rk-list-title { color: var(--rk-red); }
.rk-list-body { flex: 1 1 auto; min-width: 0; }
.rk-list-title { font-weight: 650; font-size: var(--rk-fs-md); line-height: 1.35; overflow-wrap: anywhere; transition: color var(--rk-dur) var(--rk-ease); }
.rk-list-sub { color: var(--rk-muted); font-size: var(--rk-fs-sm); line-height: 1.4; overflow-wrap: anywhere; }
.rk-list-meta { flex: none; color: var(--rk-faint); font-size: var(--rk-fs-xs); white-space: nowrap; align-self: flex-start; margin-top: 2px; }
.rk-list-end { flex: none; display: flex; align-items: center; gap: 8px; }
.rk-list svg.rk-go { width: 18px; height: 18px; color: var(--rk-faint); flex: none; }
.rk-ic-tile {
    width: 38px; height: 38px; border-radius: 10px; flex: none;
    display: inline-flex; align-items: center; justify-content: center;
    background: var(--rk-surface-3); color: var(--rk-text-2);
}
.rk-ic-tile svg { width: 20px; height: 20px; }
.rk-ic-tile.tone-red { background: var(--rk-red-soft); color: var(--rk-red); }
.rk-ic-tile.tone-orange { background: var(--rk-orange-soft); color: var(--rk-orange); }
.rk-ic-tile.tone-blue { background: var(--rk-blue-soft); color: var(--rk-blue); }
.rk-ic-tile.tone-green { background: var(--rk-green-soft); color: var(--rk-green); }
.rk-ic-tile.tone-violet { background: var(--rk-violet-soft); color: var(--rk-violet-text); }
.rk-ic-tile.is-sm { width: 32px; height: 32px; border-radius: 9px; }
.rk-ic-tile.is-sm svg { width: 17px; height: 17px; }

/* «Требуют внимания» — строки с понятным действием */
.rk-attn { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.rk-attn > li {
    display: flex; align-items: center; gap: 14px;
    padding: 12px 14px; border-radius: var(--rk-r);
    background: #fff; border: 1px solid var(--rk-border);
}
.rk-attn .rk-attn-body { flex: 1 1 auto; min-width: 0; }
.rk-attn .rk-attn-title { font-weight: 650; font-size: var(--rk-fs-md); line-height: 1.35; overflow-wrap: anywhere; }
.rk-attn .rk-attn-text { color: var(--rk-muted); font-size: var(--rk-fs-sm); line-height: 1.4; margin-top: 2px; overflow-wrap: anywhere; }
.rk-attn .rk-btn { flex: none; min-width: 120px; }
@media (max-width: 640px) {
    .rk-attn > li { flex-wrap: wrap; }
    .rk-attn .rk-attn-body { flex-basis: calc(100% - 56px); }
    .rk-attn .rk-btn { width: 100%; }
}

/* Пустое состояние */
.rk-empty { text-align: center; padding: 34px 20px; color: var(--rk-muted); }
.rk-empty .rk-empty-ic { width: 56px; height: 56px; border-radius: 16px; margin: 0 auto 12px; display: flex; align-items: center; justify-content: center; background: var(--rk-surface-3); color: var(--rk-faint); }
.rk-empty .rk-empty-ic svg { width: 28px; height: 28px; }
.rk-empty b { display: block; color: var(--rk-text); font-size: var(--rk-fs-base); margin-bottom: 4px; }
.rk-empty p { margin: 0 auto 14px; max-width: 420px; font-size: var(--rk-fs-md); }
.rk-empty.is-compact { padding: 18px 10px; }

/* Шкала этапов доставки */
.rk-stepper { display: flex; list-style: none; margin: 4px 0 0; padding: 0; }
.rk-stepper li { flex: 1 1 0; position: relative; text-align: center; min-width: 0; padding: 0 2px; }
.rk-stepper li::before {
    content: ""; position: absolute; top: 11px; left: -50%; right: 50%; height: 3px;
    background: var(--rk-border); z-index: 0;
}
.rk-stepper li:first-child::before { display: none; }
.rk-stepper li.is-done::before, .rk-stepper li.is-current::before { background: var(--rk-green); }
.rk-stepper .rk-step-dot {
    position: relative; z-index: 1;
    width: 24px; height: 24px; margin: 0 auto 6px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    background: #fff; border: 2px solid var(--rk-border-strong); color: #fff;
}
.rk-stepper .rk-step-dot svg { width: 14px; height: 14px; }
.rk-stepper li.is-done .rk-step-dot { background: var(--rk-green); border-color: var(--rk-green); }
.rk-stepper li.is-current .rk-step-dot { background: #fff; border-color: var(--rk-green); box-shadow: 0 0 0 4px var(--rk-green-soft); }
.rk-stepper li.is-current .rk-step-dot::after { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--rk-green); }
.rk-stepper .rk-step-label { display: block; font-size: 11.5px; font-weight: 600; line-height: 1.25; color: var(--rk-muted); overflow-wrap: anywhere; }
.rk-stepper li.is-done .rk-step-label, .rk-stepper li.is-current .rk-step-label { color: var(--rk-text); }
.rk-stepper .rk-step-date { display: block; font-size: 11px; color: var(--rk-faint); margin-top: 1px; }

.rk-stepper li.is-skipped .rk-step-dot { border-style: dashed; }
.rk-stepper li.is-skipped .rk-step-label { color: var(--rk-faint); }

/* Таблица главной: отдельная колонка даты — на широких экранах, на остальных дата под номером */
/* Компактная таблица (главная): плотнее, длинная подпись заказа — в одну строку с многоточием */
@media (min-width: 768px) {
    .rk-table.is-compact { font-size: 13.5px; }
    .rk-table.is-compact th { padding: 10px 10px; }
    .rk-table.is-compact td { padding: 11px 10px; }
    .rk-table.is-compact th:first-child, .rk-table.is-compact td:first-child { padding-left: 14px; }
    .rk-table.is-compact .rk-cell-main { max-width: 210px; overflow: hidden; text-overflow: ellipsis; }
    .rk-table.is-compact .rk-btn-sm { padding: 0 11px; }
    .rk-table.is-compact .rk-btn-sm.rk-btn-icon { padding: 0; }
    .rk-table.is-compact .rk-cell-wrap { min-width: 150px; max-width: 240px; }
    .rk-table.is-compact .rk-goods-name { max-width: 220px; }
}
@media (min-width: 768px) and (max-width: 1499px) {
    .rk-table.is-compact .rk-goods-name { max-width: 150px; }
    .rk-table.is-compact .rk-cell-main { max-width: 170px; }
    .rk-table.is-compact .rk-thumbs { display: none; }
}
.rk-row-actions { display: inline-flex; align-items: center; gap: 4px; }
@media (min-width: 768px) and (max-width: 1365px) {
    table.rk-table.is-compact td.rk-col-goods, table.rk-table.is-compact th.rk-col-goods { display: none; }
}
/* ПК: левое меню и правая колонка стоят на месте, прокручивается только центр.
   Правая колонка занимает высоту экрана; если в ней больше, чем помещается,
   она листается сама (колесо над ней), не сдвигая страницу.
   На телефоне и узких экранах (одна колонка) — всё как раньше. */
@media (min-width: 1100px) {
    .rk-layout > aside {
        position: sticky;
        /* сверху — тот же отступ, что у страницы (24px), снизу — нижний отступ страницы (48px):
           колонка помещается целиком и не «уезжает» в конце прокрутки */
        top: calc(var(--rk-topbar-h) + 22px);
        max-height: calc(100vh - var(--rk-topbar-h) - 70px);
        overflow-y: auto; overflow-x: hidden;
        overscroll-behavior: contain;
        /* место для теней карточек, чтобы прокрутка их не обрезала */
        padding: 2px 6px 14px; margin: -2px -6px 0;
        scrollbar-width: thin; scrollbar-color: rgba(20, 25, 34, 0.18) transparent;
    }
    .rk-layout > aside::-webkit-scrollbar { width: 6px; }
    .rk-layout > aside::-webkit-scrollbar-thumb { background: rgba(20, 25, 34, 0.18); border-radius: 3px; }
    .rk-layout > aside .rk-sticky { position: static; }
}

/* Оформление заказа: правая колонка шире — длинные варианты оплаты в списке видны целиком */
@media (min-width: 1100px) {
    .rk-layout.is-checkout { grid-template-columns: minmax(0, 1fr) 400px; }
}

/* Главная кабинета: заголовок внутри левой колонки. На ПК под ним сразу показатели;
   на телефоне — первым, как и раньше (показатели и «Требуют внимания» идут следом). */
.rk-home-head > .rk-page-head { margin-bottom: 0; }
.rk-home-head > .success, .rk-home-head > .error { margin: 16px 0 0; }
@media (min-width: 768px) {
    /* Кнопка «Новый заказ» остаётся справа от заголовка, подзаголовок переносится */
    .rk-home-head > .rk-page-head { flex-wrap: nowrap; }
    .rk-home-head > .rk-page-head .rk-page-title { flex: 1 1 auto; }
    .rk-home-head > .rk-page-head .rk-page-actions { flex: none; }
}
/* Узкая левая колонка (ноутбуки 1100–1439): значок над подписью, чтобы подписи не ломались по-разному */
@media (min-width: 1100px) and (max-width: 1439px) {
    .rk-layout .rk-stats:not(.is-6):not(.is-3) .rk-stat-top { flex-direction: column; align-items: flex-start; gap: 10px; }
    .rk-layout .rk-stats:not(.is-6):not(.is-3) .rk-stat-label { white-space: nowrap; }
}
@media (max-width: 767px) {
    .rk-home-head { order: -2; }
    .rk-home-head > .rk-page-head { margin-bottom: 4px; }
    .rk-home-head > .success, .rk-home-head > .error { margin: 16px 0 4px; }
}

/* «Что сейчас» отдельной колонкой — на широких ПК; на 768–1439 — строкой под статусом.
   На телефоне (карточки) колонка остаётся как есть. */
.rk-now-inline { display: none; }
@media (min-width: 768px) and (max-width: 1439px) {
    table.rk-table td.rk-col-now, table.rk-table th.rk-col-now { display: none; }
    .rk-now-inline { display: block; margin-top: 5px; }
}
table.rk-table td.rk-col-date, table.rk-table th.rk-col-date { display: none; }
@media (min-width: 1500px) {
    table.rk-table td.rk-col-date, table.rk-table th.rk-col-date { display: table-cell; }
    table.rk-table .rk-date-sub { display: none; }
}

/* Вертикальная шкала — для узкой колонки и длинного пути */
.rk-stepper.is-vertical { flex-direction: column; gap: 0; }
.rk-stepper.is-vertical li { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; align-items: center; column-gap: 12px; text-align: left; padding: 0 0 14px; }
.rk-stepper.is-vertical li:last-child { padding-bottom: 0; }
.rk-stepper.is-vertical li::before { top: 24px; bottom: -2px; left: 11px; right: auto; width: 2px; height: auto; }
.rk-stepper.is-vertical li:first-child::before { display: block; }
.rk-stepper.is-vertical li:last-child::before { display: none; }
.rk-stepper.is-vertical li::before { background: var(--rk-border-strong); }
.rk-stepper.is-vertical li.is-done::before { background: var(--rk-green); }
.rk-stepper.is-vertical li.is-current::before { background: var(--rk-border-strong); }
.rk-stepper.is-vertical .rk-step-dot { margin: 0; }
.rk-stepper.is-vertical .rk-step-label { font-size: var(--rk-fs-md); font-weight: 500; }
.rk-stepper.is-vertical li.is-current .rk-step-label { font-weight: 700; }
.rk-stepper.is-vertical .rk-step-date { margin: 0; font-size: var(--rk-fs-xs); }

/* Метрика «сумма» */
.rk-money-lg { font-size: 30px; font-weight: 800; letter-spacing: -0.02em; line-height: 1.1; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }

/* Заглушка загрузки */
.skeleton, .rk-skeleton {
    background: linear-gradient(90deg, #e9ecf1 25%, #f4f5f8 50%, #e9ecf1 75%);
    background-size: 200% 100%;
    animation: rk-shimmer 1.2s infinite;
    border-radius: 6px;
}
@keyframes rk-shimmer { from { background-position: 200% 0; } to { background-position: -200% 0; } }

/* Модальные окна */
.modal-overlay, .rk-modal {
    display: none; position: fixed; inset: 0; z-index: 1000;
    align-items: center; justify-content: center; padding: 20px;
    background: rgba(10, 14, 22, 0.5);
}
.modal-overlay.visible, .rk-modal.is-open { display: flex; animation: rk-fade 0.15s ease-out; }
.modal-box, .rk-modal-box {
    width: 100%; max-width: 420px; padding: 24px;
    background: #fff; border-radius: var(--rk-r-xl); box-shadow: var(--rk-shadow-pop);
    animation: rk-pop 0.16s var(--rk-ease);
}
.modal-box h3, .rk-modal-box h3 { margin: 0 0 8px; font-size: var(--rk-fs-lg); }
.modal-box p, .rk-modal-box p { margin: 0 0 20px; color: var(--rk-muted); font-size: var(--rk-fs-md); line-height: 1.5; }
@keyframes rk-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes rk-pop { from { transform: translateY(6px) scale(0.97); opacity: 0; } to { transform: none; opacity: 1; } }

/* Кнопка «Назад» */
.back-link {
    display: inline-flex; align-items: center; gap: 4px;
    color: var(--rk-muted); text-decoration: none;
    font-size: var(--rk-fs-sm); font-weight: 600; margin: 0 0 12px;
}
.back-link:hover { color: var(--rk-text); text-decoration: none; }
.back-link svg { width: 16px; height: 16px; }
/* На компьютере путь показывают «хлебные крошки» и меню — «Назад» нужен только на телефоне. */
@media (min-width: 768px) { main > .back-link.rk-back { display: none; } }

/* Утилиты */
.rk-mt-0 { margin-top: 0 !important; }
.rk-mb-0 { margin-bottom: 0 !important; }
.rk-gap-sm { gap: 8px !important; }
.rk-right { text-align: right; }
.rk-text-red { color: var(--rk-red); }
.rk-text-green { color: var(--rk-green-text); }
.rk-text-orange { color: var(--rk-orange-text); }
.rk-strong { font-weight: 700; }
.rk-divider { height: 1px; background: var(--rk-border); margin: 14px 0; }
.rk-flex { display: flex; align-items: center; gap: 10px; }
.rk-between { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.rk-wrap { flex-wrap: wrap; }

/* Длинные суммы и подписи не выходят за экран (ТЗ №6, п.10). */
.order-card, .item-row, .balance-box, .terms-box { min-width: 0; overflow-wrap: anywhere; }

/* ============================================================ уменьшение движения */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* ============================================================ печать */
@media print {
    .rk-topbar, .rk-sidebar, .rk-tabs, .rk-backdrop { display: none !important; }
    .rk-shell { padding: 0 !important; }
    main.rk-main { max-width: none; padding: 0; }
    .card, .rk-card { box-shadow: none; }
}

/* ---------------------------------------------------------------- прогноз прибытия и предварительная стоимость (21.10.2026)
   Блоки — templates/_delivery_macros.html; данные — services/delivery_forecast и services/order_estimate. */
.rk-fc { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; border-radius: var(--rk-r-lg); background: var(--rk-blue-soft); border: 1px solid transparent; min-width: 0; }
.rk-fc.is-preliminary { background: var(--rk-gray-soft); }
.rk-fc.is-delayed { background: var(--rk-orange-soft); }
.rk-fc.is-arrived { background: var(--rk-green-soft); }
.rk-fc.is-unknown, .rk-fc.is-not_applicable { background: var(--rk-gray-soft); }
.rk-fc-ic { flex: none; width: 36px; height: 36px; border-radius: 10px; display: inline-flex; align-items: center; justify-content: center; background: var(--rk-surface); color: var(--rk-red); box-shadow: var(--rk-shadow-xs); }
.rk-fc.is-in_transit .rk-fc-ic { color: var(--rk-blue-text); }
.rk-fc.is-delayed .rk-fc-ic { color: var(--rk-orange-text); }
.rk-fc.is-arrived .rk-fc-ic { color: var(--rk-green-text); }
.rk-fc-ic svg { width: 19px; height: 19px; }
.rk-fc-body { min-width: 0; flex: 1; }
.rk-fc-title { font-size: var(--rk-fs-sm); font-weight: 650; color: var(--rk-muted); line-height: 1.35; }
.rk-fc-tag { display: inline-block; margin-left: 4px; padding: 1px 7px; border-radius: var(--rk-r-pill); background: var(--rk-surface); color: var(--rk-gray-text); font-size: 11px; font-weight: 650; vertical-align: 1px; white-space: nowrap; }
.rk-fc-tag.is-warn { color: var(--rk-orange-text); }
.rk-fc-range { font-size: 22px; font-weight: 800; color: var(--rk-text); line-height: 1.2; margin-top: 2px; letter-spacing: -0.01em; overflow-wrap: anywhere; }
.rk-fc-note { font-size: 12.5px; color: var(--rk-muted); line-height: 1.45; margin-top: 4px; }
.rk-fc-stage { font-size: 12.5px; color: var(--rk-text); font-weight: 600; margin-top: 6px; }
.rk-fc.is-compact { padding: 10px 12px; }
.rk-fc.is-compact .rk-fc-ic { width: 30px; height: 30px; }
.rk-fc.is-compact .rk-fc-range { font-size: 18px; }
.rk-fc-strip { display: flex; gap: 10px; align-items: center; padding: 10px 14px; border-radius: var(--rk-r); background: var(--rk-surface); border: 1px solid var(--rk-border); font-size: var(--rk-fs-sm); line-height: 1.45; margin: 0 0 12px; }
.rk-fc-strip .rk-fc-ic { width: 30px; height: 30px; }
.rk-fc-strip .rk-fc-ic svg { width: 17px; height: 17px; }

.rk-est { display: flex; flex-direction: column; margin: 0; }
.rk-est > div { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; padding: 9px 0; border-bottom: 1px solid var(--rk-border); }
.rk-est dt { margin: 0; font-size: var(--rk-fs-md); color: var(--rk-text); min-width: 0; }
.rk-est dt small { display: block; font-size: 12px; color: var(--rk-muted); margin-top: 2px; line-height: 1.4; font-weight: 400; }
.rk-est dd { margin: 0; font-weight: 650; text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.rk-est-line.is-estimated dd, .rk-est-line.is-partial dd { color: var(--rk-gray-text); }
.rk-est-tag { display: inline-block; padding: 2px 9px; border-radius: var(--rk-r-pill); background: var(--rk-orange-soft); color: var(--rk-orange-text); font-size: 12px; font-weight: 700; }
.rk-est-tag.is-ok { background: var(--rk-green-soft); color: var(--rk-green-text); }
.rk-est > .rk-est-total { border-bottom: 0; padding-top: 12px; }
.rk-est-total dt { font-weight: 750; }
.rk-est-total dd { font-size: var(--rk-fs-xl); font-weight: 800; }
.rk-est-weight { font-size: 12.5px; color: var(--rk-muted); margin: 2px 0 0; }
.rk-est-more { margin-top: 8px; font-size: 12.5px; }
.rk-est-more summary { cursor: pointer; color: var(--rk-gray-text); font-weight: 600; }
.rk-est-more ul { margin: 6px 0 0; padding-left: 18px; color: var(--rk-muted); line-height: 1.5; }
.rk-est-note { font-size: 12px; color: var(--rk-muted); line-height: 1.5; margin: 8px 0 0; }
.rk-fc + .rk-est-card, .rk-est-card + .rk-fc { margin-top: 0; }
@media (max-width: 599px) {
    .rk-fc-range { font-size: 20px; }
    .rk-est-total dd { font-size: var(--rk-fs-lg); }
}
.rk-est-group { font-size: var(--rk-fs-sm); font-weight: 750; color: var(--rk-text); margin: 14px 0 0; padding-bottom: 2px; }
.rk-est-group:first-of-type { margin-top: 0; }

/* ------------------------------------------------------------ деньги клиентов (27.10.2026) */
/* Подсказка у форм закупки и расходов: сколько своих денег можно тратить. */
.rk-money-hint { margin: 0 0 14px; padding: 10px 14px; border-radius: var(--rk-r); background: var(--rk-blue-soft); color: var(--rk-text); font-size: var(--rk-fs-sm); line-height: 1.5; }
.rk-money-hint.is-debt { background: var(--rk-danger-soft); color: #b42318; }
/* Главный администратор проводит операцию за счёт денег клиентов — с причиной. */
.rk-money-override { margin: 12px 0; padding: 10px 12px; border: 1px dashed var(--rk-danger); border-radius: var(--rk-r); background: #fff8f7; }
.rk-money-override summary { cursor: pointer; font-weight: 650; color: var(--rk-danger); font-size: var(--rk-fs-sm); }
.rk-money-override[open] summary { margin-bottom: 8px; }
.rk-money-override label { margin-top: 0; }
/* Сводка «Деньги на счетах» на странице «Финансы». */
.rk-money-sum .stat-box .value { font-size: 20px; }
.rk-money-sum .stat-box.is-own .value { color: var(--success); }
.rk-money-sum .stat-box.is-debt .value { color: var(--danger); }
.rk-money-total { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 16px; margin: 14px 0 0; padding-top: 12px; border-top: 1px solid var(--border); }
.rk-money-total b { font-size: 20px; font-variant-numeric: tabular-nums; }
.rk-money-debt { margin: 12px 0 0; padding: 10px 14px; border-radius: var(--rk-r); background: var(--rk-danger-soft); color: #b42318; font-size: var(--rk-fs-sm); line-height: 1.5; }
.rk-recon { margin-top: 12px; padding: 10px 14px; border-radius: var(--rk-r); font-size: var(--rk-fs-sm); line-height: 1.5; }
.rk-recon.is-ok { background: var(--rk-green-soft); color: var(--rk-green-text); }
.rk-recon.is-short { background: var(--rk-danger-soft); color: #b42318; }
.rk-recon.is-extra { background: var(--rk-orange-soft); color: var(--rk-orange-text); }