.wp-block-gt-blocks-hero-image {
	padding-bottom: 1px;

	.gt-hero-section {
		display: block;
		margin-left: -1px;
		margin-right: -1px;

		&.gt-hero-layout-left,
		&.gt-hero-layout-right {
			margin-right: 0;

			.wp-block-gt-blocks-content,
			.wp-block-gt-blocks-image {
				padding-right: 0;
			}
		}

		> .editor-inner-blocks > .editor-block-list__layout {

			.wp-block-gt-blocks-content,
			.wp-block-gt-blocks-image,
			> .editor-block-list__block {
				width: 100%;

				> .editor-block-list__block-edit {
					margin-top: 0;
				}
			}

			> .editor-block-list__block[data-type="gt-blocks/content"] {
				flex-grow: 0;
				flex-shrink: 0;
			}
			
			> .editor-block-list__block[data-type="gt-blocks/image"] {
				flex-grow: 1;
			}
		}
	}
}

/* Override bottom padding spacing of Background Section component */
.wp-block-gt-blocks-hero-image.gt-background-section {
	.gt-section-content {
		margin-bottom: -33px;
	}
}

@media only screen and (min-width: 720px) {
	.wp-block-gt-blocks-hero-image .gt-hero-section {

		&.gt-hero-layout-left > .editor-inner-blocks > .editor-block-list__layout {
			display: flex;
			align-items: center;
			justify-content: flex-start;

			> .editor-block-list__block {
				margin-left: 0;
			}
		}

		&.gt-hero-layout-right > .editor-inner-blocks > .editor-block-list__layout {
			display: flex;
			align-items: center;
			justify-content: flex-end;

			> .editor-block-list__block {
				margin-right: 0;
			}
		}

		&.gt-hero-layout-right.gt-has-hero-image > .editor-inner-blocks > .editor-block-list__layout {
			flex-direction: row-reverse;
		}

		/* Hero Content width */
		&.gt-hero-layout-left > .editor-inner-blocks > .editor-block-list__layout,
		&.gt-hero-layout-right > .editor-inner-blocks > .editor-block-list__layout {
			> .editor-block-list__block[data-type="gt-blocks/content"] {
				flex-basis: 50%;
			}
		}

		&.gt-hero-content-width-30 > .editor-inner-blocks > .editor-block-list__layout > .editor-block-list__block[data-type="gt-blocks/content"] {
			flex-basis: 30%;
		}

		&.gt-hero-content-width-40 > .editor-inner-blocks > .editor-block-list__layout > .editor-block-list__block[data-type="gt-blocks/content"] {
			flex-basis: 40%;
		}

		&.gt-hero-content-width-60 > .editor-inner-blocks > .editor-block-list__layout > .editor-block-list__block[data-type="gt-blocks/content"] {
			flex-basis: 60%;
		}

		&.gt-hero-content-width-70 > .editor-inner-blocks > .editor-block-list__layout > .editor-block-list__block[data-type="gt-blocks/content"] {
			flex-basis: 70%;
		}
	}
}

.gt-panel-hero-settings {
	.gt-image-block-button {
		height: 36px;
		line-height: 34px;
		padding: 0 12px 2px;
	
		svg.dashicon {
			margin: 8px 8px 0 0;
			width: 18px;
			height: 18px;
		}
	}
}

/* 5.4 Styling */
.wp-block-gt-blocks-hero-image {
	.gt-hero-section {
		> .block-editor-inner-blocks > .block-editor-block-list__layout {

			.wp-block-gt-blocks-content,
			.wp-block-gt-blocks-image,
			> .block-editor-block-list__block {
				width: 100%;

				> .block-editor-block-list__block-edit {
					margin-top: 0;
				}
			}

			> .block-editor-block-list__block[data-type="gt-blocks/content"] {
				flex-grow: 0;
				flex-shrink: 0;
			}
			
			> .block-editor-block-list__block[data-type="gt-blocks/image"] {
				flex-grow: 1;
			}
		}
	}
}

@media only screen and (min-width: 720px) {
	.wp-block-gt-blocks-hero-image .gt-hero-section {

		&.gt-hero-layout-left > .block-editor-inner-blocks > .block-editor-block-list__layout {
			display: flex;
			align-items: center;
			justify-content: flex-start;

			> .block-editor-block-list__block {
				margin-left: 0;
			}
		}

		&.gt-hero-layout-right > .block-editor-inner-blocks > .block-editor-block-list__layout {
			display: flex;
			align-items: center;
			justify-content: flex-end;

			> .block-editor-block-list__block {
				margin-right: 0;
			}
		}

		&.gt-hero-layout-right.gt-has-hero-image > .block-editor-inner-blocks > .block-editor-block-list__layout {
			flex-direction: row-reverse;
		}

		/* Hero Content width */
		&.gt-hero-layout-left > .block-editor-inner-blocks > .block-editor-block-list__layout,
		&.gt-hero-layout-right > .block-editor-inner-blocks > .block-editor-block-list__layout {
			> .block-editor-block-list__block[data-type="gt-blocks/content"] {
				flex-basis: 50%;
			}
		}

		&.gt-hero-content-width-30 > .block-editor-inner-blocks > .block-editor-block-list__layout > .block-editor-block-list__block[data-type="gt-blocks/content"] {
			flex-basis: 30%;
		}

		&.gt-hero-content-width-40 > .block-editor-inner-blocks > .block-editor-block-list__layout > .block-editor-block-list__block[data-type="gt-blocks/content"] {
			flex-basis: 40%;
		}

		&.gt-hero-content-width-60 > .block-editor-inner-blocks > .block-editor-block-list__layout > .block-editor-block-list__block[data-type="gt-blocks/content"] {
			flex-basis: 60%;
		}

		&.gt-hero-content-width-70 > .block-editor-inner-blocks > .block-editor-block-list__layout > .block-editor-block-list__block[data-type="gt-blocks/content"] {
			flex-basis: 70%;
		}
	}
}