@import 'OmniLetter.Web.Client.mtp1rrd7yw.bundle.scp.css';

/* /Components/Account/Shared/ManageLayout.razor.rz.scp.css */
.manage-shell[b-jai6fmhwp9] {
    max-width: 1000px;
    margin: 0 auto;
}
.manage-card[b-jai6fmhwp9] {
    background: #fffdf7;
    border: 1px solid #e8dfce;
    border-radius: 12px;
    box-shadow: 0 20px 40px -24px rgba(90, 60, 20, 0.45);
    overflow: hidden;
}
.manage-body[b-jai6fmhwp9] {
    padding: 1.5rem 2rem 2rem;
}
/* /Components/DocumentLinkPicker.razor.rz.scp.css */
/* DocumentLinkPicker.razor — inline packet picker hosted by MergeExpressionBuilder.
   Mirrors MergeFieldPicker's panel styling so the two inline pickers look identical. */

.document-link-picker[b-vzo9dnnlsi] {
    border: 1px solid #e3e3e3;
    border-radius: 6px;
    padding: 0.75rem;
    margin-top: 0.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    background: #fafafa;
    max-width: 100%;
}

.document-link-picker-actions[b-vzo9dnnlsi] {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}
/* /Components/Layout/AuthLayout.razor.rz.scp.css */
.auth-shell[b-mmmukr9ssh] {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
    padding: 2rem 1rem;
    background: #faf6ee;
}

.auth-brand[b-mmmukr9ssh] {
    display: flex;
    align-items: center;
}
.auth-brand a[b-mmmukr9ssh] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    text-decoration: none;
    color: #2b2118;
}
.auth-brand-logo[b-mmmukr9ssh] {
    width: 44px;
    height: 44px;
    border-radius: 9px;
    object-fit: cover;
}
.auth-brand-name[b-mmmukr9ssh] {
    font-family: "Fraunces", Georgia, serif;
    font-weight: 700;
    font-size: 27px;
    letter-spacing: -0.01em;
}

.auth-card[b-mmmukr9ssh] {
    width: 100%;
    max-width: 440px;
    background: #fffdf7;
    border: 1px solid #e8dfce;
    border-radius: 12px;
    box-shadow: 0 20px 40px -24px rgba(90, 60, 20, 0.45);
    padding: 2rem;
}

.auth-footer[b-mmmukr9ssh] {
    display: flex;
    gap: 1.25rem;
    font-size: 0.85rem;
    color: #7a6b58;
}
.auth-footer a[b-mmmukr9ssh] {
    color: #7a6b58;
    text-decoration: none;
}
.auth-footer a:hover[b-mmmukr9ssh] {
    color: #7d4a26;
}
/* /Components/Layout/BlankLayout.razor.rz.scp.css */
/* BlankLayout.razor — chrome-free shell for the public /d/{token} recipient page.
   No sidebar, no nav: just a centered, responsive content column that works on a phone. */

.document-link-layout[b-v87gh4x820] {
    min-height: 100vh;
    background: #f5f6f8;
    padding: 1.5rem 1rem 3rem;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    /* Prevent any wide child (the PDF viewer especially) from scrolling the whole page sideways. */
    overflow-x: hidden;
}

/* ::deep is required, not decorative: the child here is the routed page's root element, which
   carries that PAGE's scope hash, not this layout's. Without ::deep the CSS isolation compiler
   would emit ".document-link-layout > *[b-thislayout]" and the rule would never match anything,
   leaving the content unconstrained across the full desktop viewport. */
.document-link-layout[b-v87gh4x820]  > * {
    width: 100%;
    max-width: 1000px;
    min-width: 0;
}

@media (max-width: 600px) {
    .document-link-layout[b-v87gh4x820] {
        padding: 0.75rem 0.5rem 2rem;
    }
}
/* /Components/Layout/MainLayout.razor.rz.scp.css */
.page[b-ij333p9nua] {
    position: relative;
    display: flex;
    flex-direction: row;
    min-height: 100vh;
}

/* Hidden checkbox that drives the collapse state (CSS-only, no JS needed). */
.sidebar-toggle-input[b-ij333p9nua] {
    display: none;
}

