:root {
    --bs-blue: #09487C !important;
    --bs-link-color: #09487C;
    --bs-link-decoration: underline;
    --bs-link-hover-color: white;
}

a {
    color: #09487C;
    text-decoration: none;
}

.table > :not(caption) > * > * {
    border-bottom-width: 0px;
}
/*.table tr {
    border: 1px solid;
    border-color: #09487C;
    border-radius: 4px;
    margin: 0 0 4px 0;
}*/

input[type="time"] {
    place-content: center;
}

.time-dropdown {
    border: none;
    font-size: larger;
    outline: none;
    padding: 5px;
    width: 100%;
    color: #09487C;
    font-family: 'Roboto';
    background-color: white;
}

.btn:focus, .btn:active, .accordionButton:active, .accordionButton:focus, input:active, input:focus, .form-control:active, .form-control:focus, .form-select:active, .form-select:focus, .password-toggle-btn:focus, .password-toggle-btn:active {
    outline: none !important;
    box-shadow: none !important;
}

.continueButton:focus, .continueButton:active, .addButton:focus, .addButton:active {
    outline: none !important;
    box-shadow: none !important;
    background-color: #09487C !important;
}

.deleteButton:focus, .deleteButton:active {
    outline: none !important;
    box-shadow: none !important;
}

.font-black {
    color: black !important;
}

.font-lightgray {
    color: #878787;
}

.inputHld {
    max-width: 130px;
}

.exitU:hover {
    color: #75B0AC !important;
}

.table {
    margin-bottom: 0px !important;
}

#accountantPayrollTable > :not(:last-child) > :last-child > * {
    border-bottom-color: white;
}

#accountantPayrollTable td {
    border-color: white;
}

#accountantPayrollTable thead tr {
    border-bottom: 2px solid #09487C;
}

#endText {
    color: #F57440 !important;
}

.fixedLeft {
    text-align-last: start !important;
}

.fixedLeftName {
    text-align-last: start !important;
    padding-left: 2% !important;
}

.prTableTxt, .tableBodyText {
    font-size: small;
    font-family: 'Roboto';
    padding: 0 0px 0 2px;
}

.tableBodyImage {
    max-height: 20px;
    max-width: 20px;
}

.fixedLeftName {
    text-align-last: start !important;
    padding-left: 2% !important;
}

.prTableTxt, .tableBodyText {
    font-size: small;
    font-family: 'Roboto';
    padding: 0 0px 0 2px;
}

.tableBodyImage {
    max-height: 20px;
    max-width: 20px;
}

.mainFont {
    color: #09487C !important;
    font-family: 'Roboto';
    font-weight: bold;
    padding-right: 0px !important;
    font-size: large;
}

.paragraphFont {
    color: #09487C;
    font-family: 'Roboto';
    padding-right: 0px !important;
}

.simpleFont {
    color: #09487C;
    font-family: 'Roboto';
    font-weight: 600;
    font-size: larger;
}

.h3Font {
    color: #09487C;
    font-family: 'Roboto';
    font-weight: bold;
    /*text-align: center;*/
}

.llarge {
    font-size: x-large !important;
}

.lllarge {
    font-size: xx-large !important;
}

.btable {
    padding: 0px !important;
}

.dates {
    color: white;
    font-family: 'Roboto';
}

.boxed-text {
    display: inline-block;
    padding: 5px;
    border: 1px solid #0f70a8;
    border-radius: 4px;
    width: 70%;
}

.boxed-text-money {
    display: inline-block;
    padding: 5px;
    border: 1px solid #0f70a8;
    border-radius: 4px;
    font-family: 'Roboto';
    font-size: medium !important;
    width: 60%;
    color: #09487C;
}

.boxed-text-gray {
    display: inline-block;
    padding: 6px 8px;
    border: 1px solid lightgray;
    background-color: lightgray;
    border-radius: 4px;
    min-height: 40px;
    min-width: 100px;
}

.checkboxW {
    width: 20px;
    height: 18px;
    accent-color: #09487c;
}

#end-project-screen {
    display: none;
}

.chooseProject {
    cursor: pointer;
}

