/* BNA polish layer for Ultimate Member Private Messages. */
.um-message-modal,
.um-message-modal *,
.um-message-modal :before,
.um-message-modal :after,
.um-popup,
.um-popup *,
.um-popup :before,
.um-popup :after,
.um-message-popup,
.um-message-popup *,
.um-message-popup :before,
.um-message-popup :after {
    box-sizing: border-box;
}

.um-message-modal,
.um-popup,
.um-message-popup,
.um-message-conv {
    font-family: "Jost", "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

.um-message-modal,
.um-popup,
.um-message-popup {
    border: 1px solid rgba(32, 30, 26, 0.08) !important;
    border-radius: 24px !important;
    background: rgba(255, 253, 248, 0.98) !important;
    box-shadow:
        0 32px 82px rgba(20, 20, 19, 0.24),
        inset 0 1px 0 rgba(255, 255, 255, 0.86) !important;
    overflow: hidden !important;
}

.um-message-header,
.um-message-modal .um-message-header,
.um-popup .um-message-header,
.um-message-popup .um-message-header {
    min-height: 88px !important;
    padding: 18px 22px !important;
    border-bottom: 1px solid rgba(32, 30, 26, 0.08) !important;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, 0.9), rgba(248, 246, 241, 0.84)) !important;
    color: #20201d !important;
}

.um-message-header img,
.um-message-header .um-avatar,
.um-message-header .gravatar {
    width: 54px !important;
    height: 54px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    box-shadow:
        0 0 0 3px rgba(255, 255, 255, 0.92),
        0 12px 24px rgba(32, 30, 26, 0.12) !important;
}

.um-message-header,
.um-message-header a,
.um-message-header span,
.um-message-header strong {
    color: #20201d !important;
    font-size: 22px !important;
    font-weight: 650 !important;
    line-height: 1.12 !important;
    text-decoration: none !important;
}

.um-message-header .um-message-hide,
.um-message-header .um-message-block,
.um-message-header .um-message-close,
.um-message-header .um-message-cancel,
.um-message-header a[class*="close"],
.um-message-header a[class*="block"] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px !important;
    height: 38px !important;
    border-radius: 999px !important;
    color: rgba(32, 30, 26, 0.44) !important;
    transition: background-color 160ms ease, color 160ms ease, transform 160ms ease !important;
}

.um-message-header .um-message-hide:hover,
.um-message-header .um-message-block:hover,
.um-message-header .um-message-close:hover,
.um-message-header .um-message-cancel:hover,
.um-message-header a[class*="close"]:hover,
.um-message-header a[class*="block"]:hover {
    background: rgba(169, 130, 77, 0.12) !important;
    color: rgba(32, 30, 26, 0.82) !important;
    transform: translateY(-1px) !important;
}

.um-message-body,
.um-message-modal .um-message-body,
.um-popup .um-message-body,
.um-message-popup .um-message-body {
    min-height: 220px !important;
    max-height: min(52vh, 520px) !important;
    padding: 18px 22px !important;
    background: #fffdf8 !important;
    color: rgba(32, 30, 26, 0.78) !important;
    overflow: auto !important;
}

.um-message-footer,
.um-message-modal .um-message-footer,
.um-popup .um-message-footer,
.um-message-popup .um-message-footer {
    padding: 16px 20px 18px !important;
    border-top: 1px solid rgba(32, 30, 26, 0.08) !important;
    background:
        linear-gradient(180deg, rgba(248, 246, 241, 0.9), rgba(255, 253, 248, 0.98)) !important;
}

.um-message-textarea,
.um-message-textarea textarea,
.um-message-modal textarea,
.um-popup textarea,
.um-message-popup textarea,
textarea.um-message-textarea {
    width: 100% !important;
    min-height: 116px !important;
    max-height: 190px !important;
    padding: 16px 17px !important;
    border: 1px solid rgba(32, 30, 26, 0.12) !important;
    border-radius: 18px !important;
    background: rgba(255, 255, 255, 0.92) !important;
    color: #20201d !important;
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.82),
        0 10px 26px rgba(32, 30, 26, 0.04) !important;
    font: inherit !important;
    font-size: 17px !important;
    line-height: 1.45 !important;
    outline: none !important;
    resize: vertical !important;
}

.um-message-textarea:focus,
.um-message-textarea textarea:focus,
.um-message-modal textarea:focus,
.um-popup textarea:focus,
.um-message-popup textarea:focus,
textarea.um-message-textarea:focus {
    border-color: rgba(169, 130, 77, 0.62) !important;
    box-shadow:
        0 0 0 3px rgba(169, 130, 77, 0.12),
        inset 0 1px 0 rgba(255, 255, 255, 0.82) !important;
}

.um-message-send,
.um-message-footer .um-button,
.um-message-footer input[type="submit"],
.um-message-footer button[type="submit"],
.um-message-modal .um-button,
.um-popup .um-button,
.um-message-popup .um-button {
    min-height: 44px !important;
    padding: 11px 22px !important;
    border: 0 !important;
    border-radius: 14px !important;
    background: #a9824d !important;
    color: #ffffff !important;
    box-shadow: 0 12px 26px rgba(169, 130, 77, 0.22) !important;
    font: inherit !important;
    font-size: 15px !important;
    font-weight: 780 !important;
    letter-spacing: 0.01em !important;
    text-decoration: none !important;
    transition: transform 160ms ease, box-shadow 160ms ease, background-color 160ms ease !important;
}

