/**
 * @version 2026-05-06
 *
 * styles.r.2-tablet.css
 *
 * Skin "mobile"
 */

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

@media screen and ( max-width: 540px ) {
	.ui-dialog.app-dialog-confirm {
		/*min-width: 200px;*/
		min-width: auto;
		width: 100% !important;
		left: auto !important;
	}
}

ul.menuPrimaryTouchScreen > li.home-logo {
	max-width: 160px;
	left: calc(46% - 80px);
}

section.layout-message {
	padding: 0.5em;
}
section.layout-message ul.table-2-cols > li.label {
	padding-right: 0.5em;
}

ul.ui-autocomplete.menu-touch div.autocomplete-row {
	font-size: 1.4em;
	line-height: 1.4em;
}


/** ui-accordion, cross-articles **/
html.touch-screen-mode #accordionCrossArticles.ui-accordion .ui-accordion-header > div.ym-grid > div.col-1 {
	width: 100%;
}

html.touch-screen-mode #accordionCrossArticles.ui-accordion .ui-accordion-header > div.ym-grid > div.col-2 {
	display: none;
}

.ym-wrapper.wide section.alternate.simple > .scroll-x {
	padding: 10px 1em 15px 1em;
	margin: 0 0em 0 -1em;
}

.ym-wrapper.wide.slider-action-articles section.alternate.simple > .scroll-x {
	margin: 0 0em 0 0em;
}

/*** .parallax.route-start-page ***/
.parallax {
	/* 06.02.2023 Not really supported by mobile browsers
	   https://caniuse.com/background-attachment
	*/
	/*display: none;*/
	background-attachment: scroll;
}
html.firefox .parallax,
html.chrome .parallax {
	/* except firefox */
	/*display: block;*/
	background-attachment: fixed;
}
.parallax.route-start-page {
	background-size: 200%;
}
.parallax.layout-footer-prefix {
	background-size: 170%;
}

.ym-column.type-1-3,
main .ym-column.type-1-3 {
	margin: 0;
	padding: 0;
}


header ul.layout-header > li.col-1 a.company-logo img.logo {
    display: none;
}
header ul.layout-header > li.col-1 a.company-logo img.logo-only {
    display: block !important;
    position: relative;
    top: 1px;
}

header ul.layout-header > li.col-1 {
  padding-left: 0.8em;
  padding-right: 0;
  width: 8%;
  min-width: 36px;
}
header ul.layout-header > li.col-2 {
  padding-left: 1em;
  width: 87%;
}

/*** pages bar (paginator) ***/
@media (max-width: 600px) {
	/* [<] Page 1 of 3 [>] navigation */
	/*div.pages-bar.bundle-bar {
		margin-top: calc(var(--button-small-height));
		margin-bottom: calc(var(--button-small-height) / 2);
	}*/

	/* pages at top */
	div.pages-bar.top > div.ym-gl {
		width: 100%;
	}
	/* items on a page switcher */
	div.pages-bar.top > div.ym-gr {
		display: none;
	}
	/* articles N of M in bundle bar */
	div.pages-bar.bundle-bar > div.ym-gl {
		display: none;
	}

	/** bundle-bar **/
	div.pages-bar.bundle-bar > div > ul.elements {
		margin-top: 0;
		margin-left: -0%;
		margin-right: -0%;
		width: 100%;
	}
	div.pages-bar.bundle-bar > div > ul.elements > li.element {
		--item-padding: 0 0.8% 1em 0; /* 2026-05-06 EXPERIMENTAL ON */
		width: 50%;
		padding: var(--item-padding);
	}
	div.pages-bar.bundle-bar > div > ul.elements > li.element > ul {
		width: 100%;
	}

	div.pages-bar.bundle-bar > div > ul.elements > li.element.prev-info-next {
		width: 100%;
		padding: 0;
	}

	div.pages-bar.bundle-bar > div > ul.elements > li.element > ul.prev-info-next {
		width: 100%;
		max-width: none;
		--li-button-width: var(--button-small-height);
		--li-label-width: calc(100% - 2 * var(--li-button-width));
	}

	div.pages-bar.bundle-bar > div > ul.elements > li.element > ul.prev-info-next > li.prev,
	div.pages-bar.bundle-bar > div > ul.elements > li.element > ul.prev-info-next > li.next {
		width: var(--li-button-width);
    }

	div.pages-bar.bundle-bar > div > ul.elements > li.element > ul.prev-info-next > li.label {
		width: var(--li-label-width);
		padding-left: 0;
		padding-right: 0;
    }

    div.pages-bar.bundle-bar > div > ul.elements > li.element > ul.prev-info-next > li a {
		padding-left: 0;
		padding-right: 0;
    }

	/* items ordering (?) */
	div.pages-bar.bundle-bar > div.ym-gr {
		width: 100%;
		float: left;
		margin: 0;
	}
}