#project-declaration-screen {
    display: none;
}

#user-project-terms {
    display: none;
}

#project-data-succsess {
    display: none;
}

.inactiveLink {
    background-color: #D6D6D6;
    color: #8C8D8E;
    pointer-events: none;
}

.checkboxLock {
    accent-color: #006D7F;
    width: 16px;
    height: 18px;
}

.verticalAlignCenter {
    vertical-align: middle;
}

.continueButton {
    background-color: #75B0AC;
    border-radius: 4px;
    border-color: #75B0AC;
    color: white !important;
    align-items: center;
    font-family: 'Roboto';
}

#submitBtn:disabled,
#submitBtn[disabled] {
    background-color: #75B0AC;
    border-radius: 4px;
    border-color: #75B0AC;
    color: white !important;
    align-items: center;
    font-family: 'Roboto';
}

.addButton {
    background-color: #09487C;
    border-radius: 4px;
    border-color: #09487C;
    color: white !important;
    align-items: center;
    font-family: 'Roboto';
}

.deleteButton {
    background-color: red;
    border-radius: 4px;
    border-color: red;
    color: white !important;
    align-items: center;
    font-family: 'Roboto';
}

.OKButton {
    background-color: #09487C;
    border-radius: 4px;
    border-color: #09487C;
    align-items: center;
    font-family: 'Roboto';
}

.saveButton {
    background-color: #75B0AC;
    border-radius: 4px;
    border-color: #75B0AC;
    color: white !important;
    align-items: center;
    font-family: 'Roboto';
}

.timeSheetTable {
    --bs-table-striped-bg: none;
    --bs-table-border-color: white;
    --bs-table-striped-bg: none;
    --bs-table-border-color: white;
    table-layout: auto;
}

.table-striped tbody tr td:first-child {
    background-color: #75b0ac;
    color: #09487C;
    text-align: center;
    font-family: 'Roboto';
    border-style: none !important;
}

.table-striped tbody tr:last-child td {
    background-color: #09487c;
    color: white;
    font-family: 'Roboto';
    border-style: none !important;
}

.table-striped thead tr:first-child th {
    background-color: #09487c;
    color: white;
    font-family: 'Roboto';
    font-weight: 500;
    border-style: none !important;
    /* text-decoration-line: underline; */
}

#admin-table tr td:last-child {
    border-right: 1px solid #09487C;
}

#desktop-table tr td:last-child {
    border-right: 1px solid #09487C;
}

tr:hover {
    background-color: #f5f5f5;
}

.table-responsive {
    border-radius: 5px;
}

td .time-input {
    overflow: hidden;
    font-size: small;
}

    td .time-input input {
        outline: none;
        padding: 5px;
        width: 100%;
        font-size: medium !important;
        color: #09487C;
        font-family: 'Roboto';
        background-color: white;
    }
/*input[type="time"]::-webkit-calendar-picker-indicator {
    background: none;
}*/
.without_ampm::-webkit-datetime-edit-ampm-field {
    display: none;
}

input[type=time]::-webkit-clear-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    -o-appearance: none;
    -ms-appearance: none;
    appearance: none;
    margin: -10px;
}

td .money-input {
    overflow: hidden;
    font-size: small;
}

.totalRental {
    font-size: medium !important;
    color: #09487C;
    font-weight: 600;
    font-family: 'Roboto';
}

td .money-input input {
    border: none;
    outline: none;
    background-color: transparent;
    width: 90%;
    padding: 5px;
    font-size: medium !important;
    color: #09487C;
    font-family: 'Roboto';
}

.table > :not(caption) > * > * {
    text-align-last: center;
}

.card {
    --bs-card-border-width: none !important;
}

.centerContainer {
    margin-top: 10rem !important;
}

.text-danger {
    font-family: 'Roboto';
}

.btn-primary {
    --bs-btn-hover-bg: #09487C !important;
    --bs-btn-hover-border-color: #09487C !important;
    --bs-btn-active-bg: #09487C !important;
    --bs-btn-active-border-color: #09487C !important;
    --bs-btn-bg: #09487C !important;
    --bs-btn-border-color: #09487C !important;
}

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */
    color: #09487C;
    opacity: 1; /* Firefox */
}

