/*
 * The pill navigation carries the model menus — Organisation and Delivery — and
 * their dropdowns. The access and system menus are settings-side, so they stay out
 * of the pill bar; the theme's settings drawer lists every menu in one place. The
 * `data-lab-admin-menu` attribute on the group is what identifies them, and it is
 * topbar only, so sidebar panels keep every group they have.
 */
.fi-topbar-nav-groups [data-lab-admin-menu='access'],
.fi-topbar-nav-groups [data-lab-admin-menu='system'] {
    display: none;
}

/*
 * Dashboard rhythm for the theme's twelve-column page.
 * Cards in a row share a height, nothing in the page scrolls sideways,
 * and the metric cards keep the scheme colour the theme already paints.
 */

.fi-main:has(.spiggle-stat-card) {
    overflow-x: clip;
}

.fi-main:has(.spiggle-stat-card) .fi-page,
.fi-main:has(.spiggle-stat-card) .fi-page-content,
.fi-main:has(.spiggle-stat-card) .fi-wi,
.fi-main:has(.spiggle-stat-card) .fi-grid {
    max-width: 100%;
    min-width: 0;
}

.fi-main:has(.spiggle-stat-card) .fi-wi {
    align-items: stretch;
}

.fi-main:has(.spiggle-stat-card) .fi-wi-widget {
    min-width: 0;
    max-width: 100%;
    height: 100%;
    align-self: stretch;
    display: flex;
    flex-direction: column;
}

.fi-main:has(.spiggle-stat-card) .fi-wi-widget > .fi-section {
    flex: 1 1 auto;
    height: auto;
    min-height: 100%;
    display: flex;
    flex-direction: column;
    min-width: 0;
    overflow: hidden;
}

.fi-main:has(.spiggle-stat-card) .fi-wi-widget > .fi-section > .fi-section-content-ctn {
    flex: 1;
    min-width: 0;
    min-height: 0;
}

.fi-main:has(.spiggle-stat-card) .fi-wi-widget:has(.spiggle-stat-card) {
    display: flex;
}

.fi-main:has(.spiggle-stat-card) .spiggle-stat-card {
    width: 100%;
    height: 100%;
    min-height: 148px;
    box-sizing: border-box;
}

.fi-main:has(.spiggle-stat-card) .spiggle-stat-card > div {
    height: 100%;
    min-height: 108px;
}

.fi-main:has(.spiggle-stat-card) .fi-wi-chart .fi-section-header-heading {
    font-size: 1.125rem;
    font-weight: 700;
    letter-spacing: -0.01em;
}

.fi-main:has(.spiggle-stat-card) .fi-wi-chart-frame,
.fi-main:has(.spiggle-stat-card) .fi-wi-chart-canvas-ctn {
    flex: 1 1 auto;
    height: 340px;
    min-height: 340px;
    max-width: 100%;
}

.fi-main:has(.spiggle-stat-card) .fi-wi-widget[style*="--col-span-xl: span 12"] .fi-wi-chart-frame,
.fi-main:has(.spiggle-stat-card) .fi-wi-widget[style*="--col-span-xl: span 12"] .fi-wi-chart-canvas-ctn {
    height: 460px;
    min-height: 460px;
}

.fi-main:has(.spiggle-stat-card) canvas {
    width: 100% !important;
    height: 100% !important;
    max-width: 100%;
}

.fi-main:has(.spiggle-stat-card) .fi-ta-ctn,
.fi-main:has(.spiggle-stat-card) .fi-ta-content,
.fi-main:has(.spiggle-stat-card) .fi-ta-content-ctn {
    overflow-x: hidden;
    max-width: 100%;
}

.fi-main:has(.spiggle-stat-card) .fi-ta-table {
    width: 100%;
    min-width: 0 !important;
    table-layout: fixed;
}

.fi-main:has(.spiggle-stat-card) .fi-ta-header-cell {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Title keeps whatever status and due do not need. */
.fi-main:has(.spiggle-stat-card) .fi-wi-table:has(.fi-ta-header-cell-title) .fi-ta-header-cell-title {
    width: auto !important;
}

.fi-main:has(.spiggle-stat-card) .fi-wi-table:has(.fi-ta-header-cell-title) .fi-ta-header-cell-status {
    width: 6.25rem !important;
}

.fi-main:has(.spiggle-stat-card) .fi-wi-table:has(.fi-ta-header-cell-title) .fi-ta-header-cell-due-at {
    width: 7rem !important;
}

.fi-main:has(.spiggle-stat-card) .fi-wi-table:has(.fi-ta-header-cell-title) .fi-ta-header-cell-assignee\.full-name {
    width: 8.75rem !important;
}

.fi-main:has(.spiggle-stat-card) .fi-ta-cell {
    overflow: hidden;
    vertical-align: middle;
}

.fi-main:has(.spiggle-stat-card) .fi-ta-text:not(.fi-ta-text-has-badges) .fi-ta-text-item,
.fi-main:has(.spiggle-stat-card) .fi-ta-text-description {
    display: block;
    overflow: hidden;
    max-width: 100%;
    text-overflow: ellipsis;
    white-space: nowrap;
}
