/* [2026-10-31] Режим у дашборда ОДИН — `carousel` (приказ PO «убери этот Overview режим, он не нужен»).
   Всё ниже описывает этот единственный вид: доска раздела во всю рабочую область.
   Chat: kawa-dashboard-console-2026-10-31. */
.dashboard-page .modules-wrapper {
    display: flex;
    flex-direction: column;
}

.dashboard-page #dashboard {
    flex: 1 1 auto;
    height: auto;
}

#dashboard-navigation {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: nowrap;
    min-width: 0;
    gap: var(--space-2) var(--space-4);
    overflow-x: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--border-primary) transparent;
    padding: var(--space-2) var(--space-4);
    border-bottom: 1px solid var(--border-primary);
}

#dashboard-navigation[hidden],
#dashboard-navigation .dash-board-navigation[hidden] {
    display: none;
}

#dashboard-navigation .dash-board-navigation {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    flex: 0 0 auto;
    gap: 2px;
    padding: 2px;
    border-radius: var(--radius-lg);
    background: var(--bg-tertiary);
}

#dashboard-navigation .dash-calendar-toolbar {
    padding-inline-start: var(--space-3);
    border-inline-start: 1px solid var(--border-primary);
}

#dashboard-navigation .dash-project-toolbar {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: var(--space-2);
    padding-inline-start: var(--space-3);
    border-inline-start: 1px solid var(--border-primary);
}

#dashboard-navigation .dash-project-toolbar[hidden] {
    display: none;
}

#dashboard-navigation .dash-project-toolbar .homepage-actions-row {
    display: contents;
}

#dashboard-navigation .dash-project-toolbar .frames-filter-select {
    width: 140px;
}

#dashboard[data-view='carousel'] [data-dashboard-board='projects'] > .dash-zone-header {
    display: none;
}

#dashboard .dash-module-symbol {
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.5;
    stroke-linecap: round;
    stroke-linejoin: round;
    color: var(--brand-primary-text);
}

#dashboard .dash-tool-text {
    min-width: 0;
}

#dashboard .dash-tool-description,
#dashboard .dash-recent {
    display: none;
}

#dashboard .dash-tool-carousel,
#dashboard .dash-tool-carousel-viewport,
#dashboard .dash-tool-group,
#dashboard .dash-tool-group-items {
    display: contents;
}

#dashboard .dash-tool-group-title,
#dashboard .dash-tool-carousel-head {
    display: none;
}

#dashboard-navigation .dash-board-navigation > button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 34px;
    height: 34px;
    padding: 0;
    border: 0;
    border-radius: var(--radius-lg);
    background: none;
    color: var(--text-secondary);
    font: inherit;
    font-size: var(--font-size-sm);
    cursor: pointer;
}

#dashboard-navigation .dash-board-navigation > button:hover {
    background: var(--bg-secondary);
    color: var(--text-primary);
}

#dashboard-navigation .dash-board-navigation > button[aria-pressed='true'] {
    background: var(--bg-secondary);
    color: var(--text-primary);
}

#dashboard-navigation .dash-board-navigation > button:focus-visible {
    outline: 1px solid var(--border-hover);
    outline-offset: -1px;
    box-shadow: none;
}

#dashboard-navigation .dash-board-navigation .material-icons {
    font-size: 20px;
}

#dashboard[data-view='carousel'] .dash-zone-tasks > .dash-zone-header > h2 {
    display: none;
}

#dashboard[data-view='carousel'] {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr);
    touch-action: pan-y pinch-zoom;
}

#dashboard[data-view='carousel'] .dash-tools-panel,
#dashboard[data-view='carousel'] .dash-content {
    display: contents;
    opacity: 1;
    pointer-events: auto;
}

#dashboard[data-view='carousel'] .dash-content-toolbar,
#dashboard[data-view='carousel'] [data-dashboard-board='tools'] > [data-panel-section-header],
#dashboard[data-view='carousel'] [data-dashboard-board] > [data-panel-section-header] > h2,
#dashboard[data-view='carousel'] [data-dashboard-board] > [data-panel-section-header] > .dash-zone-hint,
#dashboard[data-view='carousel'] [data-dashboard-board] > [data-panel-section-header] > .dash-section-caret {
    display: none;
}

#dashboard[data-view='carousel'] [data-dashboard-board] {
    grid-area: 1 / 1;
    display: flex;
    flex-direction: column;
    min-height: 0;
    min-width: 0;
    height: auto;
    margin: 0;
    padding: var(--space-4) var(--space-4) calc(var(--bottom-bar-height) + var(--space-3));
    border: 0;
    border-radius: 0;
    box-shadow: none;
    background: none;
    overflow: auto;
}

#dashboard[data-view='carousel'] [data-dashboard-board][data-board-active='false'] {
    visibility: hidden;
    pointer-events: none;
}

#dashboard[data-view='carousel'] [data-dashboard-board] > [data-panel-section-header] {
    padding: 0;
    cursor: default;
}

