@charset "utf-8";

.form-control,
.form-select{
    font-size: 0.875rem;
}

.form-select{
    padding: 0.2rem 0.3rem;
    border-radius: 0.25rem;
    min-width: 70px;
}

select,
select[multiple]{
    color: #000 !important;
    -webkit-text-fill-color: #000 !important;
    background-color: #fff;
}

select option{
    color: #000 !important;
}

.forms .datepicker-wrapper,
.forms .datepicker-wrapper input.datepicker{
    width: 100%;
}

.datepicker-wrapper input {
    -webkit-appearance: none;
    appearance: none;
    background-color: #fff !important;
    color:#000;
    border: 1px solid #ccc;
    border-radius: 6px;
    height: 28px;
    line-height: 28px;
    padding: 0 12px;
    font-size: 0.875rem;
}

.list-export .datepicker-wrapper{
    width: 100%;
}

input[type="checkbox"] {
    accent-color: #ff600f;
}

.form-check-input{
    accent-color: #ff600f;
}

input[type="checkbox"]:checked{
    background-color: #ff600f;
    border-color: #ff600f;
}

input,
input[type="text"],
input[type="input"],
input[type="number"],
input[type="search"],
input[type="password"],
select,
select[multiple],
textarea{
    border: 1px solid #ccc;
    border-radius: 0.2rem;
    padding: 0.2rem 0.3rem;
    font-family:'Titillium Web', Arial, Helvetica, sans-serif!important;
}

input[type="range"]{
    border:none;
}

input[type="range"]:focus{
    border:none!important;
    box-shadow:none!important;
    outline: none!important;
}

input[type="submit"],
input[type="button"] {
    padding: 0.25rem 0.5rem;
    background: #1a1a1a;
    color: #fff;
    border: 1px solid #1a1a1a;
    border-radius: 0.2rem;
    transition: all .45s ease-in-out;
    cursor: pointer;
}
input[type="submit"].btn-primary,
input[type="button"].btn-primary{
    background: #ff600f;
    border: 1px solid #ff600f;
}

input:focus,
textarea:focus,
select:focus {
    border-color: #ff600f!important;
    box-shadow: 0 0 0 .25rem rgba(255, 96, 15, .25)!important;
    outline: unset;
}

input:focus-visible,
textarea:focus-visible,
select:focus-visible {
    border-color: #ff600f!important;
    box-shadow: 0 0 0 .25rem rgba(255, 96, 15, .25)!important;
    outline: unset;
}

.form-check-input:checked{
    background-color:#ff600f !important;
    border-color:#ff600f !important;

    --bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10l3 3 6-7'/%3e%3c/svg%3e") !important;
}

.form-check-input:focus{
    border-color:#ff600f !important;
    box-shadow:0 0 0 .25rem rgba(255,96,15,.25) !important;
}

/* Original verstecken, falls altInput aktiv ist und iOS es trotzdem zeigt */
input.flatpickr-input[readonly] {
    opacity: 1;
}
input[type="hidden"].flatpickr-input,
.flatpickr-hidden-input {
    display: none !important;
}

select:focus {
    outline: 2px solid #ff600f;
}

option:hover {
    background-color: #ff600f;
}

input[type="submit"]:hover {
    background: #ff600f;
    border: 1px solid #ff600f;
}

.input-group.custom {
    width: fit-content;
    font-size: 0.85rem;
    font-weight: 600;
    -webkit-box-shadow: 0px -10px 15px -9px rgba(0, 0, 0, 0.22), inset 0px -10px 15px -9px rgba(0, 0, 0, 0.05);
    box-shadow: 0px -10px 15px -9px rgba(0, 0, 0, 0.22), inset 0px -10px 15px -9px rgba(0, 0, 0, 0.05);
}

.input-group.custom img {
    height: 18px;
    width: 18px;
    top: -2px;
    position: relative;
}

.input-group.custom span.input-group-text {
    font-size: 0.85rem;
    font-weight: 600;
    border-color: #ff600f;
    background: #fce2d5;
    color: #ff600f;
    border-bottom-left-radius: 0.25rem;
    border-top-left-radius: 0.25rem;
}

.input-group.custom .form-control{
    font-size: 1rem;
    background: #f1f1f1;
    font-weight: 600;
    border-color: #757575;
    border-left: 1px solid #ff600f;
    color: #252525;
    border-bottom-right-radius: 0.25rem;
    border-top-right-radius: 0.25rem;
}

a.button-forwards,
a.button-backwards{
    padding: 0.5rem;
    background: #1a1a1a;
    color: #fff;
    border-radius: 0.2rem;
    transition: all .45s ease-in-out;
    cursor: pointer;
    margin: 0.5rem 0;
}

.button-forwards:after{
    content: url(images/icons/icon-forwards.svg);
    width: 1.2rem;
    display: inline-block;
    margin-right: 0.2rem;
    vertical-align: middle;
}

