/**
 * Editor-only chrome for the Table family (editorStyle on the cell — a cell is
 * always present in a table, so these rules reach the canvas iframe whenever a
 * table is edited).
 *
 * Page-builder identity without cluttering the whole table: show a guide outline
 * only for the active cell and the row that contains it.
 */

.axcelersblocks-table-cell {
	position: relative;
}

// Inside a table cell, child block chrome clutters every cell. Keep the child
// content editable, but let the selected table cell provide the visual boundary.
.axcelersblocks-table-cell .axcelersblocks-bodycopy__text::before,
.axcelersblocks-table-cell .axcelersblocks-heading__text::before,
.axcelersblocks-table-cell .axcelersblocks-button::before,
.axcelersblocks-table-cell .axcelersblocks-image::before {
	display: none !important;
}

.axcelersblocks-table-cell .axcelersblocks-bodycopy__badge,
.axcelersblocks-table-cell .axcelersblocks-heading__badge,
.axcelersblocks-table-cell .axcelersblocks-button__badge,
.axcelersblocks-table-cell .axcelersblocks-image__badge {
	display: none !important;
}

// Active-cell guide, so you always see the boundary you're editing.
.axcelersblocks-table-cell.is-selected::before,
.axcelersblocks-table-cell.has-child-selected::before {
	content: '';
	position: absolute;
	inset: 0;
	border: 1px dashed rgba( 91, 101, 113, 0.55 );
	pointer-events: none;
	z-index: 1;
}

.axcelersblocks-table-cell.is-selected::before,
.axcelersblocks-table-cell.has-child-selected::before {
	border-style: solid;
	border-color: #000000;
	box-shadow: inset 0 0 0 1px rgba( 255, 255, 255, 0.2 );
	z-index: 2;
}

.axcelersblocks-table-cell__add {
	position: absolute;
	right: 6px;
	bottom: 6px;
	z-index: 3;
}

.axb-table-cell-inserter {
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	pointer-events: auto;
	z-index: 5;

	&::before {
		content: '';
		position: absolute;
		background: #c6c6c6;
		border-radius: 2px;
		transition: background 0.15s ease;
	}

	&:hover::before {
		background: #000000;
	}
}

// Add Cell → row-level control at the right edge of that row.
.axb-table-cell-inserter--cell {
	top: 0;
	right: -30px;
	bottom: 0;
	width: 30px;

	&::before {
		top: 0;
		bottom: 0;
		left: 50%;
		width: 2px;
		transform: translateX( -50% );
	}
}

// Add Row → section-level control at the bottom edge of that section.
.axb-table-cell-inserter--row {
	right: auto;
	bottom: -15px;
	height: 30px;

	&::before {
		top: 50%;
		left: 0;
		right: 0;
		height: 2px;
		transform: translateY( -50% );
	}
}

.axb-table-cell-inserter .axb-table-cell-inserter__btn {
	position: relative;
	z-index: 1;
	display: inline-flex;
	align-items: center;
	gap: 4px;
	height: auto;
	min-height: 0;
	padding: 3px 10px;
	font-size: 11px;
	font-weight: 600;
	line-height: 1.4;
	color: #fff;
	background: #000000;
	border: none;
	border-radius: 999px;
	box-shadow: 0 1px 2px rgba( 15, 23, 42, 0.18 );
	white-space: nowrap;
	cursor: pointer;
	transition: background 0.15s ease;

	svg {
		width: 16px;
		height: 16px;
		fill: currentColor;
	}

	&:hover,
	&:focus {
		color: #fff;
		background: #000000;
		box-shadow: 0 1px 2px rgba( 15, 23, 42, 0.24 );
	}
}

.axb-table-cell-inserter--cell .axb-table-cell-inserter__btn {
	justify-content: center;
	width: 24px;
	height: 24px;
	min-width: 24px;
	min-height: 24px;
	padding: 0;
	border-radius: 999px;

	svg {
		width: 14px;
		height: 14px;
	}
}