/* /Components/Pages/CreateProposal.razor.rz.scp.css */
/* CreateProposal.razor.css — now empty on purpose.
 
   Every rule that used to live in this file was left over from before the wizard-step
   split (see claude/wizard-step-split-INTEGRATION-NOTES.md and the "Stage 5 of the
   cleanup plan" comment in CreateProposal.razor.cs). CreateProposal.razor itself no
   longer renders any element that uses these classes — they moved to the child
   components that now own that markup:
 
     .form-field--invalid, .form-field__error, .form-field__required
         -> WizardStepDetails.razor.css
 
     .people-step__intro, .people-step__search, .profile-list.profile-list--scroll,
     .people-step__count
         -> WizardStepSelectPeople.razor.css
 
     .save-status, .save-status--error
         -> WizardStepGenerated.razor.css and SectionAiEditDialog.razor.css
            (deliberately duplicated between those two — see the header comment in
            SectionAiEditDialog.razor.css for why: Blazor CSS isolation doesn't cascade
            a sibling component's scoped rules)
 
     .generated-section__toolbar, .link-button (+ :hover/:disabled)
         -> WizardStepGenerated.razor.css
 
     .ai-edit-overlay, .ai-edit-modal, .ai-edit-modal h3, .ai-edit-modal__hint,
     .ai-edit-modal__actions
         -> SectionAiEditDialog.razor.css
 
   Because Blazor's CSS isolation scopes every rule to the elements the OWNING component
   renders, none of this file's old rules were ever matching anything by the time of this
   review — CreateProposal.razor's own markup only uses .page-header, .wizard-steps,
   .wizard-step*, .alert, .card.wizard-body, .wizard-actions*, .select, .btn* — dead
   weight rather than a live bug, but worth clearing out so a future edit doesn't land in
   the wrong (unused) copy. If your build tooling complains about an empty scoped CSS
   file, it's just as safe to delete CreateProposal.razor.css outright — nothing in
   CreateProposal.razor's markup depends on it.
*/
/* /Components/Pages/MarketingItemDetail.razor.rz.scp.css */
/* MarketingItemDetail.razor — scoped styles.

   FIX (2026-09-14) — same bug and same fix as claude/MarketingLibrary.razor.css and
   ProposalDetail.razor.css (see either for the full writeup): `.card` in app.css carries
   no padding of its own by design, and Blazor's CSS isolation means a padding rule
   scoped to one component (ProposalDetail.razor.css) never reaches another component
   that also happens to use `class="card"` (this page). Both cards on this page — the
   read-only content card and the Tags card — put text, chip rows, and the tag-picker
   form directly inside `.card` with nothing else supplying padding, so everything sat
   flush against the card border. This scoped file gives this page its own copy, exactly
   like ProposalDetail.razor already has.

   Also carries the same `.link-button` copy (used here for "← Back to Marketing
   Library") for the identical reason — that class only exists inside other components'
   scoped CSS files, which can't reach this one. */
.card[b-mt12l0vk96] {
    padding: 20px 24px;
}

.link-button[b-mt12l0vk96] {
    background: none;
    border: none;
    padding: 0;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--color-primary, #2563eb);
    cursor: pointer;
}

    .link-button:hover:not(:disabled)[b-mt12l0vk96] {
        text-decoration: underline;
    }

    .link-button:disabled[b-mt12l0vk96] {
        color: var(--color-text-faint);
        cursor: default;
    }
/* /Components/Pages/MarketingLibrary.razor.rz.scp.css */
/* MarketingLibrary.razor — scoped styles.

   FIX (2026-09-14) — Luis, after comparing screenshots against Proposals.razor: "the
   style is not the same that the proposal there is no space between the controls" / "i
   see the proposal.razor uses <div class="card grid-card"> seems marketinglibrary.razor
   not." Same root cause as ProposalDetail.razor's own spacing bug, fixed the same way —
   see claude/proposal-detail-spacing-INTEGRATION-NOTES.md for the original writeup:

   The shared `.card` class in app.css carries no padding of its own, by design —
   Proposals.razor pairs it with `.grid-card` (wants the table flush against the card
   edge) and the wizard pairs it with `.wizard-body` (which supplies its own padding).
   This page's per-asset cards put a chip-row header, a chip row of metadata, and an
   optional summary paragraph directly inside `.card` — the same combination
   ProposalDetail.razor's own header card uses — so without a padding rule they sat flush
   against the card border with zero breathing room. That's the actual bug behind "no
   space between the controls": it isn't that `.toolbar`/`.chip-row` are missing gaps
   (they aren't — they already have `gap` in app.css), it's that Blazor's CSS isolation
   means a *.razor.css file's rules only ever apply to the component they're named after.
   ProposalDetail.razor.css's `.card` padding rule cannot reach this page — every page
   that reuses the bare `.card` class needs its own copy if it wants padding.

   Scoped here (rather than edited in app.css) so it only reaches this component's own
   `.card` elements and can't leak into Proposals.razor's grid card or the wizard's
   card. */