.button-backwards:before{
    content: url(images/icons/icon-backwards.svg);
    width: 1.2rem;
    display: inline-block;
    margin-right: 0.2rem;
    vertical-align: middle;
}

/* ##### buttonArea ##### */

div.buttonArea{
    text-align: right;
    margin: 10px 0;
    float: right;
}

div.buttonArea a.button {
    float: left;
    padding: 10px !important;
    margin: 0 5px;
    height: auto !important;
    opacity: 0.8;
}

div.buttonArea a.button:hover {
    opacity: 1;
}

/* ##### EVA Buttons ##### */

a.eva_button01{
    text-align:center;
    text-decoration:none;
    width:224px;
    display:block;
    color:#FFFFFF;
    font-weight:bold;
    padding:5px;
    background-color:#ff600f;
    margin-top:1px;
    cursor:pointer;
    transition: all .45s ease-in-out;
}

a.eva_button01:hover{
    background-color:#252525;
}

a.eva_button02{
    font-family:'Titillium Web', Arial, Helvetica, sans-serif!important;
    text-align:center;
    text-decoration:none;
    width:180px;
    padding: 5px;
    display: block;
    color:#FFFFFF;
    border-radius: 0.2rem;
    background-color:#706F6F;
    margin: 5px;
    margin-top:1rem;
    cursor:pointer;
    margin-bottom: 1rem;
    transition: all .45s ease-in-out;
    font-size: 13px;
}

a.eva_button02:hover{
    background-color:#252525;
}

#eva_button03{
    font-family:'Titillium Web', Arial, Helvetica, sans-serif!important;
    text-align:center;
    text-decoration:none;
    width:auto;
    font-size: 14px;
    display: block;
    color:#FFFFFF;
    border-radius: 0.2rem;
    background-color:#ff600f;
    margin-top:1rem;
    cursor:pointer;
    margin-bottom: 1rem;
    border: 1px solid #ff600f;
    transition: all .45s ease-in-out;
    margin: 5px;
}

#eva_button03:hover{
    background-color:#252525;
    border: 1px solid #252525;
}

#eva_button04{
    font-family:'Titillium Web', Arial, Helvetica, sans-serif!important;
    font-size:13px;
    text-align:center;
    text-decoration:none;
    width:200px;
    display:block;
    color:#FFFFFF;
    padding:5px;
    background-color:#ff600f;
    margin-top:1px;
    border:none;
    cursor:pointer;
    transition: all .45s ease-in-out;
}

#eva_button04:hover{
    background-color:#252525;
}

#eva_button05{
    font-family:'Titillium Web', Arial, Helvetica, sans-serif!important;
    font-size:14px;
    text-align:center;
    text-decoration:none;
    width:100px;
    display:block;
    color:#FFFFFF;
    border-radius: 0.2rem;
    padding:5px;
    background-color:#706F6F;
    margin-top:1px;
    border:none;
    cursor:pointer;
    transition: all .45s ease-in-out;
}

#eva_button05:hover{
    background-color:#252525;
}

#eva_button06{
    font-family:'Titillium Web', Arial, Helvetica, sans-serif!important;
    font-size:14px;
    text-align:center;
    text-decoration:none;
    width:200px;
    display:block;
    color:#FFFFFF;
    padding:8px 7px;
    border-radius: 0.2rem;
    background-color:#ff600f;
    margin-top:1px;
    border:none;
    cursor:pointer;
    transition: all .45s ease-in-out;
}

#eva_button06:hover{
    background-color:#252525;
}

.card #eva_button06{
    background-color:#252525;
}

#eva_button07{
    font-family:'Titillium Web', Arial, Helvetica, sans-serif!important;
    text-align:center;
    text-decoration:none;
    width:auto;
    display:block;
    color:#FFFFFF;
    border-radius: 0.2rem;
    padding:5px;
    background-color:#706F6F;
    margin-top:1px;
    border:none;
    cursor:pointer;
    transition: all .45s ease-in-out;
}

#eva_button07:hover{
    background-color:#252525;
}

#eva_button08{
    font-family:'Titillium Web', Arial, Helvetica, sans-serif!important;
    font-size:14px;
    text-align:center;
    text-decoration:none;
    width:300px;
    display:block;
    color:#FFFFFF;
    border-radius: 0.2rem;
    padding:5px;
    background-color:#252525;
    margin-top:1px;
    border:none;
    cursor:pointer;
    transition: all .45s ease-in-out;
}

#eva_button08:hover{
    background-color:#252525;
}

#eva_button09{
    font-family:'Titillium Web', Arial, Helvetica, sans-serif!important;
    text-align:center;
    text-decoration:none;
    width:auto;
    display:block;
    color:#FFFFFF;
    border-radius: 0.2rem;
    padding:5px;
    background-color:#252525;
    margin-top:1px;
    border:none;
    cursor:pointer;
    transition: all .45s ease-in-out;
}

