@charset "UTF-8";

:root {
    --nav-bg: #000000;
    --nav-color: #ffffff;
}

*,
::after,
::before {
    box-sizing: border-box;
}

body {
    padding-top: 70px;
    padding-bottom: 20px;
    scroll-padding-top: 70px;

    /* align-items: center;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center; */
    /* flex-wrap: wrap;*/
    /* position: relative; */

    /* font-family: 'Raleway', sans-serif; */
}

/*:::::::::::::::::::::::::::::::::::::::::: login ::::::::::::::::::::::::::::::::::::::::::*/
.login-background {
    background-image: url("/media/stage-logistics-and-transport-industry_960x432.jpg");
    background-size: cover;
}

/*:::::::::::::::::::::::::::::::::::::::::: images ::::::::::::::::::::::::::::::::::::::::::*/
.container-width {
    width: 100%;
    height: auto;
}

.container-width-50 {
    width: 50%;
    height: auto;
}

.image-container-height {
    height: 100%;
    width: auto;
}

.fa-solid {
    cursor: pointer;
}

/*:::::::::::::::::::::::::::::::::::::::::: elements ::::::::::::::::::::::::::::::::::::::::::*/
a {
    text-decoration: none !important;
    color: inherit !important;
}

input,
select,
textarea {
    /* background-color: transparent !important; */
    border: none !important;
    border-bottom: 2px #000000 solid !important;
    border-radius: 0px !important;
}

.inspection-text {
    border: maroon 2px solid !important;
    border-radius: 10px !important;
}

input:disabled,
select:disabled,
textarea:disabled {
    border-color: grey !important;
    color: grey;
}

/* input:invalid, select:invalid, textarea:invalid {
    border-color: red !important;
} */

input[type=radio],
input[type=checkbox] {
    border: 2px #000000 solid !important;
    /* background-color: inherit !important; */
    border-radius: 0px !important;
}

.button-selection {
    font-weight: bold !important;
    border-radius: 50em;
}

.xmark {
    color: red;
}

.xmark:hover {
    color: #ffffff;
    background-color: red;
    cursor: pointer;
}

.check {
    color: green;
}

.check:hover {
    color: #ffffff;
    background-color: green;
    cursor: pointer;
}

.hover-pointer:hover {
    cursor: pointer !important;
}

.inspection-contents {
    border-radius: 10px;
    padding: 5px;
}

.inspection-contents:hover {
    cursor: pointer;
    background-color: rgba(0, 0, 139, 0.3);
}

/*:::::::::::::::::::::::::::::::::::::::::: tables ::::::::::::::::::::::::::::::::::::::::::*/
table {
    font-family: inherit;
}

table.sub-totals>tbody>tr>td {
    text-align: right;
    padding: 5px 10px;
}

.document-view>tbody>tr:hover {
    background-color: lightgrey;
}

table.edit>tbody>tr>td {
    vertical-align: middle;
}

.overflow-50 {
    overflow-y: auto;
    max-height: 50vh;
}

.overflow {
    overflow-y: auto;
    max-height: 100%;
}

table>thead {
    background-color: #ffffff;
    font-weight: bold;
}

.sticky-menu thead {
    position: sticky !important;
    top: 0px;
}

.nowrap {
    white-space: nowrap;
}

tr.invalid {
    background-color: lightgrey;
}

td.center {
    align-items: center;
    text-align: center;
}

td.right {
    align-items: end;
    text-align: end;
}

td.nowrap {
    white-space: nowrap;
}

tr.clickable:hover {
    cursor: pointer;
    background-color: rgba(137, 207, 240, 0.3);
}

/*:::::::::::::::::::::::::::::::::::::::::: theme ::::::::::::::::::::::::::::::::::::::::::*/
.btn.yes.wanted,
.btn.no.not-wanted {
    border-color: green !important;
}

i {
    color: #000000;
}

i:hover {
    color: rgba(137, 207, 240, 1);
}

.theme-bg-light {
    background-color: lightgray;
}

.theme-bg {
    background-color: rgba(255, 255, 255, 0.6);
}

.bg-white {
    background-color: #ffffff;
}

/* ::placeholder {
    color: inherit !important;
} */

.view-document {
    background-color: rgba(137, 207, 240, 1);
    padding: 5px 10px;
    border-radius: 5px;
    color: #000000;
    text-decoration: none;
}

.view-document:hover {
    background-color: rgba(0, 0, 139, 1);
    color: #ffffff;
}

::-webkit-file-upload-button {
    background: #ffffff !important;
    color: #000000 !important;
}

.toast {
    background-color: #000000;
    color: #ffffff;
}

.button-black {
    border-radius: 5px !important;
    padding: 15px 25px !important;
    background-color: #000000;
    border: 1px #000000 solid;
    color: #ffffff !important;
    text-decoration: none;
}

.button-black:hover {
    background-color: #ffffff;
    color: #000000 !important;
    border-color: inherit;
}

.button-small-black {
    border-radius: 5px !important;
    padding: 5px 10px !important;
    background-color: #000000;
    border: 1px #000000 solid;
    color: #ffffff !important;
    text-decoration: none;
}

.button-small-black:hover {
    background-color: #ffffff;
    color: #000000 !important;
    border-color: inherit;
}

.button-grey {
    border-radius: 5px !important;
    padding: 5px 10px !important;
    text-decoration: none !important;
    margin: 5px 5px !important;
    background-color: grey;
    border: 1px grey solid;
    color: #ffffff !important;
}

.button-grey:hover {
    background-color: #ffffff;
    color: #000000 !important;
    border-color: inherit;
}

.button-small-white {
    border-radius: 5px !important;
    padding: 5px 10px !important;
    color: #000000 !important;
    text-decoration: none !important;
    margin: 5px 5px !important;
    border: #ffffff 1px solid;
    background-color: #ffffff !important;
}

.button-small-white:hover {
    color: #ffffff !important;
    background-color: #000000 !important;
    border-color: inherit;
}

a.button-black,
a.button-small-black {
    display: inline-block;
}

.document-item {
    /* border: grey 1px solid; */
    background-color: lightgrey;
}

/*:::::::::::::::::::::::::::::::::::::::::: menu ::::::::::::::::::::::::::::::::::::::::::*/
nav {
    background-color: #000000;
}

.nav-item {
    border-bottom: 2px solid transparent !important;
}

.nav-item:hover {
    border-bottom: 2px solid #ffffff !important;
}

.dropdown-menu {
    background-color: #000000 !important;
    color: #ffffff !important;
    box-shadow: 0 4px 8px 0 rgba(255, 255, 255, 0.5), 0 6px 20px 0 rgba(255, 255, 255, 0.5);
}

a.dropdown-item {
    color: #ffffff !important;
}

a.dropdown-item:hover {
    color: #000000 !important;
}

/* md */
@media (min-width:768px) {}

/* lg */
@media (min-width:992px) {}

/* xl */
@media (min-width:1200px) {}

/*:::::::::::::::::::::: scroll ::::::::::::::::::::::*/
.overflow-x {
    overflow-x: auto;
}

::-webkit-scrollbar {
    width: 12px;
    height: 12px;
}

::-webkit-scrollbar-track {
    background: inherit;
    border-radius: 10px;
}

::-webkit-scrollbar-thumb {
    background: #000000;
}

::-webkit-scrollbar-thumb:hover {
    background: #999;
}

::-webkit-scrollbar-corner {
    background-color: transparent;
}