/***** root/variable definition *****/

:root {
    --l2-white: #FFFFFF;
    --l2-rare: #989898;
    --l2-medium-rare: #548BA9;
    --l2-medium: #003C5C;
    --l2-medium-well: #01293E;
    --l2-well: #0A1115;
    outline: none;
}

/***** selector overrides *****/

::-moz-selection {
    background: var(--l2-medium);
    color: var(--l2-white);
}

::selection {
    background: var(--l2-medium);
    color: var(--l2-white);
}

/***** basic element overrides *****/

html {
    /*background-color: var(--l2-medium);*/
}

body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background-color: transparent;
}

a {
    color: var(--l2-medium-rare);
    text-decoration: none;
    background-color: transparent;
    -webkit-text-decoration-skip: objects;
}

    a:hover {
        color: var(--l2-medium);
        text-decoration: none;
    }

/***** L2 Specific Styles *****/

.L2LoaderWheel {
    margin: auto;
    display: block;
}

.L2Content {
    background-color: var(--l2-white);
    border-radius: 10px;
}

/* L2 Standard Button */

.L2Btn { 
    color: var(--l2-white);
    background-color: var(--l2-medium);
    border-color: var(--l2-medium-well);
}

    .L2Btn:hover {
        color: var(--l2-white);
        filter: brightness(120%);
    }

/* L2 Full Screen Modal Dialog */

.L2FullScreenModalDialog {
    width: 80vw;
    max-width: 80vw;
    margin: 2.5vh auto;
    height: 95vh;
    max-height: 95vh;
}

.L2FullScreenModalDialog .modal-body {
    max-height: 88vh;
    overflow-y: auto;
    margin-bottom: 1vh;
}

/* L2 Selectable Pod */

.L2SelectablePod {
    color: var(--l2-white);
    background-color: var(--l2-medium-rare);
    border-radius: 10px;
}

.L2SelectablePod:hover {
    color: var(--l2-white);
    filter: brightness(120%);
}

.L2SelectablePod img {
    margin: 10px auto;
    background-color: var(--l2-white);
}

/* L2 Selectable Rows Table - add to <table> to make rows selectable (visually) */

table.L2SelectableRowsTable {
    border-collapse: collapse !important;
}

    table.L2SelectableRowsTable tbody tr:hover td {
        color: var(--l2-medium-rare);
        filter: brightness(100%);
        cursor: pointer;
    }

    table.L2SelectableRowsTable tbody tr td,
    table.L2SelectableRowsTable thead tr td {
        border: none;
    }

/* Loading Wheel style */

.LoaderWheel {
    margin: auto;
    padding: 10vh 10vw;
    display: block;
}

/* faded style for showing selections */

.faded {
    filter: brightness(50%);
    transition: ease-in-out 1s;
}

/***** Bootstrap Customizations *****/
.row {
    margin: 5px 0px;
}

.font-weight-light-bold {
    font-weight: 500 !important;
}

/* Bootstrap form-control Customizations */

.form-control::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: var(--l2-rare);
    opacity: 1; /* Firefox */
}

.form-control:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: var(--l2-rare);
}

.form-control::-ms-input-placeholder { /* Microsoft Edge */
    color: var(--l2-rare);
}

/* Bootstrap NavBar Customizations */

.L2NavBar {
    background-color: var(--l2-well) !important;
}

.L2NavBarButtonGroup {
    margin: 4px;
}

/* Bootstrap Card Customizations */
.card {
    margin-top: 5px;
    margin-bottom: 10px;
}

.card-text {
    padding: 0rem 1.25rem;
    margin-bottom: .25rem;
}

/***** DataTables Customizations *****/

.page-link {
    color: var(--l2-medium);
}
.page-link:hover {
    color: var(--l2-medium-well);
}
.page-item.active .page-link {
    background-color: var(--l2-medium);
    border-color: var(--l2-medium);
    color: var(--l2-white);
}

/**Loader*/
#loading {
    position: fixed;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0.7;
    background-color: #fff;
    z-index: 10000;
}

#loading-image {
    z-index: 100;
}