﻿/*!
 * WellFrame Web Library
 *
 * Copyright (©) Wellcode Software owned by Khamis Abuelkomboz
 *
 * ALL RIGHTS RESERVED, see http://wellcode.de
 *
 */
:root {
    --wf-color-illness: #FF3366;
    --wf-color-done: #21b7ff;
    --wf-color-ordering: aliceblue;
    --wf-color-planing: #c3c1c1;
    --wf-color-progress: #fcff00;
    --wf-color-canceled: #ff6767;
    --wf-color-ready: #51f268;
    --wf-color-parking: #f8acf7;
    --wf-color-pause: #f8acf7;
    --wf-color-other: #f5f5f5;
    --wf-color-completed: #21b7ff;
    --wf-color-free: #51f268;
    --wf-color-confirmed: #7fe300;
    --wf-color-busy: #fcff00;
    --wf-color-toobusy: #ff8500;
    --wf-color-nocars: lightgray;
    --wf-color-present: #2B8ACA;
    --wf-color-delay: magenta;
    --wf-color-worktime: lightgray;
    --wf-color-selection: royalblue;
    --wf-color-disposable: #f3f3f3;
    --wf-color-disposition: black;
    --wf-color-invoicing: antiquewhite;
    --wf-color-crediting: lemonchiffon;
    --wf-color-collective: #5dbc8a;
}


.Disposition-table {
    width: 100%;
}

.Disposition-table .left {
    overflow: auto;
    border: 1px solid gray;
    vertical-align: top;
}


.Disposition-table .right-column {
    overflow: auto;
    border: 1px solid gray;
}

.Disposition-table tr td {
    padding: 5px 0px 5px 0px;
}

.Disposition-table .itemstable-body-tr:hover {
    background-color: unset;
}

.Disposition-table .itemstable-body-tr.odd:hover {
    background-color: var(--wf-odd-bgcolor);
}

.dispominilist {
    overflow: auto;
    width: 180px;
    min-height: 180px;
}

.dispominilist .itemtemplate {
    margin: 1px;
    border-radius: 2px;
    padding: 3px;
}

.dispominilist .item {
    padding: 1px;
}

.dispominilist .item-a {
    top: 1px;
    overflow: hidden;
    width: 20px;
    height: 20px;
}

.dispominilist .item-overlay {
    left: 0px;
    top: 0px;
    overflow: auto;
    padding: 1px;
}

.dispominilist .item-overlay .item-VTitle {
    position: relative;
    padding: 1px;
    margin: 0px;
    overflow: hidden;
}

.dispominilist .item-overlay .item-VContent {
    white-space: normal;
    font-size: smaller;
    display: none;
}

.DriverInfo-container.dispominilist button.item-a .item-image {
    height: 100%;
    width: 100%;
    padding: 0px;
}

.dispominilist h2 {
    font-size: smaller;
}

.dispominilist h4 {
    display: none;
}

.dispominilist h5 {
    font-size: smaller;
    font-weight: normal;
    margin: 0px;
}

.dispominilist .OrderBook-item .vitems {
    display: none;
}

.Disposition-table h2 {
    font-size: smaller;
}

.Disposition-table h4 {
    font-size: small;
    font-weight: normal;
}

.Disposition-table h5 {
    font-size: small;
    font-weight: normal;
}

.Disposition-table .field-value {
    font-size: smaller;
}

.Disposition-table .itemstemplate.Tour-items {
    width: 100%;
    overflow: auto;
}

.Disposition-table .itemstemplate.Tour-items .Tour-item {
    float: left;
}

.Disposition-table .itemtemplate {
    margin: 0px;
}

.Disposition-table .itemtemplate {
    min-height: unset;
}

.disposable-item {
    background-color: var(--wf-color-disposable);
}

.Disposition-item .item-a {
    width: 20px;
    height: 20px;
}

.Disposition-item .item-a {
    display: none;
}

.Disposition-item .item-VTitle,
.Disposition-item .item-VSubtitle,
.Disposition-item .item-VDescription {
    white-space: nowrap;
}

.Disposition-table .itemstable-image-td {
    display: none;
}

.Disposition-table #header-VehicleName {
    padding-left: 2px;
}

.Disposition-table .td-VehicleName,
#header-VehicleName,
.Disposition-table .Disposition-item {
    width: 200px;
    min-width: 200px;
    vertical-align: middle;
}

.Disposition-item,
.Disposition-table .itemtemplate {
    overflow: hidden;
}

.Disposition-table td {
    border-color: gray;
    border-top-width: 1px;
}


.disposition .itemstable-image-td {
    width: 27px;
}

.setuppage .fieldtemplate-Memo {
    width: auto;
}

.disposition .DriverInfo-item .item-VSubtitle {
    display: none;
}


.disposition .item {
    border: 0px;
}

