/* *************************************************************
	ui-grid-softde.css
	
	klee: sc ergänzende Styles für die Solr-Suche 	
	klee: 16.06.2016 
************************************************************* */

/* klee: Grid fuer Suchergebnislisting */
/* klee: @deprecated uiGridStyle -- nur altes Shop-System -- jetzt uiGridStyleResponsive */


.uiGridStyle {
	border: 1px solid rgb(212, 212, 212);
	width: 875px; /* 24,6 cm: 3,56px pro mm*/
	height: 700px;
	line-height: 12px;
	font-size: 11px;
}

/*  WH: 18.03.2019 - Suchseite responsive: Ausblenden von Tabellenspalten */
.uiGridStyleResponsive {
	border: 1px solid rgb(212, 212, 212);
	width: 100%; /* 24,6 cm: 3,56px pro mm*/
	
	/* Höhe des Grids */
	/* Veraenderung der height zieht Veraenderung der Konstante HB_MAX_VISIBLE_ROWS_SUCHE nach sich */
	/* WH+klee: 23.04.2018 -- ui-grid Bugbeseitigung chrome: Höhe (siehe Konstante HB_UI_GRID_HEIGHT) */
	/* Bei Änderungen: unbedingt auch in den Styles/properties den Wert verändern und vice versa */
	/* 7 Artikel: height: 700px; */
	/* 6 Artikel: height: 592px; */
	height: 700px;
	
	margin-top: 2px;
	
	/* klee: 25.03.2020 - vtmp: Korrekturen neues Layout: Grid überarbeitet */
	line-height: 12px;
	font-size: 11px;
}

/* WH: 06.05.2020 - Neue Bestellvorlagen: Anzahl Artikel im Grid abhaengig von Shopsite
deswegen wird ID des Grids programmatisch gesetzt im sucheHbCtr*/

#uiGridSucheId.uiGridStyleResponsive {
	height: 700px;
}
#uiGridVorlageId.uiGridStyleResponsive {
	height: 600px;
}

/* 	
	Wird normalerweise in den gridOption headerRowHeight gesetzt.
	Das funktioniert aber nicht bzw. wird normalerweise automatisch aus der grid-height berechnet
	Wird deshalb hier explizit gesetzt.
*/
.ui-grid-header {
	/* mit 40 werden zzgl. MwSt (Euro) 3 Zeilen */
	/*height: 32px;*/
	/*WH: 24.07.2017 - erhoeht auf 40px weil sonst Header-Zeile von der ersten Contentzeile
	 teilweise verdeckt wird*/
	height: 40px;
}

/* klee: 24.02.2021 - für Auftragsübersicht */
#gridAuftragsinfoHb .ui-grid-header {
	height: 20px;
	background-color: #f5f5f5
}

/* klee: 24.02.2021 - für Tracking-Pakete */
#auftragsInfoPaketTrackDiv .ui-grid-header {
	height: 20px;
	background-color: #f5f5f5
}

/* WH: 06.06.2024 - Retoure/Reklamation ueber Auftragsverwaltung : Layout*/
#reklamationHbForm .ui-grid-header {
	height: 22px;
	background-color: #f5f5f5
}

/*WH: Grid fuer Meine Daten - Retoure-Reklamation*/
#reklamationHbForm .gridRetRechnungen {
	width: 100%;
	height: 150px;
}

/*WH: Grid fuer Meine Daten - Retoure-Reklamation*/
#reklamationHbForm .gridRetArtikel {
	width: 100%;
	height: 150px;
}

/*
http://stackoverflow.com/questions/28730621/column-header-wrapping-when-using-angular-ui-grid
Sorgt für Zweilenumbrüche in Spaltenüberschrift, falls diese mehr Platz als die Spalten-Breite
benötigen
*/
.ui-grid-header-cell .ui-grid-cell-contents {
	height: auto !important;
	white-space: normal;
	-ms-text-overflow: clip;
	-o-text-overflow: clip;
	text-overflow: clip;
	overflow: visible;
}

/*
 Grid-Row-Überschriften: Kopf-Farbe/Style des grids
*/
.ui-grid-top-panel {
	background: #F5F5F5;
	color: #00389A;
	font-size: 11px;
	font-family: Arial, Helvetica, sans-serif;
}

/*
 alternierende Zeilenfarbe des Grids
*/
.ui-grid-row:nth-child(even) .ui-grid-cell {
	background-color: #E6E6E6;
}

.ui-grid-row:nth-child(odd) .ui-grid-cell {
	background-color: #FFFFFF;
}