.simpleFont {
    padding-left: 0px;
    padding-right: 0px;
}

/*.form-control {
    /*declarationPage*\\
    border-radius: 4px;
    color: #09487C;
    font-size: larger;
    text-align: end;
    border-color: #09487C;
    outline: none !important;
    font-weight: 600;
    font-family: 'Roboto';
    padding: 5px;
}*/

.mounth {
    text-align: center !important;
    font-weight: bold;
    font-size: large;
}

.form-check-input[type="radio"] {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 13px;
    height: 13px;
    border-radius: 50% !important;
    border: 2px solid #09487c !important;
    outline: none;
    cursor: pointer;
    margin-right: 5px;
    margin-top: 8px;
}

    .form-check-input[type="radio"]:checked {
        background-color: #dc3545 !important;
        color: #dc3545 !important;
    }

.mainContainerD {
    width: 70%;
}

#firstText {
    padding-right: 0px;
    padding-left: 0px;
    width: 14%;
    text-align: center;
}

.entry {
    padding-left: 0px;
    padding-right: 0px;
}

#secondText {
    padding-right: 0px;
    text-align: start;
}

#thirdText {
    padding-right: 0px;
    text-align: center;
}

#fourthText {
    padding-right: 0px;
    padding-left: 0px;
    text-align: start;
}

#lastText {
    padding-left: 0px;
    text-align: center;
    width: 6%;
}

.radioB {
    padding-right: 0px;
    padding-left: 0px;
    text-align: start;
    width: 6%;
}

.textarea {
    border-color: #09487C;
    border-radius: 4px;
    min-height: 250px;
    font-family: 'Roboto';
    font-size: large;
    font-weight: 500;
    color: #09487C;
    background-color: #D9D9D92B;
}

.dropdown-toggle::after {
    display: inline-block;
    content: "";
    width: 10px; /* Adjust the width and height according to your image size */
    height: 10px;
    background-color: white; /* Add a default background color */
    background-image: url("../img/arrow.png");
    background-repeat: no-repeat;
    background-size: contain;
}

.btn::after {
    border: none !important;
    background-color: white;
    background-repeat: no-repeat;
    background-size: contain;
}

#dropdownMenuButton {
    border-radius: 4px;
    background-color: #D9D9D947;
    border-color: #d9d9d947;
    color: #09487C;
}

.dropdown-menu {
    min-width: -webkit-fill-available !important;
}

#hamburgerMenuButton {
    background-color: white !important;
    border-color: white;
}

.hamburgermenu {
    min-width: 10rem !important;
    text-decoration: underline;
    padding: 9px 18px 3px 18px !important;
    right: 7%;
    font-family: 'Roboto';
    color: white !important;
    background-color: #09487C !important;
    border: 1px solid #09487C !important;
    border-radius: 4px !important;
}

    .hamburgermenu li {
        margin-bottom: 10px;
    }

        .hamburgermenu li a {
            color: white !important
        }

.positionDropdown {
    border-radius: 4px;
    background-color: #D9D9D947;
    border-color: #d9d9d947;
    color: #09487C;
}

.mt-6 {
    margin-top: 10rem !important;
}

.form-select {
    display: block;
}

.form-control, .my-input-class {
    /*registerPage*/
    background-color: #d9d9d947 !important;
    border-color: #d9d9d947 !important;
    border-radius: 4px !important;
    font-family: 'Roboto';
    outline: none !important;
}

.btn:hover {
    background-color: #09487C;
    color: white !important;
    border-color: #09487C;
}

.btn::after {
    background-color: #09487C;
    border-color: #09487C;
}

.notification-container {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 9999;
}

.notification {
    background: #ffffff;
    border: none;
    padding: 10px 20px 0px 20px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}

.close-btn {
    background-color: #ffffff;
    border: none;
    color: #09487C;
    padding: 0px;
    font-size: 14px;
    cursor: pointer;
}

.password-toggle-btn {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    color: black;
    border: none;
    background-color: transparent;
    padding-right: 0px;
}

