/* Perfect Documents — frontend profile + admin upload page. Scoped under .pd-profile. */

.pd-profile {
	--pd-accent: #1d4ed8;
	--pd-accent-dark: #1e3a8a;
	--pd-accent-soft: #eff4ff;
	--pd-text: #1f2937;
	--pd-muted: #6b7280;
	--pd-border: #e5e7eb;
	--pd-bg: #ffffff;
	--pd-bg-soft: #f9fafb;
	--pd-danger: #b91c1c;
	--pd-success: #166534;
	--pd-folder: #d97706;
	--pd-radius: 10px;

	--pd-font: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;

	color: var(--pd-text);
	font-family: var(--pd-font);
	font-size: 15px;
	line-height: 1.5;
	max-width: 1100px;
	margin: 30px auto;
}

/* Inherit the plugin font through every control (buttons/inputs use
   font:inherit, but be explicit so themes can't win). */
.pd-profile input,
.pd-profile select,
.pd-profile textarea,
.pd-profile button,
.pd-profile .pd-label,
.pd-profile .ts-control,
.pd-profile .ts-dropdown {
	font-family: var(--pd-font);
}

.pd-profile *,
.pd-profile *::before,
.pd-profile *::after {
	box-sizing: border-box;
}

/* The hidden attribute must win over .pd-field's display:flex etc. */
.pd-profile [hidden] {
	display: none !important;
}

/* Auth notice — a centered, self-contained card. */
.pd-profile--notice {
	background: transparent;
	border: 0;
	padding: 0;
}

.pd-notice {
	max-width: 460px;
	margin: 48px auto;
	padding: 40px 32px;
	text-align: center;
	background: linear-gradient(180deg, #ffffff 0%, var(--pd-bg-soft) 100%);
	border: 1px solid var(--pd-border);
	border-radius: 18px;
	box-shadow: 0 18px 48px rgba(15, 23, 42, 0.10);
}

.pd-notice__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 68px;
	height: 68px;
	margin-bottom: 20px;
	border-radius: 50%;
	background: var(--pd-accent-soft);
	color: var(--pd-accent);
}

.pd-notice__icon svg {
	width: 32px;
	height: 32px;
}

.pd-notice__text {
	margin: 0 0 22px;
	font-size: 17px;
	font-weight: 600;
	line-height: 1.45;
	color: var(--pd-text);
}

.pd-notice__action {
	display: flex;
	justify-content: center;
}

.pd-notice__action .pd-btn {
	padding: 11px 28px;
}

/* Icons ------------------------------------------------------------------ */

.pd-icon {
	width: 18px;
	height: 18px;
	flex-shrink: 0;
}

/* Scoped so a page builder's `button svg` colour can't repaint the
   signature orange folder icon. */
.pd-profile .pd-icon--folder {
	color: var(--pd-folder);
}

.pd-profile .pd-icon--up,
.pd-profile .pd-icon--chevron {
	color: var(--pd-muted);
}

.pd-icon--plus {
	color: var(--pd-accent);
}

/* Tabs — hard reset so theme button styles can't bleed in ----------------- */

.pd-profile .pd-tabs {
	display: flex;
	gap: 4px;
	border-bottom: 2px solid var(--pd-border);
	margin-bottom: 20px;
}

.pd-profile .pd-tab,
.pd-profile .pd-tab:focus,
.pd-profile .pd-tab:active {
	appearance: none;
	-webkit-appearance: none;
	background: transparent;
	border: 0;
	border-bottom: 3px solid transparent;
	border-radius: 0;
	box-shadow: none;
	margin: 0 0 -2px 0;
	padding: 10px 18px;
	font-family: inherit;
	font-size: 15px;
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: normal;
	text-transform: none;
	text-decoration: none;
	white-space: nowrap;
	flex-shrink: 0;
	color: var(--pd-muted);
	cursor: pointer;
	transition: color 0.18s ease, border-color 0.18s ease;
}

.pd-profile .pd-tab:hover {
	background: transparent;
	border-bottom-color: transparent;
	color: var(--pd-accent);
}

.pd-profile .pd-tab.is-active,
.pd-profile .pd-tab.is-active:hover,
.pd-profile .pd-tab.is-active:focus {
	background: transparent;
	color: var(--pd-accent);
	border-bottom-color: var(--pd-accent);
}

.pd-profile .pd-tab:focus-visible {
	outline: 2px solid var(--pd-accent);
	outline-offset: -2px;
}

.pd-panel {
	display: none;
}

.pd-panel.is-active {
	display: block;
}

/* Alerts ----------------------------------------------------------------- */

.pd-alert {
	border-radius: var(--pd-radius);
	padding: 12px 16px;
	margin: 0 0 16px;
	font-size: 14px;
	border: 1px solid var(--pd-border);
	background: var(--pd-bg-soft);
	cursor: pointer;
	transition: opacity 0.22s ease, transform 0.22s ease;
}

/* Auto-dismiss / click-to-close fade-out before the box leaves the flow. */
.pd-alert--leaving {
	opacity: 0;
	transform: translateY(-4px);
	pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
	.pd-alert {
		transition: none;
	}
}

.pd-alert--error {
	border-color: #fecaca;
	background: #fef2f2;
	color: var(--pd-danger);
}

.pd-alert--success {
	border-color: #bbf7d0;
	background: #f0fdf4;
	color: var(--pd-success);
}

.pd-alert--info {
	border-color: #bfdbfe;
	background: var(--pd-accent-soft);
	color: var(--pd-accent);
}

/* Completion timestamp appended to job notifications. */
.pd-alert__time {
	opacity: 0.7;
	font-weight: 400;
	white-space: nowrap;
}

/* Dropzone ---------------------------------------------------------------- */

.pd-dropzone {
	border: 2px dashed var(--pd-border);
	border-radius: var(--pd-radius);
	background: var(--pd-bg-soft);
	padding: 36px 24px;
	text-align: center;
	cursor: pointer;
	transition: border-color 0.18s ease, background 0.18s ease;
	margin-bottom: 16px;
}

