.ahr-automated-tasks-page {
    min-width: 0;
}

.ahr-automated-tasks-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px;
}

.ahr-automated-tasks-header__text {
    min-width: 0;
}

.ahr-automated-tasks-icon {
    width: 16px;
    height: 16px;
}

.ahr-automated-tasks-icon--destructive {
    color: var(--danger);
}

.ahr-automated-tasks-error {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
    padding: 10px 14px;
    border: 1px solid var(--danger);
    border-radius: 8px;
    background: var(--red-soft);
    color: var(--danger);
    font-size: 13px;
}

.ahr-automated-tasks-skeleton-row {
    padding: 12px 14px;
    border: 1px solid var(--line);
    border-radius: var(--ak-card-radius);
    background: var(--surface);
}

.ahr-automated-tasks-skeleton {
    height: 20px;
    width: 100%;
    max-width: 420px;
}

.ahr-automated-tasks-form {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.ahr-automated-tasks-form__field {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.ahr-automated-tasks-select-trigger {
    width: 100%;
}

.ahr-automated-tasks-list-head,
.ahr-automated-tasks-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 260px 20px;
    gap: 20px;
    align-items: center;
}

.ahr-automated-tasks-list-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 260px 20px;
    gap: 20px;
    padding: 8px 16px;
}

.ahr-automated-tasks-row,
.ahr-automated-tasks-choice {
    width: 100%;
    text-align: left;
    cursor: pointer;
}

.ahr-automated-tasks-row:disabled {
    cursor: default;
}

.ahr-automated-tasks-choice {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.ahr-automated-tasks-row__main {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
}

.ahr-automated-tasks-row__title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}



.ahr-automated-tasks-footnote {
    margin: 14px 0 6px;
}

.ahr-automated-tasks-error__text {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.ahr-automated-tasks-form__section {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding-top: 12px;
    border-top: 1px solid var(--line);
}

/* A folded section still lays out its hidden body as a flex item, so the gap would pad under the summary. */
.ahr-automated-tasks-form__section:not([open]) {
    gap: 0;
}

.ahr-automated-tasks-form__section-title {
    margin: 0;
    font-size: 13px;
    font-weight: var(--ak-heading-weight);
}

.ahr-automated-tasks-form__optional {
    color: var(--ink-muted);
}

@media (max-width: 640px) {
    .ahr-automated-tasks-header {
        flex-direction: column;
        /* The subtitle's own margin spaces it from the button. */
        gap: 0;
    }

    .ahr-automated-tasks-list-head {
        display: none;
    }

    .ahr-automated-tasks-row {
        grid-template-columns: minmax(0, 1fr) 20px;
        gap: 8px 12px;
    }

    .ahr-automated-tasks-row__when {
        grid-row: 2;
        grid-column: 1;
    }

    .ahr-automated-tasks-row__next {
        grid-row: 1 / 3;
        grid-column: 2;
    }
}

.ahr-automated-tasks-context {
    margin: 0 0 20px;
    padding: 12px 16px;
    border: 1px solid var(--amber-line);
    background: var(--amber-soft);
    color: var(--amber-ink);
    font-size: 13px;
    line-height: 1.5;
}

/* The phone board draws Save alone; on a phone the sheet's X is the way back out.
   Scoped past the shared #root .btn display. */
@media (max-width: 639px) {
    #akashic-health-records-patient-portal-root .btn.ahr-automated-tasks-back {
        display: none;
    }
}

.ahr-automated-tasks-step {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 16px 0;
    border-bottom: 1px solid var(--line);
}

.ahr-automated-tasks-step__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

/* The preview shows the patient's step text; only the box is inert, so the label keeps full ink. */
.ahr-automated-tasks-preview .ahr-automated-tasks-step [data-slot="checkbox-control"] [data-slot="checkbox-control-label"] {
    opacity: 1;
}