.td-Tour,
.td-Status {
    white-space: nowrap;
}

.disposition-page {
    position: relative;
    top: auto;
    left: auto;
    width: auto;
}

.disposition-page .inputfield {
    width: auto;
}


.td-Dispositions {
    width: 100%;
}

.td-Dispositions h2 {
    color: var(--wf-color-disposition);
}


.td-Dispositions .item-a {
    position: relative;
    top: 2px;
    left: 1px;
    z-index: auto;
    overflow: auto;
}

.td-Dispositions .item-a {
    width: 24px;
    height: 24px;
    overflow: hidden;
}

.td-Dispositions .item-overlay {
    height: calc(100% - 2px);
}

.td-Dispositions .item-overlay .item-VTitle,
.td-Dispositions .item-overlay .item-VSubtitle {
    position: relative;
    /*width: calc(100% - 36px);*/
    overflow: hidden;
    white-space: nowrap;
}

.td-Dispositions .tour-other .item-a {
    display: none;
}

.td-Dispositions .tour-other .item-VTitle {
    position: relative;
    left: auto;
    width: auto;
}

.DispositionInput-page {
    position: relative;
    top: auto;
    left: auto;
    width: auto;
    /*background-color: #f3f3f3;*/
}

.DispositionInput-page .inputfield {
    min-width: unset;
    width: unset;
}

.DispositionInput-page .field-NumberDays {
    width: 100px;
}

.DispositionInput-page .field-DateTime {
    max-width: 200px;
}

.DispositionInput-page .fieldtemplate-Find {
    width: 280px;
    min-width: unset;
}

.DispositionInput-page .editpage-fields {
    width: auto;
    height: auto;
}

.DispositionInput-page .editpage-commands {
    width: auto;
}

.Disposition-table {
    overflow-y: scroll;
}

.Disposition-table,
.disposition-column {
    border: 0px;
    width: 100%;
}

.Disposition-table .itemtemplate {
    margin: 0px;
    /*border: 1px solid gray;*/
    border-radius: 0px;
    float: left;
    height: 100%;
}

.Disposition-table tbody .itemtemplate:hover {
    cursor: pointer;
    border-color: var(--wf-hover-color);
}


.Disposition-table tbody tbody .Tour-item,
.Disposition-table tbody tbody .Tour-item .item-overlay {
    min-height: 40px;
    height: 100%;
}

.Disposition-table .Tour-item,
.Disposition-table .Tour-item .item-table .item-overlay {
    max-height: 120px;
    min-height: 50px;
}

/*.disposition .Tour-item .item-VSubtitle,*/
.Disposition-table .Tour-item .item-VDescription,
.Disposition-table .Tour-item .item-VContent {
    display: none;
}

#header-Dispositions {
    width: 100%;
}

#header-Dispositions .item-a,
#header-Dispositions .item-VSubtitle {
    display: none;
}

#header-Dispositions .Tour-item {
    float: left;
    border: 1px solid gray;
    border-radius: 0px;
    min-height: unset;
    padding-top: 2px;
    padding-bottom: 2px;
    overflow: hidden;
}

#header-Dispositions {
    border: 0px;
    padding: 0px;
}

#header-Dispositions {
    /*border: 1px solid lightgray;*/
    width: 100%;
    overflow-y: scroll;
}

#disposition-listing {
    display: block;
    overflow-y: scroll;
    width: calc(100% - 2px);
}

#header-Dispositions .Tour-item .item,
#header-Dispositions .Tour-item .item .item-overlay {
    min-height: unset;
    padding: 0px;
    margin: 0px;
}

.Disposition-table thead .itemtemplate h2,
.Disposition-table thead .itemtemplate h4,
.Disposition-table thead .itemtemplate h5 {
    overflow: hidden;
    font-size: small;
}

.Disposition-table .item,
.Disposition-table .item-overlay {
    padding: 0px;
    height: 100%;
}

.Disposition-table .itemtemplate h2,
.Disposition-table .itemtemplate h4,
.Disposition-table .itemtemplate h5 {
    overflow: hidden;
}

.OrderPosition-table .td-Name {
    white-space: nowrap;
}

.tours-dialogbox {
    max-width: 800px;
    max-height: 70%;
}

.Disposition-table .itemtemplate .item-VContent {
    white-space: normal;
    overflow: hidden;
    display: none;
}

.Disposition-table tr.sums td.td-VehicleName,
.Disposition-table tr.sums .td-Dispositions,
.Disposition-table tr.sums .td-Dispositions .Tour-item,
.Disposition-table tr.sums .td-Dispositions .Tour-item .item-overlay {
    padding: 0px;
    min-height: 30px;
}

.Disposition-table tr.sums .td-Dispositions .Tour-item .item-overlay .item-VTitle {
    text-align: center;
}
.Disposition-table tr.sums .td-VehicleName .item-overlay .item-VSubtitle {
    display: none;
}
.Disposition-table tr.sums {
    background-color: var(--wf-color-crediting);
}

