/* OVERLAY { */

	.acf-table-pro-overlay-wrap {
		font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
		display: block !important; /* disable inline style display: none; that prevents flickering tools content on load. */
		position: absolute;
		left: -9999px;
		background: rgba( 0, 0, 0, 0.4 );
		text-align: center;
		z-index: -1;
		padding-top: 2.8rem;
		padding-bottom: 1rem;
	}

	.js-acf-table-pro-overlay.open,
	.acf-table-pro-overlay-editor.open {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 9999;
	}

	/* Fixes an issue where the WP media-modal (has a larger z-index than WP WYSIWYG editor UI elements.
		This fix drops the z-index of the medial-modal when has attachment-frame and its
		background below the table field overlay when it is open.

		Media Window z-index: 160000
		WP WYSIWYG editor UI elements z-index: 100100
	*/
	body:has(.acf-table-pro-overlay-wrap.open),
	body:has(.acf-table-pro-fullscreen) {
		.media-modal:has(.edit-attachment-frame) {
			z-index: 9998 !important;
		}
		.media-modal:has(.edit-attachment-frame) + .media-modal-backdrop {
			z-index: 9997 !important;
		}
	}

	.acf-table-pro-overlay-open {
		overflow: hidden;
	}
	.acf-table-pro-overlay-wrap:before {
		content: '';
		display: inline-block;
		vertical-align: middle;
		width: 0;
		height: 100%;
	}

	.acf-table-pro-overlay-frame {
		position: relative;
		display: inline-flex;
		flex-direction: column;
		/*width: calc(100% - 2rem);*/
		max-width: calc(100% - 2.4rem);
		min-width: min(800px, 100vw);;
		max-height: 100%;
		background: white;
		vertical-align: middle;
		overflow: auto;
		border-radius: 10px;

		box-shadow:
			0px 1.6px 2.2px rgba(0, 0, 0, 0.02),
			0px 3.9px 5.3px rgba(0, 0, 0, 0.028),
			0px 7.4px 10px rgba(0, 0, 0, 0.035),
			0px 13.2px 17.9px rgba(0, 0, 0, 0.042),
			0px 24.6px 33.4px rgba(0, 0, 0, 0.05),
			0px 59px 80px rgba(0, 0, 0, 0.07);
	}

	.acf-table-pro-overlay-frame p {
		max-width: 50rem;
	}

	.acf-table-pro-overlay-title {
		background-color: var(--color-table-overlay-title-background);
		margin: 0;
		padding: 0.9rem;
		font-weight: 200;
		font-size: 1.1rem !important;
		text-align: center;
		color: var(--color-table-legend-content);
	}

	/* .acf-table-pro-overlay-content {

	} */

	.acf-table-pro-overlay-tfoot {
		display: inline-block;
		padding: 1rem 2rem;
		background-color: var(--color-table-cell-background);
		text-align: right;
	}

	.acf-table-pro-overlay-content-item {
		padding: 1rem 2rem;
		border-bottom: 1px solid var(--color-table-overlay-border);
	}

	.acf-table-pro-tab-labels {
		background-color: var(--color-table-legend-cell-background);
		padding: 22px 30px 0 30px;
		text-align: left;
		border-bottom: 1px solid var(--color-table-overlay-border);
		margin: 0;
	}

	.acf-table-pro-tab-labels-item {
		display: inline-block;
		padding: 6px 10px;
		background-color: var(--color-table-overlay-label-background);
		border: 1px solid var(--color-table-overlay-border);
		margin-top: 5px;
		margin-bottom: -1px;
		margin-right: 5px;
		border-top-left-radius: 3px;
		border-top-right-radius: 3px;
		font-size: 14px;
		font-weight: 700;
		line-height: 24px;
		color: var(--color-table-overlay-label-content);
		cursor: pointer;
	}
	.acf-table-pro-tab-labels-item.active {
		background-color: var(--color-table-overlay-label-background-active);
		border-bottom: 1px solid var(--color-table-overlay-label-border-active);
		color: var(--color-table-overlay-label-content-active);
	}

	.acf-table-pro-tab-contents {
		border-bottom: 1px solid var(--color-table-overlay-border);
		text-align: left;
	}

	.acf-table-pro-tab-contents-item {
		padding: 20px 30px;
		display: none;
	}
	.acf-table-pro-tab-contents-item.active {
		display: block;
	}

	.acf-table-pro-overlay-fieldgroup-item {
		margin-top: 20px;
		margin-bottom: 20px;
	}

	/* fields */

	/*.acf-table-pro-optionbox {
		padding-bottom: 8px;
		margin-bottom: 8px;
	}

	.acf-flexible-content .acf-table-pro-optionbox {
		border-bottom: 1px solid var(--color-table-border);
		padding-bottom: 10px;
		margin-bottom: 10px;
	}

	.acf-table-pro-optionbox-field {
		width: auto !important;
	}*/

	.acf-table-pro-overlay-field-wrap {
		margin-top: 1.3em;
		margin-bottom: 1.3em;
		display: grid;
		grid-template-areas:
		"label label label label"
		"description description description description"
		"prepend field append space"
		"message message message message";
		grid-template-columns: auto auto auto 1fr;
	}

	.acf-table-pro-overlay-field-wrap input,
	.acf-table-pro-overlay-field-wrap textare,
	.acf-table-pro-overlay-field-wrap select {
		margin: 0;
	}

	.acf-table-pro-overlay-field-wrap:has( > [type="text"]:not([size]) ) {
		grid-template-columns: auto 1fr auto auto !important;
	}

	/* prepend / append  */

	.acf-table-pro-overlay-field-prepend,
	.acf-table-pro-overlay-field-append {
		border: 1px solid #D0D5DD;
		background-color: #F9FAFB;
		display: flex;
		align-items: center;
		justify-content: center;
		padding-left: 12px;
		padding-right: 12px;
		color: #667085;
		box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.1);
	}

	.acf-table-pro-overlay-field-prepend {
		grid-area: prepend;
		border-right: 0;
		border-top-left-radius: 4px;
		border-bottom-left-radius: 4px;
	}

	.acf-table-pro-overlay-field-append {
		grid-area: append;
		border-left: 0;
		border-top-right-radius: 4px;
		border-bottom-right-radius: 4px;
	}

	.acf-table-pro-overlay-field-prepend ~ [type="text"] {
		border-top-left-radius: 0 !important;
		border-bottom-left-radius: 0 !important;
	}

	.acf-table-pro-overlay-field-append ~ [type="text"] {
		border-top-right-radius: 0 !important;
		border-bottom-right-radius: 0 !important;
	}

	/* label */

	.acf-table-pro-overlay-field-wrap label {
		display: block;
		font-weight: bold;
		font-size: 1em;
		margin-bottom: 0.6em;
		grid-area: label;
	}

	/* LAYOUT */

		.acf-table-pro-overlay-field-wrap .horizontal > div {
			display: inline-flex;
			align-items: flex-start;
		}
		.acf-table-pro-overlay-field-wrap .vertical > div {
			display: flex;
			align-items: flex-start;
		}

	/* LAYOUT */

	/* FIELDS TEXT, SELECT */

	.acf-table-pro-overlay-field-wrap [type="text"] {
		grid-area: field;
		border-color: #D0D5DD;
		padding-left: 12px;
		padding-right: 12px;
		height: 40px;
		box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.1);
	}
	.acf-table-pro-overlay-field-wrap select {
		grid-area: field;
		border-color: #D0D5DD;
		padding-left: 12px;
		padding-right: 30px;
		height: 40px;
		box-shadow: 0px 1px 2px rgba(16, 24, 40, 0.1);
	}

	.acf-table-pro-overlay-field-wrap [type="text"]:focus,
	.acf-table-pro-overlay-field-wrap select:focus {
		outline: 3px solid #EBF5FA;
		border-color: #399CCB;
	}

	/* FIELDS RADIO, CHECKBOX */

		.acf-table-pro-overlay-field-wrap [type="radio"],
		.acf-table-pro-overlay-field-wrap [type="checkbox"] {
			margin: .1rem .25rem 0 0;
			vertical-align: top;
		}
		.acf-table-pro-overlay-field-wrap [type="radio"] + label,
		.acf-table-pro-overlay-field-wrap [type="checkbox"] + label {
			margin-top: .125rem;
			margin-bottom: .6rem;
			font-weight: normal;
			display: inline-block;
			line-height: 1.1;
		}

		.acf-table-pro-overlay-field-wrap .horizontal [type="radio"] + label,
		.acf-table-pro-overlay-field-wrap .horizontal [type="checkbox"] + label {
			margin-right: 1.3rem;
		}

		/* .acf-table-pro-overlay-field-wrap .vertical [type="radio"],
		.acf-table-pro-overlay-field-wrap .vertical [type="checkbox"] {

		} */

	/* FIELDS RADIO, CHECKBOX */

	/* FIELD MESSAGE */

		.acf-table-pro-overlay-field-wrap[data-field-type="message"]._info,
		.acf-table-pro-overlay-field-wrap[data-field-type="message"]._succsess,
		.acf-table-pro-overlay-field-wrap[data-field-type="message"]._alert {
			padding: .6rem 1rem;
			border: 1px solid #c3c4c7;
			border-left-width: 4px;
			grid-area: message;
		}

		.acf-table-pro-overlay-field-wrap[data-field-type="message"]._info {
			border-left-color: #eec100;
		}
		.acf-table-pro-overlay-field-wrap[data-field-type="message"]._succsess {

			border-left-color: #00a32a;
		}
		.acf-table-pro-overlay-field-wrap[data-field-type="message"]._alert {

			border-left-color: #da0808;
		}

		.acf-table-pro-overlay-field-wrap[data-field-type="message"] ul {
			margin: 0;
		}

	/* FIELD MESSAGE */

	.acf-table-pro-overlay-field-description {
		font-size: 1em;
		margin-top: -0.6em;
		margin-bottom: 0.6em;
		color: #667085;
		grid-area: description;
	}

	[data-field-type="button"] > .acf-table-pro-overlay-field-description {
		margin-top: .6em;
		margin-bottom: 0;
	}

	._conditional_disabled {
		display: none;
	}

	.acf-table-pro-overlay-wrap textarea {
		width: 100% !important;
		height: 10rem;
		grid-area: field;
	}


	.acf-table-pro-overlay-frame .mce-fullscreen {
		height: 100%;
	}

	/* WP EDITOR FULLSCREEN MODE*/

	.acf-table-pro-overlay-frame .mce-fullscreen .mce-container-body {
		height: 100%;
		display: grid;
		grid-template-areas: "toolbar" "editor" "statusbar";
		grid-template-rows: auto 1fr auto;
	}

	.acf-table-pro-overlay-frame .mce-fullscreen .mce-top-part {
		grid-area: toolbar;

	}
	.acf-table-pro-overlay-frame .mce-fullscreen .mce-edit-area {
		grid-area: editor;
	}

	.acf-table-pro-overlay-frame .mce-fullscreen .mce-statusbar {
		grid-area: statusbar;
		padding-bottom: 20px;
	}

	.acf-table-pro-overlay-frame .mce-fullscreen iframe {
		height: 100% !important;
		max-height: unset !important;
	}

/* TOOL OVERLAY } */