/* Zypexa Exit-Beta UI Stage 5 Pass 1 — comprehensive visual and responsive QA. */

body[data-zxp-exit-beta-qa="stage5-pass1"] {
    --zxp-qa-inline-gap: clamp(10px, 1.15vw, 18px);
    --zxp-qa-dialog-gutter: clamp(12px, 2vw, 24px);
    -webkit-text-size-adjust: 100%;
    text-size-adjust: 100%;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] :where(
    .app-shell,
    .main-shell,
    .content-wrap,
    .zxp-page-shell,
    main,
    section,
    article,
    form,
    fieldset,
    details,
    .card,
    .container,
    .saas-card,
    .profile-card,
    .dashboard-card,
    .table-card,
    .zxp-card,
    .zxp-data-table-card
) {
    min-inline-size: 0;
    max-inline-size: 100%;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] :where(
    .grid-2,
    .grid-3,
    .grid-4,
    .stats,
    .zxp-page-header,
    .page-header-row,
    .section-header-row,
    .section-heading-row,
    .zxp-card-header,
    .row-actions,
    .button-row,
    .form-actions,
    .table-actions,
    .zxp-page-actions,
    .zxp-card-actions
) > * {
    min-inline-size: 0;
    max-inline-size: 100%;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] :where(
    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    p,
    label,
    legend,
    summary,
    .muted,
    .muted-text,
    .small-text,
    .small-note,
    .flash,
    .alert,
    .zxp-page-title,
    .zxp-page-subtitle,
    .zxp-card-title,
    .zxp-card-subtitle
) {
    overflow-wrap: anywhere;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] fieldset {
    min-width: 0;
    margin-inline: 0;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] legend {
    max-width: 100%;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] :where(input, select, textarea) {
    min-inline-size: 0;
    max-inline-size: 100%;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] :where(img, video, canvas, iframe) {
    max-inline-size: 100%;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] :where(pre, code) {
    max-inline-size: 100%;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] pre {
    overflow: auto;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    word-break: break-word;
    overscroll-behavior: contain;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] code {
    overflow-wrap: anywhere;
    word-break: break-word;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] :where(
    .table-wrap,
    .table-responsive,
    .compact-table-wrap,
    .zxp-table-wrap,
    .zxp-data-table-card,
    .report-table-wrap,
    .dispo-table-wrap
) {
    min-inline-size: 0;
    max-inline-size: 100%;
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] :where(
    .zxp-page-actions,
    .zxp-card-actions,
    .row-actions,
    .button-row,
    .form-actions,
    .table-actions,
    .crm-list-actions,
    .crm-filter-actions,
    .account-list-actions,
    .notifications-header__actions,
    .notification-card__actions,
    .routing-dialog-actions
) {
    min-inline-size: 0;
    max-inline-size: 100%;
    flex-wrap: wrap;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] :where(
    .zxp-page-actions,
    .zxp-card-actions,
    .row-actions,
    .button-row,
    .form-actions,
    .table-actions,
    .routing-dialog-actions
) :where(.button, button) {
    min-inline-size: 0;
    max-inline-size: 100%;
    white-space: normal;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] :where(
    a,
    button,
    input,
    select,
    textarea,
    summary,
    [tabindex]
):focus-visible {
    outline: 3px solid rgba(37, 99, 235, 0.28);
    outline-offset: 2px;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] dialog {
    max-inline-size: calc(100vw - (var(--zxp-qa-dialog-gutter) * 2));
    max-block-size: calc(100dvh - (var(--zxp-qa-dialog-gutter) * 2));
    box-sizing: border-box;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] dialog[open] {
    overscroll-behavior: contain;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] :where(
    .report-column-dialog,
    .report-view-dialog,
    .automation-publish-dialog-card,
    .automation-create-dialog__panel,
    .analysis-settings-dialog
) {
    max-inline-size: calc(100vw - (var(--zxp-qa-dialog-gutter) * 2));
    max-block-size: calc(100dvh - (var(--zxp-qa-dialog-gutter) * 2));
}

/* Diagnostic and operator surfaces must never force the shell wider than the viewport. */
body[data-zxp-exit-beta-qa="stage5-pass1"] .zxp-diagnostic-json,
body[data-zxp-exit-beta-qa="stage5-pass1"] .ptv2-transcript-pre,
body[data-zxp-exit-beta-qa="stage5-pass1"] .contact-automation-test-result,
body[data-zxp-exit-beta-qa="stage5-pass1"] .contact-automation-email-preview-plain,
body[data-zxp-exit-beta-qa="stage5-pass1"] .contact-automation-json-output {
    inline-size: 100%;
    max-inline-size: 100%;
    overflow: auto;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    word-break: break-word;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] .zxp-diagnostic-json {
    max-block-size: min(420px, 50vh);
    margin: 8px 0 0;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] .ptv2-transcript-pre {
    margin: 0;
}

