/*
 * Angleichung an das Layout des neuen B2B-Shops (www.pco-group.com)
 *
 * Grundlage bleibt assets/newshop/styles.css (gleiches Magento-Design wie im B2B-Shop).
 * Hier stehen nur die Ergänzungen, die im B2B-Shop aus Bootstrap bzw. dessen eigenem CSS kommen.
 * Alles hängt an body.b2blayout, damit alte Seiten ohne neues Layout unberührt bleiben.
 */

/* ---------- Schrift wie im B2B-Shop ---------- */
body.b2blayout,
body.b2blayout td,
body.b2blayout th,
body.b2blayout input,
body.b2blayout select,
body.b2blayout textarea,
body.b2blayout button,
body.b2blayout .arial,
body.b2blayout .arialklein,
body.b2blayout .arialmittel,
body.b2blayout .arialmittelrot {
	font-family: 'Open Sans', sans-serif;
}

/* ---------- Obere Leiste ---------- */
body.b2blayout .topHeader .b2bTopRow {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 15px;
}

body.b2blayout .topHeader .shortLinks ul.links {
	margin: 0;
	padding: 0;
}

body.b2blayout .topHeader .b2bSwitcher {
	display: flex;
	align-items: center;
	gap: 10px;
}

body.b2blayout .topHeader .b2bSwitcher select {
	background-color: #6c757d;
	color: #fff;
	border: 0;
	border-radius: 4px;
	padding: 6px 12px;
	font-size: 15px;
	cursor: pointer;
}

body.b2blayout .topHeader .b2bLanguages a {
	display: inline-block;
	padding: 2px 3px;
	opacity: .6;
}

body.b2blayout .topHeader .b2bLanguages a.lang_active,
body.b2blayout .topHeader .b2bLanguages a:hover {
	opacity: 1;
}

/* ---------- Hauptnavigation ---------- */
@media (min-width: 768px) {
	body.b2blayout .grid.headNav {
		padding: 0 50px;
	}
}

body.b2blayout nav.b2bNav ul li.home a {
	width: 19px;
	background-position: center;
	background-repeat: no-repeat;
}

body.b2blayout .headNav .navigationRow {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}

body.b2blayout .headNav .navigationHolder {
	flex: 1 1 auto;
}

body.b2blayout .headNav .shortOptionHolder {
	flex: 0 0 auto;
}

body.b2blayout .headNav .navigationRow > .clear,
body.b2blayout .headNav .navigationRow > div[style] {
	flex: 0 0 100%;
}

body.b2blayout nav.b2bNav ul {
	display: flex;
	align-items: center;
	margin: 0;
	padding: 0;
	list-style: none;
}

body.b2blayout nav.b2bNav ul li {
	float: none;
	margin: 0;
}

body.b2blayout nav.b2bNav ul li a {
	display: block;
	padding: 15px 8px;
	color: #3c3c3b;
	font-family: 'Open Sans Condensed', sans-serif;
	font-weight: 700;
	font-size: 20px;
	line-height: 24px;
	text-transform: uppercase;
	text-decoration: none;
}

body.b2blayout nav.b2bNav ul li.active a,
body.b2blayout nav.b2bNav ul li a:hover {
	color: #db0812;
}

/* ---------- Linke Menübox (wie Konto-/Kategoriebox im B2B-Shop) ---------- */
body.b2blayout aside .b2bMenuBox {
	margin-bottom: 30px;
}

body.b2blayout aside .b2bMenuBox .b2bUserInfo {
	padding: 10px 12px;
	line-height: 150%;
}

/* ---------- Mobil ---------- */
/* Die Magento-CSS blendet Leiste, Navigation und Warenkorb auf kleinen Bildschirmen aus
   (dort gab es früher ein Burger-Menü). Hier bleiben sie sichtbar, damit der Warenkorb erreichbar ist. */
@media (max-width: 1023px) {
	body.b2blayout .topHeader,
	body.b2blayout .headNav .navigationHolder,
	body.b2blayout .headNav .shortOptionHolder {
		display: block;
	}

	/* Mobil-Menü der Magento-CSS (dunkle Klappbox) neutralisieren */
	body.b2blayout .headNav .navigationHolder {
		float: none;
		width: auto;
		height: auto;
		background: none;
	}

	body.b2blayout nav.b2bNav,
	body.b2blayout nav.b2bNav ul {
		width: auto;
		height: auto;
		padding: 0;
	}

	body.b2blayout nav.b2bNav ul li {
		display: block;
	}

	body.b2blayout .headNav .shortOptionHolder,
	body.b2blayout .headNav .cartHolder .cart {
		width: auto;
		height: auto;
	}

	body.b2blayout .topHeader .shortLinks {
		float: none;
		width: auto;
		height: auto;
	}

	body.b2blayout .topHeader .shortLinks li {
		width: auto;
	}
}

