/* Файл: client/js/Widgets/Pages.css
   Стили закладок (type:"pages"/"page", см. Widgets/Pages.js). Цвета — не новые, те же, что у
   остальных виджетов движка (border var(--line, #ddd) как у .group-card, акцент var(--accent, #0078d7) как у .form-button,
   см. client-form.css/Button.css) — закладки не должны выглядеть отдельной темой внутри той же
   формы. */

.pages-container {
    border: 1px solid var(--line, #ddd);
    border-radius: var(--radius, 10px);
    overflow: hidden;
}

.pages-tabs {
    display: flex;
    flex-wrap: wrap;
    background: var(--page-bg, #eef2f7);
    border-bottom: 1px solid var(--line, #ddd);
}

.pages-tab-btn {
    appearance: none;
    border: none;
    background: transparent;
    color: var(--ink-soft, #4a5568);
    font-family: inherit;
    font-size: var(--font-size, 14px);
    padding: 10px 18px;
    cursor: pointer;
    border-bottom: 2px solid transparent;
    margin-bottom: -1px;
}
.pages-tab-btn:hover {
    color: var(--ink, #222);
}
.pages-tab-btn[aria-selected="true"] {
    background: var(--card, #fff);
    color: var(--accent, #0078d7);
    border-bottom: 2px solid var(--accent, #0078d7);
    font-weight: bold;
}
.pages-tab-btn:focus-visible {
    outline: 2px solid var(--accent, #0078d7);
    outline-offset: -2px;
}

/* Внутренний отступ панели — намеренно здесь, а не на самой странице (type:"page" по умолчанию
   рисуется с BorderVisibility:NoBorder, то есть без собственного padding группы, см.
   Widgets/Group.js::renderElementFormGroup) — иначе при NoBorder контент прилипал бы к краям. */
.pages-panel {
    /* Единое правило отступов (project_unified_spacing_distance): панель страницы — КОНТЕЙНЕР, своих
       отступов нет (padding 0). Страница рендерится как group (renderElementFormGroup), её дети —
       ячейки .group-cell с padding со всех сторон, они и дают отступ от края панели. Было
       padding var(--spacing) calc(var(--spacing)*1.5). */
    padding: 0;
}
.pages-panel[hidden] {
    display: none;
}