/* ═══════════════════════════════════════════════════════════════════
   Deal Intake — page styles and the wizard's intake-only hooks
   ═══════════════════════════════════════════════════════════════════
   Kept out of app.css so nothing here can change a page that existed before Deal Intake.
   Every selector below is a class only Deal Intake markup carries. The --ald-* tokens these
   rules read are defined in app.css (light on :root, dark on :root[data-theme="dark"]); this
   file used to redeclare 15 of them with light values, from before dark mode reached main. */

/* ── Package picker cards ──
   Replaces the "Template package" dropdown. Its own class rather than a reuse of
   .ald-package-card / .ald-package-row, which assume they sit inside an .ald-card;
   Deal Intake's container is a plain MudPaper.

   The selected fill is mixed over `transparent` rather than over a named surface so it
   composites onto whatever the parent paper happens to be. */

/* The grid cell. MudTooltip's root is inline-block by default, so without this the
   card shrink-wraps to its label and every card in the row comes out a different
   width — the MudItem's own width is simply ignored. Inline="false" on the tooltip
   plus this rule keeps each card filling its cell and matching its row's height. */
.ald-intake-package-cell > .mud-tooltip-root {
    display: block;
    width: 100%;
    height: 100%;
}

.ald-intake-package-card {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    height: 100%;
    min-height: 104px;
    padding: 18px 14px;
    text-align: center;
    border: 1px solid var(--ald-border-strong);
    border-radius: 12px;
    cursor: pointer;
    transition: border-color 0.15s ease, background 0.15s ease,
                box-shadow 0.15s ease, transform 0.15s ease;
}

.ald-intake-package-card:hover {
    border-color: var(--ald-text-muted);
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

/* These cards replaced a MudSelect, which had a focus ring for free. */
.ald-intake-package-card:focus-visible {
    outline: 2px solid var(--ald-link);
    outline-offset: 2px;
}

/* A ring rather than a thicker border: box-shadow does not affect layout, so a
   selected card cannot shift its neighbours by a pixel. */
.ald-intake-package-card.selected {
    background: color-mix(in srgb, var(--ald-link) 8%, transparent);
    box-shadow: 0 0 0 2px var(--ald-accent-text);
}

/* While files stream up or a run stages. pointer-events is the affordance ONLY —
   the real guard is in SelectPackage(), because the cards are focusable and a
   keyboard user is not stopped by CSS. */
.ald-intake-package-card.locked {
    cursor: default;
    opacity: 0.55;
    pointer-events: none;
}

.ald-intake-package-card__emoji { font-size: 26px; line-height: 1; }
.ald-intake-package-card__icon { font-size: 26px !important; }
.ald-intake-package-card__check { position: absolute; top: 8px; right: 8px; }

/* Two lines then ellipsis: one long package name must not make its card taller than
   its neighbours — the ragged-height problem this grid exists to avoid. */
.ald-intake-package-card__label {
    font-size: 0.8125rem;
    font-weight: 600;
    line-height: 1.35;
    letter-spacing: 0.1px;
    color: var(--ald-text);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    overflow-wrap: anywhere;
}

:root[data-theme="dark"] .ald-intake-package-card:hover {
    border-color: var(--ald-text-muted);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.32);
}
:root[data-theme="dark"] .ald-intake-package-card.selected {
    background: color-mix(in srgb, var(--ald-link) 14%, transparent);
    box-shadow: 0 0 0 2px var(--ald-link);
}

/* ── Title Review decision buttons ──
   The choices on a title card used to be flat text buttons at the end of the header row, next to grey
   captions, so they read as labels. Status stays in the header; every clickable choice sits on its own
   row under the item text, as a bordered button. Two classes on the selector so MudBlazor's
   .mud-button-outlined rules don't win. */
.ald-title-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 8px 0 4px 32px;
    padding-top: 8px;
    border-top: 1px solid var(--ald-border);
}
.ald-title-actions__label {
    font-size: 12px;
    font-weight: 500;
    color: var(--ald-text-secondary);
    margin-left: 4px;
}
.mud-button-root.ald-choice-btn {
    text-transform: none;
    background: var(--ald-surface);
    color: var(--ald-accent-text);
    border: 1px solid var(--ald-border-strong);
    font-weight: 500;
}
.mud-button-root.ald-choice-btn:hover {
    background: var(--ald-surface-alt);
    border-color: var(--ald-accent-text);
}
.mud-button-root.ald-choice-btn:focus-visible,
.mud-button-root.ald-choice-btn--primary:focus-visible {
    outline: 2px solid var(--ald-link);
    outline-offset: 2px;
}
.mud-button-root.ald-choice-btn--primary {
    text-transform: none;
}
/* The fill is set inline on the button, so the hover needs !important to show at all. */
.mud-button-root.ald-choice-btn--primary:hover {
    background: var(--ald-accent-hover) !important;
}
.mud-button-root.ald-disclosure-btn {
    text-transform: none;
    color: var(--ald-link);
}

/* ── Wizard form column, on a loan that came from Deal Intake ──
   A flex item defaults to min-width:auto, which refuses to shrink below its content's
   min-content width and overflows the row instead. Provenance chips give every prefilled
   field's caption an unbreakable label+chip pair, so the column's min-content width grew
   past the viewport and the right edge of the form was clipped mid-word.

   NewLoan.razor adds this class only when the loan has a Deal Intake session, so the
   column of every other loan keeps the layout it has always had. */
.ald-wizard-main--intake { min-width: 0; }

/* Bounds the provenance chip so one long source filename cannot widen a caption row
   indefinitely. nowrap is kept — it is what makes the ellipsis appear. Deliberately NOT
   flex-wrap on the caption row: that would make one field's caption two lines while its
   MudGrid neighbour stays one, the ~20px row stagger that is the documented reason inline
   Label= is banned in the wizard. The tooltip still carries the full name and the source
   passage. */
.ald-provenance-chip {
    display: inline-block;
    max-width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    vertical-align: bottom;
    min-width: 0;
}