/*
 * Личный кабинет ЦСМ — оформление.
 *
 * Палитра и типографика сняты с публичного rostcsm.ru:
 *   акцент      #08c  (он же #0088cc)
 *   второй синий #4c87c8
 *   текст        #333
 *   заголовки    #475155
 *   рамки        #ddd
 *   подложки     #f6f6f6, #eff5f7
 *   шрифт        'Play', sans-serif — на сайте объявлен, но не подгружается,
 *                 поэтому фактически используется системный без засечек.
 *                 Повторяем ровно так же, внешних шрифтов не тянем.
 */

:root {
    --accent: #08c;
    --accent-dark: #4c87c8;
    --text: #333;
    --head: #475155;
    --border: #ddd;
    --bg-soft: #f6f6f6;
    --bg-cool: #eff5f7;
    --muted: #747474;
    --error: #c0392b;
}

* { box-sizing: border-box; }

body {
    margin: 0;
    font-family: 'Play', sans-serif;
    font-size: 15px;
    line-height: 1.5;
    color: var(--text);
    background: #fff;
}

a { color: var(--accent); }
a:hover { color: var(--accent-dark); }

h1, h2, h3 { color: var(--head); font-weight: 500; }
h1 { font-size: 24px; margin: 5px 0 24px; }
h2 { font-size: 20px; margin: 1.4rem 0 .8rem; }
h3 { font-size: 17px; }

.site-wrap { max-width: 1200px; margin: 0 auto; padding: 0 15px; }

/* ---------- Шапка ---------- */
.site-head { border-bottom: 1px solid var(--border); }
.site-head__top { background: var(--bg-cool); font-size: 13px; }
.site-head__top-in { display: flex; align-items: center; gap: 1.2rem; padding: .4rem 15px; }
.site-head__spacer { flex: 1; }
.site-head__user { color: var(--muted); }
.site-head__exit { color: var(--error); }
.site-head__main { display: flex; align-items: center; gap: 2rem; padding-top: .9rem; padding-bottom: .9rem; flex-wrap: wrap; }
.site-logo img { display: block; max-width: 100%; height: auto; }

.site-nav { display: flex; flex-wrap: wrap; gap: .2rem 1.1rem; margin-left: auto; }
.site-nav__link {
    text-transform: uppercase;
    font-size: 13px;
    text-decoration: none;
    color: var(--head);
    padding: .3rem 0;
    border-bottom: 2px solid transparent;
}
.site-nav__link:hover { color: var(--accent); }
.site-nav__link--active { color: var(--accent); border-bottom-color: var(--accent); }

/* ---------- Контент ---------- */
.site-content { padding: 1.2rem 15px 2.5rem; min-height: 50vh; }

/* ---------- Подвал ---------- */
.site-foot { background: var(--bg-soft); border-top: 1px solid var(--border); margin-top: 2rem; }
.site-foot__in { padding: 1.2rem 15px; font-size: 13px; color: var(--muted); }
.site-foot p { margin: .3rem 0; }