#submitBtn {
    display: none;
    width: 21%;
    margin-right: 4%;
}

.solentLogo {
    max-width: 150px
}

.mw-45 {
    max-width: 45px;
}

.mw-40 {
    max-width: 40px;
}

.password-input {
    padding-right: 40px;
}

.input-group .btn {
    position: absolute !important;
}

.forgottenPass {
    text-decoration-line: underline;
    padding: 0px;
    font-family: 'Roboto';
    font-weight: 600;
    color: #09487c;
    font-size: medium;
    float: right;
}

.simpleText {
    font-family: 'Roboto';
    font-size: medium;
}

.containerC {
    max-height: 550px;
    overflow-y: auto;
    max-width: 100%;
    overflow-x: hidden;
}

.contentC {
    margin-right: 5px;
}

::-webkit-scrollbar {
    /* Width of vertical scroll bar */
    width: 8px;
    border-radius: 4px;
    background-color: #D8DADC;
}

::-webkit-scrollbar-thumb {
    border-radius: 4px;
    background: #09487C;
}

.boxMain {
    background-color: #FFFFFF;
    border: 3px solid #09487C;
    margin-bottom: 10px;
    border-radius: 4px;
    padding: 6px;
}

.boxCurr {
    background-color: #FFFFFF;
    border: 1px solid #09487C;
    margin-bottom: 10px;
    border-radius: 4px;
}

.boxFut {
    background-color: #D9D9D9;
    border: 1px solid #D9D9D9;
    margin-bottom: 10px;
    border-radius: 4px;
}

.boxPast {
    background-color: #D9D9D9;
    border: 1px solid #D9D9D9;
    margin-bottom: 10px;
    border-radius: 4px;
}

.box-content {
    padding: 6px;
}

.boxFontMain {
    color: #09487C;
    font-family: 'Roboto';
    margin-bottom: 0px !important;
    font-weight: 500;
}

.boxFont {
    color: #09487C;
    font-family: 'Roboto';
    margin-bottom: 0px !important;
}

.mainContainerPS {
    flex: 0 0 auto;
    width: 33.33333333%;
}

.archiveBoxes {
    padding: 5px;
    flex-wrap: nowrap;
}

.imgArchive {
    padding: 17px;
    max-height: 65px;
    max-width: 60px;
}

.gifWidth {
    max-width: 80px;
    max-height: 60px;
}

.gifWidth {
    max-width: 80px;
    max-height: 60px;
}

.textBlock {
    margin: 0px !important;
    padding-right: 15% !important;
    padding-left: 0px;
}

body {
    background: white
}

#regForm {
    background-color: #ffffff;
    margin: 0px auto;
    font-family: Raleway;
    border-radius: 10px
}

h1 {
    text-align: center
}

input {
    background-color: #d9d9d947;
    border-color: #d9d9d947;
    border-radius: 4px !important;
    font-family: 'Roboto';
    outline: none !important;
}

.form-check-input[type="radio"] {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 15px;
    height: 15px;
    border-radius: 50% !important;
    border: 2px solid #09487c !important;
    outline: none;
    cursor: pointer;
}

    .form-check-input[type="radio"]:checked {
        background-color: #dc3545 !important;
        color: #dc3545 !important;
    }

.tab {
    display: none
}

#register {
    font-size: x-large !important;
}

button {
    background-color: #09487C;
    color: #ffffff;
    border: none;
    padding: 10px 20px;
    font-size: 17px;
    font-family: Raleway;
    cursor: pointer
}

    button:hover {
        opacity: 0.8
    }

.step {
    height: 12px;
    width: 12px;
    margin: 0 2px;
    background-color: #09487C;
    border: none;
    border-radius: 50%;
    display: inline-block;
}

    .step.active {
        width: 15px;
        height: 15px;
    }

    .step.finish {
        background-color: #4CAF50
    }

.all-steps {
    text-align: center;
    margin-top: 30px;
    margin-bottom: 30px
}

#xicon {
    width: 45px;
    height: 25px;
}

.iconBtnImg {
    max-width: 40px;
    max-height: 40px;
    padding: 0px;
}

