/* ===== 行前資訊 -- content typography is shared by the planner panel and /Trips/Share ===== */
.jn-prep-content { font-size: 14.5px; line-height: 1.7; color: var(--jn-text); word-break: break-word; }
.jn-prep-content > :first-child { margin-top: 0; }
.jn-prep-content > :last-child { margin-bottom: 0; }
.jn-prep-content p { margin: 0 0 8px; }
.jn-prep-content h2 { font-size: 18px; font-weight: 700; margin: 18px 0 8px; }
.jn-prep-content h3 { font-size: 15.5px; font-weight: 700; margin: 14px 0 6px; }
.jn-prep-content ul, .jn-prep-content ol { margin: 0 0 10px; padding-left: 1.5em; }
.jn-prep-content li { margin: 2px 0; }
.jn-prep-content blockquote { margin: 0 0 10px; padding: 6px 12px; border-left: 3px solid var(--jn-primary); background: var(--jn-surface-alt); color: var(--jn-text-secondary); border-radius: 0 var(--jn-radius-md) var(--jn-radius-md) 0; }
.jn-prep-content a { color: var(--jn-primary); text-decoration: underline; }
.jn-prep-content img { display: block; max-width: 100%; height: auto; margin: 8px 0; border-radius: var(--jn-radius-md); }
.jn-prep-content .ql-align-center { text-align: center; }
.jn-prep-content .ql-align-right { text-align: right; }
.jn-prep-content .ql-align-justify { text-align: justify; }
.jn-prep-content .ql-align-center img { margin-left: auto; margin-right: auto; }
.jn-prep-content .ql-align-right img { margin-left: auto; }
.jn-prep-content .ql-indent-1 { padding-left: 2em; }
.jn-prep-content .ql-indent-2 { padding-left: 4em; }
.jn-prep-content .ql-indent-3 { padding-left: 6em; }
.jn-prep-content .ql-indent-4 { padding-left: 8em; }

/* ===== Planner panel (lives inside the shared .jn-image-manager overlay shell) ===== */
.jn-prep-header-actions { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.jn-prep-btn { display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; font-size: 13.5px; font-weight: 600; border: 1px solid var(--jn-border); border-radius: var(--jn-radius-md); background: var(--jn-surface); color: var(--jn-primary); cursor: pointer; font-family: inherit; white-space: nowrap; }
.jn-prep-btn:hover { background: var(--jn-primary-light); }
.jn-prep-btn:disabled { opacity: .55; cursor: default; }
.jn-prep-btn-primary { background: var(--jn-primary); border-color: var(--jn-primary); color: #fff; }
.jn-prep-btn-primary:hover { background: var(--jn-primary-hover); }
.jn-prep-empty { margin: 0; font-size: 13.5px; color: var(--jn-text-tertiary); line-height: 1.7; }

.jn-prep-editor-wrap .ql-toolbar.ql-snow { border-color: var(--jn-border); border-radius: var(--jn-radius-md) var(--jn-radius-md) 0 0; font-family: inherit; background: var(--jn-surface-alt); }
.jn-prep-editor-wrap .ql-container.ql-snow { border-color: var(--jn-border); border-radius: 0 0 var(--jn-radius-md) var(--jn-radius-md); font-family: inherit; }
.jn-prep-editor-wrap .ql-editor { min-height: 260px; max-height: 55vh; font-size: 14.5px; line-height: 1.7; }
.jn-prep-editor-wrap .ql-editor img { max-width: 100%; }
.jn-prep-source-btn { width: 28px; height: 24px; display: inline-flex; align-items: center; justify-content: center; padding: 0; border: none; background: transparent; color: var(--jn-text-secondary); cursor: pointer; font-size: 15px; border-radius: 4px; }
.jn-prep-source-btn:hover { color: var(--jn-primary); }
.jn-prep-source-btn.is-active { color: #fff; background: var(--jn-primary); }
.jn-prep-source-textarea { width: 100%; min-height: 260px; max-height: 55vh; padding: 10px 12px; font: 13px/1.6 ui-monospace, SFMono-Regular, Consolas, monospace; color: var(--jn-text); background: var(--jn-surface); border: 1px solid var(--jn-border); border-top: none; border-radius: 0 0 var(--jn-radius-md) var(--jn-radius-md); resize: vertical; }
.jn-prep-editor-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; margin-top: 12px; }
.jn-prep-editor-hint { margin-right: auto; font-size: 12px; color: var(--jn-text-tertiary); }

.jn-prep-usage { font-size: 12px; color: var(--jn-text-tertiary); }
.jn-prep-attachment-list { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.jn-prep-attachment { display: flex; align-items: center; gap: 10px; padding: 10px 12px; background: var(--jn-surface-alt); border-radius: var(--jn-radius-md); }
.jn-prep-attachment-icon { font-size: 18px; color: var(--jn-text-secondary); flex-shrink: 0; }
.jn-prep-attachment-name { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13.5px; color: var(--jn-text); }
a.jn-prep-attachment-name:hover { color: var(--jn-primary); text-decoration: underline; }
.jn-prep-attachment-size { font-size: 12px; color: var(--jn-text-tertiary); flex-shrink: 0; }
.jn-prep-share-select { flex-shrink: 0; padding: 5px 6px; font-size: 12px; font-family: inherit; color: var(--jn-text-secondary); background: #fff; border: 1px solid var(--jn-border); border-radius: 8px; cursor: pointer; }
.jn-prep-icon-btn { width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; flex-shrink: 0; background: #fff; border: 1px solid var(--jn-border); border-radius: 8px; color: var(--jn-text-secondary); cursor: pointer; }
.jn-prep-icon-btn:hover { color: var(--jn-danger); border-color: var(--jn-danger); }
.jn-prep-upload-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 12px; }
.jn-prep-upload-row input[type="file"] { display: none; }

@media (max-width: 767.98px) {
  .jn-prep-attachment { flex-wrap: wrap; }
  .jn-prep-attachment-name { flex-basis: calc(100% - 32px); }
  .jn-prep-editor-wrap .ql-editor { max-height: none; }
}