/*****************************************************************************/
/*               NAMENSKONVENTIONEN FÜR NEUE CSS STYLES                      */
/*****************************************************************************/
/*
1. Sprechenden Namen in Englisch vergeben 
2. Namenskombinationen:
	- mit Unterstrich (z.B. "wizard_navi")
*/
/*****************************************************************************/
/*               Auswahlfelder                                        */
/*****************************************************************************/


@media screen and (min-width: 1024px) {
	.genericSearchMask fieldset .dropdownEqualOperator {
		vertical-align: middle;
	}		
}

.genericSearchMask fieldset .dropdownEqualOperator{
	vertical-align: top;
}

select {
	font-family: var(--font) !important;
}

/* Selectonemenu Prime Faces */
 .ui-selectonemenu {
    margin: 2px 0;
    padding-right: 0px;
	position:relative;
	width:60%;
}
.overflowAuto .ui-selectonemenu { 
	position:static;
}

.ui-selectonemenu.dropdown_autoWidth .ui-helper-hidden-select {
	width: auto;
	height:1px;	
	position: static;
	opacity:0;
}
.ui-selectonemenu.dropdown_autoWidth .ui-helper-hidden-select select  {
	padding-right:10px;	
}

.ui-selectonemenu.dropdown_autoWidth {
	max-width:350px;
}
.divHeader .roleSwitcher .ui-selectonemenu.dropdown_autoWidth {
	max-width:none;
}

.ui-inputfield{
	margin:0;
	outline:medium none;
	padding:5px;
	font-weight:normal;
	color: var(--basicFontColor);
}


/* Für Screenreader - Select und Input auf die sichtbare Breite des Auswahlfeldes */
.ui-helper-hidden-accessible {
	width:100%;
	height:100%;
}

.ui-helper-hidden-accessible input,
.ui-helper-hidden-accessible select {
	width: 100%;
    height:100%;
}


/*Fokus Auswahlfeld*/
 .ui-selectonemenu.ui-widget.ui-state-default.ui-state-focus{
    outline: var(--highlightFocusOutline);
	border: var(--highlightBorderForms);
	box-shadow: var(--highlightShadow);
}

/*Auf- und Zuklapp-Element*/
.ui-selectonemenu label.ui-selectonemenu-label:after {
	content: "\e9b4" / "";
    color: var(--accentFontColor);
    font-size: var(--fontSize2);
    font-family: "HISinOneIcons" !important;
    line-height: 1.7em;
	position: absolute;
    right: 0;/*Chrome*/
    bottom:1px;/*Chrome*/
    top: 1px;
    background-color:var(--contrastFontColor);
    padding-left:3px;
    width:24px;
   /*  box-shadow: 3px 3px 8px 8px #fff; */
}

/*Fokus und Hover des Auf- und Zuklappen-Buttons= identisch mit dem Rest des Auswahlelements*/
.ui-selectonemenu.ui-widget.ui-state-default.ui-state-focus label.ui-selectonemenu-label:after{
	 background-color:var(--highlightBackgroundColor);
}

.ui-selectonemenu label.ui-selectonemenu-label:hover:after {
	background-color:var(--highlightBackgroundColor);
}

.ui-selectonemenu label.ui-selectonemenu-label {
	position: relative;
	display: block;
    border: 0;
    white-space: nowrap;
    overflow: hidden;
    font-weight: normal;
    width: 100%;
    text-align: left;
}

.ui-selectonemenu-panel .ui-selectonemenu-filter-container{
	padding:0;
}

.ui-selectonemenu .ui-selectonemenu-trigger {
	width:0px;
	height:0px;
	overflow:hidden;
	background: none;
	border: var(--highlightBorderTransparent);
}

.ui-selectonemenu button.ui-selectonemenu-trigger .ui-state-hover, .ui-selectonemenu button.ui-selectonemenu-trigger .ui-state-focus,
.ui-selectonemenu button.ui-selectonemenu-trigger:hover, .ui-selectonemenu button.ui-selectonemenu-trigger:focus {
	background-color: transparent !important;
	box-shadow: none;
}

.ui-selectonemenu .ui-selectonemenu-trigger.ui-state-focus {
	border: var(--highlightBorderTransparent);
}

/* .ui-selectonemenu .ui-widget .ui-state-hover {
	border-color: transparent !important;
} */

.ui-selectonemenu-trigger span::before {
	content: "\e9b4" / "";
	color: var(--accentFontColor);
	font-size: var(--fontSize2);
	font-family: "HISinOneIcons" !important;
	line-height: 1.9em;
	margin-left: -6px;
}

.ui-selectonemenu.ui-state-default, .ui-selectonemenu.ui.state-hover {
	background: var(--backgroundColor2);
	border: 1px solid var(--backgroundColor49);
	border: 1px solid var(--backgroundColor49);
	border: var(--border3);
}

.ui-selectonemenu .ui-selectonemenu-label {
	margin-top: 0px;
	min-width:auto;
	margin-right:1px;
}

.ui-selectonemenu-panel.ui-shadow {
    box-shadow: 1px 2px 18px var(--highlightShadowColor);
}

/*Fokussierung der Dropdowneinträge*/
.ui-selectonemenu-panel .ui-widget-content .ui-state-highlight {
	border: var(--highlightBorder);
	border-width:2px;
}

@media (forced-colors: active) {
	.ui-selectonemenu-panel .ui-widget-content .ui-state-highlight {
		border-style: dashed;
	}
}

/*Hover der Dropdowneinträge*/
.ui-selectonemenu-panel .ui-widget-content .ui-state-hover,
.ui-selectonemenu-panel .ui-widget-content .ui-state-highlight:hover,
.ui-selectonemenu-panel .ui-widget-content .ui-selectonemenu-list-item:focus{
	font-weight: normal;
	color: var(--basicFontColor);
	border: 1px dotted var(--basicFontColor);
	outline: none;	
}

