/* v27.2g dynamic ticket message view */

/* Message cards should not create a huge empty white area for short mails */
.ticket-message-card,
.message-card,
.ticket-message-panel,
.message-panel,
.mail-message-card,
.mail-preview-card,
.email-preview-card,
#ticket-latest-message-card,
#ticket-message-card,
#message,
#messages {
    min-height: unset !important;
}

/* Common body areas */
.ticket-message-body,
.message-body,
.mail-message-body,
.mail-preview-body,
.email-preview-body,
.message-content,
.ticket-message-content,
.ticket-html-preview,
.ticket-clean-text,
.mail-html-preview,
.mail-clean-text,
#ticket-message-body,
#ticket-latest-message-body {
    min-height: 0 !important;
    height: auto !important;
    max-height: 52vh;
    overflow: auto;
    padding-bottom: 18px !important;
}

/* The visible mail box itself should size to content */
.message-display,
.berichtweergave,
.ticket-message-display,
.ticket-message-view,
.ticket-message-frame,
.mail-display,
.mail-viewer {
    min-height: 0 !important;
    height: auto !important;
    max-height: 58vh;
    overflow: auto;
}

/* Keep short text compact */
.ticket-message-body p,
.message-body p,
.mail-message-body p,
.ticket-message-content p,
.message-content p {
    margin-top: 0.55rem;
    margin-bottom: 0.75rem;
}

/* Make toolbar compact and sticky inside longer messages */
.ticket-message-toolbar,
.message-toolbar,
.mail-message-toolbar,
.message-actions,
.ticket-message-actions,
.mail-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
    padding: 10px 12px !important;
    min-height: 42px;
    background: rgba(248, 251, 254, 0.96);
    border-bottom: 1px solid rgba(26, 73, 120, 0.10);
}

/* Dynamic mode class added by JS */
.ticket-message-dynamic {
    min-height: 0 !important;
}

.ticket-message-dynamic .ticket-message-body,
.ticket-message-dynamic .message-body,
.ticket-message-dynamic .message-content,
.ticket-message-dynamic .ticket-message-content,
.ticket-message-dynamic .message-display,
.ticket-message-dynamic .mail-display {
    min-height: 0 !important;
    height: auto !important;
}

/* Short messages get a comfortable but compact box */
.ticket-message-dynamic.ticket-message-short,
.ticket-message-dynamic.ticket-message-short .ticket-message-body,
.ticket-message-dynamic.ticket-message-short .message-body,
.ticket-message-dynamic.ticket-message-short .message-content,
.ticket-message-dynamic.ticket-message-short .ticket-message-content {
    max-height: none !important;
}

/* Longer messages keep the UI usable */
.ticket-message-dynamic.ticket-message-long .ticket-message-body,
.ticket-message-dynamic.ticket-message-long .message-body,
.ticket-message-dynamic.ticket-message-long .message-content,
.ticket-message-dynamic.ticket-message-long .ticket-message-content {
    max-height: 62vh !important;
    overflow: auto !important;
}

/* Expanded mode via button */
.ticket-message-expanded,
.ticket-message-expanded .ticket-message-body,
.ticket-message-expanded .message-body,
.ticket-message-expanded .message-content,
.ticket-message-expanded .ticket-message-content,
.ticket-message-expanded .message-display,
.ticket-message-expanded .mail-display {
    max-height: none !important;
}

/* Avoid giant empty iframe-like viewers when content is plain text */
.ticket-message-dynamic iframe,
.message-display iframe,
.mail-display iframe {
    min-height: 220px;
    max-height: 60vh;
}

/* In focus mode, keep dynamic sizing as well */
body.ticket-focus-active .ticket-message-dynamic,
body.focus-layout-active .ticket-message-dynamic {
    min-height: 0 !important;
}