/* sort order selector */
div.pages-bar.bundle-bar .sort-select-label > .ym-gl.selection {
	width: 100%;
	margin-left: 0.3em;
}
div.pages-bar.bundle-bar .sort-select-label.count-1 > .ym-gl.selection {
	margin: 0em;
	padding-left: 0;
	padding-right: 0;
}
div.pages-bar.bundle-bar .sort-select-label.count-2 > .ym-gl.selection {
	width: 50%;
	margin: 0;
	padding-left: .3em;
}
div.pages-bar.bundle-bar .sort-select-label.count-2 > .ym-gl.selection:FIRST-CHILD {
	padding-left: 0em;
}
/* pages at bottom*/
div.pages-bar.bottom > div.ym-gl {
	width: 100%;
}
/* articles N of M at bottom */
div.pages-bar.bottom > div.ym-gr {
	width: 100%;
	float: left;
	margin: 0;
}
div.pages-bar.bottom > div.ym-gr > ul {
	float: left;
}

/* ul.subgroups-inventory.mode-cells */

@media ( max-width: 860px ) {
	article.teaser,
	div.pages-bar.bundle-bar > div > ul.elements > li,
	ul.mode-cells > li.item {
		--item-width: 33.3333%;
	}
}

@media ( max-width: 650px ) {
	article.teaser,
	/*div.pages-bar.bundle-bar > div > ul.elements > li,*/
	ul.mode-cells > li.item {
	   --item-width: 50%;
	}
}

/* ul.articles-bundle-list.mode-cells */
section.alternate.simple ul.articles-bundle-list.mode-cells li.item {
	font-size: 1em;
	margin-top: 0px !important;
	margin-bottom: 0px !important;
}
section.alternate.simple ul.articles-bundle-list.mode-cells li.item:FIRST-CHILD {
	margin-left: 0px !important;
}
#sliderAction ul.articles-bundle-list.mode-cells li.item {
	font-size: 1em;
}

#sliderAction ul.articles-bundle-list.mode-cells li.item.res-availability.res-buttons article {
	min-height: 310px;
}
section.alternate.simple ul.articles-bundle-list.mode-cells > li.item .picture {
	height: 170px;
}

#sliderAction ul.articles-bundle-list.mode-cells > li.item .picture {
	height: 170px;
}
ul.articles-bundle-list.mode-cells > li.item .picture a,
ul.articles-bundle-list.mode-cells > li.item .picture img {
	max-height: 200px;
	max-width: 200px;
}
#sliderAction ul.articles-bundle-list.mode-cells > li.item .picture a,
#sliderAction ul.articles-bundle-list.mode-cells > li.item .picture img {
	max-height: 160px;
	max-width: 160px;
}

/* for noted list, where the buttons label is "In den Warenkorb" */
ul.articles-bundle-list.mode-cells > li.item section.buttons > .add-to-shopcart button {
	font-size: 12px;
}

/*** footer ***/
footer ul.layout-footer > li {
	width: 49%;
}
footer ul.layout-footer > li.company-info {
	width: 49%;
}
footer ul.layout-footer > li.company-contact,
footer ul.layout-footer > li.site-links {
	width: 49%;
	border: 0px solid;
	padding-left: 5%;
}