#dashboard[data-view='carousel'] .dash-tools-panel-title {
    font-size: var(--font-size-lg);
}

#dashboard[data-view='carousel'] [data-dashboard-board='tools'] > #dash-tools-grid {
    flex: 0 0 auto;
    overflow: visible;
}

#dashboard[data-view='carousel'] #dash-settings-grid {
    padding-bottom: 0;
}

#dashboard[data-view='carousel'] #dash-tools-grid {
    padding: 0;
}

#dashboard[data-view='carousel'] #dash-tools-grid > .dash-tools-section {
    display: block;
    padding: 0;
}

#dashboard[data-view='carousel'] .dash-tool-carousel {
    display: block;
    position: relative;
    min-width: 0;
}

/* [2026-10-31] Приказ PO по скрину: «карусель осталась по разделам», «а карточки внутри разделов
   строились вниз». Карусель сохранена и листается ПО РАЗДЕЛАМ: страница = один раздел целиком,
   шаг — ровно ширина области. Полоса прокрутки у самой карусели убрана (`scrollbar-width: none`) —
   это тот «скролл бар» со скрина; листают стрелки ‹ ›, клавиши и свайп, а ряд карточек внутри
   раздела заменён сеткой, которая растёт вниз.
   Ref: DESIGN.md §«Лэйаут страницы». Chat: kawa-dashboard-console-2026-10-31. */
#dashboard[data-view='carousel'] .dash-tool-carousel-viewport {
    display: flex;
    gap: var(--space-6);
    overflow-x: auto;
    overscroll-behavior-x: contain;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
}

#dashboard[data-view='carousel'] .dash-tool-group {
    display: block;
    flex: 0 0 100%;
    min-width: 0;
    scroll-snap-align: start;
}

/* [2026-10-31] Приказ PO по скрину: «перенеси эти кнопки в заголовок разделов, плавную прокрутку
   смахиванием разделов оставь». Заголовок теперь один на карусель — в строке вместе со стрелками;
   внутри страницы заголовка нет, поэтому её собственный `.dash-tool-group-title` скрыт целиком.
   Прокрутка смахиванием осталась прежней: `overflow-x: auto` + `scroll-snap` ниже не тронуты.
   Ref: DESIGN.md §«Лэйаут страницы». Chat: kawa-dashboard-console-2026-10-31. */
#dashboard[data-view='carousel'] .dash-tool-carousel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    margin-bottom: var(--space-2);
}

#dashboard[data-view='carousel'] .dash-tool-carousel-title {
    margin: 0;
    color: var(--text-secondary);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
}

#dashboard[data-view='carousel'] .dash-tool-carousel-arrows {
    display: inline-flex;
    flex: 0 0 auto;
    gap: var(--space-1);
}

#dashboard[data-view='carousel'] .dash-tool-group[data-tool-group='settings'] .dash-tool-group-title {
    display: none;
}

/* [2026-10-31] Приказ PO: «я же просил это плитками сделать как в других разделах карусели».
   В карусели разметка страницы уже даёт сетку (общие правила `.dash-tool-group-items`), но в
   обзорном режиме обёртки разделов раскрывались в `display: contents`, и ярлыки настроек
   становились строками во всю ширину — «гамбургер». Страница Settings держит свою сетку в ОБОИХ
   режимах: это тот же раздел, только без карусельной прокрутки.
   Ref: DESIGN.md §«Лэйаут страницы». Chat: kawa-dashboard-console-2026-10-31. */
#dashboard .dash-tool-group[data-tool-group='settings'] {
    display: block;
}

#dashboard .dash-tool-group[data-tool-group='settings'] .dash-tool-group-items {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: var(--space-3);
}

#dashboard[data-view='carousel'] .dash-tool-group-items {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: var(--space-3);
}

#dashboard[data-view='carousel'] #dash-tools-grid .dash-tool-group-items .dash-tool-item {
    min-width: 0;
}

/* Стрелки листают разделы и стоят В СТРОКЕ ЗАГОЛОВКА (приказ PO 2026-10-31), а не накрывают
   карточки: обычные квадратные кнопки 34×34, недоступная — приглушена. */
#dashboard[data-view='carousel'] .dash-tool-carousel-arrow {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    padding: 0;
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-lg);
    background: transparent;
    color: var(--text-primary);
    cursor: pointer;
}

#dashboard[data-view='carousel'] .dash-tool-carousel-arrow:hover:not(:disabled) {
    background: var(--bg-hover);
}

#dashboard[data-view='carousel'] .dash-tool-carousel-arrow:disabled {
    color: var(--text-disabled);
    cursor: default;
}

#dashboard[data-view='carousel'] #dash-tools-grid .dash-tool-item {
    display: grid;
    grid-template-columns: 24px minmax(0, 1fr);
    align-items: start;
    gap: var(--space-3);
    height: auto;
    padding: var(--space-4);
    background: var(--bg-secondary);
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-lg);
}