.sidebar[b-ij333p9nua] {
    width: 260px;
    flex-shrink: 0;
    background-color: #fffdf7;
    border-right: 1px solid #e8dfce;
    transition: width 0.22s ease;
    display: flex;
    flex-direction: column;
}

/* Credit balance badge — pinned & centered at the bottom of the sidebar. */
.sidebar[b-ij333p9nua]  .credits-link {
    margin-top: auto;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0.75rem 0;
    text-decoration: none;
    border-top: 1px solid #e8dfce;
}

.sidebar[b-ij333p9nua]  .credits-link:hover .badge {
    filter: brightness(1.05);
}

main[b-ij333p9nua] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
}

article.content[b-ij333p9nua] {
    flex: 1;
    padding-top: 1.5rem;
}

/* --- Collapsed (icon-rail) state: sidebar shrinks to an icon strip --- */
.sidebar-toggle-input:not(:checked) ~ .sidebar[b-ij333p9nua] {
    width: 64px;
}

/* Hide the brand label + all nav text labels when collapsed; keep icons. */
.sidebar-toggle-input:not(:checked) ~ .sidebar[b-ij333p9nua]  .nav-brand-meta,
.sidebar-toggle-input:not(:checked) ~ .sidebar[b-ij333p9nua]  .nav-link-text,
.sidebar-toggle-input:not(:checked) ~ .sidebar[b-ij333p9nua]  .nav-section {
    display: none;
}

/* Collapsed: show just the number in the chip, no other text. */
.sidebar-toggle-input:not(:checked) ~ .sidebar[b-ij333p9nua]  .credits-label {
    display: none;
}

/* Collapsed: hide the "Needs Review" count badge so the rail stays a clean icon strip. */
.sidebar-toggle-input:not(:checked) ~ .sidebar[b-ij333p9nua]  .nav-review-badge {
    display: none;
}

.sidebar-toggle-input:not(:checked) ~ .sidebar[b-ij333p9nua]  .credits-link {
    padding: 0.5rem 0;
}

/* Center the hamburger and nav icons in the narrow rail. */
.sidebar-toggle-input:not(:checked) ~ .sidebar[b-ij333p9nua]  .nav-brand {
    justify-content: center;
    padding: 0;
}

.sidebar-toggle-input:not(:checked) ~ .sidebar[b-ij333p9nua]  .nav-link,
.sidebar-toggle-input:not(:checked) ~ .sidebar[b-ij333p9nua]  .logout-btn {
    justify-content: center;
    padding: 0;
    width: calc(100% - 0.5rem);
    margin: 0.1rem 0.25rem;
}

@media (max-width: 640.98px) {
    .page[b-ij333p9nua] {
        flex-direction: column;
    }

    .sidebar[b-ij333p9nua] {
        position: fixed;
        top: 0;
        left: 0;
        bottom: 0;
        z-index: 15;
        width: 260px;
        box-shadow: 2px 0 8px rgba(0, 0, 0, 0.15);
    }
}
/* /Components/Layout/NavMenu.razor.rz.scp.css */
/* --- Sidebar navigation (clean light theme, Syncfusion-aligned) ---------- */

.nav-brand[b-blqe6x8cna] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    height: 3.5rem;
    padding: 0 0.75rem;
    color: #2b2118;
    border-bottom: 1px solid #e8dfce;
}

/* Hamburger toggle button, inside the sidebar brand row. */
.hamburger[b-blqe6x8cna] {
    width: 2.4rem;
    height: 2.4rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 5px;
    cursor: pointer;
    border-radius: 6px;
    flex-shrink: 0;
    transition: background-color 0.12s ease;
}

    .hamburger:hover[b-blqe6x8cna] {
        background-color: #e0ecff;
    }

    .hamburger span[b-blqe6x8cna] {
        display: block;
        width: 1.3rem;
        height: 3px;
        background-color: #1f2937;
        border-radius: 3px;
        transition: transform 0.2s ease, opacity 0.2s ease;
    }

.nav-brand-meta[b-blqe6x8cna] {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    min-width: 0;
}

.nav-brand-logo[b-blqe6x8cna] { width: 1.6rem; height: 1.6rem; border-radius: 6px; object-fit: cover; }

