/*
* Bestellportal style guide (approved 2026-09-19, reference page: admin "Rechnungen").
* Loaded last from includes/head.blade.php for ALL roles (Admin, Freelancer, Kunde, Mitarbeiter).
* Rollback: remove the one to this file from includes/head.blade.php.
* Rules: Inter, max 13px; light grey #f8f9fc fill, 1px #ddd border, 4px corners; hover #777; grey tones only.
*/
/* ---- Buttons: 4px corners, calm border; portal hover effect (text roll, #777 fill) is untouched ---- */
.stbtn_fbtn,
.btn-cstm-files-opn,
.btn-cstm-modl-files {
border-radius: 4px !important;
border-color: #ddd !important;
}
.stbtn_fbtn:hover,
.btn-cstm-files-opn:hover {
border-color: #777 !important;
}
/* ---- Filter rows: labels 12px, inputs 13px Inter ---- */
.tableControl label,
.date-filter label,
.DatePickerWrapperStart label,
.DatePickerWrapperEnd label {
font-family: "Inter", "Helvetica", sans-serif;
font-size: 12px;
line-height: 16px;
}
/* ---- Input boxes in filter rows: search field and date pickers ---- */
input.datepicker,
.dataTables_filter input[type="search"],
.tableControl input[type="search"],
.date-filter input[type="search"] {
font-family: "Inter", "Helvetica", sans-serif;
font-size: 13px;
min-height: 36px;
padding-top: 6px;
padding-bottom: 6px;
padding-left: 12px;
box-sizing: border-box;
border: 1px solid #ddd !important;
border-radius: 4px !important;
background-color: #f8f9fc;
box-shadow: none !important;
transition: border-color .2s ease, background-color .2s ease;
}
input.datepicker { padding-right: 34px; }
input.datepicker:hover,
.dataTables_filter input[type="search"]:hover,
.tableControl input[type="search"]:hover,
.date-filter input[type="search"]:hover { border-color: #bbb !important; }
input.datepicker:focus,
.dataTables_filter input[type="search"]:focus,
.tableControl input[type="search"]:focus,
.date-filter input[type="search"]:focus { border-color: #777 !important; background-color: #fff; outline: none; }
/* ---- DataTables info + pagination: centered, rectangular 36px buttons, current page dark grey ---- */
.dataTables_wrapper .dataTables_info {
float: none;
display: block;
padding: 14px 0 6px;
text-align: center;
font-family: "Inter", "Helvetica", sans-serif;
font-size: 12px;
color: #858585;
}
.dataTables_wrapper .dataTables_paginate {
float: none;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
gap: 8px;
padding: 6px 0 4px;
text-align: center;
}
.dataTables_wrapper .dataTables_paginate > span { display: inline-flex; gap: 8px; align-items: center; }
.dataTables_wrapper .dataTables_paginate a.paginate_button {
display: inline-flex;
align-items: center;
justify-content: center;
width: auto !important;
min-width: 36px !important;
height: 36px !important;
margin: 0 !important;
padding: 0 14px !important;
box-sizing: border-box !important;
white-space: nowrap;
border: 1px solid #ddd;
border-radius: 4px;
background: #f8f9fc;
color: #777 !important;
font-family: "Inter", "Helvetica", sans-serif;
font-size: 13px;
line-height: 1;
cursor: pointer;
transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.dataTables_wrapper .dataTables_paginate a.paginate_button.previous,
.dataTables_wrapper .dataTables_paginate a.paginate_button.next { padding: 0 !important; }
.dataTables_wrapper .dataTables_paginate a.paginate_button:hover { background: #eeeeee; border-color: #bbb; color: #555 !important; }
.dataTables_wrapper .dataTables_paginate a.paginate_button.current,
.dataTables_wrapper .dataTables_paginate a.paginate_button.current:hover { background: #777; border-color: #777; color: #fff !important; }
.dataTables_wrapper .dataTables_paginate a.paginate_button.disabled,
.dataTables_wrapper .dataTables_paginate a.paginate_button.disabled:hover { background: #f8f9fc; border-color: #eee; color: #c4c4c4 !important; cursor: default; }
.dataTables_wrapper .dataTables_paginate .ellipsis { color: #999; padding: 0 6px; }
/* ---- Round 2: fonts. Global rules were stronger than the first pass (labels stayed 15px, inputs 8px inner padding). ---- */
.tableControl label,
.date-filter label,
[class*="DatePickerWrapper"] label,
label.searchfreelancer,
label.custom_control_color {
font-family: "Inter", "Helvetica", sans-serif !important;
font-size: 12px !important;
line-height: 16px !important;
font-weight: 400 !important;
}
input.datepicker,
.dataTables_filter input[type="search"],
.tableControl input[type="search"],
.date-filter input[type="search"] {
padding-left: 12px !important;
font-size: 13px !important;
font-family: "Inter", "Helvetica", sans-serif !important;
}
input.datepicker { padding-right: 34px !important; }
input.datepicker::placeholder,
.dataTables_filter input[type="search"]::placeholder,
.tableControl input[type="search"]::placeholder { font-size: 12px; color: #aaa; }
/* table body text: 13px like the reference page (was 11.5px on the other tables) */
table.dataTable tbody td { font-family: "Inter", "Helvetica", sans-serif; font-size: 13px; }
table.dataTable tbody td { font-family: "Inter", "Helvetica", sans-serif !important; font-size: 13px !important; }
/* labels start exactly at the left edge of their input box */
label.searchfreelancer, [class*="DatePickerWrapper"] label, .tableControl label { padding-left: 0 !important; margin-left: 0 !important; }
/* paid checkbox in the invoice list: portal gold (same as the column-menu checkboxes) instead of browser blue */
input.invoice-paid-toggle { accent-color: #e0ad35; width: 16px; height: 16px; cursor: pointer; vertical-align: middle; }
/* paid checkbox: grey fill, thin X instead of a tick */
input.invoice-paid-toggle { -webkit-appearance: none; appearance: none; width: 18px; height: 18px; margin: 0; border: 1px solid #ddd; border-radius: 4px; background: #f8f9fc; cursor: pointer; vertical-align: middle; transition: background-color .2s ease, border-color .2s ease; }
input.invoice-paid-toggle:hover { border-color: #bbb; }
input.invoice-paid-toggle:checked { background-color: #777; border-color: #777; background-repeat: no-repeat; background-position: center; background-size: 10px 10px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M1.5 1.5l7 7M8.5 1.5l-7 7' stroke='%23fff' stroke-width='1' stroke-linecap='round' fill='none'/%3E%3C/svg%3E"); }
input.invoice-paid-toggle:focus-visible { outline: 2px solid #bbb; outline-offset: 1px; }
/* ---- Abrechnung (payment tables, admin Stick + Vektor incl. archive): rows, header, pagination, sum box, buttons ---- */
table[id$="_payment_table"] thead th,
table[id$="_payment_archive_table"] thead th,
table[id$="_payment_table"] tbody td,
table[id$="_payment_archive_table"] tbody td {
font-family: "Inter", "Helvetica", sans-serif !important;
font-size: 13px !important;
vertical-align: middle !important;
white-space: nowrap;
box-sizing: border-box;
}
table[id$="_payment_table"] tbody td img,
table[id$="_payment_archive_table"] tbody td img { display: inline-block; max-height: 18px; width: auto; vertical-align: middle; }
/* icon / number columns centered in header and body alike */
table[id$="_payment_table"] th:nth-child(1), table[id$="_payment_table"] td:nth-child(1),
table[id$="_payment_table"] th:nth-child(2), table[id$="_payment_table"] td:nth-child(2),
table[id$="_payment_table"] th:nth-child(6), table[id$="_payment_table"] td:nth-child(6),
table[id$="_payment_archive_table"] th:nth-child(1), table[id$="_payment_archive_table"] td:nth-child(1),
table[id$="_payment_archive_table"] th:nth-child(2), table[id$="_payment_archive_table"] td:nth-child(2) { text-align: center !important; }
/* pagination: the current page number sat at the top of its box - force true centering */
.dataTables_wrapper .dataTables_paginate a.paginate_button,
.dataTables_wrapper .dataTables_paginate a.paginate_button.current {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
line-height: 1 !important;
padding-top: 0 !important;
padding-bottom: 0 !important;
vertical-align: middle;
}
/* sum box: same height and look as the pagination buttons, on the pagination line at the right */
.total_count_number {
display: flex; align-items: center; justify-content: center;
width: auto !important; min-width: 90px; height: 36px; padding: 0 14px !important; box-sizing: border-box;
border: 1px solid #ddd; border-radius: 4px; background: #f8f9fc;
font-family: "Inter", "Helvetica", sans-serif; font-size: 13px !important; font-weight: 600 !important; color: #777 !important; line-height: 1;
}
div[style*="margin: -40px 0 30px 0"] { margin: -46px 0 24px 0 !important; align-items: center; }
/* bottom buttons: one row, same height, same baseline, right edge = table edge */
section:has(table[id$="_payment_table"]) .upload_btn { display: flex !important; justify-content: flex-end; align-items: center; gap: 12px; margin-top: 16px !important; text-align: initial !important; }
section:has(table[id$="_payment_table"]) .upload_btn .stbtn_fbtn { display: inline-flex !important; align-items: center; justify-content: center; width: auto !important; height: 36px; margin: 0 !important; padding: 0 18px !important; box-sizing: border-box; }
/* payment tables: smaller icons (were 18px, Art icon 12px like before, delivery icon 14px) */
table[id$="_payment_table"] tbody td img, table[id$="_payment_archive_table"] tbody td img { height: 14px !important; max-height: 14px !important; width: auto !important; }
table[id$="_payment_table"] tbody td:nth-child(1) img, table[id$="_payment_archive_table"] tbody td:nth-child(1) img { height: 12px !important; max-height: 12px !important; }
table[id$="_payment_table"] tbody td i, table[id$="_payment_archive_table"] tbody td i { font-size: 14px !important; }
/* ---- Reusable filter row + column menu (from the Rechnungen page): search field with icon, "Spalte" dropdown ---- */
.tbl-search-slot input[type="search"] {
background-image: url(/bestellportal/asset/images/search-solid.svg);
background-size: 20px;
background-position: 96%;
background-repeat: no-repeat;
width: 100%;
padding: 6px 40px 6px 12px !important;
outline: none;
}
#vePay-filter, #vePayArc-filter, #emPay-filter, #emPayArc-filter { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.tableControl .stbtn_fbtn, .invoice-col-menu .stbtn_fbtn { padding: 8px 18px !important; }
.invoice-col-menu { width: min(300px, calc(100vw - 32px)); max-height: min(70vh, 520px); overflow-y: auto; padding: 14px 16px; font-family: "Inter", "Helvetica", sans-serif; font-size: 13px; }
.invoice-col-title { font-family: "Inter", "Helvetica", sans-serif; font-size: 13px; font-weight: 600; margin-bottom: 6px; }
.invoice-col-list { display: grid; grid-template-columns: 1fr; column-gap: 20px; }
.invoice-col-item { display: flex; align-items: center; gap: 10px; min-height: 42px; margin: 0; padding: 4px 2px; cursor: pointer; line-height: 1.2; font-family: "Inter", "Helvetica", sans-serif; font-size: 13px; }
.tableControl .invoice-col-menu .invoice-col-title,
.tableControl .invoice-col-menu label.invoice-col-item,
.tableControl .invoice-col-menu label.invoice-col-item span { font-family: "Inter", "Helvetica", sans-serif !important; font-size: 13px !important; line-height: 18px !important; }
.tableControl .invoice-col-menu label.invoice-col-item { align-items: center; }
.tableControl .invoice-col-menu label.invoice-col-item input.option-input { flex: 0 0 auto; margin: 0; top: 0; vertical-align: middle; }
.invoice-col-menu .CheckboxButtons { display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: center; gap: 12px; margin-top: 14px; }
.invoice-col-menu .CheckboxButtons .CheckboxButton.stbtn_fbtn { flex: 0 0 auto; width: auto; margin: 0; }
@media (min-width: 576px) {
.invoice-col-list { grid-template-columns: 1fr 1fr; }
.invoice-col-menu { width: min(400px, calc(100vw - 32px)); }
}
@media (max-width: 575.98px) {
.invoice-col-menu { position: fixed !important; left: 16px !important; right: 16px !important; top: 130px !important; width: auto; transform: none !important; max-height: calc(100vh - 160px); }
}
/* ---- filter row (search + two date fields), same measures as the Rechnungen page ---- */
.tbl-filter-row { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 24px; }
.tbl-filter-row .tbl-search-slot { display: flex; flex-direction: column; flex: 0 1 313px; min-width: 220px; }
.tbl-filter-row .DatePickerWrapperStart, .tbl-filter-row .DatePickerWrapperEnd { display: flex; flex-direction: column; width: 145px; margin: 0; padding: 0; }
.tbl-filter-row label { margin-bottom: 4px; }
/* calendar icon in every date field of a filter row (was set per input id only) */
[class*="DatePickerWrapper"] input.datepicker { background-image: url("/bestellportal/asset/images/datePicker.svg"); background-repeat: no-repeat; background-size: 20px; background-position: right 10px center; width: 100%; }
/* filter group takes the free width (it shrank to ~500px and pushed "Endtermin" into a second line); wraps only on small screens */
.tableControl > .controlGroup1.invoice-filters { flex: 1 1 auto; min-width: 0; }
@media (min-width: 768px) { .tbl-filter-row { flex-wrap: nowrap; } }
/* ---- Abrechnung Stick / Vektor (+ Archive): identical fixed column widths, so switching pages never makes columns jump.
Beats the old th#coll1 / th#coll2 percentage rules and the widths DataTables computes from content. ---- */
table[id$="_payment_table"], table[id$="_payment_archive_table"] { table-layout: fixed; width: 100% !important; }
table[id$="_payment_table"] > thead > tr > th:nth-child(1):is(#coll1, #coll2, th),
table[id$="_payment_archive_table"] > thead > tr > th:nth-child(1):is(#coll1, #coll2, th) { width: 90px !important; }
table[id$="_payment_table"] > thead > tr > th:nth-child(2):is(#coll1, #coll2, th),
table[id$="_payment_archive_table"] > thead > tr > th:nth-child(2):is(#coll1, #coll2, th) { width: 100px !important; }
table[id$="_payment_table"] > thead > tr > th:nth-child(3):is(#coll1, #coll2, th),
table[id$="_payment_archive_table"] > thead > tr > th:nth-child(3):is(#coll1, #coll2, th) { width: 182px !important; }
table[id$="_payment_table"] > thead > tr > th:nth-child(4):is(#coll1, #coll2, th),
table[id$="_payment_archive_table"] > thead > tr > th:nth-child(4):is(#coll1, #coll2, th) { width: 182px !important; }
table[id$="_payment_table"] > thead > tr > th:nth-child(6):is(#coll1, #coll2, th),
table[id$="_payment_archive_table"] > thead > tr > th:nth-child(6):is(#coll1, #coll2, th) { width: 160px !important; }
table[id$="_payment_table"] tbody td:nth-child(5), table[id$="_payment_archive_table"] tbody td:nth-child(5) { overflow: hidden; text-overflow: ellipsis; }
/* ---- Abrechnung: centered columns (Art, Lieferzeit, Berechnete Menge) - header and cells get the SAME horizontal padding,
so the header text sits exactly above the numbers. (Sortable headers carry extra right padding from the DataTables theme,
which pushed the header ~14px to the left of the cell content on one of the pages.) ---- */
table[id$="_payment_table"] > thead > tr > th:is(:nth-child(1), :nth-child(2), :nth-child(6)),
table[id$="_payment_table"] > tbody > tr > td:is(:nth-child(1), :nth-child(2), :nth-child(6)),
table[id$="_payment_archive_table"] > thead > tr > th:is(:nth-child(1), :nth-child(2), :nth-child(6)),
table[id$="_payment_archive_table"] > tbody > tr > td:is(:nth-child(1), :nth-child(2), :nth-child(6)) {
padding-left: 8px !important;
padding-right: 8px !important;
text-align: center !important;
}
table[id$="_payment_table"] > thead > tr > th::before, table[id$="_payment_table"] > thead > tr > th::after,
table[id$="_payment_archive_table"] > thead > tr > th::before, table[id$="_payment_archive_table"] > thead > tr > th::after { display: none !important; }
/* fixed layout takes widths from first - DataTables may leave computed widths there; pin them to the same values */
table[id$="_payment_table"] > colgroup > col:nth-child(1), table[id$="_payment_archive_table"] > colgroup > col:nth-child(1) { width: 90px !important; }
table[id$="_payment_table"] > colgroup > col:nth-child(2), table[id$="_payment_archive_table"] > colgroup > col:nth-child(2) { width: 100px !important; }
table[id$="_payment_table"] > colgroup > col:nth-child(3), table[id$="_payment_archive_table"] > colgroup > col:nth-child(3) { width: 182px !important; }
table[id$="_payment_table"] > colgroup > col:nth-child(4), table[id$="_payment_archive_table"] > colgroup > col:nth-child(4) { width: 182px !important; }
table[id$="_payment_table"] > colgroup > col:nth-child(5), table[id$="_payment_archive_table"] > colgroup > col:nth-child(5) { width: auto !important; }
table[id$="_payment_table"] > colgroup > col:nth-child(6), table[id$="_payment_archive_table"] > colgroup > col:nth-child(6) { width: 160px !important; }
/* thin outline icons in tables (same look as the material page) */
.lw-icon { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 4px; color: #777; transition: background .2s ease, color .2s ease; vertical-align: middle; }
.lw-icon svg { width: 16px; height: 16px; margin: 0 !important; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
a:hover > .lw-icon, button:hover > .lw-icon { background: #eeeeee; color: #333; }
/* EXPRESS: red truck that blinks (own keyframes so no other .blink rule can change it) */
.lw-icon.blink { color: #e30000 !important; animation: lw-blink 1s steps(1, end) infinite !important; -webkit-animation: lw-blink 1s steps(1, end) infinite !important; }
.lw-icon.blink svg { stroke-width: 2.4; }
@keyframes lw-blink { 0% { opacity: 1; } 50% { opacity: .1; } 100% { opacity: 1; } }
@-webkit-keyframes lw-blink { 0% { opacity: 1; } 50% { opacity: .1; } 100% { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .lw-icon.blink { animation: none !important; } }
/* ---- Parameter Vektor (customer list): same look as the Abrechnung tables - 13px Inter, single-line rows, fixed column widths, small icon ---- */
#veParamPage table#admin_parameter_ve_table { table-layout: fixed; width: 100% !important; margin-top: 0; }
#veParamPage table#admin_parameter_ve_table thead th,
#veParamPage table#admin_parameter_ve_table tbody td {
font-family: "Inter", "Helvetica", sans-serif !important; font-size: 13px !important;
vertical-align: middle !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; box-sizing: border-box;
}
#veParamPage table#admin_parameter_ve_table > thead > tr > th::before,
#veParamPage table#admin_parameter_ve_table > thead > tr > th::after { display: none !important; }
#veParamPage table#admin_parameter_ve_table > thead > tr > th:nth-child(1):is(#max-number, th) { width: 120px !important; }
#veParamPage table#admin_parameter_ve_table > thead > tr > th:nth-child(2):is(#max-numbercom, th) { width: auto !important; }
#veParamPage table#admin_parameter_ve_table > thead > tr > th:nth-child(3) { width: 140px !important; }
#veParamPage table#admin_parameter_ve_table > thead > tr > th:nth-child(4) { width: 130px !important; }
#veParamPage table#admin_parameter_ve_table > thead > tr > th:nth-child(5) { width: 140px !important; }
#veParamPage table#admin_parameter_ve_table > thead > tr > th:nth-child(6) { width: 240px !important; }
#veParamPage table#admin_parameter_ve_table > thead > tr > th:nth-child(7) { width: 200px !important; }
#veParamPage table#admin_parameter_ve_table > thead > tr > th:nth-child(8) { width: 80px !important; }
#veParamPage table#admin_parameter_ve_table > thead > tr > th:nth-child(9) { width: 150px !important; }
#veParamPage table#admin_parameter_ve_table > thead > tr > th:nth-child(10) { width: 110px !important; }
#veParamPage table#admin_parameter_ve_table > thead > tr > th:nth-child(11) { width: 60px !important; }
#veParamPage table#admin_parameter_ve_table > colgroup > col:nth-child(1) { width: 120px !important; }
#veParamPage table#admin_parameter_ve_table > colgroup > col:nth-child(2) { width: auto !important; }
#veParamPage table#admin_parameter_ve_table > colgroup > col:nth-child(3) { width: 140px !important; }
#veParamPage table#admin_parameter_ve_table > colgroup > col:nth-child(4) { width: 130px !important; }
#veParamPage table#admin_parameter_ve_table > colgroup > col:nth-child(5) { width: 140px !important; }
#veParamPage table#admin_parameter_ve_table > colgroup > col:nth-child(6) { width: 240px !important; }
#veParamPage table#admin_parameter_ve_table > colgroup > col:nth-child(7) { width: 200px !important; }
#veParamPage table#admin_parameter_ve_table > colgroup > col:nth-child(8) { width: 80px !important; }
#veParamPage table#admin_parameter_ve_table > colgroup > col:nth-child(9) { width: 150px !important; }
#veParamPage table#admin_parameter_ve_table > colgroup > col:nth-child(10) { width: 110px !important; }
#veParamPage table#admin_parameter_ve_table > colgroup > col:nth-child(11) { width: 60px !important; }
/* detail icon column: centered, header and cell alike; icon 16px */
#veParamPage table#admin_parameter_ve_table th:nth-child(11), #veParamPage table#admin_parameter_ve_table td:nth-child(11) { text-align: center !important; padding-left: 8px !important; padding-right: 8px !important; }
#veParamPage table#admin_parameter_ve_table th img, #veParamPage table#admin_parameter_ve_table td img { height: 16px !important; max-height: 16px !important; width: auto !important; display: inline-block; vertical-align: middle; }
#veParamPage table#admin_parameter_ve_table td button { padding: 0; line-height: 1; }
/* ---- Parameter Stick (customer list): same look as the Abrechnung tables - 13px Inter, single-line rows, fixed column widths, small icon ---- */
#emParamPage table#admin_parameter_em_table { table-layout: fixed; width: 100% !important; margin-top: 0; }
#emParamPage table#admin_parameter_em_table thead th,
#emParamPage table#admin_parameter_em_table tbody td {
font-family: "Inter", "Helvetica", sans-serif !important; font-size: 13px !important;
vertical-align: middle !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; box-sizing: border-box;
}
#emParamPage table#admin_parameter_em_table > thead > tr > th::before,
#emParamPage table#admin_parameter_em_table > thead > tr > th::after { display: none !important; }
#emParamPage table#admin_parameter_em_table > thead > tr > th:nth-child(1):is(#max-number, th) { width: 120px !important; }
#emParamPage table#admin_parameter_em_table > thead > tr > th:nth-child(2):is(#max-numbercom, th) { width: auto !important; }
#emParamPage table#admin_parameter_em_table > thead > tr > th:nth-child(3) { width: 140px !important; }
#emParamPage table#admin_parameter_em_table > thead > tr > th:nth-child(4) { width: 130px !important; }
#emParamPage table#admin_parameter_em_table > thead > tr > th:nth-child(5) { width: 140px !important; }
#emParamPage table#admin_parameter_em_table > thead > tr > th:nth-child(6) { width: 240px !important; }
#emParamPage table#admin_parameter_em_table > thead > tr > th:nth-child(7) { width: 200px !important; }
#emParamPage table#admin_parameter_em_table > thead > tr > th:nth-child(8) { width: 80px !important; }
#emParamPage table#admin_parameter_em_table > thead > tr > th:nth-child(9) { width: 150px !important; }
#emParamPage table#admin_parameter_em_table > thead > tr > th:nth-child(10) { width: 110px !important; }
#emParamPage table#admin_parameter_em_table > thead > tr > th:nth-child(11) { width: 60px !important; }
#emParamPage table#admin_parameter_em_table > colgroup > col:nth-child(1) { width: 120px !important; }
#emParamPage table#admin_parameter_em_table > colgroup > col:nth-child(2) { width: auto !important; }
#emParamPage table#admin_parameter_em_table > colgroup > col:nth-child(3) { width: 140px !important; }
#emParamPage table#admin_parameter_em_table > colgroup > col:nth-child(4) { width: 130px !important; }
#emParamPage table#admin_parameter_em_table > colgroup > col:nth-child(5) { width: 140px !important; }
#emParamPage table#admin_parameter_em_table > colgroup > col:nth-child(6) { width: 240px !important; }
#emParamPage table#admin_parameter_em_table > colgroup > col:nth-child(7) { width: 200px !important; }
#emParamPage table#admin_parameter_em_table > colgroup > col:nth-child(8) { width: 80px !important; }
#emParamPage table#admin_parameter_em_table > colgroup > col:nth-child(9) { width: 150px !important; }
#emParamPage table#admin_parameter_em_table > colgroup > col:nth-child(10) { width: 110px !important; }
#emParamPage table#admin_parameter_em_table > colgroup > col:nth-child(11) { width: 60px !important; }
/* detail icon column: centered, header and cell alike; icon 16px */
#emParamPage table#admin_parameter_em_table th:nth-child(11), #emParamPage table#admin_parameter_em_table td:nth-child(11) { text-align: center !important; padding-left: 8px !important; padding-right: 8px !important; }
#emParamPage table#admin_parameter_em_table th img, #emParamPage table#admin_parameter_em_table td img { height: 16px !important; max-height: 16px !important; width: auto !important; display: inline-block; vertical-align: middle; }
#emParamPage table#admin_parameter_em_table td button { padding: 0; line-height: 1; }
/* ---- Parameter Stick: detail form of a customer (opened with the detail icon) - same look as the rest of the portal ---- */
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) fieldset.field-group { border: 1px solid #ddd !important; border-radius: 4px; padding: 16px 20px 8px !important; background: #fff; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) legend.field-caption { background: none !important; -webkit-background-clip: border-box !important; -webkit-text-fill-color: #777 !important; color: #777 !important;
font-family: "Inter", "Helvetica", sans-serif; font-size: 13px; font-weight: 600; line-height: 18px; margin: 0 0 4px 0; padding: 0 8px !important; width: auto !important; float: none; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) .form_dv_wrap { margin-bottom: 12px !important; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) .form_label label { font-family: "Inter", "Helvetica", sans-serif !important; font-size: 12px !important; font-weight: 400 !important; color: #555 !important; line-height: 1.3 !important; }
/* inputs, dropdowns, text area and the file-type box: #f8f9fc, 1px #ddd, 4px corners, 36px, 13px normal */
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) .selectbox-control, :is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) :is(.product-multiselect3, .product-multiselect8, .product-multiselect9) {
font-family: "Inter", "Helvetica", sans-serif !important; font-size: 13px !important; font-weight: 400 !important; color: #555 !important;
background-color: #f8f9fc; border: 1px solid #ddd !important; border-radius: 4px; box-sizing: border-box; width: 100%; transition: border-color .2s ease, background-color .2s ease; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) input.selectbox-control, :is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) select.selectbox-control { height: 36px !important; padding: 0 12px !important; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) select.selectbox-control { -webkit-appearance: none; appearance: none; padding-right: 34px !important; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23777' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; background-size: 12px; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) textarea.selectbox-control { height: auto !important; min-height: 84px; padding: 8px 12px !important; line-height: 20px; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) .selectbox-control:hover, :is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) :is(.product-multiselect3, .product-multiselect8, .product-multiselect9):hover { border-color: #bbb !important; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) .selectbox-control:focus { border-color: #777 !important; background-color: #fff; outline: none; box-shadow: none; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) :is(.product-multiselect3, .product-multiselect8, .product-multiselect9) { height: auto !important; min-height: 36px; padding: 7px 34px 7px 12px !important; cursor: pointer; overflow: visible;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23777' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 12px center; background-size: 12px; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) :is(.product-multiselect3, .product-multiselect8, .product-multiselect9).dropdown-toggle::after { display: none !important; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) :is(#selected_em_parameter3, #selected_ve_parameter8, #selected_ve_parameter9) { padding: 0 !important; height: auto !important; min-height: 20px; line-height: 20px !important; white-space: normal; word-break: break-word; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) :is(#selected_em_parameter3, #selected_ve_parameter8, #selected_ve_parameter9):empty::before { content: "Bitte auswählen"; color: #aaa; }
/* the drop-down list: white card, 2 columns, comfortable rows */
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) :is(.product-item-menu3, .product-item-menu8, .product-item-menu9) { border: 1px solid #ddd !important; border-radius: 4px; background: #fff; margin-top: 4px; padding: 8px 14px; height: auto !important; max-height: 320px; overflow-y: auto; box-shadow: 0 6px 18px rgba(0,0,0,.08); line-height: 1.4; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) .row:is(.parameter-select-items-file, .parameter-select-items-vector, .parameter-select-items-image) { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 20px; margin: 0 !important; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) .row:is(.parameter-select-items-file, .parameter-select-items-vector, .parameter-select-items-image) > div { display: flex; align-items: center; gap: 10px; width: auto !important; max-width: none !important; flex: none; min-height: 32px; padding: 2px 0 !important;
font-family: "Inter", "Helvetica", sans-serif; font-size: 13px !important; color: #555 !important; }
@media (max-width: 767.98px) { :is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) .row:is(.parameter-select-items-file, .parameter-select-items-vector, .parameter-select-items-image) { grid-template-columns: 1fr; } }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) :is(.product-item-menu3, .product-item-menu8, .product-item-menu9) input[type="checkbox"] { -webkit-appearance: none; appearance: none; width: 18px; height: 18px; margin: 0; border: 1px solid #ddd; border-radius: 4px; background: #f8f9fc; cursor: pointer; vertical-align: middle; transition: background-color .2s ease, border-color .2s ease; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) :is(.product-item-menu3, .product-item-menu8, .product-item-menu9) input[type="checkbox"]:hover { border-color: #bbb; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) :is(.product-item-menu3, .product-item-menu8, .product-item-menu9) input[type="checkbox"]:checked { background-color: #777; border-color: #777; background-repeat: no-repeat; background-position: center; background-size: 10px 10px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M1.5 1.5l7 7M8.5 1.5l-7 7' stroke='%23fff' stroke-width='1' stroke-linecap='round' fill='none'/%3E%3C/svg%3E"); }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) :is(.product-item-menu3, .product-item-menu8, .product-item-menu9) input[type="checkbox"]:focus-visible { outline: 2px solid #bbb; outline-offset: 1px; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) :is(.product-item-menu3, .product-item-menu8, .product-item-menu9) input[type="checkbox"] { margin: 0 !important; flex: 0 0 auto; }
/* buttons: centered, 12px gap, same height as the other portal buttons */
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) .upload_btn { display: flex; justify-content: center; align-items: center; gap: 12px; margin-top: 16px !important; text-align: initial !important; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) .upload_btn .stbtn_fbtn { display: inline-flex !important; align-items: center; justify-content: center; width: auto !important; height: 36px; margin: 0 !important; padding: 0 18px !important; box-sizing: border-box; }
/* Parameter Stick - file types: grouped list, chips in the box, one calm text colour */
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) :is(.product-multiselect3, .product-multiselect8, .product-multiselect9) { padding: 5px 34px 5px 8px !important; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) .em-chips { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; min-height: 24px; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) .em-chips:empty::before { content: "Bitte auswählen"; color: #aaa; font-size: 13px; padding-left: 4px; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) .em-chip { display: inline-flex; align-items: center; gap: 4px; height: 24px; padding: 0 4px 0 8px; background: #fff; border: 1px solid #ddd; border-radius: 4px;
font-family: "Inter", "Helvetica", sans-serif; font-size: 12px; color: #555; line-height: 1; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) .em-chip-x { display: inline-flex; align-items: center; justify-content: center; width: 16px; height: 16px; padding: 0; border: 0; background: transparent; color: #999; font-size: 14px; line-height: 1; cursor: pointer; border-radius: 3px; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) .em-chip-x:hover { color: #333; background: #eee; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) :is(.product-item-menu3, .product-item-menu8, .product-item-menu9) { padding: 14px 18px 10px; max-height: min(72vh, 620px); z-index: 1060; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) :is(.parameter-select-items-file, .parameter-select-items-vector, .parameter-select-items-image) { column-count: 3; column-gap: 28px; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) .em-file-group { break-inside: avoid; margin-bottom: 14px; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) .em-file-group-title { font-family: "Inter", "Helvetica", sans-serif; font-size: 12px; font-weight: 600; color: #777; letter-spacing: .04em; text-transform: uppercase; padding-bottom: 4px; margin-bottom: 2px; border-bottom: 1px solid #eee; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) .em-file-item { display: flex; align-items: center; gap: 10px; min-height: 30px; margin: 0; cursor: pointer; font-family: "Inter", "Helvetica", sans-serif; font-size: 13px; font-weight: 400; color: #555; line-height: 1.3; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) .em-file-item span { color: #555 !important; font-size: 13px !important; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) .em-file-item:hover span { color: #111 !important; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) .em-file-actions { display: flex; justify-content: space-between; align-items: center; margin-top: 4px; padding-top: 10px; border-top: 1px solid #eee; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) .em-file-clear, :is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) .em-file-done { font-family: "Inter", "Helvetica", sans-serif; font-size: 13px; color: #777; background: none; border: 0; padding: 4px 6px; cursor: pointer; border-radius: 4px; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) .em-file-done { font-weight: 600; border: 1px solid #ddd; background: #f8f9fc; padding: 6px 18px; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) .em-file-clear:hover, :is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) .em-file-done:hover { color: #111; border-color: #bbb; }
@media (max-width: 991.98px) { :is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) :is(.parameter-select-items-file, .parameter-select-items-vector, .parameter-select-items-image) { column-count: 2; } }
@media (max-width: 575.98px) { :is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) :is(.parameter-select-items-file, .parameter-select-items-vector, .parameter-select-items-image) { column-count: 1; } }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) :is(.product-item-menu3, .product-item-menu8, .product-item-menu9) { box-sizing: border-box; left: 0; right: auto; width: 100%; }
/* Parameter Stick - DST is always delivered: shown as selected, cannot be changed */
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) .em-file-locked { cursor: default; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) .em-file-locked input[type="checkbox"] { opacity: .55; cursor: not-allowed; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) .em-file-note { font-style: normal; font-size: 11px; color: #999; margin-left: auto; white-space: nowrap; }
:is(#admin_customer_parameters_em_popup, #admin_customer_parameters_ve_popup) .em-chip-locked { background: #f1f2f5; padding-right: 8px; }
/* Parameter Vektor: short lists -> 2 columns; the small "Standard" hint next to the pre-selected formats */
#admin_customer_parameters_ve_popup .parameter-select-items-vector, #admin_customer_parameters_ve_popup .parameter-select-items-image { column-count: 2; }
@media (max-width: 575.98px) { #admin_customer_parameters_ve_popup .parameter-select-items-vector, #admin_customer_parameters_ve_popup .parameter-select-items-image { column-count: 1; } }
#admin_customer_parameters_ve_popup .em-file-note { margin-left: 8px; }
/* Overviews: same gap between heading and search row as on the Rechnungen page (Abrechnung + Parameter, Vektor and Stick) */
#veParamPage .tableControl, #emParamPage .tableControl, section:has(table[id$="_payment_table"]) .tableControl { margin-top: 3px; }
/* ==== Top button menu (Admin / Kunde / Freelancer), >= 768px: always ONE line, never cut off ====
Every button shares the available width (up to its normal 75px box). When a button gets
narrower than 86px the small text label is dropped (same as the existing tablet look) so
nothing wraps or overflows. Below 768px the side drawer is untouched. (added 2026-09-25) */
@supports (container-type: inline-size) {
@media (min-width: 768px) {
#sidebar-wrapper ul.sidebar-nav.left-sidebar-nav {
flex-wrap: nowrap;
justify-content: flex-start;
align-items: stretch;
margin: 0 3vw;
padding-left: 20px !important;
padding-right: 0 !important;
overflow-x: auto;
overflow-y: hidden;
scrollbar-width: none;
box-sizing: border-box;
}
#sidebar-wrapper ul.sidebar-nav.left-sidebar-nav::-webkit-scrollbar { display: none; }
#sidebar-wrapper ul.sidebar-nav.left-sidebar-nav > li {
flex: 1 1 0;
min-width: 38px;
max-width: 91px;
padding: 0 !important;
margin-right: 0 !important;
container-type: inline-size;
box-sizing: border-box;
}
/* admin: group gaps that still fit */
#sidebar-wrapper ul.sidebar-nav.left-sidebar-nav > li.sidebarmargin { margin-right: clamp(0px, 0.6vw, 15px) !important; }
#sidebar-wrapper ul.sidebar-nav.left-sidebar-nav > li .sidebar-div {
width: 100% !important;
max-width: 75px;
min-width: 0;
margin-left: auto;
margin-right: auto;
}
/* 8px so the longest word (ABGESCHLOSSENE) fits into the 75px box instead of touching the border */
#sidebar-wrapper ul.sidebar-nav.left-sidebar-nav .sidebar_explain p { font-size: 8px; }
#sidebar-wrapper ul.sidebar-nav.left-sidebar-nav > li:not(:last-child) { flex-shrink: 1; }
}
/* button narrower than 86px: icon only, centred (label hidden, like the current tablet look) */
@container (max-width: 85px) {
.sidebar-div { padding: 8px 2px !important; height: 50px !important; align-self: center; align-items: center !important; justify-content: center !important; }
.sidebar-div .sidebar_explain { display: none !important; }
.sidebar-div .lion_pop_btn { justify-content: center; width: 100%; }
.sidebar-div .lion_pop_btn > div:first-child { height: auto !important; margin: 0 !important; display: flex; justify-content: center; align-items: center; }
div#wrapper .sidebar-div img.custom_top_menu_width.showdesktop,
div#wrapper .sidebar-div img.custom_top_ve_param.showdesktop { height: auto !important; max-height: 28px; max-width: 100%; object-fit: contain; }
}
}
/* ---- Alle Auftraege (Admin): same look as the Rechnungen / Abrechnung pages - 13px Inter, single-line rows, fixed column widths,
small icons, grey checkboxes (added 2026-09-26) ---- */
/* filters left, buttons right; when they do not fit into one line the buttons wrap below the filters (right aligned) */
#adminAllPage .tableControl { flex-wrap: wrap; row-gap: 12px; }
#adminAllPage .controlGroup1 { flex: 1 1 700px; min-width: 0; }
#adminAllPage .controlGroup2 { gap: 12px; align-items: flex-start; margin: 0 0 0 auto !important; align-self: flex-end; flex-wrap: wrap; justify-content: flex-end; }
#adminAllPage .controlGroup2 .stbtn_fbtn { margin: 0 !important; }
#adminAllPage .responsive-table { overflow-x: auto; }
#admin_all_table { table-layout: fixed; width: 100% !important; min-width: 980px; margin-top: 0; }
#admin_all_table thead th,
#admin_all_table tbody td {
font-family: "Inter", "Helvetica", sans-serif !important; font-size: 13px !important;
vertical-align: middle !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; box-sizing: border-box;
}
#admin_all_table > thead > tr > th::before,
#admin_all_table > thead > tr > th::after { display: none !important; }
#admin_all_table > thead > tr > th:nth-child(1), #admin_all_table > colgroup > col:nth-child(1) { width: 60px !important; }
#admin_all_table > thead > tr > th:nth-child(2), #admin_all_table > colgroup > col:nth-child(2) { width: 92px !important; }
#admin_all_table > thead > tr > th:nth-child(3), #admin_all_table > colgroup > col:nth-child(3) { width: 118px !important; }
#admin_all_table > thead > tr > th:nth-child(4), #admin_all_table > colgroup > col:nth-child(4) { width: 134px !important; }
#admin_all_table > thead > tr > th:nth-child(5), #admin_all_table > colgroup > col:nth-child(5) { width: auto !important; }
#admin_all_table > thead > tr > th:nth-child(6), #admin_all_table > colgroup > col:nth-child(6) { width: 152px !important; }
#admin_all_table > thead > tr > th:nth-child(7), #admin_all_table > colgroup > col:nth-child(7) { width: 66px !important; }
#admin_all_table > thead > tr > th:nth-child(8), #admin_all_table > colgroup > col:nth-child(8) { width: 66px !important; }
#admin_all_table > thead > tr > th:nth-child(9), #admin_all_table > colgroup > col:nth-child(9) { width: 86px !important; }
#admin_all_table > thead > tr > th:nth-child(10), #admin_all_table > colgroup > col:nth-child(10) { width: 76px !important; }
#admin_all_table > thead > tr > th:nth-child(11), #admin_all_table > colgroup > col:nth-child(11) { width: 44px !important; }/* icon columns centered - header and cell get the same padding so the header sits exactly above the icon */
#admin_all_table > thead > tr > th:is(:nth-child(1), :nth-child(2), :nth-child(7), :nth-child(8), :nth-child(9), :nth-child(10), :nth-child(11)),
#admin_all_table > tbody > tr > td:is(:nth-child(1), :nth-child(2), :nth-child(7), :nth-child(8), :nth-child(9), :nth-child(10), :nth-child(11)) {
padding-left: 8px !important; padding-right: 8px !important; text-align: center !important;
}
#admin_all_table tbody td img { height: 16px !important; max-height: 16px !important; width: auto !important; display: inline-block; vertical-align: middle; margin: 0 !important; }
#admin_all_table tbody td:nth-child(1) img { height: 14px !important; max-height: 14px !important; }
#admin_all_table tbody td button { padding: 0; line-height: 1; border: 0; background: transparent; }
#admin_all_table tbody td > div[style*="text-align:center"] { top: 0 !important; }
#admin_all_table tbody td i.fa-truck-fast { font-size: 15px !important; }
#admin_all_table .status-wrapper { display: inline-flex; align-items: center; gap: 8px; vertical-align: middle; }
#admin_all_table .status-wrapper .status_text { font-size: 13px !important; line-height: 1; }
/* select checkboxes: grey fill, thin X instead of a tick (same as the paid checkbox) */
#admin_all_table input[type="checkbox"] { -webkit-appearance: none; appearance: none; width: 18px; height: 18px; margin: 0; border: 1px solid #ddd; border-radius: 4px; background: #f8f9fc; cursor: pointer; vertical-align: middle; transition: background-color .2s ease, border-color .2s ease; }
#admin_all_table input[type="checkbox"]:hover { border-color: #bbb; }
#admin_all_table input[type="checkbox"]:checked { background-color: #777; border-color: #777; background-repeat: no-repeat; background-position: center; background-size: 10px 10px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M1.5 1.5l7 7M8.5 1.5l-7 7' stroke='%23fff' stroke-width='1' stroke-linecap='round' fill='none'/%3E%3C/svg%3E"); }
#admin_all_table input[type="checkbox"]:focus-visible { outline: 2px solid #bbb; outline-offset: 1px; }/* base.css hid the info line and the ellipsis of this table - show them like on the Rechnungen page */
#admin_all_table_wrapper .dataTables_info, div#admin_all_table_info { display: block !important; }
#admin_all_table_wrapper .dataTables_paginate .ellipsis, div#admin_all_table_paginate span.ellipsis { display: inline !important; }
#admin_all_table > tbody > tr > td { padding-top: 8px !important; padding-bottom: 8px !important; }
/* ---- Alle Auftraege: Kunde + Freelancer (Stick / Vektor) - same look as the Rechnungen / Abrechnung pages (added 2026-09-26) ---- */
:is(#customerAllPage, #emFreeAllPage, #veFreeAllPage) .tableControl { flex-wrap: wrap; row-gap: 12px; }
:is(#customerAllPage, #emFreeAllPage, #veFreeAllPage) .controlGroup1 { flex: 1 1 700px; min-width: 0; }
#customerAllPage .controlGroup2 { gap: 12px; align-items: flex-start; margin: 0 0 0 auto !important; align-self: flex-end; }
#customerAllPage .controlGroup2 .stbtn_fbtn { margin: 0 !important; }
:is(#view-order, #em_freelancer_all_table, #ve_freelancer_all_table) { table-layout: fixed; width: 100% !important; margin-top: 0; }
#view-order { min-width: 1000px; }
:is(#em_freelancer_all_table, #ve_freelancer_all_table) { min-width: 820px; }
:is(#customerAllPage, #emFreeAllPage, #veFreeAllPage) .responsive-table { overflow-x: auto; }
:is(#view-order, #em_freelancer_all_table, #ve_freelancer_all_table) > thead > tr > th,
:is(#view-order, #em_freelancer_all_table, #ve_freelancer_all_table) > tbody > tr > td {
font-family: "Inter", "Helvetica", sans-serif !important; font-size: 13px !important;
vertical-align: middle !important; white-space: nowrap !important; overflow: hidden; text-overflow: ellipsis; box-sizing: border-box;
padding-top: 8px !important; padding-bottom: 8px !important; height: auto !important; line-height: 19.5px;
}
:is(#view-order, #em_freelancer_all_table, #ve_freelancer_all_table) > thead > tr > th::before,
:is(#view-order, #em_freelancer_all_table, #ve_freelancer_all_table) > thead > tr > th::after { display: none !important; }
/* customer: Art, Lieferzeit, Auftrag, Datum, Bestellt von, Projekt, Status, Detail, Aendern, Aenderung */
#view-order > thead > tr > th:nth-child(1), #view-order > colgroup > col:nth-child(1) { width: 60px !important; }
#view-order > thead > tr > th:nth-child(2), #view-order > colgroup > col:nth-child(2) { width: 92px !important; }
#view-order > thead > tr > th:nth-child(3), #view-order > colgroup > col:nth-child(3) { width: 118px !important; }
#view-order > thead > tr > th:nth-child(4), #view-order > colgroup > col:nth-child(4) { width: 134px !important; }
#view-order > thead > tr > th:nth-child(5), #view-order > colgroup > col:nth-child(5) { width: 150px !important; }
#view-order > thead > tr > th:nth-child(6), #view-order > colgroup > col:nth-child(6) { width: auto !important; }
#view-order > thead > tr > th:nth-child(7), #view-order > colgroup > col:nth-child(7) { width: 152px !important; }
#view-order > thead > tr > th:nth-child(8), #view-order > colgroup > col:nth-child(8) { width: 66px !important; }
#view-order > thead > tr > th:nth-child(9), #view-order > colgroup > col:nth-child(9) { width: 66px !important; }
#view-order > thead > tr > th:nth-child(10), #view-order > colgroup > col:nth-child(10) { width: 110px !important; }
/* freelancer: Art, Lieferzeit, Auftrag, Datum, Projekt, Status, Detail, Aenderung */
:is(#em_freelancer_all_table, #ve_freelancer_all_table) > thead > tr > th:nth-child(1), :is(#em_freelancer_all_table, #ve_freelancer_all_table) > colgroup > col:nth-child(1) { width: 60px !important; }
:is(#em_freelancer_all_table, #ve_freelancer_all_table) > thead > tr > th:nth-child(2), :is(#em_freelancer_all_table, #ve_freelancer_all_table) > colgroup > col:nth-child(2) { width: 100px !important; }
:is(#em_freelancer_all_table, #ve_freelancer_all_table) > thead > tr > th:nth-child(3), :is(#em_freelancer_all_table, #ve_freelancer_all_table) > colgroup > col:nth-child(3) { width: 118px !important; }
:is(#em_freelancer_all_table, #ve_freelancer_all_table) > thead > tr > th:nth-child(4), :is(#em_freelancer_all_table, #ve_freelancer_all_table) > colgroup > col:nth-child(4) { width: 134px !important; }
:is(#em_freelancer_all_table, #ve_freelancer_all_table) > thead > tr > th:nth-child(5), :is(#em_freelancer_all_table, #ve_freelancer_all_table) > colgroup > col:nth-child(5) { width: auto !important; }
:is(#em_freelancer_all_table, #ve_freelancer_all_table) > thead > tr > th:nth-child(6), :is(#em_freelancer_all_table, #ve_freelancer_all_table) > colgroup > col:nth-child(6) { width: 152px !important; }
:is(#em_freelancer_all_table, #ve_freelancer_all_table) > thead > tr > th:nth-child(7), :is(#em_freelancer_all_table, #ve_freelancer_all_table) > colgroup > col:nth-child(7) { width: 66px !important; }
:is(#em_freelancer_all_table, #ve_freelancer_all_table) > thead > tr > th:nth-child(8), :is(#em_freelancer_all_table, #ve_freelancer_all_table) > colgroup > col:nth-child(8) { width: 110px !important; }
/* icon / short columns centered - header and cell get the same padding */
:is(#view-order, #em_freelancer_all_table, #ve_freelancer_all_table) > thead > tr > th.lw-center,
:is(#view-order, #em_freelancer_all_table, #ve_freelancer_all_table) > tbody > tr > td.lw-center { padding-left: 8px !important; padding-right: 8px !important; text-align: center !important; }
:is(#view-order, #em_freelancer_all_table, #ve_freelancer_all_table) > tbody > tr > td img { height: 16px !important; max-height: 16px !important; width: auto !important; display: inline-block !important; vertical-align: middle; margin: 0 !important; }
:is(#view-order, #em_freelancer_all_table, #ve_freelancer_all_table) > tbody > tr > td:nth-child(1) img { height: 14px !important; max-height: 14px !important; }
:is(#view-order, #em_freelancer_all_table, #ve_freelancer_all_table) > tbody > tr > td button { padding: 0; line-height: 1; border: 0; background: transparent; }
:is(#view-order, #em_freelancer_all_table, #ve_freelancer_all_table) > tbody > tr > td > div { top: 0 !important; }
:is(#view-order, #em_freelancer_all_table, #ve_freelancer_all_table) > tbody > tr > td i.fa-truck-fast { font-size: 15px !important; }
:is(#view-order, #em_freelancer_all_table, #ve_freelancer_all_table) .status-wrapper { display: inline-flex; align-items: center; gap: 8px; vertical-align: middle; }
:is(#view-order, #em_freelancer_all_table, #ve_freelancer_all_table) .status-wrapper .status_text { font-size: 13px !important; line-height: 1; }
/* base.css hid the info line and the ellipsis of these tables - show them like on the Rechnungen page */
:is(#view-order_wrapper, #em_freelancer_all_table_wrapper, #ve_freelancer_all_table_wrapper) .dataTables_info,
div#view-order_info, div#em_freelancer_all_table_info, div#ve_freelancer_all_table_info { display: block !important; }
:is(#view-order_wrapper, #em_freelancer_all_table_wrapper, #ve_freelancer_all_table_wrapper) .dataTables_paginate .ellipsis,
div#view-order_paginate span.ellipsis, div#em_freelancer_all_table_paginate span.ellipsis, div#ve_freelancer_all_table_paginate span.ellipsis { display: inline !important; }/* search field with the magnifier icon (same as the Rechnungen page) */
#freelancersearch, #freelancersearchve { background-image: url(/bestellportal/asset/images/search-solid.svg); background-size: 20px; background-position: 96%; background-repeat: no-repeat; width: 100%; padding-right: 40px !important; }
/* ---- Neue Auftraege / In Arbeit / Abgeschlossene / Aenderungen (Admin + Freelancer Stick/Vektor): same look as Alle Auftraege (added 2026-09-26) ---- */
:is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) { table-layout: fixed; width: 100% !important; min-width: 860px; margin-top: 0; }
:is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) > thead > tr > th,
:is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) > tbody > tr > td {
font-family: "Inter", "Helvetica", sans-serif !important; font-size: 13px !important;
vertical-align: middle !important; white-space: nowrap !important; overflow: hidden; text-overflow: ellipsis; box-sizing: border-box;
padding-top: 8px !important; padding-bottom: 8px !important; height: auto !important; line-height: 19.5px;
}
:is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) > thead > tr > th::before,
:is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) > thead > tr > th::after { display: none !important; }
:is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) > thead > tr > th:nth-child(1), :is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) > colgroup > col:nth-child(1) { width: 60px !important; }
:is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) > thead > tr > th:nth-child(2), :is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) > colgroup > col:nth-child(2) { width: 92px !important; }
:is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) > thead > tr > th:nth-child(3), :is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) > colgroup > col:nth-child(3) { width: 118px !important; }
:is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) > thead > tr > th:nth-child(4), :is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) > colgroup > col:nth-child(4) { width: 134px !important; }
:is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) > thead > tr > th:nth-child(5), :is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) > colgroup > col:nth-child(5) { width: auto !important; }
:is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) > thead > tr > th:nth-child(6), :is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) > colgroup > col:nth-child(6) { width: 152px !important; }
:is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) > thead > tr > th:nth-child(7), :is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) > colgroup > col:nth-child(7) { width: 66px !important; }
:is(#admin_green_table, #em_freelancer_green_table, #ve_freelancer_green_table) > thead > tr > th:nth-child(8), :is(#admin_green_table, #em_freelancer_green_table, #ve_freelancer_green_table) > colgroup > col:nth-child(8) { width: 44px !important; }
:is(#admin_red_table) > thead > tr > th:nth-child(8), :is(#admin_red_table) > colgroup > col:nth-child(8) { width: 66px !important; }
:is(#admin_blue_table, #em_freelancer_blue_table, #ve_freelancer_blue_table) > thead > tr > th:nth-child(8), :is(#admin_blue_table, #em_freelancer_blue_table, #ve_freelancer_blue_table) > colgroup > col:nth-child(8) { width: 110px !important; }
:is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) > thead > tr > th.lw-center,
:is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) > tbody > tr > td.lw-center { padding-left: 8px !important; padding-right: 8px !important; text-align: center !important; }
:is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) > tbody > tr > td img { height: 16px !important; max-height: 16px !important; width: auto !important; display: inline-block !important; vertical-align: middle; margin: 0 !important; }
:is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) > tbody > tr > td:nth-child(1) img { height: 14px !important; max-height: 14px !important; }
:is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) > tbody > tr > td button { padding: 0; line-height: 1; border: 0; background: transparent; }
:is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) > tbody > tr > td > div { top: 0 !important; }
:is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) > tbody > tr > td i.fa-truck-fast { font-size: 15px !important; }
:is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) .status-wrapper { display: inline-flex; align-items: center; gap: 8px; vertical-align: middle; }
:is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) .status-wrapper .status_text { font-size: 13px !important; line-height: 1; }
:is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) input[type="checkbox"] { -webkit-appearance: none; appearance: none; width: 18px; height: 18px; margin: 0; border: 1px solid #ddd; border-radius: 4px; background: #f8f9fc; cursor: pointer; vertical-align: middle; transition: background-color .2s ease, border-color .2s ease; }
:is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) input[type="checkbox"]:hover { border-color: #bbb; }
:is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) input[type="checkbox"]:checked { background-color: #777; border-color: #777; background-repeat: no-repeat; background-position: center; background-size: 10px 10px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M1.5 1.5l7 7M8.5 1.5l-7 7' stroke='%23fff' stroke-width='1' stroke-linecap='round' fill='none'/%3E%3C/svg%3E"); }
:is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table) input[type="checkbox"]:focus-visible { outline: 2px solid #bbb; outline-offset: 1px; }
/* the tables sit in .responsive-table: scroll inside when the window is narrower than the table */
.responsive-table:has(:is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table)) { overflow-x: auto; }
/* base.css hid the info line and the ellipsis of some of these tables - show them like on the Rechnungen page */
.dataTables_wrapper:has(:is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table)) .dataTables_info { display: block !important; }
.dataTables_wrapper:has(:is(#admin_green_table, #admin_yellow_table, #admin_red_table, #admin_blue_table, #em_freelancer_green_table, #em_freelancer_yellow_table, #em_freelancer_red_table, #em_freelancer_blue_table, #ve_freelancer_green_table, #ve_freelancer_yellow_table, #ve_freelancer_red_table, #ve_freelancer_blue_table)) .dataTables_paginate .ellipsis { display: inline !important; }
div#admin_green_table_info, div#admin_yellow_table_info, div#admin_red_table_info, div#admin_blue_table_info,
div#em_freelancer_green_table_info, div#em_freelancer_yellow_table_info, div#em_freelancer_red_table_info, div#em_freelancer_blue_table_info,
div#ve_freelancer_green_table_info, div#ve_freelancer_yellow_table_info, div#ve_freelancer_red_table_info, div#ve_freelancer_blue_table_info { display: block !important; }
div#admin_red_table_paginate span.ellipsis, div#em_freelancer_red_table_paginate span.ellipsis, div#ve_freelancer_red_table_paginate span.ellipsis { display: inline !important; }
/* bulk start button above the "Neue Auftraege" tables: same button look as everywhere */
.bulk_container { margin-bottom: 12px; }
.bulk_container .stbtn_fbtn { margin: 0 !important; padding: 8px 18px !important; font-weight: 600; }
/* ---- filter row + column button on the tab tables (Neue / In Arbeit / Abgeschlossene / Aenderungen), same as Alle Auftraege (added 2026-09-26) ---- */
.lw-tabpage .tableControl { flex-wrap: wrap; row-gap: 12px; }
.lw-tabpage .controlGroup1 { flex: 1 1 700px; min-width: 0; }
.lw-tabpage .controlGroup2 { gap: 12px; align-items: flex-start; margin: 0 0 0 auto !important; align-self: flex-end; flex-wrap: wrap; justify-content: flex-end; }
.lw-tabpage .controlGroup2 .stbtn_fbtn { margin: 0 !important; padding: 8px 18px !important; font-weight: 600; }
.lw-tabpage .tbl-search-slot input[type="search"] { background-image: url(/bestellportal/asset/images/search-solid.svg); background-size: 20px; background-position: 96%; background-repeat: no-repeat; width: 100%; padding-right: 40px !important; }
/* generic confirm dialog (lwTable.confirmBulk) */
#lwConfirmModal .lw-confirm-body { padding: 28px 28px 24px; font-family: "Inter", "Helvetica", sans-serif; font-size: 14px; color: #555; text-align: center; }
#lwConfirmModal .lw-confirm-body p { margin: 0 0 22px; }
#lwConfirmModal .lw-confirm-buttons { display: flex; justify-content: center; gap: 12px; }
#lwConfirmModal .lw-confirm-buttons .stbtn_fbtn { margin: 0 !important; padding: 8px 18px !important; font-weight: 600; }
/* ---- Bestelldetails (Admin / Kunde / Freelancer): same look as the overviews - white cards with thin grey border, grey headings,
36px input boxes, tidy button row, file table like the other tables (added 2026-09-26) ---- */
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .order_detail_div { background: #fff; border: 1px solid #ddd !important; border-radius: 4px !important; box-shadow: none !important; padding: 20px 24px 16px; box-sizing: border-box; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .box_title {
background: none !important; -webkit-background-clip: border-box !important; background-clip: border-box !important; -webkit-text-fill-color: #777 !important; color: #777 !important;
font-family: "Inter", "Helvetica", sans-serif !important; font-size: 13px !important; font-weight: 600 !important; line-height: 18px; letter-spacing: .04em; text-transform: uppercase; margin: 0 0 14px 0 !important;
}
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .form_dv_wrap { margin-bottom: 12px !important; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .form_label label, :is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .control-label { font-family: "Inter", "Helvetica", sans-serif !important; font-size: 12px !important; font-weight: 400 !important; color: #555 !important; line-height: 1.3 !important; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .order_detail_input_div_element {
font-family: "Inter", "Helvetica", sans-serif !important; font-size: 13px !important; font-weight: 400 !important; color: #555 !important;
background-color: #f8f9fc !important; border: 1px solid #ddd !important; border-radius: 4px !important; box-shadow: none !important; box-sizing: border-box; width: 100%;
min-height: 36px; padding: 7px 12px !important; line-height: 20px; transition: border-color .2s ease, background-color .2s ease;
}
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) input.order_detail_input_div_element { height: 36px; padding-top: 0 !important; padding-bottom: 0 !important; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .order_detail_input_div_element:hover { border-color: #bbb !important; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .order_detail_input_div_element:focus { border-color: #777 !important; background-color: #fff !important; outline: none; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .order_detail_input_div_element[readonly] { background-color: #f1f2f5 !important; color: #666 !important; cursor: default; }
/* buttons inside the cards: same calm look as everywhere */
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .order_detail_div .stbtn_fbtn { margin: 0 !important; padding: 8px 18px !important; font-weight: 600; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .order_detail_div .stbtn_fbtn span { font-weight: 600 !important; }
/* file toolbar: one row, right aligned */
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .lw-file-toolbar { display: flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 12px; margin-bottom: 14px; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .lw-file-toolbar .stbtn_fbtn i { margin-right: 8px; color: inherit; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .lw-file-toolbar .stbtn_fbtn .master, :is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .lw-file-toolbar .stbtn_fbtn .hover-text { white-space: nowrap; }
/* folder buttons (Originaldatei / Stickprogramm / ...): tab-like chips, the open one dark grey */
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .folder_button_new:not([style*="display: none"]) { display: inline-flex !important; align-items: center; height: 36px; min-width: 0; margin: 0 8px 8px 0 !important; padding: 0 16px !important; box-sizing: border-box;
background: #f8f9fc !important; border: 1px solid #ddd !important; border-radius: 4px !important; box-shadow: none !important; cursor: pointer; transition: background .2s ease, border-color .2s ease; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .folder_button_new .folder_button_new_img { height: auto !important; display: inline-flex; align-items: center; margin: 0 !important; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .folder_button_new img { width: 14px !important; margin: 0 8px 0 0 !important; opacity: .6; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .folder_button_new p { margin: 0 !important; padding: 0 !important; background: none !important; font-family: "Inter", "Helvetica", sans-serif !important; font-size: 12px !important; font-weight: 600 !important; letter-spacing: .03em; color: #777 !important; line-height: 1; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .folder_button_new:hover { border-color: #bbb !important; background: #eee !important; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .folder_button_new.lw-active { background: #777 !important; border-color: #777 !important; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .folder_button_new.lw-active p { color: #fff !important; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .folder_button_new.lw-active img { filter: brightness(0) invert(1); opacity: 1; }
/* file table */
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .file_view_table { max-height: 460px; overflow: auto; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .file_view_table table { width: 100% !important; margin: 0; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .file_view_table thead th, :is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .file_view_table tbody td {
font-family: "Inter", "Helvetica", sans-serif !important; font-size: 13px !important; vertical-align: middle !important; padding: 8px 10px !important; line-height: 19.5px; white-space: nowrap;
}
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .file_view_table thead th { position: sticky; top: 0; z-index: 1; background: #777; color: #fff; font-weight: 600; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .file_view_table thead th::before, :is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .file_view_table thead th::after { display: none !important; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .file_view_table tbody td:first-child { text-align: left !important; max-width: 520px; overflow: hidden; text-overflow: ellipsis; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .file_view_table thead th:first-child { text-align: left !important; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .file_view_table tbody td img { height: 16px !important; width: auto !important; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .file_view_table tbody td button { padding: 0; line-height: 1; border: 0; background: transparent; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .file_view_table input[type="checkbox"] { -webkit-appearance: none; appearance: none; width: 18px; height: 18px; margin: 0; border: 1px solid #ddd; border-radius: 4px; background: #f8f9fc; cursor: pointer; vertical-align: middle; transition: background-color .2s ease, border-color .2s ease; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .file_view_table input[type="checkbox"]:hover { border-color: #bbb; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .file_view_table input[type="checkbox"]:checked { background-color: #777; border-color: #777; background-repeat: no-repeat; background-position: center; background-size: 10px 10px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10'%3E%3Cpath d='M1.5 1.5l7 7M8.5 1.5l-7 7' stroke='%23fff' stroke-width='1' stroke-linecap='round' fill='none'/%3E%3C/svg%3E"); }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .file_view_table .dataTables_info, :is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .dataTables_wrapper .dataTables_info { display: block !important; }:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .file_view_table table { table-layout: fixed; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .file_view_table thead th:not(:first-child) { width: 108px !important; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .file_view_table thead th:last-child:has(input[type="checkbox"]) { width: 48px !important; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .file_view_table tbody td:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .file_view_table thead th:first-child { width: auto !important; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .order_detail_div .order_detail_div { border: 0 !important; padding: 0; background: transparent; }
/* ---- Button hover: the old "rolling text" used two transforms that cancel each other and left some buttons blank
(Auswahl loeschen, Job aktualisieren) - now one calm swap: dark grey fill, white text, on every button (added 2026-09-26) ---- */
.stbtn_fbtn:hover > .hover-cover, .stbtn_fbtn:hover > div { transform: none !important; transition: none !important; }
.stbtn_fbtn > .hover-cover .hover-text { transform: none !important; opacity: 1; }
.stbtn_fbtn:hover > .hover-cover .master { display: none !important; }
.stbtn_fbtn:hover > .hover-cover .hover-text { display: block !important; color: #fff !important; }
.stbtn_fbtn:hover > .hover-cover i, .stbtn_fbtn:hover > .hover-cover img { color: #fff !important; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .folder_button_new:hover img { opacity: 1; }
/* Folder chips: legacy global.css turns the icon white on hover (invisible on the light hover fill) and adds a shadow -> grey icon, flat, dark active chip stays dark (added 2026-09-27) */
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .folder_button_new:not(.lw-active) img,
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .folder_button_new:not(.lw-active):hover img { filter: brightness(0) !important; opacity: .5; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .folder_button_new:not(.lw-active):hover img { opacity: .75; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .folder_button_new:not(.lw-active):hover p { color: #444 !important; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .folder_button_new { box-shadow: none !important; transition: background-color .15s, border-color .15s; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .folder_button_new.lw-active:hover { background: #666 !important; border-color: #666 !important; }
:is(#admin_order_detail_popup, #order_detail_popup, #free_order_detail_popup) .folder_button_new.lw-active:hover img { filter: brightness(0) invert(1) !important; opacity: 1; }
/* Job box (Admin / Freelancer "Fertige Dateien"): drop zone always visible, one row per file with its own progress,
one primary button to finish. Same look as the rest of the portal (Inter, #f8f9fc, 1px #ddd, 4px corners). (2026-09-27) */
:is(#admin_order_detail_popup, #free_order_detail_popup) .lw-job-box { background: #f8f9fc; border: 1px solid #ddd; border-radius: 4px; padding: 12px; }
:is(#admin_order_detail_popup, #free_order_detail_popup) .lw-job-box .box_title { margin: 0 0 8px; }
/* 2026-09-27: made much bigger (was 64px, a thin strip easy to miss as a drop target) and the label now reads as a
full sentence (it was missing "Drag & Drop hier ablegen" - only the first two of the three text keys were used). */
:is(#admin_order_detail_popup, #free_order_detail_popup) .lw-job-dropzone { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; min-height: 140px; padding: 16px; border: 2px dashed #bbb; border-radius: 4px; background: #fff; color: #777; font-family: "Inter", "Helvetica", sans-serif; font-size: 13px; font-weight: 600; letter-spacing: .02em; text-align: center; cursor: pointer; transition: border-color .15s, background-color .15s; }
:is(#admin_order_detail_popup, #free_order_detail_popup) .lw-job-dropzone:hover, :is(#admin_order_detail_popup, #free_order_detail_popup) .lw-job-dropzone.lw-dragover { border-color: #777; background: #f1f1f1; }
:is(#admin_order_detail_popup, #free_order_detail_popup) .lw-job-dropzone img { width: 34px; opacity: .5; }
:is(#admin_order_detail_popup, #free_order_detail_popup) .lw-job-dropzone-text { max-width: 260px; line-height: 1.5; }
:is(#admin_order_detail_popup, #free_order_detail_popup) .lw-job-dropzone-text b { color: #555; }
:is(#admin_order_detail_popup, #free_order_detail_popup) table.lw-job-table { width: 100%; border-collapse: collapse; margin-top: 8px; table-layout: fixed; }
:is(#admin_order_detail_popup, #free_order_detail_popup) table.lw-job-table tbody:empty { display: none; }
:is(#admin_order_detail_popup, #free_order_detail_popup) tr.lw-job-row td { padding: 6px 4px; border-bottom: 1px solid #eee; font-family: "Inter", "Helvetica", sans-serif; font-size: 12px; color: #444; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; vertical-align: middle; }
:is(#admin_order_detail_popup, #free_order_detail_popup) tr.lw-job-row .lw-job-name { width: 46%; }
:is(#admin_order_detail_popup, #free_order_detail_popup) tr.lw-job-row .lw-job-size { width: 14%; color: #999; }
:is(#admin_order_detail_popup, #free_order_detail_popup) tr.lw-job-row .lw-job-progress { width: 26%; }
:is(#admin_order_detail_popup, #free_order_detail_popup) tr.lw-job-row .lw-job-status { width: 14%; text-align: right; color: #999; font-weight: 600; }
:is(#admin_order_detail_popup, #free_order_detail_popup) .lw-job-bar { height: 6px; border-radius: 3px; background: #e2e2e2; overflow: hidden; }
:is(#admin_order_detail_popup, #free_order_detail_popup) .lw-job-bar-fill { height: 100%; width: 2%; background: #999; border-radius: 3px; transition: width .2s linear; }
:is(#admin_order_detail_popup, #free_order_detail_popup) tr.lw-job-row.lw-job-done .lw-job-bar-fill { background: #6a8f5c; }
:is(#admin_order_detail_popup, #free_order_detail_popup) tr.lw-job-row.lw-job-done .lw-job-status { color: #6a8f5c; }
:is(#admin_order_detail_popup, #free_order_detail_popup) tr.lw-job-row.lw-job-failed .lw-job-bar-fill { background: #b25454; }
:is(#admin_order_detail_popup, #free_order_detail_popup) tr.lw-job-row.lw-job-failed .lw-job-status { color: #b25454; }
:is(#admin_order_detail_popup, #free_order_detail_popup) .lw-job-finish-row { display: flex; justify-content: flex-end; margin-top: 10px; }
:is(#admin_order_detail_popup, #free_order_detail_popup) .lw-job-warning { background: #fbeeee; border: 1px solid #e0b4b4; color: #8a3b3b; border-radius: 4px; padding: 8px 10px; font-family: "Inter", "Helvetica", sans-serif; font-size: 12px; margin-bottom: 8px; }
/* Job box uploads (2026-09-27): the upload plugin keeps rendering its OWN native row for every file besides ours
(see the long comment in lwJobBox.wire, portal-style.js) - it expects a JSON reply this endpoint never sends, so
that native row always ends up stuck on "Error: Empty file upload result". Hiding it in JS did not stick (its own
"done" handling replaces the node with a fresh, visible one), so it is hidden here instead - a permanent rule that
keeps applying no matter how many times the plugin swaps that node out. */
#admin_job_upload .template-upload, #admin_job_upload .template-download,
#freelancer_job_upload .template-upload, #freelancer_job_upload .template-download { display: none !important; }