@media (max-width: 767px) {
	body.b2blayout .topHeader {
		padding: 8px 0;
	}

	body.b2blayout .headNav .navigationHolder {
		flex: 1 1 100%;
	}

	body.b2blayout .topHeader .b2bTopRow {
		flex-wrap: wrap;
	}

	body.b2blayout nav.b2bNav ul {
		flex-wrap: wrap;
	}

	body.b2blayout nav.b2bNav ul li a {
		padding: 8px 6px;
		font-size: 16px;
	}
}

/* ---------- Bestellformular wie Bestell-Liste im B2B-Shop ---------- */
body.b2blayout .b2bBstfrmHeader {
	margin-bottom: 20px;
	padding-bottom: 15px;
	border-bottom: 2px solid #ededed;
}

body.b2blayout .b2bBstfrmHeader .categoryDetailBar .icon img {
	width: 50px;
	height: 50px;
}

body.b2blayout .b2bBstfrmHeader .categoryDetailBar h2 {
	font-size: 20px;
	color: #3c3c3b;
}

body.b2blayout .b2bBstfrm {
	padding: 0;
}

body.b2blayout .b2bBstfrm fieldset {
	border: 0 none;
	margin: 0;
	padding: 0;
	background: none;
}

body.b2blayout .b2bBstfrm .b2bHinweis {
	font-size: 15px;
	line-height: 140%;
	margin: 0 0 15px;
}

body.b2blayout .b2bBstfrm .b2bGruppe {
	margin: 20px 0 1px;
}

body.b2blayout .b2bBstfrm .b2bGruppe .categoryDetailBar h2 {
	font-size: 17px;
	padding: 4px 10px;
	text-transform: uppercase;
}

body.b2blayout .b2bBstfrm ul.wishListItems {
	margin: 0;
	padding: 0;
	list-style: none;
}

body.b2blayout .b2bBstfrm .wishListItem > div {
	display: flex;
	align-items: stretch;
}

body.b2blayout .b2bBstfrm .wishListItem .image {
	float: none;
	flex: 0 0 70px;
	width: 70px;
	padding: 5px;
	box-sizing: border-box;
	background: #ffffff;
	border: 1px solid #ededed;
	display: flex;
	align-items: center;
	justify-content: center;
}

body.b2blayout .b2bBstfrm .wishListItem .image img {
	max-width: 58px;
	max-height: 50px;
}

body.b2blayout .b2bBstfrm .wishListItem .b2bKeinBild {
	display: block;
	width: 40px;
	height: 40px;
	background: #f6f6f6;
}

body.b2blayout .b2bBstfrm .wishListItem .wlDetails {
	float: none;
	flex: 1 1 auto;
	width: auto;
	padding: 8px 15px;
}

body.b2blayout .b2bBstfrm .wishListItem .wlDetails .productname {
	font-family: 'Open Sans Condensed', sans-serif;
	font-weight: 700;
	font-size: 18px;
	text-transform: uppercase;
	color: #3c3c3b;
}

body.b2blayout .b2bBstfrm .wishListItem .wlDetails .vpe_artikelnr {
	font-size: 15px;
	color: #575756;
}

body.b2blayout .b2bBstfrm .wishListItem .amount {
	float: none;
	flex: 0 0 170px;
	width: 170px;
	min-height: 0;
	border-top: 0 none;
	border-right: 0 none;
	border-left: 1px solid #ffffff;
	padding: 0 12px;
	display: flex;
	align-items: center;
	gap: 6px;
}

body.b2blayout .b2bBstfrm .wishListItem .amount input {
	float: none;
	max-width: 75px;
	padding: 3px 6px;
}

body.b2blayout .b2bBstfrm .wishListItem .amount span {
	float: none;
	padding: 0;
	font-size: 14px;
}

