/**
 * v7/css/quill-v7.css - Quill.js v7 커스텀 스타일
 *
 * Quill snow 테마를 v7 디자인에 맞게 커스터마이징.
 * 그림자 없음, v7 블루 테마 색상, 라이트 모드 전용.
 * Bootstrap 미사용.
 *
 * @see v7/post/create.css (폼 공통 스타일)
 */

/* === 에디터 컨테이너 === */
.ql-container.ql-snow {
    border: 1px solid var(--wa-color-neutral-300, #cbd5e1);
    border-top: none;
    border-radius: 0 0 4px 4px;
    font-family: inherit;
    font-size: 0.9rem;
}

/* === 툴바 === */
.ql-toolbar.ql-snow {
    border: 1px solid var(--wa-color-neutral-300, #cbd5e1);
    border-radius: 4px 4px 0 0;
    background: var(--wa-color-neutral-95, #f8fafc);
    padding: 4px 8px;
}

/* 툴바 버튼 hover */
.ql-toolbar.ql-snow .ql-formats button:hover,
.ql-toolbar.ql-snow .ql-formats .ql-picker-label:hover {
    color: var(--wa-color-brand-600, #2563eb);
}

/* 활성 상태 버튼 */
.ql-toolbar.ql-snow .ql-formats button.ql-active,
.ql-toolbar.ql-snow .ql-formats .ql-picker-label.ql-active {
    color: var(--wa-color-brand-600, #2563eb);
}

/* === 에디터 영역 === */
.ql-editor {
    min-height: 250px;
    max-height: 600px;
    overflow-y: auto;
    line-height: 1.6;
    padding: 0.75rem;
}

.ql-editor:focus {
    outline: none;
}

/* placeholder 스타일 */
.ql-editor.ql-blank::before {
    color: var(--wa-color-neutral-400, #94a3b8);
    font-style: normal;
    font-size: 0.9rem;
}

/* 포커스 시 테두리 색 - 블루 테마 */
.ql-container.ql-snow:focus-within {
    border-color: var(--wa-color-brand-600, #2563eb);
    box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.15);
}

/* 포커스 시 툴바 테두리도 블루 */
.post-form-quill-wrapper:focus-within .ql-toolbar.ql-snow {
    border-color: var(--wa-color-brand-600, #2563eb);
    box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.15);
}

/* === 반응형 에디터 높이 === */
@media (max-width: 991px) {
    .ql-editor {
        min-height: 180px;
        max-height: 420px;
    }
}

/* === 비디오 wrapper (16:9 반응형 iframe) === */
.video-wrapper {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
    margin: 10px 0;
}

.video-wrapper.shorts-wrapper {
    padding-bottom: 177.78%;
    max-width: 400px;
}

.video-wrapper iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* === 업로드 비디오 === */
.ql-video-custom {
    max-width: 100%;
    display: block;
    margin: 10px 0;
}

/* === 에디터 전환 버튼 === */
.editor-switch-bar {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 0.35rem;
}

.editor-switch-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.25rem 0.6rem;
    font-size: 0.75rem;
    color: var(--wa-color-neutral-600, #475569);
    background: var(--wa-color-neutral-50, #f8fafc);
    border: 1px solid var(--wa-color-neutral-300, #cbd5e1);
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.15s;
}

.editor-switch-btn:hover {
    background: var(--wa-color-neutral-100, #f1f5f9);
    color: var(--wa-color-brand-600, #2563eb);
    border-color: var(--wa-color-brand-300, #93c5fd);
}

/* === 다운로드 박스 (PDF/문서 등) === */
.ql-download-box {
    border: 1px solid var(--wa-color-neutral-200, #e2e8f0);
    padding: 0.6rem 0.8rem;
    margin: 0.5rem 0;
    border-radius: 6px;
    background: var(--wa-color-neutral-50, #f8fafc);
    font-size: 0.85rem;
}

.ql-download-box a {
    color: var(--wa-color-brand-600, #2563eb);
    text-decoration: none;
}

.ql-download-box a:hover {
    text-decoration: underline;
}

/* === Quill 내 이미지 크기 조정 === */
.ql-editor img {
    max-width: 100%;
    height: auto;
    border-radius: 4px;
}