.um-message-send:hover,
.um-message-footer .um-button:hover,
.um-message-footer input[type="submit"]:hover,
.um-message-footer button[type="submit"]:hover,
.um-message-modal .um-button:hover,
.um-popup .um-button:hover,
.um-message-popup .um-button:hover {
    background: #927040 !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 16px 34px rgba(169, 130, 77, 0.28) !important;
}

.um-message-footer .um-message-limit,
.um-message-footer .um-message-char,
.um-message-footer span[class*="limit"],
.um-message-footer span[class*="char"] {
    color: rgba(32, 30, 26, 0.42) !important;
    font-size: 14px !important;
    font-weight: 650 !important;
}

.um-message-footer .um-message-emolist,
.um-message-footer .um-message-emoji,
.um-message-footer a[class*="emoji"] {
    color: rgba(32, 30, 26, 0.42) !important;
    transition: color 160ms ease, transform 160ms ease !important;
}

.um-message-footer .um-message-emolist:hover,
.um-message-footer .um-message-emoji:hover,
.um-message-footer a[class*="emoji"]:hover {
    color: #a9824d !important;
    transform: translateY(-1px) !important;
}

@media (max-width: 720px) {
    .um-message-modal,
    .um-popup,
    .um-message-popup {
        width: calc(100vw - 24px) !important;
        max-width: calc(100vw - 24px) !important;
        border-radius: 22px !important;
    }

    .um-message-header,
    .um-message-modal .um-message-header,
    .um-popup .um-message-header,
    .um-message-popup .um-message-header {
        min-height: 76px !important;
        padding: 14px 16px !important;
    }

    .um-message-body,
    .um-message-modal .um-message-body,
    .um-popup .um-message-body,
    .um-message-popup .um-message-body {
        min-height: 180px !important;
        max-height: 44vh !important;
        padding: 14px 16px !important;
    }

    .um-message-footer,
    .um-message-modal .um-message-footer,
    .um-popup .um-message-footer,
    .um-message-popup .um-message-footer {
        padding: 14px 16px 16px !important;
    }

    .um-message-textarea,
    .um-message-textarea textarea,
    .um-message-modal textarea,
    .um-popup textarea,
    .um-message-popup textarea,
    textarea.um-message-textarea {
        min-height: 102px !important;
        font-size: 16px !important;
    }
}

/* Force rounded inner UM message layers. */
.um-message-modal,
.um-popup,
.um-message-popup,
.um-message-modal > div,
.um-popup > div,
.um-message-popup > div,
.um-message-modal .um-message-conv,
.um-popup .um-message-conv,
.um-message-popup .um-message-conv,
.um-message-modal .um-message-wrapper,
.um-popup .um-message-wrapper,
.um-message-popup .um-message-wrapper {
    border-radius: 24px !important;
    overflow: hidden !important;
}

.um-message-modal .um-message-header,
.um-popup .um-message-header,
.um-message-popup .um-message-header {
    border-radius: 24px 24px 0 0 !important;
    overflow: hidden !important;
}

.um-message-modal .um-message-footer,
.um-popup .um-message-footer,
.um-message-popup .um-message-footer {
    border-radius: 0 0 24px 24px !important;
    overflow: hidden !important;
}

.um-message-modal .um-message-body,
.um-popup .um-message-body,
.um-message-popup .um-message-body {
    border-radius: 0 !important;
}

/* Clip the real UM modal shell too; otherwise the composer can leave corner artifacts. */
.um-modal:has(.um-message-footer),
.um-modal:has(.um-message-textarea),
.um-modal:has(.um-message-send),
.um-message-modal,
.um-popup,
.um-message-popup {
    border-radius: 24px !important;
    -webkit-clip-path: inset(0 round 24px) !important;
    clip-path: inset(0 round 24px) !important;
    overflow: hidden !important;
    isolation: isolate !important;
}

.um-modal:has(.um-message-footer) > *,
.um-modal:has(.um-message-textarea) > *,
.um-modal:has(.um-message-send) > * {
    border-radius: 0 !important;
    overflow: hidden !important;
}

.um-modal:has(.um-message-footer) .um-message-footer,
.um-modal:has(.um-message-textarea) .um-message-footer,
.um-modal:has(.um-message-send) .um-message-footer,
.um-message-modal .um-message-footer,
.um-popup .um-message-footer,
.um-message-popup .um-message-footer,
.um-message-modal [class*="footer"],
.um-popup [class*="footer"],
.um-message-popup [class*="footer"],
.um-message-modal [class*="compose"],
.um-popup [class*="compose"],
.um-message-popup [class*="compose"],
.um-message-modal [class*="reply"],
.um-popup [class*="reply"],
.um-message-popup [class*="reply"] {
    border-radius: 0 0 24px 24px !important;
    overflow: hidden !important;
}

.um-modal:has(.um-message-footer) .um-message-footer > *,
.um-modal:has(.um-message-textarea) .um-message-footer > *,
.um-modal:has(.um-message-send) .um-message-footer > *,
.um-message-modal [class*="footer"] > *,
.um-popup [class*="footer"] > *,
.um-message-popup [class*="footer"] > *,
.um-message-modal [class*="compose"] > *,
.um-popup [class*="compose"] > *,
.um-message-popup [class*="compose"] > *,
.um-message-modal [class*="reply"] > *,
.um-popup [class*="reply"] > *,
.um-message-popup [class*="reply"] > * {
    border-radius: 0 !important;
}
