/**
 * Оболочка кабинета (psmy-75): боковая панель, верхняя строка, шапка страницы, область контента.
 * Мобильная и планшетная раскладка — в mobile.css. Компоненты и мост к legacy-классам — в components.css.
 */
html, body{
    height: auto;
    min-height: 100%;
}
body.cabinet{
    margin: 0;
    background: var(--c-canvas);
    color: var(--c-text);
    font-family: var(--c-font);
    font-size: var(--c-fs);
    line-height: var(--c-lh);
    font-weight: 400;
    -webkit-font-smoothing: antialiased;
}
.mono, .cab-mono{
    font-family: var(--c-mono);
    font-size: var(--c-fs-mono);
    font-weight: 500;
}

/* сетка: панель + тело */
#layout-wrapper.cab{
    display: grid;
    grid-template-columns: var(--c-side-w) minmax(0, 1fr);
    min-height: 100vh;
    /* колонка панели закрашена на всю высоту страницы: сама панель липкая и не выше окна,
       иначе при прокрутке под ней светится фон холста */
    --cab-side-col: var(--c-side-w);
    background: linear-gradient(90deg, var(--c-side-bg) 0, var(--c-side-bg) var(--cab-side-col), var(--c-canvas) var(--cab-side-col));
}
#layout-wrapper.cab.cab--bare,
#layout-wrapper.cab.cab--guest{
    grid-template-columns: minmax(0, 1fr);
    background: var(--c-canvas);
}
/* на десктопе и планшете страница не прокручивается целиком: панель, строка поиска и шапка страницы стоят,
   прокручивается только область контента (.cab-content) */
@media (min-width: 768px){
    #layout-wrapper.cab:not(.cab--bare):not(.cab--guest){ height: 100vh; min-height: 0; overflow: hidden; }
    #layout-wrapper.cab:not(.cab--bare):not(.cab--guest) .cab-side{ position: static; height: auto; min-height: 0; }
    #layout-wrapper.cab:not(.cab--bare):not(.cab--guest) .cab-body{ height: 100vh; min-height: 0; }
    #layout-wrapper.cab:not(.cab--bare):not(.cab--guest) .cab-main{ min-height: 0; }
    #layout-wrapper.cab:not(.cab--bare):not(.cab--guest) .cab-content{ min-height: 0; overflow-y: auto; overscroll-behavior: contain; }
}
.cab-body{
    min-width: 0;
    display: flex;
    flex-direction: column;
}

/* иконки спрайта */
.cab-ico{
    width: 18px;
    height: 18px;
    flex-shrink: 0;
    stroke: currentColor;
    fill: none;
    stroke-width: 1.7;
    stroke-linecap: round;
    stroke-linejoin: round;
}
.cab-ico--s{ width: 14px; height: 14px; }
.cab-ico--l{ width: 22px; height: 22px; }