/*
Bei Mouse over: 
.ui-grid-row:nth-child(even):hover .ui-grid-cell{background:#F5F5F5}
.ui-grid-row:nth-child(odd):hover .ui-grid-cell{background:#F5F5F5}
*/

/* der Doppelpfeil von Font Awesome
wird nur sichtbar wenn innnerhalb eines Elements die von der Klasse sortable umgeben ist 
wird durch enableSorting : true in der Grid-Definition gesetzt
*/
.sortable .ui-grid-icon-blank:before {
	font-family: FontAwesome;
	width: 1em;
	content: '\f0dc';
	visibility: visible;	
	margin-left: -3px;
}

/*
Farbe für Sorting Arrow setzen/Überschreiben
*/
.ui-grid-icon-up-dir:before {
	content: '\25b2';
	color: #FF0000;	
	margin-left: -3px;
}

.ui-grid-icon-down-dir:before {
	content: '\25bc';
	color: #FF0000;	
	margin-left: -3px;
}

/*
font-size: 0 !important; -- Deaktiviert die Spaltenzeile, nach der sortiert wird
Hinweis: die 1 nach den Pfeilen, scheint mir für ein Multi-Column-Sorting wichtig zu sein:
1: Hauptspalte in der sortiert wird
2: Nebenspalte ...

Multi-Column-Sort erhält man mit Shift+Header-Click
*/
/*.ui-grid-sort-priority-number {
	font-size: 0 !important;
}*/

/*
Bei Mouse over: 
.ui-grid-row:nth-child(even):hover .ui-grid-cell{background:#F5F5F5}
.ui-grid-row:nth-child(odd):hover .ui-grid-cell{background:#F5F5F5}
*/

/*
Farbe für Sorting Arrow setzen/Überschreiben
*/
.ui-grid-icon-down-dir:before {
	/*content: '\25bc';*/
	
}

.ui-grid-icon-up-dir:before {
	content: '\25b2';
}

div.hbuiTxtDiv {
	color: black;
	font-size: 11px;
	font-family: Arial, Helvetica, sans-serif;
	padding-left: 10px;
	padding-right: 5px;
	padding-top: 5px;
}

/*  */
.hbuiTxtGrundpreis {
	/*background-color: yellow;*/
	color: black;
	font-size: 11px;
	font-family: Arial, Helvetica, sans-serif;
	padding-left: 10px;
	padding-right: 2px;
}

.hbuiTxtLiefer {
	/*background-color: yellow;*/
	color: #212121;
	font-family: inherit;
	font-weight: bolder;
	padding-left: 10px;
	padding-right: 5px;
	padding-top: 0px;
}
span.hbuiTxt {
	/* background-color: yellow; */
	color: black;
	font-size: 11px;
	font-family: Arial, Helvetica, sans-serif;
	padding-left: 10px;
	padding-right: 5px;
	padding-top: 2px;
}

/* 
u.a. Mengeneingabe-Feld im Grid: input[type='text'] { font-size: 24px; }
*/
input.hbuiTxt {
	color: black;
	font-size: 11px;
	font-family: Arial, Helvetica, sans-serif;
}

@media screen and (min-width: 770px) {
	.hbuiTxtGrundpreis {
		font-size: 11px !important;
	}
	.hbuiTxtLiefer {
		font-size: 11px;
	}
	.hbuiSearchDetailTextLink {
		color: black;
		cursor: hand;
		cursor: pointer !important;
		font-size: 11px !important;
		font-family: Arial, Helvetica, sans-serif;
		padding-left: 5px;
		padding-right: 5px;
		/* WH: 28.02.19 - Style-Erweiterungen: font-weight: normal gesetzt*/
		font-weight: normal;
	}
}

@media screen and (max-width: 770px) {
	.hbuiTxtGrundpreis {
		font-size: 10px !important;
	}
	.hbuiTxtLiefer {
		font-size: 10px;
	}
	.hbuiSearchDetailTextLink {
		color: black;
		cursor: hand;
		cursor: pointer !important;
		font-size: 10px !important;
		font-family: Arial, Helvetica, sans-serif;
		padding-left: 10px;
		padding-right: 5px;
		/* WH: 28.02.19 - Style-Erweiterungen: font-weight: normal gesetzt*/
		font-weight: normal;
	}

	/**WH TEST*/
	.hbuiSearchDetailTextLink>b {
		font-size: 10px !important;
	}
}

.hbuiSearchDetailTextLink:hover {
	color: #00AEEF;
}

/* klee: 20.04.2020 - Anpassung css Suche für soft-carrier */
.hbuiSearchDetailHeaderLink {
	color: #007fbc;
	cursor: hand;
	cursor: pointer !important;
	font-weight: bold;
	font-family: inherit;
	padding-left: 5px;
	padding-right: 5px;
	margin: 0px;
}