/* ---------- Кабинет: перевод на фирменную палитру ---------- */
.lk-header { background: var(--bg-cool); border-color: var(--border); }
.lk-menu__item a { color: var(--accent); border-color: var(--border); }
.lk-menu__item--active a { background: var(--accent); border-color: var(--accent); color: #fff; }
.lk-menu__item--exit a { color: var(--error); }
.lk-table th { background: var(--bg-soft); color: var(--head); }
.lk-table th, .lk-table td { border-color: var(--border); }
.lk-table tr.is-clickable:hover { background: var(--bg-cool); }
.lk-table th a, .lk-pager__links a, .lk-auth-links a { color: var(--accent); }
.lk-group { border-bottom-color: var(--border); color: var(--head); }
.lk-filter { background: var(--bg-soft); border-color: var(--border); }
.lk-error { color: var(--error); }
.lk-note { color: var(--muted); }

.lk-form button, .lk-filter button, .lk-table button {
    background: var(--accent);
    color: #fff;
    border: 1px solid var(--accent);
    border-radius: 3px;
    padding: .45rem 1.1rem;
    font: inherit;
    cursor: pointer;
}
.lk-form button:hover, .lk-filter button:hover, .lk-table button:hover { background: var(--accent-dark); border-color: var(--accent-dark); }
.lk-pwd__eye { background: #fff; color: var(--muted); }
.lk-pwd__eye:hover { background: var(--bg-soft); }

/* Штатные формы Битрикса (вход, восстановление) — привести к общему виду */
.bx-auth input[type=text], .bx-auth input[type=password],
input.bx-auth-input, .bx-auth-form input[type=text], .bx-auth-form input[type=password] {
    padding: .45rem; border: 1px solid #ccd3d9; border-radius: 3px; font: inherit;
}
.bx-auth input[type=submit], .bx-auth-form input[type=submit], input[name=Login], input[name=send_account_info] {
    background: var(--accent); color: #fff; border: 1px solid var(--accent);
    border-radius: 3px; padding: .45rem 1.1rem; font: inherit; cursor: pointer;
}

/* ---------- Адаптив ---------- */
@media (max-width: 900px) {
    .site-head__main { gap: 1rem; }
    .site-nav { margin-left: 0; width: 100%; }
}

@media (max-width: 600px) {
    body { font-size: 14px; }
    .site-head__top-in { flex-wrap: wrap; gap: .5rem 1rem; }
    .site-nav { gap: .2rem .8rem; }
    .site-nav__link { font-size: 12px; }
    .lk-table { display: block; overflow-x: auto; }
    .lk-filter__row { flex-direction: column; align-items: stretch; }
    .lk-menu { gap: .25rem; }
    .lk-menu__item--exit { margin-left: 0; }
}


/* ------------------------------------------------------------------
   Раньше эти правила печатались прямо на странице методом Ui::styles().
   Источников оформления было два, и они частично дублировали друг друга.
   Блок перенесён сюда без изменений и стоит последним — порядок применения
   тот же, что был: сначала правила выше, потом эти.
   ------------------------------------------------------------------ */

.lk-header { display:flex; gap:1rem; align-items:baseline; padding:.6rem .9rem;
             background:#eff5f7; border:1px solid #ddd; border-radius:4px; margin-bottom:1rem; }
.lk-header__name { color:#747474; }
.lk-menu { list-style:none; display:flex; flex-wrap:wrap; gap:.3rem; padding:0; margin:0 0 1.2rem; }
/* Шаблон сайта подставляет свой маркер списка (::before) — гасим его в меню ЛК. */
.lk-menu li::before, .lk-menu li::marker { content:none; display:none; }
.lk-menu li { background:none; padding:0; }
.lk-menu__item a { display:block; padding:.45rem .9rem; border:1px solid #ddd;
                   border-radius:4px; text-decoration:none; color:#08c; background:#fff; }
.lk-menu__item--active a { background:#08c; color:#fff; border-color:#08c; }
.lk-menu__item--exit { margin-left:auto; }
.lk-menu__item--exit a { color:#a33; }
/* Ширина — во всю страницу (просьба заказчика 17.09.2026). Столбцы можно
   тянуть мышкой: разметку и ширины проставляет js/tables.js. */
.lk-table { border-collapse:collapse; width:100%; margin:.5rem 0 1.5rem; }
.lk-table th, .lk-table td { border:1px solid #ddd; padding:.45rem .7rem; text-align:left;
                             overflow-wrap:anywhere; }
/* Таблица с заданными ширинами столбцов: браузер обязан их соблюдать,
   иначе при перетаскивании соседние столбцы «плывут» сами. */
.lk-table.is-resizable { table-layout:fixed; }
.lk-table.is-resizable th { position:relative; }
/* Полоса захвата у правой границы заголовка. Шире самой границы, иначе
   в неё трудно попасть мышкой. */
.lk-table__grip { position:absolute; top:0; right:-3px; width:7px; height:100%;
                  cursor:col-resize; user-select:none; z-index:1; }
.lk-table__grip:hover, .lk-table.is-resizing .lk-table__grip--active { background:#08c; opacity:.35; }
/* Пока тянем — гасим выделение текста и подсветку кликабельных строк. */
.lk-table.is-resizing { user-select:none; }
.lk-table.is-resizing tr.is-clickable:hover { background:none; }
/* Столбцы растянули шире страницы — прокрутка внутри блока, а не всей страницы. */
.lk-table-scroll { max-width:100%; overflow-x:auto; }
.lk-table th { background:#f6f6f6; font-weight:600; }
.lk-table tr.is-clickable { cursor:pointer; }
.lk-table tr.is-clickable:hover { background:#eff5f7; }
.lk-table tr.is-readonly { color:#888; }
.lk-badge { font-size:12px; color:#197b30; }
.lk-error { color:#c0392b; font-weight:bold; }
.lk-note { color:#747474; font-size:13px; }
.lk-form { margin:.5rem 0 1.5rem; }
.lk-form input[type=text] { padding:.4rem; border:1px solid #ccd3d9; border-radius:3px; }
.lk-form button { padding:.45rem 1rem; cursor:pointer; }
.lk-filter { padding:.8rem; background:#f6f6f6; border:1px solid #ddd; border-radius:4px; }
.lk-filter__row { display:flex; flex-wrap:wrap; gap:.8rem; align-items:end; margin-bottom:.6rem; }
.lk-filter__row:last-child { margin-bottom:0; }
.lk-filter label { display:flex; flex-direction:column; font-size:13px; color:#747474; gap:.2rem; }
.lk-filter input, .lk-filter select { padding:.35rem; border:1px solid #ccd3d9; border-radius:3px; }
.lk-table th a { color:#08c; text-decoration:none; }
.lk-table th a:hover { text-decoration:underline; }
.lk-group { font-size:15px; margin:1.2rem 0 .3rem; padding-bottom:.3rem; border-bottom:1px solid #ddd; }
.lk-group .lk-note { font-weight:normal; }
.lk-pager { margin:1rem 0; font-size:13px; color:#747474; }
.lk-pager__links { margin-left:.6rem; }
.lk-pager__links a, .lk-pager__links b { display:inline-block; padding:.15rem .45rem; }
.lk-pager__links a { color:#08c; }
.lk-errors { margin:.6rem 0 1rem; padding:.6rem .9rem; background:#fdeeee;
             border:1px solid #f0c0c0; border-radius:4px; }
.lk-errors .lk-error { margin:.2rem 0; }
.lk-reg { max-width:560px; }
.lk-reg__row { display:block; margin-bottom:.9rem; }
.lk-reg__row > span { display:block; font-size:13px; color:#747474; margin-bottom:.2rem; }
.lk-reg__row small { display:block; margin-top:.2rem; }
.lk-req { color:#c0392b; }
.lk-input { width:100%; padding:.45rem; border:1px solid #ccd3d9; border-radius:3px; }
.lk-input--error { border-color:#c0392b; background:#fffafa; }
/* Специфичность выше, чем у `.lk-reg__row > span { display:block }` — иначе
   поле пароля и иконка встают друг под другом. */
.lk-reg__row > span.lk-pwd, .lk-pwd { display:flex; gap:.4rem; align-items:stretch; }
.lk-pwd .lk-input { flex:1; }
.lk-pwd__eye { padding:.35rem .6rem; border:1px solid #ccd3d9; background:#fff;
               border-radius:3px; cursor:pointer; font-size:15px; line-height:1; }
.lk-reg__agree { display:flex; gap:.5rem; align-items:flex-start; margin:1rem 0;
                 padding:.5rem; border-radius:4px; font-size:14px; }
.lk-reg__agree.lk-input--error { background:#fffafa; border:1px solid #c0392b; }
.lk-auth-links { margin:.8rem 0; font-size:14px; line-height:1.9; }
.lk-auth-links a { color:#08c; }
