/* Summer PW · community, account and private correspondence. */
html#XF[data-app="public"] {
    --cm-panel: #f3e9d6;
    --cm-field: #fff8e9;
    --cm-band: #e7d9bd;
    --cm-edge: #b9a680;
    --cm-ink: #433521;
    --cm-muted: #65543d;
    --cm-link: #69451d;
    --cm-mark: #816128;
    --cm-selected: #eadcbf;
    --cm-button: #e7d6b6;
    --cm-button-hover: #f3e5c9;
    --cm-primary: var(--sw-submit-bg, #d0bea0);
    --cm-primary-hover: var(--sw-submit-hover, #dcccad);
    --cm-primary-ink: var(--sw-submit-ink, #433421);
    --cm-profile-wash: rgba(244, 232, 204, .91);
    --cm-shadow: 0 4px 13px rgba(68, 48, 21, .12);
}
html#XF[data-app="public"][data-summer-theme="twilight"] {
    --cm-panel: #263946;
    --cm-field: #20313c;
    --cm-band: #304652;
    --cm-edge: #5e7380;
    --cm-ink: #edece2;
    --cm-muted: #bfcbd0;
    --cm-link: #ead6af;
    --cm-mark: #d8bd87;
    --cm-selected: #374d58;
    --cm-button: #344a57;
    --cm-button-hover: #405864;
    --cm-primary: var(--sw-submit-bg, #3b5260);
    --cm-primary-hover: var(--sw-submit-hover, #465f6d);
    --cm-primary-ink: var(--sw-submit-ink, #eff1e8);
    --cm-profile-wash: rgba(32, 50, 64, .92);
    --cm-shadow: 0 4px 13px rgba(7, 15, 23, .25);
}

/* The tooltip is inserted outside .p-body on any public forum route. */
html#XF[data-app="public"] .tooltip.tooltip--member {
    --mc-bg: var(--cm-panel);
    --mc-top: var(--cm-band);
    --mc-edge: var(--cm-edge);
    --mc-ink: var(--cm-ink);
    --mc-muted: var(--cm-muted);
    --mc-link: var(--cm-link);
    --mc-btn: var(--cm-button);
    --mc-hover: var(--cm-button-hover);
}
html#XF[data-app="public"] .tooltip--member .tooltip-content {
    border: 1px solid var(--cm-edge);
    border-radius: 14px;
    box-shadow: var(--cm-shadow);
    max-width: calc(100vw - 16px);
}
html#XF[data-app="public"] .tooltip--member .memberTooltip-header { border-radius: 13px 13px 0 0; }
html#XF[data-app="public"] .memberTooltip:not(.memberTooltip--withBanner) .memberTooltip-header {
    background: linear-gradient(95deg, var(--cm-panel) 8%, var(--cm-profile-wash) 77%, transparent), var(--sw-scenery) center / cover, var(--cm-band);
}
html#XF[data-app="public"] .memberTooltip-headerInfo { min-width: 0; }
html#XF[data-app="public"] .memberTooltip-actions .button { border-radius: 7px; white-space: normal; }

html#XF[data-app="public"]:is([data-template^="member_"], [data-template^="account_"], [data-template^="conversation_"]) .p-body {
    & .p-body-pageContent, & .p-body-sideNav, & .memberHeader-content, & .contentRow-main { min-width: 0; }
    & .p-title-value { color: var(--cm-link); font-family: Georgia, "Times New Roman", serif; overflow-wrap: anywhere; }
    & :is(.p-body-pageContent, .p-body-sideNav) .block-container {
        color: var(--cm-ink);
        background-color: var(--cm-panel);
        border: 1px solid var(--cm-edge);
        border-radius: 13px;
        box-shadow: var(--cm-shadow);
    }
    & :is(.p-body-pageContent, .p-body-sideNav) .block-container > :first-child { border-start-start-radius: 12px; border-start-end-radius: 12px; }
    & :is(.p-body-pageContent, .p-body-sideNav) .block-container > :last-child { border-end-start-radius: 12px; border-end-end-radius: 12px; }
    & :is(.block-header, .block-minorHeader, .block-formSectionHeader, .block-tabHeader) {
        background: var(--cm-band);
        color: var(--cm-link);
        border-color: var(--cm-edge);
    }
    & :is(.block-header, .block-minorHeader, .block-formSectionHeader) { font-family: Georgia, "Times New Roman", serif; font-weight: 600; }
    & :is(.blockLink, .tabs-tab, .filterBar-menuTrigger, .actionBar-action) { color: var(--cm-link); }
    & .blockLink { border-color: transparent; }
    & :is(.blockLink, .tabs-tab):is(:hover, :focus-visible, .is-selected, .is-active) {
        color: var(--cm-ink); background: var(--cm-selected); border-color: var(--cm-mark);
    }
    & :is(.p-description, .contentRow-minor, .formRow-explain, .formRow-hint, .pairs > dt, .structItem-minor, .structItem-minor a, .message-attribution, .block-desc) { color: var(--cm-muted); }
    & :is(.block-footer, .block-filterBar, .formSubmitRow-bar) { color: var(--cm-ink); background: var(--cm-band); border-color: var(--cm-edge); }
    & .formSubmitRow-bar { opacity: 1; }
    & .formSubmitRow:not(.is-sticky) .formSubmitRow-bar { border-end-start-radius: 12px; border-end-end-radius: 12px; }
    & .block-body > .block-row--separated, & .formRowSep, & .block-separator { border-color: var(--cm-edge); }
    & .formRow > dt { color: var(--cm-ink); background-color: var(--cm-band); border-color: var(--cm-edge); }
    & .formRow > dd { min-width: 0; }
    & :is(.input, .token-inputWrapper, .inputGroup-text, .inputChoices-choice .input) {
        color: var(--cm-ink); background-color: var(--cm-field); border-color: var(--cm-edge);
    }
    & :is(.input, .fr-element)::placeholder { color: var(--cm-muted); opacity: 1; }
    & .input:disabled { color: var(--cm-muted); background-color: var(--cm-band); }
    & .iconic > i { color: var(--cm-link); }
    & .button:not(.button--disabled, :disabled) {
        color: var(--cm-link); background: var(--cm-button); border-color: var(--cm-edge); text-shadow: none; border-radius: 7px;
    }
    & .button:not(.button--disabled, :disabled):is(:hover, :focus-visible) { background: var(--cm-button-hover); color: var(--cm-ink); }
    & .button:is(.button--cta, .button--primary, [type="submit"]):not(:disabled, .button--disabled) {
        background: var(--cm-primary); color: var(--cm-primary-ink); border-color: var(--cm-edge);
    }
    & .button:is(.button--cta, .button--primary, [type="submit"]):not(:disabled, .button--disabled):is(:hover, :focus-visible) { background: var(--cm-primary-hover); }
    & :is(.input, a, .button, .fr-command, [contenteditable="true"]):focus-visible { outline: 2px solid var(--cm-mark); outline-offset: 2px; }
    & .fr-box { border-color: var(--cm-edge); }
    & :is(.fr-toolbar, .fr-more-toolbar, .fr-second-toolbar) { color: var(--cm-ink); background: var(--cm-band); border-color: var(--cm-edge); }
    & :is(.fr-wrapper, textarea.directWrite) { color: var(--cm-ink); background: var(--cm-field); border-color: var(--cm-edge); }
    & .fr-element { color: var(--cm-ink); }
    & .fr-box.fr-basic .fr-wrapper .fr-element { color: var(--cm-ink); background-color: var(--cm-field); }
    & .fr-wrapper .fr-placeholder { color: var(--cm-muted); }
    & .fr-toolbar .fr-command.fr-btn { color: var(--cm-ink); }
    & .fr-toolbar .fr-command.fr-btn svg path { fill: currentColor; }
    & .fr-toolbar .fr-command.fr-btn:is(:hover, .fr-active) { background: var(--cm-selected); color: var(--cm-link); }
}