/* WH: 17.03.2022 - Abverkaufsartikel: Bug fix Layout */
/*Div mit Bestellnr float:left, damit div mit Text fuer Abverkaufsartikel rechtsbuendig erscheint */
.hbuiSearchMitAbverkauf {
	float: left;
}

/*  WH: 15.06.2020 - Anpassung css Suche-Listing für sShop 
die Breite muss gesetzt werden, weil sonst das Icon und der Text zu weit nach rechts rutscht
und nicht mehr sichtbar ist*/
.hbuiSearchConfigWidth {
	/*nur fuer sShop relevant*/
}

/* klee: 21.04.2020 - Anpassung css Suche-Listing für soft-carrier */
.hbuiSearchConfigLink {
	color: #007fbc;
	cursor: hand;
	cursor: pointer !important;
	font-family: inherit;
	padding-left: 0px;
	padding-right: 0px;
	margin: 0px;
}

@media screen and (min-width: 991px) {
	.hbuiTxtGrundpreis {
		font-size: 11px !important;
	}
	.hbuiTxtLiefer {
		font-size: 11px !important;
	}
	span.hbuiTxt {
		font-size: 11px !important;
	}
	input.hbuiTxt {
		font-size: 11px !important;
	}
	div.hbuiTxtDiv {
		font-size: 11px !important;
	}
	.hbuiSearchDetailTextLink {
		font-size: 11px !important;
	}
	.hbuiSearchDetailHeaderLink {
		font-size: 11px !important;
	}
}

/*@media screen and (min-width: 991px) and (max-width: 1199px) {*/
/*@media screen and (min-width: 1100px) and (max-width: 1199px) {
	.hbuiTxtGrundpreis {
		font-size: 10px;
	}
	.hbuiTxtLiefer {
		font-size: 11px !important;
	}
	span.hbuiTxt {
		font-size: 11px !important;
	}
	input.hbuiTxt {
		font-size: 11px !important;
	}
	div.hbuiTxtDiv {
		font-size: 11px !important;
	}
	.hbuiSearchDetailTextLink {
		font-size: 11px !important;
	}
	.hbuiSearchDetailHeaderLink {
		font-size: 11px !important;
	}
}
*/

/*@media screen and (max-width: 990px) {*/
/*@media screen and (max-width: 1099px) {*/
@media screen and (max-width: 990px) {
	.hbuiTxtGrundpreis {
		font-size: 10px !important;
	}
	.hbuiTxtLiefer {
		font-size: 10px !important;
	}
	span.hbuiTxt {
		font-size: 10px !important;
	}
	input.hbuiTxt {
		font-size: 10px !important;
	}
	div.hbuiTxtDiv {
		font-size: 10px !important;
	}
	.hbuiSearchDetailTextLink {
		font-size: 10px !important;
	}
	.hbuiSearchDetailHeaderLink {
		font-size: 10px !important;
	}

}


.hbuiSearchDetailHeaderLink:hover {
	color: #00AEEF;
}

/* Style fuer das Loader-Img, den sich drehenden Kreis*/
.hbuiLoaderImgStyle {
	border: solid 5px;
	/*WH : heigth = 1500px, bei 100% deckt es unten nicht alles zu*/
	height: 1500px;
	/*WH Abstand zu oben nur wenige px, damit die Links im Menue deaktiviert sind*/
	/*top: 5px;*/
	/* klee: 14.04.2021 - showLoaderImg in top=0px + left=0px gesetzt */
	top: 0px;
	left: 0px;
	/*position: absolute;*/
	/* WH: 01.03.2019 - Neues VTMP-Layout: Style Erweiterungen*/
	/* position fixed, damit der ganze Browser-Viewport ueberdeckt wird*/
	position: fixed;
	width: 100%;
	z-index: 999;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
	filter: alpha(opacity = 50);
	opacity: 0.3;
	background-color: grey
}

/* Style (Ergaenzung) fuer die UI-Grid Blaetter-Tasten */
.hbUiGridPager {
	/*height: 18px !important;*/
	/* WH: 03.08.2017 - Style-Aenderungen*/
	height: 15px !important;
	vertical-align: top !important;
	padding-top: 2px !important;
	/* WH: 03.08.2017 - Style-Aenderungen*/
	padding-bottom: 2px !important;
	margin-bottom: 3px !important;
	/*background-color: red !important;*/
}
/* Style (Ergaenzung) fuer die UI-Grid Blaetter-Input-Feld */
.hbUiGridPagerInput {
	height: 10px !important;
}
/* Style (Ergaenzung) fuer die UI-Grid Blaetter-Max-Page-Feld */
.hbUiGridPagerMaxPage {
	height: 10px !important;
	vertical-align: middle !important;
	font-size: 14px !important;
}

