@import 'component-styles/vaadin-button.css';
@import 'component-styles/vaadin-checkbox.css';
@import 'component-styles/vaadin-confirm-dialog.css';
@import 'component-styles/vaadin-details.css';
@import 'component-styles/vaadin-form-item.css';
@import 'component-styles/vaadin-grid.css';
@import 'component-styles/vaadin-integer-field.css';
@import 'component-styles/vaadin-notification-card.css';
@import 'component-styles/vaadin-radio-button.css';
@import 'component-styles/vaadin-tab.css';
@import 'component-styles/vaadin-text-area.css';
@import 'component-styles/vaadin-text-field.css';
@import 'component-styles/vaadin-upload.css';
@import 'fonts/stylesheet.css';
@import 'views/allgemein.css';
@import 'views/anlage3oder4.css';
@import 'views/anmeldung.css';
@import 'views/barrierefreiheit.css';
@import 'views/branche.css';
@import 'views/erklaerfilme.css';
@import 'views/feedback.css';
@import 'views/fehler.css';
@import 'views/fortbildung.css';
@import 'views/fusszeile.css';
@import 'views/hilfe.css';
@import 'views/infocheck.css';
@import 'views/kontakt.css';
@import 'views/kopfzeile.css';
@import 'views/leichtesprache.css';
@import 'views/login.css';
@import 'views/lotse.css';
@import 'views/meinkpzportal.css';
@import 'views/modulwahl.css';
@import 'views/neuzugriff.css';
@import 'views/selbstlernen.css';
@import 'views/sitemap.css';
@import 'views/start.css';
@import 'views/stufenmodell.css';
@import 'views/teilnahme.css';
@import 'views/uebersicht.css';
@import 'views/urkunde.css';
@import 'views/zertifikat.css';
html, :host {
	--lumo-font-family: 'Source Sans 3';
	font-size: 14px;
	--lumo-font-size-xl: 16.5px; 
	--lumo-primary-color-50pct: rgb(0,73,148);
    --lumo-primary-text-color: rgb(10,110,240);
    --lumo-error-text-color: rgb(180,15,20);
    --lumo-contrast-90pct: rgb(0,0,0);
    --vbg_blau: rgb(0,73,148);
    --vbg_blau_10: rgba(0,73,148,0.1);
    --vbg_blau_hell: rgb(204,233,247);
    --vbg_cyan: rgb(0,149,219);
    --vbg_gelb: rgb(255,204,0);
    --vbg_grau: rgb(85,85,85);
    --vbg_gruen: rgb(81,174,49);
    --vbg_gruen_hell: rgb(175,202,6);
    --vbg_orange: rgb(243,146,0);
    --vbg_rot: rgb(212,15,20);
    --vbg_text: rgb(0,0,0);
    --vbg_tuerkis: rgb(0,140,142);
    --vbg_violett: rgb(184,13,120); 
    --vbg_checkbox_disabled: rgba(51,51,51,0.8);
    --vbg_checkbox_disabled_haken: rgb(51,51,51);
    --vbg_checkbox_bg: rgb(245,245,245);
    --vbg_checkbox_text: rgb(0,0,0);
    --vbg_weiss: rgb(255,255,255);
    --vbg_gruen_aktuelles_titel: rgb(176,201,8);
    --vbg_gruen_aktuelles_background: rgb(223,235,157);
    --vbg_blau_stufe1_titel: rgb(0,149,219);
	--vbg_blau_stufe1_background: rgb(205,234,247);
	--vbg_gruen_stufe2_titel: rgb(176,201,8);
	--vbg_gruen_stufe2_background: rgb(223,235,157);
	--vbg_orange_stufe3_titel: rgb(240,144,0);
	--vbg_orange_stufe3_background: rgb(250,211,152);
    

    /* --- Groesse Inhaltsbereich ----*/
    --vbg_content_min_width: 680px;
    --vbg_content_max_width: 1000px;
    --vbg_content_min_height: 700px;
    
    /* --- Groesse Kopfzeile ----*/
    --vbg_kopfzeile_height: 40px;
    --vbg_kopfzeile_min_width: 680px;
    --vbg_kopfzeile_max_width: 1000px;
    
    /* --- Groesse Fusszeile ----*/
    --vbg_fusszeile_min_width: 680px;
    --vbg_fusszeile_max_width: 1000px;
}

vaadin-combo-box::part(input-field), vaadin-select::part(input-field)
	, vaadin-text-field::part(input-field), vaadin-password-field::part(input-field) {  
	box-shadow: inset 0 0 0 1px rgba(26,43,64,0.714);
    background-color: rgb(255,255,255);
}

vaadin-date-picker::part(input-field) {  
	box-shadow: inset 0 0 0 1px rgba(26,43,64,0.714);
    --vaadin-input-field-background: var(--vbg_weiss);
}

vaadin-text-area::part(input-field) {
	box-shadow: inset 0 0 0 1px rgba(26,43,64,0.714);
    background-color: var(--vbg_weiss);
}

vaadin-date-picker[invalid] {
    background-color: var(--_invalid-background);
}

vaadin-input-container::part(input-field) [disabled] {
	-webkit-text-fill-color: var(--vbg_text);
}

vaadin-confirm-dialog-overlay::part(footer) {
	background-color: rgb(200,200,200);
}

vaadin-button {
	color: var(--vbg_grau);
    font-size: 1.0rem;
    border: 1px solid var(--vbg_grau);
    background: #ECECEC;
}

vaadin-button[focused], vaadin-button[focus-ring], vaadin-button:hover {
	background-color: var(--vbg_blau);
    color: white;
    cursor: pointer;
}

/* eingefügt wegen Umstellung von Vaadin 23 auf 24*/
h1,h2,h3,h4,h5,h6 { margin-top: 1.25em; }
h1 { margin-bottom: 0.75em; }
h2, h3, h4 { margin-bottom: 0.5em; }
h5 { margin-bottom: 0.25em; }

a:focus {
  outline: none;
  text-decoration-line: underline;
}  

a {
    color: rgb(10,110,240);
}

    #ViewKpzImpl {
        overflow-x: auto;
        background: white;
    } 

    #ViewKpzClKpz {
        min-width: var(--vbg_content_min_width);
    }
 
    #ViewKpzVlScrollbereich {
        min-width: var(--vbg_content_min_width);
        width: 100%;    
        padding-left: 10px;
        padding-right: 10px;
    }

    #ViewKpzDivChildWrapper {
        min-width: var(--vbg_content_min_width);
        width: 100%;    
        padding-top: 10px;
        margin-left: auto;
        margin-right: auto;
    }
    
    .ViewKpzVlSeitenIndex {
        padding-top: 150px;
    }

    .ViewKpzLbSeitenIndex {
        font-size: 8pt;
        color: var(--vbg_grau);
    }