@charset "UTF-8";
/*
    서식 편집기 (js/util/OPS_EDITOR.js)

    회의록처럼 '제목 · 목록 · 체크 · 인용' 을 섞어 쓰는 글에 쓴다.
    편집 화면과, 저장된 글을 그대로 보여 주는 자리(.ed-view)가 같은 모양이어야
    쓰는 사람이 "저장하면 달라 보인다" 고 느끼지 않는다 — 그래서 규칙을 같이 둔다.
*/

.ed{
    border:1px solid #c6cfdd; border-radius:10px; background:#fff; overflow:hidden;
}
.ed.is-locked{ background:#f7f9fc; }

/* ── 도구줄 ─────────────────────────────────────────────── */

.ed__bar{
    display:flex; flex-wrap:wrap; align-items:center; gap:2px;
    padding:6px; background:#f7f9fc; border-bottom:1px solid #e3e8f0;
}
.ed__btn{
    display:inline-flex; align-items:center; justify-content:center;
    min-width:32px; height:32px; padding:0 7px;
    border:1px solid transparent; border-radius:6px;
    background:transparent; color:#41506a; cursor:pointer;
    font-family:inherit; font-size:12px;
}
.ed__btn b{ font-weight:700; font-size:12px; }
.ed__btn:hover{ background:#e8eff8; border-color:#c9d8ec; color:#0a529d; }
.ed__sep{ width:1px; height:20px; margin:0 4px; background:#dde4ee; }

/* ── 글 쓰는 곳 ─────────────────────────────────────────── */

.ed__body{
    min-height:220px; max-height:420px; overflow-y:auto;
    padding:14px 16px;
    font-size:14px; line-height:1.75; color:#1b2b46;
    outline:none;
}
.ed__body:focus{ background:#fff; }
.ed.is-locked .ed__body{ color:#41506a; }

/* ── 글 모양 (편집 · 보기 공통) ─────────────────────────── */

.ed__body h2, .ed-view h2{
    margin:18px 0 8px; font-size:18px; font-weight:700; color:#16233a; line-height:1.4;
}
.ed__body h3, .ed-view h3{
    margin:14px 0 6px; font-size:15.5px; font-weight:700; color:#1b2b46; line-height:1.4;
}
.ed__body h2:first-child, .ed-view h2:first-child,
.ed__body h3:first-child, .ed-view h3:first-child{ margin-top:0; }

.ed__body p, .ed-view p{ margin:0 0 8px; }
.ed__body p:last-child, .ed-view p:last-child{ margin-bottom:0; }

.ed__body ul, .ed__body ol,
.ed-view ul, .ed-view ol{ margin:0 0 10px; padding-left:22px; }
.ed__body li, .ed-view li{ margin:3px 0; }

.ed__body blockquote, .ed-view blockquote{
    margin:10px 0; padding:8px 14px;
    border-left:3px solid #9dc0ee; background:#f6faff;
    color:#33455f;
}

.ed__body pre, .ed-view pre{
    margin:10px 0; padding:10px 12px;
    border:1px solid #e3e8f0; border-radius:6px; background:#f7f9fc;
    font-family:Consolas, "D2Coding", monospace; font-size:13px;
    white-space:pre-wrap; word-break:break-all;
}
.ed__body code, .ed-view code{
    padding:1px 5px; border-radius:4px; background:#eef2f7;
    font-family:Consolas, "D2Coding", monospace; font-size:12.5px; color:#b4425a;
}
.ed__body pre code, .ed-view pre code{ padding:0; background:none; color:inherit; }

.ed__body hr, .ed-view hr{
    margin:14px 0; border:0; border-top:1px solid #dfe5ee;
}

.ed__body a, .ed-view a{ color:#0a529d; text-decoration:underline; }

/* ── 체크 목록 ──────────────────────────────────────────── */

.ed__body ul.ed-todo, .ed-view ul.ed-todo{ list-style:none; padding-left:2px; }

.ed__body ul.ed-todo > li, .ed-view ul.ed-todo > li{
    display:flex; align-items:flex-start; gap:8px;
}
.ed-check{
    flex:0 0 auto; width:17px; height:17px; margin-top:4px;
    border:1.5px solid #9aa8bd; border-radius:4px; background:#fff;
    cursor:pointer; position:relative;
}
.ed-check:hover{ border-color:#0a529d; }
li.is-done > .ed-check{ background:#0a529d; border-color:#0a529d; }
li.is-done > .ed-check::after{
    content:''; position:absolute; left:5px; top:1px;
    width:4px; height:9px; border:solid #fff; border-width:0 2px 2px 0;
    transform:rotate(43deg);
}
li.is-done{ color:#8a94a6; text-decoration:line-through; }

/* 보기 전용일 때는 못 누르게 */
.ed-view .ed-check{ cursor:default; }

/* ── 저장된 글 보기 ─────────────────────────────────────── */

.ed-view{
    font-size:14px; line-height:1.75; color:#1b2b46;
    word-break:break-word;
}
.ed-view:empty::before{
    content:'아직 작성되지 않았습니다.'; color:#8a94a6; font-size:13px;
}

/* ── 좁은 화면 ──────────────────────────────────────────── */

@media (max-width: 1024px){
    .ed__body{ min-height:200px; max-height:none; padding:12px 13px; }
    .ed__btn{ min-width:36px; height:36px; }
    .ed__bar{ position:sticky; top:0; z-index:2; }
}
