/*
 * XML Sitemap Generator: the few rules its screens need on top of the CultDevOps design language
 * (assets/css/cdo-ui.css). No framework, no icon font: icons are Dashicons from WordPress.
 * Logical properties keep right-to-left screens correct.
 */

/* "What is this?" under the name of a field or setting: its own line, also above the URL count stepper and next to
   a short setting name. */
.cdo-ui .cdo-field > .cultxmsi-whatis,
.cdo-ui .form-table th > .cultxmsi-whatis {
	display: flex;
	width: fit-content;
}

/* Home: what the plugin does, four short lines with an icon each. */
.cdo-ui .cultxmsi-feature-list {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: var(--cdo-space-4) var(--cdo-gap);
	margin: 0;
	padding: 0;
	list-style: none;
}

.cdo-ui .cultxmsi-feature-list li {
	display: flex;
	gap: var(--cdo-space-3);
	margin: 0;
}

.cdo-ui .cultxmsi-feature-list .dashicons {
	flex: 0 0 auto;
	color: var(--cdo-text-muted);
}

.cdo-ui .cultxmsi-feature-list strong {
	display: block;
}

/* Start box and premium feeds: plain lists. */
.cdo-ui .cultxmsi-start ul,
.cdo-ui .cultxmsi-premium-feeds ul {
	margin: var(--cdo-space-3) 0;
	padding-inline-start: var(--cdo-space-5);
	list-style: disc;
}

/* Form of a sitemap or feed: a checkbox option sits next to its label. */
.cdo-ui .cdo-choice-row {
	display: flex;
	align-items: flex-start;
	gap: var(--cdo-space-2);
}

.cdo-ui .cdo-choice-row input[type="checkbox"] {
	margin: 2px 0 0;
}

.cdo-ui .cdo-choice-row label {
	font-weight: var(--cdo-weight-strong);
}

/* Result of a generation: the premium line under the message. */
.cdo-ui .cultxmsi-result p {
	margin: 0 0 var(--cdo-space-2);
}

.cdo-ui .cultxmsi-result p:last-child {
	margin-block-end: 0;
}

/* List: long addresses break anywhere; the two action buttons stay together. */
.cdo-ui .cultxmsi-url-cell a {
	overflow-wrap: anywhere;
}

.cdo-ui .cultxmsi-url-cell .cultxmsi-state-note {
	margin: var(--cdo-space-1) 0 0;
}

.cdo-ui .cultxmsi-row-actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--cdo-space-1);
}

.cdo-ui .cultxmsi-table .cdo-badge {
	margin-block-end: var(--cdo-space-1);
}

.cdo-ui .cultxmsi-pagination {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--cdo-space-2) var(--cdo-space-4);
}

.cdo-ui .cultxmsi-pagination .description,
.cdo-ui .cultxmsi-pagination .cdo-pagination {
	margin: 0;
}

/* Preview of a sitemap in the dialog. */
.cdo-ui .cultxmsi-loading {
	display: flex;
	align-items: center;
	gap: var(--cdo-space-2);
}

.cdo-ui .cultxmsi-loading .spinner {
	float: none;
	margin: 0;
}

.cdo-ui .cultxmsi-preview-code {
	min-height: 0;
	max-height: 60vh;
	margin: var(--cdo-space-3) 0;
	overflow: auto;
	background: var(--cdo-surface-muted);
}

/* Settings: the index address may be long. */
.cdo-ui .cultxmsi-index-url a {
	overflow-wrap: anywhere;
}

/* Quality report: numbers line up. */
.cdo-ui .cultxmsi-report-table .cultxmsi-report-count {
	text-align: end;
	font-variant-numeric: tabular-nums;
}

.cdo-ui .cultxmsi-feed-report .cultxmsi-report-table {
	margin: var(--cdo-space-3) 0;
}

/* Premium module: News settings and Google category fields. */
.cdo-ui .cultxmsi-premium-news {
	margin: var(--cdo-space-5) 0 0;
	padding: var(--cdo-space-4) 0 0;
	border: 0;
	border-block-start: 1px solid var(--cdo-border);
}

.cdo-ui .cultxmsi-premium-news legend {
	padding: 0;
	font-size: var(--cdo-text-m);
	font-weight: var(--cdo-weight-strong);
}

.cdo-ui .cultxmsi-premium-choice {
	display: inline-flex;
	align-items: center;
	gap: var(--cdo-space-1);
	margin-inline-end: var(--cdo-space-4);
}

.cdo-ui .cultxmsi-tight {
	margin-block-end: var(--cdo-space-1);
}

.cdo-ui .cultxmsi-gap {
	margin-block-start: var(--cdo-space-4);
}

/* Answer of a list action (delete), above the blocks. */
.cdo-ui .cultxmsi-list-notice .notice {
	margin: 0 0 var(--cdo-gap);
}

/* List on a phone: the table keeps readable columns and scrolls inside its card (.cdo-scroll) instead of squeezing. */
.cdo-ui .cultxmsi-table {
	min-width: 640px;
}

/* Name of a feature that the premium plan extends, above its "Premium" badge (a <details>, no field). */
.cdo-ui .cultxmsi-premium-name {
	margin: 0;
	font-weight: var(--cdo-weight-strong);
}

.cdo-ui .cultxmsi-premium-row .cdo-hint {
	margin-block-start: var(--cdo-space-1);
}
