@use "sass:map";
@use "@db-ui/foundations/build/styles/variables";
@use "@db-ui/foundations/build/styles/fonts";
@use "@db-ui/foundations/build/styles/colors";
@use "@db-ui/foundations/build/styles/icons";
@use "../../styles/internal/component";
@use "../../styles/internal/form-components";
@use "../../styles/internal/scrollbar";

%resize-textarea {
	&[data-resize="none"] {
		resize: none;
	}

	&[data-resize="both"] {
		resize: both;
	}

	&[data-resize="horizontal"] {
		resize: horizontal;
	}

	&[data-resize="vertical"] {
		resize: vertical;
	}
}

@mixin get-scrolling-workaround() {
	border-radius: variables.$db-border-radius-xs 0 0 0;
	position: absolute;
	content: "";
	inset-block-start: 0;
	block-size: form-components.$floating-label-size-calc;
	margin-inline: 0;
	inline-size: calc(100% - #{scrollbar.$scrollbar-width} - 1px);
	inset-inline: 0;
}

.db-textarea {
	@include form-components.set-default-form-component(textarea);

	textarea {
		@extend %resize-textarea;
		@extend %scrollbar;

		cursor: auto;
		overflow-y: scroll;

		// we don't have icons in textarea so we can overwrite it here
		padding-block: variables.$db-spacing-fixed-xs
			variables.$db-spacing-fixed-xs;
	}

	&[data-variant="floating"] {
		&:has(textarea:is(:focus-within, :not(:placeholder-shown))) {
			&::before {
				@extend %default-transition;

				@include get-scrolling-workaround();

				background-color: colors.$db-adaptive-bg-basic-level-1-default;
			}

			&::after {
				@extend %form-component-border;

				@include get-scrolling-workaround();

				background-color: colors.$db-adaptive-bg-basic-transparent-semi-default;
				z-index: 1;
				border-block-end: none;
				border-inline-end: none;
			}

			&:has(textarea:read-only)::after {
				background-color: colors.$db-adaptive-bg-basic-level-1-default !important;
			}

			&:has(textarea:not(:disabled):is(:hover, :focus)) {
				&::after {
					background-color: colors.$db-adaptive-bg-basic-transparent-hovered;
				}
			}
		}
	}
}