/* Knopfleiste bleibt beim Scrollen unten sichtbar (wie der Sticky-Button im B2B-Shop) */
body.b2blayout .b2bBstfrm .b2bButtonLeiste {
	position: sticky;
	bottom: 0;
	z-index: 5;
	display: flex;
	justify-content: flex-end;
	gap: 10px;
	padding: 15px 0;
	background: #ffffff;
	border-top: 2px solid #ededed;
}

body.b2blayout .b2bBstfrm .b2bButtonLeiste button.button {
	width: auto;
}

body.b2blayout button.button.b2bButtonGrau {
	background: #9d9d9c;
}

@media (max-width: 767px) {
	body.b2blayout .b2bBstfrm .wishListItem > div {
		flex-wrap: wrap;
	}

	body.b2blayout .b2bBstfrm .wishListItem .wlDetails {
		flex: 1 1 calc(100% - 70px);
	}

	body.b2blayout .b2bBstfrm .wishListItem .amount {
		flex: 1 1 100%;
		width: auto;
		border-left: 0 none;
		border-top: 1px solid #ffffff;
		padding: 6px 12px;
	}
}

@media print {
	body.b2blayout .topHeader,
	body.b2blayout .headNav,
	body.b2blayout aside,
	body.b2blayout footer,
	body.b2blayout .b2bButtonLeiste {
		display: none !important;
	}
}

/* ---------- Login wie im B2B-Shop ---------- */
body.b2blayout .singleHeadline {
	padding: 0 0 20px;
}

body.b2blayout .singleHeadline h2 {
	font-size: 20px;
	color: #3c3c3b;
}

body.b2blayout .b2bLogin {
	max-width: 740px;
}

body.b2blayout .b2bLogin h3 {
	font-family: 'Open Sans', sans-serif;
	font-weight: 400;
	font-size: 17px;
	margin: 0 0 10px;
}

body.b2blayout .b2bLogin p {
	font-size: 16px;
	line-height: 150%;
	margin: 0 0 10px;
}

body.b2blayout .b2bLogin ul.messages {
	list-style: none;
	margin: 0 0 20px;
	padding: 0;
}

body.b2blayout .b2bLogin .formLinks {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 15px;
}

body.b2blayout .b2bLogin .formLinks > div {
	float: none;
	width: auto;
}

body.b2blayout .b2bLogin .requiredInfo {
	padding: 20px 0 30px;
}

body.b2blayout .b2bLogin .b2bNeuerKunde {
	border-top: 2px solid #ededed;
	padding-top: 20px;
}

@media (max-width: 767px) {
	body.b2blayout .formField .inputHolder .field.half > span {
		width: 100%;
		padding-left: 0;
		padding-right: 0;
	}

	body.b2blayout .b2bLogin .formLinks {
		flex-wrap: wrap;
	}
}

/* Altes Einzelstyling von #logininput / .logininput (assets/css/main.css) aufheben; ID-Regel braucht eigenen ID-Selektor */
body.b2blayout .b2bLogin .formField .inputHolder .field > span input,
body.b2blayout .b2bLogin #logininput {
	width: 100%;
	height: auto;
	box-sizing: border-box;
	padding: 10px;
	border: 1px solid #dadada;
	background: #ffffff;
	font-size: 15px;
}

/* =====================================================================
 * Alte Inhaltsseiten (Mein Konto, Warenkorb, Bestellschritte, Passwort …)
 * ohne Umbau der Views an den B2B-Stil angleichen: Überschriften,
 * Formularblöcke (fieldset/legend), Eingabefelder, Tabellen, Knöpfe.
 * Gilt nur im Inhaltsbereich #page; die neu gebauten Seiten
 * (.b2bBstfrm, .b2bLogin) bringen eigene Regeln mit.
 * ===================================================================== */

/* Überschrift wie .singleHeadline im B2B-Shop */
body.b2blayout #page h1 {
	margin: 0 0 20px;
	padding: 0 0 12px;
	background: none;
	border-bottom: 2px solid #ededed;
	font-family: 'Open Sans Condensed', sans-serif;
	font-weight: 700;
	font-size: 20px;
	text-transform: uppercase;
	color: #3c3c3b;
}

/* Formularblöcke: kein Rahmen, Titel als grauer Balken (wie Gruppenkopf der Bestell-Liste) */
body.b2blayout #page fieldset {
	border: 0 none;
	margin: 0 0 25px;
	padding: 0;
	min-width: 0;
}

