/* ============================================================
   editorZ 스킨 — 라이트/다크 자체 토큰.
   포인트 색(--edz-accent)은 3단계로 정해진다:
     1) --edz-accent-set : 에디터 스킨 설정에서 지정한 색 (최우선, editor.html 인라인)
     2) --point-color / --hr-brand : 레이아웃이 심는 사이트 포인트색 (자동 상속)
     3) #2f6b4a : 어느 것도 없을 때의 기본값
   덕분에 사이트 포인트색을 바꾸면 에디터도 따라오고, 원하면 설정으로 덮어쓸 수 있다.
   --edz-accent-soft 는 accent 에서 자동 계산(color-mix)해 늘 어울린다.
   ============================================================ */
.edz{
  --edz-accent:var(--edz-accent-set, var(--point-color, var(--hr-brand, var(--zm-brand, var(--rx-point-color, #2f6b4a)))));
  --edz-accent-soft:color-mix(in srgb, var(--edz-accent) 11%, var(--edz-bg));
  --edz-bg:#fff;--edz-surface-2:#f8f9fb;--edz-border:#e8eaef;--edz-text:#15171c;--edz-sub:#5d646f;
  position:relative;border:1px solid var(--edz-border);border-radius:12px;overflow:hidden;background:var(--edz-bg);}
/* 다크 토큰: 중립 회색이 아니라 사이트 포인트색(--edz-accent)을 소량 섞은
   "브랜드 틴트 다크". 초록 테마면 초록빛 다크, 파랑 테마면 파랑빛 다크가 된다. */
.edz.dark{
  --edz-bg:color-mix(in srgb, var(--edz-accent) 10%, #12151b);
  --edz-surface-2:color-mix(in srgb, var(--edz-accent) 13%, #171b22);
  --edz-border:color-mix(in srgb, var(--edz-accent) 20%, #232833);
  --edz-text:#eceef3;--edz-sub:#a7aeba;
  --edz-accent-soft:color-mix(in srgb, var(--edz-accent) 26%, #12151b);}

/* 사이트 다크/라이트 전환을 실시간으로 따라감.
   레이아웃이 html[data-theme] / body.color_scheme_* 를 토글하면 즉시 반영된다.
   렌더 시점에 박힌 .edz.light/.edz.dark 고정 클래스보다 우선(스코프 특이도가 높음). */
html[data-theme="dark"] .edz, body.color_scheme_dark .edz{
  --edz-bg:color-mix(in srgb, var(--edz-accent) 10%, #12151b);
  --edz-surface-2:color-mix(in srgb, var(--edz-accent) 13%, #171b22);
  --edz-border:color-mix(in srgb, var(--edz-accent) 20%, #232833);
  --edz-text:#eceef3;--edz-sub:#a7aeba;
  --edz-accent-soft:color-mix(in srgb, var(--edz-accent) 26%, #12151b);}
html[data-theme="light"] .edz, body.color_scheme_light .edz{
  --edz-bg:#fff;--edz-surface-2:#f8f9fb;--edz-border:#e8eaef;--edz-text:#15171c;--edz-sub:#5d646f;
  --edz-accent-soft:color-mix(in srgb, var(--edz-accent) 11%, var(--edz-bg));}

.edz__tool{display:flex;align-items:center;gap:3px;padding:8px 10px;border-bottom:1px solid var(--edz-border);flex-wrap:wrap;background:var(--edz-bg);}
.edz__btn{min-width:32px;height:32px;padding:0 7px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:var(--edz-sub);cursor:pointer;font-weight:800;font-size:14px;border:0;background:none;}
.edz__btn:hover{background:var(--edz-surface-2);color:var(--edz-text);}
.edz__btn--ins{color:var(--edz-accent);}
.edz__btn--ins:hover{background:var(--edz-accent-soft);}
.edz__btn.is-on{background:var(--edz-accent-soft);color:var(--edz-accent);}
.edz__div{width:1px;height:18px;background:var(--edz-border);margin:0 5px;}

/* 드롭다운/팝오버 공용 래퍼 */
.edz__fmt{position:relative;display:inline-flex;}

/* 본문 포맷 선택 (본문 ▼) */
.edz__sel{display:inline-flex;align-items:center;gap:4px;height:32px;padding:0 10px;border:0;background:none;border-radius:8px;font-size:13.5px;font-weight:700;color:var(--edz-text);cursor:pointer;font-family:inherit;white-space:nowrap;}
.edz__sel:hover{background:var(--edz-surface-2);}

/* 글자색 버튼 (A + 색상바) */
.edz__colorbtn{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;width:32px;height:32px;border:0;background:none;border-radius:8px;cursor:pointer;font-weight:900;font-size:14px;color:var(--edz-text);}
.edz__colorbtn:hover{background:var(--edz-surface-2);}
.edz__colorbar{display:block;width:16px;height:3px;border-radius:2px;margin-top:1px;background:var(--edz-accent);}

/* 팝오버 공통 */
.edz__pop{position:absolute;top:38px;left:0;z-index:20;display:flex;gap:6px;padding:8px;background:var(--edz-bg);border:1px solid var(--edz-border);border-radius:10px;box-shadow:0 6px 20px rgba(0,0,0,.14);}
.edz__pop[hidden]{display:none;}
.edz__pop{flex-wrap:wrap;max-width:172px;}
.edz__sw{width:20px;height:20px;border-radius:50%;cursor:pointer;border:2px solid transparent;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;}
.edz__sw:hover{border-color:var(--edz-text);}
.edz__sw--none{background:var(--edz-surface-2);border:1px solid var(--edz-border);color:var(--edz-sub);font-size:11px;font-weight:900;line-height:1;}
.edz__sw--none:hover{border-color:var(--edz-accent);color:var(--edz-accent);}
/* 커스텀 color picker 스와치: 무지개 배경 + 안에 native input 숨김 */
.edz__sw--pick{position:relative;overflow:hidden;background:conic-gradient(#ee3b34,#f59e0b,#1c9e4b,#2563eb,#7c3aed,#ee3b34) /* 무지개 프리셋(색 선택기 스와치 장식용) */;border:1px solid var(--edz-border);}
.edz__sw--pick:hover{border-color:var(--edz-text);}
.edz__pick{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;border:0;padding:0;}
.edz__colorbar--hi{background:#fff3b0;}
#edzHiliteBtn{flex-direction:column;gap:1px;}

/* 이모지 팝오버 */
.edz__pop--emoji{flex-direction:column;gap:8px;padding:10px;width:268px;max-width:268px;}
.edz__emoji-tabs{display:flex;gap:2px;width:100%;border-bottom:1px solid var(--edz-border);padding-bottom:6px;}
.edz__emoji-tab{flex:1;height:30px;border:0;background:none;border-radius:7px;font-size:16px;line-height:1;cursor:pointer;padding:0;}
.edz__emoji-tab:hover{background:var(--edz-surface-2);}
.edz__emoji-tab.is-on{background:var(--edz-accent-soft);}
.edz__emoji-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:1px;width:100%;max-height:196px;overflow-y:auto;}
.edz__emoji{height:30px;border:0;background:none;border-radius:6px;font-size:18px;line-height:1;cursor:pointer;padding:0;display:flex;align-items:center;justify-content:center;}
.edz__emoji:hover{background:var(--edz-surface-2);}

/* 메뉴형 팝오버 (본문/대제목/소제목) */
.edz__pop--menu{flex-direction:column;gap:2px;padding:6px;min-width:118px;}
.edz__pop--menu button{display:block;width:100%;text-align:left;padding:8px 10px;border:0;background:none;border-radius:7px;font-size:13.5px;color:var(--edz-text);cursor:pointer;font-family:inherit;}
.edz__pop--menu button:hover{background:var(--edz-surface-2);}
.edz__mi-h2{font-size:16px;font-weight:800;}
.edz__mi-h3{font-size:14px;font-weight:700;}

/* 아이콘 드롭다운 버튼(정렬·목록) */
.edz__btn--menu{min-width:auto;gap:1px;padding:0 4px 0 6px;}
.edz__menu-caret{opacity:.55;}
/* 아이콘+라벨 메뉴 항목 */
.edz__pop--icons{min-width:150px;}
.edz__pop--icons button{display:flex !important;align-items:center;gap:9px;}
.edz__pop--icons button svg{flex:0 0 auto;color:var(--edz-sub);}

.edz__body{padding:16px;min-height:200px;font-size:16px;line-height:1.8;color:var(--edz-text);outline:0;}
.edz__body:empty::before{content:'내용을 입력하세요…';color:var(--edz-sub);}
.edz__body h2{font-size:21px;font-weight:800;margin:8px 0 12px;}
.edz__body h3{font-size:18px;font-weight:800;margin:6px 0 10px;}
.edz__body p{margin:0 0 12px;}
.edz__body blockquote{margin:12px 0;padding:10px 16px;border-left:3px solid var(--edz-accent);background:var(--edz-surface-2);color:var(--edz-sub);}
.edz__body a{color:var(--edz-accent);text-decoration:underline;}
.edz__body hr{border:0;border-top:1px solid var(--edz-border);margin:18px 0;}
.edz__body ul{padding-left:22px;margin:0 0 12px;}
.edz__body img{max-width:100%;height:auto;}
.edz__body img.edz-img-selected{outline:2px solid var(--edz-accent,#3d6bff);outline-offset:2px;border-radius:2px;}
.edz__body table.edz-table{border-collapse:collapse;width:100%;table-layout:fixed;margin:12px 0;}
.edz__body table.edz-table td{border:1px solid var(--edz-border);padding:8px 10px;min-width:30px;vertical-align:top;word-break:break-word;}
/* 반응형 16:9 임베드 (YouTube 등) — PC/모바일 비율 유지 */
.edz-embed{position:relative;width:100%;padding-top:56.25%;margin:12px 0;border-radius:10px;overflow:hidden;background:#000;}
.edz-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}

/* 표 편집 플로팅 툴바 */
.edz__ttool{position:absolute;z-index:30;display:flex;align-items:center;gap:3px;padding:5px 7px;background:var(--edz-bg);border:1px solid var(--edz-border);border-radius:10px;box-shadow:0 6px 20px rgba(0,0,0,.16);}
.edz__ttool[hidden]{display:none;}
.edz__ttool-btn{display:inline-flex;align-items:center;gap:4px;height:28px;padding:0 9px;border:0;background:none;border-radius:7px;font-size:12.5px;font-weight:700;color:var(--edz-sub);cursor:pointer;font-family:inherit;white-space:nowrap;}
.edz__ttool-btn:hover{background:var(--edz-surface-2);color:var(--edz-text);}
.edz__ttool-ci{width:13px;height:13px;border-radius:3px;border:1px solid var(--edz-border);background:conic-gradient(#ee3b34,#f59e0b,#1c9e4b,#2563eb,#7c3aed,#ee3b34) /* 무지개 프리셋(색 선택기 스와치 장식용) */;}
.edz__ttool .edz__pop{top:34px;}

/* 에디터 레이어(모달) */
.edz__modal{position:absolute;inset:0;z-index:40;display:flex;align-items:center;justify-content:center;background:rgba(20,23,29,.4);}
.edz__modal[hidden]{display:none;}
.edz__modal-box{width:min(340px,90%);background:var(--edz-bg);border:1px solid var(--edz-border);border-radius:14px;box-shadow:0 12px 40px rgba(0,0,0,.28);padding:20px;}
.edz__modal-h{font-size:16px;font-weight:800;color:var(--edz-text);margin-bottom:16px;}
.edz__modal-fields{display:flex;gap:12px;}
.edz__field{flex:1;display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:700;color:var(--edz-sub);}
.edz__num{flex:1;width:100%;padding:9px 11px;border:1px solid var(--edz-border);border-radius:9px;background:var(--edz-surface-2);font:inherit;font-size:14px;color:var(--edz-text);outline:0;}
.edz__num:focus{border-color:var(--edz-accent);}
.edz__modal-hint{font-size:12px;color:var(--edz-sub);margin-top:12px;line-height:1.5;}
.edz__modal-btns{display:flex;justify-content:flex-end;gap:8px;margin-top:18px;}
.edz__modal-cancel,.edz__modal-ok{font-size:13.5px;font-weight:800;padding:9px 18px;border-radius:10px;cursor:pointer;border:1px solid var(--edz-border);background:var(--edz-bg);color:var(--edz-sub);}
.edz__modal-cancel:hover{border-color:var(--edz-accent);color:var(--edz-accent);}
.edz__modal-ok{background:var(--edz-accent);border-color:var(--edz-accent);color:#fff;}
.edz__modal-ok:hover{filter:brightness(.94);}

/* 동영상 레이어 — 링크 붙여넣기 자동 인식 */
.edz__modal--video .edz__modal-box{width:min(460px,92%);}
.edz__vguide{font-size:12.5px;color:var(--edz-sub);margin:0 0 10px;line-height:1.5;}
.edz__vurl{width:100%;box-sizing:border-box;padding:10px 12px;border:1px solid var(--edz-border);border-radius:9px;background:var(--edz-surface-2);font:inherit;font-size:13.5px;color:var(--edz-text);outline:0;}
.edz__vurl:focus{border-color:var(--edz-accent);}
.edz__vplat{margin-top:8px;font-size:12px;font-weight:700;color:var(--edz-accent);}
.edz__vpreview{margin-top:12px;}
.edz__vpreview .edz-embed{margin:0;}
.edz__verr{margin-top:10px;font-size:12.5px;color:var(--edz-accent);font-weight:700;}
.edz__modal-ok[disabled]{opacity:.5;cursor:not-allowed;}
.edz__modal-ok[disabled]:hover{filter:none;}

/* 링크 레이어 — URL 입력 + 옵션 체크박스 */
.edz__modal--link .edz__modal-box{width:min(420px,92%);}
.edz__lurl{width:100%;box-sizing:border-box;padding:10px 12px;border:1px solid var(--edz-border);border-radius:9px;background:var(--edz-surface-2);font:inherit;font-size:13.5px;color:var(--edz-text);outline:0;}
.edz__lurl:focus{border-color:var(--edz-accent);}
.edz__lopt{display:flex;align-items:center;gap:7px;margin-top:11px;font-size:13px;font-weight:600;color:var(--edz-sub);cursor:pointer;user-select:none;}
.edz__lopt input{width:15px;height:15px;accent-color:var(--edz-accent);cursor:pointer;}
.edz__lerr{margin-top:10px;}


/* 파일 첨부(xeUploader)는 코어 기본 스타일(jquery.fileupload.css + ckeditor/file_upload.html)을
   그대로 사용한다. editorZ 는 별도 재스킨하지 않아 코어에 탑재된 파일첨부 UI 와 동일하게 보인다. */

/* 파일첨부 드롭존 안정화:
   코어 기본은 호버 시 안내문구(dropzone-message)를 숨기고 용량제한(upload_info)을
   대신 보여주는데, 그 display 토글 때문에 flex 아이템이 빠졌다 들어오며 칸 높이가
   흔들렸다. 용량제한을 호버와 무관하게 버튼 옆에 늘 함께 표시해 토글을 없앤다. */
.edz .xefu-dropzone p.xefu-dropzone-message,
.edz .xefu-dropzone:hover p.xefu-dropzone-message{display:inline-block !important;flex:0 1 auto !important;min-width:0 !important;}
.edz .xefu-dropzone p.upload_info,
.edz .xefu-dropzone:hover p.upload_info{display:inline-block !important;flex:0 0 auto !important;margin:0 0 0 8px !important;font-size:12px;color:var(--edz-sub);opacity:.7;white-space:nowrap;}
.edz .xefu-dropzone .allowed_filetypes_container{display:none !important;}
.edz .xefu-dropzone{padding-left:14px !important;padding-right:14px !important;}
/* 첨부영역(점선 박스)이 에디터 좌우 끝까지 꽉 차 본문(16px)보다 넓어 보이던 것 →
   컨테이너에 좌우 바깥 여백을 줘 본문 텍스트와 같은 라인에 맞춘다. */
.edz .xefu-container{margin:4px 16px 14px !important;}