/**
 * @version 30.06.2024
 *
 * styles.r.3-phone.css
 *
 * Skin "mobile"
 */

html.touch-screen-mode div.icon-development,
html.touch-screen-mode div.icon-debug {
	color: blue;
}

:root {
	--wrapper-paddings-left-right: 0.5rem;
}

/* Hide placeholders */
input::-webkit-input-placeholder {
	color:transparent;
}
input::-moz-placeholder { /* FF 19+ */
	color:transparent;
}
input:-ms-input-placeholder { /* IE 10+ */
	color:transparent;
}

/* Dropdowns are full sized now */
.ym-form.ym-full .ui-selectmenu-button.ui-button {
	width: 100%;
}

.ym-form input[type="date"].read-only,
.ym-form input[type="number"].read-only,
.ym-form input[type="text"].read-only,
.ym-form input[type="password"].read-only,
.ym-form textarea.read-only {
	padding-left: 0;
	padding-right: 0;
}

.ym-form input,
.ym-form textarea,
.ym-form select {
  width: 100%;
}
.ym-columnar .ym-message {
	margin-left: 0;
}

/** agent toolbar **/
html.agent body {
	--agent-toolbar-height: 90px;
}
html.agent.logged-out body {
	--agent-toolbar-height: 70px;
}

/*** ui-autocomplete ***/
.ui-autocomplete.ui-front {
	max-width: calc(100% - 1em); /* 1em = padding 0.5em + 0.5em */
}
.ui-autocomplete.ui-front.needleTouchScreen {
	max-width: 100%;
}

/*** parallax in footer ***/
.parallax.ym-wrapper.wide.layout-footer-prefix {
	background-size: 200%;
}

/*** pages bar (paginator) ***/
/* [<] Page 1 of 3 [>] navigation */
div.pages-bar.bundle-bar {
	margin-top: calc(var(--button-small-height) / 2);
	margin-bottom: calc(var(--button-small-height) / 2);
}
div.pages-bar.bundle-bar > div > ul.elements > li.element > ul.pages-links.prev-info-next {
	width: 100%;
}
div.pages-bar.bundle-bar > div > ul.elements > li.element > ul.pages-links.prev-info-next > li.label {
	/* expand the navigation over the whole screen */
	width: calc(100% - var(--button-small-height) * 2);
}

/** bundle-bar **/
div.pages-bar.bundle-bar > div > ul.elements {
	margin: 0;
	width: 100%;
}
div.pages-bar.bundle-bar > div > ul.elements > li.element {
	/*padding: 0% 0.8% 1.6% 0.8%;*/
	/*padding-top: 1em;*/
	padding: 0;
	width: 100%;
}
div.pages-bar.bundle-bar > div > ul.elements > li.element.filter-list {
	padding-top: 0;
}
div.pages-bar.bundle-bar > div > ul.elements > li.element.filter-list > ul > li {
	width: 100%;
	padding: 0;
}

/*** buttons for wizard ***/
.ym-grid.buttons-template.for-wizard > .ym-gr {
	float: right;
	text-align: right;
}
.ym-grid.buttons-template.for-wizard > .ym-gl {
	/*float: none;*/
    text-align: left;
}

.ym-grid.buttons-template.for-wizard.final-step.count-1 > .ym-gr,
.ym-grid.buttons-template.for-wizard.final-step.count-1 > .ym-gl {
	width: 100%;
	text-align: center;
	float: none;
}

.ym-grid.buttons-template.for-wizard.final-step.count-1 > .ym-gr > *,
.ym-grid.buttons-template.for-wizard.final-step.count-1 > .ym-gl > * {
	text-align: center;
}

.ui-dialog.app-dialog-confirm {
	/*min-width: 200px;*/
	min-width: auto;
	width: 100% !important;
}

.ui-autocomplete.menu-touch {
	max-width: 93%;
}
ul.ui-autocomplete.menu-touch .ui-menu-item-wrapper {
	padding: 0.3em 0.4em;
}
ul.ui-autocomplete.menu-touch div.autocomplete-row {
	font-size: 1.4em;
	line-height: 1.4em;
}
ul.ui-autocomplete.menu-touch div.autocomplete-row div.caption {
	width: 100%;
}
ul.ui-autocomplete.menu-touch div.autocomplete-row div.suffix {
	display: none;
}

/** cells with input and button **/
ul.mode-cells .input-and-button-text .ui-spinner,
ul.mode-cells .input-unit-button-text .ui-spinner {
	display: block; /* fix the not same position with the button */
}

header ul.layout-header ul.search-line {
  margin: 0.5em 0 0em;
}


section.layout-message ul.table-2-cols > li.value {
    width: 80%;
}


header ul.layout-header ul.search-line > li.col-1 {
    width: 100%;
}
header ul.layout-header ul.search-line > li.col-2 {
    width: 100%;
    padding-left: 0;
    margin: 0.5em 0 0.5em;
}

header ul.layout-header ul.search-line > li.col-2 section.language-selector {
  width: 100%;
}

ul.language-selector li {
  width: 20%;
  margin: 0px;
  text-align: center;
}

ul.language-selector li a {
    display: inline-block;
}