.pd-dropzone:hover,
.pd-dropzone.is-dragover {
	border-color: var(--pd-accent);
	background: var(--pd-accent-soft);
}

.pd-dropzone__hint {
	margin: 0 0 6px;
	font-weight: 600;
	font-size: 16px;
}

.pd-dropzone__sub {
	margin: 0;
	color: var(--pd-muted);
	font-size: 13px;
}

/* File preview cards -------------------------------------------------------- */

.pd-filelist {
	margin-bottom: 16px;
}

.pd-filerow--card {
	padding: 14px;
	border: 1px solid var(--pd-border);
	border-radius: var(--pd-radius);
	background: var(--pd-bg);
	margin-bottom: 10px;
	transition: border-color 0.18s ease, margin-left 0.18s ease, background 0.18s ease;
}

.pd-filerow--card:hover {
	border-color: var(--pd-accent);
}

/* Relation states: the main document is emphasized, attachments indent. */
.pd-filerow--card.is-main {
	border-color: var(--pd-accent);
	border-left: 4px solid var(--pd-accent);
	background: var(--pd-accent-soft);
}

.pd-filerow--card.is-child {
	margin-left: 28px;
	border-left: 4px solid var(--pd-border);
}

.pd-filerow__meta {
	display: flex;
	align-items: center;
	gap: 8px;
	min-width: 0;
	margin-bottom: 10px;
}

.pd-filerow__remove {
	margin-left: auto;
	flex-shrink: 0;
}

.pd-filerow__relation {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 10px;
	padding-top: 10px;
	border-top: 1px dashed var(--pd-border);
}

/* "Másold a többihez is" — right-aligned under the term fields. */
.pd-filerow__copyrow {
	display: flex;
	justify-content: flex-end;
	margin-top: 8px;
}

/* Live "Ide kerül: …" target path on every card. */
.pd-filerow__dest {
	display: flex;
	align-items: center;
	gap: 6px;
	margin-top: 10px;
	font-size: 12px;
	color: var(--pd-muted);
}

.pd-filerow__dest .pd-icon {
	flex-shrink: 0;
	width: 14px;
	height: 14px;
}

.pd-filerow__dest span {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* flatpickr: match the plugin accent and stay above the modal overlay. */
.flatpickr-calendar {
	z-index: 100001;
}

.flatpickr-day.selected,
.flatpickr-day.selected:hover,
.flatpickr-day.selected:focus {
	background: #1d4ed8;
	border-color: #1d4ed8;
}

/* FŐ | MELLÉKLET segmented role toggle — the words live in the control. */
.pd-rolepick {
	display: inline-flex;
	border: 1px solid var(--pd-border);
	border-radius: 999px;
	overflow: hidden;
	background: var(--pd-bg);
}

.pd-profile .pd-rolepick__opt,
.pd-profile .pd-rolepick__opt:focus,
.pd-profile .pd-rolepick__opt:active {
	appearance: none;
	-webkit-appearance: none;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	font-family: inherit;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--pd-muted);
	padding: 6px 14px;
	cursor: pointer;
	transition: background 0.18s ease, color 0.18s ease;
}

.pd-profile .pd-rolepick__opt + .pd-rolepick__opt {
	border-left: 1px solid var(--pd-border);
}

.pd-profile .pd-rolepick__opt:hover {
	color: var(--pd-accent);
	background: var(--pd-accent-soft);
}

.pd-profile .pd-rolepick__opt--main.is-active {
	background: var(--pd-accent);
	color: #fff;
}

.pd-profile .pd-rolepick__opt--child.is-active {
	background: #fef3c7;
	color: #92400e;
}

/* Single role badge above the file name. */
.pd-filerow__role {
	margin-bottom: 8px;
}

.pd-badge--child {
	background: #fef3c7;
	color: #92400e;
	text-transform: none;
	letter-spacing: 0;
}

.pd-badge--main {
	background: var(--pd-accent);
	color: #fff;
	text-transform: none;
	letter-spacing: 0;
}

.pd-relationtag {
	display: flex;
	align-items: center;
	gap: 6px;
	margin-top: 4px;
	font-size: 12px;
	color: var(--pd-muted);
}

