/* Relational display blocks — format option layout (front + editor SSR preview) */

.relational-field__inner {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.35em;
}

.relational-field--icon-top,
.relational-field--icon-bottom {
	flex-direction: column;
	align-items: flex-start;
}

.relational-field--icon-right {
	flex-direction: row-reverse;
}

.relational-field--media-top,
.relational-field--media-bottom {
	flex-direction: column;
	align-items: flex-start;
	flex-wrap: nowrap;
}

.relational-field--media-right {
	flex-direction: row-reverse;
}

.relational-field--media-left .relational-field__media--align-center,
.relational-field--media-right .relational-field__media--align-center {
	align-self: center;
}

.relational-field--media-left .relational-field__media--align-end,
.relational-field--media-right .relational-field__media--align-end {
	align-self: flex-end;
}

.relational-field--media-left .relational-field__media--align-stretch,
.relational-field--media-right .relational-field__media--align-stretch {
	align-self: stretch;
}

.relational-field--media-top .relational-field__media--align-center,
.relational-field--media-bottom .relational-field__media--align-center {
	align-self: center;
}

.relational-field--media-top .relational-field__media--align-end,
.relational-field--media-bottom .relational-field__media--align-end {
	align-self: flex-end;
}

.relational-field--media-top .relational-field__media--align-stretch,
.relational-field--media-bottom .relational-field__media--align-stretch {
	align-self: stretch;
	width: 100%;
}

.relational-field__icon img {
	display: block;
	max-height: 1.5em;
	width: auto;
}

.relational-field__icon-link {
	display: inline-block;
	line-height: 0;
}

/* Editor canvas — label au-dessus de la valeur (shell SSR) */
.relational-scalar-editor-preview,
.relational-choice-editor-preview,
.relational-reference-editor-preview,
.relational-booking-editor-preview {
	display: block;
}

.relational-scalar-editor-preview .relational-field,
.relational-choice-editor-preview .relational-field,
.relational-reference-editor-preview .relational-field,
.relational-booking-editor-preview .relational-field {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.35em;
}

.relational-scalar-editor-preview .relational-field__label,
.relational-choice-editor-preview .relational-field__label,
.relational-reference-editor-preview .relational-field__label {
	display: block;
	width: 100%;
}

/* Editor preview — showLink visible: React icon + SSR value; hidden: SSR icon only, no link text */

.relational-scalar-editor-preview[data-show-link='visible'] .wp-block-relational-scalar .relational-field__icon,
.relational-scalar-editor-preview[data-show-link='visible'] [class*='wp-block-relational'] .relational-field__icon {
	display: none !important;
}

.relational-scalar-editor-preview[data-show-link='hidden'] .relational-field__value,
.relational-scalar-editor-preview[data-show-link='hidden'] .relational-field__link,
.relational-scalar-editor-preview[data-show-link='hidden'] .relational-field__link--text-hidden,
.relational-scalar-editor-preview[data-show-link='hidden'] .relational-field__link-indicator {
	display: none !important;
}

.relational-scalar-editor-preview[data-show-link='hidden'] .wp-block-relational-scalar .relational-field__icon,
.relational-scalar-editor-preview[data-show-link='hidden'] [class*='wp-block-relational'] .relational-field__icon {
	display: inline-block !important;
}

.relational-format-canvas-icon__img {
	display: block;
	max-width: 1.5em;
	max-height: 1.5em;
	width: auto;
	height: auto;
}

.relational-field__color {
	display: inline-flex;
	align-items: center;
	gap: 0.5em;
}

.relational-field__color--top,
.relational-field__color--bottom {
	flex-direction: column;
	align-items: flex-start;
}

.relational-field__color--right {
	flex-direction: row-reverse;
}

.relational-field__color-swatch {
	display: inline-block;
	width: 1.25em;
	height: 1.25em;
	border: 1px solid rgba(0, 0, 0, 0.15);
	vertical-align: middle;
}

.relational-field__color-swatch--circle {
	border-radius: 50%;
}

.relational-field__color-swatch--diamond {
	transform: rotate(45deg);
	width: 0.9em;
	height: 0.9em;
}

.relational-field__bool {
	display: inline-flex;
	align-items: center;
	gap: 0.35em;
}

.relational-field__bool--top,
.relational-field__bool--bottom {
	flex-direction: column;
	align-items: flex-start;
}

.relational-field__bool--right {
	flex-direction: row-reverse;
}

.relational-field__list--align-start {
	align-items: flex-start;
}

.relational-field__list--align-center {
	align-items: center;
}

.relational-field__list--align-end {
	align-items: flex-end;
}