html#XF[data-app="public"][data-template="member_view"] .p-body .memberHeader:not(.memberHeader--withBanner) .memberHeader-main {
    color: var(--cm-ink);
    background: linear-gradient(93deg, var(--cm-panel) 3%, var(--cm-profile-wash) 56%, transparent), var(--sw-scenery) center / cover, var(--cm-band);
}
html#XF[data-app="public"][data-template="member_view"] .p-body .memberHeader-main { border-radius: 12px 12px 0 0; }
html#XF[data-app="public"][data-template="member_view"] .p-body .memberHeader:not(.memberHeader--withBanner) .memberHeader-blurb { color: var(--cm-ink); }
html#XF[data-app="public"][data-template="member_view"] .p-body .memberHeader--withBanner .memberHeader-blurbContainer {
    background-color: var(--cm-panel); color: var(--cm-ink); border-radius: 6px; padding: 2px 7px;
}
html#XF[data-app="public"][data-template="member_view"] .p-body .memberHeader--withBanner .memberHeader-blurbContainer :is(.memberHeader-blurb, dt, dd, time, a) { color: var(--cm-ink); text-shadow: none; }
html#XF[data-app="public"][data-template="member_view"] .p-body .memberHeader-separator { border-color: var(--cm-edge); }
html#XF[data-app="public"][data-template="member_view"] .p-body .memberHeader-stats dd { color: var(--cm-ink); font-variant-numeric: tabular-nums; }
html#XF[data-app="public"][data-template="member_view"] .p-body .memberHeader-banners { max-width: 100%; }
html#XF[data-app="public"][data-template="member_view"] .js-memberTabPanes :is(.message, .message-cell--main, .comment) {
    background-color: var(--cm-panel); color: var(--cm-ink); border-color: var(--cm-edge);
}
html#XF[data-app="public"][data-template="member_view"] .js-memberTabPanes :is(.message-cell--user, .commentList) {
    background-color: var(--cm-band); color: var(--cm-ink); border-color: var(--cm-edge);
}