#eva_button09:hover{
    background-color:#252525;
}

#eva_button10{
    font-family:'Titillium Web', Arial, Helvetica, sans-serif!important;
    font-size:14px;
    border:none;
    text-align:center;
    border-radius: 0.2rem;
    text-decoration:none;
    width:104px;
    display:block;
    color:#FFFFFF;
    padding:5px;
    background-color:#ff600f;
    margin-top:1px;
    cursor:pointer;
    transition: all .45s ease-in-out;
}

#eva_button10:hover{
    background-color:#252525;
}

#formulars{
    float:left;
}

table.formular{
    width:100%;
    padding:10px 10px 10px 10px;
}

.formular td{
    height:30px;
}

.button {
    display: inline-block;
    padding: 1px 12px;
    margin-bottom: 0;
    font-weight: 400;
    line-height: 1.42857143;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px;
    text-shadow: 0 -1px 0 rgba(0,0,0,.2);
    -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 1px 1px rgba(0,0,0,.075);
    text-overflow: ellipsis;
    overflow: hidden;
}

.button.grey {
    color: #000;
    background-image: -webkit-linear-gradient(top,#fff 0,#e0e0e0 100%);
    background-image: -o-linear-gradient(top,#fff 0,#e0e0e0 100%);
    background-image: -webkit-gradient(linear,left top,left bottom,from(#fff),to(#e0e0e0));
    background-image: linear-gradient(to bottom,#fff 0,#e0e0e0 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffe0e0e0', GradientType=0);
    filter: progid:DXImageTransform.Microsoft.gradient(enabled=false);
    background-repeat: repeat-x;
    border-color: #f1f1f1;
    border-color: #ccc;
    text-shadow: 0 1px 0 #fff;
}

.btn {
    cursor: pointer;
}

.btn.akte{
    background: #252525;
    border-color: #252525;
    color: #fff;
    height: fit-content;
    font-weight: 600;
    border-radius: 0.25rem;
}

.btn.round{
    border-radius: 100%;
    width: 2rem;
    height: 2rem;
    font-size:1rem;
}

.btn.akte img{
    margin: 0;
}

.btn.akte:hover{
    background: #ff600f;
    border: 1px solid #ff600f;
    color: #fff;
}

.btn.akte .bg-danger{
    background-color: #ff600f!important;
}

.btn.white,
.select-button{
    background: #ff600f;
    color: #fff;
    padding: 0.25rem 0.5rem;
    border-radius: 0.2rem;
    font-size: 14px;
    height: fit-content;
    border: 1px solid #ff600f;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.btn.white.akte{
    padding: 0.37rem 0.5rem;
    font-size: 1rem;
    font-weight: 600;
    background: #252525;
    border-color: #252525;
}


.btn.white.deactivated,
.btn.black.deactivated{
    opacity: 0.3;
    cursor: not-allowed;
}
.btn.white.deactivated:hover{
    background: #ff600f;
    color: #fff;
    opacity: 0.3;
    border: none;
}

.btn.black{
    background: #000;
    color: #fff;
    padding: 0.25rem 0.5rem;
    border-radius: 0.2rem;
    height: fit-content;
    border: 1px solid #000;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.btn.black.deactivated:hover{
    background: #000;
    color: #fff;
    border: none;
    opacity: 0.3;
}


.eva_list_element .btn.white{
    display: inline-block;
}

input[type="file"]::file-selector-button {
    background: #ff600f;
    color: #fff;
    padding: 0.5rem;
    font-size: 14px;
    border-radius: 0.2rem;
    border: 1px solid #ff600f;
    transition: background-color 0.3s ease, color 0.3s ease;
}

input[type="file"]::file-selector-button:hover {
    background-color: #fff;
    border: 1px solid #f1f1f1;
    color: #ff600f;
}

.dataupload-container{
    background-color: #fff;
    border: 1px solid #f1f1f1;
    border-radius: 0.2rem;
    padding: 0.8rem;
}

.dataupload-container.new-order {
    padding: 1.2rem 0.8rem;
}

.dataupload-container.damage{
    box-sizing: border-box;
    padding: 10px;
    width: calc(25% - 1rem);
}

.btn.inactive{
    opacity: 0.5;
    cursor: not-allowed;
}

.btn.grey{
    background: #706F6F;
    color: #fff;
    padding: 0.2rem 0.5rem;
    border-radius: 0.2rem;
    border: 1px solid #706F6F;
    line-height: 2rem;
    transition: background-color 0.3s ease, color 0.3s ease;
}

.btn.white:hover,
.btn.black:hover,
.btn.grey:hover,
.select-button:hover {
    background-color: #fff;
    border: 1px solid #f1f1f1;
    color: #ff600f;
}

/* Flatpickr Anpassungen */
.flatpickr-calendar {
    background: white;
    border: 1px solid #ccc;
    border-radius: 8px;
    font-family: sans-serif;
    padding: 8px;
    width: auto;
}
.flatpickr-day.today {
    background: #e0f7fa;
}

.flatpickr-calendar.arrowTop:before,
.flatpickr-calendar.arrowTop:after{
    display: none;
}

.flatpickr-time input{
    border:none;
}

.datepicker-wrapper {
    position: relative;
    display: inline-block;
    width: fit-content;
}

.datepicker-wrapper input.datepicker {
    padding-right: 26px; /* Platz für das Icon */
    box-sizing: border-box;
    height: 28px;
}

.calendar-icon {
    position: absolute;
    right: 6px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    pointer-events: auto;
    z-index: 2;
}

/* iPhone/Safari: readonly/flatpickr Input nicht blau einfärben */
.datepicker-wrapper .flatpickr-input,
.datepicker-wrapper .flatpickr-input[readonly]{
    color: #000 !important;                 /* oder deine Standard-Textfarbe */
    -webkit-text-fill-color: #000 !important; /* iOS Safari entscheidend */
    opacity: 1 !important;                  /* falls readonly ausgegraut wird */
}

/* Datepicker-Wrapper: flex + min-width fix */
.datepicker-wrapper{
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    min-width: 0;
}

.datepicker-wrapper .flatpickr-input{
    -webkit-appearance: none;
    appearance: none;
}

/* Input darf schrumpfen und nimmt 100% */
.datepicker-wrapper .flatpickr-input{
    flex: 1 1 auto;
    min-width: 0;
    width: 100%;
    padding-right: 2rem; /* Platz fürs Icon */
    height: 1.8rem;
}

/* Icon aus dem Layoutfluss nehmen */
.datepicker-wrapper .calendar-icon{
    position: absolute;
    right: .5rem;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none;
}

.flatpickr-calendar{
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif!important;
}

.flatpickr-day.selected,.flatpickr-day.today.selected, .flatpickr-day.startRange,.flatpickr-day.endRange,.flatpickr-day.selected.inRange,.flatpickr-day.startRange.inRange,.flatpickr-day.endRange.inRange,.flatpickr-day.selected:focus,.flatpickr-day.startRange:focus,.flatpickr-day.endRange:focus,.flatpickr-day.selected:hover,.flatpickr-day.startRange:hover,.flatpickr-day.endRange:hover,.flatpickr-day.selected.prevMonthDay,.flatpickr-day.startRange.prevMonthDay,.flatpickr-day.endRange.prevMonthDay,.flatpickr-day.selected.nextMonthDay,.flatpickr-day.startRange.nextMonthDay,.flatpickr-day.endRange.nextMonthDay {
    background: #ff600f;
    -webkit-box-shadow: none;
    box-shadow: none;
    color: #fff;
    border-color: #ff600f
}

.flatpickr-day.today:hover, .flatpickr-day.today:focus,.flatpickr-day.today {
    border-color: rgba(255,96,15,0.5);
    background: rgba(255,96,15,0.5);
    color: #fff;
}

.flatpickr-day.inRange, .flatpickr-day.prevMonthDay.inRange, .flatpickr-day.nextMonthDay.inRange, .flatpickr-day.today.inRange, .flatpickr-day.prevMonthDay.today.inRange, .flatpickr-day.nextMonthDay.today.inRange, .flatpickr-day:hover, .flatpickr-day.prevMonthDay:hover, .flatpickr-day.nextMonthDay:hover, .flatpickr-day:focus, .flatpickr-day.prevMonthDay:focus, .flatpickr-day.nextMonthDay:focus {
    cursor: pointer;
    outline: 0;
    background: rgba(255,96,15,0.5);
    border-color: rgba(255,96,15,0.5);
}

.flatpickr-current-month .flatpickr-monthDropdown-months,
.flatpickr-current-month input.cur-year{
    font-weight: 600;
}

.flatpickr-current-month .flatpickr-monthDropdown-months{
    text-align: right;
}

.custom-checkbox-wrapper {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    cursor: pointer;
    user-select: none;
    font-weight: 500;
    width: 100%;
}

.custom-checkbox-wrapper input[type="checkbox"] {
    opacity: 0;
    position: absolute;
    width: 24px;
    height: 24px;
    cursor: pointer;
    margin: 0;
}

.checkbox-box {
    width: 28px;
    height: 28px;
    border: 2px solid #ff600f;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.3s ease, border-color 0.3s ease;
    margin: auto;
}

.checkmark {
    width: 16px;
    height: 16px;
    stroke: white;
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
    fill: none;
    stroke-dasharray: 20;
    stroke-dashoffset: 20;
    transition: stroke-dashoffset 0.3s ease;
    opacity: 0;
}

.custom-checkbox-wrapper input[type="checkbox"]:checked + .checkbox-box {
    background-color: #ff600f;
    border-color: #ff600f;
}

.custom-checkbox-wrapper input[type="checkbox"]:checked + .checkbox-box .checkmark {
    stroke-dashoffset: 0;
    opacity: 1;
}

.form-label{
    font-weight: 600;
}

.form-check-input:checked {
    background-color: #ff600f;
    border-color: #ff600f;
}

.form-check-input:focus {
    border-color: #ff600f;
    outline: 0;
    box-shadow: 0 0 0 .25rem rgba(255, 96, 15, .25);
}

.input-group .btn {
    position: relative;
    z-index: 2;
    padding: 0 0.5rem;
    min-height: 1.85rem;
}

.input-group .btn.btn-secondary{
    background-color:#ff600f;
    border-color:#ff600f;
    color:#fff;
}

.input-group .btn.btn-secondary:hover{
    background-color:#6c757d;
    border-color:#6c757d;
    color:#fff;
}

.input-group .btn-outline-secondary{
    border-color:#ff600f;
    color:#ff600f;
}

.input-group .btn-outline-secondary:hover{
    border-color:#6c757d;
    color:#fff;
}

.input-group .btn-outline-secondary.red:hover{
    background-color:#c5153a;
    border-color:#c5153a;
    color:#fff;
}

.form-floating>.form-control,
.form-floating>.form-control-plaintext {
    padding: 0.5rem 0.5rem;
}

.form-floating>.form-control-plaintext:focus,
.form-floating>.form-control-plaintext:not(:placeholder-shown),
.form-floating>.form-control:focus,
.form-floating>.form-control:not(:placeholder-shown) {
    padding-top: 1.2rem;
    padding-bottom: 0.3rem;
}

.form-floating> textarea.form-control,
.form-floating> textarea.form-control:not(:placeholder-shown){
    padding-top: 1.5rem;
}

.form-floating>.form-control,
.form-floating>.form-control-plaintext,
.form-floating>.form-select,
.form-floating>.btn{
    height: calc(2.8rem + calc(var(--bs-border-width) * 2));
    min-height: calc(2.8rem + calc(var(--bs-border-width) * 2));
}

.form-floating>label {
    padding: 0.8rem .5rem;
}

.form-floating>.form-select {
    padding-top: 1.2rem;
    padding-bottom: .3rem;
    padding-left: .5rem;
}

#vehiclesTransferFilters .form-floating,
#vehicleNewForm .form-floating,
#collectiveInvoicesFilters .form-floating,
#clientFilters .form-floating,
#contractsFilters .form-floating,
#dokuImportFilters .form-floating,
#stornoInvoicesFilters .form-floating,
#ankaufInvoicesFilters .form-floating,
#allInvoicesFilters .form-floating,
#vehiclesFilters .form-floating,
#allInvoicesFilters .form-floating,
#advertiseVehiclesFilters .form-floating,
#purchaseInvoicesFilters .form-floating,
#cancelledInvoicesFilters .form-floating,
.filterLists .form-floating {
    flex: 1;
}

@media (max-width: 992px) {
    #vehiclesTransferFilters .form-floating,
    #vehicleNewForm .form-floating,
    #collectiveInvoicesFilters .form-floating,
    #clientFilters .form-floating,
    #contractsFilters .form-floating,
    #dokuImportFilters .form-floating,
    #stornoInvoicesFilters .form-floating,
    #ankaufInvoicesFilters .form-floating,
    #allInvoicesFilters .form-floating,
    #vehiclesFilters .form-floating,
    #allInvoicesFilters .form-floating,
    #advertiseVehiclesFilters .form-floating,
    #cancelledInvoicesFilters .form-floating,
    #purchaseInvoicesFilters .form-floating,
    .filterLists .form-floating {
        flex: 1 1 150px;
    }
}

.form-floating>.datepicker-wrapper~label,
.form-floating>.datepicker-wrapper:focus~label,
.form-floating>.datepicker-wrapper:not(:placeholder-shown)~label{
    transform: scale(.85) translateY(-.5rem) translateX(.15rem);
}

.form-floating>.datepicker-wrapper input.datepicker{
    padding-top: 1.2rem;
    padding-bottom: .3rem;
    padding-left: .75rem;
}

.form-floating > input[type="file"] {
    line-height: 1;
    padding-top: 0.8rem !important;
    padding-left: 1.2rem;
}

.flatpickr-mobile[type="date"]{
    background-color: #fff !important;
    color: #000;
    -webkit-appearance: none;
    appearance: none;
}

.flatpickr-mobile[type="date"]::-webkit-date-and-time-value{
    background-color: #fff;
    color: #000;
}

.flatpickr-mobile[type="date"]::-webkit-textfield-decoration-container{
    background-color: #fff;
}

.flatpickr-mobile[type="date"]{
    opacity: 1 !important;
}

.dataTable .dt-copy-cell .btn-copy {
    padding: 0;
}

.form-floating .input-group,
.form-floating .datepicker{
    height: calc(2.8rem + calc(var(--bs-border-width) * 2));
    min-height: calc(2.8rem + calc(var(--bs-border-width) * 2));
}

.extra-costs input[type="text"]{
    width: 100%!important;
}

.btn {
    --bs-btn-line-height: 1;
}

.btn-primary {
    --bs-btn-bg: #ff600f;
    --bs-btn-border-color: #ff600f;
    --bs-btn-hover-bg: #ff600f;
    --bs-btn-hover-border-color: #ff600f;
    --bs-btn-active-bg: #ff600f;
    --bs-btn-active-border-color: #ff600f;
    --bs-btn-disabled-bg: #ff600f;
    --bs-btn-disabled-border-color: #ff600f;
}

.btn-outline-primary{
    --bs-btn-color: #ff600f;
    --bs-btn-border-color: #ff600f;
    --bs-btn-hover-bg: #ff600f;
    --bs-btn-hover-border-color: #ff600f;
    --bs-btn-active-bg: #ff600f;
    --bs-btn-active-border-color: #ff600f;
    --bs-btn-disabled-color: #ff600f;
    --bs-btn-disabled-border-color: #ff600f;
}

#downloadForm .btn-primary{
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif !important;
    text-align: center;
    text-decoration: none;
    width: auto;
    font-size: 14px;
    display: block;
    color: #FFFFFF;
    border-radius: 0.2rem;
    background-color: #ff600f;
    margin-top: 1rem;
    cursor: pointer;
    margin-bottom: 1rem;
    border: 1px solid #ff600f;
    transition: all .45s
    ease-in-out;
    margin: 5px;
}

#downloadForm .eva_button02 img{
    width: 1rem;
    margin-bottom: 0.2rem;
}

#downloadForm .btn-outline-primary{
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif !important;
    text-align: center;
    text-decoration: none;
    width: auto;
    font-size: 14px;
    display: block;
    border-radius: 0.2rem;
    margin-top: 1rem;
    cursor: pointer;
    margin-bottom: 1rem;
    border: 1px solid #ff600f;
    transition: all .45s
    ease-in-out;
    margin: 5px;
}

.btn-primary {
    background-color: #ff600f;
    border-color: #ff600f;
    padding: 0.5rem;
    color: #fff;
    border-radius: 0.25rem;
}

.btn-secondary{
    padding: 0.5rem;
    border-radius: 0.25rem;
}

.btn-primary,
.btn-secondary,
.btn-success,
.btn-danger,
.btn-warning,
.btn-info,
.btn-light,
.btn-dark,
.btn-link{
    padding: 0.5rem;
    font-size: 14px;
}

#documentYes:checked + .form-check-label,
#repaymentYes:checked + .form-check-label {
    background-color: #f1f1f1;
    border-radius: 0.375rem 0.375rem 0 0;
    padding-right: 0.4rem;
}

.form-check:has(#documentYes:checked),
.form-check:has(#repaymentYes:checked){
    background-color: #f1f1f1;
    border-radius: 0.375rem 0.375rem 0 0;
}

.trash-checkbox {
    display: none;
}

.trash-label {
    cursor: pointer;
    position: relative;
    display: inline-block;
    width: 24px;
    height: 24px;
}

.trash-label.damages .icon-open{
    position: relative;
}

.trash-label img {
    width: 100%;
    height: auto;
    display: block;
}

.trash-label .icon-open {
    display: none;
    position: absolute;
    top: 0;
    left: 0;
}

.trash-checkbox:checked + .trash-label .icon-closed {
    display: none;
}

.trash-checkbox:checked + .trash-label .icon-open {
    display: block;
}

.uploads-container {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.uploads-container .upload-card {
    background: #fff;
    border-radius: 0.25rem;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    border:1px solid #f1f1f1;
    padding: 20px;
    width: 300px;
    display: flex;
    flex-direction: column;
    gap: 15px;
}

.uploads-container .card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.uploads-container .trash-container {
    position: relative;
    cursor: pointer;
}

.uploads-container .trash-label img {
    width: 24px;
    height: 24px;
    transition: transform 0.2s;
}

.uploads-container .trash-checkbox:checked + .trash-label .icon-closed { display: none; }
.uploads-container .trash-checkbox:checked + .trash-label .icon-open { display: inline; }

.uploads-container .file-input {
    width: 100%;
    padding: 8px;
    border-radius: 6px;
    border: 1px solid #ccc;
}

.uploads-container .file-select {
    margin-top: 10px;
    width: 100%;
    padding: 6px;
    border-radius: 6px;
    border: 1px solid #ccc;
}

.uploads-container .card-fields input,
.uploads-container .card-fields select,
.uploads-container .card-fields textarea,
.uploads-container .upload-fields input,
.uploads-container .upload-fields select,
.uploads-container .upload-fields textarea {
    width: 100% !important;
}

.uploads-container .gallery-image {
    width: 100%;
    border-radius: 0.25rem;
    margin-bottom: 10px;
    transition: transform 0.2s;
}
input-group .btn
.uploads-container .gallery-image:hover {
    transform: scale(1.05);
}

.uploads-container .upload-actions {
    display: flex;
    justify-content: flex-end;
}

.uploads-container .submit-btn {
    padding: 8px 15px;
    background: #007bff;
    color: #fff;
    border-radius: 6px;
    text-decoration: none;
    font-weight: 600;
    transition: background 0.2s;
}

.uploads-container .submit-btn:hover {
    background: #0056b3;
}

@media(max-width: 650px) {
    .uploads-container .upload-card {
        width: 100%;
    }
}

.tires select{
    width:100%;
}

.add-client input,
.add-client select,
.customer_details input[type="text"],
.customer_details select{
    width: 100%;
    box-sizing: border-box;
}

#customer-search-form div{
    flex: 1 1 auto !important;
}

#supplier-search-form label,
#customer-search-form label{
    display: block;
}

#search-results,
#customer-search-form {
    display: flex;
    flex-wrap: wrap !important;
    gap: 1rem;
}

