/* MME Community – article editor (Toast UI) in the site's look. */

.mmec-editor { display: none; }
.mmec-field.has-editor .mmec-editor { display: block; }
.mmec-field .mmec-editor-src[hidden] { display: none !important; }
.mmec-editor-help { margin: -2px 0 10px; }

.mmec-editor .toastui-editor-defaultUI {
	border: 1.5px solid var(--bd);
	border-radius: var(--r);
	background: #fff;
	overflow: hidden;
	font-family: inherit;
	transition: border-color .2s, box-shadow .2s;
}
.mmec-editor .toastui-editor-defaultUI:focus-within { border-color: var(--p); box-shadow: 0 0 0 4px rgba(45, 122, 115, .14); }
.mmec-field.has-error .mmec-editor .toastui-editor-defaultUI { border-color: var(--bad); }

/* Toolbar */
.mmec-editor .toastui-editor-defaultUI-toolbar { background: var(--soft); border-bottom: 1px solid var(--bd); padding: 0 10px; }
.mmec-editor .toastui-editor-toolbar-icons { border-radius: 8px; border: 1px solid transparent; }
.mmec-editor .toastui-editor-toolbar-icons:not(:disabled):hover { background-color: #fff; border-color: var(--bd); }
.mmec-editor .toastui-editor-toolbar-icons.active { background-color: #fff; border-color: var(--p); }
.mmec-editor .toastui-editor-toolbar-divider { background-color: var(--bd); }

/* Writing area: always dark, readable text (fixes the old "white text" problem) */
.mmec-editor .toastui-editor-contents,
.mmec-editor .ProseMirror,
.mmec-editor .toastui-editor-md-container .toastui-editor {
	font-family: "Inter", -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	font-size: 16px;
	line-height: 1.75;
	color: #1f2a30;
}
.mmec-editor .toastui-editor-md-container .ProseMirror { font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace; font-size: 14.5px; }
.mmec-editor .toastui-editor-contents { padding: 20px 26px; }
.mmec-editor .ProseMirror { caret-color: var(--p); }
.mmec-editor .toastui-editor-contents p { margin: 0 0 14px; color: #1f2a30; }
.mmec-editor .toastui-editor-contents h1,
.mmec-editor .toastui-editor-contents h2,
.mmec-editor .toastui-editor-contents h3 { color: #1f2a30; border-bottom: 0; font-weight: 700; letter-spacing: -.01em; }
.mmec-editor .toastui-editor-contents h2 { font-size: 1.5em; margin: 26px 0 10px; }
.mmec-editor .toastui-editor-contents h3 { font-size: 1.25em; margin: 22px 0 8px; }
.mmec-editor .toastui-editor-contents a { color: var(--p); }
.mmec-editor .toastui-editor-contents blockquote { border-left: 4px solid var(--p); background: var(--soft); padding: 8px 16px; color: #33434a; }
.mmec-editor .toastui-editor-contents blockquote p { color: #33434a; }
.mmec-editor .toastui-editor-contents img { border-radius: 10px; max-width: 100%; height: auto; }
.mmec-editor .toastui-editor-contents table th { background: var(--p); color: #fff; }
.mmec-editor .toastui-editor-contents .placeholder,
.mmec-editor .placeholder { color: #8a979c; }

/* Markdown syntax colours in the source view */
.mmec-editor .toastui-editor-md-heading { color: #1f2a30; }
.mmec-editor .toastui-editor-md-link .toastui-editor-md-link-url,
.mmec-editor .toastui-editor-md-delimiter { color: #8a979c; }
.mmec-editor .toastui-editor-md-preview { background: #fcfdfd; }

/* Markdown mode: "Write | Preview" tabs */
.mmec-editor .toastui-editor-md-tab-container { background: #fff; border-bottom: 1px solid var(--bd); height: 40px; padding: 0 12px; }
.mmec-editor .toastui-editor-md-tab-container .tab-item { font-family: inherit; font-size: 13px; font-weight: 600; color: var(--mut); background: transparent; border: 0; border-bottom: 2px solid transparent; border-radius: 0; height: 40px; line-height: 40px; margin: 0 6px 0 0; padding: 0 10px; width: auto; }
.mmec-editor .toastui-editor-md-tab-container .tab-item.active { color: var(--pd); border-bottom-color: var(--p); background: transparent; }
.mmec-editor .toastui-editor-md-tab-style .toastui-editor-md-preview { padding: 0; }

/* Mode switch (Markdown | WYSIWYG) */
.mmec-editor .toastui-editor-mode-switch { background: var(--soft); border-top: 1px solid var(--bd); height: 36px; }
.mmec-editor .toastui-editor-mode-switch .tab-item { font-family: inherit; font-size: 13px; font-weight: 600; color: var(--mut); background: transparent; border-color: var(--bd); height: 26px; line-height: 24px; border-radius: 0 0 8px 8px; }
.mmec-editor .toastui-editor-mode-switch .tab-item.active { color: var(--pd); background: #fff; }

/* Popups (link, image, table) */
.mmec-editor .toastui-editor-popup { border-radius: 12px; border-color: var(--bd); box-shadow: 0 12px 32px rgba(31, 42, 48, .16); font-family: inherit; }
.mmec-editor .toastui-editor-popup-body input[type="text"] { border-radius: 8px; border-color: var(--bd); height: 36px; }
.mmec-editor .toastui-editor-popup-body .toastui-editor-ok-button { background: var(--p); border-radius: 8px; height: 34px; }
.mmec-editor .toastui-editor-popup-body .toastui-editor-ok-button:hover { background: var(--pd); }
.mmec-editor .toastui-editor-popup-body .toastui-editor-close-button { border-radius: 8px; height: 34px; }
.mmec-editor .toastui-editor-file-select-button { border-radius: 8px; }

/* Footer: word count + upload status */
.mmec-editor-foot { display: flex; justify-content: space-between; gap: 12px; margin-top: 8px; font-size: 13px; color: var(--mut); min-height: 18px; }
.mmec-editor-status.is-busy { color: var(--pd); }
.mmec-editor-status.is-ok { color: var(--ok); }
.mmec-editor-status.is-bad { color: var(--bad); }

/* Theme styles must not leak into the editor UI */
.mmec-editor button { box-shadow: none; text-transform: none; letter-spacing: normal; min-height: 0; }
.mmec-editor ul, .mmec-editor ol { margin-top: 0; }

@media (max-width: 640px) {
	.mmec-editor .toastui-editor-contents { padding: 16px; }
	.mmec-editor .toastui-editor-defaultUI-toolbar { padding: 0 4px; }
}
