@layer commonpub {
/* Shared editor panel CSS — common styles for all content type editors */
/* Prefix: cpub-ep- (editor panel) */

/* ---- Section collapse ---- */
.cpub-ep-section { border-bottom: var(--border-width-default) solid var(--border); }
.cpub-ep-section-header { display: flex; align-items: center; gap: 8px; padding: 10px 14px; cursor: pointer; width: 100%; background: none; border: none; font-family: inherit; text-align: left; color: inherit; }
.cpub-ep-section-header:hover { background: var(--surface2); }
.cpub-ep-sec-icon { font-size: 10px; color: var(--text-faint); }
.cpub-ep-sec-label { font-family: var(--font-mono); font-size: 10px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--text-dim); flex: 1; }
.cpub-ep-sec-arrow { font-size: 9px; color: var(--text-faint); transition: transform .15s; }
.cpub-ep-section-body { padding: 12px 14px; display: flex; flex-direction: column; gap: 10px; }
.cpub-ep-section.collapsed .cpub-ep-section-body { display: none; }
.cpub-ep-section.collapsed .cpub-ep-sec-arrow { transform: rotate(-90deg); }

/* ---- Form fields ---- */
.cpub-ep-field { display: flex; flex-direction: column; gap: 4px; }
.cpub-ep-flabel { font-family: var(--font-mono); font-size: 9px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--text-faint); }
.cpub-ep-input, .cpub-ep-textarea, .cpub-ep-select { background: var(--surface); border: var(--border-width-default) solid var(--border); padding: 5px 9px; font-size: 12px; color: var(--text); outline: none; width: 100%; font-family: inherit; }
.cpub-ep-input:focus, .cpub-ep-textarea:focus, .cpub-ep-select:focus { border-color: var(--accent); }
.cpub-ep-input::placeholder, .cpub-ep-textarea::placeholder { color: var(--text-faint); }
.cpub-ep-textarea { resize: vertical; }
.cpub-ep-select { appearance: none; cursor: pointer; }
.cpub-ep-hint { font-size: 10px; color: var(--text-faint); font-family: var(--font-mono); }

/* ---- Chip/tag input ---- */
.cpub-ep-chip-wrap { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; background: var(--surface); border: var(--border-width-default) solid var(--border); padding: 4px 8px; min-height: 32px; }
.cpub-ep-chip-wrap:focus-within { border-color: var(--accent); }
.cpub-ep-chip { display: inline-flex; align-items: center; gap: 3px; padding: 1px 6px; font-size: 10px; font-family: var(--font-mono); background: var(--surface2); border: var(--border-width-default) solid var(--border2); color: var(--text-dim); }
.cpub-ep-chip-x { cursor: pointer; color: var(--text-faint); }
.cpub-ep-chip-x:hover { color: var(--red-text); }
.cpub-ep-chip-input { background: transparent; border: none; outline: none; font-size: 11px; color: var(--text); font-family: var(--font-mono); min-width: 60px; flex: 1; }
.cpub-ep-chip-input::placeholder { color: var(--text-faint); }

/* ---- Visibility radio group ---- */
.cpub-ep-vis-group { display: flex; flex-direction: column; gap: 4px; }
.cpub-ep-vis-opt { display: flex; align-items: center; gap: 9px; padding: 7px 10px; border: var(--border-width-default) solid var(--border2); cursor: pointer; background: none; font-family: inherit; text-align: left; color: inherit; transition: all .12s; width: 100%; }
.cpub-ep-vis-opt:hover { background: var(--surface2); }
.cpub-ep-vis-opt.selected { border-color: var(--accent); background: var(--accent-bg); }
.cpub-ep-vis-radio { width: 13px; height: 13px; border-radius: 50%; border: var(--border-width-default) solid var(--border2); display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.cpub-ep-vis-opt.selected .cpub-ep-vis-radio { border-color: var(--accent); }
.cpub-ep-vis-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); display: none; }
.cpub-ep-vis-opt.selected .cpub-ep-vis-dot { display: block; }
.cpub-ep-vis-info { flex: 1; display: flex; flex-direction: column; }
.cpub-ep-vis-label { font-size: 12px; color: var(--text); }
.cpub-ep-vis-desc { font-size: 10px; color: var(--text-dim); font-family: var(--font-mono); }
.cpub-ep-vis-icon { font-size: 11px; color: var(--text-faint); }
.cpub-ep-vis-opt.selected .cpub-ep-vis-icon { color: var(--accent); }

/* ---- Block library (left panel) ---- */
.cpub-ep-lib-header { padding: 10px 12px; border-bottom: var(--border-width-default) solid var(--border); }
.cpub-ep-search { display: flex; align-items: center; gap: 7px; background: var(--surface2); border: var(--border-width-default) solid var(--border); padding: 5px 9px; }
.cpub-ep-search i { font-size: 10px; color: var(--text-faint); }
.cpub-ep-search input { background: transparent; border: none; outline: none; font-size: 12px; color: var(--text); width: 100%; }
.cpub-ep-search input::placeholder { color: var(--text-faint); }
.cpub-ep-lib-body { flex: 1; overflow-y: auto; }
.cpub-ep-group { padding: 10px 0 4px; }
.cpub-ep-group-label { font-family: var(--font-mono); font-size: 9px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--text-faint); padding: 0 12px 6px; }
.cpub-ep-block-item { display: flex; align-items: center; gap: 9px; padding: 6px 12px; cursor: pointer; border: var(--border-width-default) solid transparent; background: none; color: var(--text-dim); font-size: 12px; width: 100%; text-align: left; font-family: inherit; transition: background .1s; }
.cpub-ep-block-item:hover { background: var(--surface2); color: var(--text); }
.cpub-ep-block-icon { width: 22px; height: 22px; background: var(--surface3); border: var(--border-width-default) solid var(--border2); display: flex; align-items: center; justify-content: center; font-size: 9px; color: var(--text-faint); flex-shrink: 0; }
.cpub-ep-block-item:hover .cpub-ep-block-icon { background: var(--accent-bg); border-color: var(--accent-border); color: var(--accent); }
}