.tour-done {
    color: black;
    background: linear-gradient(to right, transparent 0%, var(--wf-color-done) 100%) !important;
}

.tour-completed {
    color: black;
    background: linear-gradient(to right, transparent 0%, var(--wf-color-completed) 100%) !important;
}

.tour-planing {
    color: black;
    background: linear-gradient(to right, transparent 0%, var(--wf-color-planing) 100%) !important;
}

.tour-ordering {
    color: black;
    background: linear-gradient(to right, transparent 0%, var(--wf-color-ordering) 100%) !important;
}

.tour-progress {
    color: black;
    background: linear-gradient(to right, transparent 0%, var(--wf-color-progress) 100%) !important;
}

.tour-canceled {
    color: black;
    background: linear-gradient(to right, transparent 0%, var(--wf-color-canceled) 100%) !important;
    opacity: 0.5;
}

.tour-ready {
    position: relative;
    color: black;
    background: linear-gradient(to right, transparent 0%, var(--wf-color-free) 100%) !important;
}

.tour-confirmed {
    position: relative;
    color: black;
    background: linear-gradient(to right, transparent 0%, var(--wf-color-confirmed) 100%) !important;
}

.tour-parking, .tour-pause {
    color: black;
    background: linear-gradient(to right, transparent 0%, var(--wf-color-parking) 100%) !important;
}

.tour-other {
    /*background: linear-gradient(to right, white 0%, var(--wf-color-other) 100%);*/
    color: black;
    border-color: var(--wf-color-other);
}

.tour-otherwisedone {
    color: black;
    background: linear-gradient(to right, transparent 0%, #FFEAE8 100%) !important;
}
.tour-invoicing {
    color: black;
    background: linear-gradient(to right, transparent 0%, var(--wf-color-invoicing) 100%) !important;
}

.tour-crediting {
    color: black;
    background: linear-gradient(to right, transparent 0%, var(--wf-color-crediting) 100%) !important;
}

.tour-collective {
    color: black;
    background: linear-gradient(to right, transparent 0%, var(--wf-color-collective) 100%) !important;
}

.absense-line {
    height: 5px;
    width: 100%;
    overflow: hidden;
}

.absense-absent {
    background: var(--wf-color-illness);
}

.absense-free {
    background: var(--wf-color-free);
}

.absense-line .itemtemplate,
.absense-line .item-overlay {
    overflow: hidden;
}

.absense-line .item-a {
    display: none;
}

.driver-free {
    background: linear-gradient(to right, transparent 0%, var(--wf-color-free) 100%);
}

.driver-busy {
    background: linear-gradient(to right, transparent 0%, var(--wf-color-busy) 100%);
}

option.driver-busy {
    background: var(--wf-color-busy);
}

.driver-toobusy {
    background: linear-gradient(to right, transparent 0%, var(--wf-color-toobusy) 100%);
}

option.driver-toobusy {
    background: var(--wf-color-toobusy);
}

.driver-illness {
    background: linear-gradient(to right, transparent 0%, var(--wf-color-illness) 100%);
}

option.driver-illness {
    background: var(--wf-color-illness);
}

.driver-nocars {
    background: linear-gradient(to right, transparent 0%, var(--wf-color-nocars) 100%);
}

.driver-present {
    background: linear-gradient(to right, transparent 70%, var(--wf-color-present) 100%);
    font-style: italic;
}

.driver-delay {
    background: linear-gradient(to right, transparent 70%, var(--wf-color-delay) 100%);
}

.over-worktime {
    background: var(--wf-color-worktime);
}

.selected-order {
    background: linear-gradient(to right, aqua 0%, var(--wf-color-selection) 200%);
}

.Disposition-table .itemtemplate2 .item-a,
.dispominilist .itemtemplate2 .item-a,
.GoogleItem .itemtemplate .item-a {
    /*border: 0px;*/
    background-color: transparent;
    border: 1px solid transparent;
}

.Disposition-table .itemtemplate:hover,
.item-active:hover {
    box-shadow: 0px 0px 30px 10px lightgray;
    z-index: +1;
}

.item-active {
    box-shadow: 0px 0px 30px 10px magenta;
    border-color: darkmagenta;
}

.Find-Disposition div.title .cmd-collapse-container {
    display: none;
}

.Find-Disposition div.title .commands {
    display: none;
}

.Find-Disposition .field-DispositionInput-area {
    display: none;
}

.Find-Disposition .field-Find {
    min-width: 200px;
}

.Find-Disposition .find-fieldlist {
    max-width: 130px;
}

.Find-Disposition .field-NumberDays {
    width: 100px;
}

.Find-Disposition .field-FromDate-area .inputfield {
    width: 210px;
}

.Find-Disposition.sidelabelfield .field-FromDate-area .inputfield {
    width: 400px;
    display: flex;
}

.Find-Disposition .inputfield.inputfield-CarType {
    max-width: 200px;
}

.Find-Disposition .fieldgroup-Flags .inputfield {
    height: unset;
}

.Disposition-container.compressed .Disposition-table tr td {
    padding: 2px 0px 2px 0px;
}

.Disposition-container.compressed .itemtemplate .item-VDescription,
.Disposition-container.compressed .itemtemplate .item-VSubtitle,
.Disposition-container.compressed .itemtemplate .cmd-move {
    display: none;
}

.Disposition-container.compressed .itemtemplate,
.Disposition-container.compressed .itemtemplate .item-overlay {
    min-height: 25px;
    overflow: hidden;
}

.Disposition-table thead {
    opacity: 0.7;
}

.Disposition-table .odd {
    /*opacity: 0.9;*/
}

.timeline {
    height: 100%;
    width: 5px;
    top: 0px;
    left: 10px;
    position: absolute;
    background: coral;
    z-index: -1;
    opacity: 0.3;
    display: none;
}

/**
 * 16.7 Desktop X-Large 1403px
 */
@media screen and (min-width: 87.6875em) {
    .disposition .orders-column,
    .disposition .drivers-column {
        overflow: auto;
        width: 240px;
        min-width: 240px;
    }
}


/**
 * 17.0 Print
 */
@media print {

    html, body, div, tr, td, table {
        height: auto;
        /*width: auto;*/
        overflow: auto;
        border: 0px;
        padding: 0px;
        margin: 0px;
    }

    /*.field-value {
        page-break-inside: avoid;
    }

    .Disposition-table td,
    .Disposition-table tr {
        page-break-inside: avoid;
    }*/

    .header-area {
        display: none;
    }


    .Disposition-table {
        /*width: auto;*/
    }

    .Disposition-table .td-right {
        display: none;
    }

    .Disposition-table .right-column {
        display: none;
    }

    .Disposition-table .disposition-column,
    .Disposition-table .left {
        height: auto;
    }

    .Disposition-table,
    .Disposition-table thead,
    .Disposition-table tbody {
        position: relative;
        top: auto;
        overflow: auto;
        height: auto;
    }

    .DriverInfo-container,
    .OrderBook-container,
    .DispositionInput-page {
        display: none;
    }

    .Disposition-table .td-VehicleName,
    #header-VehicleName {
        width: 200px;
        min-width: 200px;
    }

    .printer .disposition-listing h2,
    .printer .disposition-listing h4,
    .printer .disposition-listing h5 {
        font-size: 0.6em;
    }
}