.relational-field__list--align-stretch {
	align-items: stretch;
}

.relational-field__list--nowrap {
	flex-wrap: nowrap;
}

.relational-field__list--horizontal-stack,
.relational-field__list--vertical-stack {
	display: flex;
	gap: var(--relational-collection-gap, 0.5em);
}

.relational-field__list--horizontal-stack {
	flex-direction: row;
	flex-wrap: wrap;
}

.relational-field__list--vertical-stack {
	flex-direction: column;
}

.relational-field__list--list {
	display: block;
}

.relational-field__media {
	display: inline-flex;
	align-items: center;
}

.relational-field__media-img {
	display: block;
	max-width: 100%;
	height: auto;
}

.relational-field__media-icon {
	display: inline-block;
	color: inherit;
	width: 1em;
	height: 1em;
	line-height: 1;
	vertical-align: middle;
	flex-shrink: 0;
}

.relational-field__link,
.relational-field__media-link,
.relational-field__icon-link {
	text-decoration: inherit;
}

.relational-field__link--text-hidden {
	display: inline-block;
	min-width: 1px;
	min-height: 1px;
}

/* Inspector-only icon preview */
.relational-format-icon-preview {
	margin: 0.5em 0;
}

.relational-format-icon-preview__img {
	display: block;
	max-width: 48px;
	max-height: 48px;
	height: auto;
	border: 1px solid #ddd;
	border-radius: 2px;
}

.relational-format-icon-controls {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5em;
	align-items: center;
}

/* Inspector-only media attachment picker */
.relational-format-media-picker {
	display: flex;
	flex-direction: column;
	gap: 0.5em;
	width: 100%;
	margin: 0.5em 0;
}

.relational-format-media-preview__img {
	display: block;
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	max-height: 160px;
	height: auto;
	object-fit: contain;
	border: 1px solid #ddd;
	border-radius: 2px;
}

.relational-format-media-controls {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 0.5em;
	align-items: center;
}

.relational-format-media-icon-preview {
	display: flex;
	align-items: center;
	gap: 0.5em;
	margin: 0.5em 0;
}

.relational-format-media-icon-preview__slug {
	font-family: monospace;
	font-size: 12px;
	color: #646970;
}

.relational-format-media-custom-size-group {
	display: flex;
	flex-direction: column;
	gap: 0.5em;
	width: 100%;
	margin: 0.25em 0 0.5em;
}

.relational-format-media-custom-size {
	width: 100%;
	align-items: flex-start;
}

.relational-format-media-custom-size__field {
	flex: 1;
	min-width: 0;
}

.relational-format-media-custom-size__field .components-unit-control-wrapper {
	width: 100%;
	margin-bottom: 0;
}

/* Editor REST preview — feedback while format options are recalculated */
.relational-editor-block-preview {
	transition: opacity 0.15s ease;
}

.relational-editor-block-preview--loading {
	opacity: 0.45;
	pointer-events: none;
}

.relational-editor-block-preview--skeleton {
	display: flex;
	flex-direction: column;
	gap: 0.35em;
	padding: 0.25em 0;
}

.relational-editor-block-preview__line {
	display: block;
	height: 0.65em;
	max-width: 12em;
	background: currentColor;
	opacity: 0.12;
	border-radius: 2px;
}

/* Links loop — reset list markers (aligned with core/post-template) */
.relational-links-loop,
.wp-block-relational-links-loop {
	box-sizing: border-box;
	list-style: none;
	margin: 0;
	padding: 0;
	max-width: 100%;
}

.relational-links-loop-item,
.wp-block-relational-links-loop-item {
	list-style: none;
	margin: 0;
}

/* Relation loop — reset list markers */
.relational-relation-loop,
.wp-block-relational-relation-loop {
	box-sizing: border-box;
	list-style: none;
	margin: 0;
	padding: 0;
	max-width: 100%;
}

.relational-relation-loop-item,
.wp-block-relational-relation-loop-item {
	list-style: none;
	margin: 0;
}

/* Links loop editor preview */
.relational-links-loop__preview {
	list-style: none;
	margin: 0 0 1em;
	padding: 0;
}

.relational-links-loop__preview--skeleton .relational-links-loop__skeleton-item {
	margin-bottom: 0.75em;
}

@media (max-width: 600px) {
	.wp-block-relational-links-loop-is-layout-grid {
		grid-template-columns: 1fr;
	}
}

.relational-links-loop__preview-row {
	margin-bottom: 0;
}

.relational-links-loop__preview .block-editor-block-preview__live-content {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
}