.nav-brand-text[b-blqe6x8cna] {
    font-size: 1.05rem;
    font-weight: 700;
    font-family: "Fraunces", Georgia, serif;
    white-space: nowrap;
    color: #2b2118;
}

.nav-scrollable[b-blqe6x8cna] {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: 0.5rem 0;
}

.nav-section[b-blqe6x8cna] {
    color: #7a6b58;
    font-size: 0.7rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    padding: 0.85rem 1rem 0.35rem;
}

.nav-item[b-blqe6x8cna] {
    font-size: 0.9rem;
}

    /* NavLink anchors */
    .nav-item[b-blqe6x8cna]  .nav-link {
        color: #374151;
        border-radius: 6px;
        height: 2.5rem;
        width: calc(100% - 1rem);
        margin: 0.1rem 0.5rem;
        display: flex;
        align-items: center;
        gap: 0.7rem;
        padding: 0 0.85rem;
        text-decoration: none;
        line-height: 1;
        transition: background-color 0.12s ease, color 0.12s ease;
    }

    .nav-item[b-blqe6x8cna]  .nav-link .e-icons {
        color: #6b7280;
        font-size: 1rem;
    }

    .nav-item[b-blqe6x8cna]  a:hover {
        background-color: #f4ecdd;
        color: #7d4a26;
    }

    .nav-item[b-blqe6x8cna]  a:hover .e-icons {
        color: #9a5a2f;
    }

    .nav-item[b-blqe6x8cna]  a.active {
        background-color: #e8dfce;
        color: #7d4a26;
        font-weight: 600;
    }

    .nav-item[b-blqe6x8cna]  a.active .e-icons {
        color: #9a5a2f;
    }

    /* Logout button (native submit) styled to match nav links */
    .nav-item[b-blqe6x8cna]  .logout-btn {
        color: #374151;
        background: none;
        border: none;
        border-radius: 6px;
        height: 2.5rem;
        width: calc(100% - 1rem);
        margin: 0.1rem 0.5rem;
        display: flex;
        align-items: center;
        gap: 0.7rem;
        padding: 0 0.85rem;
        cursor: pointer;
        font-size: inherit;
        font-weight: 400;
        font-family: inherit;
        text-align: left;
        transition: background-color 0.12s ease, color 0.12s ease;
    }

    .nav-item[b-blqe6x8cna]  .logout-btn .e-icons {
        color: #6b7280;
        font-size: 1rem;
    }

    .nav-item[b-blqe6x8cna]  .logout-btn:hover {
        background-color: #fef2f2;
        color: #b91c1c;
    }

    .nav-item[b-blqe6x8cna]  .logout-btn:hover .e-icons {
        color: #dc2626;
    }

.logout-form[b-blqe6x8cna] {
    width: 100%;
}

