/* Shared Observatory surfaces, including previews hosted outside the page shell. */
:is(.obs-shell, .shared-dashboard-root, .obs-request-preview, .organization-details) {
    --obs-surface-line: #aebdc8;
    --obs-detail-line: #d3dde5;
    --obs-surface-heading: #eef3f7;
}

:is(.obs-shell, .shared-dashboard-root, .obs-request-preview, .organization-details) :is(
    .obs-panel, .template-detail, .axis-content, .field-info, .axis-section,
    .settings-section, .content-section, .fixed-upload, .fixed-file-details,
    .fixed-version-history, .home-panel, .builder-tools, .builder-preview,
    .builder-selection, .builder-source-summary, .builder-audience,
    .permission-group, .governance-panel, .access-editor, .capability-editor,
    .scope-directory, .scope-user-card, .quality-run-panel, .quality-rule-card,
    .comparison-source-card, .comparison-history-card, .comparison-row-details,
    .smart-rule-card, .obs-governance-card, .obs-governance-panel, .obs-layout-row,
    .obs-optional-section, .obs-axis-accordion__item, .obs-template-generator__axis,
    .obs-widget, .shared-widget, .dashboard-card, .journey-panel, .request-details,
    .capability-details-dialog__section, .quality-score-card, .comparison-summary__card,
    .obs-dashboard-source-card-shell, .obs-audience-choice-card, .obs-upload-details__issues,
    .obs-page-card, .obs-widget-card-preview, .fixed-template-grid > article,
    .builder-list > article) {
    border: 1px solid var(--obs-surface-line) !important;
    border-radius: 12px;
}

:is(.obs-shell, .shared-dashboard-root, .obs-request-preview, .organization-details) :is(
    .obs-panel__header, .section-heading, .obs-card-heading,
    .settings-section > h4, .field-info > h4, .axis-section > h4) {
    color: #203c4b !important;
    background: var(--obs-surface-heading) !important;
    border-bottom: 1px solid var(--obs-surface-line) !important;
}

.obs-shell .template-card-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
}

.obs-shell .template-card-actions > .obs-action:not(.obs-action--icon) {
    flex: 1 1 100%;
}

:is(.obs-shell, .shared-dashboard-root, .obs-request-preview, .organization-details) :is(
    .template-detail, .fixed-file-details, .fixed-version-history, .home-panel,
    .builder-tools, .builder-preview, .builder-selection, .permission-group,
    .governance-panel, .quality-rule-card, .comparison-history-card,
    .dashboard-card, .obs-governance-card, .obs-page-card) > header {
    border-bottom: 1px solid var(--obs-detail-line);
    padding-block-end: 12px;
    margin-block-end: 12px;
}

:is(.obs-shell, .shared-dashboard-root, .obs-request-preview, .organization-details) details {
    border: 1px solid var(--obs-surface-line);
    border-radius: 8px;
}

:is(.obs-shell, .shared-dashboard-root, .obs-request-preview, .organization-details) details > summary {
    padding: 10px 12px;
    color: #203c4b;
    background: var(--obs-surface-heading);
    border-radius: 7px;
    overflow-wrap: anywhere;
}

:is(.obs-shell, .shared-dashboard-root, .obs-request-preview, .organization-details) details[open] > summary {
    border-bottom: 1px solid var(--obs-surface-line);
    border-end-start-radius: 0;
    border-end-end-radius: 0;
    margin-block-end: 12px;
}

:is(.obs-shell, .shared-dashboard-root, .obs-request-preview, .organization-details) dl > div {
    min-width: 0;
    padding: 10px 12px;
    border: 1px solid var(--obs-detail-line);
    border-radius: 8px;
    background: #f8fafc;
    color: #203c4b;
}

:is(.obs-shell, .shared-dashboard-root, .obs-request-preview, .organization-details) tbody > tr > :is(td, th) {
    border-bottom: 1px solid var(--obs-detail-line);
}

:is(.obs-shell, .shared-dashboard-root, .obs-request-preview, .organization-details) :is(.monitoring-row, .obs-org-row) + :is(.monitoring-row, .obs-org-row) {
    border-top: 1px solid var(--obs-detail-line);
}

/* Action colors deliberately do not inherit organization branding. */
.obs-action[data-obs-action] { --obs-action-bg: #475569; }
.obs-action:is([data-obs-action="back"], [data-obs-action="previous"], [data-obs-action="next"], [data-obs-action="forward"]) { --obs-action-bg: #1d4ed8; }
.obs-action:is([data-obs-action="search"], [data-obs-action="refresh"]) { --obs-action-bg: #334e8a; }
.obs-action:is([data-obs-action="add"], [data-obs-action="upload"]) { --obs-action-bg: #0f766e; }
.obs-action:is([data-obs-action="save"], [data-obs-action="publish"], [data-obs-action="submit"]) { --obs-action-bg: #166534; }
.obs-action[data-obs-action="download"] { --obs-action-bg: #0e7490; }
.obs-action:is([data-obs-action="edit"], [data-obs-action="clear"]) { --obs-action-bg: #8a4b0a; }
.obs-action:is([data-obs-action="share"], [data-obs-action="verify"]) { --obs-action-bg: #6d28a5; }
.obs-action[data-obs-action="delete"] { --obs-action-bg: #b42336; }
.obs-action[data-obs-action="pause"] { --obs-action-bg: #8a4b0a; }
.obs-action[data-obs-action="enable"] { --obs-action-bg: #166534; }

body .obs-action[data-obs-action][title][aria-label] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 44px;
    padding: 10px 14px !important;
    border: 1px solid var(--obs-action-bg) !important;
    border-radius: 8px !important;
    background: var(--obs-action-bg) !important;
    color: #fff !important;
    box-shadow: none !important;
    text-decoration: none !important;
    line-height: 1.4;
    white-space: normal;
    vertical-align: middle;
    cursor: pointer;
}

body .obs-action.obs-action--icon[data-obs-action][title][aria-label] {
    width: 44px !important;
    min-width: 44px !important;
    max-width: 44px !important;
    height: 44px !important;
    flex: 0 0 44px !important;
    padding: 0 !important;
}

body .obs-action[data-obs-action][title][aria-label] > i {
    color: inherit !important;
    font-size: 18px;
    padding: 0;
    margin: 0;
    flex-shrink: 0;
}

body .obs-action[data-obs-action][title][aria-label]:is(:hover, :active):not(:disabled):not([aria-disabled="true"]) {
    filter: brightness(.88);
}

body .obs-action[data-obs-action][title][aria-label]:focus-visible {
    outline: 3px solid #2563eb !important;
    outline-offset: 3px;
}

body .obs-action[data-obs-action][title][aria-label]:is(:disabled, [aria-disabled="true"]) {
    opacity: .55;
    cursor: default;
    filter: none;
}

@media print {
    body.obs-print-dashboard * {
        visibility: hidden !important;
    }

    body.obs-print-dashboard #observatory-print-area,
    body.obs-print-dashboard #observatory-print-area * {
        visibility: visible !important;
    }

    body.obs-print-dashboard #observatory-print-area {
        position: absolute !important;
        inset: 0 !important;
        width: 100% !important;
        border: 0 !important;
        box-shadow: none !important;
    }
}