@import 'tailwindcss/base';
@import 'tailwindcss/components';
@import 'tailwindcss/utilities';

#quickwp {
	--wp-admin-theme-color: #ffffff;

	.components-base-control {
		.components-text-control__input {
			@apply bg-transparent max-w-xl border-0 h-12 text-2xl not-italic font-normal text-fg shadow-none;
		}

		.components-textarea-control__input {
			@apply bg-transparent max-w-5xl h-24 border-0 text-2xl not-italic font-normal text-fg shadow-none resize-none;
		}

		&.is-light {
			.components-text-control__input {
				@apply text-black bg-white h-10 w-full max-w-full text-xs p-3;

				&::placeholder {
					@apply text-black/50;
				}
			}
		}
	}

	.components-text-control__input::placeholder,
	.components-textarea-control__input::placeholder {
		@apply text-fg/50 shadow-none;
	}

	.components-button {
		&.is-primary {
			@apply bg-transparent w-fit h-auto border border-solid border-fg text-fg rounded-md px-6 py-4 transition-all text-lg not-italic font-medium;

			&:hover {
				@apply bg-fg text-bg;
			}

			&:disabled {
				@apply opacity-50;
			}

			.components-spinner {
				@apply m-0 ml-3;
			}
		}

		&.is-secondary {
			@apply bg-secondary w-fit h-auto text-fg rounded-md px-6 py-4 transition-all text-lg not-italic font-medium shadow-none;

			&:hover {
				@apply bg-fg text-bg;
			}

			&:disabled {
				@apply opacity-50;
			}
		}

		&.is-token {
			@apply text-xs leading-none px-4 py-2;

			&.is-active {
				@apply bg-active text-white;
			}
		}
	}

	.block-editor-block-preview__content {
		max-height: none !important;

		iframe {
			max-height: none !important;
		}
	}
}
