/* TASK 511: authoritative Slate & Mint layer, loaded after the legacy stylesheet. */ html[data-theme="slate-mint"] { color-scheme: light; --sm-bg: #e8eff0; --sm-surface: #fbfdfd; --sm-surface-raised: #f1f6f6; --sm-ink: #193a40; --sm-muted: #58767b; --sm-line: #bdd0d2; --sm-line-strong: #94b0b3; --sm-mint: #16846d; --sm-mint-dark: #106653; --sm-mint-soft: #d9f1e6; --sm-shadow: 0 10px 28px rgba(34, 67, 72, .12); background: var(--sm-bg) !important; color: var(--sm-ink) !important; } html[data-theme="slate-mint"] body, html[data-theme="slate-mint"] #app { background: linear-gradient(135deg, #edf3f4, #dce7e9) !important; color: var(--sm-ink) !important; } html[data-theme="slate-mint"] #sidebar, html[data-theme="slate-mint"] aside { background: linear-gradient(180deg, #fbfdfd, #edf3f4) !important; color: var(--sm-ink) !important; border-color: var(--sm-line) !important; } html[data-theme="slate-mint"] #sidebar > footer { color: var(--sm-muted) !important; background: #e5edef !important; border-color: var(--sm-line) !important; } html[data-theme="slate-mint"] #sidebar > footer a { color: var(--sm-mint-dark) !important; } html[data-theme="slate-mint"] .chat, html[data-theme="slate-mint"] .profile, html[data-theme="slate-mint"] .chat-header { color: var(--sm-ink) !important; background: linear-gradient(180deg, #fff, #eff5f5) !important; border-color: var(--sm-line) !important; } html[data-theme="slate-mint"] .profile strong, html[data-theme="slate-mint"] .header-info strong, html[data-theme="slate-mint"] .chat-header strong, html[data-theme="slate-mint"] #users .user strong, html[data-theme="slate-mint"] #users .group-row strong { color: var(--sm-ink) !important; } html[data-theme="slate-mint"] .profile small, html[data-theme="slate-mint"] .header-info small, html[data-theme="slate-mint"] .chat-header small, html[data-theme="slate-mint"] #users .user small, html[data-theme="slate-mint"] #users .group-row small, html[data-theme="slate-mint"] .section-title { color: var(--sm-muted) !important; } html[data-theme="slate-mint"] .search-wrap, html[data-theme="slate-mint"] .group-search, html[data-theme="slate-mint"] .sidebar-tabs, html[data-theme="slate-mint"] .sidebar-search-toolbar { background: #edf3f4 !important; border-color: var(--sm-line) !important; color: var(--sm-ink) !important; } html[data-theme="slate-mint"] #users .user, html[data-theme="slate-mint"] #users .group-row, html[data-theme="slate-mint"] .assistant-entry { background: #fff !important; color: var(--sm-ink) !important; border: 1px solid var(--sm-line) !important; box-shadow: 0 3px 12px rgba(31,66,75,.07) !important; } html[data-theme="slate-mint"] #users .user:hover, html[data-theme="slate-mint"] #users .group-row:hover, html[data-theme="slate-mint"] .assistant-entry:hover { background: #e6f5ee !important; border-color: #74bea8 !important; } html[data-theme="slate-mint"] #sidebar button, html[data-theme="slate-mint"] .chat-header button, html[data-theme="slate-mint"] #chatSearchBar button { color: #315e62 !important; background: linear-gradient(145deg, #fff, #e8f0f1) !important; border: 1px solid var(--sm-line-strong) !important; box-shadow: 0 3px 9px rgba(31,66,75,.1) !important; } html[data-theme="slate-mint"] #sidebar button:hover:not(:disabled), html[data-theme="slate-mint"] .chat-header button:hover:not(:disabled), html[data-theme="slate-mint"] #chatSearchBar button:hover:not(:disabled) { color: #125b4b !important; background: var(--sm-mint-soft) !important; border-color: #65b79c !important; } html[data-theme="slate-mint"] button:disabled { opacity: .58; } html[data-theme="slate-mint"] button svg, html[data-theme="slate-mint"] button .app-button-svg { color: currentColor !important; stroke: currentColor !important; } html[data-theme="slate-mint"] button svg [fill]:not([fill="none"]), html[data-theme="slate-mint"] button .app-button-svg [fill]:not([fill="none"]) { fill: currentColor !important; } html[data-theme="slate-mint"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]), html[data-theme="slate-mint"] textarea, html[data-theme="slate-mint"] select { color: var(--sm-ink) !important; background: #fff !important; border-color: var(--sm-line) !important; } html[data-theme="slate-mint"] input::placeholder, html[data-theme="slate-mint"] textarea::placeholder { color: #789095 !important; opacity: 1 !important; } html[data-theme="slate-mint"] input:focus, html[data-theme="slate-mint"] textarea:focus, html[data-theme="slate-mint"] select:focus { border-color: #48a98d !important; box-shadow: 0 0 0 3px rgba(54,164,130,.14) !important; } html[data-theme="slate-mint"] #messages { background-color: #dbe6e8 !important; } html[data-theme="slate-mint"] #messages .message:not(.mine) { color: #17383f !important; background: linear-gradient(145deg,#fff,#f0f6f6) !important; border: 1px solid #bfd3d6 !important; box-shadow: 0 7px 18px rgba(31,66,75,.11) !important; } html[data-theme="slate-mint"] #messages .message.mine { color: #123f35 !important; background: linear-gradient(145deg,#d9f4e8,#bfe8d8) !important; border: 1px solid #6fbba2 !important; box-shadow: 0 8px 20px rgba(29,126,101,.16) !important; } html[data-theme="slate-mint"] #messages .message .message-body, html[data-theme="slate-mint"] #messages .message .message-text, html[data-theme="slate-mint"] #messages .message .message-text *, html[data-theme="slate-mint"] #messages .message .message-body > a:not(.image-attachment):not(.video-attachment) { color: inherit !important; -webkit-text-fill-color: currentColor !important; text-shadow: none !important; } html[data-theme="slate-mint"] #messages .message .message-meta, html[data-theme="slate-mint"] #messages .message .message-footer, html[data-theme="slate-mint"] #messages .message time { color: #58767b !important; -webkit-text-fill-color: currentColor !important; } html[data-theme="slate-mint"] #messages .message.mine .message-meta, html[data-theme="slate-mint"] #messages .message.mine .message-footer, html[data-theme="slate-mint"] #messages .message.mine time { color: #3e7565 !important; } html[data-theme="slate-mint"] #messages .message .message-link { color: #087763 !important; } html[data-theme="slate-mint"] #messages .reply-quote, html[data-theme="slate-mint"] #messages .forwarded-label { color: #315e55 !important; background: #e5f3ef !important; border-color: #afd2c8 !important; } html[data-theme="slate-mint"] #sendForm.composer { background: rgba(238,245,246,.97) !important; border: 1px solid var(--sm-line) !important; box-shadow: 0 12px 28px rgba(31,66,75,.15) !important; } html[data-theme="slate-mint"] #sendForm.composer .attach, html[data-theme="slate-mint"] #sendForm.composer .emoji-button, html[data-theme="slate-mint"] #sendForm.composer .record-audio { color: #315e62 !important; background: linear-gradient(145deg,#fff,#e5edef) !important; border: 1px solid var(--sm-line-strong) !important; } html[data-theme="slate-mint"] #sendForm.composer .send, html[data-theme="slate-mint"] .primary { color: #fff !important; background: linear-gradient(145deg,#2ca887,#147761) !important; border-color: #59c3a5 !important; } /* Links/files are nested inside .message-body, not direct message children. */ html[data-theme="slate-mint"] #messages .message .message-body > a:not(.image-attachment):not(.video-attachment), html[data-theme="slate-mint"] #messages .attachment-collection-file, html[data-theme="slate-mint"] #messages .video-attachment-name { display: inline-flex; align-items: center; justify-content: center; min-height: 42px; padding: 8px 12px; color: #23454b !important; background: #e1efef !important; border: 1px solid #a8c5c9 !important; border-radius: 12px; text-decoration-color: #6a9995 !important; -webkit-text-fill-color: #23454b !important; } html[data-theme="slate-mint"] #messages .attachment-collection { background: #f4f8f8 !important; border: 1px solid #c4d6d8 !important; border-radius: 14px; } html[data-theme="slate-mint"] #messages .link-preview-card, html[data-theme="slate-mint"] #messages .audio-message-card, html[data-theme="slate-mint"] #messages .video-attachment, html[data-theme="slate-mint"] #messages .image-attachment { color: #23454b !important; background: linear-gradient(145deg,#fbfdfd,#e8f0f1) !important; border-color: #b7cdd0 !important; } html[data-theme="slate-mint"] .profile-files { color: var(--sm-ink) !important; background: #edf4f5 !important; border-color: var(--sm-line) !important; } html[data-theme="slate-mint"] .profile-file-card { color: #23454b !important; background: #fff !important; border-color: #bfd3d6 !important; } html[data-theme="slate-mint"] .profile-file-card * { color: inherit !important; -webkit-text-fill-color: currentColor !important; } html[data-theme="slate-mint"] .background-upload-message { color: #173f36 !important; background: linear-gradient(145deg,#e3f4ec,#ccebdd) !important; border-color: #6fbba2 !important; } html[data-theme="slate-mint"] :is(.account-modal,.profile-modal,.crop-modal,.forward-modal,.file-modal,.video-modal,.call-modal,.upload-confirm-modal,.decision-modal,.group-create-modal,.group-manage-modal,.folder-editor-modal,.chat-actions-modal,.row-actions-modal) { background: rgba(31,51,55,.38) !important; backdrop-filter: blur(14px) !important; } html[data-theme="slate-mint"] :is(.account-panel,.profile-card,.crop-card,.forward-panel,.file-panel,.file-viewer-panel,.upload-confirm-panel,.decision-panel,.group-create-panel,.group-manage-panel,.folder-editor-panel,.chat-actions-panel,.row-actions-panel,.group-panel,.ephemeral-panel,.delete-confirm-panel) { color: var(--sm-ink) !important; background: linear-gradient(155deg,#fff,#eaf1f2) !important; border: 1px solid var(--sm-line-strong) !important; box-shadow: 0 24px 64px rgba(27,55,62,.24) !important; } html[data-theme="slate-mint"] :is(.account-panel,.profile-card,.crop-card,.forward-panel,.file-panel,.file-viewer-panel,.upload-confirm-panel,.decision-panel,.group-create-panel,.group-manage-panel,.folder-editor-panel,.chat-actions-panel,.row-actions-panel,.group-panel,.ephemeral-panel,.delete-confirm-panel) :is(h1,h2,h3,h4,label,strong,p,small,span,li) { color: var(--sm-ink) !important; } html[data-theme="slate-mint"] :is(.account-header,.crop-header,.folder-editor-header,.chat-actions-modal-header,.row-actions-header) { color: var(--sm-ink) !important; background: linear-gradient(125deg,#e4f0ee,#d7e7e9) !important; border-color: var(--sm-line) !important; } html[data-theme="slate-mint"] :is(.account-panel,.profile-card,.crop-card,.forward-panel,.file-panel,.file-viewer-panel,.upload-confirm-panel,.decision-panel,.group-create-panel,.group-manage-panel,.folder-editor-panel,.chat-actions-panel,.row-actions-panel,.group-panel,.ephemeral-panel,.delete-confirm-panel) :is(input,textarea,select) { color: var(--sm-ink) !important; background: #fff !important; border-color: var(--sm-line) !important; } html[data-theme="slate-mint"] :is(.account-panel,.profile-card,.crop-card,.forward-panel,.file-panel,.file-viewer-panel,.upload-confirm-panel,.decision-panel,.group-create-panel,.group-manage-panel,.folder-editor-panel,.chat-actions-panel,.row-actions-panel,.group-panel,.ephemeral-panel,.delete-confirm-panel) :is(.secondary,.close-btn,.modal-close) { color: #315e62 !important; background: #f3f8f8 !important; border: 1px solid var(--sm-line-strong) !important; } html[data-theme="slate-mint"] :is(.account-panel,.profile-card,.crop-card,.forward-panel,.file-panel,.file-viewer-panel,.upload-confirm-panel,.decision-panel,.group-create-panel,.group-manage-panel,.folder-editor-panel,.chat-actions-panel,.row-actions-panel,.group-panel,.ephemeral-panel,.delete-confirm-panel) svg { color: currentColor !important; stroke: currentColor !important; } html[data-theme="slate-mint"] :is(.account-panel,.profile-card,.crop-card,.forward-panel,.file-panel,.file-viewer-panel,.upload-confirm-panel,.decision-panel,.group-create-panel,.group-manage-panel,.folder-editor-panel,.chat-actions-panel,.row-actions-panel,.group-panel,.ephemeral-panel,.delete-confirm-panel) button:not(.primary):not(.danger-action) { color: #315e62 !important; background: #f3f8f8 !important; border-color: var(--sm-line-strong) !important; } html[data-theme="slate-mint"] :is(.account-panel,.profile-card,.crop-card,.forward-panel,.file-panel,.file-viewer-panel,.upload-confirm-panel,.decision-panel,.group-create-panel,.group-manage-panel,.folder-editor-panel,.chat-actions-panel,.row-actions-panel,.group-panel,.ephemeral-panel,.delete-confirm-panel) button:not(.primary):not(.danger-action):hover { color: #125b4b !important; background: var(--sm-mint-soft) !important; border-color: #65b79c !important; } html[data-theme="slate-mint"] .account-tabs, html[data-theme="slate-mint"] .account-tab-panel, html[data-theme="slate-mint"] .account-theme-section, html[data-theme="slate-mint"] .account-security-section, html[data-theme="slate-mint"] .account-blocked-section, html[data-theme="slate-mint"] .account-retention-section, html[data-theme="slate-mint"] .profile-files, html[data-theme="slate-mint"] .folder-assignment-list, html[data-theme="slate-mint"] .file-list { color: var(--sm-ink) !important; background: #f1f6f6 !important; border-color: var(--sm-line) !important; } html[data-theme="slate-mint"] .account-tab { color: var(--sm-muted) !important; background: transparent !important; } html[data-theme="slate-mint"] .account-tab.active { color: #155d4d !important; background: #d9f1e6 !important; border-color: #74bea8 !important; } html[data-theme="slate-mint"] .account-panel :is(.account-header,.account-actions), html[data-theme="slate-mint"] .file-panel :is(header,footer), html[data-theme="slate-mint"] .upload-confirm-panel :is(header,footer) { color: var(--sm-ink) !important; background: #eaf2f3 !important; border-color: var(--sm-line) !important; } html[data-theme="slate-mint"] .auth-card, html[data-theme="slate-mint"] .auth-panel, html[data-theme="slate-mint"] .public-channel-card, html[data-theme="slate-mint"] .landing-header, html[data-theme="slate-mint"] .landing-hero { color: var(--sm-ink) !important; background: linear-gradient(145deg,#fff,#eaf2f3) !important; border-color: var(--sm-line) !important; } html[data-theme="slate-mint"] .auth-showcase { color: #eaf8f3 !important; background: linear-gradient(145deg,#315f62,#23474d) !important; } html[data-theme="slate-mint"] .auth-showcase :is(h1,h2,h3,p,strong,small,span) { color: inherit !important; } html[data-theme="slate-mint"] .landing-register, html[data-theme="slate-mint"] .landing-hero-register { color: #fff !important; background: linear-gradient(145deg,#2ca887,#147761) !important; border-color: #59c3a5 !important; } html[data-theme="slate-mint"] :is(.calendar-panel,.calendar-card,.calendar-events,.calendar-day,.calendar-occasion,.market-card,.market-price-card,.system-app-card) { color: var(--sm-ink) !important; background: #fbfdfd !important; border-color: var(--sm-line) !important; } html[data-theme="slate-mint"] :is(.calendar-day.today,.calendar-days .calendar-day.today) { color: #fff9e6 !important; background: linear-gradient(145deg,#d5a83a,#9b701b) !important; border-color: #ffe49b !important; } html[data-theme="slate-mint"] :is(.toast,.app-loading-card) { color: var(--sm-ink) !important; background: #fbfdfd !important; border-color: var(--sm-line) !important; } /* The legacy .messages rule sets a dark !important gradient. Set the full shorthand at ID specificity for the no-wallpaper case; preserve a user's inline background image when one is selected. */ html[data-theme="slate-mint"] #messages.messages:not(.has-user-background) { background: radial-gradient(ellipse at 15% 0%, rgba(133,207,186,.25), transparent 48%), linear-gradient(145deg,#e5edef,#dce7e9) !important; background-color: #e2ebed !important; background-blend-mode: normal !important; } html[data-theme="slate-mint"] #messages.messages.has-user-background { background-blend-mode: normal !important; } /* Folder/group editors use stronger ID-based legacy selectors, so match that specificity and skin their inner forms and management actions explicitly. */ html[data-theme="slate-mint"] #folderEditorModal .folder-editor-panel, html[data-theme="slate-mint"] #folderEditorModal .account-panel.folder-editor-panel, html[data-theme="slate-mint"] #groupCreateModal .account-panel, html[data-theme="slate-mint"] #groupManageModal .account-panel { color: #193a40 !important; background: linear-gradient(155deg,#fff,#eaf1f2) !important; border: 1px solid #94b0b3 !important; box-shadow: 0 24px 64px rgba(27,55,62,.24) !important; } html[data-theme="slate-mint"] #folderEditorModal #folderEditorForm, html[data-theme="slate-mint"] #folderEditorModal .folder-editor-form, html[data-theme="slate-mint"] #groupCreateModal form, html[data-theme="slate-mint"] #groupManageModal form { color: #193a40 !important; background: #f3f8f8 !important; border-color: #bdd0d2 !important; } html[data-theme="slate-mint"] #folderEditorModal :is(.folder-editor-header,.account-header), html[data-theme="slate-mint"] #groupCreateModal .account-header, html[data-theme="slate-mint"] #groupManageModal .account-header { color: #193a40 !important; background: linear-gradient(125deg,#e4f0ee,#d7e7e9) !important; border-color: #bdd0d2 !important; } html[data-theme="slate-mint"] #folderEditorModal :is(h3,h4,p,strong,small,label), html[data-theme="slate-mint"] #groupCreateModal :is(h3,h4,p,strong,small,label), html[data-theme="slate-mint"] #groupManageModal :is(h3,h4,p,strong,small,label) { color: #294b51 !important; } html[data-theme="slate-mint"] #folderEditorModal :is(input:not([type="checkbox"]),textarea,select), html[data-theme="slate-mint"] #groupCreateModal :is(input,textarea,select), html[data-theme="slate-mint"] #groupManageModal :is(input,textarea,select) { color: #193a40 !important; background: #fff !important; border: 1px solid #bdd0d2 !important; } html[data-theme="slate-mint"] #folderEditorModal :is(.folder-assignment-heading,.folder-assignment-toolbar,.folder-editor-hint), html[data-theme="slate-mint"] #folderEditorModal #folderAssignmentList { color: #294b51 !important; background: #eaf2f2 !important; border: 1px solid #c3d5d7 !important; border-radius: 12px !important; } html[data-theme="slate-mint"] #folderEditorModal #folderAssignmentList label { color: #193a40 !important; background: #fff !important; border: 1px solid #c3d5d7 !important; border-radius: 10px !important; } html[data-theme="slate-mint"] #folderEditorModal #folderAssignmentList label:hover { background: #e5f5ed !important; border-color: #74bea8 !important; } html[data-theme="slate-mint"] #folderEditorModal #folderAssignmentList input[type="checkbox"] { accent-color: #16846d !important; } html[data-theme="slate-mint"] #folderEditorModal .folder-editor-actions, html[data-theme="slate-mint"] #folderEditorModal .account-actions, html[data-theme="slate-mint"] #groupCreateModal .account-actions, html[data-theme="slate-mint"] #groupManageModal .account-actions { background: transparent !important; border-color: #bdd0d2 !important; } html[data-theme="slate-mint"] #folderEditorModal :is(.folder-editor-actions,.account-actions) button:not(.primary), html[data-theme="slate-mint"] #groupCreateModal .account-actions button:not(.primary), html[data-theme="slate-mint"] #groupManageModal .account-actions button:not(.primary) { color: #315e62 !important; background: linear-gradient(145deg,#fff,#e8f0f1) !important; border: 1px solid #94b0b3 !important; box-shadow: 0 3px 9px rgba(31,66,75,.1) !important; } html[data-theme="slate-mint"] #folderEditorModal :is(.folder-editor-actions,.account-actions) button.primary, html[data-theme="slate-mint"] #groupCreateModal .account-actions button.primary, html[data-theme="slate-mint"] #groupManageModal .account-actions button.primary { color: #fff !important; background: linear-gradient(145deg,#2ca887,#147761) !important; border: 1px solid #59c3a5 !important; } html[data-theme="slate-mint"] #folderEditorModal button.danger-outline { color: #9b3448 !important; background: #fff1f2 !important; border-color: #e2a9b1 !important; } /* Reaction chips and their picker had inherited nearly transparent/dark defaults. Give icons and counts a stable light surface and explicit states. */ html[data-theme="slate-mint"] #messages .message-footer .message-reactions .message-reaction, html[data-theme="slate-mint"] #messages .message-footer .message-reactions-static .message-reaction, html[data-theme="slate-mint"] #messages .message-footer .reaction-display { color: #31545a !important; background: #f8fbfb !important; border: 1px solid #b9cdd0 !important; border-radius: 999px !important; box-shadow: 0 2px 6px rgba(31,66,75,.09) !important; opacity: 1 !important; -webkit-text-fill-color: currentColor !important; } html[data-theme="slate-mint"] #messages .message-footer .message-reactions .reaction-count { color: #294b51 !important; -webkit-text-fill-color: currentColor !important; } html[data-theme="slate-mint"] #messages .message-footer .message-reaction.reaction-like { color: #15735d !important; } html[data-theme="slate-mint"] #messages .message-footer .message-reaction.reaction-dislike { color: #a44d43 !important; } html[data-theme="slate-mint"] #messages .message-footer .message-reaction.reaction-heart { color: #bb3f70 !important; } html[data-theme="slate-mint"] #messages .message-footer .message-reaction.active { color: #105b49 !important; background: #d7f1e5 !important; border-color: #55ae92 !important; box-shadow: 0 0 0 2px rgba(52,157,124,.13),0 3px 8px rgba(31,96,77,.12) !important; } html[data-theme="slate-mint"] #messages .message-footer .message-reaction.reaction-heart.active { color: #a52d61 !important; background: #ffe8f0 !important; border-color: #e9a0bd !important; } html[data-theme="slate-mint"] #messages .message-footer .message-reaction svg, html[data-theme="slate-mint"] #messages .message-footer .message-reaction .app-button-svg { color: currentColor !important; stroke: currentColor !important; opacity: 1 !important; } html[data-theme="slate-mint"] #messages .message-footer .reaction-picker-menu { color: #193a40 !important; background: linear-gradient(145deg,#fff,#eaf2f2) !important; border: 1px solid #9db9bd !important; box-shadow: 0 12px 28px rgba(31,66,75,.2) !important; } html[data-theme="slate-mint"] #messages .message-footer .reaction-picker-option { color: #31545a !important; background: #f8fbfb !important; border: 1px solid #c3d5d7 !important; } html[data-theme="slate-mint"] #messages .message-footer .reaction-picker-option:hover, html[data-theme="slate-mint"] #messages .message-footer .reaction-picker-option:focus-visible { color: #105b49 !important; background: #d7f1e5 !important; border-color: #55ae92 !important; } html[data-theme="slate-mint"] #messages .message-footer .message-action-menu { color: #193a40 !important; background: linear-gradient(145deg,#fff,#eaf2f2) !important; border-color: #9db9bd !important; box-shadow: 0 12px 28px rgba(31,66,75,.2) !important; } html[data-theme="slate-mint"] #messages .message-footer .message-action-menu button { color: #31545a !important; background: transparent !important; } html[data-theme="slate-mint"] #messages .message-footer .message-action-menu button:hover { color: #105b49 !important; background: #d7f1e5 !important; } /* Fixed home/chat copy is separate from user-authored messages. Give the welcome/empty state its own readable surface instead of inheriting a custom message-text color over the wallpaper. */ html[data-theme="slate-mint"] #app #messages.messages:not(.otp-vault-workspace) .welcome { color: #193a40 !important; background: rgba(251,253,253,.88) !important; border: 1px solid #b8cccf !important; border-radius: 22px !important; box-shadow: 0 12px 30px rgba(31,66,75,.12) !important; } html[data-theme="slate-mint"] #app #messages .welcome :is(strong,h1,h2,h3) { color: #193a40 !important; -webkit-text-fill-color: #193a40 !important; } html[data-theme="slate-mint"] #app #messages .welcome p { color: #46656b !important; -webkit-text-fill-color: #46656b !important; } html[data-theme="slate-mint"] #app #messages .welcome .welcome-icon { color: #16846d !important; } /* Public landing is a light surface; several older marketing rules were written for a dark hero and explicitly painted its copy white/pastel. */ html[data-theme="slate-mint"] #publicLanding { color: #193a40 !important; } html[data-theme="slate-mint"] #publicLanding .landing-brand strong { color: #193a40 !important; -webkit-text-fill-color: #193a40 !important; } html[data-theme="slate-mint"] #publicLanding .landing-brand small { color: #526b70 !important; -webkit-text-fill-color: #526b70 !important; } html[data-theme="slate-mint"] #publicLanding .landing-hero-copy > small, html[data-theme="slate-mint"] #publicLanding .landing-section-title small { color: #126c59 !important; -webkit-text-fill-color: #126c59 !important; } html[data-theme="slate-mint"] #publicLanding .landing-hero h1, html[data-theme="slate-mint"] #publicLanding .landing-section-title h2 { color: #193a40 !important; -webkit-text-fill-color: #193a40 !important; } html[data-theme="slate-mint"] #publicLanding .landing-hero h1 span { color: #087763 !important; -webkit-text-fill-color: #087763 !important; } html[data-theme="slate-mint"] #publicLanding .landing-hero p { color: #405e63 !important; -webkit-text-fill-color: #405e63 !important; } html[data-theme="slate-mint"] #publicLanding .landing-trust, html[data-theme="slate-mint"] #publicLanding .landing-trust span, html[data-theme="slate-mint"] #publicLanding .landing-section-actions span, html[data-theme="slate-mint"] #publicLanding .landing-channel-toolbar p { color: #45676b !important; -webkit-text-fill-color: #45676b !important; } html[data-theme="slate-mint"] #publicLanding .landing-section-actions a { color: #096d59 !important; -webkit-text-fill-color: #096d59 !important; } html[data-theme="slate-mint"] #publicLanding .public-channel-card-body h3 { color: #193a40 !important; -webkit-text-fill-color: #193a40 !important; } html[data-theme="slate-mint"] #publicLanding .public-channel-card-body small { color: #126c59 !important; -webkit-text-fill-color: #126c59 !important; } html[data-theme="slate-mint"] #publicLanding .public-channel-card-body p { color: #456168 !important; -webkit-text-fill-color: #456168 !important; } html[data-theme="slate-mint"] #publicLanding :is(.landing-loading,.landing-empty) { color: #405e63 !important; background: #f8fbfb !important; border-color: #a9c0c3 !important; } html[data-theme="slate-mint"] #publicLanding .landing-footer, html[data-theme="slate-mint"] #publicLanding .landing-footer span { color: #526b70 !important; -webkit-text-fill-color: #526b70 !important; } html[data-theme="slate-mint"] #publicLanding .landing-footer a { color: #096d59 !important; -webkit-text-fill-color: #096d59 !important; } /* The login/register panel is light too; keep its fixed labels and helper copy dark while the separate showcase panel retains its own contrast. */ html[data-theme="slate-mint"] #auth .auth-panel :is(h1,h2,h3,label,.auth-form-note,.field-hint,.auth-privacy-note,.auth-panel-footer) { color: #193a40 !important; -webkit-text-fill-color: #193a40 !important; } html[data-theme="slate-mint"] #auth .auth-panel :is(.field-hint,.auth-privacy-note,.auth-panel-footer) { color: #526b70 !important; -webkit-text-fill-color: #526b70 !important; } html[data-theme="slate-mint"] #auth .auth-showcase { color: #193a40 !important; background: linear-gradient(145deg,#e0f3eb,#d9e9e9) !important; } html[data-theme="slate-mint"] #auth .auth-showcase :is(h1,h2,h3,p,strong,small,span,.auth-eyebrow) { color: #23494b !important; -webkit-text-fill-color: #23494b !important; } html[data-theme="slate-mint"] #auth .auth-showcase .auth-eyebrow { background: #eff9f4 !important; border-color: #a8d3c4 !important; } /* In-app home (not the separate #publicLanding page): system shortcuts and suggested channels live inside #messages and need their own text hierarchy. */ html[data-theme="slate-mint"] #app #messages .system-apps-heading h2, html[data-theme="slate-mint"] #app #messages .discover-heading h2 { color: #193a40 !important; -webkit-text-fill-color: #193a40 !important; } html[data-theme="slate-mint"] #app #messages .system-apps-heading small, html[data-theme="slate-mint"] #app #messages .discover-heading small { color: #126c59 !important; -webkit-text-fill-color: #126c59 !important; } html[data-theme="slate-mint"] #app #messages .system-apps-heading > span, html[data-theme="slate-mint"] #app #messages .discover-heading > span { color: #456168 !important; -webkit-text-fill-color: #456168 !important; } html[data-theme="slate-mint"] #app #messages .system-app-card, html[data-theme="slate-mint"] #app #messages .discover-card { color: #193a40 !important; background: linear-gradient(145deg,#fff,#f0f6f6) !important; border: 1px solid #b8cccf !important; box-shadow: 0 7px 18px rgba(31,66,75,.12) !important; } html[data-theme="slate-mint"] #app #messages .system-app-card:hover, html[data-theme="slate-mint"] #app #messages .discover-card:hover, html[data-theme="slate-mint"] #app #messages .system-app-card:focus-visible, html[data-theme="slate-mint"] #app #messages .discover-card:focus-visible { background: linear-gradient(145deg,#fff,#e3f4ec) !important; border-color: #60b398 !important; box-shadow: 0 9px 22px rgba(29,126,101,.16) !important; outline-color: #27896f !important; } html[data-theme="slate-mint"] #app #messages .system-app-card-body strong, html[data-theme="slate-mint"] #app #messages .discover-card-body strong { color: #193a40 !important; -webkit-text-fill-color: #193a40 !important; } html[data-theme="slate-mint"] #app #messages .system-app-card-body small, html[data-theme="slate-mint"] #app #messages .discover-card-body small { color: #45666b !important; -webkit-text-fill-color: #45666b !important; } html[data-theme="slate-mint"] #app #messages .discover-card-body > span { color: #405e63 !important; -webkit-text-fill-color: #405e63 !important; } html[data-theme="slate-mint"] #app #messages .system-app-open { color: #145b49 !important; background: #d8f1e6 !important; border: 1px solid #75bda7 !important; -webkit-text-fill-color: #145b49 !important; } /* App Store choices use legacy account-card styles whose colors can remain pale on a light surface. Pin readable ink to this modal's theme tokens. */ html[data-theme="slate-mint"] body .system-app-store-modal .system-app-store-panel { color: #193a40 !important; background: linear-gradient(155deg, #ffffff, #edf4f3) !important; border-color: #a9c0c2 !important; } html[data-theme="slate-mint"] body .system-app-store-modal .system-app-store-panel :is(header h2, .system-app-store-hint, .system-app-store-search, .system-app-store-empty) { color: #31545a !important; -webkit-text-fill-color: #31545a !important; } html[data-theme="slate-mint"] body .system-app-store-modal .system-app-store-panel > header small { color: #126c59 !important; -webkit-text-fill-color: #126c59 !important; } html[data-theme="slate-mint"] body .system-app-store-modal .system-app-store-option { color: #193a40 !important; background: linear-gradient(145deg, #ffffff, #f0f6f6) !important; border-color: #b8cccf !important; box-shadow: 0 3px 10px rgba(31,66,75,.08) !important; } html[data-theme="slate-mint"] body .system-app-store-modal .system-app-store-option:has(input:checked) { background: linear-gradient(145deg, #f4fcf8, #e1f3eb) !important; border-color: #58a98e !important; } html[data-theme="slate-mint"] body .system-app-store-modal .system-app-store-option .account-system-app-copy strong { color: #173d39 !important; -webkit-text-fill-color: #173d39 !important; font-size: .86rem !important; font-weight: 800 !important; line-height: 1.55 !important; } html[data-theme="slate-mint"] body .system-app-store-modal .system-app-store-option .account-system-app-copy small { color: #526b70 !important; -webkit-text-fill-color: #526b70 !important; font-size: .7rem !important; line-height: 1.6 !important; } html[data-theme="slate-mint"] body .system-app-store-modal .system-app-store-state { color: #315e55 !important; background: #e5f1ed !important; -webkit-text-fill-color: #315e55 !important; } html[data-theme="slate-mint"] body .system-app-store-modal .system-app-store-close { color: #315e62 !important; background: #f8fbfb !important; border-color: #b7cacc !important; -webkit-text-fill-color: #315e62 !important; } html[data-theme="slate-mint"] #app #messages .discover-open { color: #fff !important; background: linear-gradient(145deg,#218b70,#146a56) !important; border: 1px solid #2d9679 !important; -webkit-text-fill-color: #fff !important; } html[data-theme="slate-mint"] #app #messages .discover-pager button { color: #315e62 !important; background: #fff !important; border: 1px solid #b8cccf !important; } html[data-theme="slate-mint"] #app #messages .discover-pager button.active { color: #fff !important; background: #147761 !important; border-color: #147761 !important; } /* TASK 515: the built-in mini-apps render inside #messages, so they need a complete light theme of their own instead of inheriting legacy dark cards. */ html[data-theme="slate-mint"] #messages.miniapp-workspace, html[data-theme="slate-mint"] #messages.otp-vault-workspace { color: #193a40 !important; background: radial-gradient(ellipse at 10% 0%,rgba(141,210,190,.22),transparent 48%),linear-gradient(145deg,#e9f0f1,#dce8e9) !important; } html[data-theme="slate-mint"] #messages :is(.market-workspace,.calendar-workspace) { color: #193a40 !important; background: linear-gradient(150deg,rgba(255,255,255,.95),rgba(239,246,245,.97)) !important; border: 1px solid #bdd0d2 !important; border-radius: 22px !important; box-shadow: 0 14px 36px rgba(34,67,72,.12) !important; } html[data-theme="slate-mint"] #messages :is(.miniapp-header,.calendar-app-header) { color: #193a40 !important; border-color: #c5d7d8 !important; } html[data-theme="slate-mint"] #messages .miniapp-header :is(h2,em), html[data-theme="slate-mint"] #messages .calendar-app-header :is(h2,em) { color: #193a40 !important; -webkit-text-fill-color: #193a40 !important; } html[data-theme="slate-mint"] #messages .miniapp-header small { color: #16846d !important; -webkit-text-fill-color: #16846d !important; } html[data-theme="slate-mint"] #messages :is(.miniapp-description,.miniapp-updated) { color: #526e72 !important; background: #f5f9f8 !important; border: 1px solid #d1dfe0 !important; } html[data-theme="slate-mint"] #messages .miniapp-header img { border-color: #78bda7 !important; box-shadow: 0 5px 15px rgba(36,126,99,.16) !important; } /* Market: bright, legible quote cards with mint accents and dark numerals. */ html[data-theme="slate-mint"] #messages .market-price-card { color: #193a40 !important; background: linear-gradient(145deg,#fff,#eaf4f0) !important; border: 1px solid #b8d1c8 !important; box-shadow: 0 6px 16px rgba(35,89,75,.09),inset 0 1px rgba(255,255,255,.9) !important; } html[data-theme="slate-mint"] #messages .market-price-card small { color: #526e72 !important; } html[data-theme="slate-mint"] #messages .market-price-card strong { color: #173d39 !important; } html[data-theme="slate-mint"] #messages .market-price-card em { color: #147761 !important; } html[data-theme="slate-mint"] #messages .market-price-icon { color: #126b56 !important; background: linear-gradient(145deg,#d8f1e6,#c6e8dc) !important; border: 1px solid #a4d0bf !important; } html[data-theme="slate-mint"] #messages .market-price-icon svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; } html[data-theme="slate-mint"] #messages .miniapp-error { color: #8b342d !important; background: #fff5f3 !important; border-color: #e6b4ad !important; } /* Calendar: all fixed copy, panels, controls, form states and observances. */ html[data-theme="slate-mint"] #messages :is(.calendar-month-card,.calendar-events-panel,.calendar-event-form,.calendar-color-picker) { color: #193a40 !important; background: linear-gradient(150deg,#fff,#f0f6f5) !important; border: 1px solid #c2d4d5 !important; box-shadow: 0 6px 18px rgba(34,67,72,.08) !important; } html[data-theme="slate-mint"] #messages :is(.calendar-month-title,.calendar-events-heading) :is(strong,small), html[data-theme="slate-mint"] #messages .calendar-form-heading :is(strong,small) { color: #193a40 !important; -webkit-text-fill-color: #193a40 !important; } html[data-theme="slate-mint"] #messages :is(.calendar-month-title,.calendar-events-heading) small, html[data-theme="slate-mint"] #messages .calendar-form-heading small { color: #58767b !important; -webkit-text-fill-color: #58767b !important; } html[data-theme="slate-mint"] #messages .calendar-weekdays { color: #526e72 !important; } html[data-theme="slate-mint"] #messages .calendar-weekdays .is-friday { color: #a34b43 !important; } html[data-theme="slate-mint"] #messages .calendar-day:not(.today):not(.calendar-task-date-match) { color: #26484b !important; background: linear-gradient(145deg,#fff,#f1f7f6) !important; border-color: #c4d6d7 !important; } html[data-theme="slate-mint"] #messages .calendar-day:not(.today):not(.calendar-task-date-match) strong { color: #26484b !important; } html[data-theme="slate-mint"] #messages .calendar-day:not(.today):not(.calendar-task-date-match):hover, html[data-theme="slate-mint"] #messages .calendar-day:not(.today):not(.calendar-task-date-match).selected { color: #105b49 !important; background: linear-gradient(145deg,#e4f5ed,#d7eee5) !important; border-color: #65b79c !important; } html[data-theme="slate-mint"] #messages .calendar-day.today { color: #fff9e6 !important; background: linear-gradient(145deg,#d5a83a,#9b701b) !important; border-color: #ffe49b !important; } html[data-theme="slate-mint"] #messages .calendar-day.has-events:not(.today) > span { color: #fff !important; background: #16846d !important; } html[data-theme="slate-mint"] #messages .calendar-days .calendar-day-occasion-label { color: #285d7b !important; background: #e4f4ff !important; border-color: #acd4ec !important; } html[data-theme="slate-mint"] #messages .calendar-days .calendar-day.is-official-holiday i { color: #a34b43 !important; } html[data-theme="slate-mint"] #messages .calendar-event { color: #193a40 !important; background: linear-gradient(145deg,#fff,#edf6f2) !important; border-color: #c3d9d1 !important; box-shadow: 0 3px 10px rgba(35,89,75,.07) !important; } html[data-theme="slate-mint"] #messages .calendar-event :is(strong,p) { color: #26484b !important; } html[data-theme="slate-mint"] #messages .calendar-event small { color: #147761 !important; } html[data-theme="slate-mint"] #messages .calendar-empty { color: #58767b !important; } html[data-theme="slate-mint"] #messages :is(.calendar-event-toggle,.calendar-event-edit,.calendar-nav) { color: #315e62 !important; background: linear-gradient(145deg,#fff,#e7f1ef) !important; border-color: #afc8c6 !important; } html[data-theme="slate-mint"] #messages .calendar-event-form label, html[data-theme="slate-mint"] #messages .calendar-color-picker legend { color: #31545a !important; } html[data-theme="slate-mint"] #messages .calendar-offline-notice { color: #715117 !important; background: #fff8e8 !important; border-color: #e6ce98 !important; } html[data-theme="slate-mint"] #messages .calendar-occasion { color: #26484b !important; background: #f1f7f6 !important; border-color: #c4d6d7 !important; } html[data-theme="slate-mint"] #messages .calendar-occasion :is(p,small) { color: #526e72 !important; } /* OTP workspace and account vault: bright card surfaces, readable TOTP, QR, timers, management actions, and scanner modal. */ html[data-theme="slate-mint"] #messages.otp-vault-workspace .otp-vault-card, html[data-theme="slate-mint"] .account-otp-vault-section .otp-vault-card { color: #193a40 !important; background: linear-gradient(145deg,#fff,#eaf5f0) !important; border: 1px solid #b5d1c7 !important; box-shadow: 0 8px 21px rgba(35,89,75,.12) !important; } html[data-theme="slate-mint"] :is(#messages.otp-vault-workspace,.account-otp-vault-section) .otp-vault-card-info strong { color: #193a40 !important; } html[data-theme="slate-mint"] :is(#messages.otp-vault-workspace,.account-otp-vault-section) .otp-vault-card-info small { color: #58767b !important; } html[data-theme="slate-mint"] :is(#messages.otp-vault-workspace,.account-otp-vault-section) .otp-vault-code { color: #125b49 !important; -webkit-text-fill-color: #125b49 !important; text-shadow: none !important; } html[data-theme="slate-mint"] :is(#messages.otp-vault-workspace,.account-otp-vault-section) .otp-vault-timer { color: #58767b !important; } html[data-theme="slate-mint"] :is(#messages.otp-vault-workspace,.account-otp-vault-section) .otp-vault-qr { background: #fff !important; border: 1px solid #d5e0df !important; } html[data-theme="slate-mint"] :is(#messages.otp-vault-workspace,.account-otp-vault-section) .otp-vault-card-actions button, html[data-theme="slate-mint"] .account-otp-vault-section .otp-vault-actions button { color: #315e62 !important; background: linear-gradient(145deg,#fff,#e8f1ef) !important; border: 1px solid #afc8c6 !important; box-shadow: 0 2px 7px rgba(34,67,72,.08) !important; } html[data-theme="slate-mint"] :is(#messages.otp-vault-workspace,.account-otp-vault-section) .otp-vault-card-actions .otp-delete { color: #993e37 !important; background: #fff4f1 !important; border-color: #e2b8b1 !important; } html[data-theme="slate-mint"] :is(#messages.otp-vault-workspace,.account-otp-vault-section) .otp-vault-empty { color: #58767b !important; background: #f5f9f8 !important; border: 1px solid #d1dfe0 !important; } html[data-theme="slate-mint"] .account-otp-vault-section .otp-vault-editor, html[data-theme="slate-mint"] .account-otp-vault-section .otp-vault-form-grid { color: #193a40 !important; background: #f2f7f6 !important; border-color: #c3d5d5 !important; } html[data-theme="slate-mint"] :is(.otp-camera-modal,.otp-camera-panel) { color: #193a40 !important; background: rgba(232,241,240,.97) !important; border-color: #9db9bd !important; } html[data-theme="slate-mint"] .otp-camera-panel :is(h3,p) { color: #31545a !important; } html[data-theme="slate-mint"] .otp-camera-view { background: #172a2d !important; border-color: #78bda7 !important; } html[data-theme="slate-mint"] :is(.otp-vault-skeleton>div,.calendar-day-skeleton,.calendar-events-skeleton>div) { background: #f5f9f8 !important; border-color: #d1dfe0 !important; } /* TASK 516: keep calendar text legible on every user-selectable task tint. Older dark-theme selectors assign near-white text to day numbers and event titles; define matching foregrounds for Slate & Mint's pale color variants. */ html[data-theme="slate-mint"] #messages .calendar-day.calendar-task-date-match { --calendar-task-ink:#075437; } html[data-theme="slate-mint"] #messages .calendar-day.calendar-task-date-match.calendar-day-task-emerald { --calendar-task-ink:#075c3e; } html[data-theme="slate-mint"] #messages .calendar-day.calendar-task-date-match.calendar-day-task-sky { --calendar-task-ink:#15547c; } html[data-theme="slate-mint"] #messages .calendar-day.calendar-task-date-match.calendar-day-task-violet { --calendar-task-ink:#573486; } html[data-theme="slate-mint"] #messages .calendar-day.calendar-task-date-match.calendar-day-task-amber { --calendar-task-ink:#754307; } html[data-theme="slate-mint"] #messages .calendar-day.calendar-task-date-match.calendar-day-task-rose { --calendar-task-ink:#80314f; } html[data-theme="slate-mint"] #messages .calendar-day.calendar-task-date-match.calendar-day-task-indigo { --calendar-task-ink:#30417d; } html[data-theme="slate-mint"] #messages .calendar-days .calendar-day.calendar-task-date-match strong { color:var(--calendar-task-ink) !important; text-shadow:none !important; } html[data-theme="slate-mint"] #messages .calendar-days .calendar-day.calendar-task-date-match .calendar-day-task-label { color:#315e55 !important; background:rgba(255,255,255,.78) !important; border-color:rgba(21,113,79,.25) !important; } /* Each task card retains its chosen hue, but with a light surface and dark foregrounds rather than the legacy dark gradient and white lettering. */ html[data-theme="slate-mint"] #messages .calendar-event-color-default { background:linear-gradient(135deg,#e2f5ed,#f7fbf9) !important; border-color:#b9d9cb !important; } html[data-theme="slate-mint"] #messages .calendar-event-color-emerald { background:linear-gradient(135deg,#d9f4e5,#f4fbf6) !important; border-color:#add6bd !important; } html[data-theme="slate-mint"] #messages .calendar-event-color-sky { background:linear-gradient(135deg,#e1f3fb,#f7fbfd) !important; border-color:#b7d5e3 !important; } html[data-theme="slate-mint"] #messages .calendar-event-color-violet { background:linear-gradient(135deg,#f0e9f8,#fbf9fd) !important; border-color:#d1c0e2 !important; } html[data-theme="slate-mint"] #messages .calendar-event-color-amber { background:linear-gradient(135deg,#fbf1dc,#fffaf0) !important; border-color:#e6d1a7 !important; } html[data-theme="slate-mint"] #messages .calendar-event-color-rose { background:linear-gradient(135deg,#fae9ee,#fdf9fa) !important; border-color:#e4bdc9 !important; } html[data-theme="slate-mint"] #messages .calendar-event-color-indigo { background:linear-gradient(135deg,#e9edf9,#f9faff) !important; border-color:#c5cde5 !important; } html[data-theme="slate-mint"] #messages .calendar-event :is(strong,p) { color:#26484b !important; -webkit-text-fill-color:#26484b !important; text-shadow:none !important; } html[data-theme="slate-mint"] #messages .calendar-event small { color:#526e72 !important; -webkit-text-fill-color:#526e72 !important; } html[data-theme="slate-mint"] #messages .calendar-event-toggle, html[data-theme="slate-mint"] #messages .calendar-event-edit { color:#315e55 !important; background:#f8fcfa !important; border-color:#b8d3c8 !important; } html[data-theme="slate-mint"] #messages .calendar-event-delete { color:#963f42 !important; background:#fff3f1 !important; border-color:#e7c0ba !important; } html[data-theme="slate-mint"] #messages .calendar-occasion.is-official-holiday { color:#843f42 !important; background:linear-gradient(145deg,#fff0ed,#fff8f4) !important; border-color:#ecc7bd !important; } html[data-theme="slate-mint"] #messages .calendar-occasion.is-official-holiday :is(p,small), html[data-theme="slate-mint"] #messages .calendar-occasion.is-official-holiday > span { color:#843f42 !important; -webkit-text-fill-color:#843f42 !important; } html[data-theme="slate-mint"] #messages .calendar-color-choice { color:#31545a !important; background:#fbfdfd !important; border-color:#c3d5d7 !important; } html[data-theme="slate-mint"] #messages .calendar-color-choice:has(input:checked) { color:#105b49 !important; background:#e1f3eb !important; border-color:#58a98e !important; box-shadow:inset 0 0 0 1px rgba(52,157,124,.12) !important; } /* TASK 517: mobile chat actions are shown in a bottom-sheet. Older hover rules turn labels white; force readable ink on the light Slate & Mint sheet. */ html[data-theme="slate-mint"] body .chat-actions-modal .chat-actions-panel { color:#193a40 !important; background:linear-gradient(155deg,#fff,#edf4f3) !important; border-color:#a9c0c2 !important; box-shadow:0 20px 56px rgba(31,66,75,.24) !important; } html[data-theme="slate-mint"] body .chat-actions-modal .chat-actions-modal-header { color:#193a40 !important; background:linear-gradient(125deg,#f4f9f8,#e3eeee) !important; border-color:#c7d7d8 !important; } html[data-theme="slate-mint"] body .chat-actions-modal .chat-actions-modal-header h3 { color:#193a40 !important; -webkit-text-fill-color:#193a40 !important; } html[data-theme="slate-mint"] body .chat-actions-modal .chat-actions-modal-close { color:#315e62 !important; background:#f8fbfb !important; border-color:#b7cacc !important; -webkit-text-fill-color:#315e62 !important; } html[data-theme="slate-mint"] body .chat-actions-modal .chat-actions-modal-close:hover, html[data-theme="slate-mint"] body .chat-actions-modal .chat-actions-modal-close:focus-visible { color:#8a3e3b !important; background:#fff0ed !important; border-color:#d9aaa4 !important; } html[data-theme="slate-mint"] body .chat-actions-modal .chat-actions-modal-list .action-btn, html[data-theme="slate-mint"] body .chat-actions-modal .chat-actions-modal-list .action-btn:not(.primary):not(.danger-action) { color:#31545a !important; background:linear-gradient(145deg,#fff,#f0f6f5) !important; border:1px solid #c6d7d8 !important; -webkit-text-fill-color:#31545a !important; box-shadow:0 2px 7px rgba(34,67,72,.06) !important; } html[data-theme="slate-mint"] body .chat-actions-modal .chat-actions-modal-list .action-btn :is(.chat-action-sheet-label,svg,.app-button-svg) { color:inherit !important; -webkit-text-fill-color:currentColor !important; stroke:currentColor !important; } html[data-theme="slate-mint"] body .chat-actions-modal .chat-actions-modal-list .action-btn:hover:not(:disabled), html[data-theme="slate-mint"] body .chat-actions-modal .chat-actions-modal-list .action-btn:focus-visible, html[data-theme="slate-mint"] body .chat-actions-modal .chat-actions-modal-list .action-btn:active { color:#105b49 !important; background:linear-gradient(145deg,#e6f5ed,#d8eee4) !important; border-color:#65b79c !important; -webkit-text-fill-color:#105b49 !important; } html[data-theme="slate-mint"] body .chat-actions-modal .chat-actions-empty { color:#58767b !important; } /* Replace the browser-native title bubble on the header ellipsis: native tooltips ignore theme colors and can be clipped at the viewport edge. */ html[data-theme="slate-mint"] :is(#chatActionsToggle,#chatMenu)[data-tooltip] { position:relative !important; overflow:visible !important; } html[data-theme="slate-mint"] :is(#chatActionsToggle,#chatMenu)[data-tooltip]::after { content:attr(data-tooltip); position:absolute; z-index:1400; inset-block-start:calc(100% + 8px); inset-inline-end:0; width:max-content; max-width:min(220px,calc(100vw - 24px)); padding:6px 10px; overflow:hidden; border:1px solid #adc7c5; border-radius:10px; background:linear-gradient(145deg,#fff,#eaf3f1); box-shadow:0 7px 18px rgba(31,66,75,.18); color:#244b4d !important; -webkit-text-fill-color:#244b4d !important; direction:rtl; font-size:.68rem; font-weight:700; line-height:1.4; text-align:center; white-space:normal; opacity:0; visibility:hidden; pointer-events:none; transform:translateY(-3px); transition:opacity .14s ease,transform .14s ease,visibility .14s ease; } html[data-theme="slate-mint"] :is(#chatActionsToggle,#chatMenu)[data-tooltip]:hover::after, html[data-theme="slate-mint"] :is(#chatActionsToggle,#chatMenu)[data-tooltip]:focus-visible::after { opacity:1; visibility:visible; transform:translateY(0); } /* Mobile chat-list trigger: a solid, high-contrast control with a real SVG. */ @media(max-width:700px){ html[data-theme="slate-mint"] #app .chat-header #chatMenu.mobile-menu-button.chat-menu-button{ border:1px solid #86a8aa!important; background:linear-gradient(145deg,#fff,#e7f0f1)!important; color:#173e43!important; box-shadow:0 2px 8px rgba(31,68,74,.16)!important; } html[data-theme="slate-mint"] #app .chat-header #chatMenu.mobile-menu-button.chat-menu-button>.app-button-svg{ color:#173e43!important;stroke:#173e43!important;stroke-width:2.35!important; } html[data-theme="slate-mint"] #app .chat-header #chatMenu.mobile-menu-button.chat-menu-button:hover, html[data-theme="slate-mint"] #app .chat-header #chatMenu.mobile-menu-button.chat-menu-button:focus-visible{ border-color:#16846d!important;background:#d9f1e6!important;color:#105b49!important; } }