@media ( max-width: 650px ) {
	footer div.layout-footer.ym-grid  {
		grid-template-areas:
		"accordion"
		"contact";
		grid-template-columns: 1fr;
	}
}
footer ul.site-links {
	border: 0px solid red;
	width: auto;
	margin: 0 0 1em;
}
footer ul.site-links > li {
	float: none;
	width: auto;
	padding: 0 0em;
	border-left: 0px solid;
}

/*** footer prefix banner ***/
.ym-wrapper.wide.layout-footer-prefix {
	min-height: 300px;
}
.ym-wrapper.wide.layout-footer-prefix > .ym-wbox {
	bottom: 1em;
}
@media ( max-width: 650px ) {
	.ym-wrapper.wide.layout-footer-prefix > .ym-wbox {
		bottom: 20px;
	}
}
.ym-wrapper.wide.layout-footer-prefix div.content {
	padding-left: 1em;  /* because .ym-wrapper.wide > .ym-wbox 0em */
	padding-right: 1em; /* because .ym-wrapper.wide > .ym-wbox 0em */
}
/* title small */
.ym-wrapper.wide.layout-footer-prefix div.content div.title-small {
	margin-bottom: 1em;
	font-size: 2.5vw;
	padding: 5px 10px;
}


/** data protection label **/
.ym-form.ym-columnar .ym-fbox-check.dataprotection label {
	padding-left: 4px;
	width: 90%;
}

/*** footer.additional ***/
footer.additional .ym-wrapper > .ym-wbox {
	padding-top: 1em;
}
footer.additional div.layout-footer.additional {
	grid-template-areas:
	 "links"
	 "logo";
	grid-template-columns: 100%;
	padding-bottom: 1rem;
}

footer.additional .layout-footer.additional > div.site-links > section.site-links {
	margin: 0 auto;
}

footer.additional .layout-footer.additional > div.site-links > ul {
	width: auto;
	position: relative;
	border: 0px solid;
	margin: 0 auto;
}
@media (max-width: 48.125rem) {
	footer.additional .layout-footer.additional > div.site-links > ul {
		margin: 0 auto 0 0;
    }
	footer.additional .layout-footer.additional > div.site-links > ul > li {
		width: 25%;
		font-size: 0.875rem;
		padding-bottom: 0.4375rem;
	}
	footer.additional .layout-footer.additional > div.site-links > ul > li::before {
		content: ' ';
	}
	footer.additional .layout-footer.additional > div.site-links > ul > li > a {
		padding-left: 0;
    }
}

@media (max-width: 34.375rem) {
	footer.additional .layout-footer.additional > div.site-links > ul > li {
		width: 33%;
	}
}
footer.additional .layout-footer.additional > div.company-logo {
	padding-top: 30px;
	min-height: 0;
	text-align: center;
}
footer.additional .layout-footer.additional > div.company-logo img {
	margin: 0 auto;
}

/** .cookies-info.detailed > .buttons **/
@media (max-width: 600px) {
	section.cookies-info.detailed > .buttons > .ym-grid {
		grid-template-areas:
		"selected"
		"all";
		grid-template-columns: 1fr;
	}
	section.cookies-info.detailed > .buttons > .ym-grid > div > button {
		width: 90%;
	}
	section.cookies-info.detailed > .buttons > .ym-grid > .accept-selected {
		text-align: center;
		padding: 1em 0 1em 0;
	}

	section.cookies-info.detailed > .buttons > .ym-grid > .accept-all {
		text-align: center;
		padding: 0;
	}
}

/*** Agent ***/
@media (max-width: 740px) {
	/** agent toolbar **/
	html.agent body {
		--agent-toolbar-height: 70px;
	}
	section.agent-toolbar div.ym-grid.content > div > div {
		white-space: normal;
	}
	html.agent section.agent-toolbar div.ym-grid.content > div {
		float: none;
		width: 100%;
		text-align: left;
		margin: 0;
	}
}