/*** layout messages ***/
section.layout-message {
	padding: 0.20em 0.5em;
}
section.layout-message > ul > li.icon {
	display: none;
}
section.layout-message ul.table-2-cols > li.value {
	width: 100%;
}

/** Layouts titles **/

/*** articles group teaser ***/
article.teaser.article-group > .picture {
	float: none;
	padding: 0 0 1em 0;
	width: 100%;
}
article.teaser > .picture * {
	width: 100%;
	height: auto;
}
article.teaser > .text {
	display: block;
	width: 100%;
	margin-bottom: 2em;
}

section.layout-message.box {
	border-radius: 0;
}

/** section.module-inventory **/
section.module-inventory {
	font-size: 90%;
}
section.module-inventory > ul.table-2-cols > li.value {
	width: 84%;
}
section.module-inventory > ul.table-2-cols > li a {
	line-height: 1.3em;
}

div.pages-bar.top {
	display: none;
}

div.pages-bar.bottom {
	padding-top: 1em;
}

/* ul.articles-bundle-list.mode-cells */
ul.articles-bundle-list.mode-cells {
	margin: 0px;
	width: 100%;
}
/* 02.02.2024 OFF due to refactoring to flex */
/*
button.with-suffix-image {
	--width-image: 7%;
}
*/

/** mode-cell item **/
article.teaser,
ul.mode-cells > li.item {
	--item-padding: 0% 1.8% 4% 1.8%;
}

/* ul.subgroups-inventory.mode-cells */
@media ( max-width: 400px ) {
	.ym-column.type-3 ul.subgroups-inventory.mode-cells > li.item {
	   --item-width: 100%;
	}

	html.touch-screen-mode article.teaser,
	html.touch-screen-mode ul.mode-cells > li.item {
	   --item-width: 100%;
	}

	article.teaser,
	ul.mode-cells > li.item {
		--item-padding: 0% 0% 4% 0%;
	}

	ul.mode-cells.subgroups-inventory > li.item {
		--item-padding: 0% 0.8% 4% 0.8%;
	}
}
/** field "captcha" **/
.ym-form .ym-fbox.field-captcha {
	margin-top: 1em;
	/* max-width: 300px; */
	/*margin-left: auto;*/ /* centering of the captcha field width its label */
	margin-right: auto;

}
.ym-form .ym-fbox.field-captcha img {
	height: auto;
}
.ym-form .ym-fbox.field-captcha input[type="number"],
.ym-form .ym-fbox.field-captcha input[type="text"] {
	text-align: center;
}
.ym-form .ym-fbox.field-captcha label.required {
	height: auto;
}
.ym-form .ym-fbox.field-captcha img,
.ym-form .ym-fbox.field-captcha input[type="number"],
.ym-form .ym-fbox.field-captcha input[type="text"] {
	float: none;
	width: 100%;
	text-align: center;
}

/**** wizard buttons ****/
section.buttons-template.for-wizard.count-1 > * {
	width: 100%;
	margin: 0;
	padding: 0;
	float: none;
}

/*** footer ***/
footer ul.layout-footer > li {
	width: 100% !important;
	padding-left: 0em !important;
	margin-bottom: 1em;
	text-align: center;
}

footer ul.layout-footer > li.company-info {
	margin-bottom: 1.5em;
}
footer ul.layout-footer > li.company-info a {
	border: 0px solid ;
	display: block;
	/*text-align: center;*/
}
footer ul.layout-footer > li.company-info a img {
	width: 68%;
	margin: 0 0 0 -7%;	/* -7% only for logo "Parity" */
}

footer ul.layout-footer > li.company-contact > ul {
	margin: 0;

}
footer ul.layout-footer > li.site-links {
	margin-bottom: 0;
}

footer ul.layout-footer > li.site-links > ul {
	width: 100%;
}

footer ul.layout-footer section.form-newsletter-pre-subscribe {
	width: 100%;
	border: 0px solid;
	/*text-align: left;*/
}

footer ul.layout-footer section.form-newsletter-pre-subscribe > label {
	margin-bottom: 10px;
	display: block;
}


footer ul.layout-footer section.form-newsletter-pre-subscribe > form > ul {
	width: 90%;
	margin: 0 auto;
}

section.form-newsletter-pre-subscribe form.text-submit.li-value-div ul.table-2-cols li.label {
	width: 88%;
	width: calc(98% - 25px);
}

footer.additional ul.shop-creator {
	border: 0px solid;
	width: 230px;
	margin: 0 0 0 2%;
}

/*** footer prefix banner ***/
/** Footer Prefix **/
.ym-wrapper.wide.layout-footer-prefix {
	min-height: 230px; /* 2022-03-08 because of lazy load prefix.jpg */
}

@media screen and ( max-width: 360px )  {
	ul.menuPrimaryTouchScreen > li.link.step-up {
		display: none;
	}
	.ym-wrapper.wide.layout-footer-prefix div.content {
		display: none;
	}
}

/*** footer.additional ***/
footer.additional .layout-footer.additional > div.site-links > ul > li {
	width: 50%;
	font-size: 0.875rem;
	padding-bottom: 0.4375rem;
}