/**
 * Public directory submissions.
 *
 * Loaded only on submission/account surfaces. Selectors are isolated from the
 * surrounding WordPress theme and reuse the directory design tokens.
 */

.snm-directory-submission {
	--snm-submission-surface: var(--snm-directory-surface, #ffffff);
	--snm-submission-surface-soft: var(--snm-directory-surface-soft, #eef3f8);
	--snm-submission-text: var(--snm-directory-text, #172033);
	--snm-submission-heading: var(--snm-directory-heading, var(--snm-submission-text));
	--snm-submission-muted: var(--snm-directory-muted, #5d6a7d);
	--snm-submission-border: var(--snm-directory-border, #d6dee9);
	--snm-submission-accent: var(--snm-directory-accent, #176b87);
	--snm-submission-accent-strong: var(--snm-directory-accent-strong, #10566e);
	--snm-submission-accent-soft: var(--snm-directory-accent-soft, #dff2f6);
	--snm-submission-danger: var(--snm-directory-danger, #b42318);
	--snm-submission-danger-soft: var(--snm-directory-danger-soft, #fff0ee);
	--snm-submission-success: var(--snm-directory-success, #18794e);
	--snm-submission-success-soft: var(--snm-directory-success-soft, #e5f6ed);
	--snm-submission-warning: var(--snm-directory-warning, #a85b00);
	--snm-submission-warning-soft: var(--snm-directory-warning-soft, #fff4de);
	--snm-submission-focus: var(--snm-directory-focus, #1685ab);
	--snm-submission-radius: var(--snm-directory-radius, 18px);
	--snm-submission-radius-sm: var(--snm-directory-radius-sm, 10px);

	min-width: 0;
	padding: clamp(20px, 4vw, 38px);
	border: 1px solid var(--snm-submission-border);
	border-radius: var(--snm-submission-radius);
	background: var(--snm-submission-surface);
	color: var(--snm-submission-text);
	box-shadow: var(--snm-directory-shadow-sm, 0 8px 24px rgba(15, 31, 50, 0.08));
}

.snm-directory-submission,
.snm-directory-submission *,
.snm-directory-submission *::before,
.snm-directory-submission *::after {
	box-sizing: border-box;
}

.snm-directory-submission[hidden],
.snm-directory-submission [hidden] {
	display: none !important;
}

.snm-directory-submission__header {
	display: flex;
	min-width: 0;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: 24px;
}

.snm-directory-submission__header > div {
	min-width: 0;
	max-width: 760px;
}

.snm-directory-submission__header h2 {
	margin: 0;
	color: var(--snm-submission-heading);
	font-size: clamp(1.35rem, 3vw, 2rem);
	line-height: 1.18;
	overflow-wrap: anywhere;
}

.snm-directory-submission__header p:last-child {
	max-width: 68ch;
	margin: 10px 0 0;
	color: var(--snm-submission-muted);
	line-height: 1.65;
}

.snm-directory-submission__eyebrow {
	margin: 0 0 8px;
	color: var(--snm-submission-accent);
	font-size: 0.72rem;
	font-weight: 800;
	letter-spacing: 0.12em;
	line-height: 1.3;
	text-transform: uppercase;
}

.snm-directory-submission__status-badge {
	display: inline-flex;
	min-height: 30px;
	align-items: center;
	padding: 5px 10px;
	border: 1px solid var(--snm-submission-border);
	border-radius: 999px;
	background: var(--snm-submission-surface-soft);
	color: var(--snm-submission-muted);
	font-size: 0.76rem;
	font-weight: 760;
	line-height: 1.25;
}

.snm-directory-submission__status-badge[data-status="approved"] {
	border-color: color-mix(in srgb, var(--snm-submission-success) 34%, var(--snm-submission-border));
	background: var(--snm-submission-success-soft);
	color: var(--snm-submission-success);
}

.snm-directory-submission__status-badge[data-status="rejected"],
.snm-directory-submission__status-badge[data-status="withdrawn"] {
	border-color: color-mix(in srgb, var(--snm-submission-danger) 30%, var(--snm-submission-border));
	background: var(--snm-submission-danger-soft);
	color: var(--snm-submission-danger);
}

.snm-directory-submission__status-badge[data-status="pending"],
.snm-directory-submission__status-badge[data-status="needs_info"] {
	border-color: color-mix(in srgb, var(--snm-submission-warning) 34%, var(--snm-submission-border));
	background: var(--snm-submission-warning-soft);
	color: var(--snm-submission-warning);
}

.snm-directory-submission__target {
	display: grid;
	min-width: 0;
	gap: 4px;
	margin-bottom: 22px;
	padding: 14px 16px;
	border-left: 4px solid var(--snm-submission-accent);
	border-radius: 0 var(--snm-submission-radius-sm) var(--snm-submission-radius-sm) 0;
	background: var(--snm-submission-accent-soft);
}

.snm-directory-submission__target span {
	color: var(--snm-submission-muted);
	font-size: 0.74rem;
	font-weight: 720;
	text-transform: uppercase;
}

.snm-directory-submission__target strong {
	color: var(--snm-submission-heading);
	overflow-wrap: anywhere;
}

.snm-directory-submission__workflow-note {
	margin: 0 0 22px;
	padding: 12px 14px;
	border: 1px solid color-mix(in srgb, var(--snm-submission-warning) 30%, var(--snm-submission-border));
	border-radius: var(--snm-submission-radius-sm);
	background: var(--snm-submission-warning-soft);
	color: var(--snm-submission-text);
	font-size: 0.84rem;
	line-height: 1.55;
}

.snm-directory-submission--denied {
	display: grid;
	gap: 6px;
	border-color: color-mix(in srgb, var(--snm-submission-warning) 30%, var(--snm-submission-border));
	background: var(--snm-submission-warning-soft);
}

.snm-directory-submission--denied strong {
	color: var(--snm-submission-heading);
}

.snm-directory-submission--denied p {
	margin: 0;
	color: var(--snm-submission-muted);
	line-height: 1.55;
}

.snm-directory-submission-form {
	display: grid;
	min-width: 0;
	gap: 22px;
	margin: 0;
}

.snm-directory-submission-honeypot {
	position: absolute !important;
	left: -10000px !important;
	width: 1px !important;
	height: 1px !important;
	overflow: hidden !important;
	clip-path: inset(50%) !important;
	white-space: nowrap !important;
}

.snm-directory-submission-form.is-loading {
	cursor: wait;
}

.snm-directory-submission-form.is-loading .snm-directory-submission-grid,
.snm-directory-submission-form.is-loading .snm-directory-submission-group {
	opacity: 0.72;
}

.snm-directory-submission-grid {
	display: grid;
	min-width: 0;
	grid-template-columns: minmax(0, 1fr);
	gap: 17px;
}

.snm-directory-submission-field {
	position: relative;
	display: grid;
	min-width: 0;
	align-content: start;
	gap: 7px;
}

.snm-directory-submission-field label {
	color: var(--snm-submission-heading);
	font-size: 0.82rem;
	font-weight: 750;
	line-height: 1.35;
}

.snm-directory-submission-field label [aria-hidden="true"],
.snm-directory-submission-consent [aria-hidden="true"],
.snm-directory-submission-form__required-note [aria-hidden="true"] {
	color: var(--snm-submission-danger);
}

.snm-directory-submission-field input,
.snm-directory-submission-field select,
.snm-directory-submission-field textarea {
	min-width: 0;
	width: 100%;
	min-height: 44px;
	margin: 0;
	padding: 10px 12px;
	border: 1px solid var(--snm-submission-border);
	border-radius: var(--snm-submission-radius-sm);
	background: var(--snm-submission-surface);
	color: var(--snm-submission-text);
	font: inherit;
	font-size: 0.94rem;
	line-height: 1.45;
	transition: border-color 160ms ease, box-shadow 160ms ease;
}

.snm-directory-submission-field select[multiple] {
	min-height: 132px;
}

.snm-directory-submission-field textarea {
	min-height: 112px;
	resize: vertical;
}

.snm-directory-submission-field input:hover,
.snm-directory-submission-field select:hover,
.snm-directory-submission-field textarea:hover {
	border-color: color-mix(in srgb, var(--snm-submission-accent) 58%, var(--snm-submission-border));
}

.snm-directory-submission-field input[aria-invalid="true"],
.snm-directory-submission-field select[aria-invalid="true"],
.snm-directory-submission-field textarea[aria-invalid="true"] {
	border-color: var(--snm-submission-danger);
	box-shadow: 0 0 0 1px var(--snm-submission-danger);
}

.snm-directory-submission-field__hint,
.snm-directory-submission-field__counter {
	color: var(--snm-submission-muted);
	font-size: 0.76rem;
	line-height: 1.5;
}

.snm-directory-submission-field__counter {
	justify-self: end;
	font-variant-numeric: tabular-nums;
}

.snm-directory-submission-field__error {
	color: var(--snm-submission-danger);
	font-size: 0.78rem;
	font-weight: 680;
	line-height: 1.45;
}

.snm-directory-submission-group {
	min-width: 0;
	margin: 0;
	padding: clamp(16px, 3vw, 24px);
	border: 1px solid var(--snm-submission-border);
	border-radius: var(--snm-submission-radius-sm);
	background: color-mix(in srgb, var(--snm-submission-surface-soft) 52%, var(--snm-submission-surface));
}

.snm-directory-submission-group legend {
	max-width: 100%;
	padding: 0 8px;
	color: var(--snm-submission-heading);
	font-size: 0.96rem;
	font-weight: 790;
}

.snm-directory-submission-change-fields__grid {
	display: grid;
	gap: 10px;
	grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
	margin-top: 12px;
}

.snm-directory-submission-change-fields__grid label {
	align-items: center;
	background: var(--snm-submission-surface-soft);
	border: 1px solid var(--snm-submission-border);
	border-radius: 12px;
	cursor: pointer;
	display: flex;
	gap: 9px;
	min-height: 44px;
	padding: 9px 12px;
}

.snm-directory-submission-change-fields__grid input {
	flex: 0 0 auto;
}

.snm-directory-submission-consent {
	display: flex;
	min-width: 0;
	align-items: flex-start;
	gap: 10px;
	color: var(--snm-submission-text);
	font-size: 0.86rem;
	line-height: 1.55;
}

.snm-directory-submission-consent input {
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
	margin: 3px 0 0;
	accent-color: var(--snm-submission-accent-strong);
}

.snm-directory-submission-form__required-note {
	margin: -6px 0 0;
	color: var(--snm-submission-muted);
	font-size: 0.78rem;
}

.snm-directory-submission-form__status:not(.snm-directory-sr-only) {
	padding: 12px 14px;
	border: 1px solid var(--snm-submission-border);
	border-radius: var(--snm-submission-radius-sm);
	background: var(--snm-submission-surface-soft);
	color: var(--snm-submission-text);
	font-size: 0.86rem;
	font-weight: 680;
	line-height: 1.5;
}

.snm-directory-submission-form__status.is-error {
	border-color: color-mix(in srgb, var(--snm-submission-danger) 34%, var(--snm-submission-border));
	background: var(--snm-submission-danger-soft);
	color: var(--snm-submission-danger);
}

.snm-directory-submission-form__status.is-success {
	border-color: color-mix(in srgb, var(--snm-submission-success) 34%, var(--snm-submission-border));
	background: var(--snm-submission-success-soft);
	color: var(--snm-submission-success);
}

.snm-directory-submission-form__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: center;
}

.snm-directory-submission-result {
	display: flex;
	min-width: 0;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 14px;
	padding: 14px 16px;
	border: 1px solid var(--snm-submission-border);
	border-radius: var(--snm-submission-radius-sm);
	background: var(--snm-submission-surface-soft);
	color: var(--snm-submission-muted);
	font-size: 0.84rem;
}

.snm-directory-submission-result.is-success {
	border-color: color-mix(in srgb, var(--snm-submission-success) 34%, var(--snm-submission-border));
	background: var(--snm-submission-success-soft);
}

.snm-directory-submission-result strong {
	color: var(--snm-submission-heading);
}

.snm-directory-account-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 18px 0 24px;
}

.snm-directory-submission-history {
	display: grid;
	gap: 12px;
}

.snm-directory-submission-history__item {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 18px;
	padding: 16px;
	border: 1px solid var(--snm-submission-border);
	border-radius: var(--snm-submission-radius-sm);
	background: var(--snm-submission-surface);
}

.snm-directory-submission-history__item h3,
.snm-directory-submission-history__item p {
	margin: 8px 0 0;
}

.snm-directory-submission-history__note {
	color: var(--snm-submission-muted);
	font-size: 0.86rem;
}

.snm-directory-submission-history__item form {
	flex: 0 0 auto;
	margin: 0;
}

.snm-directory-submission-history__actions {
	align-items: center;
	display: flex;
	flex: 0 0 auto;
	flex-wrap: wrap;
	gap: 8px;
}

.snm-directory-submission input:focus-visible,
.snm-directory-submission select:focus-visible,
.snm-directory-submission textarea:focus-visible,
.snm-directory-submission button:focus-visible,
.snm-directory-submission a:focus-visible {
	outline: 3px solid var(--snm-submission-focus);
	outline-offset: 3px;
}

@media (min-width: 700px) {
	.snm-directory-submission-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.snm-directory-submission-field--wide {
		grid-column: 1 / -1;
	}
}

@media (max-width: 699px) {
	.snm-directory-submission-history__item {
		flex-direction: column;
	}
}

@media (prefers-reduced-motion: reduce) {
	.snm-directory-submission-field input,
	.snm-directory-submission-field select,
	.snm-directory-submission-field textarea {
		transition: none;
	}
}
