/* Write your CSS code. */
@media print {
    ::-webkit-scrollbar {
        display: none;
    }
}

.background-color-red {
    background-color: red !important;
}
.customer-item {
    display: flex;
    padding: 5px;
    border-bottom: 1px solid #ddd;
}

.customer-id {
    width: 60px;
    font-weight: bold;
    color: #555;
}

.k-multiselect {
    height: auto; /* or a fixed height like 150px */
    max-height: 120px; /* set a reasonable max-height if needed */
    overflow-y: auto; /* enable scrolling if items overflow */
}

.readonly {
    pointer-events: none; /* Prevents interaction */
    background-color: #e9ecef; /* Gives a readonly-like appearance */
    opacity: 1; /* Keeps it fully visible */
}
.customer-details {
    flex: 1;
    padding-left: 10px;
}

.customer-name {
    font-size: 14px;
    font-weight: bold;
    color: #000;
}

.customer-contact {
    font-size: 12px;
    color: #777;
}

.no-data {
    padding: 10px;
    text-align: center;
    color: #999;
}
.field-validation-error {
    color: #b94a48;
}

.hideInfo {
    display: none;
}

.field-validation-valid {
    display: none;
}

input.input-validation-error {
    border: 1px solid #b94a48;
}

.pl-0 {
    padding-left: 0px;
}
.fc-time {
    font-weight: bold;
}

.mb-1 {
    margin-bottom: 5px;
}
select.input-validation-error {
    border: 1px solid #b94a48;
}

body > .k-loading-mask {
    position: fixed;
    z-index: 9999;
}

.custom-editor-window .k-loading-mask {
    display: none;
}

input[type="checkbox"].input-validation-error {
    border: 0 none;
}

.validation-summary-errors {
    color: #b94a48;
}

.validation-summary-valid {
    display: none;
}

.toggle {
    width: 103px;
    height: 20px;
}

.pagination {
    margin: 0px !important;
}

.full-width {
    width: 100% !important;
}

.k-loading-image {
    z-index: 1051 !important;
}

.padding-right-10 {
    padding-right: 10px;
}

.editbtn {
    background-color: #f39c12 !important;
    border-radius: 3px;
    border: 3px solid #f39c12;
}

.printbtn {
    background-color: #5bc0de !important;
    border-radius: 3px;
    padding: 2px 5px;
    border: 3px solid #5bc0de;
}

.invoicebtn {
    background-color: #28a745 !important;
    border-radius: 3px;
    padding: 2px 5px;
    border: 3px solid #28a745;
}

.imagebtn {
    background-color: #9933ff !important;
    border-radius: 3px;
    padding: 2px 5px;
    border: 3px solid #9933ff;
}

.primarybtn {
    background-color: #007bff !important;
    border-radius: 3px;
    padding: 2px 5px;
    border: 3px solid #007bff;
}

    .primarybtn > i {
        color: white;
    }

.continuebtn {
    background-color: #00c0ef !important;
    border-radius: 3px;
    border: 3px solid #00c0ef;
}

    .continuebtn > i {
        color: white;
    }

.prewhiteSpace {
    white-space: pre-wrap;
}

.deletebtn {
    background-color: red !important;
    border-radius: 3px;
    cursor: pointer;
    border: 3px solid red;
}

.margin-2 {
    margin: 2px;
}

.deletebtn > i {
    color: white;
}

.skipbtn {
    background-color: #28a745 !important;
    border-radius: 3px;
    border: 3px solid #28a745;
}

    .skipbtn > i {
        color: white;
    }

.editbtn > i {
    color: white;
}

.dataTables_wrapper {
    font-size: 12px;
}

.uk-timeline .uk-timeline-item .uk-card {
    max-height: 300px;
}

.uk-timeline .uk-timeline-item {
    display: flex;
    position: relative;
}

    .uk-timeline .uk-timeline-item::before {
        background: #dadee4 !important;
        content: "" !important;
        height: 100% !important;
        left: 19px !important;
        position: absolute !important;
        top: 20px !important;
        width: 2px !important;
        z-index: 0 !important;
    }


    .uk-timeline .uk-timeline-item .uk-timeline-icon .uk-badge {
        margin-top: 20px;
        width: 40px;
        height: 40px;
    }

    .uk-timeline .uk-timeline-item .uk-timeline-content {
        -ms-flex: 1 1 auto;
        flex: 1 1 auto;
        padding: 0 0 0 1rem;
    }


