.trip-comments-modal { max-width: 560px; }
.trip-comments-modal h3 { padding-right: 1.5rem; overflow-wrap: anywhere; flex-shrink: 0; }
.trip-comments-modal .modal-body {
    display: flex;
    flex-direction: column;
    flex: 0 1 auto;
    min-height: 0;
    overflow: hidden;
}
#tripCommentsMessage, #tripCommentForm { flex-shrink: 0; }
#tripCommentsList {
    flex: 0 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    scrollbar-width: thin;
}
.trip-comment { padding: .8rem 0; border-bottom: 1px solid rgba(128,128,128,.25); }
.trip-comment-meta { font-size: .8rem; color: #616b7c; overflow-wrap: anywhere; }
.trip-comment-body { white-space: pre-wrap; overflow-wrap: anywhere; margin: .35rem 0 .5rem; }
.trip-comment.is-resolved .trip-comment-body,
.trip-comment.is-resolved .trip-comment-meta { color: #6b7280; }
.trip-comment-status {
    display: inline-block;
    margin-left: .5rem;
    font-size: .75rem;
    white-space: nowrap;
}
.trip-comment .account-text-actions { margin: 0; flex-wrap: wrap; gap: .7rem; }
#tripCommentForm { margin-top: 1rem; }
#tripCommentText { display: block; width: 100%; margin-top: .4rem; max-height: min(160px, 25dvh); }
#tripCommentsModal [hidden] { display: none !important; }
.trip-comments-modal .form-actions { flex-shrink: 0; }
html[data-theme="dark"] .trip-comment-meta { color: #abb5c7; }
html[data-theme="dark"] .trip-comment.is-resolved .trip-comment-body,
html[data-theme="dark"] .trip-comment.is-resolved .trip-comment-meta { color: #969eac; }
@media print { #tripCommentsModal, .trip-comment-indicator { display: none !important; } }
.trip-comment-indicator {
    position: absolute;
    top: -5px;
    right: -8px;
    display: grid;
    place-items: center;
    width: 20px;
    height: 20px;
    padding: 0;
    border: 1px solid #91b4ff;
    border-radius: 50%;
    background: #2563eb;
    color: #fff;
    cursor: pointer;
    z-index: 1;
    transition: background-color .15s ease, border-color .15s ease;
}
.trip-comment-indicator[hidden] { display: none; }
.trip-comment-indicator:hover:where(.hover-enabled *),
.trip-comment-indicator:focus-visible { background: #1d4ed8; border-color: #628ff1; }
.trip-comment-indicator:focus-visible { outline: 2px solid #667eea; outline-offset: 2px; }
html[data-theme="dark"] .trip-comment-indicator { background: #1d4ed8; border-color: #608bea; color: #e4edff; }
html[data-theme="dark"] .trip-comment-indicator:hover:where(.hover-enabled *),
html[data-theme="dark"] .trip-comment-indicator:focus-visible { background: #2563eb; border-color: #9bbaff; color: #fff; }