body.b2blayout #page fieldset legend {
	display: block;
	float: left;
	width: 100%;
	box-sizing: border-box;
	margin: 0 0 12px;
	padding: 6px 12px;
	background: #9d9d9c;
	color: #ffffff;
	font-family: 'Open Sans Condensed', sans-serif;
	font-weight: 700;
	font-size: 17px;
	text-transform: uppercase;
}

body.b2blayout #page fieldset legend + * {
	clear: both;
}

body.b2blayout #page fieldset legend b {
	font-weight: 700;
}

/* Eingabefelder wie im B2B-Formular */
body.b2blayout #page input[type=text],
body.b2blayout #page input[type=password],
body.b2blayout #page input[type=email],
body.b2blayout #page input[type=number],
body.b2blayout #page input:not([type]),
body.b2blayout #page select,
body.b2blayout #page textarea,
body.b2blayout #page #kdinput,
body.b2blayout #page .kdinput {
	box-sizing: border-box;
	max-width: 100%;
	padding: 8px 10px;
	border: 1px solid #dadada;
	background: #ffffff;
	font-family: 'Open Sans', sans-serif;
	font-size: 15px;
	color: #3c3c3b;
}

body.b2blayout #page input[readonly] {
	background: #f6f6f6;
	color: #7c7c7b;
}

body.b2blayout #page select {
	height: 40px;
}

body.b2blayout #page .kdinput,
body.b2blayout #page #kdinput,
body.b2blayout #page .kdtextarea {
	width: 100%;
	max-width: 445px;
}

body.b2blayout #page .kdtextarea {
	height: 90px;
}

/* Formulartabellen (Kundendaten im Bestellablauf) */
body.b2blayout #page fieldset table {
	width: 100%;
	border: 0 none;
	border-collapse: collapse;
	background: none;
}

body.b2blayout #page fieldset table tr {
	border: 0 none;
	background: none;
}

body.b2blayout #page fieldset table td {
	padding: 5px 10px 5px 0;
	border: 0 none;
	font-size: 14px;
	vertical-align: middle;
}

body.b2blayout #page fieldset table td:first-child {
	width: 180px;
	color: #575756;
}

/* Mein Konto: Beschriftung links, Feld rechts */
body.b2blayout #page .myaccountfs label {
	width: 180px;
	padding-top: 9px;
	font-size: 14px;
	color: #575756;
}

body.b2blayout #page .myaccountfs .fields {
	width: auto;
	max-width: 445px;
	margin-left: 180px;
	padding: 3px 0;
}

body.b2blayout #page .myaccountfs .fields input {
	width: 100%;
}

body.b2blayout #page .myaccountfs .fields1,
body.b2blayout #page .myaccountfs .fields2 {
	width: 220px;
	padding: 3px 0;
}

body.b2blayout #page .myaccountfs .fields1 input,
body.b2blayout #page .myaccountfs .fields2 input {
	width: 100%;
}

body.b2blayout #page .myaccountkdnr {
	text-align: left;
	padding: 0 0 15px;
	font-size: 15px;
	color: #575756;
}

body.b2blayout #page .myaccountfs .hinweis {
	border: 1px solid #dadada;
	background: #f6f6f6;
	padding: 10px;
}

/* Knöpfe wie im B2B-Shop: rot, Großbuchstaben, ohne Rundung */
body.b2blayout #page input.button,
body.b2blayout #page input.butweiter,
body.b2blayout #page input.butaktualisieren,
body.b2blayout #page input[type=submit],
body.b2blayout #page input[type=button] {
	display: inline-block;
	width: auto !important;
	height: auto;
	margin-top: 10px;
	padding: 12px 20px;
	border: 0 none;
	border-radius: 0;
	background: #db0812;
	color: #ffffff;
	font-family: 'Open Sans Condensed', sans-serif;
	font-weight: 700;
	font-size: 16px;
	text-transform: uppercase;
	cursor: pointer;
	box-shadow: none;
	transition: background-color 200ms ease-in-out;
}

body.b2blayout #page input.button:hover,
body.b2blayout #page input.butweiter:hover,
body.b2blayout #page input.butaktualisieren:hover,
body.b2blayout #page input[type=submit]:hover,
body.b2blayout #page input[type=button]:hover {
	background: #3c3c3b;
	color: #ffffff;
}