.uk-timeline-icon {
    z-index: 1;
}

.ellipsis {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.table-striped > tbody > tr:nth-of-type(odd) {
    background-color: #f6f6f6;
}

.text-Decoration-line-through {
    text-decoration-line: line-through !important;
}

.tableHeaderFixed > thead th {
    position: sticky !important;
    top: 0;
    z-index: 1;
    background: white;
}

.pb-3 {
    padding-bottom: 0.75rem;
}

.pb-4 {
    padding-bottom: 1.25rem;
}

.background-color-grey {
    background-color: #d6dcea
}

.mr-3 {
    margin-right: 0.75rem;
}

.numbering {
    border-radius: 20px;
    padding-left: 12px;
    background-color: #007bff;
    color: white;
}

.numbering-red {
    border-radius: 20px;
    padding-left: 12px;
    background-color: #b22222;
    color: white;
}

.row-selected:hover {
    background: #e1e1e1;
    cursor: pointer;
}

.form-checkbox {
    width: 1.5rem;
    height: 1.5rem;
    margin-left: 10px !important
}
.background-color-calendar {
    background-color: #f2e18f
}
.pl-4 {
    padding-left: 25px !important;
}
.pl-1 {
    padding-left: 5px !important;
}
.pl-0{
    padding-left:0px !important;
}
.pr-0{
    padding-right:0px !important;
}
.pt-0{
    padding-top:0px !important;
}
.br-0{
    border:0px !important
}
.mt-2{
    margin-top:12px;
}
.mt-1{
    margin-top:5px;
}
.mb-1{
    margin-bottom:5px;
}
.mb-2{
    margin-bottom:12px;
}
.fc-title{
    font-weight:500 !important;
}

.float-right {
    float: right;
}

.title-header {
    font-size: 26px;
    padding-bottom: 5px;
}

.custom-checkbox {
    display: none; /* Hide the actual checkbox */
}

    .custom-checkbox + label {
        background-color: #ccc; /* Default background color */
        color: white; /* Text color */
        padding: 5px 10px; /* Padding inside the label */
        border-radius: 5px; /* Rounded corners for button-like appearance */
        display: inline-block; /* Allows width and padding to be set */
        cursor: pointer; /* Pointer cursor on hover */
        transition: background-color 0.3s; /* Smooth transition for background color */
    }

    .custom-checkbox:checked + label {
        background-color: #007BFF; /* Background color when checked */
    }

    .custom-checkbox + label:hover {
        background-color: #666; /* Darker background on hover */
    }

    .custom-checkbox:checked + label:hover {
        background-color: #0056b3; /* Slightly darker blue when checked and hovered */
    }

    .custom-checkbox + label {
        margin-right: 5px; /* Space between each button */
        margin-bottom: 5px; /* Space below each button if wrapping occurs */
    }
.locked-date {
    text-decoration: line-through;
    color: grey;
}

    .locked-date::before {
        content: "\f023"; /* Unicode for Font Awesome lock icon */
        font-family: 'Font Awesome 5 Free'; /* Adjust based on your Font Awesome version */
        padding-right: 5px;
    }

.tableDateDetails {
    background-color: #ccc;
}
.form-group .control-label {
    text-align: right; /* Aligns labels to the right, close to the input fields */
    padding-right: 10px; /* Adds some space between the label and the input field */
}

.form-control {
    width: 100%; /* Ensures that input takes the full width of its container */
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .form-group .control-label {
        text-align: left; /* Aligns labels to the left on smaller screens */
        padding-right: 0;
    }
}
.float-right{
    float:right;
}


.combobox-item {
    display: flex;
    padding: 5px;
    font-size: 12px;
    border-bottom: 1px solid #ddd;
}

.item-id {
    font-weight: bold;
    color: #555;
}

.item-details {
    flex: 1;
    flex-direction: row;
    padding-left: 10px;
}

.item-1 {
    font-weight: bold;
    color: #000;
}

.item-2 {
    color: #777;
}
.ml-3{
    margin-left:15px;
}