/*
// ----------------------------------------------------------------------------
// Copyright 2016 by nowhow solutions AG.
//
// Das vorliegende Dokument, einschliesslich aller seiner Teile, ist
// urheberrechtlich geschützt. Jede Verwertung ist ohne Zustimmung der
// nowhow solutions AG unzulässig. Dies gilt insbesondere für
// Vervielfältigungen, die Einspeicherung und Verarbeitung in elektronischer
// Form. Wird das Dokument einem Kunden im Rahmen der Projektarbeit zur Ansicht
// übergeben ist jede weitere Verteilung durch den Kunden an Dritte untersagt.
// ----------------------------------------------------------------------------*/

/*SwissStyleguide Adaptionen für die spezifischen Anforderungen von Erst*/

/*-----------------------------------------------------------------------------
* Anpassungen im generellen Layout
-----------------------------------------------------------------------------*/

/* Kein Flicker währen VueJs Initialisierung */
[v-cloak] {
    display: none;
}

/* Anwendungsbereich sehr breit, um den vorhandenen Platz möglichst optimal auszuschöpfen */
@media (min-width: 768px) {
    .container {
        width: 100%;
    }
}
@media (min-width: 992px) {
    .container {
        width: 100%;
    }
}

@media (min-width: 1200px) {
    .container {
        width: 100%;
    }
}

/* Kein Background-Image und Content-Rand, um den Eindruck eine Full-Screen App zu erhalten */
body {
    background: #fff;
}
.container-main {
    -webkit-box-shadow: none;
    box-shadow: none;
}

/* Schmale Tabellen-Spalten-Variante, um ein ähnliches Layouting wie bei den in ERST üblichen Formularen zu erhalten (3/12 im Grid) */
table.table tbody tr td.table-col-slim,
table.table tbody tr th.table-col-slim {
    width: 25%;
}

/* Outstanding info area about the kind test of environment (not used in production). This style has similar coloring as the crisis banner. */
.environmentinfo {
    background-color: #dc0018;
    color: #fff;
    font-size: 2rem;
    padding-left: 6px;
    padding-right: 6px;
}

/* Kein Spacing der Anwendung vom oberen Rand */
.mod.mod-layout {
    padding-top: 0;
}

/*-----------------------------------------------------------------------------
* Anpassungen im Footer
-----------------------------------------------------------------------------*/

/* Buttons im Sticky Footer symmetrisch anordnen (statt von links her aufreihen)*/
.sticky-footer .btn {
    margin-left: 10px;
    margin-right: 10px;
}

/* Items mit Spacing, damit diese optisch voneinander unterscheidbar sind*/

.footer .footer-spaced-item {
    margin-left: 20px;
    margin-right: 20px;
}

/*-----------------------------------------------------------------------------
* Stylings von einzelnen Elementen
-----------------------------------------------------------------------------*/

/* Kein hässliches Outlining bei focus */
.chosen-container-active .chosen-single:focus,
:focus {
    outline: 0 !important;
}
::-moz-focus-inner,
.chosen-container-active .chosen-single:focus {
    border: 0 !important;
}

/* Buttons mit Padding */
.button-group .btn {
    margin-right: 10px;
}

/* Statt outlining einen subtilen Rand verwenden (für Buttons) */
.btn:focus {
    border-color: #66afe9;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(102 175 233 / 60%);
    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(102 175 233 / 60%);
}

/* Links als navigierbar darstellen, wenn möglich */
a:hover {
    /* color: #005580; */
    text-decoration: underline;
}

/* Elemente in unstyled. Listen optisch etwas besser trennen */
.list-unstyled li {
    padding-top: 3px;
    padding-bottom: 3px;
}

/* Prozessnavigation: Variante mit 3 Elementen */
.nav-process.process-items-3 li a {
    width: 32.3%;
}

/* Für p-Leads einen kleineren Abstand zum p-Text. Gleicher Abstand zum vorangehenen Elementen.
 */
p.lead {
    margin-top: 5px;
    margin-bottom: 5px;
    /* Schrift gleich gross forcieren wie für den p */
    font-size: 1.1em;
}

/* Anwendung schmaler darstellen, bündig zum Text des Header-Icon (mit und ohne Left-Menu)*/
@media only screen and (min-width: 768px) {
    .container-fluid {
        padding-left: 53px;
        padding-right: 53px;
    }
}

@media only screen and (min-width: 992px) {
    .container-fluid {
        padding-left: 58px;
        padding-right: 58px;
    }
}

@media only screen and (min-width: 1200px) {
    .container-fluid {
        padding-left: 58px;
        padding-right: 58px;
    }
}

/*-----------------------------------------------------------------------------
* Anpassungen in Formularen
-----------------------------------------------------------------------------*/

/* Paragraphen innerhalb von Forumularen in üblicher Schrift darstellen (Löst Inkonsistenzen bei der Darstellung von HTML-Formatierten Ressourcen in Formularen) */
form.form-horizontal p {
    font-size: inherit;
    line-height: inherit;
}

/* Formularfelder, welche nur eine Textzeile enthalten als einfachen Text (ohne Rahmen und Schatten) darstellen */
.form-control.text-line {
    border: none;
    box-shadow: none;
    /* Padding als Ausgleich für den fehlenden Border */
    padding-top: 7.6px;
    padding-left: 0;
}

/* Checkboxen und Radiobuttons in Formularen sind nicht 100% breit */
input[type='checkbox'].form-control,
input[type='radio'].form-control {
    width: auto;
}

/* Focus-Indicator bei Checkboxen und Radiobuttons in Formularen etwas stärker, um die kleine Grösse auszugleichen
Die Verwendung eines farbigen Borders oder einr Outline mit Radius ist nicht unterstützt. */
input[type='checkbox'].form-control:focus,
input[type='radio'].form-control:focus {
    -webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(102 175 233 / 100%);
    box-shadow: inset 0 1px 1px rgb(0 0 0 / 8%), 0 0 8px rgb(102 175 233 / 100%);
}

/** Spalten für Formularfelder, welche nur eine Textzeile enthalten weniger hoch darstellen (Es ist kein Validator nötig)
@devdoc Diese Rule wird aktuell von unternstehender generellen Rule mit implementiert.
*/
div[class*='col-'].text-line {
    margin-bottom: 0em;
}

/* Spalten in Formularfeldern generell ohne vertikalen Abstand darstellen (Keine vertikale Platzverschwendung. Dies ist insbesondere für Seiten mit vielen Eingabefeldern hilfreich) */
.form-group div[class*='col-'] {
    margin-bottom: 0em;
}

/* Anzeigen/Fehlermeldungen in Formularen ohne vertikalen Abstand darstellen (Keine vertikale Platzverschwendung. Dies ist insbesondere für Seiten mit vielen Eingabefeldern hilfreich) */
.form-group .help-block {
    margin-bottom: 0;
}

/* Auswahl-Listen (Dropdown/select) in Formularen aus optischen Gründen auf ganze Formularbreite ausdehnen, analog der übrigen Eingabe-Elemente */
.form-inline select.form-control,
.has-error select.form-control,
.has-success select.form-control,
select.form-control {
    width: 100%;
}

/* Unselektierbare Bereiche */
.noselect {
    -webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
    user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */
}