/* Nebenknöpfe (z. B. „Aktualisieren“, „Passwort vergessen“) grau */
body.b2blayout #page input.butaktualisieren,
body.b2blayout #page input[type=button].button {
	background: #9d9d9c;
}

/* Warenkorb- und Listentabellen: graue Zeilen statt roter Linien */
body.b2blayout #page table.wklistentab1,
body.b2blayout #page table.wksumlistentab1,
body.b2blayout #page table.listentab1 {
	border-collapse: collapse;
}

body.b2blayout #page table.wklistentab1 tr th,
body.b2blayout #page table.listentab1 tr th {
	padding: 8px 6px;
	border-bottom: 2px solid #ededed;
	font-family: 'Open Sans Condensed', sans-serif;
	font-weight: 700;
	font-size: 15px;
	text-transform: uppercase;
	color: #3c3c3b;
}

body.b2blayout #page table.wklistentab1 tr td,
body.b2blayout #page table.listentab1 tr td {
	padding: 8px 6px;
	border-bottom: 1px solid #ffffff;
	background: #ededed;
	font-size: 14px;
}

body.b2blayout #page table.wklistentab1 tr td.wktdgroup {
	background: #9d9d9c;
	color: #ffffff;
	font-family: 'Open Sans Condensed', sans-serif;
	font-size: 15px;
	text-transform: uppercase;
}

body.b2blayout #page table.wksumlistentab1 tr td {
	padding: 4px 6px;
	font-size: 14px;
}

/* AGB-Kasten im Bestellablauf */
body.b2blayout #page iframe[name=AGB] {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
	border: 1px solid #dadada !important;
}

@media (max-width: 767px) {
	body.b2blayout #page .myaccountfs label {
		float: none;
		display: block;
		width: auto;
	}

	body.b2blayout #page .myaccountfs .fields {
		margin-left: 0;
	}

	body.b2blayout #page .myaccountfs .fields1,
	body.b2blayout #page .myaccountfs .fields2 {
		width: 48%;
		margin-left: 0;
		margin-right: 2%;
	}

	body.b2blayout #page fieldset table td:first-child {
		width: 110px;
	}
}

/* Mengenfeld im Bestellformular behält seine kompakte Form (die allgemeine Feldregel oben ist stärker) */
body.b2blayout #page .b2bBstfrm .wishListItem .amount input {
	width: 100%;
	max-width: 75px;
	padding: 3px 6px;
	font-weight: 600;
	font-size: 16px;
	text-align: right;
}

/* Warenkorb: erste Zeile dient nur der Spaltenbreite, kein grauer Streifen */
body.b2blayout #page table.wklistentab1 tr:first-child td {
	padding: 0;
	border: 0 none;
	background: none;
}

/* Kleine Mengenfelder (Warenkorb, Favoriten) */
body.b2blayout #page input.textfeldklein {
	width: 60px;
	padding: 4px 6px;
	text-align: right;
}

/* „Aktualisieren“ im Warenkorb grau, „Weiter zur Kasse“ bleibt rot */
body.b2blayout #page form[name=wkform] input[type=submit] {
	background: #9d9d9c;
}

body.b2blayout #page form[name=wkform] input[type=submit]:hover {
	background: #3c3c3b;
}

/* ---------- Warenkorb wie im B2B-Shop (views/schritt1_warenkorb.php) ---------- */
body.b2blayout .b2bCartKunde {
	display: inline-block;
	margin: 0 0 20px;
	padding: 12px 15px;
	background: #f6f6f6;
	font-size: 14px;
	line-height: 150%;
}

body.b2blayout .b2bCart {
	border: 1px solid #dadada;
}

body.b2blayout .b2bCartRow {
	display: flex;
	align-items: stretch;
}

body.b2blayout .b2bCartRow > div {
	box-sizing: border-box;
	padding: 15px;
	border-right: 1px solid #dadada;
}

body.b2blayout .b2bCartRow > div:last-child {
	border-right: 0 none;
}

body.b2blayout .b2bCartImage { flex: 0 0 130px; text-align: center; }
body.b2blayout .b2bCartName  { flex: 1 1 auto; min-width: 0; }
body.b2blayout .b2bCartPrice { flex: 0 0 130px; text-align: right; }
body.b2blayout .b2bCartQty   { flex: 0 0 100px; }
body.b2blayout .b2bCartSum   { flex: 0 0 140px; text-align: right; }
body.b2blayout .b2bCartTrash { flex: 0 0 60px; padding: 0 !important; }

