/* Staff page layout. Colours come from the kit's theme tokens only (light and dark). Class prefix inv-. */

.inv-booting .inv-header,
.inv-booting .inv-main { visibility: hidden; }
.inv-boot { display: none; }
.inv-booting .inv-boot { display: flex; position: fixed; inset: 0; align-items: center; justify-content: center; background: var(--background-primary); z-index: 50; }

body.inv-shell { background: var(--background-primary); color: var(--text-primary); min-height: 100vh; }

.inv-header { display: flex; align-items: center; gap: 1rem; padding: 0.5rem 1rem; border-bottom: 1px solid var(--border-color, rgba(128, 128, 128, 0.3)); background: var(--background-secondary, var(--background-primary)); flex-wrap: wrap; }
.inv-brand { display: flex; align-items: center; gap: 0.5rem; color: var(--text-primary); font-weight: 600; }
.inv-brand-name { font-size: 1rem; }
.inv-menubar { flex: 1 1 auto; min-width: 0; }
.inv-user { display: flex; align-items: center; gap: 0.25rem; white-space: nowrap; }
.inv-user-name { color: var(--text-primary); }

.inv-main { padding: 1rem 1.25rem 3rem; max-width: 1600px; margin: 0 auto; outline: none; }

.inv-bars .notification { margin: 0; border-radius: 0; padding: 0.4rem 1rem; font-weight: 600; }

.inv-signin { max-width: 26rem; margin: 3rem auto; }
.inv-form .field { margin-bottom: 0.75rem; }

.inv-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); gap: 1rem; }
.inv-card { margin-bottom: 0 !important; }
.inv-card-title { font-weight: 700; font-size: 1.05rem; }
.inv-card-count { margin: 0.25rem 0; }
.inv-old-rule { margin-top: 0.5rem; opacity: 0.75; border-top: 1px dashed var(--border-color, rgba(128, 128, 128, 0.4)); padding-top: 0.25rem; }

.inv-filters .field { margin-bottom: 0.25rem; }
.inv-filters .columns { margin-bottom: 0.25rem; }
.inv-filters .select, .inv-filters .select select { width: 100%; }

.inv-table td, .inv-table th { vertical-align: top; }
.inv-sort { background: none; border: 0; padding: 0; font: inherit; font-weight: 600; color: inherit; cursor: pointer; }
.inv-pager { display: flex; align-items: center; gap: 0.75rem; margin-top: 0.5rem; flex-wrap: wrap; }
.inv-totals { margin: 0.5rem 0; }
tr.is-clickable { cursor: pointer; }

.inv-note { font-size: 0.75rem; opacity: 0.7; white-space: pre-line; max-height: 3.2em; overflow: hidden; }
.inv-clip { display: inline-block; max-width: 28rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: bottom; }
.inv-pre, .inv-notes { white-space: pre-wrap; overflow-wrap: anywhere; }
.inv-reseller { border-left: 3px solid var(--accent-color); padding-left: 0.4rem; }
.inv-voided { opacity: 0.55; text-decoration: line-through; }
.inv-differs td { font-weight: 600; }
.is-nowrap { white-space: nowrap; }

.inv-doc-head { display: flex; align-items: baseline; gap: 1rem; flex-wrap: wrap; }
.inv-actions { margin: 0.5rem 0 1rem; }
.inv-meta th { white-space: nowrap; padding-right: 1rem; font-weight: 600; }
.inv-secret { font-family: monospace; font-size: 1.1rem; letter-spacing: 0.05em; user-select: all; }

.inv-lines input.input { min-width: 4rem; }
.inv-lines td { padding: 0.15rem 0.25rem; }

@media print {
	.inv-header, .inv-bars, .inv-actions, .inv-filters, .inv-pager, .button { display: none !important; }
	.inv-main { padding: 0; }
}

/* step 7: the mail body as sent, in a sandboxed frame */
.inv-mail-frame { width: 100%; height: 26rem; border: 1px solid var(--cuk-border-color, #ccc); background: #fff; }
.inv-template-body { font-family: ui-monospace, Menlo, monospace; font-size: 12px; min-height: 16rem; }
/* Settings screen: labels of the system settings, addresses to copy into other systems */
.inv-setting-label { width: 18rem; font-weight: 600; }
.inv-copy { user-select: all; overflow-wrap: anywhere; }