@import "./InvisibleTextStyles.css";

:host(:not([hidden])) {
	display: block;
	height: 100%;
	width: 100%;
	overflow: auto;
	container-type: inline-size;
}

/* S Size */
@container (max-width: 599px) {
	:host::part(navigator),
	:host::part(step-content) {
		padding-left: 1rem;
		padding-right: 1rem;
	}
}

/* M Size */
@container (min-width: 600px) and (max-width: 1023px) {
	:host::part(navigator),
	:host::part(step-content) {
		padding-left: 2rem;
		padding-right: 2rem;
	}
}

/* L Size */
@container (min-width: 1024px) and (max-width: 1439px) {
	:host::part(navigator),
	:host::part(step-content) {
		padding-left: 2rem;
		padding-right: 2rem;
	}
}

/* XL Size */
@container (min-width: 1440px) {
	:host::part(navigator),
	:host::part(step-content) {
		padding-left: 3rem;
		padding-right: 3rem;
	}
}

.ui5-wiz-root {
	height: 100%;
	width: 100%;
	position: relative;
}

.ui5-wiz-content {
	position: relative;
	overflow: auto;
	height: calc(100% - 4rem); /* the navigation height is 4rem */
	box-sizing: border-box;
	background: var(--sapBackgroundColor);
}

.ui5-wiz-content-item {
	display: block;
	box-sizing: border-box;
	padding-top: 1rem;
	padding-bottom: 1rem;
}

:host([content-layout="SingleStep"]) .ui5-wiz-content-item:not(.ui5-wiz-content-item-selected) {
	display: none;
}

.ui5-wiz-content-item-wrapper {
	display: block;
	padding: var(--_ui5_wiz_content_item_wrapper_padding);
	background-color: var(--_ui5_wiz_content_item_wrapper_bg);
	border-radius: var(--sapElement_BorderCornerRadius);
}

.ui5-wiz-content-item[hidden] {
	display: none;
}

.ui5-wiz-content-item.ui5-wiz-content-item-stretch {
	/* Add 2rem to ensure there is enough scroll height to reach the last step */
	min-height: 100%;
}

[ui5-wizard-tab][data-ui5-wizard-expanded-tab="true"] + [ui5-wizard-tab][data-ui5-wizard-expanded-tab="false"] {
	width: 2rem;
	padding-left: .5rem;
}

[ui5-wizard-tab][data-ui5-wizard-expanded-tab="false"] {
	width: .25rem;
	padding: 0;
}
.ui5-wiz-nav-list {
	display: table;
	table-layout: fixed;
	position: relative;
	list-style: none;
	margin: 0;
	box-sizing: border-box;
	width: 100%;
	height: 2rem;
	padding: 0;
}

[ui5-wizard-tab] {
	display: table-cell;
	position: relative;
}

.ui5-wiz-nav {
	box-sizing: border-box;
	height: 4rem;
	padding-top: 1rem;
	padding-bottom: 1rem;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
	background-color: var(--sapObjectHeader_Background);
	font-size: .875rem;
	box-shadow: var(--sapContent_HeaderShadow);
	outline: none;
	display: flex;
	align-items: center;
	transform: scale(1);
}

[ui5-wizard-tab][data-ui5-wizard-expanded-tab="false"] + [ui5-wizard-tab][data-ui5-wizard-expanded-tab="false"] {
	width: .25rem;
}

[ui5-wizard-tab][data-ui5-wizard-expanded-tab-prev="true"],
[ui5-wizard-tab][data-ui5-wizard-expanded-tab="false"] + [ui5-wizard-tab][data-ui5-wizard-expanded-tab-prev="true"] {
	width: 2rem;
	padding-right: .75rem;
}