.pd-filerow__name {
	font-weight: 600;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.pd-filerow__size {
	color: var(--pd-muted);
	font-size: 13px;
	flex-shrink: 0;
}

/* Folder picker ------------------------------------------------------------ */

.pd-picker {
	border: 1px solid var(--pd-border);
	border-radius: var(--pd-radius);
	background: var(--pd-bg);
	overflow: hidden;
}

.pd-picker__selected {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px;
	padding: 12px 14px;
	background: var(--pd-accent-soft);
	border-bottom: 1px solid var(--pd-border);
}

.pd-picker__selected-label {
	color: var(--pd-muted);
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	margin-right: 8px;
}

/* Collapsed picker = a single "Ide kerül: …" bar with a toggle button. */
.pd-picker.is-collapsed .pd-picker__selected {
	border-bottom: 0;
}

.pd-profile .pd-picker__toggle {
	margin-left: auto;
	flex-shrink: 0;
}

.pd-picker__path {
	display: inline-flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 2px;
	font-size: 14px;
}

.pd-picker__path-static {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	font-weight: 600;
}

.pd-picker__path-new {
	color: var(--pd-accent);
}

.pd-picker__toolbar {
	display: flex;
	gap: 8px;
	align-items: center;
	padding: 10px 14px;
	border-bottom: 1px solid var(--pd-border);
	flex-wrap: wrap;
}

.pd-picker__search {
	flex: 1;
	min-width: 180px;
}

.pd-picker .pd-alert {
	margin: 10px 14px;
}

.pd-picker__list {
	max-height: 240px;
	overflow-y: auto;
	padding: 6px;
}

/* Folder rows are <button>s, so a page builder's global button styling
   (Elementor especially) would otherwise paint them with its own
   background/colour. Scope every row rule under .pd-profile — the same
   (0,2,0) specificity the .pd-foldercard rules already use to win over
   Elementor — and pin the background to a FIXED white so nothing bleeds
   through. No !important needed; the scoped selector is enough. */
.pd-profile .pd-picker__row,
.pd-profile .pd-picker__row:focus,
.pd-profile .pd-picker__row:active {
	appearance: none;
	-webkit-appearance: none;
	display: flex;
	width: 100%;
	align-items: center;
	gap: 10px;
	padding: 10px 12px;
	border: 0;
	border-radius: 8px;
	background: var(--pd-bg);
	box-shadow: none;
	font-family: inherit;
	font-size: 14px;
	font-weight: 500;
	color: var(--pd-text);
	text-align: left;
	cursor: pointer;
	transition: background 0.18s ease, color 0.18s ease;
}

.pd-profile .pd-picker__row:hover {
	background: var(--pd-accent-soft);
	color: var(--pd-accent);
}

.pd-profile .pd-picker__row--up {
	color: var(--pd-muted);
	font-weight: 400;
}

.pd-picker__name {
	flex: 1;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.pd-picker__count {
	flex-shrink: 0;
	font-size: 12px;
	font-weight: 600;
	color: var(--pd-muted);
	background: var(--pd-bg-soft);
	border: 1px solid var(--pd-border);
	border-radius: 999px;
	padding: 2px 9px;
	transition: color 0.18s ease, border-color 0.18s ease;
}

.pd-profile .pd-picker__row:hover .pd-picker__count {
	color: var(--pd-accent);
	border-color: var(--pd-accent);
	background: var(--pd-bg);
}

.pd-profile .pd-picker__row--create {
	border-top: 1px dashed var(--pd-border);
	border-radius: 0 0 8px 8px;
	margin-top: 4px;
	padding-top: 12px;
	padding-bottom: 12px;
}

.pd-profile .pd-picker__list.is-busy .pd-picker__row {
	pointer-events: none;
	opacity: 0.55;
}

.pd-profile .pd-picker__list.is-busy .pd-picker__row--create.is-loading {
	opacity: 1;
}

.pd-profile .pd-picker__row--create.is-loading {
	cursor: default;
}

.pd-profile .pd-picker__row--create.is-loading .pd-picker__createtitle {
	color: var(--pd-accent);
}

.pd-profile .pd-picker__row--create .pd-icon--plus {
	color: var(--pd-accent);
}

.pd-picker__createbody {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.pd-picker__createtitle {
	font-weight: 600;
	color: var(--pd-accent);
}

.pd-picker__createtitle strong {
	font-weight: 700;
}

.pd-picker__createpath {
	font-size: 12px;
	color: var(--pd-muted);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.pd-picker__empty {
	padding: 16px;
	margin: 0;
	color: var(--pd-muted);
	text-align: center;
	font-size: 14px;
}

/* "/ means subfolder" tip under the create row (picker + folder browser). */
.pd-picker__hint {
	margin: 6px 0 0;
	padding: 4px 12px 8px;
	font-size: 12px;
	color: var(--pd-muted);
}

.pd-modal .pd-picker__list {
	max-height: 160px;
}

/* Forms ------------------------------------------------------------------- */

.pd-form__row {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
	gap: 16px;
	margin-bottom: 16px;
}

.pd-field {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin-bottom: 16px;
}

.pd-form__row .pd-field {
	margin-bottom: 0;
}

.pd-label {
	font-size: 13px;
	font-weight: 600;
	color: var(--pd-muted);
}

.pd-hint {
	font-size: 12px;
	color: var(--pd-muted);
}

/* Boxed secondary fields (URL import, date+time) — soft card behind the
   inputs so they never sit "barefoot" on the page background. */
.pd-urlimport,
.pd-fieldbox {
	border: 1px dashed var(--pd-border);
	border-radius: var(--pd-radius);
	background: var(--pd-bg-soft);
	padding: 12px 14px;
	transition: border-color 0.18s ease;
}

.pd-urlimport:focus-within,
.pd-fieldbox:focus-within {
	border-color: var(--pd-accent);
}

/* URL input + Hozzáadás button / date input + folder button on one line. */
.pd-urladd,
.pd-dateadd {
	display: flex;
	gap: 8px;
	align-items: center;
	flex-wrap: wrap;
}

.pd-urladd .pd-input,
.pd-dateadd .pd-input {
	flex: 1;
	min-width: 200px;
}

.pd-urladd .pd-btn,
.pd-dateadd .pd-btn {
	flex-shrink: 0;
}

/* Theme-proof input box: themes restyle input[type=…] with attribute
   selectors that beat a bare class — pin the box on every state. */
.pd-profile .pd-input,
.pd-profile .pd-input:hover,
.pd-profile .pd-input:focus {
	width: 100%;
	padding: 9px 12px;
	border: 1px solid var(--pd-border);
	border-radius: 8px;
	background: var(--pd-bg);
	font: inherit;
	font-size: 14px;
	color: var(--pd-text);
	box-shadow: none;
	transition: border-color 0.18s ease;
}

.pd-profile .pd-input:hover {
	border-color: #cbd5e1;
}

.pd-profile .pd-input:focus {
	outline: 2px solid var(--pd-accent);
	outline-offset: 1px;
	border-color: var(--pd-accent);
}

.pd-check {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	cursor: pointer;
	padding-top: 4px;
}

.pd-form__actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 10px;
}

/* Buttons ------------------------------------------------------------------ */

.pd-profile .pd-btn {
	appearance: none;
	-webkit-appearance: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	border: 1px solid transparent;
	border-radius: 8px;
	padding: 10px 20px;
	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: normal;
	text-transform: none;
	cursor: pointer;
	text-decoration: none;
	box-shadow: none;
	transition: background 0.18s ease, color 0.18s ease, border-color 0.18s ease;
}

/* Theme-proof state pinning: geometry and typography may NEVER change on
   hover/focus/active (themes love to restyle button states) — colors and
   borders stay with the variant rules below. */
.pd-profile .pd-btn:hover,
.pd-profile .pd-btn:focus,
.pd-profile .pd-btn:active {
	appearance: none;
	-webkit-appearance: none;
	padding: 10px 20px;
	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.4;
	letter-spacing: normal;
	text-transform: none;
	text-decoration: none;
	box-shadow: none;
	outline-offset: 2px;
}

.pd-profile .pd-btn--primary {
	background: var(--pd-accent);
	color: #fff;
}

.pd-profile .pd-btn--primary:hover {
	background: var(--pd-accent-dark);
	color: #fff;
}

.pd-profile .pd-btn--primary:disabled {
	opacity: 0.6;
	cursor: not-allowed;
}

/* While an upload is actually running, the wait cursor tells the story. */
.pd-profile .pd-btn--primary.is-busy:disabled {
	cursor: wait;
}

.pd-profile .pd-btn--ghost {
	background: var(--pd-bg);
	border-color: var(--pd-border);
	color: var(--pd-text);
}

.pd-profile .pd-btn--ghost:hover {
	background: var(--pd-bg);
	border-color: var(--pd-accent);
	color: var(--pd-accent);
}

.pd-profile .pd-btn--danger {
	background: var(--pd-bg);
	border-color: #fecaca;
	color: var(--pd-danger);
}

.pd-profile .pd-btn--danger:hover {
	background: #fef2f2;
	color: var(--pd-danger);
}

/* State selectors too — the base reset pins padding on focus/hover/active
   with higher specificity, so the small variant must pin its own. */
.pd-profile .pd-btn--small,
.pd-profile .pd-btn--small:focus,
.pd-profile .pd-btn--small:hover,
.pd-profile .pd-btn--small:active {
	padding: 5px 12px;
	font-size: 13px;
}

.pd-profile .pd-btn:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

/* Progress ------------------------------------------------------------------ */

.pd-progress {
	height: 8px;
	border-radius: 999px;
	background: var(--pd-border);
	overflow: hidden;
	margin-bottom: 16px;
}

.pd-progress__bar {
	height: 100%;
	width: 0%;
	background: var(--pd-accent);
	border-radius: 999px;
	transition: width 0.2s ease;
}

/* Toolbar / filters ----------------------------------------------------------- */

.pd-toolbar {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
	gap: 10px;
	align-items: center;
	margin-bottom: 16px;
}

/* Table ------------------------------------------------------------------------ */

.pd-tablewrap {
	overflow-x: auto;
	border: 1px solid var(--pd-border);
	border-radius: var(--pd-radius);
	background: var(--pd-bg);
}

.pd-tablewrap.is-loading,
.pd-browser-content.is-loading {
	opacity: 0.5;
	pointer-events: none;
	transition: opacity 0.18s ease;
}

.pd-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
	margin: 0;
}

.pd-table th {
	text-align: left;
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--pd-muted);
	padding: 12px 14px;
	border-bottom: 1px solid var(--pd-border);
	background: var(--pd-bg-soft);
	white-space: nowrap;
}

.pd-table td {
	padding: 12px 14px;
	border-bottom: 1px solid var(--pd-border);
	vertical-align: middle;
}

.pd-table tbody tr {
	transition: background 0.18s ease;
}

.pd-table tbody tr:last-child td {
	border-bottom: 0;
}

.pd-table tbody tr:hover {
	background: var(--pd-bg-soft);
}

.pd-cell-title a {
	font-weight: 600;
	color: var(--pd-accent);
	text-decoration: none;
	transition: color 0.18s ease;
}

.pd-cell-title a:hover {
	color: var(--pd-accent-dark);
	text-decoration: underline;
}

.pd-cell-title__file {
	font-size: 12px;
	color: var(--pd-muted);
	margin-top: 2px;
}

.pd-cell-type {
	white-space: nowrap;
}

/* Main document that has attachments: no bottom border, so it visually
   joins the nested sub-table row directly beneath it. */
.pd-table tbody tr.pd-row--main > td {
	border-bottom: 0;
}

/* Attachments as a NESTED sub-table, tucked under the main row. */
.pd-table tbody tr.pd-subrow:hover > td {
	background: transparent;
}

.pd-subrow > td {
	padding: 0 12px 12px 32px;
	background: var(--pd-bg-soft);
}

.pd-subtable {
	border: 1px solid var(--pd-border);
	border-left: 3px solid var(--pd-folder);
	border-radius: 0 0 8px 8px;
	background: var(--pd-bg);
	overflow: hidden;
}

.pd-subtable__head {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 8px 12px;
	background: var(--pd-bg-soft);
	border-bottom: 1px solid var(--pd-border);
}

.pd-subtable__count {
	font-size: 12px;
	font-weight: 600;
	color: var(--pd-muted);
}

.pd-subtable__table {
	width: 100%;
	border-collapse: collapse;
	font-size: 13px;
}

.pd-subtable__table td {
	padding: 8px 12px;
	border-top: 1px solid var(--pd-border);
	vertical-align: middle;
}

.pd-subtable__table tr:first-child td {
	border-top: 0;
}

.pd-subtable__title {
	width: 55%;
}

.pd-subtable__title a {
	font-weight: 600;
	color: var(--pd-accent);
	text-decoration: none;
}

.pd-subtable__title a:hover {
	text-decoration: underline;
}

/* Article tab ---------------------------------------------------------------- */

.pd-article .pd-article-editor {
	width: 100%;
	min-height: 320px;
}

/* TinyMCE toolbar — themes paint <button> black on hover; pin the editor's
   own light look so the icons stay visible. */
.pd-profile .mce-btn,
.pd-profile .mce-btn button,
.pd-profile .mce-btn:hover,
.pd-profile .mce-btn button:hover,
.pd-profile .mce-btn button:focus,
.pd-profile .mce-menubtn:hover,
.pd-profile .mce-menubtn button:hover {
	background-color: transparent !important;
	background-image: none !important;
	box-shadow: none !important;
	color: inherit !important;
	text-shadow: none !important;
}

.pd-profile .mce-btn:hover,
.pd-profile .mce-btn:focus,
.pd-profile .mce-menubtn:hover {
	background-color: #e2e6ec !important;
}

.pd-profile .mce-btn.mce-active,
.pd-profile .mce-btn.mce-active:hover {
	background-color: #cfd6e0 !important;
}

.pd-profile .mce-ico {
	color: #2b3440 !important;
}

/* The "Média hozzáadása" button above the editor. */
.pd-profile .wp-media-buttons .button:hover,
.pd-profile .wp-media-buttons .button:focus {
	background: #f0f1f3 !important;
	color: var(--pd-text) !important;
	box-shadow: none !important;
}

.pd-featured__preview {
	margin-bottom: 10px;
}

.pd-featured__preview img {
	max-width: 240px;
	height: auto;
	border-radius: 8px;
	border: 1px solid var(--pd-border);
	display: block;
}

.pd-featured__actions {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
}

.pd-article__result {
	margin-bottom: 12px;
}

/* Edit modal: rename + replace file controls. */
.pd-renamefield {
	display: flex;
	align-items: center;
	gap: 0;
}

.pd-renamefield .pd-input {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}

.pd-renamefield__ext {
	flex-shrink: 0;
	padding: 9px 12px;
	border: 1px solid var(--pd-border);
	border-left: 0;
	border-radius: 0 8px 8px 0;
	background: var(--pd-bg-soft);
	color: var(--pd-muted);
	font-size: 14px;
	font-weight: 600;
}

.pd-replace {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 10px;
	flex-wrap: wrap;
}

.pd-replace__info {
	font-size: 13px;
	color: var(--pd-muted);
	overflow: hidden;
	text-overflow: ellipsis;
}

.pd-modal__delete {
	margin-right: auto;
}

/* Upload mode switcher (Önálló / Melléklet) — full-width 50-50 tabs. */
.pd-modeswitch {
	display: flex;
	width: 100%;
	border: 1px solid var(--pd-border);
	border-radius: 12px;
	background: var(--pd-bg-soft);
	padding: 5px;
	margin-bottom: 18px;
	gap: 5px;
}

.pd-profile .pd-modeswitch__opt,
.pd-profile .pd-modeswitch__opt:hover,
.pd-profile .pd-modeswitch__opt:focus {
	appearance: none;
	-webkit-appearance: none;
	flex: 1 1 50%;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 0;
	border-radius: 9px;
	background: transparent;
	box-shadow: none;
	padding: 11px 18px;
	font-family: inherit;
	font-size: 15px;
	font-weight: 700;
	letter-spacing: normal;
	text-transform: none;
	color: var(--pd-muted);
	cursor: pointer;
	transition: background 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
}

.pd-profile .pd-modeswitch__opt:hover {
	color: var(--pd-accent);
}

.pd-profile .pd-modeswitch__opt.is-active {
	background: var(--pd-bg);
	color: var(--pd-accent);
	box-shadow: 0 2px 8px rgba(15, 23, 42, 0.12);
}

/* Parent document picker (attach mode). */
.pd-parentpicker__results {
	margin-top: 8px;
	border: 1px solid var(--pd-border);
	border-radius: 8px;
	background: var(--pd-bg);
	max-height: 260px;
	overflow-y: auto;
}

.pd-profile .pd-parentpicker__row,
.pd-profile .pd-parentpicker__row:hover,
.pd-profile .pd-parentpicker__row:focus {
	appearance: none;
	-webkit-appearance: none;
	display: flex;
	flex-direction: column;
	gap: 2px;
	width: 100%;
	border: 0;
	border-radius: 0;
	background: transparent;
	box-shadow: none;
	text-align: left;
	padding: 10px 12px;
	cursor: pointer;
	font-family: inherit;
	transition: background 0.18s ease;
}

.pd-profile .pd-parentpicker__row + .pd-parentpicker__row {
	border-top: 1px solid var(--pd-border);
}

.pd-profile .pd-parentpicker__row:hover {
	background: var(--pd-accent-soft);
}

.pd-parentpicker__title {
	font-weight: 600;
	color: var(--pd-text);
}

.pd-parentpicker__meta {
	font-size: 12px;
	color: var(--pd-muted);
}

.pd-parentpicker__empty {
	padding: 14px;
	text-align: center;
	color: var(--pd-muted);
	margin: 0;
}

.pd-parentpicker__selected {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 10px;
	padding: 10px 12px;
	border: 1px solid var(--pd-accent);
	border-radius: 8px;
	background: var(--pd-accent-soft);
}

.pd-parentpicker__lead {
	color: var(--pd-muted);
	font-size: 13px;
	font-weight: 600;
}

.pd-parentpicker__selected strong {
	flex: 1;
	min-width: 0;
	color: var(--pd-text);
}

.pd-parentpicker__loading {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 12px;
	color: var(--pd-muted);
	font-size: 14px;
}

/* Existing attachments of the chosen parent. */
.pd-parentpicker__children {
	margin-top: 10px;
}

.pd-parentpicker__childhead {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	font-weight: 600;
	color: var(--pd-muted);
	margin-bottom: 6px;
}

.pd-parentpicker__child {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 10px;
	border: 1px solid var(--pd-border);
	border-radius: 8px;
	background: var(--pd-bg);
	margin-bottom: 6px;
	transition: opacity 0.18s ease;
}

.pd-parentpicker__child.is-busy {
	opacity: 0.5;
	pointer-events: none;
}

.pd-parentpicker__childname {
	flex: 1;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 14px;
	color: var(--pd-accent);
	text-decoration: none;
}

.pd-parentpicker__childname:hover {
	text-decoration: underline;
}

/* Small icon button (e.g. delete an attachment inline). */
.pd-profile .pd-iconbtn,
.pd-profile .pd-iconbtn:hover,
.pd-profile .pd-iconbtn:focus {
	appearance: none;
	-webkit-appearance: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 30px;
	height: 30px;
	border: 1px solid var(--pd-border);
	border-radius: 7px;
	background: var(--pd-bg);
	box-shadow: none;
	color: var(--pd-muted);
	cursor: pointer;
	padding: 0;
	transition: color 0.18s ease, border-color 0.18s ease, background 0.18s ease;
}

.pd-profile .pd-iconbtn .pd-icon {
	width: 15px;
	height: 15px;
}

.pd-profile .pd-iconbtn--danger:hover,
.pd-profile .pd-iconbtn--danger:focus {
	color: var(--pd-danger);
	border-color: #fecaca;
	background: #fef2f2;
}

.pd-cell-actions {
	display: flex;
	gap: 6px;
	flex-wrap: wrap;
	align-items: center;
}

.pd-tagrow {
	display: flex;
	gap: 4px;
	flex-wrap: wrap;
	margin-top: 4px;
}

.pd-badge {
	display: inline-block;
	padding: 2px 8px;
	border-radius: 999px;
	background: var(--pd-accent-soft);
	color: var(--pd-accent);
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

.pd-badge--tag {
	background: var(--pd-bg-soft);
	color: var(--pd-muted);
	text-transform: none;
	letter-spacing: 0;
	font-weight: 600;
}

/* Document-type badge in the docs table — wears the term's colours
   (inline fg/bg), default accent pill when unset. */
.pd-badge--type {
	background: var(--pd-accent-soft);
	color: var(--pd-accent);
	text-transform: none;
	letter-spacing: 0;
	font-size: 12px;
	font-weight: 600;
}

/* Pagination ---------------------------------------------------------------------- */

.pd-pagination {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: 16px;
	flex-wrap: wrap;
}

.pd-pagination__info {
	font-size: 14px;
	color: var(--pd-muted);
}

.pd-pagination__total {
	margin-left: auto;
	font-size: 13px;
	color: var(--pd-muted);
}

/* Numbered pager (Dokumentumok + Összes cikk tabs) */
.pd-pager {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	flex-wrap: wrap;
}
.pd-pager__btn {
	min-width: 34px;
	height: 34px;
	padding: 0 9px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--pd-border);
	background: var(--pd-bg);
	color: var(--pd-text);
	border-radius: 8px;
	font-family: var(--pd-font);
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0;
	text-transform: none;
	box-shadow: none;
	cursor: pointer;
	transition: background 0.18s ease, color 0.18s ease, border-color 0.18s ease;
}
.pd-pager__btn:hover:not(:disabled):not(.is-current) {
	background: var(--pd-accent-soft);
	color: var(--pd-accent);
	border-color: var(--pd-accent-soft);
}
.pd-pager__btn.is-current {
	background: var(--pd-accent);
	color: #ffffff;
	border-color: var(--pd-accent);
	cursor: default;
}
.pd-pager__btn:disabled {
	opacity: 0.45;
	cursor: not-allowed;
}
.pd-pager__btn--nav {
	font-weight: 500;
}
.pd-pager__gap {
	padding: 0 4px;
	color: var(--pd-muted);
}

/* Toggle switch (e.g. "Csak a saját dokumentumaim") */
.pd-toggle {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	cursor: pointer;
	font-size: 14px;
	padding-top: 4px;
	user-select: none;
}
.pd-toggle input {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
}
.pd-toggle__track {
	position: relative;
	width: 40px;
	height: 22px;
	flex-shrink: 0;
	background: var(--pd-border);
	border-radius: 999px;
	transition: background 0.18s ease;
}
.pd-toggle__thumb {
	position: absolute;
	top: 2px;
	left: 2px;
	width: 18px;
	height: 18px;
	background: #ffffff;
	border-radius: 50%;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
	transition: transform 0.18s ease;
}
.pd-toggle input:checked + .pd-toggle__track {
	background: var(--pd-accent);
}
.pd-toggle input:checked + .pd-toggle__track .pd-toggle__thumb {
	transform: translateX(18px);
}
.pd-toggle input:focus-visible + .pd-toggle__track {
	outline: 2px solid var(--pd-accent);
	outline-offset: 2px;
}
.pd-toggle__label {
	color: var(--pd-text);
}

/* Empty / headings ------------------------------------------------------------------ */

.pd-empty {
	padding: 32px;
	text-align: center;
	color: var(--pd-muted);
}

.pd-subheading {
	font-size: 14px;
	font-weight: 700;
	margin: 20px 0 10px;
	color: var(--pd-text);
}

/* Breadcrumbs (picker + folder browser) ----------------------------------------------- */

.pd-profile .pd-crumb,
.pd-profile .pd-crumb:focus,
.pd-profile .pd-crumb:active {
	appearance: none;
	-webkit-appearance: none;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	background: transparent;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	padding: 2px 4px;
	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: normal;
	text-transform: none;
	color: var(--pd-accent);
	cursor: pointer;
	transition: color 0.18s ease;
}

.pd-profile .pd-crumb:hover {
	background: transparent;
	color: var(--pd-accent-dark);
	text-decoration: underline;
}

.pd-crumb-sep {
	color: var(--pd-muted);
}

.pd-breadcrumb {
	display: flex;
	align-items: center;
	gap: 4px;
	flex-wrap: wrap;
	margin-bottom: 14px;
	font-size: 14px;
}

.pd-browser-actions {
	display: flex;
	gap: 8px;
	align-items: center;
	margin-bottom: 14px;
	flex-wrap: wrap;
}

.pd-browser-actions .pd-input {
	max-width: 260px;
}

.pd-browser-actions .pd-browser__search {
	flex: 1;
	min-width: 200px;
	max-width: none;
}

.pd-foldergrid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 10px;
	margin-bottom: 8px;
}

