/* board-suneditor.css — Sun Editor on board write/edit forms */
/* 2026-06-10: Theme-aligned toolbar and editor area */

.board-form .sun-editor { border: 1px solid var(--site-border); border-radius: 8px; background: var(--site-bg); font-family: var(--site-font-family, inherit); --se-main-font-family: var(--site-font-family, inherit); --se-content-font-family: var(--site-font-family, inherit); }
.board-form .sun-editor .se-wrapper-inner,
.board-form .sun-editor-editable,
.board-form .sun-editor .se-wrapper .se-placeholder { font-family: var(--site-font-family, inherit); }
.board-form .sun-editor .se-toolbar { outline: none; background: var(--site-surface); border-bottom: 1px solid var(--site-border); }
.board-form .sun-editor .se-btn { color: var(--site-text); }
.board-form .sun-editor .se-btn:enabled:hover { background: rgba(37, 99, 235, 0.08); }
/* 2026-06-11: Editor canvas — white on light/color themes; keep dark bg on dark/charcoal */
.board-form .sun-editor .se-wrapper-inner,
.board-form .sun-editor-editable { background: #ffffff; --se-edit-background-color: #ffffff; }
[data-theme="dark"] .board-form .sun-editor,
[data-theme="dark"] .board-form .sun-editor .se-wrapper-inner,
[data-theme="dark"] .board-form .sun-editor-editable,
[data-theme="charcoal"] .board-form .sun-editor,
[data-theme="charcoal"] .board-form .sun-editor .se-wrapper-inner,
[data-theme="charcoal"] .board-form .sun-editor-editable {
  background: var(--site-bg);
  --se-edit-background-color: var(--site-bg);
  --se-caret-color: var(--site-text);
  --se-drag-caret-color: var(--site-accent);
  --se-edit-font-color: var(--site-text);
  --se-main-font-color: var(--site-text);
  --se-placeholder-color: var(--site-muted);
  caret-color: var(--site-text);
  color: var(--site-text);
}
[data-theme="dark"] .board-form .sun-editor-editable ::selection,
[data-theme="charcoal"] .board-form .sun-editor-editable ::selection {
  background: color-mix(in srgb, var(--site-accent) 38%, transparent);
  color: var(--site-text);
}
.board-form .sun-editor .se-wrapper .se-placeholder { color: var(--site-muted); }
.board-form .sun-editor-editable { color: var(--site-text); font-size: 0.95rem; line-height: var(--site-line-height, 1.8); }

/* Published HTML — SunEditor defaults use #333 text on #fff; align with site theme */
/* 2026-06-10: Fix unreadable post body on dark / charcoal themes */
.board-post-content.sun-editor-editable,
.board-faq-a.sun-editor-editable {
  --se-edit-font-color: var(--site-text);
  --se-edit-font-pre: var(--site-muted);
  --se-edit-font-quote: var(--site-muted);
  --se-edit-background-color: transparent;
  --se-edit-background-pre: color-mix(in srgb, var(--site-surface) 88%, var(--site-bg));
  --se-edit-border-light: var(--site-border);
  --se-edit-border-dark: var(--site-border);
  --se-edit-border-dark-n1: var(--site-border);
  --se-edit-border-dark-n2: var(--site-border);
  --se-edit-border-table: var(--site-border);
  --se-edit-anchor: var(--site-accent);
  --se-edit-anchor-on-font: var(--site-accent);
  --se-edit-anchor-on-back: color-mix(in srgb, var(--site-accent) 14%, transparent);
  --se-edit-hr-color: var(--site-border);
  color: var(--site-text);
  background-color: transparent;
  padding: 0;
}

.board-post-content.sun-editor-editable { white-space: normal; word-break: break-word; }
.board-post-content.sun-editor-editable img { max-width: 100%; height: auto; }
/* 2026-06-11: Published video — keep Sun Editor saved width/height (suneditor-contents.min.css) */
.board-post-content.sun-editor-editable .se-video-container,
.board-faq-a.sun-editor-editable .se-video-container { margin: 16px 0; }
.board-post-content.sun-editor-editable .se-video-container iframe,
.board-post-content.sun-editor-editable .se-video-container video,
.board-faq-a.sun-editor-editable .se-video-container iframe,
.board-faq-a.sun-editor-editable .se-video-container video { border: 0; border-radius: 8px; background: #0f172a; }
/* Shorts default size only when the editor did not set an explicit width */
.board-post-content.sun-editor-editable .se-video-container:not([style*="width"]):has(> figure > iframe.is-youtube-short),
.board-faq-a.sun-editor-editable .se-video-container:not([style*="width"]):has(> figure > iframe.is-youtube-short) { width: min(100%, 420px); margin-left: auto; margin-right: auto; }
.board-post-content.sun-editor-editable .se-video-container:not([style*="width"]) > figure > iframe.is-youtube-short,
.board-faq-a.sun-editor-editable .se-video-container:not([style*="width"]) > figure > iframe.is-youtube-short { aspect-ratio: 9 / 16; min-height: 280px; }
.board-post-content.sun-editor-editable table { width: 100%; border-collapse: collapse; max-width: 100%; }
.board-post-content.sun-editor-editable table td,
.board-post-content.sun-editor-editable table th { border: 1px solid var(--site-border); padding: 8px 10px; min-width: 80px; }
.board-post-content.sun-editor-editable table th,
.board-faq-a.sun-editor-editable table th { background-color: color-mix(in srgb, var(--site-surface) 92%, var(--site-bg)); color: var(--site-text); }

@media (max-width: 768px) {
  .board-post-content.sun-editor-editable { font-size: 0.92rem; line-height: var(--site-line-height, 1.8); }
  .board-post-content.sun-editor-editable img { border-radius: 6px; }
  .board-faq-a.sun-editor-editable { font-size: 0.88rem; overflow-x: auto; }
}

.board-faq-a.sun-editor-editable { white-space: normal; word-break: break-word; }
.board-faq-a.sun-editor-editable img { max-width: 100%; height: auto; }