.search-result {
    padding: 1rem;
    border: 1px solid #ccc;
    flex: 1 1 auto !important;
    border-radius: 0.2rem;
}

.img-preview-box img {
    max-width: 100px !important;
}



.filter-date-group {
    flex-wrap: nowrap;
    align-items: stretch;
}

.filter-date-group > .form-floating {
    position: relative;
    flex: 0 0 auto;
}

.filter-date-group > .form-floating:not(:first-child) {
    margin-left: -1px;
}

.filter-date-group > .form-floating > .form-control,
.filter-date-group > .form-floating > .form-select {
    border-radius: 0;
    position: relative;
}

.filter-date-group > .form-floating:first-child > .form-control,
.filter-date-group > .form-floating:first-child > .form-select {
    border-top-left-radius: var(--bs-border-radius);
    border-bottom-left-radius: var(--bs-border-radius);
}

.filter-date-group > .form-floating:last-child > .form-control,
.filter-date-group > .form-floating:last-child > .form-select {
    border-top-right-radius: var(--bs-border-radius);
    border-bottom-right-radius: var(--bs-border-radius);
}

.filter-date-group > .form-floating:nth-child(1) {
    width: 180px;
}

.filter-date-group > .form-floating:nth-child(2),
.filter-date-group > .form-floating:nth-child(3) {
    width: 140px;
}

