/* ==========================================================
   SERVA AIR SYSTEMS AG
   Zentrales Stylesheet
   ========================================================== */


/* ==========================================================
   Farben
   ========================================================== */

:root {

    --serva-black: #000000;

    --serva-header: #e9ecef;

    --serva-background: #fdfdfd;

    --serva-card-shadow:
        0 0.5rem 1rem rgba(
            0,
            0,
            0,
            0.08
        );

}


/* ==========================================================
   Allgemein
   ========================================================== */

body {

    background-color:
        var(
            --serva-background
        );

}


h1,
h2,
h3,
h4,
h5 {

    color:
        #212529;

}


/* ==========================================================
   Navbar
   ========================================================== */

.serva-navbar {

    background-color:
        var(
            --serva-black
        );

}


.serva-navbar .navbar-brand {

    color:
        white;

    font-weight:
        600;

}


.serva-navbar .navbar-brand:hover {

    color:
        white;

}


.serva-navbar .navbar-text {

    color:
        white;

}


/* ==========================================================
   Listen- und Cardheader
   ========================================================== */

.serva-header {

    background-color:
        var(
            --serva-header
        );

    color:
        #212529;

}


.serva-header h1,
.serva-header h2,
.serva-header h3,
.serva-header h4,
.serva-header h5 {

    color:
        #212529;

    margin:
        0;

    font-weight:
        600;

}


.serva-title {

    font-size:
        1.5rem;

    font-weight:
        600;

    color:
        #212529;

    margin:
        0;

}

.serva-list-header {

    display: flex;

    justify-content: space-between;

    align-items: center;

    min-height: 64px;

    padding: 0.75rem 1.25rem;

}


/* ==========================================================
   Login Header
   ========================================================== */

.serva-login-header {

    background-color:
        var(
            --serva-black
        );

    color:
        white;

}


.serva-login-header h1,
.serva-login-header h2,
.serva-login-header h3,
.serva-login-header h4,
.serva-login-header h5 {

    color:
        white;

}


/* ==========================================================
   Login
   ========================================================== */

.serva-login {

    margin-top:
        80px;

}


.serva-login-card {

    border:
        none;

    box-shadow:
        var(
            --serva-card-shadow
        );

}


.serva-login-logo {

    max-height:
        90px;

    margin-bottom:
        15px;

}


/* ==========================================================
   Cards
   ========================================================== */

.card {

    background-color:
        white;

    border:
        none;

    box-shadow:
        var(
            --serva-card-shadow
        );

}


.card-header {

    border-bottom:
        1px solid #dee2e6;

}


/* ==========================================================
   Standard Header Layout
   ========================================================== */

.serva-list-header {

    display:
        flex;

    justify-content:
        space-between;

    align-items:
        center;

}


/* ==========================================================
   Formulare
   ========================================================== */

.form-control {

    border-radius:
        0.5rem;

}


.form-control:focus {

    border-color:
        #86b7fe;

    box-shadow:
        0 0 0 0.25rem
        rgba(
            13,
            110,
            253,
            0.15
        );

}


/* ==========================================================
   Neu Buttons
   ========================================================== */

.serva-btn-new {

    min-width:
        140px;

}


/* ==========================================================
   Tabellen
   ========================================================== */

.table {

    margin-bottom:
        0;

}


.table thead th {

    font-weight:
        600;

    border-top:
        none;

}


/* ==========================================================
   Badges
   ========================================================== */

.badge {

    font-size:
        0.85rem;

}


/* ==========================================================
   Responsive
   ========================================================== */

@media (
    max-width: 768px
) {

    .serva-login {

        margin-top:
            30px;

    }

}