.card[b-q91es23u9j] {
    padding: 20px 24px;
}

/* `.link-button` styles the "View & tag" link in each row. It's only ever defined inside
   scoped *.razor.css files elsewhere in this app (CreateProposal.razor.css,
   WizardStepGenerated.razor.css, ProposalDetail.razor.css) — for the same CSS-isolation
   reason above, none of those reach this component, so without a copy here the link
   would render as a plain unstyled browser default instead of matching the rest of the
   app. Copied verbatim from ProposalDetail.razor.css. */
.link-button[b-q91es23u9j] {
    background: none;
    border: none;
    padding: 0;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--color-primary, #2563eb);
    cursor: pointer;
}

    .link-button:hover:not(:disabled)[b-q91es23u9j] {
        text-decoration: underline;
    }

    .link-button:disabled[b-q91es23u9j] {
        color: var(--color-text-faint);
        cursor: default;
    }
/* /Components/Pages/ProposalDetail.razor.rz.scp.css */
/* ProposalDetail.razor — scoped styles.

   FIX (2026-09-06): the shared `.card` class in app.css defines no padding of its own —
   on purpose, since Proposals.razor pairs it with `.grid-card` (wants its table flush
   against the card edges) and CreateProposal.razor pairs it with `.wizard-body` (which
   supplies its own 24px padding). This page's cards were never paired with anything that
   adds padding, so the chip row, the label/value table, and each section's content sat
   flush against the card border with zero breathing room — the "no space between label
   and text and its containers" issue.

   Scoped here rather than edited in app.css: Blazor's CSS isolation stamps this rule (and
   the elements it targets) with a scope attribute unique to THIS component, so it only
   affects the two `.card` elements ProposalDetail.razor itself renders — it cannot leak
   into Proposals.razor's grid card or the wizard's card, no modifier class needed. */
.card[b-g5e4zetj34] {
    padding: 20px 24px;
}

/* `.link-button` styles the "← Back to Proposals" link and the "View N RAG chunks"
   <summary> toggle. It was only ever defined in CreateProposal.razor.css and
   WizardStepGenerated.razor.css — both scoped to those components — so it never reached
   this page and those elements rendered with plain unstyled browser defaults. Copied here
   for the same reason SectionAiEditDialog.razor.css copies it in its own header comment:
   Blazor's CSS isolation does not cascade a sibling/parent component's scoped rules into
   this component's markup. */
.link-button[b-g5e4zetj34] {
    background: none;
    border: none;
    padding: 0;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--color-primary, #2563eb);
    cursor: pointer;
}

    .link-button:hover:not(:disabled)[b-g5e4zetj34] {
        text-decoration: underline;
    }

    .link-button:disabled[b-g5e4zetj34] {
        color: var(--color-text-faint);
        cursor: default;
    }
/* /Components/SectionAiEditDialog.razor.rz.scp.css */
/* Duplicated from CreateProposal.razor's own <style> block on purpose: Blazor's CSS
   isolation does NOT cascade a parent component's scoped rules into a child component's
   markup (each component only gets its own scope attribute) — these need their own copy
   here or the error message below would render unstyled again, the same class of bug as
   the earlier "Edit with AI" CSS incident. */
.save-status[b-5bqnat3mh5] {
    margin: 0 0 16px;
    font-size: 12.5px;
    color: var(--color-text-faint);
}

.save-status--error[b-5bqnat3mh5] {
    color: #dc2626;
}

.ai-edit-overlay[b-5bqnat3mh5] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    z-index: 50;
}

.ai-edit-modal[b-5bqnat3mh5] {
    background: var(--color-surface, #fff);
    border-radius: 12px;
    padding: 24px;
    width: 100%;
    max-width: 480px;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.25);
}