/* mobil: ganze gruppe 100% */
@media (max-width: 767.98px) {
    .filter-date-group {
        width: 100%;
    }

    .filter-date-group > .form-floating {
        flex: 1 1 0;
        width: auto !important;
        min-width: 0;
    }
}

.img-preview-box img {
    max-width: 100px !important;
}


.form-floating > select[multiple].form-select {
    height: 140px;
    padding-top: 2.1rem;
    padding-bottom: .625rem;
}

.form-floating > select[multiple].form-select ~ label {
    top: .09rem;
    left: 0.3rem;
    transform: none;
    z-index: 3;
    background: var(--bs-body-bg);
    padding: 0.3rem .35rem;
    height: auto;
    font-size: 12px;
    opacity: 1;
    width: auto;
    max-width: calc(100% - 1.5rem);
    pointer-events: none;
}

@media (max-width: 767.98px) {
    .form-floating.language-wrap{
        flex: 0 0 100%;
        width: 100%;
        max-width: 100%;
    }
    .language-wrap .form-select {
        width: 100%;
    }
}

@media (max-width: 576px) {
    .form-floating.language-wrap > select[multiple].form-select {
        height: 60px !important;
        min-height: 60px;
    }
}



.protocol-wrapper {
    position: relative;
    display: inline-flex;
    align-items: center;
}

