.job-price-container {display: flex; justify-content: space-between; border-bottom: 1px solid var(--main-color-border); background-color: var(--main-color-5);}

.job-special-block {display: flex;}
.job-special-item {border-right: 1px solid var(--main-color-border); padding: 10px 20px; display: flex; align-items: center;}
.job-special-item a {text-decoration: none; color: inherit;}
.job-special-box {height: 70%;display: flex;align-items: center;justify-content: center;}
.job-special-box.red {border: 1px solid red; color: red; padding: 0 20px;}
.job-commondetails-container {display: contents;}

.job-special-box.payment {width: 140px; height: 80%; background-position: center; background-size: contain; background-repeat: no-repeat;}
.job-special-box.payment-rechnung {background-image: url('../../dir.graphics/payment/zahlung_auf_rechnung.svg');}
.job-special-box.payment-paypal {background-image: url('../../dir.graphics/payment/zahlung_paypal.svg');}
.job-special-box.payment-vorkasse {background-image: url('../../dir.graphics/payment/zahlung_vorkasse.svg');}
.job-special-box.payment-sofortueberweisung {background-image: url('../../dir.graphics/payment/zahlung_sofort.svg'); background-size: 130px;}

.job-special-button { background-color: var(--main-color-spot); opacity: 0.8; color: #fff; height: 70%;padding: 0 20px;display: flex;align-items: center;justify-content: center; user-select: none; cursor: pointer;}
.job-special-button:hover { opacity: 1;}

.job-price-block {display: flex; flex-direction: column; align-items: flex-end; padding: 10px 20px; }
.job-price-block div {margin-bottom: 5px;}
.job-price-block div:last-child {margin-bottom: 0;}




.job-window {display: flex; flex-direction: column; height: 100%; font-size: 13px;}
.job-window-top {flex-grow: 1; overflow: auto; padding-bottom: 100px;}
.job-window-bottom {border-top: 1px solid var(--main-color-border);/* height: 150px;*/}
.job-window .main-table table thead tr td {font-size: 13px;}
.job-window .main-table table tbody tr td {font-size: 13px;}

.job-position-button {display: flex; justify-content: center; align-items: center; width: fit-content; height: 24px; font-size: 13px; padding: 0 20px; color: var(--main-color-spot); border: 1px solid var(--main-color-spot); user-select: none; cursor: pointer; opacity: 0.75;}
.job-position-button:hover {opacity: 1;}
.job-position-button.color-orange {border-color: orange; color:orange;}
.job-position-button.color-violet {border-color: #8142b9; color:#8142b9;}
.job-position-button.color-green {border-color: #69a600; color:#69a600;}
.job-position-button.color-blue {border-color: var(--main-color-spot); color: var(--main-color-spot);}
.job-position-button.inverted.color-orange {border-color: orange; background-color: orange; color:#fff;}
.job-position-button.inverted.color-violet {border-color: #8142b9; background-color: #8142b9; color:#fff;}
.job-position-button.inverted.color-green {border-color: #69a600; background-color: #69a600; color:#fff;}
.job-position-button.inverted.color-blue {border-color: var(--main-color-spot); background-color: var(--main-color-spot); color:#fff;}


.job-properties-frame {display: flex;}

.job-properties-container {margin-right: 50px;}
.job-properties-line {display: flex; margin-bottom: 7px;}
.job-properties-line:last-child {margin-bottom: 0;}

.job-input-count { width: 40px;height: 30px;border: 1px solid #ccc;text-align: right;padding: 0 6px;}

.job-color-container {display: flex; flex-direction: column;}
.job-color-line {display: flex; margin-bottom: 7px;}
.job-color-line:last-child {margin-bottom: 0;}
.job-color-line select {width: 350px; height: 20px; border: 1px solid #ccc;}
.job-color-number {width: 190px}
.job-color-name {width: 160px;}
.job-color-dot {width: 18px; min-width: 18px; height: 18px; min-height: 18px; border-radius: 100%; border: 2px solid #00000011;}


.job-progress-container {margin-top: 10px; border: 1px solid #ccc;}
.job-progress-container legend {padding: 0 10px;}
.job-progress-line {}

.job-cutlabel-container fieldset span:hover {cursor: pointer; text-decoration: underline;}

.job-info-box {border: 1px solid red; padding: 7px 15px; color: red; margin-bottom: 10px;}
.job-info-container textarea {border: 1px solid red; height: 32px; min-height: 32px; padding: 7px 15px; color: red; margin-bottom: 10px; width: 100%; resize: vertical; max-height: 500px;}
.job-info-container form {margin: 0; padding: 0;}


.job-details-container {display: flex; border-bottom: 1px solid var(--main-color-border); height: 146px;}

.job-details-address-container {display: flex;border-right: 1px solid var(--main-color-border);}

.job-address-container {padding: 10px 20px; position: relative; margin-right: 20px;}
.job-address-container:last-child {margin-right: 0;}
.job-address-button {position: absolute; top:14px; right:20px; width: 15px; height: 15px; opacity: 0.5; cursor: pointer; background-position: center; background-size: contain; background-repeat: no-repeat;}
.job-address-button:hover {opacity: 1;}
.job-address-edit {background-image: url('../../dir.graphics/legacy_icons/icon_edit.svg');}
.job-address-save {background-image: url('../../dir.graphics/legacy_icons/icon_checkmark_blue.svg');}
.job-address-title {font-size: 16px; margin: 0 30px 10px 0;}
.job-address-block {}
.job-address-block textarea {resize: horizontal; width: 225px; max-width: 325px; min-width: 225px; height: 80px;}


.job-details-payment-container {flex-grow: 1; display: flex; flex-direction: column; padding: 10px 20px; position: relative;}
.job-details-payment-item {margin-bottom: 10px;}
.job-details-payment-item select {width: 300px; height: 35px;padding: 0 10px; border: 1px solid #ccc;}
.job-details-payment-item input {width: 300px; height: 35px;padding: 0 14px; border: 1px solid #ccc;}
.job-details-payment-item:last-child {margin-bottom: 0;}

.job-details-datenkontrolle { width: 145px;height: 71px;background: url('../../dir.graphics/icons/datenkontrolle_stamp2.png') center/contain no-repeat;position: absolute;top: 29px;right: 29px;opacity: 0.8;transform: rotate(-12deg);z-index: 1; animation-name: stamp; animation-duration: 0.15s; animation-fill-mode: both; animation-delay: 0.1s;}

@keyframes stamp {
    0% {transform: scale(1.5) rotate(-12deg); opacity: 0;}
    100% {transform: scale(1) rotate(-12deg); opacity: 1;}
}


.job-details-files-container {width: 350px; border-left: 1px solid var(--main-color-border); padding: 10px 20px; font-size: 16px; overflow: auto;}
.job-files-container {display: flex; flex-direction: column; font-size: 13px; margin-top: 10px; box-shadow: inset 0 0 9px -1px rgba(0,0,0,0.1); padding: 5px 10px;}
.job-files-empty {display: flex; flex-direction: column; font-size: 13px; margin-top: 10px;}
.job-files-item {margin-bottom: 2px;}
.job-files-item:last-child {margin-bottom: 0;}

.job-files-title {display:flex; justify-content: space-between;}
.job-files-title > div {display: flex; align-items: center;}
.job-files-download {text-decoration: none;}
.job-files-download > div {border: 1px solid #ccc; font-size: 12px; padding: 2px 5px; display: flex; align-items: center; height: 24px;}

.job-buttons-container { height: 150px;  background-color: var(--main-color-5); position: relative;}

.job-buttons-frame {display: flex; justify-content: space-between; height: 100%; align-items: center;}
.job-buttons-side {display: flex; padding: 10px 20px; height: 100%; align-items: center;}
.job-buttons-group {display: flex; flex-direction: column; margin-right: 20px; height: 125px;justify-content: flex-end;}
.job-buttons-group:last-child {margin-right: 0;}
.job-buttons-group a { text-decoration: none;}
.job-buttons-button {display: flex; justify-content: center; align-items: center; width: 180px; height: 35px; color: #fff; background-color: grey; user-select: none; cursor: pointer; opacity: 0.8;}
.job-buttons-button:not(.blocked):hover {opacity: 1;}
.job-buttons-button.color-blue {background-color: var(--main-color-blue);}
.job-buttons-button.color-green {background-color: var(--main-color-green);}
.job-buttons-button.color-orange {background-color: var(--main-color-orange);}
.job-buttons-button.color-red {background-color: var(--main-color-red);}
.job-buttons-button.style-friedhof {background: #000 url('../../dir.graphics/icons/icon_dead.svg') right+25px center/18px no-repeat;justify-content: flex-start;padding-left: 25px;}
.job-buttons-button.style-revive {background: #000;}
.job-buttons-button.blocked {opacity: 0.3; cursor: not-allowed;}
.job-buttons-box:not(:first-child) {margin-top: 10px;}

.job-buttons-box-dashed {width: 180px; height: 80px; border: 1px dashed #ccc; color: #969696; user-select: none; display: flex; justify-content: center; align-items: center; margin-top: 10px;}


.job-notification {width: 100%; padding: 15px 30px; background-color: rgba(0,0,0,0.3);}
.job-notification.color-green {background-color: rgba(0,255,0,0.3);}
.job-notification.color-orange {background-color: rgba(255,140,0,0.3);}


.job-position-preview {margin-bottom: 10px;}
.job-position-preview img {border: 1px solid #ccc; margin-bottom: 10px;}
.job-position-preview-name {margin-top: -12px;margin-bottom: 20px;border: 1px solid #ccc;width: fit-content;padding: 0px 9px 3px 9px;position: relative;}
.job-position-upload {border: 1px dashed #ccc; height: 75px; width: 250px; display: flex; justify-content: center; align-items: center; color: #ccc; position: relative;}
.job-position-upload.drag {border-color: #000; color: #000;}
.job-position-upload .progress {position: absolute; left: 0; bottom: 0; height: 15px; background-color: var(--main-color-2); color: #fff; width: 0%; transition: 0.5s;}



.exportdoc-form {display: flex; flex-direction: column; gap: 20px;}
.exportdoc-form .title {font-size: 14px; margin-bottom: 5px;}

.exportdoc-table {border-collapse: collapse; width: 100%;}
.exportdoc-table thead {font-size: 14px;}
.exportdoc-table thead td {padding: 5px 10px;}
.exportdoc-table td {border: 1px solid #ccc;}
.exportdoc-table input {width: 100%; border: 1px solid transparent; padding: 5px 10px;}

.exportdoc-line {display: flex; gap: 20px;}
.exportdoc-line .item {display: flex; flex-direction: column; gap: 5px;}
.exportdoc-line .item .label {font-size: 14px;}
.exportdoc-line .item .input {}
.exportdoc-line .item input,
.exportdoc-line .item select {width: 175px; height: 30px; border: 1px solid #ccc;}
.exportdoc-line .item input {padding: 0 7px;}
.exportdoc-line .item select {padding: 0 5px;}