/* /Components/Settings/Integrations/IntegrationsCategorySection.razor.rz.scp.css */
/* Category band (measured 2026-09-05): uppercase 11px/500 muted title indented 16px (no Qui primitive renders
   this eyebrow, so it stays a plain heading), then a 3-column grid of 156px tiles with 16px gaps; 48px
   between bands. */
.integrations-section[b-lxmf0t3naz] {
    margin: 0 0 48px;
}

.integrations-section__header[b-lxmf0t3naz] {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
}

.integrations-section__title[b-lxmf0t3naz] {
    margin: 0 0 16px 16px;
    color: var(--shell-text-secondary);
    font-size: 0.6875rem;
    font-weight: 500;
    line-height: normal;
    text-transform: uppercase;
}

/* The bands keep 16px under their grid; the grid itself is the shared SettingsTileGrid. */
.integrations-section[b-lxmf0t3naz]  .settings-tile-grid {
    margin-bottom: 16px;
}
/* /Components/Settings/Integrations/IntegrationsSearchResultsSection.razor.rz.scp.css */
/* Search replaces every band with one flat grid; no hits shows a centred 15px muted line. */
.integrations-results[b-hbz7ukq8x6] {
    margin: 0 0 48px;
}

.integrations-results__empty[b-hbz7ukq8x6] {
    display: flex;
    justify-content: center;
    color: var(--shell-text-secondary);
    font-size: 0.9375rem;
    font-weight: 450;
    line-height: 1.4375rem;
}
/* /Components/Settings/Tiles/SettingsTile.razor.rz.scp.css */
/* Linear directory tile (measured 2026-09-05): a bordered card with 16px padding, 156px tall in the grid; a
   36px logo with 6px radius, 13px/500 name and a four-line clamped 13px/450 description. The card shell is
   Qui's Card (surface fill + hairline border); the tile is a grid cell that stretches the card to full height
   and floats the link over it. */
.settings-tile[b-c9srokjw8q] {
    position: relative;
    display: flex;
    min-width: 0;
    list-style: none;
}

.settings-tile[b-c9srokjw8q]  .ui-card {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
}

/* Enabled tile (measured 2026-09-06): 203×70, 36px logo, 13px/500 name over a muted 13px/450 "Enabled" line. */
.settings-tile--compact .settings-tile__body[b-c9srokjw8q] {
    gap: 0;
}

.settings-tile__link[b-c9srokjw8q] {
    position: absolute;
    inset: 0;
    z-index: 1;
    border-radius: 8px;
}

.settings-tile__link:focus-visible[b-c9srokjw8q] {
    outline: 2px solid var(--shell-accent);
    outline-offset: 1px;
}

.settings-tile__body[b-c9srokjw8q] {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
}

.settings-tile__identity[b-c9srokjw8q] {
    display: flex;
    align-items: stretch;
    gap: 8px;
    min-width: 0;
}

/* Linear rings the logo with a 1px hairline and a faint shadow; the flat SVG tiles carry their own edge, so
   only the shadow stays. */
.settings-tile__logo[b-c9srokjw8q] {
    flex: 0 0 auto;
    width: 36px;
    height: 36px;
    border-radius: 6px;
    box-shadow: 0 0.5px 1px 1px rgba(0, 0, 0, 0.12);
    object-fit: cover;
}

.settings-tile__titles[b-c9srokjw8q] {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
}

.settings-tile__name[b-c9srokjw8q] {
    overflow: hidden;
    color: var(--shell-text-primary);
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.settings-tile__description[b-c9srokjw8q] {
    display: -webkit-box;
    overflow: hidden;
    color: var(--shell-text-secondary);
    font-size: 0.8125rem;
    font-weight: 450;
    line-height: 1.2;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 4;
    line-clamp: 4;
}

.settings-tile__status[b-c9srokjw8q] {
    color: var(--shell-text-secondary);
    font-size: 0.8125rem;
    font-weight: 450;
    line-height: 1.2;
}

/* Compact tiles have room for one status line; a longer one, such as a runtime's full version string, ends in an
   ellipsis and keeps its full text as the status's title. */
.settings-tile--compact .settings-tile__status[b-c9srokjw8q] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* A status with detail (such as an error) carries a tooltip; it sits above the link overlay so it stays
   hoverable on linked tiles. */
.settings-tile[b-c9srokjw8q]  .settings-tile__status-tooltip {
    position: relative;
    z-index: 2;
    align-self: flex-start;
}

/* AIV-20 documented deviation from Quantify: non-compact tiles also show the status line whenever the state
   is not "not set up", so permission, deployment and error states stay visible outside the Enabled band and
   in search results. The description clamps one line shorter so the 156px row height is unchanged. */
.settings-tile__description--with-status[b-c9srokjw8q] {
    -webkit-line-clamp: 3;
    line-clamp: 3;
}
/* /Components/Settings/Tiles/SettingsTileGrid.razor.rz.scp.css */
/* Integrations directory grid (measured 2026-09-05): 3 columns of 156px tiles with 16px gaps. */
.settings-tile-grid[b-rqo4x7eo7l] {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    grid-auto-rows: 156px;
    gap: 16px;
    margin: 0;
    padding: 0;
    list-style: none;
}

/* Enabled band (measured 2026-09-06): the same 3-column grid with 70px tiles. */
.settings-tile-grid--compact[b-rqo4x7eo7l] {
    grid-auto-rows: 70px;
}

/* Quantify's directory is desktop-first. Below tablet widths its three fixed columns squeeze the tiles until
   names and status lines clip, so the grid drops to two columns and then to one. */
@media (max-width: 900px) {
    .settings-tile-grid[b-rqo4x7eo7l] {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 560px) {
    .settings-tile-grid[b-rqo4x7eo7l] {
        grid-template-columns: minmax(0, 1fr);
    }
}
/* /Pages/Integrations.razor.rz.scp.css */
/* Linear's integrations directory lives in the 640px settings column: header → 32px → search → 48px → bands.
   Section and tile styling is owned by the section components. */

/* Linear: the search field sits 12px under the header and 48px above the first band. */
.integrations-directory__search[b-otel0axvsl] {
    margin: 12px 0 48px;
}

/* AIV-20: a failed recovery read (or a family whose status could not be certified) keeps the last cards
   visible under Quantify's refresh-error copy with a Retry action. */
.integrations-directory__refresh-error[b-otel0axvsl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: -24px 0 24px;
    color: var(--shell-text-secondary);
    font-size: 0.8125rem;
    font-weight: 450;
}