.protocol-popover {
    position: absolute;
    display: none;
    z-index: 99999;
}

.protocol-popover.active {
    display: block;
}

.protocol-popover.is-right {
    top: 50%;
    left: calc(100% + 10px);
    right: auto;
    transform: translateY(-50%);
}

.protocol-popover.is-left {
    top: 50%;
    left: auto;
    right: calc(100% + 10px);
    transform: translateY(-50%);
}

.protocol-popover.is-bottom {
    top: calc(100% + 12px);
    left: 50%;
    right: auto;
    transform: translateX(-50%);
}

.protocol-card {
    position: relative;
    width: 360px;
    max-width: calc(100vw - 32px);
    background: #fff;
    border: 2px solid #ff7a00;
    border-radius: 16px;
    padding: 20px 18px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
    box-sizing: border-box;
}

.protocol-arrow {
    position: absolute;
    width: 16px;
    height: 16px;
    background: #fff;
    z-index: 2;
}

.protocol-popover.is-right .protocol-arrow {
    left: -8px;
    top: 50%;
    border-left: 2px solid #ff7a00;
    border-bottom: 2px solid #ff7a00;
    transform: translateY(-50%) rotate(45deg);
}

.protocol-popover.is-left .protocol-arrow {
    right: -8px;
    top: 50%;
    border-right: 2px solid #ff7a00;
    border-top: 2px solid #ff7a00;
    transform: translateY(-50%) rotate(45deg);
}

