/**
 * Accordion Grid Block Styles
 *
 * Simple grid with hairline borders between cells and top/bottom.
 * Details blocks inside are unstyled — they keep their existing appearance.
 *
 * @package Lake Superior Consulting
 */

/* Grid container — fixed 3 columns */
.wp-block-lakesuperior-accordion-grid {
	display: grid !important;
	grid-template-columns: repeat( 3, 1fr );
	gap: 0;
	position: relative;
	border-left: 1px solid currentColor;
	border-right: 1px solid currentColor;
}

/* Full-width top and bottom borders via pseudo-elements */
.wp-block-lakesuperior-accordion-grid::before,
.wp-block-lakesuperior-accordion-grid::after {
	content: '';
	position: absolute;
	left: 50%;
	transform: translateX( -50% );
	width: 100vw;
	height: 0;
	border-top: 1px solid currentColor;
	pointer-events: none;
}

.wp-block-lakesuperior-accordion-grid::before {
	top: 0;
}

.wp-block-lakesuperior-accordion-grid::after {
	bottom: 0;
}

/* Grid cells: uniform padding + right/bottom borders */
.wp-block-lakesuperior-accordion-grid > * {
	padding: var( --wp--preset--spacing--60, 1.5rem );
	border-right: 1px solid currentColor;
	border-bottom: 1px solid currentColor;
}

/* Every 3rd column: remove right border */
.wp-block-lakesuperior-accordion-grid > *:nth-child( 3n ) {
	border-right: none;
}

/* Last row (last 3 items): remove bottom border to avoid doubling */
.wp-block-lakesuperior-accordion-grid > *:nth-last-child( -n + 3 ) {
	border-bottom: none;
}

/* Tablet: 2 columns */
@media ( max-width: 959px ) {
	.wp-block-lakesuperior-accordion-grid {
		grid-template-columns: repeat( 2, 1fr );
	}
	.wp-block-lakesuperior-accordion-grid > *:nth-child( 3n ) {
		border-right: 1px solid currentColor;
	}
	.wp-block-lakesuperior-accordion-grid > *:nth-last-child( -n + 3 ) {
		border-bottom: 1px solid currentColor;
	}
	.wp-block-lakesuperior-accordion-grid > *:nth-child( 2n ) {
		border-right: none;
	}
	.wp-block-lakesuperior-accordion-grid > *:nth-last-child( -n + 2 ) {
		border-bottom: none;
	}
}

/* Mobile: single column */
@media ( max-width: 639px ) {
	.wp-block-lakesuperior-accordion-grid {
		grid-template-columns: 1fr;
	}
	.wp-block-lakesuperior-accordion-grid > * {
		border-right: none;
	}
	.wp-block-lakesuperior-accordion-grid > *:nth-last-child( -n + 3 ),
	.wp-block-lakesuperior-accordion-grid > *:nth-last-child( -n + 2 ) {
		border-bottom: 1px solid currentColor;
	}
	.wp-block-lakesuperior-accordion-grid > *:last-child {
		border-bottom: none;
	}
}

/* Editor: match frontend grid (markup differs — inner-blocks + layout use display:contents) */
.editor-styles-wrapper .wp-block-lakesuperior-accordion-grid {
	display: grid !important;
	grid-template-columns: repeat( 3, 1fr );
	gap: 0;
	position: relative;
	border-left: 1px solid currentColor;
	border-right: 1px solid currentColor;
}

.editor-styles-wrapper .wp-block-lakesuperior-accordion-grid::before,
.editor-styles-wrapper .wp-block-lakesuperior-accordion-grid::after {
	content: '';
	position: absolute;
	left: 50%;
	transform: translateX( -50% );
	width: 100vw;
	height: 0;
	border-top: 1px solid currentColor;
	pointer-events: none;
}

.editor-styles-wrapper .wp-block-lakesuperior-accordion-grid::before {
	top: 0;
}

.editor-styles-wrapper .wp-block-lakesuperior-accordion-grid::after {
	bottom: 0;
}

/* Flatten editor wrappers so details become grid items */
.editor-styles-wrapper .wp-block-lakesuperior-accordion-grid > .block-editor-inner-blocks,
.editor-styles-wrapper .wp-block-lakesuperior-accordion-grid > .block-editor-inner-blocks > .block-editor-block-list__layout {
	display: contents;
}

/* Grid cells: details blocks get same padding/borders as frontend */
.editor-styles-wrapper .wp-block-lakesuperior-accordion-grid .wp-block-details {
	margin: 0;
	padding: var( --wp--preset--spacing--60, 1.5rem );
	border-right: 1px solid currentColor;
	border-bottom: 1px solid currentColor;
}

.editor-styles-wrapper .wp-block-lakesuperior-accordion-grid .wp-block-details:nth-child( 3n ) {
	border-right: none;
}

/* Last row of details (items 4,5,6 in 3-col) — appender is 7th child */
.editor-styles-wrapper .wp-block-lakesuperior-accordion-grid .wp-block-details:nth-child( n + 4 ):nth-child( -n + 6 ) {
	border-bottom: none;
}

/* Appender spans full width below grid */
.editor-styles-wrapper .wp-block-lakesuperior-accordion-grid .block-list-appender {
	grid-column: 1 / -1;
	margin: 0;
}

/* Editor tablet: 2 columns */
@media ( max-width: 959px ) {
	.editor-styles-wrapper .wp-block-lakesuperior-accordion-grid {
		grid-template-columns: repeat( 2, 1fr );
	}
	.editor-styles-wrapper .wp-block-lakesuperior-accordion-grid .wp-block-details:nth-child( 3n ) {
		border-right: 1px solid currentColor;
	}
	.editor-styles-wrapper .wp-block-lakesuperior-accordion-grid .wp-block-details:nth-child( n + 4 ):nth-child( -n + 6 ) {
		border-bottom: 1px solid currentColor;
	}
	.editor-styles-wrapper .wp-block-lakesuperior-accordion-grid .wp-block-details:nth-child( 2n ) {
		border-right: none;
	}
	.editor-styles-wrapper .wp-block-lakesuperior-accordion-grid .wp-block-details:nth-child( n + 5 ):nth-child( -n + 6 ) {
		border-bottom: none;
	}
}

/* Editor mobile: 1 column */
@media ( max-width: 639px ) {
	.editor-styles-wrapper .wp-block-lakesuperior-accordion-grid {
		grid-template-columns: 1fr;
	}
	.editor-styles-wrapper .wp-block-lakesuperior-accordion-grid .wp-block-details {
		border-right: none;
	}
	.editor-styles-wrapper .wp-block-lakesuperior-accordion-grid .wp-block-details:nth-last-child( -n + 3 ),
	.editor-styles-wrapper .wp-block-lakesuperior-accordion-grid .wp-block-details:nth-last-child( -n + 2 ) {
		border-bottom: 1px solid currentColor;
	}
	.editor-styles-wrapper .wp-block-lakesuperior-accordion-grid .wp-block-details:last-of-type {
		border-bottom: none;
	}
}