body.b2blayout .b2bCartHeader {
	background: #ededed;
}

body.b2blayout .b2bCartHeader > div {
	border-right-color: #ffffff;
	font-family: 'Open Sans Condensed', sans-serif;
	font-weight: 700;
	font-size: 16px;
	text-transform: uppercase;
	color: #3c3c3b;
}

body.b2blayout .b2bCartGroup {
	padding: 6px 15px;
	background: #9d9d9c;
	color: #ffffff;
	font-family: 'Open Sans Condensed', sans-serif;
	font-weight: 700;
	font-size: 16px;
	text-transform: uppercase;
}

body.b2blayout .b2bCartItem {
	border-top: 1px solid #dadada;
}

body.b2blayout .b2bCartItem > div {
	font-weight: 600;
	font-size: 15px;
}

body.b2blayout .b2bCartItem .b2bCartImage {
	padding: 10px;
}

body.b2blayout .b2bCartItem .b2bCartImage img {
	max-width: 100%;
	max-height: 100px;
}

body.b2blayout .b2bCartItem .b2bCartPrice,
body.b2blayout .b2bCartItem .b2bCartSum {
	padding-top: 40px;
}

body.b2blayout .b2bCartItem .b2bCartQty {
	padding-top: 32px;
}

body.b2blayout .b2bCartItem .b2bCartTitle {
	display: block;
	font-family: 'Open Sans Condensed', sans-serif;
	font-weight: 700;
	font-size: 18px;
	text-transform: uppercase;
	color: #3c3c3b;
}

body.b2blayout .b2bCartItem .b2bCartVe {
	display: block;
	font-weight: 300;
	font-size: 16px;
}

body.b2blayout .b2bCartItem .b2bCartNr {
	display: block;
	margin-top: 8px;
	font-weight: 300;
	font-size: 14px;
	color: #575756;
}

body.b2blayout #page .b2bCartItem .b2bCartQty input {
	width: 100%;
	height: 33px;
	padding: 5px 10px;
	font-weight: 600;
	font-size: 16px;
	text-align: left;
}

body.b2blayout .b2bCartTrash a {
	display: block;
	height: 100%;
	min-height: 60px;
	background: url("https://www.pco-group.com/skin/frontend/pco/responsive/images/svg/trash-gray.svg") no-repeat center center transparent;
}

body.b2blayout .b2bCartTrash a:hover {
	background: url("https://www.pco-group.com/skin/frontend/pco/responsive/images/svg/trash-white.svg") no-repeat center center #9d9d9c;
	text-decoration: none;
}

body.b2blayout .b2bCartRefresh {
	padding: 5px 0;
}

body.b2blayout .b2bCartTotals {
	max-width: 420px;
	margin: 25px 0 0 auto;
	font-size: 15px;
}

body.b2blayout .b2bCartTotalsLine {
	display: flex;
	justify-content: space-between;
	gap: 20px;
	padding: 6px 0;
}

body.b2blayout .b2bCartTotalsStrong {
	font-weight: 600;
	border-top: 1px solid #dadada;
}

body.b2blayout .b2bCartTotalsGrand {
	font-size: 17px;
	border-top: 2px solid #3c3c3b;
}

body.b2blayout .b2bCartActions {
	padding: 20px 0 40px;
	text-align: right;
}

body.b2blayout .b2bCartLeer {
	display: inline-block;
	margin: 20px 0 50px;
	padding: 10px;
	border: 1px solid #3c3c3b;
	font-weight: 600;
}

/* Mittlere Breite: feste Spalten schmaler, damit der Artikelname Platz hat */
@media (max-width: 1199px) {
	body.b2blayout .b2bCartRow > div { padding: 12px 8px; }
	body.b2blayout .b2bCartImage { flex-basis: 90px; }
	body.b2blayout .b2bCartPrice { flex-basis: 95px; }
	body.b2blayout .b2bCartQty   { flex-basis: 75px; }
	body.b2blayout .b2bCartSum   { flex-basis: 100px; }
	body.b2blayout .b2bCartTrash { flex-basis: 45px; }
	body.b2blayout .b2bCartHeader > div { font-size: 14px; }
}