.protocol-popover.is-bottom .protocol-arrow {
    top: -8px;
    left: 50%;
    border-left: 2px solid #ff7a00;
    border-top: 2px solid #ff7a00;
    transform: translateX(-50%) rotate(45deg);
}

.protocol-title {
    margin: 0 30px 16px 0;
    font-size: 18px;
    font-weight: 700;
    color: #222;
}

.protocol-close {
    position: absolute;
    top: 8px;
    right: 10px;
    border: 0;
    background: transparent;
    font-size: 22px;
    cursor: pointer;
    color: #666;
    line-height: 1;
}

.protocol-checklist {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 18px;
}

.protocol-checklist label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    color: #333;
}

.protocol-field {
    margin-bottom: 14px;
}

.protocol-field label {
    display: block;
    margin-bottom: 6px;
    font-weight: 600;
    font-size: 14px;
    color: #333;
}

.protocol-field select,
.protocol-field input {
    width: 100%;
}

.protocol-block {
    margin: 18px 0 16px;
    padding: 14px;
    border: 1px solid #eee;
    border-radius: 12px;
    background: #fafafa;
}

.protocol-block img {
    width: 120px;
    height: 120px;
    display: block;
    margin: 0 auto 10px;
    max-width: 100%;
}

.protocol-text {
    font-weight: 700;
    margin-bottom: 6px;
}