/* Count badge on the "Needs Review" nav item — pushed to the far right of the link. */
.nav-item[b-blqe6x8cna]  .nav-review-badge {
    margin-left: auto;
    min-width: 1.4rem;
    height: 1.3rem;
    line-height: 1.3rem;
    padding: 0 0.45rem;
    font-size: 0.72rem;
    font-weight: 600;
    text-align: center;
    border-radius: 999px;
}
/* /Components/MergeExpressionBuilder.razor.rz.scp.css */
.merge-expression-builder[b-ftjn8astz3] {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.mode-toggle[b-ftjn8astz3] {
    display: flex;
    gap: 0.5rem;
}

.parse-error[b-ftjn8astz3] {
    color: #a94442;
    background: #fdf2f2;
    border: 1px solid #e6b3b3;
    border-radius: 4px;
    padding: 0.5rem 0.75rem;
    font-size: 0.9rem;
}

.segment-list[b-ftjn8astz3] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.segment-row[b-ftjn8astz3] {
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.literal-input[b-ftjn8astz3] {
    flex: 1;
}

.token-chip[b-ftjn8astz3] {
    flex: 1;
    background: #e5f0ff;
    border-radius: 4px;
    padding: 0.3rem 0.6rem;
    font-family: monospace;
}

.segment-actions[b-ftjn8astz3] {
    display: flex;
    gap: 0.5rem;
}

.raw-textbox[b-ftjn8astz3] {
    width: 100%;
    font-family: monospace;
    padding: 0.5rem;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.preview-row[b-ftjn8astz3] {
    border-top: 1px solid #e3e3e3;
    padding-top: 0.5rem;
}

.preview-error[b-ftjn8astz3] {
    color: #a94442;
}
/* /Components/MergeFieldPicker.razor.rz.scp.css */
.merge-field-picker[b-psc5v3krek] {
    border: 1px solid #e3e3e3;
    border-radius: 6px;
    padding: 0.75rem;
    margin-top: 0.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    background: #fafafa;
}

.field-list[b-psc5v3krek] {
    list-style: none;
    margin: 0;
    padding: 0;
    max-height: 180px;
    overflow-y: auto;
    border: 1px solid #e3e3e3;
    border-radius: 4px;
}

.field-item[b-psc5v3krek] {
    padding: 0.4rem 0.6rem;
    cursor: pointer;
}

.field-item:hover[b-psc5v3krek] {
    background: #f0f0f0;
}

.field-item.selected[b-psc5v3krek] {
    background: #e5f0ff;
}

.field-group[b-psc5v3krek] {
    display: inline-block;
    min-width: 90px;
    font-size: 0.75rem;
    color: #888;
    text-transform: uppercase;
}

.field-options[b-psc5v3krek] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.field-picker-actions[b-psc5v3krek] {
    display: flex;
    gap: 0.5rem;
}
/* /Components/Pages/DocumentLink.razor.rz.scp.css */
/* DocumentLink.razor — the public, unauthenticated /d/{token} recipient page.
   This is the only page in the app a recipient sees, and it is opened from an email or SMS,
   so phone-sized viewports are the common case rather than the exception. */

.document-link-page[b-duk7rgx2d2] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    width: 100%;
    min-width: 0;
}

/* --- Terminal states (not found / expired) --- */

.document-link-message[b-duk7rgx2d2] {
    background: #fff;
    border: 1px solid #e3e3e3;
    border-radius: 8px;
    padding: 2.5rem 1.5rem;
    text-align: center;
    color: #444;
}

.document-link-message h3[b-duk7rgx2d2] {
    margin: 0 0 0.5rem;
    font-size: 1.25rem;
    font-weight: 600;
}

.document-link-message p[b-duk7rgx2d2] {
    margin: 0;
}

/* --- Viewer / signing state --- */

.document-link-viewer[b-duk7rgx2d2] {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    background: #fff;
    border: 1px solid #e3e3e3;
    border-radius: 8px;
    padding: 1.25rem;
    min-width: 0;
}

.document-link-viewer h3[b-duk7rgx2d2] {
    margin: 0;
    font-size: 1.25rem;
    font-weight: 600;
}

/* The PDF viewer sets its own height (70vh/80vh) as a component parameter, which already scales
   with the viewport. These rules only stop it from forcing the page wider than the screen. */
.document-link-viewer[b-duk7rgx2d2]  .e-pdfviewer {
    max-width: 100%;
}

.document-link-viewer[b-duk7rgx2d2]  canvas {
    max-width: 100%;
}

/* --- Signature capture --- */

.signature-panel[b-duk7rgx2d2] {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.75rem;
    border: 1px solid #e3e3e3;
    border-radius: 8px;
    padding: 1rem;
    background: #fafafa;
    width: 100%;
    min-width: 0;
}

.signature-panel h4[b-duk7rgx2d2] {
    margin: 0;
    font-size: 1rem;
    font-weight: 600;
}

/* The pad is drawn on with a finger on touch devices: without touch-action:none the first drag
   gesture scrolls the page instead of leaving a stroke. */
.signature-panel[b-duk7rgx2d2]  canvas {
    touch-action: none;
    max-width: 100%;
    background: #fff;
    border-radius: 4px;
}

/* Comfortable tap targets for this page's own two buttons on touch devices: Submit (a direct
   child of the viewer panel) and Clear (a direct child of the signature panel). The direct-child
   combinator matters — SfPdfViewer2 renders its own toolbar inside .document-link-viewer and its
   buttons carry .e-btn too, so a descendant selector would restyle the PDF viewer's zoom and
   page-navigation controls as well. */
.document-link-viewer[b-duk7rgx2d2]  > .e-btn,
.signature-panel[b-duk7rgx2d2]  > .e-btn {
    min-height: 44px;
}

/* --- Submit error --- */

.document-link-error[b-duk7rgx2d2] {
    color: #d32f2f;
    background: #fdecec;
    border: 1px solid #f5c2c2;
    border-radius: 6px;
    padding: 0.75rem 1rem;
    font-size: 0.9rem;
    word-break: break-word;
}

/* --- Narrow viewports (phones) --- */

@media (max-width: 600px) {
    .document-link-viewer[b-duk7rgx2d2],
    .document-link-message[b-duk7rgx2d2] {
        border-radius: 6px;
        padding: 0.875rem;
    }

    .document-link-viewer h3[b-duk7rgx2d2],
    .document-link-message h3[b-duk7rgx2d2] {
        font-size: 1.1rem;
    }

    .signature-panel[b-duk7rgx2d2] {
        padding: 0.75rem;
    }

    /* Full-width Submit/Clear buttons — easier to hit, and they can never push the page
       into horizontal scrolling. Direct children only, so the PDF viewer's own toolbar buttons
       are left alone rather than being stretched and stacked. */
    .document-link-viewer[b-duk7rgx2d2]  > .e-btn,
    .signature-panel[b-duk7rgx2d2]  > .e-btn {
        width: 100%;
    }
}
/* /Components/Pages/DocumentReview.razor.rz.scp.css */
/* DocumentReview — layout for the incoming-document classification review page. */

.document-review-page[b-nbpw8qor8j] {
    display: flex;
    align-items: flex-start;
    gap: 1.5rem;
    padding: 1rem 1.5rem 3rem;
    max-width: 1400px;
    margin: 0 auto;
}

/* --- Item list sidebar --- */
.review-list[b-nbpw8qor8j] {
    flex: 0 0 320px;
    background: #fff;
    border: 1px solid #e3e3e3;
    border-radius: 8px;
    padding: 1.25rem;
}

.review-list h2[b-nbpw8qor8j] {
    margin: 0 0 1rem;
    font-size: 1.05rem;
    font-weight: 600;
}

.review-list .empty[b-nbpw8qor8j] {
    color: #888;
}

.review-list ul[b-nbpw8qor8j] {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0.4rem;
}

.review-item[b-nbpw8qor8j] {
    padding: 0.75rem;
    border-radius: 6px;
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    border: 1px solid transparent;
}

.review-item:hover[b-nbpw8qor8j] {
    background: #f5f6f8;
}

.review-item.active[b-nbpw8qor8j] {
    background: #eef4ff;
    border-color: #c5d7f5;
}

.review-item .file-name[b-nbpw8qor8j] {
    font-weight: 600;
}

.review-item .reason[b-nbpw8qor8j] {
    font-size: 0.85rem;
    color: #666;
}

.review-item.priority-high .file-name[b-nbpw8qor8j]::after {
    content: "\26A0\FE0F";
    margin-left: 0.35rem;
    color: #d63a1e;
    font-size: 0.85em;
}

/* --- Detail column --- */
.review-detail[b-nbpw8qor8j] {
    flex: 1;
    min-width: 0;
}

.review-detail > .empty[b-nbpw8qor8j] {
    padding: 4rem 2rem;
    text-align: center;
    color: #888;
}

.recipient-picker-panel[b-nbpw8qor8j] {
    background: #fff;
    border: 1px solid #e3e3e3;
    border-radius: 8px;
    padding: 1.25rem;
}

.recipient-picker-panel h3[b-nbpw8qor8j] {
    margin: 0 0 1rem;
    font-size: 1.05rem;
    font-weight: 600;
}

.resolved-recipient[b-nbpw8qor8j] {
    padding: 0.75rem 1.25rem;
    margin: 0;
    background: #f2f8f2;
    border: 1px solid #d0e7d0;
    border-radius: 8px;
    color: #2e6b2e;
}

.promote-toolbar[b-nbpw8qor8j] {
    margin-top: 1rem;
    display: flex;
    justify-content: flex-end;
}

/* Wrap the tour button + the if/else branches so the float is relative to the page. */
.document-review-wrap[b-nbpw8qor8j] {
    position: relative;
}

.document-review-wrap .page-help-button[b-nbpw8qor8j] {
    position: absolute;
    top: 0.5rem;
    right: 1.5rem;
    z-index: 5;
}
/* /Components/Pages/DocumentView.razor.rz.scp.css */
/* DocumentView.razor — layout for the document preview + classification page.
   The inner classification/preview/questionnaire panel styling now lives with the shared
   DocumentClassificationPanel component (DocumentClassificationPanel.razor.css), which
   renders from both this page and the review page. */

.document-view[b-o3i2rakgzk] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    padding: 1rem 1.5rem 3rem;
    max-width: 1200px;
    margin: 0 auto;
}

.detail-empty[b-o3i2rakgzk] {
    padding: 4rem 2rem;
    text-align: center;
    color: #444;
}

.detail-header[b-o3i2rakgzk] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.detail-title[b-o3i2rakgzk] {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 600;
}

.preview-toolbar[b-o3i2rakgzk] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}
/* /Components/Pages/TemplateDetail.razor.rz.scp.css */
/* TemplateDetail.razor — layout for the focused template editor. */

