/* Compiled fallback for the referral decision pass.
 * The matching component source lives in resources/css/bit.css and will be
 * folded into the normal Vite bundle on the next frontend build. */
.road-button-loading {
    align-items: center;
    gap: .25rem;
}

.road-button-spinner {
    display: inline-block;
    width: .875rem;
    height: .875rem;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 9999px;
    animation: road-spin .7s linear infinite;
}

.road-form-actions-end {
    justify-content: flex-end;
}

.road-decision-screen {
    display: flex;
    min-height: 0;
    flex: 1 1 0%;
    flex-direction: column;
    gap: .5rem;
    padding-right: .25rem;
    overflow-y: auto;
}

.road-decision-person {
    flex-shrink: 0;
    border: 2px solid #000;
    background: #fff;
}

.road-decision-person-main {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    padding: .5rem .75rem;
    border-bottom: 1px solid #000;
    background: #e6e2da;
}

.road-decision-eyebrow,
.road-decision-identifiers dt,
.road-decision-summary dt {
    color: #333;
    font-size: .75rem;
    font-weight: 700;
    letter-spacing: .025em;
    text-transform: uppercase;
}

.road-decision-person-name {
    font-size: 1.25rem;
    font-weight: 900;
    line-height: 1.25rem;
}

.road-decision-identifiers {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    background: #fff;
}

.road-decision-identifiers > div {
    min-width: 0;
    padding: .25rem .5rem;
    border-bottom: 1px solid #000;
}

.road-decision-identifiers > div:last-child {
    border-bottom: 0;
}

.road-decision-identifiers dd,
.road-decision-summary dd {
    margin-top: .125rem;
    overflow-wrap: break-word;
    font-weight: 700;
}

.road-decision-referral-body {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: .5rem;
}

.road-decision-summary {
    border: 1px solid #000;
    background: #e6e2da;
}

.road-decision-summary > div {
    padding: .25rem .5rem;
    border-bottom: 1px solid #000;
}

.road-decision-summary > div:last-child {
    border-bottom: 0;
}

.road-decision-narrative {
    display: grid;
    gap: .5rem;
}

.road-decision-narrative > div,
.road-decision-recorded-rationale {
    padding: .25rem .5rem;
    border: 1px solid #000;
    background: #fff;
}

.road-decision-narrative h3 {
    margin-bottom: .25rem;
    font-weight: 700;
}

.road-decision-narrative p,
.road-decision-recorded-rationale p {
    line-height: 1.25rem;
}

.road-decision-section-heading {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: .25rem;
}

.road-decision-section-heading > span:last-child {
    font-size: .75rem;
    font-weight: 400;
}

.road-derived-value {
    display: block;
    margin-top: .125rem;
    color: #333;
    font-size: .75rem;
    font-weight: 400;
}

.road-decision-panel {
    background: #fffef2;
}

.road-decision-guidance {
    margin-top: .5rem;
    padding: .25rem .5rem;
    border: 1px solid #000;
    background: #fff3bf;
    font-size: .75rem;
}

.road-decision-footer,
.road-decision-footer-secondary,
.road-decision-footer-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .25rem;
}

.road-decision-footer {
    width: 100%;
    justify-content: space-between;
    gap: .5rem;
}

@media (min-width: 48rem) {
    .road-decision-identifiers {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }

    .road-decision-identifiers > div {
        border-right: 1px solid #000;
        border-bottom: 0;
    }

    .road-decision-identifiers > div:last-child {
        border-right: 0;
    }

    .road-decision-referral-body {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .road-decision-narrative {
        grid-column: span 2 / span 2;
    }
}

@media (max-width: 47.999rem) {
    .road-decision-footer,
    .road-decision-footer-secondary,
    .road-decision-footer-actions {
        width: 100%;
        align-items: stretch;
    }

    .road-decision-footer {
        flex-direction: column;
    }

    .road-decision-footer-secondary > *,
    .road-decision-footer-actions > * {
        flex: 1 1 0%;
    }
}