/* Original Report Comparison Styles */

#originalComparisonBtn {
    display: none !important;
}

#originalComparisonBtn[aria-expanded="true"] {
    --button-shadow-color: 37, 99, 235;
    background: linear-gradient(180deg, #3b82f6 0%, #1d4ed8 100%) !important;
    border-color: #2563eb !important;
    color: white !important;
    box-shadow:
        0 1px 2px rgba(30, 64, 175, 0.14),
        inset 0 2px 4px rgba(30, 64, 175, 0.18);
}

@media (hover: hover) and (pointer: fine) {
    /* Original file button - hover blue */
    #originalFileBtn:hover,
    #originalComparisonBtn:hover {
        --button-shadow-color: 37, 99, 235;
        background: linear-gradient(180deg, #4a8df7 0%, #2563eb 100%) !important;
        border-color: #2563eb !important;
        color: white !important;
        transform: translateY(-1px);
        box-shadow:
            0 2px 3px rgba(15, 23, 42, 0.08),
            0 3px 7px rgba(37, 99, 235, 0.12),
            var(--control-highlight);
    }
}

/* Desktop original-report comparison */
.results-comparison-shell {
    position: relative;
    width: 100%;
}

.results-comparison-shell > .results-card {
    min-width: 0;
    width: 100%;
}

.original-preview-pane {
    display: none;
    min-width: 0;
    overflow: hidden;
    background: var(--color-bg-white);
    border: 1px solid rgba(37, 99, 235, 0.24);
    border-radius: 15px;
    box-shadow: 0 3px 12px rgba(31, 41, 55, 0.08);
}

.original-preview-header {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: 58px;
    padding: 0.75rem 1rem;
    color: var(--color-text-dark);
    background: linear-gradient(135deg, #e7edff 0%, #f1eeff 100%);
    border-bottom: 1px solid rgba(37, 99, 235, 0.22);
}

.original-preview-title {
    display: flex;
    min-width: 0;
    align-items: center;
    gap: 0.45rem;
    font-size: 0.9rem;
}

.original-preview-title > i {
    flex: 0 0 auto;
    color: #2563eb;
}

.original-preview-context,
.original-preview-separator {
    flex: 0 0 auto;
}

.original-preview-context {
    color: #2563eb;
    font-weight: 600;
}

.original-preview-separator {
    color: rgba(37, 99, 235, 0.52);
}

#originalPreviewFilename {
    min-width: 0;
    overflow: hidden;
    color: #2563eb;
    font-weight: 500;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.original-preview-actions {
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    overflow: hidden;
    min-height: 34px;
    background: var(--control-surface);
    border: 1px solid rgba(37, 99, 235, 0.42);
    border-radius: var(--control-radius);
    box-shadow:
        0 1px 2px rgba(15, 23, 42, 0.08),
        0 3px 7px rgba(37, 99, 235, 0.08),
        var(--control-highlight);
    transition: var(--control-transition);
}

.original-preview-open-link,
.original-preview-close-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 0.35rem 0.65rem;
    color: #2563eb;
    background: transparent;
    border: 0;
    font-size: 0.82rem;
    font-weight: 500;
    text-decoration: none;
    transition: var(--control-transition);
    transform: translateY(0);
}

.original-preview-open-link {
    gap: 0.4rem;
}

.original-preview-close-btn {
    width: 36px;
    padding-inline: 0;
    border-left: 1px solid rgba(37, 99, 235, 0.32);
    cursor: pointer;
}

.original-preview-open-link:active,
.original-preview-close-btn:active {
    background: rgba(37, 99, 235, 0.1);
    box-shadow: inset 0 2px 4px rgba(30, 64, 175, 0.12);
    transform: translateY(1px);
}

.original-preview-open-link:focus-visible,
.original-preview-close-btn:focus-visible {
    position: relative;
    z-index: 1;
    outline: 2px solid var(--color-primary);
    outline-offset: -3px;
}

@media (hover: hover) and (pointer: fine) {
    .original-preview-open-link:hover {
        color: #1d4ed8;
        background: linear-gradient(180deg, #f7f9ff 0%, #e7efff 100%);
        transform: translateY(-1px);
    }

    .original-preview-close-btn:hover {
        color: #1e40af;
        background: linear-gradient(180deg, #eef2ff 0%, #dbe7ff 100%);
        transform: translateY(-1px);
    }
}

.original-preview-content {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    background: #e5e7eb;
}

.original-preview-pdf {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
    background: white;
}

.original-preview-image {
    display: block;
    width: 100%;
    height: auto;
    padding: 1rem;
    background: #e5e7eb;
}

.edit-biometry-modal.edit-modal-scoped .modal-content {
    container-type: inline-size;
    height: 100%;
    min-height: 0;
    margin: 0;
}

.edit-biometry-modal.edit-modal-scoped .modal-body {
    min-height: 0;
    max-height: none;
}

@container (max-width: 560px) {
    .edit-biometry-modal.edit-modal-scoped .edit-form-columns > .col-md-6 {
        flex: 0 0 100%;
        max-width: 100%;
    }
}

@media (min-width: 1200px) {
    #originalFileBtn {
        display: none !important;
    }

    #originalComparisonBtn:not([hidden]) {
        display: inline-flex !important;
    }

    .results-comparison-shell.comparison-active {
        display: grid;
        width: min(1500px, calc(100vw - 6rem));
        margin-left: 50%;
        transform: translateX(-50%);
        grid-template-columns: minmax(520px, 9fr) minmax(0, 11fr);
        gap: 1rem;
        align-items: start;
    }

    .results-comparison-shell.comparison-active > .results-card {
        grid-column: 1;
        grid-row: 1;
    }

    .results-comparison-shell.comparison-active .original-preview-pane {
        position: sticky;
        top: 1rem;
        display: flex;
        flex-direction: column;
        grid-column: 2;
        grid-row: 1;
        align-self: start;
        height: calc(100vh - 2rem);
        min-height: 480px;
    }

    .results-comparison-shell.comparison-active .result-action-btn {
        padding-inline: 0.9rem !important;
    }

    #editBiometryModal:not(.edit-modal-scoped) .edit-biometry-dialog {
        width: calc(100% - 3rem);
        max-width: 1100px;
    }

    .results-comparison-shell.comparison-active > .edit-biometry-modal.edit-modal-scoped {
        position: sticky;
        inset: auto;
        top: 1rem;
        z-index: 10;
        display: flex !important;
        width: 100%;
        height: calc(100vh - 2rem);
        min-height: 480px;
        overflow: hidden;
        grid-column: 1;
        grid-row: 1;
        align-self: start;
        background: rgba(17, 24, 39, 0.45);
        border-radius: 15px;
    }

    .edit-biometry-modal.edit-modal-scoped .edit-biometry-dialog {
        display: flex;
        width: 100%;
        height: 100%;
        min-height: 0;
        max-width: none;
        max-height: none;
        margin: 0;
        padding: 0.75rem;
        align-items: stretch;
    }
}

/* Keep pressed depth authoritative when pointer hover remains active. */
.original-preview-open-link:active,
.original-preview-close-btn:active,
#originalComparisonBtn:active {
    box-shadow: var(--control-shadow-pressed) !important;
    transform: translateY(1px) !important;
}

@media (prefers-reduced-motion: reduce) {
    .original-preview-actions,
    .original-preview-open-link,
    .original-preview-close-btn {
        transition-duration: 0.01ms !important;
    }

    .original-preview-open-link:hover,
    .original-preview-open-link:active,
    .original-preview-close-btn:hover,
    .original-preview-close-btn:active {
        transform: none !important;
    }
}