/**
 * Shared editor styles among all the blocks.
*/

.gblocks-notice {
	margin-bottom: 20px;
}

.gblocks-panel-label {
	.components-panel__body-toggle.components-button {
		display: flex;
		flex-direction: row-reverse;
		justify-content: flex-end;
	}

	.gblocks-panel-label {
		border: 0;
		background-color: #fafafa;

		.components-panel__body-toggle {
			padding: 10px;
		}
	}

	.components-panel__icon {
		color: currentColor;
	}
}

.gblocks-panel-label svg.components-panel__icon {
	margin: 0;
	margin-inline-end: 10px;
}

.gblocks-control-tabs .components-tab-panel__tabs {
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 15px;
	border-bottom: 1px solid #e8eaeb;
}

.gblocks-control-tabs .components-tab-panel__tabs button {
	padding: 8px;
	height: auto;
	margin: 0;
	margin-bottom: -1px;
	cursor: pointer;
	border: none;
	border: 0;
	border-radius: 0;
	outline-offset: -1px;
	flex: 1;
	justify-content: center;
	font-size: 11px;
	font-weight: 400;

	&.active-tab {
		position: relative;
		z-index: 1;
		background: #222 !important;
		color: #fff !important;
		box-shadow: 0 0 0 !important;
	}
}

.gblocks-block-control-icon svg {
	margin-right: 0 !important;
	margin-left: 0 !important;
	padding: 2px;
}

.gblocks-block-control-icon.gblocks-add-grid-item svg {
	padding: 0;
}

.gblocks-block-control-icon svg path {
	fill: inherit;
}

.gblocks-option-notice.components-notice {
	margin: 0 0 24px;

	.components-notice__content {
		margin: 5px;
	}
}

.gblocks-small-notice-description {
	font-size: 12px;
	color: #777;
	margin-bottom: 10px;
}

.gblocks-utility-label {
	display: flex;
	align-items: flex-end;
	margin-bottom: 5px;

	label {
		margin-right: auto;
	}

	.components-button {
		height: auto;
		justify-content: center !important;
		margin-left: 5px;
		min-width: auto;
		padding: 0 6px;

		&.gblocks-reset-button {
			svg {
				height: 20px;
				width: 20px;
			}
		}

		&:last-child {
			margin-right: -5px;
		}

		svg {
			margin-right: 0 !important;
			height: 13px;
			width: 13px;
		}
	}
}

.wp-block.gb-is-root-block {
	margin-top: 0;
	margin-bottom: 0;
	position: relative;
}

.block-editor-list-view-leaf {
	:is(.gb-block-icon, .gblocks-block-icon) {
		color: #1e72bd;
	}

	&.is-selected :is(.gb-block-icon, .gblocks-block-icon) {
		color: currentColor;
	}
}

.gblocks-action-panel {
	padding: 0 !important;

	.components-panel__body-title {
		margin: 0 !important;
	}

	.components-panel__arrow path {
		transform: rotate(90deg);
		transform-origin: center;
	}
}

/**
 * This is a fix for GP Premium < 2.2.0.
 * @todo Remove in GB 1.6.0.
 */
.post-type-gp_elements {
	.wp-block {
		max-width: none;
	}
}

.gblocks-flex-button-group {
	display: flex;

	button {
		flex-grow: 1;
		display: flex;
		justify-content: center;
		font-size: 12px;

		&.is-inherited {
			background: rgba(0, 0, 0, 0.07);
		}

		svg {
			width: 15px;
		}
	}
}