.relational-links-loop__preview .block-editor-block-preview__container,
.relational-links-loop__preview .block-editor-block-preview__content {
	width: 100%;
	max-width: 100%;
}

.relational-links-loop__skeleton-item {
	display: block;
}

.relational-links-loop__skeleton-line {
	display: block;
	height: 0.75em;
	max-width: 14em;
	border-radius: 2px;
	background: linear-gradient(
		90deg,
		rgba( 0, 0, 0, 0.06 ) 25%,
		rgba( 0, 0, 0, 0.12 ) 50%,
		rgba( 0, 0, 0, 0.06 ) 75%
	);
	background-size: 200% 100%;
	animation: relational-links-loop-skeleton 1.2s ease-in-out infinite;
}

.relational-links-loop__preview--empty {
	margin: 0 0 1em;
	padding: 0.5em 0;
	color: #757575;
	font-size: 13px;
}

.relational-links-loop__preview--hint {
	margin: 0 0 1em;
	padding: 0;
	color: #757575;
	font-size: 13px;
}

.relational-links-loop__preview-placeholder {
	color: #757575;
	font-size: 13px;
}

@keyframes relational-links-loop-skeleton {
	0% {
		background-position: 200% 0;
	}

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

.relational-linked-filters {
	display: flex;
	flex-direction: column;
	margin-block-end: 1.5rem;
}

.relational-linked-filters.is-layout-horizontal {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: end;
	column-gap: 1rem;
	row-gap: 1rem;
	width: 100%;
}

.relational-linked-filters__fields {
	display: flex;
	flex-direction: column;
	gap: var(--wp--style--block-gap, 1rem);
}

.relational-linked-filters.is-layout-horizontal .relational-linked-filters__fields {
	grid-column: 1;
	grid-row: 1;
	min-width: 0;
}

.relational-linked-filters__fields.is-layout-horizontal {
	flex-direction: row;
	flex-wrap: wrap;
	align-items: flex-end;
}

.relational-linked-filters__criterion {
	display: flex;
	flex-direction: column;
	border: 0;
	margin: 0;
	padding: 0;
	min-width: 0;
}

.relational-linked-filters__criterion legend {
	margin-block-end: 0.35rem;
	padding: 0;
}

.relational-linked-filters__select {
	--relational-linked-filters-select-inset: 0.75em;
	display: block;
	box-sizing: border-box;
	min-width: 12rem;
	height: 2.5rem;
	min-height: 2.5rem;
	max-height: 2.5rem;
	padding-block: 0;
	padding-inline-start: var( --relational-linked-filters-select-inset );
	padding-inline-end: calc(
		var( --relational-linked-filters-select-inset ) + 1.5em
	);
	font-family: var( --wp--preset--font-family--body, inherit );
	font-size: var( --wp--preset--font-size--medium, 1em );
	font-style: normal;
	letter-spacing: normal;
	text-transform: none;
	color: var( --wp--preset--color--contrast, currentColor );
	border: 1px solid currentColor;
	border-radius: 0.25rem;
	appearance: none;
	background-color: transparent;
	background-image: url( "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='currentColor'%3E%3Cpath d='M17.5 11.6L12 16l-5.5-4.4.9-1.2L12 14l4.5-3.6 1 1.2z'/%3E%3C/svg%3E" );
	background-repeat: no-repeat;
	background-position: right var( --relational-linked-filters-select-inset ) center;
	background-size: 1.25em 1.25em;
}

.relational-linked-filters__select option {
	font-family: var( --wp--preset--font-family--body, inherit );
	font-size: var( --wp--preset--font-size--medium, 1em );
	font-style: normal;
}

.relational-linked-filters__actions {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 0.5rem;
	flex-shrink: 0;
	margin-inline-start: auto;
	height: auto;
}

.relational-linked-filters.is-layout-horizontal .relational-linked-filters__actions {
	grid-column: 2;
	grid-row: 1;
	align-self: end;
	margin-inline-start: 0;
}

.relational-linked-filters__submit,
.relational-linked-filters__clear {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	height: 2.5rem;
	min-height: 2.5rem;
	max-height: 2.5rem;
	padding: 0 1em;
	line-height: 1.4;
	border-radius: 0.25rem;
	text-decoration: none;
	cursor: pointer;
	flex: 0 0 auto;
	align-self: auto;
}

.relational-linked-filters__submit {
	border: 1px solid currentColor;
	background: transparent;
}

.relational-linked-filters__clear {
	border: 1px solid currentColor;
}

.relational-linked-filters__radio,
.relational-linked-filters__checkboxes {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
}

.relational-linked-filters__radio,
.relational-linked-filters__checkbox {
	padding-inline-start: calc(var(--relational-filter-depth, 0) * 1rem);
}

.relational-filter-taxonomy-terms__label {
	font-weight: 600;
	margin: 0 0 0.25rem;
}

.relational-filter-taxonomy-terms__actions {
	display: flex;
	gap: 0.5rem;
	margin-bottom: 0.35rem;
}

.relational-filter-taxonomy-terms__list {
	list-style: none;
	margin: 0;
	padding: 0;
	max-height: 14rem;
	overflow-y: auto;
}

.relational-filter-taxonomy-terms__item {
	padding-inline-start: calc(var(--relational-filter-depth, 0) * 1rem);
}

.relational-linked-filters-editor {
	margin-block-end: 0;
}

.relational-linked-filters-editor__preview {
	display: flex;
	flex-direction: column;
	gap: var(--wp--style--block-gap, 1rem);
}

.relational-linked-filters-editor.is-layout-horizontal .relational-linked-filters-editor__preview {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: end;
	column-gap: 1rem;
	row-gap: 1rem;
	width: 100%;
}

.relational-linked-filters-editor__preview-fields {
	display: flex;
	flex-direction: column;
	gap: var(--wp--style--block-gap, 1rem);
}

.relational-linked-filters-editor.is-layout-horizontal
	.relational-linked-filters-editor__preview-fields {
	grid-column: 1;
	grid-row: 1;
	min-width: 0;
	flex-direction: row;
	flex-wrap: wrap;
	align-items: flex-end;
}

.relational-linked-filters-editor__preview-criterion {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	min-width: 0;
}

.relational-linked-filters-editor__preview-label {
	margin: 0;
	font-size: 0.875em;
	font-weight: 600;
}

.relational-linked-filters-editor__preview-select {
	min-width: 10rem;
	min-height: 2.25rem;
	padding: 0.45em 0.65em;
	font-family: var( --wp--preset--font-family--body, inherit );
	font-size: var( --wp--preset--font-size--medium, 1em );
	font-style: normal;
	letter-spacing: normal;
	text-transform: none;
	color: var( --wp--preset--color--contrast, currentColor );
	border: 1px dashed currentColor;
	border-radius: 0.25rem;
	background: transparent;
	opacity: 0.85;
}

.relational-linked-filters-editor__preview-actions {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: 0.5rem;
	margin-inline-start: auto;
	flex-shrink: 0;
}

.relational-linked-filters-editor.is-layout-horizontal
	.relational-linked-filters-editor__preview-actions {
	grid-column: 2;
	grid-row: 1;
	align-self: end;
	margin-inline-start: 0;
}

.relational-linked-filters-editor__preview-button {
	display: inline-flex;
	align-items: center;
	min-height: 2.25rem;
	padding: 0.45em 0.85em;
	border: 1px dashed currentColor;
	border-radius: 0.25rem;
	opacity: 0.85;
}

.relational-linked-filters-editor__placeholder {
	margin: 0;
	padding: 0.75rem 1rem;
	border: 1px dashed currentColor;
	opacity: 0.75;
}

.relational-linked-filters-editor__criterion-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
	margin-block-start: 0.5rem;
}