html#XF[data-app="public"][data-template="member_notable"] .p-body .memberOverviewBlock {
    color: var(--cm-ink); background: var(--cm-field); border: 1px solid var(--cm-edge); border-radius: 11px;
}
html#XF[data-app="public"][data-template="member_notable"] .p-body .memberOverviewBlock .block-textHeader {
    padding-bottom: 8px; color: var(--cm-link); font: 600 1.1rem/1.3 Georgia, serif; border-color: var(--cm-edge);
}
html#XF[data-app="public"][data-template="member_notable"] .p-body .memberOverviewBlock-seeMore { background: var(--cm-band); color: var(--cm-link); border-color: var(--cm-edge); border-radius: 0 0 10px 10px; }
html#XF[data-app="public"][data-template="member_notable"] .p-body .memberOverviewBlock .contentRow-extra { color: var(--cm-muted); font-variant-numeric: tabular-nums; }

html#XF[data-app="public"]:is([data-template^="member_"], [data-template^="account_"], [data-template^="conversation_"]) .overlay {
    & .overlay-title { background-color: var(--cm-band); color: var(--cm-link); border-color: var(--cm-edge); }
    & .overlay-content, & .block-container { background-color: var(--cm-panel); color: var(--cm-ink); border-color: var(--cm-edge); }
    & .input { background-color: var(--cm-field); color: var(--cm-ink); border-color: var(--cm-edge); }
    & .formSubmitRow-bar { background-color: var(--cm-band); border-color: var(--cm-edge); }
    & .button:not(:disabled, .button--disabled) { background: var(--cm-button); color: var(--cm-link); border-color: var(--cm-edge); text-shadow: none; }
    & .button[type="submit"]:not(:disabled) { background: var(--cm-primary); color: var(--cm-primary-ink); }
    & .button[type="submit"]:not(:disabled):hover { background: var(--cm-primary-hover); }
    & :is(.button, .input, a):focus-visible { outline: 2px solid var(--cm-mark); outline-offset: 2px; }
}

html#XF[data-template^="conversation_"] .p-body {
    & .structItem--conversation, & .message--conversationMessage, & .message--quickReply { color: var(--cm-ink); background: var(--cm-panel); border-color: var(--cm-edge); }
    & .structItem--conversation.is-unread { background: var(--cm-field); }
    & .structItem-title a:not(.username) { color: var(--cm-link); }
    & .structItem-cell, & .message-attribution { border-color: var(--cm-edge); }
    & .structItem-cell--main, & .structItem-title, & .message-body { overflow-wrap: anywhere; }
    & :is(.message--conversationMessage, .message--quickReply) .message-cell--user {
        color: var(--cm-ink); background: var(--cm-band); border-color: var(--cm-edge);
    }
    & .message--conversationMessage .message-cell--main, & .message--quickReply .message-cell--main { min-width: 0; background: var(--cm-panel); }
    & .message-userArrow { color: var(--cm-edge); }
    & .message-actionBar .actionBar-action { border-radius: 5px; }
    & .message-actionBar .actionBar-action:is(:hover, :focus-visible) { background: var(--cm-selected); }
    & .block--messages .buttonGroup { flex-wrap: wrap; gap: 3px; }
}

@media (max-width: 650px) {
    html#XF[data-app="public"]:is([data-template^="member_"], [data-template^="account_"], [data-template^="conversation_"]) .p-body {
        & .p-body-pageContent .block-container { margin-inline: 0; }
        & .formRow > dt { background: transparent; border-inline-end: 0; }
        & .inputGroup, & .inputGroup > .input { min-width: 0; }
        & .p-title-pageAction .button, & .memberHeader-actionTop .button { white-space: normal; }
        & .fr-toolbar .fr-command.fr-btn { margin-inline: 1px; }
    }
    html#XF[data-app="public"][data-template="member_view"] .p-body .memberHeader-name { overflow-wrap: anywhere; }
    html#XF[data-app="public"][data-template="member_view"] .p-body .memberHeader-actionTop .buttonGroup { flex-wrap: wrap; gap: 3px; }
    html#XF[data-app="public"][data-template="member_notable"] .p-body .memberOverviewBlock { max-width: 100%; min-width: 0; }
    html#XF[data-template^="conversation_"] .block-outer .buttonGroup .button { white-space: normal; }
}