.lockedImgButton {
    background: none;
    border: none;
    padding: 0;
    max-width: 45px;
    cursor: pointer;
}

.lockedImg:hover {
    content: url("../img/lockedHover.png") !important;
}

.lockedImg.clicked {
    content: url("../img/lockedProject.png");
}

.unlockedImgButton {
    background: none;
    border: none;
    padding: 0;
    max-width: 45px;
    cursor: pointer;
}

.unlockedImg:hover {
    content: url("../img/hoverUnlock.png") !important;
}

.unlockedImg.clicked {
    content: url("../img/unlockIcon.png");
}

.archiveImgButton {
    background: none;
    border: none;
    padding: 0;
    max-width: 45px;
    cursor: pointer;
}

.archiveImg:hover {
    content: url("../img/archiveHover.png") !important;
}

.archiveImg.clicked {
    content: url("../img/archiveImgBtn.png ");
}

.notification-badge {
    position: relative;
    display: inline-block;
}

#activeBellImg {
    max-height: 47px;
}

.badge-number {
    position: absolute;
    top: 0px;
    right: 0px;
    background-color: #F57440;
    color: white;
    min-width: 20px;
    min-height: 20px;
    border-radius: 50%;
    text-align: center;
    line-height: 20px;
    font-size: 12px;
    font-weight: bold;
}


.password-toggle-btn {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    border: none;
    background-color: transparent;
}

.password-input {
    padding-right: 40px;
}

.input-group .btn {
    position: absolute !important;
}

.forgottenPass {
    text-decoration-line: underline;
    padding: 0px;
    font-family: 'Roboto';
    font-weight: 600;
    color: #09487c;
    font-size: medium;
    float: right;
}

.simpleText {
    font-family: 'Roboto';
    font-size: medium;
}

#prevBtn {
    color: #09487C;
    background-color: white;
    font-weight: bold;
    margin-top: 10px;
    padding: 0px !important;
}

.table-bordered {
    border-collapse: separate;
    border-spacing: 0;
}

    .table-bordered th,
    .table-bordered td {
        padding: 8px;
    }

    .table-bordered tbody .row-border {
        border-radius: 10px;
    }

        .table-bordered tbody .row-border td {
            border: 1px solid #00008B;
        }

td {
    vertical-align: middle;
}




input {
    border: white;
}

.customInput {
    background-color: #75B0AC5C;
    border: 1px solid #09487c;
    border-radius: 4px;
    margin-left: 5px;
}

#honorar {
    text-align: end;
}

#declaration {
    text-align: end;
    text-decoration: underline;
    color: #006D7F !important;
    text-transform: uppercase;
}

#backArrow {
    max-width: 50px;
    max-height: 50px;
    padding: 0px 0px 20px 0px;
}

.row-link {
    color: inherit;
    text-decoration: none;
}

    .row-link:hover {
        text-decoration: none;
    }

    .row-link:focus {
        outline: none;
    }

/*.form-control {
    border-radius: 4px;
    border-color: #09487C;
    outline: none !important;
    font-weight: 600;
    font-family: 'Roboto';
}*/

.noBorder {
    border: none !important;
    background-color: white !important;
    font-weight: 600;
    font-family: 'Roboto';
    color: #09487C;
}

.th {
    font-family: 'Roboto';
    color: #09487C !important;
    font-weight: 600;
    text-align: center;
}

tr {
    font-family: 'Roboto';
    color: #09487C;
    text-align: center;
}

    tr:hover {
        background-color: #FFF;
    }

a:hover {
    color: #09487C !important;
}

.px-2 {
    padding-left: 0.7rem !important;
}

.imageProfile {
    width: 52px;
    height: 52px;
    padding: 0px;
}

.imagePencil {
    width: 24px;
    height: 24px;
    padding: 0px;
}

.h2Font {
    width: 16% !important;
}

.h4Font {
    width: 21% !important;
}

.h4Font2 {
    width: 15% !important;
}

.line {
    height: 1.5px;
    border-radius: 4px;
    border-color: #09487C;
    background-color: #09487C;
    color: #09487C;
    opacity: 2;
}

.pline {
    margin-top: 2px;
}

.pline {
    margin-top: 2px;
}

