@use "@db-ui/foundations/build/styles/variables";
@use "@db-ui/foundations/build/styles/screen-sizes";
@use "@db-ui/foundations/build/styles/colors";
@use "@db-ui/foundations/build/styles/helpers";

$min-mobile-header-height: calc(
	#{variables.$db-sizing-md} + 2 * #{variables.$db-spacing-fixed-xs}
);

$default-disabled: 0.4;
// 0.68 would be fine as well for a11y, but we are big Bryan Adams fans :)
$placeholder-disabled: 0.69;

%default-adaptive-border {
	border: variables.$db-border-height-3xs solid
		colors.$db-adaptive-on-bg-basic-emphasis-100-default;
}

%transparent-border {
	border: variables.$db-border-height-3xs solid transparent;
}

%component-border {
	border: variables.$db-border-height-3xs solid
		colors.$db-adaptive-on-bg-basic-emphasis-60-default;
}

%form-component-border {
	border: variables.$db-border-height-3xs solid
		colors.$db-adaptive-on-bg-basic-emphasis-70-default;
}

%default-interactive-component {
	@extend %default-adaptive-border;

	border-radius: variables.$db-border-radius-xs;
}

%default-card {
	@extend %component-border;

	/* stylelint-disable-next-line db-ui/use-border-radius */
	border-radius: var(
		--default-card-border-radius,
		#{variables.$db-border-radius-sm}
	);
}

$responsive-spacings: (
	"default": variables.$db-spacing-responsive-md,
	"large": variables.$db-spacing-responsive-lg,
	"medium": variables.$db-spacing-responsive-md,
	"small": variables.$db-spacing-responsive-sm,
	"none": 0
);

$default-spacings: (
	"default": variables.$db-spacing-fixed-sm,
	"large": variables.$db-spacing-fixed-lg,
	"medium": variables.$db-spacing-fixed-md,
	"small": variables.$db-spacing-fixed-sm,
	"none": 0
);

@mixin get-data-spacing($type: padding, $spacings: $default-spacings) {
	@each $name, $spacing in $spacings {
		@if ($name == "default") {
			&:not([data-spacing]) {
				#{$type}: $spacing;
			}

			/* stylelint-disable-next-line at-rule-empty-line-before */
		} @else {
			&[data-spacing="#{$name}"] {
				#{$type}: $spacing;
			}
		}
	}
}