/* WH:um Tooltip in Zelle anzuzeigen Zelle mit overflow setzen*/
.hbCellToolTip {
	overflow: visible;
}

/*WH: Style fuer Verfuegbarkeitsauskunft*/
.hbUiVerfuegbar:hover {
	color: #00AEEF;
}

/* WH+klee: 23.04.2018 -- ui-grid Bugbeseitigung chrome: automatisches Scrollen */
.ui-grid-viewport {
	overflow-anchor: none;
}

/**************************************************************
WH: sc ergänzende Styles für die Endkundenrechnungstool
**************************************************************** */
/*Style fuer das Grid mit den Positionen*/
.gridStyleEkrPos {
	border: 1px solid rgb(212, 212, 212);
	width: 1099px;
	height: 300px
}

/*Style fuer das Grid mit den Gesamtkosten*/
.gridStyleEkrGesamt {
	border: 1px solid rgb(212, 212, 212);
	width: 1099px;
	height: 200px
}

/*WH: 03.08.2022 - Neues Layout: Style fuer das Grid mit den Positionen*/
.gridStyleEkrPos2022 {
	border: 1px solid rgb(212, 212, 212);
	width: 99%;
	height: 300px;
	margin-left: 5px;
	margin-right: 5px;
}

/* Zeilenhoehe setzen im Grid*/

#gridEkrPosDiv .ui-grid-row {
	height: 30px !important;
}

#gridEkrPosDiv .ui-grid-row .ui-grid-cell{
	height: 30px !important;
}


/**************************************************************
WH: sc ergänzende Styles für die sccms
**************************************************************** */
/*Style fuer das Grid mit den sccms-Eintraegen*/
.gridStyleScCMS {
	border: 1px solid rgb(212, 212, 212);
	width: 1050px;
	height: 300px
}

/*Style fuer editierbare Zelle: blauer Rahmen + mintgruener Hintergrund*/
.hbCellEditable {
	border-style: solid;
	border-width: 1px;
	border-color: #00AEEF;
	background-color: #eeffee;
}

/*Style um Text in einzelne Zellen links, rechts, oder mittig setzen zu koennen
Bsp: cellClass:'hbCellTextLeft'
*/
.hbCellTextLeft {
	text-align: left;
}

.hbCellTextRight {
	text-align: right;
}

.hbCellTextCenter {
	text-align: center;
}

/* klee: 25.03.2020 - vtmp: Korrekturen neues Layout: Grid überarbeitet */
.hbCellProductImg {
	width: 100px;
	max-width: 100%;
	height: 60px;
	margin-left: 0px;
	/* margin-top: 7px; */
	/* WH: 03.05.2023 - Suchergebnislisting Bilder vergroessern bei Mouseover */
	/* margin-top verringern, damit senkrechte Bilder ganz reinpassen*/
	margin-top: 6px; 
	padding-bottom: 3px;
}

.hbCellNoProductImg {
	width: auto !important;
	height: 60px;
	margin-left: 0px;
	/* margin-top: 7px; */
	/* WH: 03.05.2023 - Suchergebnislisting Bilder vergroessern bei Mouseover */
	/* margin-top verringern, damit senkrechte Bilder ganz reinpassen*/
	margin-top: 6px; 
	padding-bottom: 3px;
}

/* WH: 03.05.2023 - Suchergebnislisting Bilder vergroessern bei Mouseover */
/* Class fuer Cell mit Bild: gleichzeitig text-center und overflow:visible */
.hbCellClassBildPopover {
	text-align: center;
	overflow: visible;
}

/* WH: eigene Background-Color fuer selected Row im Grid, fuer bessere Lesbarkeit der orangefarbigen Schrift */
/* klee: 28.04.2020 - Suchlisting: Farbliche Markierung der border eines selektierten Artikels */
.ui-grid-row.ui-grid-row-selected>[ui-grid-row]>.ui-grid-cell {
	/* sshop dunkles grau: background-color: #788487;*/
	
	border-top: thin;
	border-top-color: #00389A;
	border-top-style: solid;
	
	border-bottom: thin;
	border-bottom-color: #00389A;
	border-bottom-style: solid;
}


/* WH: Notiz im Suchlisting einruecken wie die Texte*/
.ui-grid-cell .hbListtextNotiz {
	padding-left: 5px;
}