/* боковая панель */
.cab-side{
    position: sticky;
    top: 0;
    height: 100vh;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    gap: 18px;
    padding: 14px 12px;
    background: var(--c-side-bg);
    color: var(--c-side-text);
    overflow-y: auto;
    overflow-x: hidden;
}
.cab-logo{
    display: flex;
    align-items: center;
    gap: 10px;
    height: 32px;
    padding: 0 6px;
    color: #FFFFFF;
    text-decoration: none;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    line-height: 1;
}
.cab-logo img{
    width: 28px;
    height: 28px;
    display: block;
}
.cab-logo:hover{ color: #FFFFFF; text-decoration: none; }

/* блок «Сайт» */
.cab-site{ position: relative; }
body.cabinet .cab-site__btn{
    height: auto;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: 100%;
    min-height: 40px;
    padding: 0 10px;
    box-sizing: border-box;
    border-radius: var(--c-r);
    border: 1px solid var(--c-side-line);
    background: var(--c-side-active);
    color: #FFFFFF;
    text-align: left;
    cursor: pointer;
    font: inherit;
    line-height: 1.2;
    box-shadow: none;
    min-width: 0;
    overflow: hidden;
}
.cab-site__btn:hover{ border-color: var(--c-side-muted); text-decoration: none; }
/* иконка состояния сайта в переключателе: на тёмной кнопке — цветной значок на полупрозрачной плитке, в списке — на светлой */
.cab-site__ico{ display: inline-flex; align-items: center; justify-content: center; width: 24px; height: 24px; border-radius: var(--c-r-s); flex-shrink: 0; background: rgba(255, 255, 255, 0.08); }
.cab-site__ico--ok{ color: var(--c-ok); }
.cab-site__ico--warn{ color: var(--c-accent); }
.cab-site__ico--bad{ color: #F87171; }
.cab-site__ico--mute{ color: var(--c-side-muted); }
body.cabinet .cab-site__btn .cab-site__text{ flex: 1; }
.cab-site__list .cab-site__ico{ background: var(--c-surface-2); }
.cab-site__list .cab-site__ico--ok{ color: var(--c-ok-text); }
.cab-site__list .cab-site__ico--warn{ color: var(--c-accent-text); }
.cab-site__list .cab-site__ico--bad{ color: var(--c-bad-text); }
.cab-site__list .cab-site__ico--mute{ color: var(--c-text-3); }
.cab-site__list .cab-site__item{ flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* контекст аккаунта: вместо сайта — имя пользователя, ведёт в профиль (psmy-78) */
body.cabinet a.cab-site--account, body.cabinet a.cab-site--account:hover{ color: #FFFFFF; text-decoration: none; }
.cab-site--account .cab-site__name{ font-family: var(--c-font); font-size: var(--c-fs); }
.cab-site__btn:focus-visible{ outline: none; box-shadow: 0 0 0 3px rgba(255,255,255,0.15); }
.cab-site__btn[disabled]{ cursor: default; }
.cab-site__text{ display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.cab-site__label{
    font-size: 10.5px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--c-side-muted);
}
.cab-site__name{
    font-family: var(--c-mono);
    font-size: 12px;
    font-weight: 500;
    color: #FFFFFF;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.cab-site__btn .cab-ico{ color: var(--c-side-muted); }
.cab-site__list{
    display: none;
    position: absolute;
    z-index: 30;
    top: calc(100% + 4px);
    left: 0;
    right: 0;
    margin: 0;
    padding: 4px;
    list-style: none;
    background: var(--c-surface);
    border: 1px solid var(--c-line);
    border-radius: var(--c-r);
    box-shadow: 0 8px 24px rgba(31, 41, 51, 0.16);
    max-height: 320px;
    overflow-y: auto;
}
.cab-site.is-open .cab-site__list{ display: block; }
.cab-site__list li{ margin: 0; padding: 0; }
.cab-site__list a{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-height: 34px;
    padding: 0 8px;
    border-radius: var(--c-r-s);
    color: var(--c-text);
    text-decoration: none;
    font-family: var(--c-mono);
    font-size: 12px;
    font-weight: 500;
}
.cab-site__list a:hover{ background: var(--c-surface-2); text-decoration: none; }
.cab-site__list a.is-current{ background: var(--c-canvas); }
.cab-site__list .cab-site__all{
    font-family: var(--c-font);
    font-size: var(--c-fs-s);
    font-weight: 600;
    color: var(--c-text-2);
    border-top: 1px solid var(--c-line);
    border-radius: 0;
    margin-top: 4px;
}
.cab-site--empty{
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 10px;
    border-radius: var(--c-r);
    border: 1px dashed var(--c-side-line);
    color: var(--c-side-text);
    text-decoration: none;
    font-size: var(--c-fs-s);
}
.cab-site--empty strong{ color: #FFFFFF; font-weight: 600; }
.cab-site--empty:hover{ border-color: var(--c-side-muted); color: var(--c-side-text); text-decoration: none; }

/* навигация панели */
.cab-nav{
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 2px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.cab-nav .cab-nav__item{ margin: 0; padding: 0; }
.cab-nav__link{
    display: flex;
    width: 100%;
    box-sizing: border-box;
    align-items: center;
    gap: 10px;
    min-height: 34px;
    padding: 0 10px;
    border-radius: var(--c-r);
    color: var(--c-side-text);
    text-decoration: none;
    font-size: var(--c-fs);
    font-weight: 500;
    line-height: 1.2;
}
.cab-nav__link .cab-ico{ color: var(--c-side-muted); }
.cab-nav__link:hover{
    background: rgba(255, 255, 255, 0.06);
    color: #FFFFFF;
    text-decoration: none;
}
.cab-nav__item.is-active > .cab-nav__link{
    background: var(--c-side-active);
    color: #FFFFFF;
}
.cab-nav__item.is-active > .cab-nav__link .cab-ico{ color: var(--c-accent); }
.cab-nav__label{
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.cab-side__divider{
    height: 1px;
    margin: 0 6px;
    background: var(--c-side-active);
    flex-shrink: 0;
}
.cab-side__spacer{ flex: 1; }

/* верхняя строка */
.cab-top{
    height: var(--c-top-h);
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 0 var(--c-pad);
    background: var(--c-surface);
    border-bottom: 1px solid var(--c-line);
}
.cab-search{
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
    width: 420px;
    max-width: 100%;
    height: 32px;
    padding: 0 10px;
    box-sizing: border-box;
    border-radius: var(--c-r);
    border: 1px solid var(--c-line-2);
    background: var(--c-canvas);
    color: var(--c-text-3);
}
.cab-search:focus-within{ border-color: var(--c-ink); background: var(--c-surface); box-shadow: var(--c-focus); }
.cab-search input{
    flex: 1;
    min-width: 0;
    min-height: 0;
    height: 30px;
    padding: 0;
    border: none;
    background: transparent;
    color: var(--c-text);
    font: inherit;
    font-size: var(--c-fs);
    line-height: 30px;
    outline: none;
    box-shadow: none;
}
.cab-search input::placeholder{ color: var(--c-text-3); }
.cab-search kbd{
    font-family: var(--c-mono);
    font-size: 11px;
    padding: 1px 5px;
    border-radius: var(--c-r-s);
    border: 1px solid var(--c-line-2);
    background: var(--c-surface);
    color: var(--c-text-3);
}
/* подсказки глобального поиска (psmy-89): выпадающий список под полем верхней строки.
   Содержимое приходит ajax-запросом того же адреса, что и страница результатов (cabinet.js) */
.cab-sug{
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    right: 0;
    z-index: 40;
    max-height: min(70vh, 480px);
    overflow-y: auto;
    background: var(--c-surface);
    border: 1px solid var(--c-line);
    border-radius: var(--c-r-l);
    box-shadow: 0 8px 24px rgba(31, 41, 51, 0.12);
}
.cab-sug__group + .cab-sug__group{ border-top: 1px solid var(--c-line); }
.cab-sug__head{
    padding: 6px 12px;
    background: var(--c-surface-2);
    font-size: var(--c-fs-caps);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--c-text-3);
}
.cab-sug__head .cab-hint{ font-weight: 400; margin-left: 4px; text-transform: none; letter-spacing: 0; }
.cab-sug .cab-res__row{ padding: 7px 12px; }
.cab-sug .cab-res > .cab-res__row:first-child{ border-top: none; }
.cab-sug__empty{ padding: 14px 12px; text-align: center; font-size: var(--c-fs-s); color: var(--c-text-3); }
.cab-sug__all{
    display: block;
    padding: 9px 12px;
    border-top: 1px solid var(--c-line);
    border-radius: 0 0 var(--c-r-l) var(--c-r-l);
    background: var(--c-surface-2);
    font-size: var(--c-fs-s);
    font-weight: 600;
    color: var(--c-link);
    text-align: center;
}
.cab-sug__all:hover, .cab-sug__all.is-current{ background: var(--c-line); color: var(--c-link-hover); text-decoration: none; }
/* пока идёт запрос — список приглушён, но не мигает: прошлый ответ остаётся на месте */
.cab-sug.is-busy .cab-sug__inner{ opacity: 0.5; }

.cab-top__right{
    display: flex;
    align-items: center;
    gap: 16px;
    font-size: var(--c-fs-s);
    font-weight: 600;
    color: var(--c-text-2);
}
.cab-top__link{
    color: var(--c-text);
    text-decoration: none;
    font-weight: 600;
}
.cab-top__link:hover{ color: var(--c-link); text-decoration: none; }

/* обращения в верхней строке (psmy-84): только иконка, счётчик новых ответов — меткой в углу */
.cab-top__tickets{
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--c-ctl);
    height: var(--c-ctl);
    margin-right: -6px;
}
.cab-top__tickets .cab-ico{ color: var(--c-text-2); }
.cab-top__tickets:hover .cab-ico{ color: var(--c-link); }
.cab-top__count{
    position: absolute;
    top: 2px;
    right: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 16px;
    height: 16px;
    padding: 0 4px;
    box-sizing: border-box;
    border-radius: 8px;
    /* обводка цветом строки: метка не сливается с иконкой под ней */
    border: 2px solid var(--c-surface);
    background: var(--c-accent);
    color: var(--c-ink);
    font-size: 10px;
    font-weight: 700;
    line-height: 1;
}

/* переключатель языка (LangWidget, режим dropdown) в оболочке */
.cab-lang .lang-widget{
    position: relative;
    display: inline-flex;
    align-items: center;
    height: 30px;
    padding: 0 8px;
    border-radius: var(--c-r);
    cursor: pointer;
    color: var(--c-text-2);
    font-size: var(--c-fs-s);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    user-select: none;
}
.cab-lang .lang-widget:hover{ background: var(--c-surface-2); }
.cab-lang .lang-widget .lang-widget-current{ display: flex; align-items: center; gap: 4px; }
.cab-lang .lang-widget .lang-widget-current .icon{ display: none; }
.cab-lang .lang-widget .lang-widget-current-title{ display: inline; font-size: inherit; line-height: 1; }
.cab-lang .lang-widget .dropdown{
    display: none;
    position: absolute;
    z-index: 30;
    top: calc(100% + 4px);
    right: 0;
    left: auto;
    min-width: 160px;
    margin: 0;
    padding: 4px;
    list-style: none;
    background: var(--c-surface);
    border: 1px solid var(--c-line);
    border-radius: var(--c-r);
    box-shadow: 0 8px 24px rgba(31, 41, 51, 0.16);
    text-transform: none;
    letter-spacing: 0;
}
.cab-lang .lang-widget.expanded .dropdown{ display: block; }
.cab-lang .lang-widget .dropdown li{ margin: 0; padding: 0; }
.cab-lang .lang-widget .dropdown li a,
.cab-lang .lang-widget .dropdown li span{
    display: flex;
    align-items: center;
    min-height: 32px;
    padding: 0 8px;
    border-radius: var(--c-r-s);
    color: var(--c-text);
    text-decoration: none;
    font-size: var(--c-fs);
    font-weight: 500;
    white-space: nowrap;
}
.cab-lang .lang-widget .dropdown li a:hover{ background: var(--c-surface-2); text-decoration: none; }
.cab-lang .lang-widget .dropdown li.active span{ color: var(--c-text-3); }
.cab-lang--dark .lang-widget{ color: var(--c-side-text); }
.cab-lang--dark .lang-widget:hover{ background: rgba(255, 255, 255, 0.08); }

/* шапка страницы */
.cab-main{ display: flex; flex-direction: column; flex: 1; min-width: 0; }
.cab-head{
    display: flex;
    flex-direction: column;
    padding: 20px var(--c-pad) 0;
    background: var(--c-surface);
    border-bottom: 1px solid var(--c-line);
}
.cab-head__row{
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    padding-bottom: 16px;
}
.cab-head__title{ display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.cab-head .cab-head__h1,
.cab-head .cab-head__h1.page-title{
    margin: 0;
    padding: 0;
    font-family: var(--c-font);
    font-size: var(--c-fs-h1);
    line-height: 1.25;
    font-weight: 600;
    letter-spacing: -0.01em;
    color: var(--c-text);
    overflow-wrap: anywhere;
}
.cab-head__h1 i{ display: none; }
.cab-head__desc{ font-size: var(--c-fs-xs); color: var(--c-text-3); }
.cab-head__desc:empty{ display: none; }
.cab-head__actions{
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
    flex-wrap: wrap;
    justify-content: flex-end;
}
/* контент */
.cab-content{
    padding: 20px var(--c-pad) 32px;
    flex: 1;
    min-width: 0;
}
.cab-content > .page-wrapper{ max-width: none; padding: 0; }

/* пустой режим (empty-mode): без панели и строки, карточка по центру */
.cab--bare .cab-body{ align-items: center; justify-content: center; padding: 32px 16px; }
.cab--bare .cab-main{ width: 100%; max-width: 560px; flex: 0 0 auto; }
.cab--bare .cab-head{ border-radius: var(--c-r-l) var(--c-r-l) 0 0; border: 1px solid var(--c-line); border-bottom: none; }
.cab--bare .cab-content{ background: var(--c-surface); border: 1px solid var(--c-line); border-radius: 0 0 var(--c-r-l) var(--c-r-l); }
.cab--bare .cab-head + .cab-content{ border-top: 1px solid var(--c-line); }

/* мобильные части оболочки на десктопе скрыты */
.cab-mhead, .cab-msite, .cab-mtabs, .cab-sheet{ display: none; }