/*Hover der Dropdowneinträge*/
.ui-selectonemenu-panel .ui-widget-content .ui-state-highlight:hover{
	border-width:2px;
}

.ui-selectonmenu-panel .ui-selectonemenu-list .ui-widget-content {
	padding: 0px;
}

.ui-selectonemenu-panel .ui-selectonemenu-items-wrapper {
	overflow-y: scroll;
}

.ui-selectonemenu .ui-selectonemenu-panel .ui-selectonemenu-list {
	overflow: hidden;
}

.ui-selectonemenu-panel .ui-selectonemenu-list-item {
	border: var(--highlightBorderTransparent);
}

.ui-selectonemenu-filter-container {
	width: 100%;
	}
		
.ui-selectonemenu-filter-container input.ui-selectonemenu-filter {
	width:100%;
	outline: 2px solid var(--backgroundColor7);
	border: 1px solid var(--backgroundColor7);
}

.ui-selectonemenu-panel.ui-widget.ui-widget-content{
	padding-right:0;
	border:var(--border2);
	max-width:600px;
	z-index: 1100 !important;
}

div[id*="Sidebar"].ui-selectonemenu-panel.ui-widget.ui-widget-content {
	z-index: 2000 !important;
}

.ui-selectonemenu .ui-selectonemenu-trigger.ui-state-focus {
	border: var(--highlightBorderTransparent);
}

.ui-selectonemenu-item.ui-selectonemenu-list-item{
	background-image:none;
	float:none;
	overflow:hidden;
}

.originDevice_mobile .ui-selectonemenu .ui-helper-hidden-accessible:not(.ui-helper-hidden-select) {
	display:none;
}

/* Mobile SelectOneMenu*/
.mobileSelectWrap {
	position:relative;
	width:100%;
	display:inline-block;
}
.mobileSelectWrap select {
	width:100%;
	border:none !important;
	padding:4px 2px !important;
	margin:0;
}
.mobileSelectWrap .mobileSelectWrap_arrow {	
    line-height: 1.7em;
	position: absolute;
    right: 0;
    top: 0;
    background-color:var(--contrastFontColor);
    padding-left:3px;
    width:24px;
	height:100%;	
	pointer-events:none;
}
.mobileSelectWrap .mobileSelectWrap_arrow:after {
	content: "\e9b4" / "";
    color: var(--accentFontColor);
    font-size: var(--fontSize2);
    font-family: "HISinOneIcons" !important;
    display: inline-block;
    vertical-align: middle;
}

.items-row {
	display:flex;
}

/* DROPDOWN GROESSEN UND SKALIERUNG*/


/* für inline with previous vorgesehen, todo:in Komponente einbauen an den div-container, der das richselect enthält*/	
.inline{
	margin-bottom:-8px;	
}	

.email-address:before {
   content: "Email address: ";
}

/* DROPDOWN */

.dropdown {
	width: 100%;
} 

.dropdown_standard {
	width: 60%;
}

.dropdown_autoWidth {
	width: auto;
}

.dropdown_96 {
	width: 96%;
}

.dropdown_97 {
	width: 97%;
}

.dropdown_80 {
	width: 80%;
}

.dropdown_58 {
	width: 58%;
}

.dropdown_57 {
	width: 56.5%;
}

.dropdownMD {
	width: 50%;
}

.dropdown_45 {
	width: 45%;
}

.dropdown_33 {
	width: 33%;
}

.dropdown_26 {
	width: 26%;
}

.dropdown_24 {
	width: 24%;
}

.dropdown_17 {
	width: 17%;
}

.dropdown_1_char {
	width: 3.5em;
}

.dropdown_2_char {
	width: 4.5em;
}

.dropdown_3_char {
	width: 5.5em;
}

.dropdown_4_char {
	width: 6.5em;
}

.dropdown_5_char {
	width: 7.5em;
}

.dropdown_11em {
	width: 11em;
}

.dropdown_mw220 {
	max-width:220px;	
}
.dropdown_mw220 .ui-selectonemenu-label {
    height: 29px;
    padding-right: 25px;
    line-height: 1.6em;
	width:218px;
	overflow:hidden;
}

@media screen and (max-width: 768px){
	/*Typeaheadfeld*/
	 .selectItems,  .selectItems .flexFix{
		display:block;
	}
	 .comboBox{
	margin:0;
	}	
	 .selectItemAction, 
	 .selectItemAction:hover, 
	 .selectItemAction:focus {
		background-position: left center;
	}   
	/*PrimeFaces Auswahlfeld*/
	 .ui-selectonemenu label.ui-selectonemenu-label{
		padding:6px;
	}	
	 .ui-selectonemenu label.ui-selectonemenu-label:after{
		line-height:2.0;
	}	
	 .ui-selectonemenu-panel .ui-selectonemenu-list-item{
		padding:10px;
	}
	.ui-selectonemenu {
	width: 90% !important;
	}	
	/*Auskommentiert, alle Auswahlfelder sollen in Mobilgeräten zu 90% werden. Fehler im Studienplaner siehe #298313	
	.ui-selectonemenu.ui-widget.ui-state-default.ui-corner-all.dropdown_45{
	width: 45% !important;
	}*/
	/*Horizontale Scrollbalken, damit Inhalte im Dropdown nicht abgeschnitten werden*/
	.ui-selectonemenu-panel.ui-widget.ui-widget-content{
	width:100% !important;
	}
	.ui-selectonemenu .ui-selectonemenu-panel .ui-selectonemenu-list,
	.ui-selectonemenu-item.ui-selectonemenu-list-item{
	overflow:initial !important;
	}
}