.template-detail[b-h49c0h7q6j] {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
    padding: 1rem 1.5rem 3rem;
    max-width: 1200px;
    margin: 0 auto;
}

.detail-empty[b-h49c0h7q6j] {
    padding: 4rem 2rem;
    text-align: center;
    color: #444;
}

.detail-header[b-h49c0h7q6j] {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.detail-title[b-h49c0h7q6j] {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 600;
}

.panel[b-h49c0h7q6j] {
    background: #fff;
    border: 1px solid #e3e3e3;
    border-radius: 8px;
    padding: 1.25rem;
}

.panel > h3[b-h49c0h7q6j] {
    margin: 0 0 1rem;
    font-size: 1.05rem;
    font-weight: 600;
}

/* Classification QR: collapsible header row (title + help icon + collapse toggle). */
.qr-header[b-h49c0h7q6j] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    margin-bottom: 1rem;
}

.qr-header h3[b-h49c0h7q6j] {
    margin: 0;
}

/* Classification QR help text shown inside the expanded body. */
.qr-help[b-h49c0h7q6j] {
    font-size: 0.875rem;
    line-height: 1.5;
    color: #605e5c;
}

/* --- Name --- */
.name-row[b-h49c0h7q6j] {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
}

.name-input[b-h49c0h7q6j] {
    flex: 1;
}

