/* Pipeline Builder visual rhythm overrides. Loaded after scoped component styles. */
.builder-page .builder-section {
    grid-template-columns: 48px minmax(0, 1fr);
    column-gap: 18px;
    padding: 24px 26px;
}

.builder-page .builder-section-number {
    width: 42px;
    height: 42px;
    border-radius: 12px;
    align-self: start;
}

.builder-page .builder-section-heading {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 18px;
    min-height: 58px;
    margin: 0 0 20px;
}

.builder-page .builder-section-heading > div:first-child {
    min-width: 0;
}

.builder-page .builder-section-heading h2 {
    margin: 0 0 5px;
    line-height: 1.25;
}

.builder-page .builder-section-heading p {
    min-height: 32px;
    margin: 0;
    line-height: 1.45;
}

.builder-page .section-status {
    align-self: start;
    margin-top: 1px;
}

.builder-page .builder-grid {
    align-items: start;
    row-gap: 18px;
    column-gap: 18px;
}

.builder-page .builder-field {
    align-content: start;
    gap: 7px;
}

.builder-page .builder-field > label {
    min-height: 20px;
    margin: 0;
    display: flex;
    align-items: flex-end;
}

.builder-page .builder-field > input,
.builder-page .builder-field > select,
.builder-page .builder-field > .field-with-action {
    min-height: 48px;
}

.builder-page .field-with-action > select,
.builder-page .field-with-action > input,
.builder-page .field-with-action > button {
    min-height: 48px;
}

.builder-page .builder-field > small {
    display: block;
    min-height: 29px;
    margin: 0;
}

.builder-page .builder-summary-card {
    min-height: 126px;
    align-self: start;
    align-content: center;
    margin: 0;
    padding: 18px;
}

/* Summary cards occupying the right side of a two-column row align with the field block, not its helper text. */
.builder-page .builder-grid.two > .builder-summary-card {
    height: 100%;
    min-height: 126px;
}

.builder-page .source-actions,
.builder-page .project-toolbar {
    margin-top: 4px;
}

.builder-page .review-checkbox {
    margin-top: 0;
    min-height: 72px;
    align-items: center;
}

/* Make the selected application unmistakable. */
.builder-page .project-card {
    position: relative;
    transition: border-color .15s ease, background .15s ease, box-shadow .15s ease, transform .15s ease;
}

.builder-page .project-card.selected {
    border-color: #155eef;
    background: #eef4ff;
    box-shadow: 0 0 0 2px rgba(21, 94, 239, .12), 0 8px 20px rgba(21, 94, 239, .08);
}

.builder-page .project-card.selected::after {
    content: "✓";
    position: absolute;
    top: 10px;
    right: 10px;
    width: 22px;
    height: 22px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    background: #155eef;
    color: #fff;
    font-size: 12px;
    font-weight: 900;
}

.builder-page .project-card.selected .project-kind {
    background: #dbe8ff;
    color: #1849a9;
}

@media (max-width: 780px) {
    .builder-page .builder-section {
        grid-template-columns: 1fr;
        padding: 20px;
    }

    .builder-page .builder-section-heading {
        grid-template-columns: 1fr;
        min-height: 0;
        gap: 10px;
    }

    .builder-page .builder-section-heading p,
    .builder-page .builder-field > small {
        min-height: 0;
    }

    .builder-page .builder-summary-card,
    .builder-page .builder-grid.two > .builder-summary-card {
        min-height: 100px;
        height: auto;
    }
}
