/* <pc-slug-redirects>: accordion below the slug field listing the URLs that 301 here.
   The accordion chrome itself comes from Accordion.css (.rd-accordion); only the
   list and the add row live here. */

pc-slug-redirects {
	display: block;
	margin-top: var(--rd-spacing-x-sm);
	max-width: 600px;
}

/* Accordion.css indents content to clear a left-hand chevron; this accordion puts the
   chevron on the right, so the gutter is dead space. Scoped here rather than changed in
   Accordion.css, which three other components share. */
.rd-slug-redirects .rd-details-content {
	padding-left: 0;
}

.rd-slug-redirects-empty {
	color: var(--rd-gray-500);
	margin-bottom: var(--rd-spacing-x-sm);
}

.rd-slug-redirects-list {
	list-style: none;
	margin: 0 0 var(--rd-spacing-x-sm);
	padding: 0;
}

.rd-slug-redirects-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--rd-spacing-x-sm);
	padding: var(--rd-spacing-x-sm) 0;
	border-bottom: 1px solid var(--rd-gray-300);
}

.rd-slug-redirects-row:last-child {
	border-bottom: 0;
}

/* Slugs are long; keep them on one line instead of widening the form. */
.rd-slug-redirects-slug {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.rd-slug-redirects-actions {
	display: flex;
	align-items: center;
	gap: var(--rd-spacing-x-sm);
	flex: 0 0 auto;
}

.rd-slug-redirects-edit-input {
	flex: 1 1 auto;
	min-width: 0;
}

.rd-slug-redirects-add {
	display: flex;
	gap: var(--rd-spacing-x-sm);
}

.rd-slug-redirects-add input {
	flex: 1 1 auto;
	min-width: 0;
}