@font-face {
    font-family: "Bosch Sans Medium";
    src: url('../../assets/fonts/BoschSans-Medium.ttf') format("truetype");
}
@font-face {
    font-family: "Bosch Sans Bold";
    src: url('../../assets/fonts/BoschSans-Bold.ttf') format("truetype");
}

:root {
    --section-horizontal-padding: 2em;
    --section-vertical-padding: 1.5em;
    --section-background-color: #ffffff;

    --shadowed-box-background-color: #ffffff;
    --shadowed-box-shadow: rgba(17, 17, 26, 0.1) 0px 0px 16px;

    --page-title-bottom-margin: .5em;

    --table-action-btn-size: 35px;
    --table-action-btn-sm-size: 25px;
}

body {
    height: 100%;
}

/* Fonts */
* {
    font-family: 'Bosch Sans Medium', sans-serif;
}

.bosch-bold {
    font-family: 'Bosch Sans Bold', sans-serif;
}

/* Admin main section */
#main {
    padding: var(--section-vertical-padding) var(--section-horizontal-padding);
    background-color: var(--section-background-color);
}

/* User main section */
#main-section {
    display: flex;
    flex-direction: column;
    align-items: center;

    padding: var(--section-vertical-padding) var(--section-horizontal-padding);
    background-color: var(--section-background-color);
}

/* Shadowed Box */
.shadowed-box {
    background-color: var(--shadowed-box-background-color);
    box-shadow: var(--shadowed-box-shadow);

    padding: var(--section-vertical-padding) var(--section-horizontal-padding);
}

/* Title */
.page-title {
    margin-bottom: var(--page-title-bottom-margin);
    color: black;
}

/* Buttons */
.table-action-btn {
    display: flex;
    justify-content: center;
    align-items: center;

    width: var(--table-action-btn-size) !important;
    height: var(--table-action-btn-size) !important;
}

.table-action-btn-sm {
    display: flex;
    justify-content: center;
    align-items: center;

    width: var(--table-action-btn-sm-size) !important;
    height: var(--table-action-btn-sm-size) !important;
}

.near-input-btn {
    height: var(--bosch-input-height);
}

.near-input-square-btn {
    height: var(--bosch-input-height) !important;
    width: var(--bosch-input-height) !important;
}

/* Grid System */
.form-col {
    display: flex;
    flex-direction: column;
    justify-content: end;
}

.inline-col {
    display: flex;
    justify-content: start;
    align-content: end;
    gap: 5px;
}

/* Table Cells */
td.truncate {
    max-width: 400px;
    text-wrap: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.table-horizontal {
    --horizontal-table-cell-height: 2em;
}

table.horizontal-table th {
    border: 1px solid #dee2e6;
    border-right: 1px solid black;
    height: var(--horizontal-table-cell-height);
}

table.horizontal-table td {
    border: 1px solid #dee2e6 !important;
    height: var(--horizontal-table-cell-height);
}

/* Sliding background on hover */
a.bg-slider {
    --initial-bg-color: white;
    --end-bg-color: #008ecf;

    --initial-font-color: #008ecf;
    --end-font-color: white;

    color: var(--initial-font-color);
    background-image: linear-gradient(90deg,
        var(--initial-bg-color) 0%,
        var(--initial-bg-color) 50%,
        var(--end-bg-color) 50%,
        var(--end-bg-color) 100%);
    background-size: 200%;

    transition: .3s cubic-bezier(.47, .1, 1, .63), color .2s linear;
    transition-delay: 0.0s, 0.15s;
}

a.bg-slider:hover {
    color: var(--end-font-color) !important;

    cursor: pointer;
    background-position: -100% 100%;
}

a.reset-a {
    text-decoration: none;
    color: black;
}

a.reset-a:hover {
    text-decoration: none;
    color: black;
}

a {
    --anchor-text-color: #007bc0;
    --anchor-hover-text-color: #00629a;

    color: var(--anchor-text-color);
    text-decoration: underline;
}

a:hover {
    color: var(--anchor-hover-text-color);
}

div.fm-req {
    font-weight: bold;
}
div.fm-req label:before {
    content: "* ";
    color: red;
}

div.row{
    margin-bottom: 15px;
}

/* Forms */
.required-label:after {
    content: "*";
}

/* DatTables */
div.dt-container div.dt-length select {
    --datatables-length-select-width: 70px;

    width: var(--datatables-length-select-width) !important;
}