/* The Syncfusion textbox wrapper must fill the (flex-grown) .name-input container so
   the Name field stretches to the full available container width. */
[b-h49c0h7q6j] .name-input .e-input-group,
[b-h49c0h7q6j] .name-input .e-input-group.e-control-wrapper {
    width: 100%;
}

/* --- PDF panel + fullscreen --- */
.pdf-panel[b-h49c0h7q6j] {
    transition: none;
}

.panel-toolbar[b-h49c0h7q6j] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.panel-toolbar h3[b-h49c0h7q6j] {
    margin: 0;
}

.panel-toolbar .spacer[b-h49c0h7q6j] {
    flex: 1;
}

/* No ::deep needed — .upload-link is plain HTML in this component's own markup. */
.toolbar-disabled[b-h49c0h7q6j] {
    opacity: 0.4;
    pointer-events: none;
}

/* The Replace-PDF label wraps a hidden <InputFile> so clicking it opens the file picker.
   Button styling comes from the global Syncfusion e-btn classes on the label itself. */
.upload-link[b-h49c0h7q6j] {
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    user-select: none;
}

.viewer-host[b-h49c0h7q6j] {
    height: 560px;
    border: 1px solid #e3e3e3;
    border-radius: 6px;
    overflow: hidden;
}

.viewer-empty[b-h49c0h7q6j] {
    height: 560px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #888;
    border: 1px dashed #d0d0d0;
    border-radius: 6px;
}

/* Fullscreen editor overlay: lifts the panel above everything. */
.pdf-fullscreen[b-h49c0h7q6j] {
    position: fixed;
    inset: 0;
    z-index: 9999;
    border-radius: 0;
    border: none;
    margin: 0;
    padding: 0.75rem 1rem;
    display: flex;
    flex-direction: column;
    background: #fff;
}