@media (max-width: 767px) {
	body.b2blayout .b2bCartHeader {
		display: none;
	}

	body.b2blayout .b2bCartItem {
		flex-wrap: wrap;
	}

	body.b2blayout .b2bCartItem > div {
		border-right: 0 none;
	}

	body.b2blayout .b2bCartItem .b2bCartImage { flex: 0 0 90px; }
	body.b2blayout .b2bCartItem .b2bCartName  { flex: 1 1 calc(100% - 90px); }

	body.b2blayout .b2bCartItem .b2bCartPrice,
	body.b2blayout .b2bCartItem .b2bCartQty,
	body.b2blayout .b2bCartItem .b2bCartSum {
		flex: 1 1 0;
		min-width: 0;
		padding-top: 8px;
		text-align: left;
		border-top: 1px solid #ededed;
	}

	body.b2blayout .b2bCartItem .b2bCartPrice:before,
	body.b2blayout .b2bCartItem .b2bCartSum:before {
		content: attr(data-label);
		display: block;
		font-weight: 300;
		font-size: 12px;
	}

	body.b2blayout .b2bCartItem .b2bCartTrash {
		flex: 0 0 50px;
		border-top: 1px solid #ededed;
	}
}

/* ---------- AGB (Text aus dem B2B-Shop, views/agbs_inhalt.php) ---------- */
.b2bAgb {
	font-size: 15px;
	line-height: 160%;
	color: #3c3c3b;
}

.b2bAgb p {
	margin: 0 0 10px;
}

/* Nummerierung 1. / 1.1 wie im B2B-Shop, nur innerhalb der AGB */
.b2bAgb .agb-content ol {
	counter-reset: item;
	margin: 0;
	padding: 0;
}

.b2bAgb .parent-list-agb > li {
	display: block;
	margin: 0 0 12px;
	counter-increment: item;
}

.b2bAgb .parent-list-agb > li::before {
	content: counters(item, ".") " ";
	font-weight: bold;
}

.b2bAgb .parent-list-agb ol {
	counter-reset: subitem;
}

.b2bAgb .parent-list-agb ol > li {
	display: block;
	margin-left: 50px;
	counter-increment: subitem;
}

.b2bAgb .parent-list-agb ol > li::before {
	content: counters(item, ".") "." counters(subitem, ".") " ";
	font-weight: bold;
	margin-left: -25px;
}

/* Kleiner AGB-Kasten (iframe) im Bestellablauf */
body.b2bAgbInline {
	margin: 0;
	padding: 10px 12px;
	background: #ffffff;
	font-family: 'Open Sans', Arial, sans-serif;
}

body.b2bAgbInline .b2bAgb {
	font-size: 13px;
	line-height: 150%;
}

body.b2bAgbInline .b2bAgb h1 {
	margin: 0 0 8px;
	font-size: 15px;
}

body.b2bAgbInline .b2bAgb .parent-list-agb ol > li {
	margin-left: 30px;
}

/* ---------- Meldungen als Toast oben rechts wie im B2B-Shop (Bootstrap-Toast nachgebaut) ---------- */
.b2bToastContainer {
	position: fixed;
	top: 48px;
	right: 0;
	z-index: 10000;
	padding: 16px;
	max-width: 100%;
	box-sizing: border-box;
	pointer-events: none;
}

.b2bToast {
	width: 350px;
	max-width: 100%;
	box-sizing: border-box;
	margin-top: 50px;
	border-radius: 6px;
	box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .15);
	font-family: 'Open Sans', sans-serif;
	font-size: 15.6px;
	color: #212529;
	cursor: pointer;
	pointer-events: auto;
	opacity: 0;
	transition: opacity 150ms linear;
}

.b2bToast + .b2bToast {
	margin-top: 12px;
}

.b2bToast.b2bToastShow {
	opacity: 1;
}

.b2bToast .b2bToastBody {
	padding: 12px;
	word-wrap: break-word;
}

.b2bToast-success {
	background-color: rgba(203, 255, 213, 0.85);
	border: 2px solid rgb(3, 51, 12);
}

.b2bToast-error {
	background-color: rgba(255, 203, 203, 0.85);
	border: 2px solid rgb(84, 5, 5);
}

.b2bToast-info {
	background-color: rgba(239, 242, 255, 0.85);
	border: 2px solid rgb(10, 19, 114);
}

/* Alte Meldungsbox wird nicht mehr benutzt */
#msgfadebox {
	display: none !important;
}