@media screen and (max-width: 640px) {

    .Disposition-table h2,
    .Disposition-table h3,
    .Disposition-table h4,
    .Disposition-table h5 {
        font-size: x-small;
    }

    #header-Dispositions {
        overflow-y: hidden;
    }

    #header-VehicleName,
    .Disposition-table .td-VehicleName,
    .Disposition-table .Disposition-item {
        width: 100px;
        min-width: 100px;
        min-height: 32px;
    }

    .Disposition-table tbody .Tour-item {
        min-height: 32px;
        height: 100%;
    }

    .Disposition-table tbody .Tour-item .item-overlay,
    .Disposition-table .Tour-item .item-table .item-overlay {
        min-height: unset;
    }

    .Disposition-table .item-VDescription {
        margin: 0px;
    }

    .dispominilist {
        width: auto;
    }
}


/*
    Disposition printing
*/
.printer #header-Dispositions .Tour-item {
    overflow: hidden;
}

.printer .disposition .Tour-item,
.printer .disposition .Tour-item .item-table .item-overlay {
    min-height: 27px;
    overflow: hidden;
}

.printer .disposition .item {
    padding: 0px;
}

.printer .disposition .item-overlay {
    padding: 0px;
}

.printer .disposition-listing .Tour-item .item-VDescription,
.printer .disposition-listing .Tour-item .item-VContent {
    display: none;
}

.printer .disposition-listing .Disposition-item {
    width: 100%;
    border: none;
}

.printer .disposition-listing h2,
.printer .disposition-listing h4,
.printer .disposition-listing h5 {
    font-weight: normal;
    font-size: 0.75em;
}

.printer .disposition h1,
.printer .disposition h2,
.printer .disposition h3,
.printer .disposition h4,
.printer .disposition h5 {
    margin: 0px;
}

.printer .disposition-listing tr td .itemtemplate:hover,
.printer .item-active:hover,
.printer .item-active {
    box-shadow: none;
}

.printer .disposition .td-VehicleName,
.printer #header-VehicleName {
    max-width: 140px;
}

.printer .VehicleDriverOccupancy-table {
    white-space: nowrap;
}