.pdf-fullscreen .viewer-host[b-h49c0h7q6j] {
    flex: 1;
    height: auto;
    min-height: 0;
}

/* --- PlainText/Html body editor + composed preview --- */
.insert-field-row[b-h49c0h7q6j] {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}

.insert-field-row .e-dropdownlist[b-h49c0h7q6j] {
    min-width: 260px;
}

.composed-preview-text[b-h49c0h7q6j],
.composed-preview-html[b-h49c0h7q6j] {
    display: block;
    width: 100%;
    max-height: 500px;
    overflow-y: auto;
    margin-top: 1rem;
    border: 1px solid #e3e3e3;
    border-radius: 6px;
    box-sizing: border-box;
}

.composed-preview-text[b-h49c0h7q6j] {
    padding: 1rem;
    white-space: pre-wrap;
    word-break: break-word;
    background: #fafafa;
}

.composed-preview-html[b-h49c0h7q6j] {
    height: 500px;
    padding: 0;
}

.comb-badge[b-h49c0h7q6j] {
    display: inline-block;
    padding: 0.15rem 0.5rem;
    border-radius: 999px;
    background: #eef2ff;
    color: #3730a3;
    font-size: 0.8rem;
    font-weight: 600;
}
/* Comb toggle + box-count row inside the field dialogs. */
.comb-row[b-h49c0h7q6j] {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin: 1rem 0;
}

.comb-row .comb-label[b-h49c0h7q6j] {
    font-weight: 600;
    margin: 0;
}

/* --- Rich-text editor placeholder token chips ---------------------------------
   {{...}} tokens are rendered as non-editable chips (Syncfusion's .e-mention-chip
   shape, contenteditable="false") with an .ol-token--{kind} category class that
   drives the color. ::deep is required because the chips live inside the
   SfRichTextEditor child component's contenteditable DOM. */

[b-h49c0h7q6j] .e-mention-chip,
[b-h49c0h7q6j] .ol-token {
    border-radius: 4px;
    padding: 0.05em 0.3em;
    margin: 0 0.1em;
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
    font-size: 0.92em;
    border: 1px solid transparent;
}

/* Merge field {{FirstName}} — the default chip color; toolbar-inserted merge fields
   carry only .e-mention-chip (no category class), so this is also their color. */
[b-h49c0h7q6j] .e-mention-chip,
[b-h49c0h7q6j] .ol-token--field {
    background: #eff6ff;
    color: #2563eb;
    border-color: #c7dbff;
}

/* Dotted path {{Account.Balance}} / loop row field {{Car.Year}} */
[b-h49c0h7q6j] .ol-token--path {
    background: #f0fdfa;
    color: #0d9488;
    border-color: #b9ebe4;
}

/* Reserved content slot {{content}} */
[b-h49c0h7q6j] .ol-token--slot {
    background: #fffbeb;
    color: #d97706;
    border-color: #f6df9e;
}

/* Document link {{link:7}} */
[b-h49c0h7q6j] .ol-token--link {
    background: #f0fdf4;
    color: #16a34a;
    border-color: #bce8c6;
}

/* Questionnaire link {{questionnaire:3}} */
[b-h49c0h7q6j] .ol-token--questionnaire {
    background: #faf5ff;
    color: #9333ea;
    border-color: #e0cbfa;
}

/* Condition tags {{if …}} / {{else if …}} / {{else}} / {{/if}} */
[b-h49c0h7q6j] .ol-token--if {
    background: #fff1f2;
    color: #e11d48;
    border-color: #fcc7d3;
}

/* Loop tags {{foreach … as …}} / {{/foreach}} */
[b-h49c0h7q6j] .ol-token--loop {
    background: #eef2ff;
    color: #4f46e5;
    border-color: #c9d4ff;
}

/* Unrecognized or empty {{…}} — dashed so a typo or invalid tag stands out */
[b-h49c0h7q6j] .ol-token--empty,
[b-h49c0h7q6j] .ol-token--unknown {
    background: #f8fafc;
    color: #64748b;
    border-color: #cbd5e1;
    border-style: dashed;
}