.containerText {
    display: flex;
    align-items: center;
}

.update-icon {
    max-width: 20px;
    max-height: 20px;
    margin-left: 10px;
    margin-bottom: 10px;
}

.update-iconP {
    max-width: 40px;
    max-height: 40px;
    margin-left: 10px;
}

.clickable-row {
    cursor: pointer;
    position: relative;
    background-color: #FFF;
}

    .clickable-row:before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        border: 1px solid #09487C;
        border-radius: 4px;
    }

    .clickable-row:hover {
        background-color: #09487C;
        color: #FFF !important;
        border-radius: 4px;
    }

.row-content {
    display: flex;
}

.cell {
    flex: 1;
    padding: 10px;
    font-family: 'Roboto';
}

.tablePositionText {
    font-size: smaller;
    flex: 1;
    padding-top: 10px;
    font-family: 'Roboto';
}

table {
    border-collapse: separate;
    border-spacing: 0px 10px;
    table-layout: fixed;
}

::-webkit-scrollbar {
    /* Width of vertical scroll bar */
    height: 4px;
    width: 3px;
    border-radius: 4px;
    background-color: #D8DADC;
}

::-webkit-scrollbar-thumb {
    border-radius: 4px;
    background: #09487C;
}

/* .container {
    overflow-y: hidden !important;
} */
.customEntryLV {
    text-align: end;
    font-weight: bold;
    font-size: large;
}

.mobileTable {
    display: none !important;
}

.dekstopTable {
    min-width: 101%;
}

.timeSheetInput {
    background-color: white;
    caret-color: #09487c;
    text-align: center;
    font-family: 'Roboto';
    color: #09487C;
}

.errorImg {
    width: 36%;
}

.accordionItem .accordionButton {
    border: 1px solid;
    border-color: #09487C;
    border-radius: 4px !important;
    background-color: #09487C;
    color: white;
}

.accordionItem:first-of-type .accordionButton {
    border-radius: 4px;
}

.accordionButton {
    padding: 10px;
    font-family: 'Roboto';
    color: white;
    text-transform: uppercase;
    background-color: #09487C;
}

    .accordionButton.collapsed {
        margin-bottom: 5px;
    }

.payrollRow {
    border: 1px solid;
    border-color: #09487C;
    border-radius: 4px;
    margin: 0 0 4px 0;
}

.payrollDogovor {
    align-self: center;
    writing-mode: vertical-rl;
    padding-right: 2px;
    max-width: 35px !important;
}

.deleteTimeSheet {
    cursor: pointer;
}

.accordionButton::after {
    display: none;
}

.accordionButton:not(.collapsed)::before {
    background-image: url("../img/arrow.png");
    transform: var(--bs-accordion-btn-icon-transform);
}

.accordionButton::before {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    margin-right: 10px;
    content: "";
    border-radius: 30px;
    background-color: white;
    border: 3px solid white;
    background-image: url("../img/arrow.png");
    background-size: 8px;
    background-position: center;
    background-repeat: no-repeat;
    transition: var(--bs-accordion-btn-icon-transition);
}

.accordionButton:not(.collapsed) {
    color: white;
    background-color: #09487C;
    margin-bottom: 10px !important;
}

#collapseTotal {
    padding: 0px !important;
}

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

.custom-table .row {
    display: flex;
    border: 1px solid #09487C;
    border-radius: 4px;
    margin-bottom: 5px;
}

.custom-table .col-6 {
    padding: 10px;
}

.positionTxt {
    font-family: 'Roboto';
    text-transform: uppercase;
    font-weight: 600;
    font-size: medium;
}

.nameTxt {
    font-family: 'Roboto';
    font-weight: 600;
    font-size: 15px;
}

.pagination {
    display: flex;
    justify-content: center;
    align-items: center;
}

    .pagination ul {
        list-style-type: none;
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 0;
    }

    .pagination li {
        margin: 0 5px;
    }

        .pagination li a {
            display: block;
            min-width: 32px;
            min-height: 32px;
            text-align: center;
            padding: 3px 0px;
            text-decoration: none;
            color: #333;
            background-color: #fff;
            border: 1px solid #DFE3E8;
            border-radius: 4px;
        }

        .pagination li.active a {
            color: #F47133;
            background-color: #fff;
            border-color: #F47133;
        }