.ai-edit-modal h3[b-5bqnat3mh5] {
    margin: 0 0 4px;
}

.ai-edit-modal__hint[b-5bqnat3mh5] {
    margin: 0 0 16px;
    font-size: 13px;
    color: var(--color-text-muted);
}

.ai-edit-modal__actions[b-5bqnat3mh5] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 16px;
}
/* /Components/SlideAiEditDialog.razor.rz.scp.css */
/* Duplicated from CreateProposal.razor's own <style> block on purpose: Blazor's CSS
   isolation does NOT cascade a parent component's scoped rules into a child component's
   markup (each component only gets its own scope attribute) — these need their own copy
   here or the error message below would render unstyled again, the same class of bug as
   the earlier "Edit with AI" CSS incident. */
.save-status[b-35ce4tygo4] {
    margin: 0 0 16px;
    font-size: 12.5px;
    color: var(--color-text-faint);
}

.save-status--error[b-35ce4tygo4] {
    color: #dc2626;
}

.ai-edit-overlay[b-35ce4tygo4] {
    position: fixed;
    inset: 0;
    background: rgba(15, 23, 42, 0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    z-index: 50;
}

.ai-edit-modal[b-35ce4tygo4] {
    background: var(--color-surface, #fff);
    border-radius: 12px;
    padding: 24px;
    width: 100%;
    max-width: 480px;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.25);
}

    .ai-edit-modal h3[b-35ce4tygo4] {
        margin: 0 0 4px;
    }

.ai-edit-modal__hint[b-35ce4tygo4] {
    margin: 0 0 16px;
    font-size: 13px;
    color: var(--color-text-muted);
}

.ai-edit-modal__actions[b-35ce4tygo4] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-top: 16px;
}
/* /Components/WizardStepDetails.razor.rz.scp.css */
.form-field--invalid .text-input[b-so3zgc8mvf],
.form-field--invalid .textarea-input[b-so3zgc8mvf] {
    border-color: #dc2626;
    box-shadow: 0 0 0 1px #dc2626;
}

.form-field__error[b-so3zgc8mvf] {
    display: block;
    color: #dc2626;
    font-size: 0.85rem;
    margin-top: 0.25rem;
}

.form-field__required[b-so3zgc8mvf] {
    color: #dc2626;
}
/* /Components/WizardStepGenerated.razor.rz.scp.css */
.save-status[b-qnb3z71p0x] {
    margin: 0 0 16px;
    font-size: 12.5px;
    color: var(--color-text-faint);
}

.save-status--error[b-qnb3z71p0x] {
    color: #dc2626;
}

/* "Edit with AI"/"Revert" per-section toolbar. The popup itself
   (.ai-edit-overlay/.ai-edit-modal/...) lives in
   Components/SectionAiEditDialog.razor.css — this just styles the two links shown on
   each section card. */
.generated-section__toolbar[b-qnb3z71p0x] {
    display: flex;
    justify-content: flex-end;
    gap: 12px;
    margin-bottom: 8px;
}

.link-button[b-qnb3z71p0x] {
    background: none;
    border: none;
    padding: 0;
    font-size: 12.5px;
    font-weight: 600;
    color: var(--color-primary, #2563eb);
    cursor: pointer;
}

.link-button:hover:not(:disabled)[b-qnb3z71p0x] {
    text-decoration: underline;
}

.link-button:disabled[b-qnb3z71p0x] {
    color: var(--color-text-faint);
    cursor: default;
}
/* /Components/WizardStepSelectPeople.razor.rz.scp.css */
/* Step 3 (Select People) — a dedicated, full-width picker instead of the old
   inline-per-section checklist, since the roster can now run past 20-30 people. */
.people-step__intro[b-773b0mofvv] {
    margin: 0 0 16px;
    font-size: 13.5px;
    color: var(--color-text-muted);
}

.people-step__search[b-773b0mofvv] {
    margin-bottom: 16px;
    max-width: 360px;
}

/* Chained selector (not just .profile-list--scroll) so this reliably overrides
   .profile-list's flex layout regardless of stylesheet load order. */
.profile-list.profile-list--scroll[b-773b0mofvv] {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
    gap: 4px 16px;
    max-height: 420px;
    overflow-y: auto;
    padding: 14px 16px;
}

.people-step__count[b-773b0mofvv] {
    margin: 12px 0 0;
    font-size: 12.5px;
    color: var(--color-text-faint);
}