/* ========================================================================== Invoice "Release" / "Finish" Pages — personal/staff to-do lists, single-row table aligned with editor.css. Shared by both template-invoice-release.php and template-invoice-finish.php (see editor/InvoiceFinish.php) — the Finish page reuses these same .invoice-release__* classes rather than duplicating an identical stylesheet. ========================================================================== */ /* Defined on :root (not just .invoice-release) because the reject popover (release.js) is appended directly to to escape the scrollable table wrapper — it isn't a descendant of .invoice-release, so scoping these vars there left it with no --rev-* values (invisible submit button). */ :root { --rev-bg: var(--inv-bg, #f8f5f2); --rev-accent: var(--inv-accent, #e73801); --rev-text: var(--inv-text, #1c1c1c); --rev-muted: var(--inv-muted, #6b6b6b); --rev-border: var(--inv-border, #ccc9c5); --rev-radius: 4px; --rev-success: var(--inv-success, #2a6e3a); --rev-success-bg: var(--inv-success-bg, #edf7f0); --rev-error-bg: var(--inv-error-bg, #fdf0ec); } .invoice-release { font-size: 0.875rem; color: var(--rev-text); } /* ── Header ── */ .invoice-release__header { display: flex; align-items: center; flex-wrap: wrap; gap: 0.75rem 1rem; padding-bottom: 0.75rem; margin-bottom: 0.75rem; border-bottom: 2px solid var(--rev-border); } .invoice-release__title { margin: 0; font-size: 1.15rem; font-weight: 700; } .invoice-release__count { font-size: 0.8rem; color: var(--rev-muted); } /* ── Filters (Release page only — see InvoiceRelease.php) ── */ .invoice-release__filters { display: flex; align-items: center; flex-wrap: wrap; gap: 0.5rem; padding-bottom: 0.75rem; margin-bottom: 0.75rem; border-bottom: 1px solid var(--rev-border); } .invoice-release__filter-group { display: flex; align-items: center; gap: 0.3rem; white-space: nowrap; } .invoice-release__filter-group label { font-size: 0.75rem; font-weight: 600; text-transform: uppercase; color: var(--rev-muted); } .invoice-release__filter-group input[type="date"], .invoice-release__filter-group select { padding: 0.3em 0.5em; border: 1px solid var(--rev-border); border-radius: var(--rev-radius); font-size: 0.8rem; background: #fff; color: var(--rev-text); } .invoice-release__filter-btn { padding: 0.35em 1em; background: var(--rev-accent); color: #fff; border: none; border-radius: 4em; font-size: 0.8em; font-weight: 600; cursor: pointer; white-space: nowrap; text-decoration: none; display: inline-flex; align-items: center; transition: opacity 0.15s; } .invoice-release__filter-btn:hover { opacity: 0.85; } .invoice-release__filter-btn--ghost { background: transparent; color: var(--rev-text); border: 1px solid var(--rev-border); } .invoice-release__filter-btn--ghost:hover { border-color: var(--rev-accent); color: var(--rev-accent); opacity: 1; } /* ── Bulk action ("Release Selected" / "Finish Selected") ── */ .invoice-release__bulk-action { display: flex; align-items: center; gap: 0.5rem; margin-left: auto; } .invoice-release__bulk-btn { padding: 0.35em 1em; background: var(--rev-accent); color: #fff; border: none; border-radius: 4em; font-size: 0.8em; font-weight: 600; cursor: pointer; white-space: nowrap; transition: opacity 0.15s; } .invoice-release__bulk-btn:hover { opacity: 0.85; } .invoice-release__bulk-btn:disabled { opacity: 0.4; cursor: not-allowed; } /* ── Empty / access denied ── */ .invoice-release__empty, .invoice-release__access-denied { color: var(--rev-muted); font-size: 0.9rem; } /* ── Table wrapper (horizontal scroll) ── */ .invoice-release__table-wrap { overflow-x: auto; border: 1px solid var(--rev-border); border-radius: var(--rev-radius); } /* ── Table ── */ .invoice-release__table { width: 100%; border-collapse: collapse; font-size: 0.82rem; table-layout: fixed; } .invoice-release__th { position: sticky; top: 0; background: var(--rev-bg); border-bottom: 2px solid var(--rev-border); padding: 0.5rem 0.6rem; text-align: left; font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; color: var(--rev-muted); white-space: nowrap; z-index: 1; } .invoice-release__td { height: 2.3rem; padding: 0.35rem 0.6rem; border-bottom: 1px solid var(--rev-border); vertical-align: middle; box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .invoice-release__row:last-child .invoice-release__td { border-bottom: none; } .invoice-release__row:hover .invoice-release__td { background: rgba(231, 56, 1, 0.03); } /* Rows fade out once approved */ .invoice-release__row--done { opacity: 0; transition: opacity 0.35s ease; } /* ── Column widths ── */ .invoice-release__th--check, .invoice-release__td--check { width: 28px; padding: 0.4rem 0.4rem 0.4rem 0.6rem; } .invoice-release__th--id, .invoice-release__td--id { width: 60px; color: var(--rev-muted); font-size: 0.72rem; } .invoice-release__th--action, .invoice-release__td--action { width: 230px; white-space: normal; } .invoice-release__th--number, .invoice-release__td--number { width: 130px; } .invoice-release__th--date, .invoice-release__td--date { width: 130px; } .invoice-release__th--supplier, .invoice-release__td--supplier { width: 160px; } .invoice-release__th--amount, .invoice-release__td--amount { width: 110px; } .invoice-release__th--project, .invoice-release__td--project { width: 140px; } .invoice-release__th--konto, .invoice-release__td--konto { width: 200px; } .invoice-release__th--payment, .invoice-release__td--payment { width: 140px; } .invoice-release__th--pdf, .invoice-release__td--pdf { width: 60px; } /* ── Confirm button + row message ── */ .invoice-release__confirm-btn { padding: 0.3em 0.9em; background: var(--rev-accent); color: #fff; border: none; border-radius: 4em; font-size: 0.76rem; font-weight: 600; cursor: pointer; white-space: nowrap; transition: opacity 0.15s; } .invoice-release__confirm-btn:hover { opacity: 0.85; } .invoice-release__confirm-btn:disabled { opacity: 0.4; cursor: not-allowed; } /* ── Reject button + popover ── */ .invoice-release__reject-btn { padding: 0.3em 0.9em; background: transparent; color: var(--rev-text); border: 1px solid var(--rev-border); border-radius: 4em; font-size: 0.76rem; font-weight: 600; cursor: pointer; white-space: nowrap; transition: opacity 0.15s, border-color 0.15s; } .invoice-release__reject-btn:hover { border-color: var(--rev-accent); color: var(--rev-accent); } .invoice-release__reject-btn:disabled { opacity: 0.4; cursor: not-allowed; } /* Appended to and positioned under the reject button by release.js — kept out of .table-wrap so overflow-x:auto can never clip it. */ .invoice-release__reject-popover { position: absolute; z-index: 9999; width: 260px; padding: 0.75rem; background: #fff; border: 1px solid var(--rev-border); border-radius: calc(var(--rev-radius) * 2); box-shadow: 0 6px 20px rgba(0,0,0,0.18); } .invoice-release__reject-label { display: block; margin-bottom: 0.35rem; font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.03em; color: var(--rev-muted); } .invoice-release__reject-textarea { width: 100%; min-height: 4.5em; padding: 0.4em 0.5em; border: 1px solid var(--rev-border); border-radius: var(--rev-radius); font-size: 0.82rem; font-family: inherit; resize: vertical; box-sizing: border-box; } .invoice-release__reject-textarea:focus { outline: 2px solid var(--rev-accent); outline-offset: -1px; } .invoice-release__reject-actions { display: flex; justify-content: flex-end; gap: 0.5rem; margin-top: 0.6rem; } .invoice-release__reject-cancel, .invoice-release__reject-submit { padding: 0.3em 0.9em; border: none; border-radius: 4em; font-size: 0.76rem; font-weight: 600; cursor: pointer; white-space: nowrap; } .invoice-release__reject-cancel { background: transparent; color: var(--rev-text); border: 1px solid var(--rev-border); } .invoice-release__reject-submit { background: var(--rev-accent); color: #fff; } .invoice-release__reject-submit:hover { opacity: 0.85; } .invoice-release__reject-submit:disabled { opacity: 0.4; cursor: not-allowed; } .invoice-release__row-msg { display: inline-block; margin-left: 0.5em; font-size: 0.74rem; font-weight: 600; } .invoice-release__row-msg--success { color: var(--rev-success); } .invoice-release__row-msg--error { color: var(--rev-accent); } /* ── Spinner ── */ .invoice-release__spinner { width: 0.8rem; height: 0.8rem; margin-left: 0.4em; border: 2px solid var(--rev-border); border-top-color: var(--rev-accent); border-radius: 50%; animation: inv-spin 0.7s linear infinite; vertical-align: middle; display: inline-block; } .invoice-release__spinner[hidden] { display: none; } /* ── PDF link ── */ .invoice-release__pdf-link { display: inline-flex; align-items: center; padding: 0.1em 0.4em; background: var(--rev-accent); color: #fff; border-radius: 3px; font-size: 0.68rem; font-weight: 700; text-decoration: none; } .invoice-release__pdf-link:hover { opacity: 0.85; } /* ── Pagination ── */ .invoice-release__pagination { display: flex; align-items: center; justify-content: center; gap: 1rem; padding: 0.75rem 0; margin-top: 1rem; } .invoice-release__page-btn { padding: 0.35em 1em; border: 1px solid var(--rev-border); border-radius: 4em; text-decoration: none; color: var(--rev-text); font-size: 0.82rem; transition: border-color 0.15s; } .invoice-release__page-btn:hover { border-color: var(--rev-accent); color: var(--rev-accent); } .invoice-release__page-info { font-size: 0.82rem; color: var(--rev-muted); }