/* Contact Automation legacy/full editor: remove fixed inline geometry from condition editing. */
body[data-zxp-exit-beta-qa="stage5-pass1"] .contact-automation-multi-select {
    inline-size: 100%;
    min-inline-size: 0;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] .contact-automation-test-actions {
    align-items: end;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] .contact-automation-test-result {
    max-block-size: min(460px, 52vh);
    padding: 12px;
    border-radius: 8px;
    background: #f6f7f9;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] .contact-automation-email-preview-warnings {
    margin-top: 8px;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] .contact-automation-email-preview-output {
    margin-top: 12px;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] .contact-automation-email-preview-frame {
    inline-size: 100%;
    min-block-size: min(420px, 56vh);
    border: 1px solid #dfe3e8;
    border-radius: 8px;
    background: #fff;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] .contact-automation-email-preview-heading {
    margin-top: 14px;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] .contact-automation-email-preview-plain {
    max-block-size: min(280px, 38vh);
    padding: 12px;
    border-radius: 8px;
    background: #f6f7f9;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] .contact-automation-json-output {
    max-block-size: min(360px, 44vh);
}

body[data-zxp-exit-beta-qa="stage5-pass1"] .condition-leaf-editor-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 190px), 1fr));
    gap: 8px;
    align-items: center;
    min-inline-size: 0;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] .condition-leaf-editor-grid > *,
body[data-zxp-exit-beta-qa="stage5-pass1"] .condition-value-wrap {
    min-inline-size: 0;
    max-inline-size: 100%;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] .condition-leaf-editor-grid .remove-condition {
    min-block-size: var(--control-height, 40px);
}

body[data-zxp-exit-beta-qa="stage5-pass1"] .condition-value-range {
    display: flex;
    gap: 8px;
    min-inline-size: 0;
    flex-wrap: wrap;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] .condition-value-range > * {
    flex: 1 1 160px;
    min-inline-size: 0;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] .condition-group-mode {
    display: flex;
    align-items: center;
    gap: 8px;
    min-inline-size: 0;
    flex-wrap: wrap;
}

body[data-zxp-exit-beta-qa="stage5-pass1"] .condition-group-mode select {
    flex: 1 1 190px;
    min-inline-size: 0;
}

@media (min-width: 981px) {
    @container zxp-main-shell (max-width: 1120px) {
        body[data-zxp-exit-beta-qa="stage5-pass1"] :where(.grid-4, .grid-3) {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }

        body[data-zxp-exit-beta-qa="stage5-pass1"] :where(.section-header-row, .section-heading-row) {
            align-items: stretch;
            flex-direction: column;
        }

        body[data-zxp-exit-beta-qa="stage5-pass1"] :where(.section-header-row, .section-heading-row) > :where(.row-actions, .button-row, .form-actions) {
            width: 100%;
            justify-content: flex-start;
        }
    }

    @container zxp-main-shell (max-width: 820px) {
        body[data-zxp-exit-beta-qa="stage5-pass1"] :where(.grid-4, .grid-3, .grid-2) {
            grid-template-columns: minmax(0, 1fr);
        }
    }
}

@media (max-width: 980px) {
    body[data-zxp-exit-beta-qa="stage5-pass1"] :where(.grid-4, .grid-3) {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body[data-zxp-exit-beta-qa="stage5-pass1"] dialog {
        max-inline-size: calc(100vw - 24px);
        max-block-size: calc(100dvh - 24px);
    }
}

@media (max-width: 760px) {
    body[data-zxp-exit-beta-qa="stage5-pass1"] :where(.grid-4, .grid-3, .grid-2) {
        grid-template-columns: minmax(0, 1fr);
    }

    body[data-zxp-exit-beta-qa="stage5-pass1"] :where(.section-header-row, .section-heading-row) {
        align-items: stretch;
        flex-direction: column;
    }

    body[data-zxp-exit-beta-qa="stage5-pass1"] :where(
        input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="hidden"]),
        select,
        textarea,
        button,
        .button
    ) {
        min-block-size: 44px;
    }
}

@media (max-width: 620px) {
    body[data-zxp-exit-beta-qa="stage5-pass1"] :where(
        .zxp-page-actions,
        .zxp-card-actions,
        .row-actions,
        .button-row,
        .form-actions,
        .table-actions,
        .routing-dialog-actions
    ) > :where(.button, button, a.button, form) {
        flex: 1 1 100%;
        width: 100%;
        max-width: 100%;
    }

    body[data-zxp-exit-beta-qa="stage5-pass1"] :where(
        .zxp-page-actions,
        .zxp-card-actions,
        .row-actions,
        .button-row,
        .form-actions,
        .table-actions,
        .routing-dialog-actions
    ) > form :where(.button, button) {
        width: 100%;
    }

    body[data-zxp-exit-beta-qa="stage5-pass1"] .condition-leaf-editor-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    body[data-zxp-exit-beta-qa="stage5-pass1"] .condition-value-range > * {
        flex-basis: 100%;
    }
}