.relational-linked-filters-inspector__notice {
	margin-block-end: 16px;
}

.relational-linked-filters-inspector__notice:empty {
	display: none;
	margin: 0;
}

.relational-inspector-labeled-toggle .components-toggle-control {
	margin-block-end: 0;
}

.relational-linked-filters-inspector__setup-panel {
	padding: 16px;
	border-block-end: 1px solid #e0e0e0;
}

.relational-linked-filters-inspector__setup-panel
	.relational-linked-filters-editor__criterion-actions {
	margin-block-start: 0.75rem;
	margin-block-end: 0;
}

.relational-linked-filters-inspector__divider {
	margin: 12px 0;
	border: 0;
	border-block-start: 1px solid #e0e0e0;
}

.relational-linked-filters-inspector__section {
	margin: 0;
	border-block-end: 1px solid #e0e0e0;
}

.relational-linked-filters-inspector__section-header {
	padding: 12px 16px;
}

.relational-linked-filters-inspector__section-content {
	padding: 0 16px 16px;
}

.relational-editor-block-preview__line--short {
	max-width: 6em;
}

.relational-booking__action {
	cursor: pointer;
	text-decoration: none;
}

.relational-booking__action:hover {
	text-decoration: underline;
}

.relational-booking__action:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

.relational-booking-slot + .relational-booking-slot {
	margin-block-start: 1rem;
}