[data-theme='dark'] #dashboard[data-view='carousel'] #dash-tools-grid .dash-tool-item {
    border-color: transparent;
}

#dashboard[data-view='carousel'] #dash-tools-grid .dash-tool-item:hover {
    background: var(--bg-hover);
}

#dashboard[data-view='carousel'] .dash-module-symbol {
    width: 24px;
    height: 24px;
}

#dashboard[data-view='carousel'] #dash-tools-grid .dash-tool-label {
    display: block;
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-medium);
    white-space: normal;
}

#dashboard[data-view='carousel'] .dash-tool-description {
    display: block;
    margin-top: var(--space-1);
    color: var(--text-secondary);
    font-size: var(--font-size-sm);
    line-height: var(--line-height-normal);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#dashboard[data-view='carousel']
    .dash-tool-item:is(
        [data-tool-id='documents:pdf'],
        [data-module-id='fish'],
        [data-module-id='blueprint'],
        [data-module-id='dashboards'],
        [data-module-id='flyover'],
        [data-module-id='easy-solver'],
        [data-module-id='material-hub']
    )
    .dash-tool-description {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#dashboard[data-view='carousel'] .dash-recent {
    display: block;
    margin-top: var(--space-6);
}

#dashboard .dash-recent-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-3);
    margin-bottom: var(--space-3);
}

#dashboard .dash-recent-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--space-3);
}

#dashboard .dash-recent-file {
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--border-primary);
    border-radius: var(--radius-lg);
    background: var(--bg-secondary);
}

[data-theme='dark'] #dashboard .dash-recent-file {
    border-color: transparent;
}

#dashboard .dash-recent-open {
    display: block;
    width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    font: inherit;
    text-align: start;
    color: var(--text-primary);
    text-decoration: none;
}

#dashboard .dash-recent-open:hover {
    background: var(--bg-hover);
}

#dashboard .dash-recent-open[aria-disabled='true'] {
    cursor: default;
}

#dashboard .dash-recent-preview {
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    padding: var(--space-3);
    background: var(--bg-tertiary);
    color: var(--text-tertiary);
    font-size: var(--font-size-sm);
    min-height: 80px;
}

#dashboard .dash-recent-preview:has(img) {
    aspect-ratio: 1.25;
}

#dashboard .dash-recent-preview img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

#dashboard .dash-recent-name {
    margin: 0;
    padding: var(--space-3) var(--space-3) var(--space-1);
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-medium);
    overflow-wrap: anywhere;
}

#dashboard .dash-recent-path,
#dashboard .dash-recent-signals {
    margin: 0;
    padding: 0 var(--space-3) var(--space-3);
    color: var(--text-secondary);
    font-size: var(--font-size-xs);
    overflow-wrap: anywhere;
}

#dashboard .dash-recent-signal {
    margin: 0;
    line-height: var(--line-height-normal);
}

#dashboard .dash-recent-signal + .dash-recent-signal {
    margin-top: var(--space-1);
}

#dashboard .dash-recent-signal.is-attention {
    color: var(--color-warning-text);
}

#dashboard .dash-recent-notice {
    margin: 0 0 var(--space-3);
    font-size: var(--font-size-sm);
    color: var(--text-secondary);
}

#dashboard .dash-recent-notice[hidden] {
    display: none;
}

#dashboard[data-view='carousel'] [data-dashboard-board='tasks'] > .dash-zone-header {
    justify-content: flex-end;
}

#dashboard[data-view='carousel'] [data-dashboard-board].dash-board-entering {
    animation: dash-board-enter 200ms var(--ease-out);
}

#dashboard[data-view='carousel'][data-direction='back'] {
    --dash-board-offset: calc(-1 * var(--space-6));
}

@keyframes dash-board-enter {
    from {
        opacity: 0;
        transform: translateX(var(--dash-board-offset, var(--space-6)));
    }

    to {
        opacity: 1;
        transform: translateX(0);
    }
}

@media (width <= 767.98px) {
    #dashboard[data-view='carousel'] #dash-tools-grid > .dash-tools-section {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    #dashboard .dash-recent-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    #dashboard-navigation {
        padding: var(--space-2);
    }

    #dashboard[data-view='carousel'] [data-dashboard-board] {
        padding-inline: var(--space-3);
    }
}

@media (width <= 479.98px) {
    #dashboard[data-view='carousel'] #dash-tools-grid > .dash-tools-section {
        grid-template-columns: minmax(0, 1fr);
    }

    #dashboard .dash-recent-grid {
        grid-template-columns: minmax(0, 1fr);
    }
}

@media (prefers-reduced-motion: reduce) {
    @keyframes dash-board-enter {
        from {
            opacity: 0;
        }

        to {
            opacity: 1;
        }
    }
}

#dashboard #dash-tasks-count[hidden] {
    display: none;
}