@media (max-height: 760px) {
    body[data-zxp-exit-beta-qa="stage5-pass1"] dialog[open] {
        max-block-size: calc(100dvh - 20px);
        overflow-y: auto;
    }
}

@media (prefers-reduced-motion: reduce) {
    body[data-zxp-exit-beta-qa="stage5-pass1"] *,
    body[data-zxp-exit-beta-qa="stage5-pass1"] *::before,
    body[data-zxp-exit-beta-qa="stage5-pass1"] *::after {
        scroll-behavior: auto !important;
    }
}

/* Zypexa Exit-Beta UI Stage 5 Pass 2 — externalized legacy template presentation. */

/* Externalized from templates/import_contacts.html without behavioral changes. */
    .contact-import-layout {
        display: grid;
        gap: 16px;
    }
    .contact-import-step {
        position: relative;
    }
    .contact-import-step-number {
        display: inline-flex;
        width: 30px;
        height: 30px;
        align-items: center;
        justify-content: center;
        margin-right: 8px;
        border-radius: 999px;
        background: var(--primary);
        color: #fff;
        font-weight: 800;
    }
    .contact-import-file-row,
    .contact-import-options-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14px;
        align-items: end;
    }
    .contact-import-map-table select {
        min-width: 190px;
    }
    .contact-import-map-table .contact-import-update-policy-select {
        min-width: 215px;
    }
    .contact-import-examples {
        display: grid;
        gap: 3px;
        max-width: 460px;
    }
    .contact-import-example {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        color: var(--muted);
        font-size: .84rem;
    }
    .contact-import-summary {
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 10px;
        margin: 14px 0;
    }
    .contact-import-summary-card {
        padding: 12px;
        border: 1px solid var(--border);
        border-radius: 12px;
        background: #fff;
    }
    .contact-import-summary-card strong {
        display: block;
        margin-top: 3px;
        font-size: 1.35rem;
    }
    .contact-import-status {
        padding: 12px 14px;
        border: 1px solid var(--border);
        border-radius: 12px;
        background: #f8fafc;
    }
    .contact-import-status.is-error {
        border-color: #fecaca;
        background: #fef2f2;
        color: #991b1b;
    }
    .contact-import-status.is-success {
        border-color: #bbf7d0;
        background: #f0fdf4;
        color: #166534;
    }
    .contact-import-hidden {
        display: none !important;
    }
    .contact-import-tag-select {
        min-height: 130px;
    }
    .contact-import-preview-note {
        margin-top: 8px;
    }
    .contact-import-result-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        margin-top: 16px;
    }
    .contact-import-job-progress-wrap {
        display: grid;
        gap: 12px;
        margin: 14px 0;
    }
    .contact-import-job-progress-track {
        overflow: hidden;
        height: 14px;
        border-radius: 999px;
        background: #e2e8f0;
    }
    .contact-import-job-progress-bar {
        width: 0%;
        height: 100%;
        border-radius: inherit;
        background: var(--primary);
        transition: width .2s ease;
    }
    .contact-import-job-meta {
        display: flex;
        flex-wrap: wrap;
        gap: 8px 14px;
        color: var(--muted);
        font-size: .88rem;
    }
    .contact-import-job-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
    }
    .contact-import-job-events {
        display: grid;
        gap: 8px;
        margin-top: 12px;
    }
    .contact-import-job-event {
        padding: 9px 11px;
        border: 1px solid var(--border);
        border-radius: 10px;
        background: #f8fafc;
        color: var(--muted);
        font-size: .88rem;
    }
    .contact-import-job-event strong {
        color: var(--text);
    }
    .contact-import-job-event.is-error {
        border-color: #fecaca;
        background: #fef2f2;
        color: #991b1b;
    }
    .contact-import-job-error {
        padding: 10px 12px;
        border: 1px solid #fecaca;
        border-radius: 10px;
        background: #fef2f2;
        color: #991b1b;
    }
    .contact-import-warning-note {
        padding: 10px 12px;
        border: 1px solid #fde68a;
        border-radius: 10px;
        background: #fffbeb;
        color: #92400e;
    }
    .contact-import-map-table td {
        vertical-align: top;
    }
    .contact-import-map-table .contact-import-mapping-select,
    .contact-import-map-table .contact-import-update-policy-select {
        width: 100%;
    }
    .contact-import-field-builder-row > td {
        padding-top: 0;
        border-top: 0;
    }
    .contact-import-field-builder-cell {
        padding-bottom: 18px !important;
    }
    .contact-import-field-builder {
        width: 100%;
        padding: 18px;
        border: 1px solid var(--border);
        border-radius: 14px;
        background: #f8fafc;
        box-shadow: 0 1px 2px rgba(15, 23, 42, .04);
    }
    .contact-import-field-builder-heading {
        display: flex;
        justify-content: space-between;
        gap: 16px;
        align-items: flex-start;
        margin-bottom: 16px;
        padding-bottom: 14px;
        border-bottom: 1px solid var(--border);
    }
    .contact-import-field-builder-heading-copy {
        min-width: 0;
    }
    .contact-import-field-builder-heading strong {
        display: block;
        margin-bottom: 3px;
        font-size: .98rem;
    }
    .contact-import-field-builder-help {
        display: block;
        line-height: 1.45;
    }
    .contact-import-field-builder-object {
        flex: 0 0 auto;
        padding: 5px 9px;
        border: 1px solid #cbd5e1;
        border-radius: 999px;
        background: #fff;
        color: #475569;
        font-size: .75rem;
        font-weight: 800;
        letter-spacing: .02em;
        white-space: nowrap;
    }
    .contact-import-field-builder-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14px 18px;
        align-items: start;
    }
    .contact-import-field-control {
        min-width: 0;
    }
    .contact-import-field-control > label,
    .contact-import-field-section-heading {
        display: block;
        margin: 0 0 6px;
        color: var(--text);
        font-size: .82rem;
        font-weight: 800;
    }
    .contact-import-field-control input[type="text"],
    .contact-import-field-control input[type="number"],
    .contact-import-field-control select {
        width: 100%;
        min-width: 0;
    }
    .contact-import-field-identity-control {
        padding: 11px 12px;
        border: 1px solid var(--border);
        border-radius: 10px;
        background: #fff;
    }
    .contact-import-field-identity-control .checkbox-row {
        display: flex;
        gap: 8px;
        align-items: center;
        margin: 0;
        font-weight: 700;
    }
    .contact-import-field-identity-control p {
        margin: 6px 0 0 24px;
        line-height: 1.4;
    }
    .contact-import-field-section {
        margin-top: 16px;
        padding-top: 14px;
        border-top: 1px solid var(--border);
    }
    .contact-import-number-settings-grid {
        display: grid;
        grid-template-columns: minmax(0, 1.35fr) minmax(120px, .65fr) minmax(120px, .65fr);
        gap: 12px;
        align-items: end;
    }
    .contact-import-field-option-editor {
        overflow: hidden;
        border: 1px solid var(--border);
        border-radius: 10px;
        background: #fff;
    }
    .contact-import-field-option-header,
    .contact-import-field-option-row {
        display: grid;
        grid-template-columns: 34px minmax(0, 1fr) minmax(0, 1fr);
        gap: 8px;
        align-items: center;
    }
    .contact-import-field-option-header {
        padding: 8px 10px;
        border-bottom: 1px solid var(--border);
        background: #f1f5f9;
        color: #64748b;
        font-size: .73rem;
        font-weight: 800;
        text-transform: uppercase;
        letter-spacing: .035em;
    }
    .contact-import-field-option-list {
        display: grid;
        gap: 7px;
        max-height: 280px;
        overflow: auto;
        padding: 9px 10px 10px;
    }
    .contact-import-field-option-row {
        margin: 0;
    }
    .contact-import-field-option-row input[type="checkbox"] {
        margin: 0 auto;
    }
    .contact-import-field-option-row input[type="text"] {
        width: 100%;
        min-width: 0;
    }
    .contact-import-field-options-empty {
        display: grid;
        gap: 3px;
        margin: 0;
        padding: 12px 14px;
        border: 1px dashed #cbd5e1;
        border-radius: 10px;
        background: #fff;
        color: #64748b;
        line-height: 1.45;
    }
    .contact-import-field-options-empty strong {
        color: #334155;
        font-size: .84rem;
    }
    .contact-import-create-warnings {
        display: grid;
        gap: 8px;
        margin-top: 12px;
    }
    .contact-import-field-warning {
        display: grid;
        grid-template-columns: 18px minmax(0, 1fr);
        gap: 7px;
        align-items: start;
        padding: 9px 11px;
        border: 1px solid #fde68a;
        border-radius: 9px;
        background: #fffbeb;
        color: #92400e;
        line-height: 1.4;
    }
    .contact-import-pending-field-list {
        display: grid;
        gap: 8px;
        margin: 10px 0 14px;
    }
    .contact-import-pending-field {
        padding: 10px 12px;
        border: 1px solid var(--border);
        border-radius: 10px;
        background: #f8fafc;
    }
    .contact-import-options-wide {
        grid-column: 1 / -1;
    }
    .contact-import-identity-list {
        display: grid;
        gap: 8px;
        margin: 8px 0 10px;
    }
    .contact-import-identity-item {
        display: flex;
        justify-content: space-between;
        gap: 12px;
        align-items: center;
        padding: 10px 12px;
        border: 1px solid var(--border);
        border-radius: 10px;
        background: #f8fafc;
    }
    .contact-import-identity-item span {
        display: block;
        margin-top: 2px;
    }
    .contact-import-identity-actions,
    .contact-import-identity-add-row {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        align-items: center;
    }
    .contact-import-identity-add-row select {
        min-width: 260px;
    }
    .contact-import-account-identity-list {
        display: grid;
        gap: 6px;
        margin: 8px 0 0;
    }
    .contact-import-account-identity-list label {
        display: flex;
        gap: 8px;
        align-items: center;
        margin: 0;
        font-weight: 500;
    }
    .contact-import-account-options {
        padding: 12px;
        border: 1px solid var(--border);
        border-radius: 12px;
        background: #f8fafc;
    }
    .contact-import-row-account-create,
    .contact-import-row-account-matched,
    .contact-import-row-account-matched_file_account { color: #166534; font-weight: 700; }
    .contact-import-row-account-not_found,
    .contact-import-row-account-missing_identity,
    .contact-import-row-account-missing_name,
    .contact-import-row-account-conflict,
    .contact-import-row-account-error { color: #991b1b; font-weight: 700; }
    .contact-import-row-ready { color: #166534; font-weight: 700; }
    .contact-import-row-existing_update { color: #1d4ed8; font-weight: 700; }
    .contact-import-row-existing_match { color: #92400e; font-weight: 700; }
    .contact-import-row-invalid_email,
    .contact-import-row-invalid_phone,
    .contact-import-row-invalid_custom_value,
    .contact-import-row-missing_contact,
    .contact-import-row-missing_match_value,
    .contact-import-row-match_conflict,
    .contact-import-row-ambiguous_match,
    .contact-import-row-duplicate_in_file,
    .contact-import-row-empty_row { color: #991b1b; font-weight: 700; }

    @media (max-width: 1100px) {
        .contact-import-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
        .contact-import-field-builder-grid { grid-template-columns: 1fr; }
    }
    @media (max-width: 850px) {
        .contact-import-number-settings-grid { grid-template-columns: 1fr 1fr; }
        .contact-import-number-settings-grid .contact-import-currency-setting { grid-column: 1 / -1; }
    }
    @media (max-width: 700px) {
        .contact-import-file-row,
        .contact-import-options-grid,
        .contact-import-summary { grid-template-columns: 1fr; }
        .contact-import-map-table select,
        .contact-import-map-table .contact-import-update-policy-select { min-width: 155px; }
        .contact-import-field-builder { padding: 14px; }
        .contact-import-field-builder-heading { flex-direction: column; }
        .contact-import-number-settings-grid { grid-template-columns: 1fr; }
        .contact-import-number-settings-grid .contact-import-currency-setting { grid-column: auto; }
        .contact-import-field-option-header { display: none; }
        .contact-import-field-option-row {
            grid-template-columns: 28px minmax(0, 1fr);
            align-items: start;
        }
        .contact-import-field-option-row .contact-import-field-option-internal { grid-column: 2; }
    }

/* Externalized from templates/company_settings/email_domain.html without behavioral changes. */
    .email-help-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
        gap: 12px;
        margin: 14px 0;
    }
    .email-help-step {
        border: 1px solid #dbeafe;
        background: #f8fbff;
        border-radius: 14px;
        padding: 12px;
    }
    .email-help-step strong {
        display: block;
        margin-bottom: 6px;
    }
    .table-responsive {
        width: 100%;
        max-width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    .dns-table,
    .sender-table {
        width: 100%;
        border-collapse: collapse;
        table-layout: auto;
    }
    .dns-table {
        min-width: 1040px;
    }
    .sender-table {
        min-width: 1180px;
    }
    .dns-table th,
    .dns-table td,
    .sender-table th,
    .sender-table td {
        vertical-align: top;
        white-space: nowrap;
        word-break: normal;
        overflow-wrap: normal;
    }
    .dns-table code {
        display: inline-block;
        max-width: none;
        white-space: nowrap;
        word-break: normal;
        overflow-wrap: normal;
        line-height: 1.35;
    }
    .copy-row {
        display: flex;
        align-items: flex-start;
        gap: 8px;
        flex-wrap: wrap;
    }
    .copy-row code {
        flex: 1 1 auto;
    }
    .copy-mini {
        border: 1px solid #bfdbfe;
        background: #eff6ff;
        color: #0f4fa8;
        border-radius: 10px;
        padding: 4px 8px;
        font-size: 12px;
        font-weight: 700;
        cursor: pointer;
    }
    .dns-callout {
        border: 1px solid #bfdbfe;
        background: #eff6ff;
        border-radius: 14px;
        padding: 12px 14px;
        margin: 12px 0;
    }
    .dns-warning {
        border: 1px solid #fde68a;
        background: #fffbeb;
        border-radius: 14px;
        padding: 12px 14px;
        margin: 12px 0;
    }
    .pill-muted {
        display: inline-block;
        border-radius: 999px;
        padding: 4px 9px;
        font-size: 12px;
        font-weight: 800;
        background: #eef2ff;
        color: #1e3a8a;
    }
    .sender-actions {
        display: grid;
        gap: 6px;
        min-width: 130px;
    }
    .sender-status-note {
        max-width: 360px;
        line-height: 1.35;
    }

/* Externalized from templates/email_campaign_analysis.html without behavioral changes. */
  .analysis-header { display:flex; justify-content:space-between; gap:18px; align-items:flex-start; flex-wrap:wrap; }
  .analysis-actions { display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
  .analysis-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
  .analysis-grid-2 { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
  .analysis-stat { border:1px solid var(--border); border-radius:14px; padding:14px; background:#fff; }
  .analysis-stat strong { display:block; font-size:1.7rem; margin-top:4px; }
  .analysis-stat small { display:block; color:var(--muted); margin-top:4px; }
  .analysis-chart {
    min-width: 0;
    overflow: hidden;
  }

  .analysis-chart-canvas {
    position: relative;
    width: 100%;
    height: 280px;
    min-height: 280px;
    max-height: 280px;
    overflow: hidden;
  }

  .analysis-chart-canvas canvas {
    display: block;
    width: 100% !important;
    height: 100% !important;
    max-height: 280px !important;
  }
  .analysis-coverage { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
  .analysis-coverage-item { border:1px solid var(--border); border-radius:12px; padding:12px; }
  .analysis-filter-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr auto; gap:12px; align-items:end; }
  .analysis-tag-grid { display:grid; grid-template-columns:1.2fr 1fr 1fr 1fr auto; gap:12px; align-items:end; }
  .analysis-settings-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
  .analysis-reasons { margin:0; padding-left:18px; }
  .analysis-reasons li { margin:2px 0; }
  .analysis-score { font-weight:700; white-space:nowrap; }
  .analysis-stale { border-left:4px solid #f59e0b; }
  .analysis-current { border-left:4px solid #10b981; }
  .analysis-checkbox-cell { width:42px; }
  .analysis-pagination { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:16px; }
  .analysis-settings-dialog {
    width:min(1180px,calc(100vw - 32px));
    max-width:1180px;
    max-height:calc(100vh - 32px);
    padding:0;
    border:0;
    border-radius:18px;
    box-shadow:0 24px 70px rgba(15,23,42,.28);
    overflow:hidden;
  }
  .analysis-settings-dialog::backdrop { background:rgba(15,23,42,.58); backdrop-filter:blur(2px); }
  .analysis-settings-shell { display:flex; flex-direction:column; max-height:calc(100vh - 32px); background:#f8fafc; }
  .analysis-settings-header {
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:18px;
    padding:20px 22px;
    border-bottom:1px solid var(--border);
    background:#fff;
  }
  .analysis-settings-header h2 { margin:0 0 5px; }
  .analysis-settings-body { padding:20px 22px 28px; overflow:auto; }
  .analysis-settings-section { margin-bottom:20px; padding:18px; border:1px solid var(--border); border-radius:15px; background:#fff; }
  .analysis-settings-section > h3 { margin-top:0; }
  .analysis-preset-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
  .analysis-preset-card { display:flex; flex-direction:column; gap:10px; padding:15px; border:1px solid var(--border); border-radius:14px; background:#fff; }
  .analysis-preset-card.is-active { border:2px solid #0f766e; background:#f0fdfa; }
  .analysis-preset-card h4 { margin:0; }
  .analysis-preset-card form { margin-top:auto; }
  .analysis-preset-meta { display:grid; gap:5px; padding:9px; border-radius:10px; background:#f8fafc; font-size:.82rem; }
  .analysis-guide-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
  .analysis-guide-card { padding:14px; border:1px solid var(--border); border-radius:13px; background:#fff; }
  .analysis-guide-card h4 { margin:0 0 8px; }
  .analysis-guide-card p:last-child { margin-bottom:0; }
  .analysis-definition-list { display:grid; grid-template-columns:minmax(150px,.7fr) minmax(0,2fr); gap:8px 14px; margin:0; }
  .analysis-definition-list dt { font-weight:700; }
  .analysis-definition-list dd { margin:0; color:var(--muted); }
  .analysis-score-table { width:100%; border-collapse:collapse; }
  .analysis-score-table th,.analysis-score-table td { padding:8px 10px; border-bottom:1px solid var(--border); text-align:left; vertical-align:top; }
  .analysis-setting-field { padding:12px; border:1px solid var(--border); border-radius:12px; background:#fff; }
  .analysis-setting-field label { display:block; font-weight:700; margin-bottom:6px; }
  .analysis-setting-field small { display:block; margin-top:6px; color:var(--muted); line-height:1.35; }
  .analysis-notice { padding:12px 14px; border-left:4px solid #2563eb; border-radius:10px; background:#eff6ff; }
  .analysis-warning { padding:12px 14px; border-left:4px solid #f59e0b; border-radius:10px; background:#fffbeb; }
  .analysis-dialog-close { flex:0 0 auto; }
  body.analysis-dialog-open { overflow:hidden; }
  @media (max-width:1100px) {
    .analysis-grid,
    .analysis-coverage,
    .analysis-settings-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .analysis-filter-grid,
    .analysis-tag-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .analysis-preset-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }

  @media (max-width:700px) {
    .analysis-grid,
    .analysis-grid-2,
    .analysis-coverage,
    .analysis-settings-grid,
    .analysis-filter-grid,
    .analysis-tag-grid {
      grid-template-columns: 1fr;
    }

    .analysis-chart-canvas {
      height: 240px;
      min-height: 240px;
      max-height: 240px;
    }

    .analysis-chart-canvas canvas {
      max-height: 240px !important;
    }

    .analysis-preset-grid,
    .analysis-guide-grid {
      grid-template-columns: 1fr;
    }

    .analysis-definition-list {
      grid-template-columns: 1fr;
      gap:3px;
    }

    .analysis-definition-list dd {
      margin-bottom:10px;
    }

    .analysis-settings-dialog {
      width:calc(100vw - 16px);
      max-height:calc(100vh - 16px);
    }

    .analysis-settings-shell {
      max-height:calc(100vh - 16px);
    }
  }

/* Externalized from templates/import_suppressions.html without behavioral changes. */
    .suppression-import-layout {
        display: grid;
        gap: 16px;
    }
    .suppression-import-step {
        position: relative;
    }
    .suppression-import-step-number {
        display: inline-flex;
        width: 30px;
        height: 30px;
        align-items: center;
        justify-content: center;
        margin-right: 8px;
        border-radius: 999px;
        background: var(--primary);
        color: #fff;
        font-weight: 800;
    }
    .suppression-import-file-row {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 14px;
        align-items: end;
    }
    .suppression-import-map-table select {
        min-width: 180px;
    }
    .suppression-import-examples {
        display: grid;
        gap: 3px;
        max-width: 520px;
    }
    .suppression-import-example {
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        color: var(--muted);
        font-size: .84rem;
    }
    .suppression-import-summary {
        display: grid;
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 10px;
        margin: 14px 0;
    }
    .suppression-import-summary-card {
        padding: 12px;
        border: 1px solid var(--border);
        border-radius: 12px;
        background: #fff;
    }
    .suppression-import-summary-card strong {
        display: block;
        margin-top: 3px;
        font-size: 1.35rem;
    }
    .suppression-import-status {
        padding: 12px 14px;
        border: 1px solid var(--border);
        border-radius: 12px;
        background: #f8fafc;
    }
    .suppression-import-status.is-error {
        border-color: #fecaca;
        background: #fef2f2;
        color: #991b1b;
    }
    .suppression-import-status.is-success {
        border-color: #bbf7d0;
        background: #f0fdf4;
        color: #166534;
    }
    .suppression-import-hidden {
        display: none !important;
    }
    .suppression-import-result-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        margin-top: 16px;
    }
    .suppression-import-row-ready { color: #166534; font-weight: 700; }
    .suppression-import-row-existing_update { color: #1d4ed8; font-weight: 700; }
    .suppression-import-row-invalid_email,
    .suppression-import-row-invalid_phone,
    .suppression-import-row-invalid_channel,
    .suppression-import-row-missing_target,
    .suppression-import-row-duplicate_in_file,
    .suppression-import-row-empty_row { color: #991b1b; font-weight: 700; }

    @media (max-width: 1100px) {
        .suppression-import-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    }
    @media (max-width: 700px) {
        .suppression-import-file-row,
        .suppression-import-summary { grid-template-columns: 1fr; }
        .suppression-import-map-table select { min-width: 150px; }
    }

/* Externalized from templates/call_logs.html without behavioral changes. */
    .call-media-actions {
        display: flex;
        flex-direction: column;
        gap: 6px;
        align-items: flex-start;
    }

    .call-transcript-details summary {
        cursor: pointer;
        color: #0b5bb8;
        font-weight: 800;
        font-size: 12px;
    }

    .call-transcript-preview {
        white-space: pre-wrap;
        max-width: 520px;
        max-height: 220px;
        overflow: auto;
        margin: 8px 0 0;
        padding: 10px;
        background: #f8fbff;
        border: 1px solid #dbe7f6;
        border-radius: 10px;
        font-size: 12px;
        line-height: 1.45;
    }

/* Externalized from templates/contact_import_history.html without behavioral changes. */
    .contact-import-history-page {
        display: grid;
        gap: 16px;
    }
    .contact-import-history-header {
        display: flex;
        justify-content: space-between;
        gap: 16px;
        align-items: flex-start;
    }
    .contact-import-history-actions,
    .contact-import-history-filters,
    .contact-import-history-row-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
        align-items: center;
    }
    .contact-import-history-tabs {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }
    .contact-import-history-tab {
        padding: 8px 12px;
        border: 1px solid var(--border);
        border-radius: 999px;
        color: var(--text);
        text-decoration: none;
        background: #fff;
        font-size: .88rem;
        font-weight: 700;
    }
    .contact-import-history-tab.is-active {
        border-color: var(--primary);
        background: color-mix(in srgb, var(--primary) 10%, white);
        color: var(--primary);
    }
    .contact-import-history-status {
        display: inline-flex;
        align-items: center;
        padding: 4px 8px;
        border-radius: 999px;
        background: #e2e8f0;
        color: #334155;
        font-size: .78rem;
        font-weight: 800;
        text-transform: capitalize;
    }
    .contact-import-history-status.status-completed { background: #dcfce7; color: #166534; }
    .contact-import-history-status.status-running,
    .contact-import-history-status.status-queued { background: #dbeafe; color: #1d4ed8; }
    .contact-import-history-status.status-paused { background: #fef3c7; color: #92400e; }
    .contact-import-history-status.status-failed,
    .contact-import-history-status.status-cancelled { background: #fee2e2; color: #991b1b; }
    .contact-import-history-progress {
        display: grid;
        gap: 5px;
        min-width: 180px;
    }
    .contact-import-history-progress-track {
        overflow: hidden;
        height: 9px;
        border-radius: 999px;
        background: #e2e8f0;
    }
    .contact-import-history-progress-bar {
        height: 100%;
        border-radius: inherit;
        background: var(--primary);
    }
    .contact-import-history-issue {
        max-width: 360px;
        color: #991b1b;
        font-size: .86rem;
    }
    .contact-import-history-empty {
        padding: 24px;
        border: 1px dashed var(--border);
        border-radius: 14px;
        text-align: center;
        background: #f8fafc;
    }
    @media (max-width: 800px) {
        .contact-import-history-header { flex-direction: column; }
        .contact-import-history-progress { min-width: 140px; }
    }

/* Externalized from templates/import_accounts.html without behavioral changes. */
    .account-import-hidden { display: none !important; }
    .account-import-step { margin-top: 1rem; }
    .account-import-status { margin: 1rem 0; padding: .8rem 1rem; border-radius: 8px; background: rgba(44, 124, 255, .08); }
    .account-import-status.is-error { background: rgba(220, 53, 69, .10); }
    .account-import-status.is-success { background: rgba(25, 135, 84, .10); }
    .account-import-map-table select { min-width: 180px; }
    .account-import-examples { display: flex; gap: .35rem; flex-wrap: wrap; }
    .account-import-example { display: inline-block; padding: .15rem .4rem; border-radius: 999px; background: rgba(0,0,0,.05); font-size: .8rem; }
    .account-import-summary { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: .75rem; margin: 1rem 0; }
    .account-import-summary-card { padding: .75rem; border: 1px solid rgba(0,0,0,.09); border-radius: 10px; }
    .account-import-summary-card span { display: block; font-size: .8rem; color: var(--muted-text, #65758b); }
    .account-import-summary-card strong { font-size: 1.2rem; }
    .account-import-identity-list { display: grid; gap: .5rem; }
    .account-import-identity-item { display: flex; gap: .55rem; align-items: flex-start; }
    .account-import-identity-item small { display: block; color: var(--muted-text, #65758b); }
    .account-import-preview-table td, .account-import-preview-table th { vertical-align: top; }
    .account-import-action-create { color: #0a7a3f; font-weight: 700; }
    .account-import-action-update { color: #1358b5; font-weight: 700; }
    .account-import-action-conflict, .account-import-action-error { color: #b42318; font-weight: 700; }
    .account-import-action-skip { color: #687386; font-weight: 700; }
    @media (max-width: 800px) {
        .account-import-map-table { min-width: 850px; }
    }