/* Athena HTML editor (public/js/html-editor.js) — same layout as the CMoD website editor */
.he-editor { border: 1px solid var(--athena-border); border-radius: 8px; background: var(--athena-bg-card); }
.he-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; padding: 8px; border-bottom: 1px solid var(--athena-border);
    position: sticky; top: 0; z-index: 2; background: var(--athena-bg-card); border-radius: 8px 8px 0 0; }
.he-toolbar button { background: transparent; border: 1px solid transparent; color: var(--athena-text); padding: 5px 10px; border-radius: 6px;
    cursor: pointer; font: 600 .9rem var(--athena-font); letter-spacing: .02em; }
.he-toolbar button:hover { background: rgba(255,255,255,.05); border-color: var(--athena-border); }
.he-tools { display: inline-flex; flex-wrap: wrap; gap: 2px; }
.he-tools[hidden] { display: none; }
.he-toolbar select { width: auto; margin-left: auto; padding: 5px 8px; font-size: .9rem; background: var(--athena-bg); color: var(--athena-text);
    border: 1px solid var(--athena-border); border-radius: 6px; }
.he-tabs { display: flex; gap: 2px; background: var(--athena-bg); border-radius: 7px; padding: 2px; }
.he-tabs button[aria-selected="true"] { background: rgba(201,162,39,.18); color: var(--athena-accent2); }
.he-sep { width: 1px; height: 22px; background: var(--athena-border); margin: 0 4px; }
.he-panes { display: grid; grid-template-columns: 1fr; }
.he-visual, .he-code, .he-preview { display: none; min-height: 420px; width: 100%; box-sizing: border-box; }
.he-visual { padding: 14px 18px; background: #fff; color: #222; font: 15px/1.55 Arial, Helvetica, sans-serif; outline: none; overflow: auto; max-height: 70vh; }
.he-visual img { max-width: 100%; }
.he-visual a { color: #1a56b0; }
.he-visual blockquote { border-left: 3px solid #c9a227; margin-left: 0; padding-left: 12px; color: #555; }
textarea.he-code { border: 0; border-radius: 0; padding: 14px; resize: vertical; background: var(--athena-bg); color: #9fe0ea;
    font: .88rem/1.5 var(--athena-font-mono); max-height: 70vh; }
textarea.he-code:focus { outline: none; box-shadow: none; }
.he-preview { border: 0; background: #fff; }
.he-panes[data-mode="visual"] .he-visual { display: block; }
.he-panes[data-mode="code"] .he-code { display: block; }
.he-panes[data-mode="preview"] .he-preview { display: block; min-height: 520px; }
.he-panes[data-mode="split"] { grid-template-columns: 1fr 1fr; }
.he-panes[data-mode="split"] .he-code, .he-panes[data-mode="split"] .he-preview { display: block; }
.he-panes[data-mode="split"] .he-preview { border-left: 1px solid var(--athena-border); }
@media (max-width: 900px) {
    .he-panes[data-mode="split"] { grid-template-columns: 1fr; }
    .he-panes[data-mode="split"] .he-preview { border-left: 0; border-top: 1px solid var(--athena-border); }
}
.he-help { padding: 6px 12px; font-size: .78rem; color: var(--athena-text-dim); border-top: 1px solid var(--athena-border); }