.protocol-print-link,
.protocol-footer a {
    text-decoration: none;
    font-weight: 600;
}

.protocol-print-link:hover,
.protocol-footer a:hover {
    text-decoration: underline;
}

.protocol-footer {
    font-size: 14px;
    line-height: 1.5;
    color: #333;
}

#imageUploadBox {
    width: 50px;
    height: 35px;
    border: 2px dashed #ccc;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    font-size: 20px;
    color: #999;
    transition: 0.2s;
}

#imageUploadBox:hover {
    border-color: #666;
    color: #666;
}

#imagePreview {
    width: 50px;
    height: 35px;
    object-fit: cover;
    border-radius: 4px;
    cursor: pointer;
}

@media (max-width: 767px) {
    .protocol-popover.is-right,
    .protocol-popover.is-left,
    .protocol-popover.is-bottom {
        top: calc(100% + 12px);
        left: 50%;
        right: auto;
        transform: translateX(-50%);
    }

    .protocol-popover.is-right .protocol-arrow,
    .protocol-popover.is-left .protocol-arrow,
    .protocol-popover.is-bottom .protocol-arrow {
        top: -8px;
        left: 50%;
        right: auto;
        border-right: 0;
        border-bottom: 0;
        border-left: 2px solid #ff7a00;
        border-top: 2px solid #ff7a00;
        transform: translateX(-50%) rotate(45deg);
    }

    .protocol-card {
        width: min(360px, calc(100vw - 24px));
        max-width: calc(100vw - 24px);
        max-height: none;
        overflow: visible;
        padding: 18px 16px;
        border-radius: 14px;
    }
}

@media (max-width: 480px) {
    .protocol-card {
        width: calc(100vw - 16px);
        max-width: calc(100vw - 16px);
        padding: 16px 14px;
    }

    .protocol-checklist label,
    .protocol-field label,
    .protocol-footer {
        font-size: 13px;
    }

    .protocol-block img {
        width: 100px;
        height: 100px;
    }
}

.trash-checkbox {
    display: none;
}

.trash-checkbox {
    display: none;
}

.delete-trash {
    cursor: pointer;
    color: #ff600f;
    font-size: 28px;
    line-height: 1;
}

.trash-checkbox:checked + .delete-trash {
    color: red;
}

.workshop-status{
    padding: 0.10rem 0.5rem;
    border-radius: 0.25rem;
    display: block;
    text-align: center;
    color: #fff!important;
}

.workshop-status.open{
    color: #c5153a;
    background: rgba(197,21, 58,0.8);
    border: 2px solid #c5153a;
}

.workshop-status.in-progress{
    color: #006095;
    background: rgba(0,96, 149,0.8);
    border: 2px solid #006095;
}

.workshop-status.completed{
    color: #00863c;
    background: rgba(0,134, 60,0.8);
    border: 2px solid #00863c;
}

.img-preview-box img {
    max-width: 100px !important;
}