.disabled {
    pointer-events: none;
    opacity: 0.6;
    background-color: #919EAB !important;
}

.pagination li.disabled a:hover {
    cursor: default;
}

.pagination li.arrow a {
    padding: 5px;
}

.pagination li.arrow.disabled a {
    opacity: 0.6;
    cursor: default;
}

.pagination li.arrow a {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5px;
}

    .pagination li.arrow a i {
        font-size: 12px;
    }

#end-project-screen {
    display: none;
}

.chooseProject {
    cursor: pointer;
}

#project-declaration-screen {
    display: none;
}

#user-project-terms {
    display: none;
}

#project-data-succsess {
    display: none;
}

.accordionItem .accordionButton {
    border: 1px solid;
    border-color: #09487C;
    border-radius: 4px !important;
    background-color: #09487C;
    color: white;
}

.accordionItem:first-of-type .accordionButton {
    border-radius: 4px;
}

.accordionButton {
    padding: 10px;
    font-family: 'Roboto';
    color: white;
    text-transform: uppercase;
    background-color: #09487C;
}

    .accordionButton.collapsed {
        margin-bottom: 5px;
    }

.payrollDogovor {
    align-self: center;
    /* -webkit-writing-mode: vertical-rl; */
    writing-mode: vertical-rl;
    /* padding: 0px; */
    max-width: 50px;
}

.accordionButton::after {
    display: none;
}

.accordionButton:not(.collapsed)::before {
    background-image: url("../img/arrow.png");
    transform: var(--bs-accordion-btn-icon-transform);
}

.accordionButton::before {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    margin-right: 10px;
    content: "";
    border-radius: 30px;
    background-color: white;
    border: 3px solid white;
    background-image: url("../img/arrow.png");
    background-size: 8px;
    background-position: center;
    background-repeat: no-repeat;
    transition: transform 0.3s ease-in-out; /* Specify the transition directly */
    transform: rotate(0deg); /* Initial rotation */
}

.accordionButton:not(.collapsed)::before {
    transform: rotate(180deg); /* Rotate when expanded */
}

.accordionButton:not(.collapsed) {
    color: white;
    background-color: #09487C;
    margin-bottom: 5px;
}

.accordion-body {
    padding: 0px !important;
}

#collapseTotal {
    padding: 0px !important;
}

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

.custom-table .row {
    display: flex;
    border: 1px solid #09487C;
    border-radius: 4px;
    margin-bottom: 5px;
}

.custom-table .col-6 {
    padding: 10px;
}

.positionTxt {
    font-family: 'Roboto';
    text-transform: uppercase;
    font-weight: 600;
    font-size: medium;
}

.nameTxt {
    font-family: 'Roboto';
    font-weight: 600;
    font-size: 15px;
}

.pagination {
    display: flex;
    justify-content: center;
    align-items: center;
}

    .pagination ul {
        list-style-type: none;
        display: flex;
        justify-content: center;
        align-items: center;
        padding: 0;
    }

    .pagination li {
        margin: 0 5px;
    }

        .pagination li a {
            display: block;
            min-width: 32px;
            min-height: 32px;
            text-align: center;
            padding: 3px 0px;
            text-decoration: none;
            color: #333;
            background-color: #fff;
            border: 1px solid #DFE3E8;
            border-radius: 4px;
        }

        .pagination li.active a {
            color: #F47133;
            background-color: #fff;
            border-color: #F47133;
        }

.disabled {
    pointer-events: none;
    opacity: 0.6;
    background-color: #919EAB !important;
}

.pagination li.disabled a:hover {
    cursor: default;
}

.pagination li.arrow a {
    padding: 5px;
}

.pagination li.arrow.disabled a {
    opacity: 0.6;
    cursor: default;
}

.pagination li.arrow a {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5px;
}

    .pagination li.arrow a i {
        font-size: 12px;
    }

#end-project-screen {
    display: none;
}

.chooseProject {
    cursor: pointer;
}