/* Create row in the folder browser search results — same anatomy as the
   picker's create row, but standalone card look below the match grid. */
.pd-browser-create {
	margin: 4px 0 14px;
}

.pd-browser-create .pd-picker__row--create {
	margin-top: 0;
	border: 1px dashed var(--pd-border);
	border-radius: var(--pd-radius);
	background: var(--pd-bg);
	transition: background 0.18s ease, border-color 0.18s ease;
}

.pd-browser-create button.pd-picker__row--create:hover {
	background: var(--pd-accent-soft);
	border-color: var(--pd-accent);
}

.pd-profile .pd-foldercard,
.pd-profile .pd-foldercard:focus {
	appearance: none;
	-webkit-appearance: none;
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 14px;
	border: 1px solid var(--pd-border);
	border-radius: var(--pd-radius);
	background: var(--pd-bg);
	box-shadow: none;
	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: normal;
	text-transform: none;
	color: var(--pd-text);
	cursor: pointer;
	text-align: left;
	transition: border-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
	min-width: 0;
}

.pd-profile .pd-foldercard:hover {
	background: var(--pd-bg);
	border-color: var(--pd-accent);
	color: var(--pd-accent);
	box-shadow: 0 2px 8px rgba(29, 78, 216, 0.08);
}

.pd-foldercard__body {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.pd-foldercard__name {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.pd-foldercard__meta {
	font-size: 12px;
	font-weight: 500;
	color: var(--pd-muted);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	transition: color 0.18s ease;
}

/* Action cluster (rename / delete) pinned to the card's right edge. */
.pd-foldercard__actions {
	display: inline-flex;
	align-items: center;
	gap: 2px;
	margin-left: auto;
	flex-shrink: 0;
}

/* Rename control — on every folder card, for moderators and admins. */
.pd-foldercard__rename,
.pd-foldercard__del {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 26px;
	height: 26px;
	border-radius: 6px;
	color: var(--pd-muted);
	cursor: pointer;
	transition: color 0.18s ease, background 0.18s ease;
}

.pd-foldercard__rename:hover,
.pd-foldercard__rename:focus-visible {
	color: var(--pd-accent);
	background: #eff4ff;
}

/* Delete control on file-less folder cards. */
.pd-foldercard__del:hover,
.pd-foldercard__del:focus-visible {
	color: var(--pd-danger);
	background: #fef2f2;
}

.pd-foldercard__rename .pd-icon,
.pd-foldercard__del .pd-icon {
	width: 14px;
	height: 14px;
}

/* Folders that go deeper get an amber emphasis stripe. */
.pd-profile .pd-foldercard--rich {
	border-left: 3px solid var(--pd-folder);
}

.pd-profile .pd-foldercard--rich:hover {
	border-left-color: var(--pd-accent);
}

.pd-foldergrid--search .pd-foldercard__name {
	font-size: 13px;
}

.pd-profile .pd-foldercard--skeleton,
.pd-profile .pd-foldercard--skeleton:hover {
	flex-direction: column;
	align-items: flex-start;
	gap: 8px;
	border-color: var(--pd-border);
	box-shadow: none;
	cursor: default;
	pointer-events: none;
}

/* Modal -------------------------------------------------------------------------------- */

.pd-modal-overlay {
	position: fixed;
	inset: 0;
	background: rgba(17, 24, 39, 0.55);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 99999;
	padding: 20px;
}

.pd-modal {
	background: var(--pd-bg);
	border-radius: var(--pd-radius);
	padding: 24px;
	width: 100%;
	max-width: 520px;
	max-height: 90vh;
	overflow-y: auto;
	box-shadow: 0 20px 50px rgba(0, 0, 0, 0.25);
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.pd-modal__title {
	margin: 0 0 10px;
	font-size: 18px;
}

.pd-modal__actions {
	display: flex;
	justify-content: flex-end;
	gap: 10px;
	margin-top: 6px;
}

/* Folder rename modal: compact, with a live full-path preview. */
.pd-modal--rename {
	max-width: 440px;
}

.pd-renamepreview {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 6px;
	margin: 2px 0 4px;
	font-size: 13px;
}

.pd-renamepreview__label {
	color: var(--pd-muted);
	font-weight: 600;
}

.pd-renamepreview__path {
	color: var(--pd-accent);
	font-weight: 600;
	word-break: break-word;
}

/* Confirm-style modal (date-folder reminder). */
.pd-modal--confirm {
	max-width: 480px;
}

.pd-modal__text {
	margin: 0 0 4px;
	font-size: 14px;
	line-height: 1.55;
	color: var(--pd-text);
}

.pd-modal--confirm .pd-modal__actions {
	flex-wrap: wrap;
}

/* Inline warning shown when the upload destination is still the root —
   full-width, left-aligned, sits on its own line ABOVE the submit button. */
.pd-roothint {
	flex-basis: 100%;
	margin: 0 0 4px;
	text-align: left;
	color: var(--pd-danger);
	font-weight: 600;
}

/* Tom Select skin — type/issuer/tag fields, matched to .pd-input ------------ */

.pd-profile .ts-wrapper {
	min-width: 0;
}

.pd-profile .ts-control {
	border: 1px solid var(--pd-border);
	border-radius: 8px;
	padding: 9px 12px;
	font-size: 14px;
	color: var(--pd-text);
	background: var(--pd-bg);
	box-shadow: none;
	min-height: 0;
	transition: border-color 0.18s ease;
}

.pd-profile .ts-wrapper:hover .ts-control {
	border-color: #cbd5e1;
}

.pd-profile .ts-wrapper.focus .ts-control {
	outline: 2px solid var(--pd-accent);
	outline-offset: 1px;
	border-color: var(--pd-accent);
	box-shadow: none;
}

.pd-profile .ts-control input {
	font-size: 14px;
	color: var(--pd-text);
}

.pd-profile .ts-dropdown {
	border: 1px solid var(--pd-border);
	border-radius: 8px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.12);
	font-size: 14px;
	z-index: 100000;
}

.pd-profile .ts-dropdown .option,
.pd-profile .ts-dropdown .create,
.pd-profile .ts-dropdown .no-results {
	padding: 9px 12px;
}

.pd-profile .ts-dropdown .active {
	background: var(--pd-accent-soft);
	color: var(--pd-accent);
}

.pd-profile .ts-dropdown .create strong {
	color: var(--pd-accent);
}

/* Tag chips — badge look, instant feedback on comma. */
.pd-profile .ts-wrapper.multi .ts-control > .item {
	background: var(--pd-accent-soft);
	color: var(--pd-accent);
	border: 0;
	border-radius: 999px;
	padding: 2px 8px;
	font-size: 12px;
	font-weight: 600;
	margin: 2px 6px 2px 0;
}

.pd-profile .ts-wrapper.multi .ts-control > .item .remove {
	border-left: 0;
	padding-left: 4px;
	color: var(--pd-accent);
	border-radius: 0 999px 999px 0;
	transition: color 0.18s ease;
}

.pd-profile .ts-wrapper.multi .ts-control > .item .remove:hover {
	background: transparent;
	color: var(--pd-danger);
}

/* Spinner ------------------------------------------------------------------ */

.pd-spinner {
	width: 18px;
	height: 18px;
	flex-shrink: 0;
	border: 2px solid var(--pd-border);
	border-top-color: var(--pd-accent);
	border-radius: 50%;
	animation: pd-spin 0.7s linear infinite;
}

@keyframes pd-spin {
	to {
		transform: rotate(360deg);
	}
}

/* Loading skeletons ---------------------------------------------------------- */

.pd-skeleton {
	display: inline-block;
	height: 13px;
	border-radius: 6px;
	background: linear-gradient(90deg, #eceef1 25%, #f6f7f9 45%, #eceef1 65%);
	background-size: 300% 100%;
	animation: pd-shimmer 1.2s ease-in-out infinite;
}

@keyframes pd-shimmer {
	from {
		background-position: 100% 0;
	}

	to {
		background-position: -100% 0;
	}
}

.pd-skeletonrows--boxed {
	border: 1px solid var(--pd-border);
	border-radius: var(--pd-radius);
	background: var(--pd-bg);
	padding: 6px 0;
}

.pd-skeletonrow {
	display: flex;
	gap: 14px;
	align-items: center;
	padding: 14px;
	border-bottom: 1px solid var(--pd-bg-soft);
}

.pd-skeletonrow:last-child {
	border-bottom: 0;
}

.pd-skeletonwrap .pd-skeletonrows {
	margin-top: 16px;
	border: 1px solid var(--pd-border);
	border-radius: var(--pd-radius);
	background: var(--pd-bg);
}

/* wp-admin surface ------------------------------------------------------------------------- */

.pd-admin-wrap .pd-profile {
	margin: 20px 0 0;
	max-width: 1100px;
}

/* Responsive ---------------------------------------------------------------------------- */

@media (max-width: 720px) {
	/* Small side margin so the profile never sits flush against the edges. */
	.pd-profile {
		margin-left: 12px;
		margin-right: 12px;
	}

	.pd-filerow {
		grid-template-columns: 1fr;
	}

	/* Folder grid drops to a single column on phones. */
	.pd-foldergrid {
		grid-template-columns: 1fr;
	}

	/* Tabs stay on one line each and scroll sideways instead of wrapping. */
	.pd-tabs {
		overflow-x: auto;
		flex-wrap: nowrap;
		-webkit-overflow-scrolling: touch;
	}

	.pd-table th,
	.pd-table td {
		padding: 10px 10px;
	}

	.pd-pagination__total {
		margin-left: 0;
		width: 100%;
	}
}

/* Articles manager ("Összes cikk") ------------------------------------------------ */

.pd-doc-title {
	display: block;
	font-weight: 600;
	color: var(--pd-text);
}

.pd-doc-sub {
	display: block;
	margin-top: 2px;
	font-size: 12px;
	color: var(--pd-muted);
}

.pd-loading {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 24px;
	color: var(--pd-muted);
}

/* Article status badges */
.pd-badge--status {
	text-transform: none;
	letter-spacing: 0;
	font-weight: 600;
	font-size: 12px;
}
.pd-badge--publish { background: #ecfdf5; color: var(--pd-success); }
.pd-badge--future { background: #eff6ff; color: var(--pd-accent); }
.pd-badge--draft { background: var(--pd-bg-soft); color: var(--pd-muted); }
.pd-badge--pending { background: #fefce8; color: #854d0e; }
.pd-badge--private { background: #faf5ff; color: #6b21a8; }
.pd-badge--trash { background: #fef2f2; color: var(--pd-danger); }

/* Muted placeholders so an empty date / scheduler field is clearly distinct
   from a filled-in value (they were reading almost the same colour). */
.pd-input::placeholder {
	color: var(--pd-muted);
	opacity: 1;
}

/* Article create result line — the link to the published / scheduled post. */
.pd-article__result {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
	margin-bottom: 10px;
}
.pd-article__resultlabel {
	color: var(--pd-muted);
	font-size: 13px;
}

/* Hierarchical category picker (article create + edit) */
.pd-catfield {
	display: flex;
	flex-direction: column;
	gap: 8px;
}
/* Native multi-select fallback height — Tom Select normally replaces this
   <select> with a chip control. */
.pd-catselect {
	min-height: 96px;
}
.pd-catfield__create {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 8px;
	border: 1px dashed var(--pd-border);
	border-radius: var(--pd-radius);
	background: var(--pd-bg-soft);
}
.pd-catfield__row {
	display: flex;
	gap: 8px;
	align-items: center;
	flex-wrap: wrap;
}
.pd-catfield__row .pd-input {
	flex: 1 1 auto;
	min-width: 120px;
}
.pd-catfield__row .pd-btn {
	flex: 0 0 auto;
}