/* The editor's Publish dialog. Colours from theme.css. */

.publish-dialog {
    width: min(560px, calc(100vw - 32px)); padding: 0; border: 1px solid var(--border); border-radius: 12px;
    background: var(--panel); color: var(--text);
}
.publish-dialog::backdrop { background: rgba(5, 12, 20, .7); }
.publish-dialog form { display: grid; gap: 10px; padding: 18px 20px; }
.publish-head { display: flex; align-items: center; gap: 12px; }
.publish-dialog h2 { margin: 0; color: #fff; font-size: 20px; flex: 1; }
.publish-close {
    width: 32px; height: 32px; border-radius: 8px; border: 1px solid transparent; background: none;
    color: var(--muted); font-size: 24px; line-height: 1; cursor: pointer;
}
.publish-close:hover { color: var(--text); background: var(--raised); border-color: var(--control-border); }
.publish-close:focus-visible { outline: 2px solid var(--py-yellow); outline-offset: 1px; }
.publish-status { margin: 0; color: var(--py-yellow-light); font-size: 14px; }
.publish-status:empty { display: none; }
.publish-help { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.5; }
.publish-dialog label[for] { font-weight: 600; font-size: 14px; }
.publish-dialog textarea {
    background: var(--panel-2); color: var(--text); border: 1px solid var(--control-border); border-radius: 6px;
    padding: 8px; font: inherit; resize: vertical;
}
.publish-tags { border: 0; padding: 0; margin: 0; }
.publish-tags legend { font-weight: 600; font-size: 14px; margin-bottom: 6px; }
.publish-tags legend span { color: var(--muted); font-weight: 400; }
#publish-tag-list { display: flex; flex-wrap: wrap; gap: 6px; }
.publish-tag {
    display: inline-flex; gap: 5px; align-items: center; font-size: 13px; cursor: pointer;
    padding: 3px 10px; border-radius: 999px; background: rgba(75, 139, 190, .16); border: 1px solid transparent;
}
.publish-tag.on { background: var(--py-yellow); color: var(--on-yellow); font-weight: 700; }
.publish-tag input { margin: 0; }
.publish-tag:has(input:disabled) { opacity: .5; cursor: default; }
.publish-error { margin: 0; color: var(--error); font-size: 14px; }
.publish-error:empty { display: none; }
.publish-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.publish-actions .spacer { flex: 1; }
.publish-actions a.btn { text-decoration: none; }
.danger-link { color: var(--error); }