#project-declaration-screen {
    display: none;
}

#user-project-terms {
    display: none;
}

#project-data-succsess {
    display: none;
}

.inactiveLink {
    background-color: #D6D6D6;
    color: #8C8D8E;
    pointer-events: none;
}

.project-change-status {
    cursor: pointer;
}

#activeBellIconHld {
    display: none;
}

#steps, #alternative-steps {
    list-style-type: none;
    display: flex;
    justify-content: space-between;
    background-color: white;
    position: relative;
    overflow: hidden;
    counter-reset: wizard;
    padding: 0;
    margin: 0;
}

.wizard-stepA, .wizard-step {
    position: relative;
    float: left;
    width: calc(100% / 4);
    text-align: center;
    color: #09487c;
    cursor: pointer;
}

    .wizard-stepA::before, .wizard-step:before {
        counter-increment: wizard;
        content: counter(wizard);
        display: block;
        color: white;
        background-color: #D6D6D6;
        border: 2px solid #D6D6D6;
        text-align: center;
        width: 2em;
        height: 2em;
        line-height: 2em;
        border-radius: 50%;
        position: relative;
        left: 50%;
        transform: translateX(-50%);
        margin-bottom: 1em;
        z-index: 1;
    }

    .wizard-stepA:not(:last-child)::after, .wizard-step:not(:last-child)::after {
        content: "";
        position: absolute;
        background-color: #D6D6D6;
        width: calc(100% - 2em);
        height: 2px;
        top: calc(25% - 1px);
        left: 100%;
        transform: translateX(-50%);
        z-index: 0;
    }

    .wizard-stepA.visited:not(:last-child)::after, .wizard-step.visited:not(:last-child)::after {
        background-color: #09487c; /* Change the background color for visited steps */
    }

    .wizard-stepA.current:before, .wizard-step.current:before {
        background-color: #09487c;
        color: white;
        border-color: #09487c;
    }

.step-content {
    display: none;
}

    .step-content.visible {
        display: block;
    }

.chcolor {
    background-color: #09487c !important;
}


.table-form {
    width: 100%;
    border-collapse: collapse;
    border: 1px solid #09487c; /* Border color for the entire table */
}

    .table-form td {
        border: 1px solid #09487c; /* Border color for each cell */
        padding: 10px;
        word-wrap: break-word;
    }

.label-cell {
    font-weight: bold;
    text-align: left;
}

.input-cell {
    width: 100%;
    background-color: white !important;
    color: #09487c;
    height: auto;
}

.contractNavigation {
    cursor: pointer;
}

.overlayPopup {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3);
    display: none;
    justify-content: center;
    align-items: center;
    z-index: 1000;
}

.popupLoad {
    background-color: white;
    padding: 20px;
    border-radius: 8px;
    text-align: center;
}

.loadingImg {
    max-width: 30px !important;
}

.viewContract {
    cursor: pointer;
}

.numPeopleTimeSheetEntry {
    margin: 0px 0px 0px 15px;
    flex-shrink: 0;
    width: 25px;
    height: 20px;
    content: "";
    border-radius: 30px;
    background-color: white;
    color: #09487C;
    font-size: small;
}

#excelExport, #printAllContrats {
    margin-left: 1%;
}

.accountantPayrollForm {
    width: 1280px;
    overflow-x: auto;
}

#accountantPayrollTable, .timeSheetDataTable, .timeSheetDataTableRow {
    width: 3500px;
}

.payRol-dep-btn {
    border: none;
    border-color: transparent;
}

.my-input-class {
    width: 100%;
}

.my-cancel-class {
    margin-left: 5px;
}

.col-01 {
    flex: 0 0 auto;
    width: 4.32%;
}

.errorClass {
    color: red;
    background-color: red;
}

.my-confirm-class {
    color: #006D7F;
}

.my-cancel-class {
    color: #dc3545;
}

.modal-body {
    height: 400px;
    overflow-y: scroll;
}

input[type="number"] {
    -moz-appearance: textfield;
}

    input[type="number"]::-webkit-inner-spin-button,
    input[type="number"]::-webkit-outer-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }