/* nuBuilder Next – small layer on top of Bootstrap 5.3 (works in light and dark mode) */

:root {
	--nu-accent: #2f6fd6;
	--nu-accent-2: #1fa39a;
	--nu-surface: var(--bs-body-bg);
	--nu-page: #f4f6f9;
}
[data-bs-theme="dark"] {
	--nu-page: #14171c;
	--nu-surface: #1c2027;
}

body.nu-app, body.nu-center { background: var(--nu-page); }
.card { --bs-card-bg: var(--nu-surface); }
.card-header { background: transparent; }

/* navbar */
.nu-navbar { background: var(--nu-surface); }
/* 0.8.483: the navigation bar spans the window – the logo sits at the left with a small margin, the same on every page; the scrollbar's
   room is always kept, so nothing shifts between pages with and without a scrollbar */
.nu-navbar .nuNavInner { padding-inline: 1rem; }
/* page content (0.8.490): full width with the top bar's 1rem on both sides – the left edge lines up with the logo; centred only above 1920 px */
.nuContainer { width: 100%; max-width: 1920px; margin-inline: auto; padding-inline: 1rem; }
@media (max-width: 575.98px) { .nuContainer { padding-inline: .75rem; } }   /* phones: Bootstrap's gutter as before – every pixel counts for button rows */
html { scrollbar-gutter: stable; }
.nu-navbar .nav-link { border-radius: .5rem; padding-inline: .75rem !important; }
.nu-navbar .nav-link.active { background: var(--bs-primary-bg-subtle); color: var(--bs-primary-text-emphasis); }
.nu-user-name { max-width: 12rem; }

.nu-logo {
	display: inline-grid; place-items: center;
	width: 2rem; height: 2rem; border-radius: .6rem;
	background: linear-gradient(135deg, var(--nu-accent), var(--nu-accent-2));
	color: #fff; font-weight: 700; font-size: .95rem; letter-spacing: -.02em;
}
.nu-logo-lg { width: 3.25rem; height: 3.25rem; border-radius: .9rem; font-size: 1.4rem; }
/* nuBuilder Next logo (nu_brand_logo): light / dark version follow the theme */
.nu-brand { display: inline-flex; align-items: center; line-height: 1; }
.nu-brand img { height: 2rem; width: auto; max-width: 100%; }
.nu-brand-lg img { height: 3.5rem; }
.nu-brand .nu-brand-dark, [data-bs-theme="dark"] .nu-brand .nu-brand-light { display: none; }
[data-bs-theme="dark"] .nu-brand .nu-brand-dark { display: inline; }
.navbar-brand .nu-brand img { height: 1.9rem; }
@media (max-width: 380px) { .navbar-brand .nu-brand img { height: 1.6rem; } }
/* branding (0.8.297, Admin tools → Branding): own logo – any aspect ratio, at most 32 px high in the top bar, 72 px on sign-in pages;
   title next to it; environment label (colour from the generated ?p=brand&a=css) and a line of its colour at the top of the page */
.nu-brand-own img { height: auto; max-height: 2rem; max-width: 12rem; object-fit: contain; }
.navbar-brand .nu-brand-own img { height: auto; max-height: 2rem; }
.nu-brand-own.nu-brand-lg img { max-height: 4.5rem; max-width: 16rem; }
.nu-brand-title { font-weight: 600; font-size: 1.05rem; color: var(--bs-emphasis-color); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 18rem; }
@media (max-width: 575.98px) { .nu-brand-title { max-width: 9rem; font-size: .95rem; } }
.nuEnvLabel { display: inline-block; padding: .2rem .55rem; border-radius: .375rem; font-size: .75rem; font-weight: 700; letter-spacing: .05em;
	text-transform: uppercase; line-height: 1.2; background: #dc3545; color: #fff; white-space: nowrap; }
html.nu-env .nu-navbar, html.nu-env body:not(.nu-app) { border-top: 4px solid var(--nu-env, #dc3545); }
.brandPreviewBox { border: 1px solid var(--bs-border-color); border-radius: .5rem; padding: 1rem; background: var(--bs-body-bg); }
.brandLogoPrev { max-height: 4rem; max-width: 14rem; }
.brandLogoPrevDark { background: #1c2027; padding: .5rem; border-radius: .375rem; }

/* centered pages (login, errors) */
.nu-center { min-height: 100vh; display: flex; align-items: center; justify-content: center; padding: 1.5rem 1rem; }
.nu-card-narrow { width: 100%; max-width: 26rem; }
.nu-card-narrow.ufCard { max-width: 39rem; }  /* custom user field edit form (0.8.597): 50 % wider */
.ufCard .ufEditBy { max-width: 360px; }   /* 0.8.598: wider "Edited by" on desktop (Type gets col-lg-4), the long option fits */
.nu-login { background:
	radial-gradient(60rem 30rem at 10% -10%, rgba(47, 111, 214, .12), transparent 60%),
	radial-gradient(50rem 30rem at 110% 110%, rgba(31, 163, 154, .12), transparent 60%),
	var(--nu-page); }

/* login page from $nuWelcomeBodyInnerHTML (nuconfig.php); nuBuilder's class names nuLogin, nuLoginInput, nuButton look like nuBuilder Next */
.nu-login-custom { min-height: 100vh; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 3.5rem 1rem 1.5rem; }
.nu-login-tools { position: absolute; top: 1rem; inset-inline-end: 1rem; display: flex; gap: .5rem; }
.nu-login-msg { width: 100%; max-width: 26rem; }
.nu-login-custom .nuLogin { width: fit-content; max-width: 100%; margin: 0 auto; padding: 2rem; border-radius: var(--bs-border-radius-lg);
	background: var(--bs-body-bg); box-shadow: var(--bs-box-shadow-sm); }
.nu-login-custom .nuLogin table { margin: 0 auto; }
.nu-login-custom .nuLogin img { max-width: 100%; height: auto; }
.nu-login-custom .nuLoginInput { display: block; width: 16rem; max-width: 100%; padding: .45rem .75rem; color: var(--bs-body-color);
	background: var(--bs-body-bg); border: var(--bs-border-width) solid var(--bs-border-color); border-radius: var(--bs-border-radius); }
.nu-login-custom .nuLoginInput:focus { outline: 0; border-color: #86b7fe; box-shadow: 0 0 0 .1rem rgb(140 180 239 / 8%); }
.nu-login-custom .nuButton { padding: .4rem 1rem; color: #fff; background: var(--bs-primary); border: 0; border-radius: var(--bs-border-radius); cursor: pointer; }
.nu-login-custom .nuButton:hover { filter: brightness(.92); }

/* inputs with a suggestion list (HTML5 datalist): always show an arrow like a select. Chrome draws its own arrow only on
   hover and Bootstrap hides it, so the arrow is a background image (same as .form-select) and a click on it opens the
   list (assets/js/nuapp.js, showPicker). Not with a validation icon (is-invalid / is-valid use the same place). */
:root { --nu-datalist-arrow: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"); }
[data-bs-theme="dark"] { --nu-datalist-arrow: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23dee2e6' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"); }
input.form-control[list]:not(.is-invalid):not(.is-valid) {
	padding-inline-end: 2.25rem; background-image: var(--nu-datalist-arrow); background-repeat: no-repeat;
	background-position: right .75rem center; background-size: 16px 12px; }

/* lighter focus ring on inputs */
.form-control:focus { box-shadow: 0 0 0 .1rem rgb(140 180 239 / 8%); }

/* password field with eye button inside a floating label */
.nu-pw { position: relative; }
.nu-pw .form-control { padding-inline-end: 3rem; }
.nu-pw-toggle { position: absolute; inset-inline-end: .25rem; top: 50%; transform: translateY(-50%); color: var(--bs-secondary-color); z-index: 5; }

/* home tiles */
.nu-tile { transition: transform .12s ease, box-shadow .12s ease; border: 1px solid var(--bs-border-color-translucent); }
.nu-tile:hover { transform: translateY(-2px); box-shadow: 0 .5rem 1.25rem rgba(0, 0, 0, .08) !important; }
.nu-tile-icon {
	display: inline-grid; place-items: center; width: 3rem; height: 3rem; border-radius: .8rem;
	background: var(--bs-primary-bg-subtle); color: var(--bs-primary-text-emphasis); font-size: 1.4rem;
}

/* tables */
.nu-table thead th { font-size: .8rem; text-transform: uppercase; letter-spacing: .03em; color: var(--bs-secondary-color); font-weight: 600; white-space: nowrap; }
.nu-sort { color: inherit; text-decoration: none; }
.nu-sort:hover { color: var(--bs-body-color); }
.card > .table-responsive:first-child .table { border-top-left-radius: var(--bs-card-inner-border-radius); }

/* rights grid */
.nu-rights-wrap { max-height: 65vh; overflow: auto; }
.nu-rights thead th { background: var(--nu-surface); font-weight: 600; z-index: 2; }
.nu-rights .form-check-input { cursor: pointer; }
.nu-rights-filter { max-width: 15rem; }
/* access level: the blue Add button sits between grey ones – in an input group the next button covers its right border (0.8.485) */
.input-group > .js-add-form-btn { position: relative; z-index: 4; }   /* Bootstrap gives every .btn of an input group z-index 2 – the later one wins; 5 = hover / focus */
.ts-dropdown.nuAddFormDd { z-index: 1050; }   /* above the sticky header and selects of the rights grid, below dialogs (0.8.486) */
.nu-scroll { max-height: 18rem; overflow: auto; }

/* sticky action bar at the bottom of edit screens */
.nu-actionbar {
	position: sticky; bottom: 0; z-index: 10;
	padding: .75rem 1rem; margin-inline: -.25rem;
	background: color-mix(in srgb, var(--nu-surface) 92%, transparent);
	backdrop-filter: blur(6px);
	border: 1px solid var(--bs-border-color-translucent); border-radius: .75rem;
}

fieldset[disabled] .form-control, fieldset[disabled] .form-select { background-color: var(--bs-tertiary-bg); }

@media print {
	.nu-navbar, .nu-actionbar, footer, .btn { display: none !important; }
	body.nu-app { background: #fff; }
}

/* breathing room at the card edges of tables */
.card .table > :not(caption) > * > *:first-child { padding-inline-start: 1rem; }
.card .table > :not(caption) > * > *:last-child { padding-inline-end: 1rem; }
.breadcrumb a { text-decoration: none; }
.nu-row-link { cursor: pointer; }
/* scroll box = containing block: absolutely positioned children (e.g. .visually-hidden headers) stay inside it and do not widen the page on phones */
.table-responsive { position: relative; }

/* 2FA */
.nuQr { width: 200px; height: 200px; background: #fff; padding: 6px; border-radius: .5rem; border: 1px solid var(--bs-border-color); }
.nuQr svg { width: 100%; height: 100%; display: block; }
.nuSecret { font-size: .95rem; letter-spacing: .05em; }
.nuOtp { font-size: 1.4rem; letter-spacing: .35em; text-align: center; }
.nu-logo-lg .bi { font-size: 1.5rem; }

/* ---------------------------------------------------------------- e-mail */
.nuMailBody { display: block; width: 100%; min-height: 480px; border: 0; border-radius: var(--bs-card-border-radius); background: #fff; }
.nuMailDebug { max-height: 460px; overflow: auto; white-space: pre-wrap; word-break: break-word; }
.nuPurgeDays { width: 5.5rem; }
.nuPreWrap { white-space: pre-wrap; }

/* ---------------------------------------------------------------- formats */
.nuNegative { color: var(--bs-danger) !important; }
.nuFmtType { font-weight: 600; }
.nuFmtType-D { background: var(--bs-info-bg-subtle); color: var(--bs-info-text-emphasis); }
.nuFmtType-N { background: var(--bs-success-bg-subtle); color: var(--bs-success-text-emphasis); }
.nuFmtType-T { background: var(--bs-warning-bg-subtle); color: var(--bs-warning-text-emphasis); }
.nuFmtKey { font-size: .95em; white-space: pre; }
#fmtTable tbody tr[data-format-id], #fmtTable tbody tr[data-format-key] { cursor: pointer; }
.nuFmtBuiltin td { color: var(--bs-secondary-color); }
.nfdMono { font-family: var(--bs-font-monospace); }
.nfdResult { border: 1px solid var(--bs-border-color); border-radius: var(--bs-border-radius); padding: .75rem 1rem; background: var(--bs-tertiary-bg); }
.nfdResult code { white-space: pre; }
.nfdPreview { display: grid; gap: .25rem; margin-top: .25rem; }
.nfdPreviewRow { display: flex; align-items: center; flex-wrap: wrap; }
.nfdLegend { display: flex; flex-wrap: wrap; gap: .25rem 1rem; color: var(--bs-secondary-color); }
.nbFormatPick { display: flex; gap: .25rem; }
.nbFormatPick select { min-width: 0; }

/* Mobile: dropdowns of the collapsed navbar open to the right of their button (Bootstrap positions navbar menus statically,
   so right-aligned menus of buttons at the left edge would leave the screen) */
@media (max-width: 767.98px) {
	.nu-navbar .dropdown-menu-end[data-bs-popper] { inset-inline-end: auto; inset-inline-start: 0; max-width: calc(100vw - 2rem); }
}

/* ---------------------------------------------------------------- e-mail templates */
.emtFields { max-height: 70vh; overflow: auto; }
.emtField { display: grid; grid-template-columns: 1fr auto; gap: 0 .5rem; padding: .35rem .75rem; }
.emtFieldLabel { font-size: .875rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.emtFieldId { font-size: .8rem; }
.emtFieldMeta { grid-column: 1 / -1; font-size: .75rem; color: var(--bs-secondary-color); }
.emtActive { border-color: var(--bs-primary) !important; box-shadow: 0 0 0 .15rem rgba(var(--bs-primary-rgb), .15); }
.emtRecord { width: 9rem; }
/* e-mail template: code, description and recipients fold away (0.8.432) */
.nuEmtHead > summary { display: flex; align-items: center; gap: .5rem; min-width: 0; cursor: pointer; list-style: none; padding: .15rem 0; border-radius: .375rem; }
.nuEmtHead > summary::-webkit-details-marker { display: none; }
.nuEmtHead > summary:focus-visible { outline: 2px solid var(--bs-primary); outline-offset: 2px; }
.nuEmtHead > .row { margin-top: 0; }
.nuEmtHead > summary { position: relative; z-index: 1; }
.nuEmtChev { transition: transform .15s; color: var(--bs-secondary-color); }
.nuEmtHead[open] .nuEmtChev { transform: rotate(90deg); }
.nuEmtHeadInfo { min-width: 0; flex: 1 1 auto; }
.nuEmtHead[open] .nuEmtHeadInfo { display: none; }
.emtTestTo { width: 16rem; max-width: 100%; }
.emtPreview { min-height: 260px; border-top: 1px solid var(--bs-border-color); border-radius: 0; }
@media (min-width: 1200px) { .emtFieldsCard { position: sticky; top: calc(var(--nu-sticky-top, 57px) + var(--nu-sticky-h, 0px) + 1rem); } }

/* ---------------------------------------------------------------- items */
.itemCard { max-width: 820px; }
.itemSort { max-width: 8rem; }
.itemIconPreview { min-width: 2.6rem; justify-content: center; }

/* ---------------------------------------------------------------- debug */
.debugMsg { font-size: .8rem; white-space: pre-wrap; word-break: break-word; background: var(--bs-tertiary-bg); border-radius: var(--bs-border-radius); padding: .5rem .75rem; }
.debugCollapsed { max-height: 14rem; overflow: hidden; -webkit-mask-image: linear-gradient(#000 75%, transparent); mask-image: linear-gradient(#000 75%, transparent); }
.debugFirst { max-width: 60ch; }
.nu-navbar .nav-link { white-space: nowrap; }

/* ---------------------------------------------------------------- sessions */
.nuSessDot { display: inline-block; width: .6rem; height: .6rem; border-radius: 50%; margin-inline-end: .35rem; vertical-align: middle; }
.nuSessActive { background: var(--bs-success); }
.nuSessIdle { background: var(--bs-warning); }

/* Save / Clone / Delete of records (0.8.199): one quiet style as in nuBuilder – light background, thin border, dark text with a
   Bootstrap icon. Only Save changes, while there are unsaved changes: red text and icon on a slightly red background
   (.nuSaveEdited, set by assets/js/nuapp.js, the form runtime and the editors; the builder uses .nbDirty). */
.btn.nuBtnAct {
	--bs-btn-color: var(--bs-body-color); --bs-btn-bg: var(--bs-tertiary-bg); --bs-btn-border-color: var(--bs-border-color);
	--bs-btn-hover-color: var(--bs-emphasis-color); --bs-btn-hover-bg: var(--bs-secondary-bg); --bs-btn-hover-border-color: var(--bs-secondary-border-subtle, var(--bs-border-color));
	--bs-btn-active-color: var(--bs-emphasis-color); --bs-btn-active-bg: var(--bs-secondary-bg); --bs-btn-active-border-color: var(--bs-border-color);
	--bs-btn-disabled-color: var(--bs-secondary-color); --bs-btn-disabled-bg: var(--bs-tertiary-bg); --bs-btn-disabled-border-color: var(--bs-border-color);
	--bs-btn-focus-shadow-rgb: var(--bs-secondary-rgb);
	border-radius: .5rem; font-weight: 400;
}
.btn.nuBtnAct > .bi { margin-inline-end: .45rem !important; }
.btn.nuBtnSave.nuSaveEdited, #nbSave.nbDirty {
	--bs-btn-color: var(--bs-danger); --bs-btn-bg: rgba(var(--bs-danger-rgb), .05); --bs-btn-border-color: rgba(var(--bs-danger-rgb), .25);
	--bs-btn-hover-color: var(--bs-danger); --bs-btn-hover-bg: rgba(var(--bs-danger-rgb), .1); --bs-btn-hover-border-color: rgba(var(--bs-danger-rgb), .4);
	--bs-btn-active-color: var(--bs-danger); --bs-btn-active-bg: rgba(var(--bs-danger-rgb), .14); --bs-btn-active-border-color: rgba(var(--bs-danger-rgb), .45);
	--bs-btn-disabled-color: var(--bs-danger); --bs-btn-disabled-bg: rgba(var(--bs-danger-rgb), .05); --bs-btn-disabled-border-color: rgba(var(--bs-danger-rgb), .25);
	--bs-btn-focus-shadow-rgb: var(--bs-danger-rgb);
}
[data-bs-theme="dark"] .btn.nuBtnSave.nuSaveEdited, [data-bs-theme="dark"] #nbSave.nbDirty {
	--bs-btn-color: #ff8e98; --bs-btn-hover-color: #ffa8b0; --bs-btn-active-color: #ffa8b0; --bs-btn-disabled-color: #ff8e98;
	--bs-btn-bg: rgba(var(--bs-danger-rgb), .14); --bs-btn-border-color: rgba(var(--bs-danger-rgb), .45);
}

/* nuBuilder Forte's class nuActionButton (0.8.631) for buttons that form code makes itself (e.g. $('<button class="nuActionButton">')):
   Forte's size and spacing, the colours of .nuBtnAct (light and dark mode). nuBuilder Next's own buttons carry .btn and are not
   affected. :where() keeps the specificity of one class, so a rule .nuActionButton { … } in Setup → Style or Global code wins. */
.nuActionButton:where(:not(.btn)) {
	display: inline-flex; align-items: center; gap: .25rem; height: 31px; padding: 0 6px; margin-left: 8px; vertical-align: top;
	font: inherit; font-size: 14px; font-weight: 500; line-height: 1; white-space: nowrap;
	color: var(--bs-body-color); background-color: var(--bs-tertiary-bg); border: 1px solid var(--bs-border-color); border-radius: 6px;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .02); cursor: pointer; transition: background-color .2s, box-shadow .2s;
}
.nuActionButton:where(:not(.btn)):hover { color: var(--bs-emphasis-color); background-color: var(--bs-secondary-bg); box-shadow: 0 2px 4px rgba(0, 0, 0, .06); }
.nuActionButton:where(:not(.btn)):active:not([disabled]) { box-shadow: inset 0 0 1px rgba(0, 0, 0, .15); transform: translateY(1px) scale(.98); }
.nuActionButton:where(:not(.btn)):focus-visible { outline: 0; box-shadow: 0 0 0 .2rem rgba(var(--bs-secondary-rgb), .35); }
.nuActionButton:where(:not(.btn)):disabled { opacity: .55; cursor: default; }
.nuActionButton:where(:not(.btn)) > .bi, .nuActionButton:where(:not(.btn)) > .fa { line-height: 1; }
span.nuActionButton:where(:not(.btn)) { border-radius: 3px; margin: 5px 0 0; }
.nuActionButtonIcon { height: 28px; width: 28px; }

/* documentation (?p=help) */
.nuHelpSide { position: sticky; top: calc(var(--nu-sticky-top, 57px) + var(--nu-sticky-h, 0px) + 1rem); max-height: calc(100vh - var(--nu-sticky-top, 57px) - var(--nu-sticky-h, 0px) - 2rem); overflow-y: auto; }
.nuHelpToc a { display: block; padding: .15rem .5rem; border-radius: .375rem; text-decoration: none; color: var(--bs-body-color); }
.nuHelpToc a:hover, .nuHelpToc a.active { background: var(--bs-secondary-bg); }
.nuHelpToc .nuHelpToc2 { font-weight: 600; margin-top: .35rem; }
.nuHelpToc .nuHelpTocPage { font-size: .9rem; padding-inline-start: 1rem; }
.nuHelpToc .nuHelpToc3 { font-size: .8125rem; padding-inline-start: 2rem; color: var(--bs-secondary-color); }
.nuHelpToc .nuHelpTocSubs { display: none; }                                   /* h3 entries: only of the open page, or while searching */
.nuHelpToc li.nuOpen > .nuHelpTocSubs, .nuHelpToc.nuHelpTocSearching .nuHelpTocSubs { display: block; }
.nuHelpToc > ul > li > .nuHelpTocSubs .nuHelpToc3 { padding-inline-start: 1rem; }   /* a chapter's own h3 */
/* documentation pages (docs/pages/, see docs/toc.json) */
.nuHelpBody .doc-num { color: var(--bs-secondary-color); font-weight: 400; margin-inline-end: .35rem; }
.nuHelpToc .doc-num { color: var(--bs-secondary-color); font-weight: 400; margin-inline-end: .25rem; }
.nuHelpBody section[data-nu-level="1"] { border-inline-start: 4px solid var(--nu-accent); }
.nuHelpBody .doc-lead { font-size: 1.05rem; color: var(--bs-secondary-color); }
.nuHelpBody .doc-for { font-size: .8rem; color: var(--bs-secondary-color); margin-top: -.5rem; }
.nuHelpBody .doc-adv { background: var(--bs-info-bg-subtle); color: var(--bs-info-text-emphasis); font-weight: 600; vertical-align: .1em; }
.nuHelpBody .doc-see { font-size: .9rem; border-top: 1px solid var(--bs-border-color-translucent); padding-top: .5rem; margin-top: 1rem; }
.nuHelpBody details.doc-src { font-size: .85rem; color: var(--bs-secondary-color); }
.nuHelpBody details.doc-src ul { margin: .25rem 0 0; columns: 2; }
.nuHelpBody pre.doc-diagram { white-space: pre; overflow-x: auto; }
/* help diagrams as inline SVG (0.8.494, architecture request flow): colours by class, light and dark */
.nuHelpBody .doc-figure { margin: 1rem 0 1.25rem; overflow-x: auto; }
.nuHelpBody svg.doc-flow { display: block; width: 100%; max-width: 680px; min-width: 520px; height: auto; font-family: var(--bs-body-font-family); }
.nuHelpBody svg.doc-flow-wide { max-width: 760px; min-width: 580px; }
.doc-flow .dg-t { font-size: 14px; font-weight: 500; text-anchor: middle; }
.doc-flow .dg-s { font-size: 12px; text-anchor: middle; }
.doc-flow .dg-lbl { font-size: 11px; text-anchor: middle; fill: #6c6a64; }
.doc-flow .dg-start { text-anchor: start; }
.doc-flow .dg-end { text-anchor: end; }
.doc-flow .dg-box.dg-a { fill: #faeeda; stroke: #ba7517; }
.doc-flow .dg-t.dg-a { fill: #633806; } .doc-flow .dg-s.dg-a { fill: #854f0b; }
[data-bs-theme="dark"] .doc-flow .dg-box.dg-a { fill: #3b2a12; stroke: #d99a3e; }
[data-bs-theme="dark"] .doc-flow .dg-t.dg-a { fill: #fbe3bd; } [data-bs-theme="dark"] .doc-flow .dg-s.dg-a { fill: #efc27c; }
[data-bs-theme="dark"] .doc-flow .dg-lbl { fill: #a7adb4; }
.doc-flow .dg-box { stroke-width: .5px; }
.doc-flow .dg-line { fill: none; stroke: #898781; stroke-width: 1.5px; }
.doc-flow .dg-sep { fill: none; stroke: #898781; stroke-width: .5px; stroke-dasharray: 4 3; }
.doc-flow .dg-head { fill: none; stroke: #898781; stroke-width: 1.5px; stroke-linecap: round; stroke-linejoin: round; }
.doc-flow .dg-box.dg-n { fill: #fcfcfb; stroke: rgba(11, 11, 11, .2); }
.doc-flow .dg-box.dg-p { fill: #eeedfe; stroke: #534ab7; }
.doc-flow .dg-box.dg-g { fill: #e1f5ee; stroke: #0f6e56; }
.doc-flow .dg-t.dg-n { fill: #0b0b0b; } .doc-flow .dg-s.dg-n { fill: #52514e; }
.doc-flow .dg-t.dg-p { fill: #3c3489; } .doc-flow .dg-s.dg-p { fill: #534ab7; }
.doc-flow .dg-t.dg-g { fill: #085041; } .doc-flow .dg-s.dg-g { fill: #0f6e56; }
[data-bs-theme="dark"] .doc-flow .dg-box.dg-n { fill: #2b2f33; stroke: rgba(255, 255, 255, .25); }
[data-bs-theme="dark"] .doc-flow .dg-box.dg-p { fill: #2a2650; stroke: #8f86e8; }
[data-bs-theme="dark"] .doc-flow .dg-box.dg-g { fill: #133a30; stroke: #4cc39e; }
[data-bs-theme="dark"] .doc-flow .dg-t.dg-n { fill: #e9ecef; } [data-bs-theme="dark"] .doc-flow .dg-s.dg-n { fill: #adb5bd; }
[data-bs-theme="dark"] .doc-flow .dg-t.dg-p { fill: #d6d2ff; } [data-bs-theme="dark"] .doc-flow .dg-s.dg-p { fill: #b3acf5; }
[data-bs-theme="dark"] .doc-flow .dg-t.dg-g { fill: #bfeedd; } [data-bs-theme="dark"] .doc-flow .dg-s.dg-g { fill: #7fd8b8; }
[data-bs-theme="dark"] .doc-flow .dg-line, [data-bs-theme="dark"] .doc-flow .dg-sep, [data-bs-theme="dark"] .doc-flow .dg-head { stroke: #8d939a; }
.nuHelpBody dl.doc-glossary dt, .nuHelpBody dl.doc-faq dt { margin-top: .5rem; }
.nuHelpBody dl.doc-glossary dd, .nuHelpBody dl.doc-faq dd { margin-inline-start: 1rem; }
/* basic mode: "Show advanced topics" off (nuhelp.js) */
.nuHelpBasic .nuHelpBody [data-level="advanced"], .nuHelpBasic .nuHelpToc li.nuAdv { display: none !important; }
@media (max-width: 575.98px) { .nuHelpBody details.doc-src ul { columns: 1; } }
.nuHelpBody { max-width: 60rem; }
.nuHelpBody section { background: var(--nu-surface, var(--bs-body-bg)); border: 1px solid var(--bs-border-color-translucent); border-radius: .75rem; padding: 1.25rem 1.5rem; margin-bottom: 1.25rem; }
.nuHelpBody h2 { font-size: 1.35rem; margin-bottom: .75rem; }
.nuHelpBody h3 { font-size: 1.05rem; margin-top: 1.25rem; margin-bottom: .5rem; }
.nuHelpBody h2, .nuHelpBody h3, .nuHelpBody section, .nuHelpBody .doc-sub { scroll-margin-top: calc(var(--nu-sticky-top, 57px) + var(--nu-sticky-h, 0px) + 1rem); }
.nuHelpBody table { font-size: .9rem; }
.nuHelpBody code { word-break: break-word; }
.nuHelpBody pre.doc-code { background: var(--bs-tertiary-bg); border: 1px solid var(--bs-border-color); border-radius: .375rem; padding: .5rem .75rem; font-size: .8rem; white-space: pre-wrap; }
.nuHelpBody .doc-red { color: var(--bs-danger); font-weight: 600; }
.nuHelpBody .doc-badge { background: var(--bs-warning); color: #000; border-radius: .375rem; padding: 0 .4rem; font-size: .8rem; font-weight: 600; }
/* function reference (0.8.399, core/nufnref.php) */
/* function reference of the help (0.8.399; tabs and cards in the style of nuBuilder's wiki since 0.8.456 – core/nufnref.php) */
.nuFnTabs { margin: 1rem 0 .25rem; }
.nuFnTabCount { background: var(--bs-secondary-bg); color: var(--bs-secondary-color); font-weight: 500; font-size: .7rem; margin-inline-start: .15rem; }
.nuFnPane:not(.active) { display: none; }
.nuHelpSearching .nuFnPane { display: block; }
.nuFnPaneTitle { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.nuHelpSearching .nuFnPaneTitle { position: static; width: auto; height: auto; overflow: visible; clip: auto; margin: 1.25rem 0 .5rem; font-size: 1.1rem; }
.nuFnTools { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; margin: .75rem 0 .5rem; }
.nuFnTools .nuFnSearch { max-width: 350px; }
.nuFnGroupNav { display: flex; flex-wrap: wrap; gap: .35rem; margin: .25rem 0 .6rem; }
.nuFnGroupNav a { font-size: .8rem; text-decoration: none; padding: .2rem .55rem; border: 1px solid var(--bs-border-color); border-radius: 999px; color: var(--bs-body-color); background: var(--bs-body-bg); }
.nuFnGroupNav a:hover { border-color: var(--bs-primary); color: var(--bs-primary); }
.nuFnGroupNav a span { color: var(--bs-secondary-color); font-size: .72rem; }
.nuFnIndex { margin-bottom: .75rem; }
.nuFnIndex summary { cursor: pointer; font-weight: 600; font-size: .9rem; }
.nuFnAz { font-size: .8rem; margin-top: .5rem; line-height: 1.7; }
.nuFnLetter { margin-bottom: .25rem; }
.nuFnLetter b { display: inline-block; min-width: 1.25rem; }
.nuFnLetter a { margin-right: .5rem; white-space: nowrap; }
.nuFnGroup { margin-top: 1.25rem; }
.nuFnGroupTitle { font-size: 1.05rem; font-weight: 600; padding-bottom: .35rem; border-bottom: 2px solid var(--bs-border-color); margin-bottom: .75rem; scroll-margin-top: calc(var(--nu-sticky-top, 57px) + var(--nu-sticky-h, 0px) + 1rem); }
.nuFn { border: 1px solid var(--bs-border-color); border-radius: .5rem; background: var(--bs-body-bg); padding: .8rem 1rem .9rem; margin-bottom: .9rem; scroll-margin-top: calc(var(--nu-sticky-top, 57px) + var(--nu-sticky-h, 0px) + 1rem); }
.nuFn:target { box-shadow: 0 0 0 3px var(--bs-warning-border-subtle); }
.nuFnHead { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .5rem; margin-bottom: .5rem; }
.nuFnName { font-family: var(--bs-font-monospace); font-size: 1.05rem; font-weight: 600; margin: 0 .25rem 0 0; overflow-wrap: anywhere; }
.nuFnHead .badge { font-weight: 500; font-size: .7rem; }
.nuFnLink { margin-inline-start: auto; color: var(--bs-secondary-color); opacity: 0; transition: opacity .15s; }
.nuFn:hover .nuFnLink, .nuFnLink:focus { opacity: 1; }
.nuFnNb { background: var(--bs-secondary-bg); color: var(--bs-body-color); border: 1px solid var(--bs-border-color); }
.nuFnNext { background: var(--bs-primary-bg-subtle); color: var(--bs-primary-text-emphasis); border: 1px solid var(--bs-primary-border-subtle); }
.nuFnHook { background: var(--bs-warning-bg-subtle); color: var(--bs-warning-text-emphasis); border: 1px solid var(--bs-warning-border-subtle); }
.nuFnKind { background: transparent; color: var(--bs-secondary-color); border: 1px solid var(--bs-border-color); }
pre.nuFnSig { margin: 0 0 .65rem; padding: .45rem .7rem; background: var(--bs-tertiary-bg); border-inline-start: 3px solid var(--nu-accent, var(--bs-primary)); border-radius: .25rem;
	font-size: .85rem; white-space: pre-wrap; overflow-wrap: anywhere; }
pre.nuFnSig b { color: var(--bs-primary-text-emphasis); }
.nuFnSpec { display: grid; grid-template-columns: 7.5rem 1fr; gap: .35rem .75rem; margin: 0 0 .5rem; font-size: .9rem; }
.nuFnSpec dt { font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; color: var(--bs-secondary-color); font-weight: 600; padding-top: .15rem; }
.nuFnSpec dd { margin: 0; }
.nuFnParams { list-style: none; margin: 0; padding: 0; }
.nuFnParams li { padding: .1rem 0; }
.nuFnPName { font-weight: 600; }
.nuFnPType { font-family: var(--bs-font-monospace); font-size: .78rem; color: var(--bs-secondary-color); }
.nuFnPOpt { font-size: .78rem; color: var(--bs-secondary-color); font-style: italic; }
.nuFnPDesc { display: block; color: var(--bs-body-color); font-size: .85rem; }
.nuFnPDesc::before { content: none; }
.nuFnBlock { margin-top: .5rem; border: 1px solid var(--bs-border-color-translucent); border-radius: .35rem; overflow: hidden; }
.nuFnBlockHead { display: flex; align-items: center; justify-content: space-between; font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; font-weight: 600;
	color: var(--bs-secondary-color); padding: .25rem .6rem; background: var(--bs-tertiary-bg); border-bottom: 1px solid var(--bs-border-color-translucent); }
.nuFnOut .nuFnBlockHead { text-transform: none; letter-spacing: 0; font-family: var(--bs-font-monospace); color: var(--bs-primary-text-emphasis); }
.nuFnCopy { border: 0; background: none; color: var(--bs-secondary-color); padding: 0 .15rem; line-height: 1; }
.nuFnCopy:hover { color: var(--bs-primary); }
pre.nuFnCode { margin: 0; padding: .55rem .7rem; font-size: .82rem; white-space: pre-wrap; overflow-wrap: anywhere; background: var(--bs-warning-bg-subtle); color: var(--bs-body-color); }
.nuFnOut pre.nuFnCode { background: var(--bs-body-bg); border-inline-start: 3px solid var(--bs-success-border-subtle); }
[data-bs-theme="dark"] pre.nuFnCode { background: #2b2a22; }
[data-bs-theme="dark"] .nuFnOut pre.nuFnCode { background: var(--bs-body-bg); }
.nuFnSee { margin: .55rem 0 0; font-size: .85rem; }
.nuFnSee span { font-weight: 600; }
@media (max-width: 575.98px) {
	.nuFnSpec { grid-template-columns: 1fr; gap: .1rem; }
	.nuFnSpec dd { margin-bottom: .35rem; }
}
.nuFn.nuFnOutL, .nuFn.nuFnOutG, .nuFnGroup.nuFnOutL, .nuFnGroup.nuFnGroupOut { display: none; }
mark.nuHelpHit { padding: 0; background: rgba(var(--bs-warning-rgb), .45); color: inherit; }
/* search words in browse lists and system lists (0.8.427, nuHighlightText in nuapp.js) – colour through --nu-highlight (form CSS may set it) */
:root, [data-bs-theme="light"] { --nu-highlight: rgba(var(--bs-warning-rgb), .45); }
[data-bs-theme="dark"] { --nu-highlight: rgba(var(--bs-warning-rgb), .28); }
mark.nuHighlight { padding: 0 .05em; margin: 0 -.05em; border-radius: .2em; background: var(--nu-highlight); color: inherit; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
@media (max-width: 991.98px) { .nuHelpSide { position: static; max-height: none; } .nuHelpToc { max-height: 40vh; overflow-y: auto; } }

.nuEngineList { max-height: 20rem; overflow-y: auto; }

/* files (zzzzsys_file) */
.nuFileCard { color: inherit; transition: box-shadow .15s; }
.nuFileCard:hover { box-shadow: 0 .25rem .75rem rgba(0,0,0,.12) !important; }
.nuFileThumbBox { height: 8rem; display: flex; align-items: center; justify-content: center; padding: .5rem; border-bottom: 1px solid var(--bs-border-color-translucent);
	background: repeating-conic-gradient(var(--bs-tertiary-bg) 0 25%, var(--bs-body-bg) 0 50%) 0 0 / 16px 16px; border-radius: var(--bs-card-inner-border-radius) var(--bs-card-inner-border-radius) 0 0; }
.nuFileThumbBox img { max-width: 100%; max-height: 100%; object-fit: contain; }
.nuFilePreview { min-height: 8rem; display: flex; align-items: center; justify-content: center; border-radius: .5rem;
	background: repeating-conic-gradient(var(--bs-tertiary-bg) 0 25%, var(--bs-body-bg) 0 50%) 0 0 / 16px 16px; padding: .75rem; }
.nuFilePreview img { max-width: 100%; max-height: 20rem; object-fit: contain; }
.nuFileDrop { border: 2px dashed var(--bs-border-color); border-radius: .5rem; padding: .75rem; }
.nuFileDrop.nuFileDropOver { border-color: var(--bs-primary); background: rgba(var(--bs-primary-rgb), .06); }
.nuFileDrop.is-invalid { border-color: var(--bs-danger); }

.nuUpdChanges { white-space: normal; max-height: 22rem; overflow-y: auto; }

/* installer (pages/nuinstall.php) */
.nu-install { width: 100%; max-width: 48rem; }
.nuInsSteps { display: flex; gap: .25rem; list-style: none; padding: 0; counter-reset: insstep; font-size: .8rem; }
.nuInsSteps li { flex: 1 1 0; counter-increment: insstep; text-align: center; padding-top: .5rem; border-top: .25rem solid var(--bs-border-color); color: var(--bs-secondary-color); min-width: 0; }
.nuInsSteps li::before { content: counter(insstep) ". "; }
.nuInsSteps li.done { border-top-color: var(--nu-accent-2); }
.nuInsSteps li.active { border-top-color: var(--nu-accent); color: var(--bs-body-color); font-weight: 600; }
.nuInsSteps a { color: inherit; text-decoration: none; }
.nuInsSteps a:hover { text-decoration: underline; }
@media (max-width: 575.98px) { .nuInsSteps li:not(.active) span, .nuInsSteps li:not(.active) a { display: none; } }
.insStrength { height: .3rem; }
.insStrength .progress-bar { transition: width .15s ease; }
.insNubPath { max-width: calc(100% - 1.5rem); }

/* "#" menu of the code editors (assets/js/nu/nuhashvars.js) */
/* # (hash variables) button: same box as the editor tool buttons (.nuCodeTools .btn: .15rem .45rem padding, .9rem icon, btn-sm line height) */
.nuHashVarsBtn { font-family: var(--bs-font-monospace); font-weight: 700; font-size: .9rem; line-height: 1; padding: 0;
	display: inline-flex; align-items: center; justify-content: center; width: 1.925rem; height: 1.9375rem; }
.nuHashVarsMenu { width: min(26rem, 90vw); }
/* procedure editor tools (0.8.475): one row height – the buttons keep their own size instead of stretching to the tallest one */
.procCodeTools { flex-wrap: wrap; align-items: center; flex-shrink: 0; }   /* next to the label (0.8.592) – a whole line of its own when it does not fit */
.cfgCodeTools { flex-shrink: 0; }
.procCodeTools .nuCodeTools, .procCodeTools .dropdown { align-self: center; }
/* Insert menu of the code editors (0.8.593, nucodetools.js): functions of the help + snippets; same box as the tool buttons */
.nuCtInsert { display: inline-flex; align-items: center; height: 1.9375rem; padding: .15rem .45rem; font-size: .8125rem; line-height: 1; white-space: nowrap; }
.nuCtInsert .bi { font-size: .9rem; }
@media (max-width: 575.98px) {
	.nuCtInsert { width: 1.925rem; padding: 0; justify-content: center; }
	.nuCtInsertLabel { display: none; }
}
.nuInsMenu { position: fixed; z-index: 1090; width: min(36rem, calc(100vw - 8px)); margin: 0; max-height: calc(100vh - 8px); overflow-y: auto; }
.nuInsList { max-height: 26vh; overflow-y: auto; }
.nuInsList .list-group-item.active .nuInsSub { color: inherit; opacity: .85; }
.nuInsSub { color: var(--bs-secondary-color); }
.nuInsInfo { max-height: 42vh; overflow-y: auto; }
.nuInsInfo:empty { display: none; }
.nuInsSig { white-space: pre-wrap; word-break: break-word; }
.nuInsCode { font-size: .8rem; background: var(--bs-tertiary-bg); border-radius: var(--bs-border-radius-sm); padding: .35rem .5rem; white-space: pre-wrap; word-break: break-word; max-height: 12rem; overflow: auto; }
.nuInsParams { display: grid; grid-template-columns: auto 1fr; gap: .1rem .6rem; }
.nuInsParams dt { font-family: var(--bs-font-monospace); font-weight: 500; }
.nuInsParams dd { margin: 0; }
.nuInsTabs .nav-link { font-size: .85rem; }
/* wide screens (0.8.594): list on the left, detail with the example on the right – both scroll on their own, nothing below the fold */
@media (min-width: 900px) {
	.nuInsMenu { width: min(62rem, calc(100vw - 8px)); }
	.nuInsBody { display: grid; grid-template-columns: minmax(16rem, 22rem) 1fr; gap: .75rem; align-items: start; }
	.nuInsList, .nuInsInfo { max-height: min(60vh, 34rem); }
	.nuInsInfo { border-top: 0 !important; border-left: 1px solid var(--bs-border-color); margin-top: 0 !important; padding-top: 0 !important; padding-left: .75rem; }
	.nuInsInfo .nuInsCode { max-height: 16rem; }
}
/* suggestions while typing (CodeMirror show-hint) – above modals, in the theme's colours */
.CodeMirror-hints { z-index: 2000; background: var(--bs-body-bg); border-color: var(--bs-border-color); font-size: .85rem; max-width: 34rem; }
li.CodeMirror-hint { color: var(--bs-body-color); max-width: 34rem; overflow: hidden; text-overflow: ellipsis; }
li.CodeMirror-hint-active { background: var(--bs-primary); color: #fff; }
.nuHintSig { opacity: .65; }
.nuHintTip { position: fixed; z-index: 2001; max-width: 26rem; background: var(--bs-body-bg); color: var(--bs-body-color); border: 1px solid var(--bs-border-color); border-radius: var(--bs-border-radius); padding: .4rem .55rem; font-size: .8rem; }
.nuHashVarsMenu .form-control { margin-bottom: .35rem; }
.nuHashVarsList { max-height: 50vh; overflow-y: auto; }
.nuHashVarsList .dropdown-header { position: sticky; top: 0; background: var(--bs-dropdown-bg); font-weight: 600; }
.nuHashVarsList .dropdown-item code { flex: none; }
.nbCodeBar { margin-bottom: .25rem; }


/* printable lists (core/nulistexport.php) */
body.nu-print-list { background: var(--bs-body-bg); font-size: .85rem; }
.nu-print-table th { white-space: nowrap; background: var(--bs-tertiary-bg); }
.nu-print-table td { word-break: break-word; }
@media print { body.nu-print-list { font-size: 9pt; } .nu-print-table thead { display: table-header-group; } }

/* procedures (pages/nuprocedures.php) */
.procCM { border: 1px solid var(--bs-border-color); border-radius: var(--bs-border-radius); height: auto; min-height: 22rem; font-size: .85rem; }
.procCM .CodeMirror-scroll { min-height: 22rem; max-height: 70vh; }
.procCM.is-invalid { border-color: var(--bs-danger); }
.cfgCM { height: auto; font-size: .85rem; border-bottom-left-radius: var(--bs-card-inner-border-radius); border-bottom-right-radius: var(--bs-card-inner-border-radius); }
.cfgCM .CodeMirror-scroll { min-height: 24rem; max-height: 72vh; }
.cfgEditor.nuCodeFull .cfgToolbar { border: 0 !important; padding: 0 0 .5rem !important; }
[data-bs-theme="dark"] .cfgCM.CodeMirror { background: var(--bs-body-bg); color: var(--bs-body-color); }
#procTabJs .procCM, #procTabJs .procCM .CodeMirror-scroll { min-height: 16rem; }
.procResultPre { max-height: 14rem; overflow: auto; white-space: pre-wrap; margin: .25rem 0 0; font-size: .8rem; background: var(--bs-body-bg); padding: .4rem; border-radius: .3rem; }
.procHistCode { max-height: 18rem; overflow: auto; white-space: pre-wrap; font-size: .78rem; background: var(--bs-tertiary-bg); padding: .5rem; border-radius: .3rem; }
.procAccessList { max-height: 50vh; overflow-y: auto; }
[data-bs-theme="dark"] .procCM .CodeMirror { background: var(--bs-body-bg); color: var(--bs-body-color); }

/* code editor toolbar (assets/js/nu/nucodetools.js) + CodeMirror search dialog */
.nuCodeTools .btn { padding: .15rem .45rem; height: 1.9375rem; display: inline-flex; align-items: center; justify-content: center; }   /* = # and snippet buttons (0.8.475) */
.nuCodeTools .btn .bi { font-size: .9rem; }
.CodeMirror-dialog { position: absolute; left: 0; right: 0; background: var(--bs-tertiary-bg); color: var(--bs-body-color); z-index: 15; padding: .25rem .8rem; overflow: hidden; font-size: .85rem; }
.CodeMirror-dialog-top { border-bottom: 1px solid var(--bs-border-color); top: 0; }
.CodeMirror-dialog-bottom { border-top: 1px solid var(--bs-border-color); bottom: 0; }
.CodeMirror-dialog input { border: 1px solid var(--bs-border-color); border-radius: .25rem; outline: none; background: var(--bs-body-bg); width: 20em; color: inherit; font-family: var(--bs-font-monospace); padding: 0 .3rem; }
.CodeMirror-dialog button { font-size: .8rem; margin-left: .25rem; }
.CodeMirror .cm-searching { background: rgba(255, 193, 7, .35); }
.nuShowInvisibles .cm-nu-space { background: radial-gradient(circle, rgba(128, 128, 128, .55) 1px, transparent 1.5px) center / 100% 100% no-repeat; }
.nuShowInvisibles .cm-nu-tab { background: linear-gradient(to right, transparent 15%, rgba(128, 128, 128, .45) 15%, rgba(128, 128, 128, .45) 85%, transparent 85%) center / 100% 1px no-repeat; }

/* show / hide and generate password, open-in-new-tab buttons inside an input group: same border as the input */
.input-group > .btn-outline-secondary[data-pw-toggle],
.input-group > .btn-outline-secondary.nuPwGenBtn,
.input-group > .btn-outline-secondary.nuOpenBtn {
	--bs-btn-border-color: var(--bs-border-color);
	--bs-btn-color: var(--bs-secondary-color);
	--bs-btn-bg: var(--bs-body-bg);
	--bs-btn-hover-bg: var(--bs-tertiary-bg);
	--bs-btn-hover-color: var(--bs-body-color);
	--bs-btn-hover-border-color: var(--bs-border-color);
	--bs-btn-active-bg: var(--bs-secondary-bg);
	--bs-btn-active-color: var(--bs-body-color);
	--bs-btn-active-border-color: var(--bs-border-color);
}

/* user form: permission items */
.userPermSearch { max-width: 260px; }
/* list cells (0.8.555): at most two lines, then … (full text in the title); the e-mail column keeps a readable width instead of
   breaking after every few characters when many columns are shown */
.nuClamp2 { display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }
td.nuColEmail { min-width: 12rem; max-width: 20rem; }
.permField { max-width: 350px; }   /* permission item: Ident and Group (0.8.507) */
#userPerms .userPermItem, #userPerms .userPermItem label { cursor: pointer; }
#userPerms .userPermCheck { width: 2.5rem; }
#userPerms .userPermItem label { margin: 0; }
#userPerms .userPermTable .userPermDesc { white-space: normal; }   /* the description wraps (lists keep nowrap on phones) */
/* description (0.8.561): one line, as much as fits, then … (full text as tooltip); the column takes the rest of the row and its text is
   at most 750 px wide – max-width 0 lets the cell shrink instead of widening the table */
#userPerms .userPermTable td.userPermDescCell { width: 100%; max-width: 0; }
#userPerms .userPermTable .userPermDescLine { max-width: 750px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 575.98px) { #userPerms .userPermTable td.userPermIdent { width: 100%; max-width: 0; } }   /* phones: the line below the ident */
#userPerms.userPermNoDesc .userPermDesc { display: none !important; }   /* phones: switch "Descriptions" off – compact table */

/* hamburger: Bootstrap draws a 0.25rem ring on every :focus (also after a tap) – only for keyboard focus, and thinner */
.navbar-toggler:focus { box-shadow: none; }
.navbar-toggler:focus-visible { box-shadow: 0 0 0 2px var(--bs-focus-ring-color); outline: 0; }

/* acting as another user (globeadmin): bar above the navigation */
.nuImpBar { flex: 0 0 100%; width: 100%; margin: calc(-1 * var(--bs-navbar-padding-y)) 0 var(--bs-navbar-padding-y); font-size: .875rem; color: #fff; }
.nuImpBar.nuImpView { background: #0a6f86; }
.nuImpBar.nuImpFull { background: #b02a37; }
.nuImpBar .badge { font-weight: 600; }

/* breadcrumbs: the current page is the heading right below – show only the way back */
main > nav > .breadcrumb .breadcrumb-item.active { display: none; }
main > nav:has(> .breadcrumb):not(:has(.breadcrumb-item:not(.active))) { display: none; }

/* list footer: total · pager · rows per page – always shown, sticky at the bottom of the window */
.nuListFooter {
	position: sticky; bottom: 0; z-index: 5;
	display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: .75rem;
	padding: .5rem 1rem; font-size: .875rem; color: var(--bs-secondary-color);
	background: var(--bs-body-bg); border-top: 1px solid var(--bs-border-color-translucent);
	box-shadow: 0 -.25rem .75rem rgba(0, 0, 0, .04);
}
.card > .nuListFooter.card-footer { background: var(--bs-body-bg); }
.nuListFooter.card { flex-direction: row; border-radius: var(--bs-border-radius-lg); }
.nuListFooter .nuLfTotal { white-space: nowrap; }
.nuListFooter .nuLfTotal b { color: var(--bs-body-color); font-weight: 600; }
.nuListFooter .nuLfPer { justify-self: end; white-space: nowrap; }
.nuPager {
	display: inline-flex; align-items: center; gap: .25rem; padding: .25rem;
	border: 1px solid var(--bs-border-color); border-radius: 50rem; background: var(--bs-tertiary-bg);
}
.nuPagerBtn {
	display: inline-flex; align-items: center; gap: .35rem; padding: .3rem .8rem; border-radius: 50rem;
	color: var(--bs-body-color); text-decoration: none; white-space: nowrap;
}
.nuPagerBtn:hover { background: var(--bs-body-bg); color: var(--bs-primary); }
.nuPagerBtn:focus-visible { outline: 2px solid var(--bs-focus-ring-color); outline-offset: 1px; }
.nuPagerFirst, .nuPagerLast { padding-inline-start: .65rem; padding-inline-end: .65rem; }
.nuPagerBtn.disabled { color: var(--bs-secondary-color); opacity: .55; pointer-events: none; }
.nuPagerCur {
	padding: .3rem .9rem; border-radius: 50rem; background: var(--bs-body-bg); color: var(--bs-body-color);
	font-weight: 600; white-space: nowrap; box-shadow: 0 1px 2px rgba(0, 0, 0, .08);
}
button.nuPagerCur { border: 0; cursor: text; }
button.nuPagerCur:hover { color: var(--bs-primary); }
button.nuPagerCur:focus-visible { outline: 2px solid var(--bs-focus-ring-color); outline-offset: 1px; }
.nuPagerJumpBox { display: inline-flex; align-items: center; gap: .3rem; padding: .1rem .5rem; border-radius: 50rem; background: var(--bs-body-bg);
	font-weight: 600; white-space: nowrap; box-shadow: 0 1px 2px rgba(0, 0, 0, .08); }
.nuPagerJumpBox input { width: 4.5em; padding: .1rem .35rem; font-weight: 600; text-align: center; border-radius: 50rem; }
@media (max-width: 575.98px) {
	/* phones: no "xx per page" (it got cut off) – total left, pager right */
	.nuListFooter { padding: .5rem .5rem; gap: .5rem; grid-template-columns: auto 1fr; }
	.nuListFooter .nuLfPer { display: none; }
	.nuListFooter .nuPager { justify-self: end; }
	.nuPagerTxt, .nuLfUnit { display: none; }
	.nuPagerBtn { padding: .3rem .6rem; }
	.nuPagerFirst, .nuPagerLast { padding-inline-start: .5rem; padding-inline-end: .5rem; }
	.nuPagerCur { padding: .3rem .6rem; }
}
@media print { .nuListFooter { position: static; box-shadow: none; } .nuPager { display: none; } }

/* code editor full screen (toolbar button / F11): toolbar + editor fill the window */
.nuCodeFull {
	position: fixed !important; inset: 0; z-index: 1045; margin: 0 !important; max-width: none !important; width: auto !important;
	padding: .75rem; overflow: auto; background: var(--bs-body-bg);
}
html.nuCodeFullOpen, html.nuCodeFullOpen body { overflow: hidden; }
.nuCodeFull .CodeMirror-scroll { max-height: none !important; min-height: 0 !important; }
.nu-tile-icon { flex-shrink: 0; }
button.nu-tile { font: inherit; color: inherit; background: var(--bs-card-bg); cursor: pointer; }

/* list tables (nuBuilder Next lists, form browse): flat body with zebra stripes, accent tint on clickable rows (Table Style Specification) */
:root, [data-bs-theme="light"] {
	--nu-th-bg: var(--bs-body-bg); --nu-th-color: #6b7785; --nu-th-line: #d7dde2;
	--nu-row-stripe: rgba(127, 140, 155, .09); --nu-row-hover: rgba(47, 111, 206, .08); --nu-row-line: #edf0f3;
}
[data-bs-theme="dark"] {
	--nu-th-bg: var(--bs-body-bg); --nu-th-color: #7f8c99; --nu-th-line: #2c3742;
	--nu-row-stripe: rgba(127, 140, 155, .09); --nu-row-hover: rgba(77, 159, 255, .12); --nu-row-line: #242d36;
}
.nu-table, .nuBrowseTable { --bs-table-hover-bg: transparent; --bs-table-hover-color: var(--bs-table-color); }
/* header: colours only */
.nu-table > thead > tr > th, .nuBrowseTable > thead > tr > th {
	--bs-table-bg: var(--nu-th-bg); color: var(--nu-th-color); border-bottom: 1px solid var(--nu-th-line);
}
/* body: thin dividers between rows, roomy cells (no stripes) */
.nu-table > tbody > tr > *, .nuBrowseTable > tbody > tr > * { border-bottom: 1px solid var(--nu-row-line); }
.nu-table > tbody > tr:last-child > *, .nuBrowseTable > tbody > tr:last-child > * { border-bottom-width: 0; }
.nu-table:not(.table-sm) > :not(caption) > tr > * { padding: .5rem 1rem; }   /* rows: .5rem above and below (was .8rem) */
/* 0.8.208: header without grey band – same background as the card, lighter labels, only a line below */
.nu-table > thead > tr > th, .nuBrowseTable > thead > tr > th { border-top: 0; font-size: .72rem; letter-spacing: .05em; font-weight: 500; }
.nu-table:not(.table-sm) > thead > tr > th { padding-top: .7rem; padding-bottom: .7rem; }
/* hover: rows that open something */
.nu-table > tbody > tr[data-href]:hover > *, .nuBrowseTable > tbody > tr.nuBrowseRow:hover > *,
.nu-table > tbody > tr.clickable-row:hover > * { --bs-table-bg-state: var(--nu-row-hover); }
.nu-table > tbody > tr[data-href] { cursor: pointer; }
.nu-table > tbody > tr[data-href]:focus-visible > * { --bs-table-bg-state: var(--nu-row-hover); }

/* toolbar buttons above lists (Print, CSV, links to related pages): softer border */
.btn.nuToolBtn { --bs-btn-border-color: #c9d1d8; --bs-btn-hover-border-color: #c9d1d8; --bs-btn-active-border-color: #c9d1d8; --bs-btn-disabled-border-color: #c9d1d8; }
[data-bs-theme="dark"] .btn.nuToolBtn { --bs-btn-border-color: #3a4652; --bs-btn-hover-border-color: #3a4652; --bs-btn-active-border-color: #3a4652; --bs-btn-disabled-border-color: #3a4652; }

/* list page: one card – header (title + buttons), filters, table, footer */
.nuListCard { border-radius: .75rem; overflow: visible; }
.nuListCard > .nuListHead { background: var(--bs-body-bg); padding: 1rem 1.25rem; border-bottom: 1px solid var(--nu-th-line); border-radius: .75rem .75rem 0 0; }
.nuListCard > .nuListHead h1 { font-size: 1.15rem; }
/* title bars: <div class="nuTitleBar"> <h1> · optional <div class="nuTitleSub"> (subtitle / hint) · <div> buttons </div> </div>
   Title, then subtitle, then the buttons on a row of their own, left-aligned (short mouse way, same on desktop and phone). */
.nuTitleBar { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.nuTitleBar > :first-child { margin-inline-end: 1rem; }
.nuTitleBar > .nuTitleSub { flex-basis: 100%; margin-top: -.25rem; }
/* 0.8.152: the buttons always get their own row below title (and subtitle) – on every screen width, as on phones */
.nuTitleBar > div:last-child:not(:first-child):not(.nuTitleSub) { flex-basis: 100%; }
/* rows marked for removal (0.8.139 – access level form rights, form builder lists, attribute editor): crossed out and faded until
   the record is saved, then deleted; the ↺ button in the last cell brings the row back (that cell stays usable). nuApp.toggleRemoved() */
.nuRowRemoved > :not(:last-child) { opacity: .45; text-decoration: line-through; pointer-events: none; }
.nuRowRemoved :is(input, select, textarea) { text-decoration: line-through; }
/* "+ Add" buttons: since 0.8.223 the same quiet style as the Print button next to them (btn-outline-secondary nuToolBtn) –
   grey text, transparent background, light border (0.8.135–0.8.222: light blue) */
.btn.nuAddBtn {
	--bs-btn-color: #6c757d; --bs-btn-bg: transparent; --bs-btn-border-color: #dee2e6; --bs-btn-font-weight: 400;
	--bs-btn-hover-color: #0c0b0b; --bs-btn-hover-bg: #e1e3e87d; --bs-btn-hover-border-color: #dee2e6;
	--bs-btn-active-color: #0c0b0b; --bs-btn-active-bg: #e1e3e8; --bs-btn-active-border-color: #dee2e6;
	--bs-btn-disabled-color: #6c757d; --bs-btn-disabled-bg: transparent; --bs-btn-disabled-border-color: #dee2e6;
	--bs-btn-focus-shadow-rgb: 108, 117, 125;
}
[data-bs-theme="dark"] .btn.nuAddBtn {
	--bs-btn-color: #adb5bd; --bs-btn-border-color: #3a4652; --bs-btn-hover-color: #fff; --bs-btn-hover-bg: #6c757d;
	--bs-btn-hover-border-color: #3a4652; --bs-btn-active-color: #fff; --bs-btn-active-bg: #6c757d; --bs-btn-active-border-color: #3a4652;
	--bs-btn-disabled-color: #adb5bd; --bs-btn-disabled-border-color: #3a4652;
}
.nuListCard .nuListFilter { padding: 1rem 1.25rem 1.1rem; }
.nuListCard .nuListFilter .form-label { font-size: .7rem; font-weight: 600; text-transform: uppercase; letter-spacing: .05em; color: var(--nu-th-color); }
.nuListCard .nuListBody > .card-header { border-top: 1px solid var(--nu-th-line); }
.nuListCard .table-responsive .table { border-radius: 0 !important; }
.nuListCard > .nuListFooter.card-footer { border-radius: 0 0 .75rem .75rem; }
/* row action buttons (users list) */
.nuRowBtn { width: 2rem; height: 2rem; padding: 0; display: inline-flex; align-items: center; justify-content: center; border-radius: .4rem; }
.nuRowBtn.btn-outline-secondary { --bs-btn-border-color: #d5dbe1; --bs-btn-color: var(--bs-secondary-color); --bs-btn-hover-bg: var(--bs-tertiary-bg); --bs-btn-hover-color: var(--bs-body-color); --bs-btn-hover-border-color: #c3cad1; }
.nuRowBtn.btn-outline-danger { --bs-btn-border-color: #f1c4c8; --bs-btn-hover-bg: #fdecee; --bs-btn-hover-color: var(--bs-danger); --bs-btn-hover-border-color: #e9a4ab; }
[data-bs-theme="dark"] .nuRowBtn.btn-outline-secondary { --bs-btn-border-color: #3a4652; }
[data-bs-theme="dark"] .nuRowBtn.btn-outline-danger { --bs-btn-border-color: #6b2c33; --bs-btn-hover-bg: rgba(248, 81, 73, .12); }
.nuRowActions { white-space: nowrap; } .nuRowActions > * + * { margin-inline-start: .35rem; }
@media (max-width: 767.98px) { .nu-table > tbody > tr > td { white-space: nowrap; } .nuListCard > .nuListHead, .nuListCard .nuListFilter { padding-inline-start: 1rem; padding-inline-end: 1rem; } }
/* search field with the search button on the right */
.nuSearchBtn { --bs-btn-border-color: var(--bs-border-color); --bs-btn-color: var(--bs-secondary-color); --bs-btn-hover-bg: var(--bs-tertiary-bg); --bs-btn-hover-color: var(--bs-primary); --bs-btn-hover-border-color: var(--bs-border-color); --bs-btn-active-bg: var(--bs-secondary-bg); --bs-btn-active-color: var(--bs-primary); --bs-btn-active-border-color: var(--bs-border-color); }
/* filter button right of the search field (users list): blue while the filters are open or set */
.nuFilterToggle[aria-expanded="true"], .nuFilterToggle.active { color: var(--bs-primary); }
/* users list: access level badge – light blue */
.nuAccessBadge.bg-secondary-subtle { background-color: #eaf4ff !important; border-color: #dcd7ff !important; }
/* user form: password generator (no inline styles – CSP) */
.nuPwGenLen { width: 5rem; flex: none; }
.nuPwGenBar { height: .4rem; }
.nuPwGenOut { letter-spacing: .03em; }
/* forms list: one colour per form type (light and dark theme) */
.nuFormType { font-weight: 600; border: 1px solid transparent; }
.nuFormType-browseedit { background: #e8f1ff; color: #1f4fa3; border-color: #cfe0fb; }
.nuFormType-browse     { background: #e6f6fb; color: #0b6178; border-color: #c7e9f3; }
.nuFormType-edit       { background: #e8f6ee; color: #1d6b3f; border-color: #c9e8d5; }
.nuFormType-launch     { background: #fff4e0; color: #8a5300; border-color: #f6dfb3; }
.nuFormType-subform    { background: #f1ecfd; color: #5b3aa6; border-color: #e0d6f8; }
.nuFormType-page       { background: #fde8f0; color: #9b1d4f; border-color: #f6cadb; }
[data-bs-theme="dark"] .nuFormType-browseedit { background: #16263f; color: #9ec2ff; border-color: #24395c; }
[data-bs-theme="dark"] .nuFormType-browse     { background: #10303a; color: #8fd6e8; border-color: #1b4552; }
[data-bs-theme="dark"] .nuFormType-edit       { background: #12301f; color: #8fd8ab; border-color: #1d4630; }
[data-bs-theme="dark"] .nuFormType-launch     { background: #3a2a0d; color: #f3c46d; border-color: #54401a; }
[data-bs-theme="dark"] .nuFormType-subform    { background: #2a2142; color: #c3b0f5; border-color: #3c3060; }
[data-bs-theme="dark"] .nuFormType-page       { background: #3d1526; color: #f5a3c4; border-color: #5a2139; }
[data-bs-theme="dark"] .nuAccessBadge.bg-secondary-subtle { background-color: #1d2b3a !important; border-color: #33405a !important; }

/* tabs (0.8.312): clean underline look – no boxes; grey text, the selected tab in the accent blue with a 2 px line on the base line,
   hover darkens the text and shows a light line. Icons and their colours stay. Dark mode: the same with dark colours. */
:root, [data-bs-theme="light"] {
	--nu-tab-line: #dee2e6; --nu-tab-border: #dee2e6; --nu-tab-color: #5c6670; --nu-tab-hover-bg: #f5f5f5; --nu-tab-hover-color: #212529;
	--nu-tab-active-color: #2d84d1; --nu-tab-active: #2d84d1; --nu-tab-hover-line: #ced4da; --nu-tab-active-bg: var(--nu-tab-surface);
}
[data-bs-theme="dark"] {
	--nu-tab-line: #3a4552; --nu-tab-border: #3a4552; --nu-tab-color: #a7b0ba; --nu-tab-hover-bg: #27303a; --nu-tab-hover-color: #fff;
	--nu-tab-active-color: #5ea4e8; --nu-tab-active: #5ea4e8; --nu-tab-hover-line: #4f5c6a; --nu-tab-active-bg: var(--nu-tab-surface);
}
.nav-tabs { --nu-tab-surface: var(--nu-page); --bs-nav-tabs-border-width: 0; gap: .25rem; flex-wrap: wrap; border-bottom: 1px solid var(--nu-tab-line); padding-inline-start: 0; }
.card .nav-tabs { --nu-tab-surface: var(--bs-card-bg); }
.card-header .nav-tabs { --nu-tab-surface: var(--bs-card-bg); }
.nav-tabs .nav-item { margin-bottom: -1px; }
.nav-tabs .nav-link {
	display: inline-flex; align-items: center; gap: .4rem; padding: .55rem .9rem; margin: 0;
	background: transparent; color: var(--nu-tab-color); font-size: .9rem; font-weight: 400; line-height: 1.4;
	border: 0; border-bottom: 2px solid transparent; border-radius: 0;
	cursor: pointer; transition: color .15s ease-in-out, border-color .15s ease-in-out;
}
.nav-tabs .nav-link:hover, .nav-tabs .nav-link:focus { background: transparent; color: var(--nu-tab-hover-color); isolation: isolate; border-bottom-color: var(--nu-tab-hover-line); }
.nav-tabs .nav-link:focus-visible { outline: 2px solid var(--bs-focus-ring-color); outline-offset: -2px; border-radius: .25rem .25rem 0 0; }
.nav-tabs .nav-link.active, .nav-tabs .nav-item.show .nav-link {
	background: transparent; color: var(--nu-tab-active-color); font-weight: 500; cursor: default; border-bottom-color: var(--nu-tab-active);
}
.nav-tabs .nav-link.disabled { opacity: .55; }
.nav-tabs .nav-link .badge { margin-inline-start: .1rem; font-size: .7rem; line-height: 1.2; }
.nav-tabs .nav-link > .bi { font-size: .95em; }
/* tabs inside a card header: the header's bottom border is the base line */
.card-header-tabs { margin-bottom: calc(-1 * var(--bs-card-cap-padding-y)); border-bottom: 0; }

/* prompt generator */
.pgResult { min-height: 22rem; resize: vertical; white-space: pre-wrap; background: var(--bs-tertiary-bg); font-size: .78rem; line-height: 1.45; }
@media (min-width: 1200px) { .pgResultCard { position: sticky; top: calc(var(--nu-sticky-top, 57px) + var(--nu-sticky-h, 0px) + 1rem); } }
.min-w-0 { min-width: 0; }
.flex-none { flex: none; }

/* CSV import */
.impDrop { display: block; border: 2px dashed var(--bs-border-color); border-radius: .75rem; padding: 2rem 1rem; text-align: center; cursor: pointer; color: var(--bs-secondary-color); transition: border-color .15s, background .15s; position: relative; }
.impDrop:hover, .impDrop.dragover, .impDrop:focus-within { border-color: var(--bs-primary); background: var(--bs-primary-bg-subtle); color: var(--bs-body-color); }
.impSteps li { display: flex; align-items: center; gap: .35rem; color: var(--bs-secondary-color); }
.impSteps li span { display: inline-flex; width: 1.5rem; height: 1.5rem; border-radius: 50%; align-items: center; justify-content: center; border: 1px solid var(--bs-border-color); font-weight: 600; }
.impSteps li.active { color: var(--bs-primary); font-weight: 600; }
.impSteps li.active span { background: var(--bs-primary); border-color: var(--bs-primary); color: #fff; }
.impSteps li.done span { background: var(--bs-success-bg-subtle); border-color: var(--bs-success-border-subtle); color: var(--bs-success-text-emphasis); }
.impPreview { max-height: 22rem; }
.impPreview td, .impPreview th { white-space: nowrap; max-width: 18rem; overflow: hidden; text-overflow: ellipsis; font-size: .82rem; }
.impPreview thead th { position: sticky; top: 0; background: var(--bs-tertiary-bg); }
.impCustomDelim { max-width: 3.5rem; }
.impMap td { vertical-align: top; }
.impMap .impSrcCell { min-width: 12rem; }
.impMap .impPrev { min-width: 10rem; max-width: 18rem; }
.impPrevVal { max-width: 18rem; }
.impAutoMapped { background-color: var(--bs-success-bg-subtle); border-color: var(--bs-success-border-subtle); }
.impErrors { max-height: 24rem; }
.impBusy { cursor: progress; }

/* every outline-secondary button: border #6c757d – also the row, tool and filter buttons, which had lighter borders of their
   own (dark mode). At the end of the file so it wins over those rules. Buttons attached to a field (input group:
   open access level, show / generate password, search) keep the field's border colour. */
.btn.btn-outline-secondary,
.btn.btn-outline-secondary.nuRowBtn,
.btn.btn-outline-secondary.nuToolBtn { --bs-btn-border-color: #6c757d; }
/* light theme (0.8.137): grey outline buttons (Back, Act as user, Clone, New, Refresh, Tools, ⋮ …) with the light border #dee2e6,
   like Print and the search button – also on hover. Pressed / selected (e.g. Absolute | Auto | Grid) keep the dark fill and border.
   The top bar buttons keep their own #e4e4e4 (more specific rule below). */
:root:not([data-bs-theme="dark"]) .btn.btn-outline-secondary:not(.nuSearchBtn),
:root:not([data-bs-theme="dark"]) .btn.btn-outline-secondary.nuRowBtn,
:root:not([data-bs-theme="dark"]) .btn.btn-outline-secondary.nuToolBtn { --bs-btn-border-color: #dee2e6; --bs-btn-hover-border-color: #dee2e6; --bs-btn-disabled-border-color: #dee2e6; }
/* light theme (0.8.138): red outline buttons (Delete, Delete all, row delete buttons, Reset …) with the light red border #ebaab1;
   on hover Bootstrap's red fill (row buttons keep their soft hover). Dark mode unchanged. */
:root:not([data-bs-theme="dark"]) .btn.btn-outline-danger { --bs-btn-border-color: #ebaab1; --bs-btn-disabled-border-color: #ebaab1; }
.input-group > .btn.btn-outline-secondary { --bs-btn-border-color: var(--bs-border-color); }
/* filter button next to the search field: same border as the search button (also hover / open / focus) */
.btn.btn-outline-secondary.nuFilterToggle, .btn.btn-outline-secondary.nuListResetBtn { --bs-btn-border-color: var(--bs-border-color); --bs-btn-hover-border-color: var(--bs-border-color); --bs-btn-active-border-color: var(--bs-border-color); }
.btn.nuFilterToggle:focus-visible, .btn.nuListResetBtn:focus-visible { border-color: var(--bs-border-color); }
/* Print button of lists (#nuListPrint) and form browse lists (#nuPrintButton), row buttons in lists (Clone …): same border as the search button */
.nu-table .btn.btn-outline-secondary, .nu-table .btn.btn-outline-secondary.nuRowBtn,
.btn.btn-outline-secondary#nuListExportBtn, .btn.btn-outline-secondary#nuExportButton { --bs-btn-border-color: var(--bs-border-color); --bs-btn-hover-border-color: var(--bs-border-color); --bs-btn-active-border-color: var(--bs-border-color); }

/* inspect record (pages/nuinspect.php) */
.inspTable .inspValue { display: inline-block; max-width: min(55vw, 46rem); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; vertical-align: bottom; cursor: pointer; font-size: .85rem; }
.inspTable .inspValue.inspOpen { display: block; max-width: none; white-space: pre-wrap; overflow-wrap: anywhere; cursor: auto; }
.inspTable .inspValue.inspMasked { filter: blur(5px); user-select: none; cursor: default; }
.inspTable .inspType { font-size: .8rem; color: var(--bs-secondary-color); }
.inspSortBtn, .userPermSortBtn { font: inherit; color: inherit; text-decoration: none; text-transform: inherit; letter-spacing: inherit; }
.inspSortBtn:hover, .userPermSortBtn:hover { color: var(--bs-primary); }
th[aria-sort="ascending"] .inspSortBtn::after, th[aria-sort="ascending"] .userPermSortBtn::after { content: " \25B2"; font-size: .7em; }
th[aria-sort="descending"] .inspSortBtn::after, th[aria-sort="descending"] .userPermSortBtn::after { content: " \25BC"; font-size: .7em; }   /* user form permission items (0.8.611) */
.permUsage > summary { cursor: pointer; color: var(--bs-secondary-color); width: fit-content; }
.permUsage > summary:hover, .permUsage[open] > summary { color: var(--bs-body-color); }   /* permission item: usage in code (0.8.614) */
.userPermOpen { color: var(--bs-secondary-color); font-size: .85em; text-decoration: none; }
@media (min-width: 576px) { .userPermIdent { white-space: nowrap; } }   /* ident + link on one line; phones wrap */
.userPermOpen:hover, .userPermOpen:focus-visible { color: var(--bs-primary); }
.inspFacts dt { font-weight: 600; color: var(--bs-secondary-color); }
.inspFacts dd { margin-bottom: .25rem; }

/* access level: "Several…" dialog to add forms */
.nuAmList { max-height: 50vh; overflow-y: auto; }
.nuAmList .list-group-item { cursor: pointer; }

/* form cloner */
.nuClList { min-height: 6rem; max-height: 14rem; overflow-y: auto; }
.nuClSql { resize: vertical; }

/* app cloner */
.nuAcTables { max-height: 22rem; overflow-y: auto; }
.nuAcTable:last-child { border-bottom: 0 !important; }
.nuAcTable { cursor: pointer; }
.nuAcLog { max-height: 60vh; overflow-y: auto; }
.nuAcLine-step { font-weight: 600; margin-top: .35rem; }
.nuAcLine-error { color: var(--bs-danger-text-emphasis); font-weight: 600; }

/* list title with an (i) button: the hint opened below it wraps instead of pushing the buttons to a new line */
.nuInfoBtn { text-decoration: none; font-size: .85rem; }

/* REST API clients: curl example */
.nuApiExample { background: var(--bs-tertiary-bg); border: 1px solid var(--bs-border-color); border-radius: .375rem; padding: .5rem .75rem; font-size: .78rem; white-space: pre-wrap; word-break: break-all; }

/* API playground (pages/nuapiplayground.php) */
.apgSide .apgList { max-height: calc(100vh - 14rem); overflow-y: auto; }
.apgSide .apgMeth, #apg .apgMeth { font-family: var(--bs-font-monospace); font-size: .68rem; min-width: 3.9rem; margin-inline-end: .35rem; }
.apgSide .apgPath { font-size: .76rem; word-break: break-all; }
.apgSide .apgFolderHead { font-size: .75rem; }
#apgMethod { min-width: 7rem; }
.apgCode { font-size: .8rem; tab-size: 2; min-height: 6rem; resize: vertical; }
.apgOut { background: var(--bs-tertiary-bg); border: 1px solid var(--bs-border-color); border-radius: .375rem; padding: .5rem .75rem;
	font-size: .78rem; white-space: pre-wrap; word-break: break-word; max-height: 55vh; overflow: auto; }
.apgToast { z-index: 1090; max-width: 24rem; }
@media (max-width: 991.98px) { .apgSide .apgList { max-height: 18rem; } }

/* validation markers (sob_all_validate): red * = no blanks, a neutral key = no duplicates (0.8.627, before a blue ◆; nu_unique_mark) */
:root, [data-bs-theme="light"] { --nu-mark-required: #dc3545; --nu-mark-unique: var(--bs-secondary-color); }
[data-bs-theme="dark"] { --nu-mark-required: #ff6b6b; --nu-mark-unique: var(--bs-secondary-color); }
.nuRequired, .nuMarkRequired { color: var(--nu-mark-required); }
.nuMarkUnique { color: var(--nu-mark-unique); }
.nuMarks { display: inline-flex; align-items: baseline; gap: .2em; margin-inline-start: .25em; white-space: nowrap; font-weight: 600; }
.nuMark { cursor: help; line-height: 1; }
.nuMarkRequired { font-size: 1.05em; }
.nuMarkUnique { font-size: .95em; font-weight: 400; border-radius: .2rem; }
.nuMarkUnique:focus-visible { outline: 2px solid rgba(var(--bs-primary-rgb), .6); outline-offset: 1px; }
label > .nuMarkUnique, .form-label > .nuMarkUnique { margin-inline-start: .25em; }

/* grey outline buttons (Act as user, Clone, Back, Print, row and tool buttons …): hover light grey with dark text.
   The search / filter buttons keep their own hover; dark mode keeps Bootstrap's hover (dark text would not be readable there). */
:root:not([data-bs-theme="dark"]) .btn.btn-outline-secondary:not(.nuSearchBtn),
:root:not([data-bs-theme="dark"]) .btn.btn-outline-secondary.nuRowBtn,
:root:not([data-bs-theme="dark"]) .btn.btn-outline-secondary.nuToolBtn { --bs-btn-hover-bg: #e1e3e87d; --bs-btn-hover-color: #0c0b0b; }

/* procedure edit form: labels above the fields */
#procTabPhp .procField { margin-bottom: 1rem; }
#procTabPhp .procFieldRow > [class*="col-"] > .procField { margin-bottom: 0; }
#procTabPhp .procFieldRow { margin-bottom: 1rem; }
.procLabel { font-weight: 600; color: var(--bs-secondary-color); margin-bottom: .35rem; }
#procTabPhp .procHint { margin-top: -.5rem; margin-bottom: 1rem; }
#procTabPhp .procRunRow { margin-bottom: 1.25rem; }
.btn.btn-outline-secondary.procRunBtn { --bs-btn-color: var(--bs-body-color); --bs-btn-border-color: var(--bs-border-color); --bs-btn-hover-border-color: var(--bs-border-color); --bs-btn-active-border-color: var(--bs-border-color); }

/* nuBuilder settings (pages/nusettings.php) */
.setTable .setValueCol { min-width: 11rem; width: 14rem; }
.setTable .setDesc { max-width: 26rem; }
/* Settings (0.8.242): below 800 px the description column is hidden; an (i) next to the name shows it on tap / click */
.setTable .setDescTip { display: none; font-weight: 400; }
@media (max-width: 799.98px) {
	.setTable .setDescCol { display: none; }
	.setTable .setDescTip { display: inline-block; }
}
.setTable .setValue.setChanged { border-color: var(--bs-warning); box-shadow: 0 0 0 .15rem rgba(255, 193, 7, .25); }
/* settings: what a setting means for nuBuilder Next (0.8.279) – used / not yet / not needed */
.setSt { cursor: help; font-size: .7rem; }
.setSt-next { background: var(--bs-success-bg-subtle); color: var(--bs-success-text-emphasis); border-color: var(--bs-success-border-subtle) !important; }
.setSt-open { background: var(--bs-warning-bg-subtle); color: var(--bs-warning-text-emphasis); border-color: var(--bs-warning-border-subtle) !important; }
.setSt-na { background: var(--bs-secondary-bg); color: var(--bs-secondary-color); border-color: var(--bs-border-color) !important; }
.btn-check:checked + .setStBtn-next { background: var(--bs-success-bg-subtle); color: var(--bs-success-text-emphasis); border-color: var(--bs-success-border-subtle); }
.btn-check:checked + .setStBtn-open { background: var(--bs-warning-bg-subtle); color: var(--bs-warning-text-emphasis); border-color: var(--bs-warning-border-subtle); }
.btn-check:checked + .setStBtn-na { background: var(--bs-secondary-bg); color: var(--bs-emphasis-color); border-color: var(--bs-secondary-color); }
.setTable > thead th { position: sticky; top: 0; z-index: 1; }


/* globeadmin start page (pages/nuhome.php, assets/js/nuhome.js) */
.nuHomeGroupTitle { text-transform: uppercase; letter-spacing: .07em; font-size: .8rem; font-weight: 700; color: var(--bs-secondary-color); margin: 0 0 .65rem; }
.nuHomeIconSm { width: 2rem; height: 2rem; font-size: 1rem; }
.nuHomeList .list-group-item { padding-top: .6rem; padding-bottom: .6rem; }
.nuHomeList { max-width: 550px; }   /* list layout: a readable column instead of the full page width (phones: full width) */
.nuHomeList.nuHomeListWide { max-width: none; }   /* wide list: full page width */
/* list in 2 columns (0.8.363): full width, filled row by row (same order as the tiles); each row its own framed line; phones: one column */
@media (min-width: 768px) {
	.nuHomeList.nuHomeList2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; box-shadow: none !important; }
	.nuHomeList2 > .list-group-item, .nuHomeList2 > form > .list-group-item { border-width: var(--bs-list-group-border-width) !important;
		border-radius: var(--bs-list-group-border-radius) !important; box-shadow: var(--bs-box-shadow-sm); height: 100%; }
	.nuHomeList2 > form { margin: 0; }
	.nuHomeList2 > .nuHeEmpty { grid-column: 1 / -1; }
}
.nuHomeList .nu-tile-icon { width: 2.1rem; height: 2.1rem; font-size: 1.05rem; }
.nuHomeTabs { margin-bottom: 0; }
.nuHomeToast { z-index: 1090; max-width: 26rem; }
/* start page edit mode (0.8.263): the page itself is edited – tools on the tiles, drag with mouse or (hold, then drag) finger */
.nuHeBar { position: sticky; top: calc(var(--nu-nav-h, 0px) + .5rem); z-index: 1010;   /* below the top bar (1020) and its menus, 0.8.318 */
	 margin-bottom: 1rem; padding: .55rem .75rem; border: 1px solid var(--bs-primary-border-subtle);
	border-radius: .75rem; background: var(--bs-body-bg); box-shadow: 0 .35rem 1rem rgba(0, 0, 0, .07); }
/* start page edit mode: Start from ▾ (0.8.385) */
.nuHeStartMenu { width: 25rem; max-width: calc(100vw - 2rem); max-height: min(70vh, 38rem); overflow-y: auto; }
.nuHeStartMenu .dropdown-header { white-space: normal; }
.nuHeStartItem { display: flex; align-items: flex-start; gap: .65rem; padding-top: .45rem; padding-bottom: .45rem; white-space: normal; }
.nuHeStartIcon { display: inline-grid; place-items: center; flex: none; width: 2rem; height: 2rem; margin-top: .1rem; border-radius: .55rem;
	background: var(--bs-primary-bg-subtle); color: var(--bs-primary-text-emphasis); }
.nuHeStartItem:hover .nuHeStartIcon, .nuHeStartItem:focus .nuHeStartIcon { background: var(--bs-primary); color: #fff; }
.nuHeNote { line-height: 1.4; }
/* Save as new layout → Based on (0.8.385) */
.nuHlBaseBox { padding: .85rem 1rem 1rem; border-radius: .75rem; background: var(--nu-page); border: 1px solid var(--bs-border-color-translucent); }
.nuHeBarRow { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.nuHomeEditing .nuHeItem { cursor: grab; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.nuHomeEditing .nuHeItem > .nu-tile { position: relative; border: 1px dashed var(--bs-primary-border-subtle); }
.nuHomeEditing .nuHeItem > .nu-tile:hover { transform: none; box-shadow: 0 .35rem .9rem rgba(0, 0, 0, .07) !important; border-color: var(--bs-primary); }
.nuHomeEditing .nuHeItem:focus-visible { outline: none; }
.nuHomeEditing .nuHeItem:focus-visible > .nu-tile, .nuHomeEditing .list-group-item.nuHeItem:focus-visible { box-shadow: 0 0 0 .2rem rgba(var(--bs-primary-rgb), .3) !important; }
.nuHeOwn { border-style: dashed; }
.nuHeTools { position: absolute; top: .4rem; inset-inline-end: .4rem; display: flex; gap: .2rem; opacity: 0; transition: opacity .12s; z-index: 2; }
.nuHeItem:hover .nuHeTools, .nuHeItem:focus-within .nuHeTools { opacity: 1; }
@media (hover: none) { .nuHeTools { opacity: 1; } }
.list-group-item.nuHeItem .nuHeTools { position: static; opacity: 1; flex: none; }
.nuHeToolBtn { width: 1.8rem; height: 1.8rem; padding: 0; display: inline-flex; align-items: center; justify-content: center; font-size: .85rem; line-height: 1;
	border: 1px solid var(--bs-border-color); border-radius: .4rem; background: var(--bs-body-bg); color: var(--bs-secondary-color); }
.nuHeToolBtn:hover, .nuHeToolBtn:focus-visible { color: var(--bs-primary); border-color: var(--bs-primary); background: var(--bs-body-bg); }
.nuHeToolBtn.nuHeToolDel:hover, .nuHeToolBtn.nuHeToolDel:focus-visible { color: var(--bs-danger); border-color: var(--bs-danger); }
.nuHeToolBtn.disabled { opacity: .35; }
.nuHeGroupHead { display: flex; flex-wrap: wrap; align-items: center; gap: .35rem; margin-bottom: .65rem; }
.nuHeGroupTitle.form-control { flex: 0 1 22rem; min-width: 8rem; padding: .2rem .45rem; border-color: transparent; background: transparent; box-shadow: none;
	text-transform: uppercase; letter-spacing: .07em; font-size: .8rem; font-weight: 700; color: var(--bs-secondary-color); }
.nuHeGroupTitle.form-control:hover { border-color: var(--bs-border-color); }
.nuHeGroupTitle.form-control:focus { border-color: var(--bs-primary); background: var(--bs-body-bg); color: var(--bs-body-color); }
.nuHeGrip { padding: .1rem .2rem; border: 0; background: none; color: var(--bs-secondary-color); cursor: grab; touch-action: none; line-height: 1; }
.nuHeGrip:hover { color: var(--bs-primary); }
.nuHeDrop { min-height: 4.5rem; border-radius: .75rem; outline: 2px dashed transparent; outline-offset: .35rem; transition: outline-color .1s, background-color .1s; }
.nuHeDrop.list-group { min-height: 3rem; }
.nuHeDrop:has(> .nuHeItem) > .nuHeEmpty { display: none; }
.nuHeEmpty { padding: 1rem; text-align: center; border: 1px dashed var(--bs-border-color); border-radius: .6rem; }
.row.nuHeDrop > .nuHeEmpty { margin-inline: calc(var(--bs-gutter-x) * .5); width: calc(100% - var(--bs-gutter-x)); }
.nuHeDragging .nuHeDrop { outline-color: var(--bs-border-color); }
.nuHeDragging .nuHeDrop.nuHeOver { outline-color: var(--bs-primary); background: var(--bs-primary-bg-subtle); }
.nuHeDragging, .nuHeDragging * { cursor: grabbing !important; }
.nuHePlaceholder { opacity: .35; }
.nuHePlaceholder > .nu-tile, .list-group-item.nuHePlaceholder { border: 2px dashed var(--bs-primary) !important; }
.nuHeGroup.nuHePlaceholder { opacity: .45; outline: 2px dashed var(--bs-primary); outline-offset: .4rem; border-radius: .5rem; }
.nuHeGhost { position: fixed; z-index: 2000; pointer-events: none; margin: 0; padding: 0; opacity: .95; transform: rotate(1.5deg) scale(1.03);
	box-shadow: 0 1rem 2rem rgba(0, 0, 0, .2); border-radius: .75rem; }
.nuHeGhost > .nu-tile { height: 100%; }
.nuHeGhost.list-group-item { border: 1px solid var(--bs-primary); background: var(--bs-body-bg); }
.nuHeGhostLabel { display: inline-flex; align-items: center; padding: .45rem .8rem; background: var(--bs-body-bg); border: 1px solid var(--bs-primary);
	font-size: .8rem; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; color: var(--bs-body-color); }
.nuHeTabs .nav-link { cursor: pointer; user-select: none; height: auto; min-height: 28px; line-height: 1.5; padding-top: 2px; padding-bottom: 2px; }
.nuHeTabs .nuHeTab.active .nav-link { cursor: default; }
.nuHeTabInput { border: 0; padding: 0 .1rem; background: transparent; font: inherit; font-weight: 600; color: inherit; min-width: 3ch; }
.nuHeTabInput:focus { outline: 1px solid var(--bs-primary); border-radius: .2rem; }
.nuHeTabs .nuHeToolBtn { width: 1.5rem; height: 1.5rem; font-size: .75rem; }
.nuHeTabGrip { font-size: .85rem; }
.nuHeTab.nuHeOver .nav-link { background: var(--bs-primary-bg-subtle); border-color: var(--bs-primary); }
.nuHeTab.nuHePlaceholder { opacity: .4; }
.nuHeHidden { padding: .85rem 1rem 1rem; border: 1px dashed var(--bs-border-color); border-radius: .75rem; }
.nuHeHidden .nuHeItem:not(.nuHePlaceholder) > .nu-tile, .nuHeHidden .list-group-item.nuHeItem { opacity: .6; }
.nuHeHidden .nuHeItem:hover > .nu-tile, .nuHeHidden .list-group-item.nuHeItem:hover { opacity: 1; }

/* top bar (and login page): theme, language and user menu buttons with a light border; dark mode keeps its own */
:root:not([data-bs-theme="dark"]) .nu-navbar .btn.btn-outline-secondary.dropdown-toggle,
:root:not([data-bs-theme="dark"]) .nu-login .btn.btn-outline-secondary.dropdown-toggle {
	--bs-btn-border-color: #e4e4e4; --bs-btn-hover-border-color: #e4e4e4; --bs-btn-active-border-color: #e4e4e4;
}

/* demo mode (0.8.140, core/nudemo.php): badge in the top bar, "Try the demo" on the login page */
.nuDemoBadge { background: #fff4e5; color: #8a4b00; border: 1px solid #f5c98b; font-weight: 600; padding: .45em .7em; white-space: nowrap; }
[data-bs-theme="dark"] .nuDemoBadge { background: rgba(245, 159, 0, .14); color: #ffc46b; border-color: rgba(245, 159, 0, .4); }
.nuLoginDemo { margin-top: 1.25rem; }
.nuLoginOr { display: flex; align-items: center; gap: .75rem; color: var(--bs-secondary-color); font-size: .75rem; text-transform: uppercase; letter-spacing: .06em; }
.nuLoginOr::before, .nuLoginOr::after { content: ''; flex: 1; border-top: 1px solid var(--bs-border-color); }
.nuLoginDemoCustom { max-width: 22rem; margin: 1rem auto 0; }


/* a button whose action is blocked (data-nu-info explains why on click) */
.btn.nuBtnBlocked { opacity: .5; }
.btn.nuBtnBlocked:hover { opacity: .8; }

/* right-to-left languages (Arabic: html dir="rtl" + bootstrap.rtl.min.css). Spacing above uses logical properties (inline-start / -end). */
[dir="rtl"] input.form-control[list]:not(.is-invalid):not(.is-valid) { background-position: left .75rem center; }
[dir="rtl"] .CodeMirror, [dir="rtl"] .CodeMirror-dialog, [dir="rtl"] .cfgCode, [dir="rtl"] .nuCodeTools { direction: ltr; text-align: left; }   /* code stays left to right */
[dir="rtl"] .bi-chevron-right::before, [dir="rtl"] .bi-chevron-left::before, [dir="rtl"] .bi-arrow-left::before, [dir="rtl"] .bi-arrow-right::before,
[dir="rtl"] .bi-chevron-double-left::before, [dir="rtl"] .bi-chevron-double-right::before, [dir="rtl"] .bi-box-arrow-up-right::before { transform: scaleX(-1); }   /* arrows point the reading way */
[dir="rtl"] code, [dir="rtl"] kbd, [dir="rtl"] .font-monospace { unicode-bidi: isolate; }

/* phones: Save / Clone / Delete of edit pages and forms show only their icon (the text stays for screen readers and as tooltip) */
@media (max-width: 575.98px) {
	.nuTitleBar .btn:is([data-nu-save], :has(> .bi-copy), :has(> .bi-trash)),
	#nuSaveButton, #nuCloneButton, #nuDeleteButton { font-size: 0; padding-inline: .7rem; }
	.nuTitleBar .btn:is([data-nu-save], :has(> .bi-copy), :has(> .bi-trash)) > .bi,
	#nuSaveButton > .bi, #nuCloneButton > .bi, #nuDeleteButton > .bi { font-size: 1.05rem; line-height: 1.45; margin: 0 !important; }
}

/* Admin tools → To do (pages/nutodo.php, developer mode): TODO.md as a page */
.nuTodo h2 { font-size: 1.35rem; margin: 0 0 1rem; }
.nuTodo h3 { font-size: 1.05rem; margin: 1.6rem 0 .6rem; padding-bottom: .3rem; border-bottom: 1px solid var(--bs-border-color); }
.nuTodo h4, .nuTodo h5 { font-size: .95rem; margin: 1rem 0 .4rem; }
/* folding sections (0.8.467) */
.nuTodo .nuTodoSec > summary { display: flex; align-items: center; gap: .4rem; list-style: none; cursor: pointer; margin: 1.6rem 0 .6rem; padding-bottom: .3rem; border-bottom: 1px solid var(--bs-border-color); }
.nuTodo .nuTodoSec > summary::-webkit-details-marker { display: none; }
.nuTodo .nuTodoSec > summary h3 { margin: 0; padding: 0; border: 0; }
.nuTodo .nuTodoSec > summary:focus-visible { outline: 2px solid var(--bs-primary); outline-offset: 2px; border-radius: .25rem; }
.nuTodo .nuTodoChev { font-size: .8rem; color: var(--bs-secondary-color); transition: transform .15s; }
.nuTodo .nuTodoSec:not([open]) > summary .nuTodoChev { transform: rotate(-90deg); }
.nuTodo .nuTodoSec:not([open]) > summary { margin-bottom: 0; }
@media (prefers-reduced-motion: reduce) { .nuTodo .nuTodoChev { transition: none; } }
.nuTodo .nuTodoList { list-style: none; padding-inline-start: 0; margin-bottom: .5rem; }
.nuTodo .nuTodoList .nuTodoList { padding-inline-start: 1.6rem; margin: .25rem 0; }
.nuTodo .nuTodoList > li { display: flex; align-items: flex-start; padding: .2rem 0; }
.nuTodo .nuTodoList > li:not(.nuTodoTask)::before { content: "•"; width: 1.5rem; flex: none; color: var(--bs-secondary-color); }
.nuTodo .nuTodoList > li > .form-check-input { flex: none; margin-top: .2rem; opacity: 1; }
.nuTodo .nuTodoDone > span { color: var(--bs-secondary-color); text-decoration: line-through; }
.nuTodo code { font-size: .85em; }
.cfgCM .cfgErrLine { background: rgba(var(--bs-danger-rgb), .18); }

/* own grab / grabbing hand for things that are dragged (0.8.184): black hand in light mode, white hand with dark outline in dark mode */
:root, [data-bs-theme="light"] {
	--nu-cursor-grab: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0MCIgaGVpZ2h0PSI0MCIgdmlld0JveD0iMCAwIDQwIDQwIj48cGF0aCBkPSJNMTMgMTlWMTBhMyAzIDAgMCAxIDYgMHY3VjdhMyAzIDAgMCAxIDYgMHYxMFYxMGEzIDMgMCAwIDEgNiAwdjEybDEtM2EzIDMgMCAwIDEgNiAxbC0yIDEwYy0xIDUtNSA4LTExIDhoLTVjLTQgMC03LTItOS01TDMgMjRhMyAzIDAgMCAxIDUtM2w1IDZ6IiBmaWxsPSIjMTExODI3IiBzdHJva2U9IiMxMTE4MjciIHN0cm9rZS13aWR0aD0iMS41IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz48L3N2Zz4=") 16 18, grab;
	--nu-cursor-grabbing: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0MCIgaGVpZ2h0PSI0MCIgdmlld0JveD0iMCAwIDQwIDQwIj48cGF0aCBkPSJNOSAxNmEzIDMgMCAwIDEgNiAwdjNhMyAzIDAgMCAxIDYtMWEzIDMgMCAwIDEgNiAwYTMgMyAwIDAgMSA2IDJsMiA2YzEgNy00IDEyLTExIDEyaC02Yy01IDAtOC0zLTEwLTdMNCAyM2EzIDMgMCAwIDEgNS0zbDMgNHoiIGZpbGw9IiMxMTE4MjciIHN0cm9rZT0iIzExMTgyNyIgc3Ryb2tlLXdpZHRoPSIxLjUiIHN0cm9rZS1saW5lY2FwPSJyb3VuZCIgc3Ryb2tlLWxpbmVqb2luPSJyb3VuZCIvPjwvc3ZnPg==") 16 18, grabbing;
}
[data-bs-theme="dark"] {
	--nu-cursor-grab: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0MCIgaGVpZ2h0PSI0MCIgdmlld0JveD0iMCAwIDQwIDQwIj48cGF0aCBkPSJNMTMgMTlWMTBhMyAzIDAgMCAxIDYgMHY3VjdhMyAzIDAgMCAxIDYgMHYxMFYxMGEzIDMgMCAwIDEgNiAwdjEybDEtM2EzIDMgMCAwIDEgNiAxbC0yIDEwYy0xIDUtNSA4LTExIDhoLTVjLTQgMC03LTItOS01TDMgMjRhMyAzIDAgMCAxIDUtM2w1IDZ6IiBmaWxsPSIjZmZmZmZmIiBzdHJva2U9IiMyNjMyMzgiIHN0cm9rZS13aWR0aD0iMiIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIi8+PC9zdmc+") 16 18, grab;
	--nu-cursor-grabbing: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0MCIgaGVpZ2h0PSI0MCIgdmlld0JveD0iMCAwIDQwIDQwIj48cGF0aCBkPSJNOSAxNmEzIDMgMCAwIDEgNiAwdjNhMyAzIDAgMCAxIDYtMWEzIDMgMCAwIDEgNiAwYTMgMyAwIDAgMSA2IDJsMiA2YzEgNy00IDEyLTExIDEyaC02Yy01IDAtOC0zLTEwLTdMNCAyM2EzIDMgMCAwIDEgNS0zbDMgNHoiIGZpbGw9IiNmZmZmZmYiIHN0cm9rZT0iIzI2MzIzOCIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz48L3N2Zz4=") 16 18, grabbing;
}
.nuGrab { cursor: var(--nu-cursor-grab); }
.nuGrab:active { cursor: var(--nu-cursor-grabbing); }
.nuInfoTip { color: var(--bs-secondary-color); cursor: help; }
.nuInfoTip:hover, .nuInfoTip:focus { color: var(--bs-primary); outline: none; }
.updHistoryItem > summary { cursor: pointer; list-style-position: outside; }
.updHistoryText { max-height: 28rem; overflow-y: auto; }
#updHistory { scroll-margin-top: calc(var(--nu-sticky-top, 57px) + var(--nu-sticky-h, 0px) + 1rem); }
.updBackupsNav .nuLfPer { display: none; } /* update page: backup list in a narrow card */
.nuOffscreen { position: fixed; left: -10000px; top: 0; opacity: 0; } /* copy fallback (assets/js/nuemail.js) */
.tooltip-inner { overflow-wrap: anywhere; } /* long paths in tooltips (e.g. PHPMailer folder) */
.nuTipWide .tooltip-inner { max-width: min(26rem, 90vw); text-align: start; }
.nuTipPre .tooltip-inner { white-space: pre-line; }   /* tooltip text with line breaks (update page: Folder writable) */
.updKeepNum { width: 5rem; }
/* user page (globeadmin): "Act as user" as the icon in front of the user name (0.8.200) */
.nuImpIconBtn { padding: .1rem .35rem; font-size: inherit; line-height: 1; color: var(--bs-body-color); border: 1px solid transparent; border-radius: .5rem; }
.nuImpIconBtn:hover, .nuImpIconBtn:focus-visible, .nuImpIconBtn[aria-expanded="true"] { color: var(--bs-primary); background: var(--bs-tertiary-bg); border-color: var(--bs-border-color); }
.nuImpIcon .nuImpMenu { font-size: 1rem; font-weight: 400; line-height: 1.5; }


/* Admin tools → Security check (0.8.207): status also as a coloured left border (not only the icon) */
#secChecks .list-group-item { border-inline-start: 4px solid transparent; }
#secChecks .sec-bad { border-inline-start-color: var(--bs-danger); }
#secChecks .sec-warn { border-inline-start-color: var(--bs-warning); }
#secChecks .sec-ok { border-inline-start-color: var(--bs-success); }
#secChecks .sec-info { border-inline-start-color: var(--bs-info); }
#secProbe .list-group-item { border-inline-start: 4px solid transparent; }
#secProbe .list-group-item.sec-open { border-inline-start-color: var(--bs-danger); }
.nuAdminRight { cursor: help; }


/* Procedures: code, description, group, category, status, launch form in a collapsible block (0.8.225) */
.procFields { border: 1px solid var(--bs-border-color); border-radius: .5rem; background: var(--bs-body-bg); }
.procFields > summary { cursor: pointer; padding: .55rem .9rem; display: flex; align-items: baseline; flex-wrap: wrap; gap: 0 .25rem; list-style: none; }
.procFields > summary::-webkit-details-marker { display: none; }
.procFields > summary::before { content: "\F285"; font-family: bootstrap-icons; font-size: .8rem; margin-inline-end: .5rem; transition: transform .15s; display: inline-block; }
.procFields[open] > summary::before { transform: rotate(90deg); }
[dir="rtl"] .procFields:not([open]) > summary::before { transform: scaleX(-1); }
.procFields[open] > summary { border-bottom: 1px solid var(--bs-border-color); }
.procFieldsSumText { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }
.procFieldsBody { padding: .9rem; }

/* List search (nu_list_search, 0.8.227): field + magnifier at most 350px wide; from md up its column only takes what it needs, so the
   filters (the next column) stand right next to it instead of after a half-width column. Phones: full width as before. */
@media (min-width: 768px) {
	.nuListSearch > .input-group { width: 350px; max-width: 100%; }
	.row > [class*="col-md-"]:has(> .nuListSearch) { flex: 0 0 auto; width: auto; max-width: 100%; }
}

/* Update page → Libraries (0.8.229): group rows */
#updLibraries .nuLibGroup > td { background: var(--bs-tertiary-bg); font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; }
#updLibraries > summary { cursor: pointer; list-style: none; }
#updLibraries > summary::-webkit-details-marker { display: none; }
#updLibraries:not([open]) > summary { border-bottom: 0; border-radius: inherit; }
#updLibraries .nuLibChevron { display: inline-block; transition: transform .15s; font-size: .8rem; }
#updLibraries[open] .nuLibChevron { transform: rotate(90deg); }
[dir="rtl"] #updLibraries:not([open]) .nuLibChevron { transform: scaleX(-1); }
#updLibraries .nuLibState { min-width: 9rem; }

/* lists (0.8.251): the first column (the record's name, usually a link) in body colour instead of blue – stays bold; underline on hover */
.table-responsive .table > tbody > tr > td:first-child a:not(.btn):not(.badge),
.table-responsive .table > tbody > tr > td:first-child > .text-primary,
.table-responsive .table > tbody > tr > td.nuMainCol a:not(.btn):not(.badge),
.table-responsive .table > tbody > tr > td.nuMainCol > .text-primary { color: var(--bs-body-color) !important; }
.table-responsive .table > tbody > tr > td:first-child a:not(.btn):not(.badge):hover,
.table-responsive .table > tbody > tr > td.nuMainCol a:not(.btn):not(.badge):hover { text-decoration: underline !important; }
/* the main column when the row buttons come first (forms list, 0.8.253) */
.table > tbody > tr > td.nuRowActions { width: 1%; padding-inline-end: .25rem; }

/* backups (0.8.259): download · roll back · delete as one row of equal 2rem buttons; roll back neutral with an amber accent */
.updBkActions { display: inline-flex; align-items: center; gap: .35rem; }
.updBkActions form, .updBkActions .dropdown { display: inline-flex; margin: 0; }
.updBkActions .updBkDl { width: auto; padding-inline: .45rem; gap: .15rem; }
.updBkActions .updBkDl::after { margin-inline-start: .1rem; vertical-align: .15em; }
.btn.updRollback {
	--bs-btn-color: var(--bs-body-color); --bs-btn-bg: var(--bs-body-bg); --bs-btn-border-color: #d5dbe1;
	--bs-btn-hover-color: #7a4a00; --bs-btn-hover-bg: #fff6e0; --bs-btn-hover-border-color: #f0c36d;
	--bs-btn-active-color: #7a4a00; --bs-btn-active-bg: #ffecbf; --bs-btn-active-border-color: #e5ad3d;
	height: 2rem; display: inline-flex; align-items: center; padding: 0 .7rem; border-radius: .4rem; font-weight: 500;
}
.btn.updRollback .bi { color: #b26a00; }
[data-bs-theme="dark"] .btn.updRollback {
	--bs-btn-border-color: #3a4652; --bs-btn-hover-color: #ffd58a; --bs-btn-hover-bg: rgba(255, 193, 7, .12); --bs-btn-hover-border-color: #8a6a1f;
	--bs-btn-active-color: #ffd58a; --bs-btn-active-bg: rgba(255, 193, 7, .2); --bs-btn-active-border-color: #a8801f;
}
[data-bs-theme="dark"] .btn.updRollback .bi { color: #ffc54d; }
/* debug page (0.8.262): the auto refresh switch at the right end of the buttons, on phones in its own row */
.debugAutoWrap { margin-inline-start: auto; }
@media (max-width: 575.98px) { .debugAutoWrap { flex-basis: 100%; margin-inline-start: 0; } }
@media (hover: none) { .nuHomeEditing .nuHeItem > .nu-tile > .card-body { padding-top: 2.75rem; } }   /* touch: the tools stay visible above the text */
@media (max-width: 575.98px) {
	.nuHeGroupHead { flex-wrap: nowrap; }
	.nuHeGroupTitle.form-control { flex: 1 1 auto; min-width: 0; }
	.nuHeGroupHead .nuHeGroupTab { max-width: 7rem; }
}
@media (max-width: 575.98px) { .nuHeBar .form-select { max-width: 9.5rem; } }

/* ▾ menu of the Database tile / card (0.8.284): star = make this tool the default */
.nuDbItem .dropdown-item { padding-right: .5rem; }
.nuDbStar { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; margin-right: .35rem; border: 0; border-radius: .375rem;
	background: transparent; color: var(--bs-secondary-color); }
button.nuDbStar:hover, button.nuDbStar:focus-visible { background: var(--bs-tertiary-bg); color: var(--bs-warning-text-emphasis); }
.nuDbStarOn { color: var(--bs-warning); }

/* dashboards (0.8.298, assets/js/nudashboard.js): start page and HTML objects of forms */
.nuDash { width: 100%; text-align: start; }
/* in an HTML object of a form (absolute layout: fixed size) – scroll when the dashboard is taller than the object */
.nuHtml:has([data-nu-dashboard]) { overflow: auto; }
.nuDashHead { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin-bottom: .75rem; }
.nuDashTitle { font-size: 1.1rem; font-weight: 600; margin: 0; flex: 1 1 auto; }
.nuDashTools { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem; margin-inline-start: auto; }
.nuDashRange { width: auto; min-width: 10rem; }
.nuDashDate { width: 9.5rem; }
.nuDashCard { height: 100%; border-color: var(--bs-border-color-translucent); box-shadow: 0 1px 2px rgba(15, 23, 42, .06); }
.nuDashCardHead { display: flex; align-items: center; gap: .5rem; padding: .7rem 1rem 0; }
.nuDashCardTitle { flex: 1 1 auto; font-size: .8rem; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--bs-secondary-color); }
.nuDashLink { color: var(--bs-secondary-color); }
.nuDashLink:hover { color: var(--bs-link-color); }
.nuDashBody { padding: .5rem 1rem 1rem; min-height: 5rem; transition: opacity .2s; }
.nuDashBusy { opacity: .55; }
.nuDashKpiValue { font-size: clamp(1.5rem, 1.1rem + 1vw, 2rem); font-weight: 700; overflow-wrap: anywhere; line-height: 1.15; color: var(--bs-emphasis-color); font-variant-numeric: tabular-nums; }
.nuDashKpi-good { color: var(--bs-success-text-emphasis); }
.nuDashKpi-warn { color: var(--bs-warning-text-emphasis); }
.nuDashKpi-bad { color: var(--bs-danger-text-emphasis); }
.nuDashKpiDelta { margin-top: .3rem; font-size: .85rem; font-weight: 600; color: var(--bs-secondary-color); }
.nuDashUp { color: var(--bs-success-text-emphasis); }
.nuDashDown { color: var(--bs-danger-text-emphasis); }
.nuDashKpiPrev { margin-inline-start: .5rem; font-weight: 400; color: var(--bs-secondary-color); }
.nuDashKpiNote { margin-top: .25rem; font-size: .85rem; color: var(--bs-secondary-color); }
.nuDashMsg { padding: 1rem 0; text-align: center; color: var(--bs-secondary-color); font-size: .9rem; }
.nuDashErr { color: var(--bs-danger-text-emphasis); text-align: start; overflow-wrap: anywhere; }
.nuDashWait { font-style: italic; }
.nuDashTable { max-height: 22rem; overflow: auto; }
.nuDashRowLink { cursor: pointer; }
.nuDashRowLink:hover > td, .nuDashRowLink:focus-visible > td { background: var(--bs-tertiary-bg); }
.nuDashChart { min-height: 120px; }
.nuDashChart .apexcharts-tooltip { color: #212529; }
[data-bs-theme="dark"] .nuDashChart .apexcharts-tooltip { color: #f8f9fa; }
/* dashboard editor */
.dashSnippet { font-size: .85rem; user-select: all; }
.dashPreview { min-height: 6rem; }
.dashWidgetRow td { vertical-align: middle; }


/* update page: progress modal while installing (0.8.308) */
.nuUpdSpinner { width: 3rem; height: 3rem; border-width: .3rem; }
/* update page, database steps (0.8.308): description and date wrap on narrow screens instead of widening the page */
.nuUpdStepDesc { flex: 1 1 14rem; min-width: 0; overflow-wrap: anywhere; }


.nuHomeSearchBox { max-width: 26rem; }
.nuHomeSearchRow .nuHomeList { max-width: 550px; }
/* pin in a tile's ▾ menu */
.nuPinItem .dropdown-item { padding-inline-end: .5rem; }
.nuPinBtn { color: var(--bs-secondary-color); border: 0; padding: .15rem .5rem; margin-inline-end: .35rem; line-height: 1; }
.nuPinBtn:hover, .nuPinBtn:focus-visible { color: var(--bs-primary); background: var(--bs-tertiary-bg); }
.nuPinBtn.nuPinned { color: var(--bs-primary); }
/* Ctrl+K search box (assets/js/nupalette.js) */
.nuPaletteDialog { margin-top: 10vh; }
.nuPaletteDialog .modal-header kbd { font-size: .7rem; }
.nuPaletteList { max-height: 60vh; overflow-y: auto; }
.nuPaletteGroup { padding: .5rem 1rem .25rem; font-size: .72rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--bs-secondary-color); }
.nuPaletteList .list-group-item { border: 0; padding: .45rem 1rem; }
.nuPaletteList .list-group-item.active { background: var(--bs-primary-bg-subtle); color: var(--bs-emphasis-color); }
.nuPaletteList .list-group-item.active .bi { color: var(--bs-primary) !important; }
.nuPaletteKw { max-width: 40%; }

/* Admin roles (0.8.326): the groups of the rights table are clearly headings – a band with icon, the rights below indented */
#admRights > tbody > tr.nuAdmGroup > th { background: var(--bs-tertiary-bg); color: var(--bs-emphasis-color); font-weight: 600; font-size: .95rem;
	text-transform: none; letter-spacing: 0; padding-top: .6rem; padding-bottom: .6rem; border-top: 1px solid var(--bs-border-color); }
#admRights > tbody > tr.nuAdmGroup > th .bi { color: var(--bs-secondary-color); }
#admRights > tbody > tr.nuAdmRight > td:first-child { padding-inline-start: 2.6rem; }

/* Tom Select inside an input group (user form: access level + open button, 0.8.327) */
.input-group > .ts-wrapper { flex: 1 1 auto; width: 1%; min-width: 0; }
.input-group > .ts-wrapper:not(:last-child) .ts-control { border-top-right-radius: 0; border-bottom-right-radius: 0; }

/* Tutorial (0.8.328, pages/nututorial.php) */
.tutProgress .progress { height: .5rem; }
.tutIndex .list-group { max-height: calc(100vh - 14rem); overflow-y: auto; }
@media (max-width: 991.98px) { .tutIndex .list-group { max-height: none; } }
.tutIndex .tutPart { font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; color: var(--bs-secondary-color); background: var(--bs-tertiary-bg); padding-top: .35rem; padding-bottom: .35rem; }
.tutIndex .tutChapter { font-weight: 600; font-size: .9rem; border-bottom: 0; padding-bottom: .15rem; }
.tutIndex .tutLessonLink { font-size: .875rem; padding-left: 1.5rem; border-top: 0; }
.tutIndex .tutLessonLink.active .bi { color: inherit !important; }
.tutBody { line-height: 1.6; }
.tutBody h4 { font-size: 1.05rem; margin-top: 1.25rem; }
.tutBody ul, .tutBody ol { padding-left: 1.4rem; }
.tutBody li { margin-bottom: .25rem; }
.tutBody code { font-size: .85em; }
.tutBody kbd { font-size: .8em; }
.tutBody .tut-task { border: 1px solid var(--bs-success-border-subtle); background: var(--bs-success-bg-subtle); border-radius: .5rem; padding: .75rem 1rem; margin: 1.25rem 0 .5rem; }
.tutBody .tut-task ol, .tutBody .tut-task ul { margin-bottom: 0; }
.tutBody .tutTaskHead { font-weight: 600; margin-bottom: .4rem; color: var(--bs-success-text-emphasis); }
.tutBody .tut-note { border-left: 3px solid var(--bs-warning); padding: .25rem .75rem; margin: .75rem 0; background: var(--bs-warning-bg-subtle); border-radius: 0 .375rem .375rem 0; }
.tutBody .tut-tip { border-left: 3px solid var(--bs-info); padding: .25rem .75rem; margin: .75rem 0; background: var(--bs-info-bg-subtle); border-radius: 0 .375rem .375rem 0; }
.tutBody a.tutOpen, .tutBody a.tutHelp { white-space: nowrap; }
.tutChapterCard a { text-decoration: none; }
/* two tracks (0.8.622): choice screen, "Advanced" badge */
.tutChoice { transition: border-color .15s, box-shadow .15s; }
.tutChoice:hover, .tutChoice:focus-within { border-color: var(--nu-accent); box-shadow: 0 4px 14px rgba(15, 23, 42, .1) !important; }
.tutChoiceIcon { color: var(--nu-accent); }
.tutAdvBadge { font-weight: 500; font-size: .68rem; vertical-align: .1em; color: var(--bs-primary-text-emphasis); background: var(--bs-primary-bg-subtle); border: 1px solid var(--bs-primary-border-subtle); }
.list-group-item.active .tutAdvBadge { color: inherit; background: transparent; border-color: currentColor; }

/* List views (0.8.329, core/nulistview.php): column widths, phone cards, editor */
.nuLv .nuLvNarrow { width: 1%; white-space: nowrap; }
.nuLv .nuLvWide { min-width: 18rem; }
.nuLvMenuBtn .nuLvMenuName { display: inline-block; max-width: 12rem; overflow: hidden; text-overflow: ellipsis; vertical-align: bottom; white-space: nowrap; }
.nuLvMenu { max-height: 70vh; overflow-y: auto; min-width: 16rem; }
.nuLvCards { padding: .5rem .75rem; }
/* phones: cards or table (0.8.471) – the view's choice (.nuLvPhoneTable), overridden per device by <html data-lv-phone> (nutheme.js) */
.nuLv .nuLvCards, .nuLv .nuLvPhoneToTable, .nuLv .nuLvPhoneToCards { display: none; }
@media (max-width: 767.98px) {
	.nuLv .nuLvTableWrap { display: none; }
	.nuLv .nuLvCards { display: block; }
	.nuLv.nuLvPhoneTable .nuLvTableWrap, html[data-lv-phone="table"] .nuLv .nuLvTableWrap { display: block; }
	.nuLv.nuLvPhoneTable .nuLvCards, html[data-lv-phone="table"] .nuLv .nuLvCards { display: none; }
	html[data-lv-phone="cards"] .nuLv .nuLvTableWrap { display: none; }
	html[data-lv-phone="cards"] .nuLv .nuLvCards { display: block; }
	/* the button shows the layout it switches to */
	.nuLv .nuLvPhoneToTable { display: inline; }
	.nuLv.nuLvPhoneTable .nuLvPhoneToTable, html[data-lv-phone="table"] .nuLv .nuLvPhoneToTable { display: none; }
	.nuLv.nuLvPhoneTable .nuLvPhoneToCards, html[data-lv-phone="table"] .nuLv .nuLvPhoneToCards { display: inline; }
	html[data-lv-phone="cards"] .nuLv .nuLvPhoneToTable { display: inline; }
	html[data-lv-phone="cards"] .nuLv .nuLvPhoneToCards { display: none; }
	/* the table on a phone: tighter, first column stays while the rest scrolls sideways */
	.nuLv .nuLvTableWrap .nu-table { font-size: .875rem; }
	.nuLv .nuLvTableWrap .nu-table > :not(caption) > * > * { padding: .4rem .5rem; white-space: nowrap; }
	.nuLv .nuLvTableWrap .nu-table th:first-child, .nuLv .nuLvTableWrap .nu-table td:first-child { position: sticky; inset-inline-start: 0; z-index: 1; background: var(--bs-body-bg); box-shadow: inset -1px 0 0 var(--bs-border-color); }
}
.nuLvCard { display: block; padding: .6rem .75rem; margin-bottom: .5rem; border: 1px solid var(--bs-border-color); border-radius: .5rem; background: var(--bs-body-bg); color: var(--bs-body-color); text-decoration: none; }
.nuLvCard:hover, .nuLvCard:focus { border-color: var(--bs-primary); color: var(--bs-body-color); }
.nuLvCardHead { display: flex; align-items: flex-start; gap: .5rem; }
.nuLvCardTitle { font-weight: 600; margin-right: auto; min-width: 0; overflow-wrap: anywhere; }
.nuLvCardBadge { flex-shrink: 0; }
.nuLvCardLine { display: flex; gap: .5rem; font-size: .875rem; margin-top: .15rem; min-width: 0; }
.nuLvCardLabel { color: var(--bs-secondary-color); flex: 0 0 auto; max-width: 45%; }
.nuLvCardLabel::after { content: ":"; }
.nuLvCardVal { min-width: 0; overflow-wrap: anywhere; }
.nuLvCardDemo { pointer-events: none; }
.nuLvEdTable td, .nuLvEdTable th { vertical-align: middle; }
.nuLvEdTable select { min-width: 7rem; }
.nuLvGrip { cursor: grab; color: var(--bs-secondary-color); width: 1.5rem; }
.nuLvDragging { opacity: .5; }
.nuLvLevels { max-height: 12rem; overflow-y: auto; }
.nuLv .nuLvThumbCell { width: 1%; }
.nuLv .nuLvThumb { width: 2.5rem; height: 2.5rem; object-fit: contain; border-radius: .25rem; background: var(--bs-tertiary-bg); }

/* audit trail (0.8.350): history of a record – the same column widths in every block */
.nuAudTable { table-layout: fixed; }
.nuAudTable th:first-child { width: 25%; }
.nuAudTable th:last-child { width: 3.5rem; }
.nuAudOld { color: var(--bs-secondary-color); }


/* start page favourites (0.8.353): "Favourites only" – assets/css/nuhome.css (0.8.420) */
.nuHomeFavBtn.active, .nuHomeFavBtn.active:hover { color: #e0a800; background: var(--bs-body-bg); border-color: var(--bs-border-color); }
.nuHeToolFav, .nuHeToolFav:hover { color: #e0a800 !important; }

/* Customise (0.8.354): favourites keep a star in the corner (the tools with ★ take its place on hover); "Favourites" shows only them */
.nuHeFavMark { position: absolute; top: .5rem; inset-inline-end: .65rem; color: #e0a800; font-size: .95rem; line-height: 1; z-index: 1; pointer-events: none; transition: opacity .12s; }
.nuHeItem:hover .nuHeFavMark, .nuHeItem:focus-within .nuHeFavMark { opacity: 0; }
@media (hover: none) { .nuHeFavMark { display: none; } }
.nuHeFavInline { color: #e0a800; font-size: .85em; }
.nuHeFavOnly .nuHeItem:not([data-fav]) { display: none !important; }
.nuHeFavOnly .nuHeGroup:not(:has([data-fav])), .nuHeFavOnly .nuHeHidden { display: none !important; }

/* compact start page tiles (0.8.355): the description as tooltip – mouse over, or a long tap on phones (no copy / link menu then) */
[data-nu-hint] { -webkit-touch-callout: none; }

/* notification centre (0.8.357): the bell (red badge = unread), its panel, the level colours, toasts and the list page */
.nuBellBtn { position: relative; }
.nuBellBtn.nuBellHas { color: var(--bs-danger); border-color: var(--bs-danger); }
.nuBellBadge { position: absolute; top: -.45rem; inset-inline-end: -.45rem; min-width: 1.15rem; height: 1.15rem; padding: 0 .3rem; border-radius: 999px;
	background: var(--bs-danger); color: #fff; font-size: .68rem; font-weight: 600; line-height: 1.15rem; text-align: center; box-shadow: 0 0 0 2px var(--bs-body-bg); }
.nuBellRing > .bi { display: inline-block; animation: nuBellRing .9s ease-in-out 1; transform-origin: 50% 0; }
@keyframes nuBellRing { 0%, 100% { transform: rotate(0); } 15% { transform: rotate(14deg); } 30% { transform: rotate(-12deg); } 45% { transform: rotate(9deg); } 60% { transform: rotate(-6deg); } 75% { transform: rotate(3deg); } }
@media (prefers-reduced-motion: reduce) { .nuBellRing > .bi { animation: none; } }
.nuBellPanel { width: min(380px, calc(100vw - 1.5rem)); }
.nuBellList { max-height: min(60vh, 460px); overflow-y: auto; }
.nuBellItem { padding: .65rem .9rem; border-bottom: 1px solid var(--bs-border-color-translucent); }
.nuBellItem:last-child { border-bottom: 0; }
.nuBellUnread { background: var(--bs-primary-bg-subtle); }
.nuBellUnread .nuBellTitle { font-weight: 600; }
.nuBellBody { color: var(--bs-secondary-color); overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.nuBellTool { width: 1.7rem; height: 1.7rem; padding: 0; display: inline-flex; align-items: center; justify-content: center; color: var(--bs-secondary-color); border: 1px solid transparent; }
.nuBellTool:hover, .nuBellTool:focus-visible { color: var(--bs-primary); border-color: var(--bs-border-color); background: var(--bs-body-bg); }
.nuBellIcon { line-height: 1.3; }
.nuBellLv-info .nuBellIcon, .nuBellIcon.nuBellLv-info { color: var(--bs-info-text-emphasis); }
.nuBellLv-success .nuBellIcon, .nuBellIcon.nuBellLv-success { color: var(--bs-success); }
.nuBellLv-warning .nuBellIcon, .nuBellIcon.nuBellLv-warning { color: #d39e00; }
.nuBellLv-danger .nuBellIcon, .nuBellIcon.nuBellLv-danger { color: var(--bs-danger); }
.nuBellToasts { z-index: 1090; margin-top: 3.5rem; }
.nuWelcomeToasts { z-index: 1090; margin-top: 3.5rem; }   /* user form: which welcome e-mail is sent (0.8.508) */
.nuBellToast { cursor: pointer; }
.nuNtfItem.nuBellUnread { border-color: var(--bs-primary-border-subtle) !important; }
.nuNtfItem.nuBellLv-danger { border-inline-start: 4px solid var(--bs-danger) !important; }
.nuNtfItem.nuBellLv-warning { border-inline-start: 4px solid #d39e00 !important; }

/* notification form (0.8.358): the chosen level light in its own colour instead of the dark grey of Bootstrap's checked button */
.nuNtfLevels .btn { --bs-btn-hover-bg: var(--bs-tertiary-bg); --bs-btn-hover-color: var(--bs-body-color); --bs-btn-hover-border-color: var(--bs-border-color); color: var(--bs-body-color); }
.nuNtfLevels .btn-check:checked + .btn { font-weight: 500; position: relative; z-index: 1; }
.nuNtfLevels .btn-check:checked + .nuNtfLv-info { background: var(--bs-info-bg-subtle); border-color: var(--bs-info-border-subtle); color: var(--bs-info-text-emphasis); }
.nuNtfLevels .btn-check:checked + .nuNtfLv-success { background: var(--bs-success-bg-subtle); border-color: var(--bs-success-border-subtle); color: var(--bs-success-text-emphasis); }
.nuNtfLevels .btn-check:checked + .nuNtfLv-warning { background: var(--bs-warning-bg-subtle); border-color: var(--bs-warning-border-subtle); color: var(--bs-warning-text-emphasis); }
.nuNtfLevels .btn-check:checked + .nuNtfLv-danger { background: var(--bs-danger-bg-subtle); border-color: var(--bs-danger-border-subtle); color: var(--bs-danger-text-emphasis); }
.nuNtfLevels .btn-check:focus-visible + .btn { box-shadow: 0 0 0 .2rem rgba(var(--bs-primary-rgb), .2); }

/* side bar (0.8.460, nu_sidebar() in core/nulayout.php, assets/js/nusidebar.js): favourites and recently used on the left – a drawer
   (body.nuSbOpen) on every screen width since 0.8.513 */
:root { --nu-sb-w: 260px; --nu-sb-rail: 64px; --nu-nav-h: 57px; --nu-sb-fav: #c27803; --nu-sb-fav-text: #9a5b00; --nu-sb-active: color-mix(in srgb, var(--nu-accent) 10%, var(--nu-surface)); }
[data-bs-theme="dark"] { --nu-sb-fav: #e3a33b; --nu-sb-fav-text: #e3a33b; --nu-sb-active: color-mix(in srgb, #5ea4e8 16%, var(--nu-surface)); }
.nuShell { display: flex; align-items: flex-start; min-height: calc(100vh - var(--nu-nav-h)); }
.nuShellMain { flex: 1 1 auto; min-width: 0; }
.nuSidebar { flex: none; width: var(--nu-sb-w); position: sticky; top: var(--nu-nav-h); height: calc(100vh - var(--nu-nav-h)); overflow-y: auto; overflow-x: hidden;
	background: var(--nu-surface); border-right: 1px solid var(--bs-border-color); display: flex; flex-direction: column; }
.nuSbHead { display: flex; align-items: center; gap: .5rem; padding: .85rem 1rem .85rem .75rem; border-bottom: 1px solid var(--bs-border-color-translucent); }
.nuSbTitle { flex: 1 1 auto; display: flex; align-items: center; gap: .5rem; font-size: .78rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--bs-secondary-color); min-width: 0; }
.nuSbTitle .bi { font-size: 1.05rem; }
.nuSbClose, .nuSbClear, .nuSbFav { border: 0; background: none; color: var(--bs-secondary-color); border-radius: .375rem; line-height: 1; padding: .35rem .4rem; }
.nuSbClose:hover, .nuSbClear:hover, .nuSbFav:hover { background: var(--bs-tertiary-bg); color: var(--bs-body-color); }
.nuSbBody { padding: .5rem .5rem 1rem; }
.nuSbSec { margin-top: .5rem; }
.nuSbSecTitle { display: flex; align-items: center; gap: .45rem; margin: 0; padding: .55rem .5rem .4rem; font-size: .72rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--bs-secondary-color); }
.nuSbSec-fav .nuSbSecTitle { color: var(--nu-sb-fav-text); }   /* text 4.5:1 (the star icons keep the brighter --nu-sb-fav) */
.nuSbSecTitle .nuSbText { flex: 1 1 auto; }
.nuSbCount { font-size: .7rem; font-weight: 600; min-width: 1.4rem; text-align: center; padding: .1rem .4rem; border-radius: 1rem; background: var(--bs-tertiary-bg); color: var(--bs-secondary-color); letter-spacing: 0; }
.nuSbSec-fav .nuSbCount { background: color-mix(in srgb, var(--nu-sb-fav) 16%, var(--nu-surface)); color: var(--nu-sb-fav-text); }
.nuSbClearForm { display: inline-flex; }
.nuSbClear { padding: .15rem .3rem; font-size: .85rem; }
.nuSbMenu { position: fixed; z-index: 1080; margin: 0; min-width: 12rem; }   /* right-click menu of "Recently used" (0.8.489) */
.userCardLogin .card-body > div:last-of-type, .userCardAccess .card-body > div:last-of-type, .userCardAccount .card-body > div:last-of-type { margin-bottom: 0 !important; }   /* user form cards (0.8.586) */
.userCardLogin, .userCardAccess, .userCardAccount { width: 100%; max-width: 530px; }   /* user form: right-hand cards at most 530 px wide (0.8.610) */
.xaRow > select { flex: 1 1 auto; min-width: 0; }   /* user form: additional access levels (0.8.585) */
.xaRow > .xaUntil { flex: 0 0 10.5rem; }
.nuFormStatus { cursor: context-menu; border-radius: var(--bs-border-radius-pill); }   /* forms list: status with right-click menu (0.8.575) */
.nuFormStatus:focus-visible { outline: 2px solid var(--bs-primary); outline-offset: 2px; }
.nuFormStatusBusy { opacity: .5; }
.nuFormStatusToast { z-index: 1090; }
.nuSbList { list-style: none; margin: 0; padding: 0; }
.nuSbItem { display: flex; align-items: center; border-radius: .5rem; border: 1px solid transparent; margin: 1px 0; }
.nuSbItem:hover { background: var(--bs-tertiary-bg); }
.nuSbItem.active { background: var(--nu-sb-active); border-color: color-mix(in srgb, var(--nu-accent) 25%, transparent); }
.nuSbSec-fav .nuSbItem.active { background: color-mix(in srgb, var(--nu-sb-fav) 9%, var(--nu-surface)); border-color: color-mix(in srgb, var(--nu-sb-fav) 30%, transparent); }
.nuSbGrow { flex: 1 1 auto; min-width: 0; }
.nuSbForm { margin: 0; }
.nuSbLink { display: flex; align-items: center; gap: .7rem; width: 100%; padding: .4rem .5rem; color: var(--bs-body-color); text-decoration: none; border: 0; background: none; text-align: left; border-radius: .5rem; }
.nuSbLink:hover { color: var(--bs-body-color); }
.nuSbItem.active .nuSbLink { font-weight: 600; }
.nuSbIcon { --nu-ic: var(--nu-sb-c, var(--nu-accent)); flex: none; width: 2rem; height: 2rem; border-radius: .5rem; display: inline-flex; align-items: center; justify-content: center; font-size: 1rem;
	background: color-mix(in srgb, var(--nu-ic) 13%, var(--nu-surface)); color: color-mix(in srgb, var(--nu-ic) 85%, var(--bs-body-color)); }
[data-bs-theme="dark"] .nuSbIcon { background: color-mix(in srgb, var(--nu-ic) 24%, var(--nu-surface)); color: color-mix(in srgb, var(--nu-ic) 60%, #fff); }
.nuSbLabel { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nuSbStar { flex: none; margin-right: .2rem; }
.nuSbFav { font-size: .9rem; }
.nuSbFav.on { color: var(--nu-sb-fav); }
span.nuSbFav { padding: .35rem .4rem; }
.nuSbItem:not(.fav) .nuSbFav { opacity: 0; }
.nuSbItem:not(.fav):hover .nuSbFav, .nuSbItem:not(.fav) .nuSbFav:focus-visible { opacity: 1; }
.nuSbEmpty { margin: 0; padding: .1rem .5rem .4rem; font-size: .8rem; color: var(--bs-secondary-color); }
/* a drawer on every screen width (0.8.513): opened by the button left of the logo – no column next to the page, no icon rail */
.nuShell { display: block; min-height: 0; }
.nuSidebar { position: fixed; top: 0; left: 0; bottom: 0; height: 100vh; width: min(var(--nu-sb-w), 85vw); z-index: 1050; transform: translateX(-100%); visibility: hidden;
	transition: transform .2s ease, visibility .2s; box-shadow: none; }
body.nuSbOpen .nuSidebar { transform: none; visibility: visible; box-shadow: 0 0 2rem rgba(0, 0, 0, .25); }
body.nuSbOpen { overflow: hidden; }
.nuSbClose { display: inline-block; }
.nuSbBackdrop { position: fixed; inset: 0; background: rgba(0, 0, 0, .35); z-index: 1045; }
@media (hover: none) { .nuSbItem:not(.fav) .nuSbFav { opacity: 1; } }
/* pinned (0.8.556, .nuShell.nuSbPinned): from 992 px a column next to the page that stays on every page – sticky below the top bar,
   no backdrop; below 992 px the drawer as before. The pin button shows only where pinning works. */
.nuSbPin { display: none; border: 0; background: none; color: var(--bs-secondary-color); border-radius: .375rem; line-height: 1; padding: .35rem .4rem; }
.nuSbPin:hover { background: var(--bs-tertiary-bg); color: var(--bs-body-color); }
.nuSbPin[aria-pressed="true"] { color: var(--nu-accent); }
@media (min-width: 992px) {
	.nuSbPin { display: inline-block; }
	.nuShell.nuSbPinned { display: flex; align-items: flex-start; min-height: calc(100vh - var(--nu-nav-h)); }
	.nuShell.nuSbPinned .nuSidebar { position: sticky; top: var(--nu-nav-h); bottom: auto; height: calc(100vh - var(--nu-nav-h)); width: var(--nu-sb-w); z-index: 1;
		transform: none; visibility: visible; box-shadow: none; transition: none; }
	.nuShell.nuSbPinned .nuSbClose { display: none; }
}
@media (prefers-reduced-motion: reduce) { .nuSidebar { transition: none; } }
@media print { .nuSidebar, .nuSbOpenBtn { display: none !important; } .nuShell { display: block; } }

/* Admin tools → Custom code (0.8.523): group labels in the tab row – Form pages | All pages */
.scodeTabs .scodeGroup { display: flex; align-items: center; padding: 0 .35rem 0 .75rem; }
.scodeTabs .scodeGroup:first-child { padding-left: 0; }
.scodeGroupLabel { font-size: .7rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--bs-secondary-color); white-space: nowrap; }
.scodeTabs .scodeGroup:not(:first-child) { border-left: 1px solid var(--bs-border-color); margin-left: .5rem; }

/* Custom code templates (0.8.524): dialogue with list + code preview */
.scodeTplMenu { max-height: 60vh; overflow-y: auto; }
.scodeTplBody { min-height: 50vh; }
.scodeTplList { max-height: 65vh; overflow-y: auto; }
.scodeTplCat { background: var(--bs-tertiary-bg); font-size: .7rem; letter-spacing: .05em; }
.scodeTplCode { max-height: 55vh; overflow: auto; padding: .75rem; border: 1px solid var(--bs-border-color); border-radius: .5rem; background: var(--bs-tertiary-bg); font-size: .8rem; white-space: pre; }
.scodeHint { max-width: 60rem; }

/* scrollbars (0.8.514): thin, soft grey, rounded – light and dark (data-bs-theme). Chrome / Edge / Safari use the ::-webkit-scrollbar rules
   (rounded thumb); browsers without them (Firefox) the standard scrollbar-width / scrollbar-color – set only there, because Chromium
   ignores the ::-webkit-scrollbar rules as soon as scrollbar-color is set */
:root { --nu-sb-track: #f1f5f9; --nu-sb-thumb: #cbd5e1; --nu-sb-thumb-hover: #94a3b8; }
[data-bs-theme="dark"] { --nu-sb-track: #1e293b; --nu-sb-thumb: #475569; --nu-sb-thumb-hover: #64748b; }
@supports not selector(::-webkit-scrollbar) {
	* { scrollbar-width: thin; scrollbar-color: var(--nu-sb-thumb) var(--nu-sb-track); }
}
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--nu-sb-track); border-radius: 4px; }
::-webkit-scrollbar-thumb { background: var(--nu-sb-thumb); border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: var(--nu-sb-thumb-hover); }
::-webkit-scrollbar-corner { background: var(--nu-sb-track); }

/* column widths by dragging a title (0.8.650 browse lists, 0.8.651 system lists – window.nuColResize in nuapp.js): pan-y leaves the sideways
   move to the drag on touch screens; the right edge shows the resize cursor; after the first drag the widths are fixed (nuColFixed), titles
   and cells end with … when narrow */
table.nuColResize > thead > tr > th:is(.nuBrowseTitle, [data-nu-col]) { position: relative; touch-action: pan-y; }
table.nuColResize > thead > tr > th:is(.nuBrowseTitle, [data-nu-col])::after { content: ''; position: absolute; top: 0; bottom: 0; inset-inline-end: 0; width: 8px; cursor: col-resize; }
table > thead > tr > th.nuColResizing { box-shadow: inset -2px 0 0 var(--bs-primary); }
[dir="rtl"] table > thead > tr > th.nuColResizing { box-shadow: inset 2px 0 0 var(--bs-primary); }
table.nuColFixed { table-layout: fixed; }
table.nuColFixed > thead > tr > th { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
table.nuColFixed > tbody > tr > td { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
table.nuColFixed > tbody > tr > td :is(div, p) { overflow: hidden; text-overflow: ellipsis; }
table.nuColFixed > tbody > tr > td[colspan] { white-space: normal; }   /* "No records" */
body.nuColResizingBody, body.nuColResizingBody * { cursor: col-resize !important; user-select: none; }

/* accessibility (0.8.368, dev/tests/a11y.js – WCAG AA, text contrast at least 4.5:1): Bootstrap's grey #6c757d of outline buttons,
   its link blue and a few own colours are a little too light on the grey page (#f4f6f9) or too dark in dark mode. */
:root:not([data-bs-theme="dark"]) .btn-outline-secondary { --bs-btn-color: #5c636a; }
:root:not([data-bs-theme="dark"]) { --bs-link-color: #0a58ca; --bs-link-color-rgb: 10, 88, 202; --bs-link-hover-color: #084298; --bs-link-hover-color-rgb: 8, 66, 152; }
:root:not([data-bs-theme="dark"]) .btn.nuBtnSave.nuSaveEdited, :root:not([data-bs-theme="dark"]) #nbSave.nbDirty { --bs-btn-color: #b02a37; --bs-btn-hover-color: #b02a37; --bs-btn-active-color: #b02a37; --bs-btn-disabled-color: #b02a37; }
:root:not([data-bs-theme="dark"]) { --nu-tab-active-color: #1f6fb8; }
[data-bs-theme="dark"] .btn-outline-secondary { --bs-btn-color: #adb5bd; }
[data-bs-theme="dark"] .btn-outline-primary { --bs-btn-color: #6ea8fe; }
[data-bs-theme="dark"] { --nu-th-color: #9aa5b1; }
[data-bs-theme="dark"] .nuHelpBody .doc-red { color: #ea868f; }
/* phones (0.8.368, a11y.js): wide help tables scroll inside their box, the update page's file field fits the screen */
@media (max-width: 575.98px) {
	.nuHelpBody table { display: block; max-width: 100%; overflow-x: auto; }
	#updPackage { max-width: 100%; }
}
/* more contrast (0.8.368): "+ Add" buttons, the import steps, red texts in dark mode, CodeMirror's line numbers */
:root:not([data-bs-theme="dark"]) .btn.nuAddBtn { --bs-btn-color: #5c636a; }
[data-bs-theme="dark"] .btn.nuAddBtn { --bs-btn-color: #adb5bd; }
.impSteps li.active { color: var(--bs-link-color); }
[data-bs-theme="dark"] .text-danger, [data-bs-theme="dark"] .nuNegative { color: #ea868f !important; }
.CodeMirror .CodeMirror-linenumber, .cm-s-default .CodeMirror-linenumber { color: #666; }
[data-bs-theme="dark"] .CodeMirror .CodeMirror-linenumber { color: #9aa5b1; }
[data-bs-theme="dark"] .btn-outline-danger { --bs-btn-color: #ea868f; }
[data-bs-theme="dark"] .text-success { color: #75b798 !important; }
/* CodeMirror in dark mode (0.8.368 – before, every editor kept CodeMirror's light colours on the dark page): one palette for the
   form runtime, procedures, builder, nuconfig.php; colours with at least 4.5:1 on the editor background */
[data-bs-theme="dark"] .CodeMirror { background: #1c2027; color: #e9ecef; }
[data-bs-theme="dark"] .CodeMirror .CodeMirror-gutters { background: #1c2027; border-right-color: #343a40; }
[data-bs-theme="dark"] .CodeMirror .CodeMirror-cursor { border-left-color: #e9ecef; }
[data-bs-theme="dark"] .CodeMirror div.CodeMirror-selected, [data-bs-theme="dark"] .CodeMirror-focused div.CodeMirror-selected { background: #2f3b4a; }
[data-bs-theme="dark"] .CodeMirror .cm-keyword, [data-bs-theme="dark"] .CodeMirror .cm-attribute { color: #c792ea; }
[data-bs-theme="dark"] .CodeMirror .cm-atom, [data-bs-theme="dark"] .CodeMirror .cm-number { color: #f78c6c; }
[data-bs-theme="dark"] .CodeMirror .cm-def, [data-bs-theme="dark"] .CodeMirror .cm-variable-2, [data-bs-theme="dark"] .CodeMirror .cm-header, [data-bs-theme="dark"] .CodeMirror .cm-link { color: #82aaff; }
[data-bs-theme="dark"] .CodeMirror .cm-variable, [data-bs-theme="dark"] .CodeMirror .cm-punctuation { color: #e9ecef; }
[data-bs-theme="dark"] .CodeMirror .cm-variable-3, [data-bs-theme="dark"] .CodeMirror .cm-type, [data-bs-theme="dark"] .CodeMirror .cm-builtin { color: #ffcb6b; }
[data-bs-theme="dark"] .CodeMirror .cm-property { color: #9cdcfe; }
[data-bs-theme="dark"] .CodeMirror .cm-operator { color: #89ddff; }
[data-bs-theme="dark"] .CodeMirror .cm-comment { color: #9aa5b1; }
[data-bs-theme="dark"] .CodeMirror .cm-string, [data-bs-theme="dark"] .CodeMirror .cm-qualifier { color: #c3e88d; }
[data-bs-theme="dark"] .CodeMirror .cm-string-2, [data-bs-theme="dark"] .CodeMirror .cm-tag { color: #f07178; }
[data-bs-theme="dark"] .CodeMirror .cm-meta, [data-bs-theme="dark"] .CodeMirror .cm-bracket { color: #b0b8c0; }
[data-bs-theme="dark"] .CodeMirror .cm-error { color: #ff8e98; background: transparent; }
[data-bs-theme="dark"] .CodeMirror .CodeMirror-matchingbracket { color: #c3e88d !important; outline: 1px solid #4f5c6a; }

/* toggle with a chevron that turns when its collapse is open (update page → Other ways to update, 0.8.376) */
.nuChevToggle .bi-chevron-right { display: inline-block; transition: transform .2s; }
.nuChevToggle:not(.collapsed) .bi-chevron-right { transform: rotate(90deg); }
[dir="rtl"] .nuChevToggle:not(.collapsed) .bi-chevron-right { transform: rotate(-90deg); }
@media (prefers-reduced-motion: reduce) { .nuChevToggle .bi-chevron-right { transition: none; } }

/* flash messages as toasts (nu_flash(…, true), 0.8.377): top right, below the top bar */
.nuFlashToasts { top: 3.5rem; z-index: 1090; }

/* update page → packages in the folder _update (0.8.381): the list at most 450 px wide, Check package below it */
.nuUpdFolderList { max-width: 450px; }

/* form drafts (0.8.386): preview banner under the top bar, badge in iframes */
.nuDraftBanner { position: sticky; top: var(--nu-nav-h, 0px); z-index: 1015; background: var(--bs-warning-bg-subtle); color: var(--bs-warning-text-emphasis); }
.nuDraftBanner .btn-outline-dark { --bs-btn-color: var(--bs-warning-text-emphasis); --bs-btn-border-color: var(--bs-warning-border-subtle); }
.nuDraftBadge { position: fixed; top: .35rem; inset-inline-end: .35rem; z-index: 1080; padding: .1rem .45rem; border-radius: .35rem; font-size: .7rem; font-weight: 600;
	letter-spacing: .04em; background: var(--bs-warning); color: #000; pointer-events: none; }

/* ---------------------------------------------------------------- page forms (form type "page", 0.8.387): the iframe of the wrapper */
.nuPageWrap .nuPageFrame { display: block; width: 100%; border: 0; height: calc(100vh - 150px); min-height: 200px; background: var(--bs-body-bg); }
.nu-bare .nuPageWrap .nuPageFrame { height: 100vh; }
.nuPageWrap .nuPageCrumbs .breadcrumb { font-size: .875rem; }
.nuPageToasts { z-index: 1090; }

/* update page: "Update from GitHub" as label / value rows (0.8.389) */
.nuGhInfo { display: grid; grid-template-columns: max-content 1fr; gap: .6rem 2.5rem; margin-bottom: 1.25rem; }
.nuGhInfo dt { font-weight: 400; color: var(--bs-secondary-color); }
.nuGhInfo dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.nuGhInfo .badge { font-weight: 500; font-size: .85em; padding: .4em .8em; }
.nuGhBadgePre { background: var(--bs-warning-bg-subtle); color: var(--bs-warning-text-emphasis); }
.nuGhBadgeMuted { background: var(--bs-secondary-bg); color: var(--bs-body-color); }
@media (max-width: 575.98px) { .nuGhInfo { grid-template-columns: 1fr; gap: .1rem; } .nuGhInfo dd { margin-bottom: .5rem; } }
.nuGhAgain { font-size: .9em; text-decoration: none; vertical-align: baseline; }
.nuGhAgain:hover { text-decoration: underline; }

/* update page tabs (0.8.392): one line, scrolls sideways on phones; dot = something to look at in "System" */
.nuUpdTabs { flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden; scrollbar-width: thin; }
.nuUpdTabs .nav-link { white-space: nowrap; }
.nuTabDot { display: inline-block; width: .55rem; height: .55rem; border-radius: 50%; vertical-align: middle; }

/* print view of lists (0.8.397): × after each column title hides the column */
.nu-print-table .nuColHidden { display: none; }
.nu-print-table th .nuColHide { border: 0; background: none; padding: 0 .1rem; margin-left: .25rem; line-height: 1; color: var(--bs-secondary-color); vertical-align: middle; }
.nu-print-table th .nuColHide:hover, .nu-print-table th .nuColHide:focus-visible { color: var(--bs-danger); }

/* notifications → Manage (0.8.402): the ⋯ column stays visible when the table scrolls sideways on phones */
.nuNtfManage th:last-child, .nuNtfManage td:last-child { position: sticky; right: 0; z-index: 1; background: var(--nu-surface, var(--bs-body-bg)); }
.nuNtfManage td:last-child .dropdown-menu { z-index: 1060; }
.nuCopyBuffer { position: fixed; left: -10000px; top: 0; opacity: 0; }
/* page size menu in the list footer (0.8.437) */
.nuLfPerBtn { color: var(--bs-secondary-color); font-size: inherit; padding: .15rem .5rem; border: 1px solid transparent; }
.nuLfPerBtn:hover, .nuLfPerBtn:focus-visible, .nuLfPerBtn.show { color: var(--bs-body-color); border-color: var(--bs-border-color); }
.nuLfPerMenu { min-width: 9rem; font-size: .875rem; }
.cfgInsLine { background: var(--bs-success-bg-subtle); }
.cfgInsList { max-height: 50vh; overflow: auto; }
.cfgInsItem code { color: var(--bs-body-color); }
/* tabs a script opens after loading – hidden until then (0.8.444, nutheme.js / nuapp.js) */
html.nuTabsPending [data-nu-tab-restore] { visibility: hidden; }
.CodeMirror.scodeCM { height: calc(100vh - 400px); min-height: 360px; }   /* without JS; nuglobalcode.js fits it to the window (0.8.554) – .CodeMirror: codemirror.css loads later */
.scodeTools:empty { display: none; }
.updBkSelCol { width: 2.5rem; padding-inline-start: 1rem !important; }

/* access level: data mode / form type per form (0.8.461) – the whole option text visible (the table scrolls on small screens) */
.nu-rights .nuAccMode-dm { min-width: 16.5rem; }
.nu-rights .nuAccMode-ft { min-width: 10rem; }

/* jquery-confirm dialogs (Delete … – form runtime and nuBuilder form code) follow the theme (0.8.470): the library's box is always
   white while title and text took the light text colour of dark mode – unreadable */
.jconfirm .jconfirm-box { color: var(--bs-body-color); }
.jconfirm .jconfirm-box div.jconfirm-title-c, .jconfirm .jconfirm-box div.jconfirm-content-pane .jconfirm-content { color: var(--bs-emphasis-color); }
.jconfirm .jconfirm-box div.jconfirm-content-pane .jconfirm-content { color: var(--bs-body-color); }
[data-bs-theme="dark"] .jconfirm .jconfirm-box { background: var(--bs-tertiary-bg); border: 1px solid var(--bs-border-color); }
[data-bs-theme="dark"] .jconfirm.jconfirm-light .jconfirm-box { box-shadow: 0 .5rem 1.5rem rgba(0, 0, 0, .6); }
[data-bs-theme="dark"] .jconfirm.jconfirm-light .jconfirm-bg { background-color: #000; opacity: .55; }
[data-bs-theme="dark"] .jconfirm.jconfirm-light .jconfirm-box .jconfirm-buttons button.btn-default { background: var(--bs-secondary-bg); color: var(--bs-body-color); }
[data-bs-theme="dark"] .jconfirm.jconfirm-light .jconfirm-box .jconfirm-buttons button.btn-default:hover { background: var(--bs-border-color); }
[data-bs-theme="dark"] .jconfirm .jconfirm-box div.jconfirm-closeIcon { color: var(--bs-body-color); }

/* Code editors: the label opens Copy / Paste / Paste (replace existing) (0.8.476, nucodetools.js) */
.nuClipLabel { cursor: pointer; text-decoration: underline dotted; text-underline-offset: 3px; }
.nuClipLabel:hover, .nuClipLabel:focus-visible { color: var(--bs-link-color); }
.nuClipMenu { min-width: 14rem; max-width: calc(100vw - 16px); }
.nuClipMenu.nuClipManual { padding: .5rem; width: 22rem; }
.nuClipFlash { margin-left: .5rem; vertical-align: middle; }

/* Data access of a form (0.8.480, pages/nudataaccess.php) */
.daField > summary { cursor: pointer; list-style-position: inside; }
.daRules select.daType { min-width: 11rem; }
.daRules .daSubject { min-width: 11rem; }
.daRules select.daMode { min-width: 10rem; }
.daRules td:nth-child(5) input { min-width: 14rem; }

/* form info / record info (i) panel (0.8.435; own record pages 0.8.500) – NuFormInfo::panel() */
.nuFormInfo { width: 26rem; max-width: calc(100vw - 2rem); }
.nuFormInfoList { padding: .25rem 0; }
.nuFormInfoRow { display: grid; grid-template-columns: 7.5rem minmax(0, 1fr) auto; align-items: start; gap: .5rem; padding: .25rem .5rem .25rem 1rem; }
.nuFormInfoRow:hover { background: var(--bs-tertiary-bg); }
.nuFormInfoRow dt { font-weight: 500; color: var(--bs-secondary-color); padding-top: .2rem; }
.nuFormInfoRow dd { margin: 0; padding-top: .2rem; overflow-wrap: anywhere; min-width: 0; }
.nuFormInfoRow code { color: var(--bs-body-color); }
.nuFormInfoCopy { padding: 0 .35rem; line-height: 1.6; color: var(--bs-secondary-color); }
.nuFormInfoCopy:hover, .nuFormInfoCopy:focus-visible { color: var(--bs-primary); }
.nuFormInfoActs { display: flex; flex-direction: column; align-items: center; }
.nuFormInfoSqlBig { white-space: pre-wrap; word-break: break-word; font-size: .875rem; background: var(--bs-tertiary-bg); padding: .75rem 1rem; border-radius: .375rem; min-height: 8rem; }
.nuFormInfoSql { max-height: 8rem; overflow: auto; white-space: pre-wrap; font-size: .8em; background: var(--bs-tertiary-bg); padding: .25rem .4rem; border-radius: .25rem; }

/* a form whose fields join the flex row around it (update page: options, then Install + Cancel on their own row, 0.8.505) */
.nuContents { display: contents; }

/* setup wizard (0.8.544): fields as wide as their content needs, not the whole column */
#wizForm #lang { width: 260px; max-width: 100%; }
#wizForm #timezone + .ts-wrapper, #wizForm select#timezone { width: 320px; max-width: 100%; }
#wizForm #timeout, #wizForm #timeout_ga { width: 80px; }
#wizForm #base_url { max-width: 520px; }
#wizForm #nub_path { max-width: 640px; }
#wizForm #title { max-width: 400px; }
#wizForm #env_label { max-width: 200px; }
#wizForm #env_color { width: 80px; }
#wizForm #dbtool { max-width: 300px; }
#wizForm #pw1, #wizForm #pw2 { width: 320px; max-width: 100%; }   /* side by side (col-sm-auto, 0.8.545) */
#wizForm #admin_email { max-width: 400px; }

/* API clients list (0.8.547): the scopes of a client in a small menu – never wider than the screen, long descriptions wrap */
.nuApiScopes .dropdown-menu { max-width: min(92vw, 480px); }
.nuApiScopes .dropdown-item-text { white-space: normal; }

/* form builder toolbar (0.8.619): groups with a thin divider, the deleting buttons in their own row */
.nbToolbar { display: flex; flex-direction: column; gap: .5rem; width: 100%; }
.nbTbRow { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.nbTbGroup, .nbTbSlot { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.nbTbSlot:empty { display: none; }
.nbTbRow > .nbTbGroup:not(.d-none) ~ .nbTbGroup:not(.d-none) { padding-left: .5rem; border-left: 1px solid var(--bs-border-color); }
@media (max-width: 575.98px) { .nbTbRow > .nbTbGroup:not(.d-none) ~ .nbTbGroup:not(.d-none) { padding-left: 0; border-left: 0; } }

/* update page: database choice of the backup before an update (0.8.624) – on phones the select goes below its label and fits the screen */
.updBkDbRow { min-width: 0; max-width: 100%; }
.updBkDbSel { width: auto; min-width: 0; max-width: 100%; }   /* also Backups → Back up now */
@media (max-width: 575.98px) {
	.updBkDbRow { flex: 1 1 100%; }
	.updBkDbRow > label { flex: 0 0 calc(100% - 2rem); white-space: normal !important; }
	.updBkDbRow .updBkDbSel { flex: 1 1 0; }
}

/* Reset database (0.8.628, pages/nudbreset.php) */
.dbrTables { max-height: 16rem; }
.dbrNarrow { max-width: 24rem; }
.dbrWide { max-width: 32rem; }
.brandLogoShow { max-width: 24rem; }

/* Themes (0.8.632, pages/nuthemes.php) */
.thNarrow { max-width: 24rem; }
.thSwatch { display: inline-flex; flex-shrink: 0; border: 1px solid var(--bs-border-color); border-radius: .4rem; overflow: hidden; }
.thSw { display: block; width: .8rem; height: 2.2rem; }
.thCardDefault { border-color: var(--bs-primary); box-shadow: 0 0 0 1px var(--bs-primary); }
.thColor .thPick { flex: 0 0 2.4rem; max-width: 2.4rem; padding: .15rem; }
.thColor.thEmpty .thPick { opacity: .35; }
.thColor .thHex { font-family: var(--bs-font-monospace); font-size: .8rem; }
.thPreview { display: block; width: 100%; height: 640px; border: 1px solid var(--bs-border-color); border-radius: .5rem; background: var(--bs-body-bg); }
@media (min-width: 1200px) { .thPreviewWrap { position: sticky; top: calc(var(--nu-sticky-top, 57px) + var(--nu-sticky-h, 0px) + 1rem); } .thPreview { height: calc(100vh - 9rem); min-height: 520px; } }
.thPreviewBody { min-height: 100vh; }
.thLevels select { max-width: 20rem; }

/* ---------------------------------------------------------------- header layouts (test) – TEMPORARY (0.8.634, developer mode,
   assets/js/nuheadervariant.js; classes nuHv-a … nuHv-e on <html>). Remove together with the script. */
.nuHvHidden { display: none !important; }
.nuHv .nuHvBar { flex-wrap: wrap; align-items: center; row-gap: .4rem; margin-bottom: .6rem !important; }
.nuHv .nuHvBar > div:last-child:not(:first-child):not(.nuTitleSub) { flex-basis: auto; margin-inline-start: auto; }
.nuHv .nuHvBar > h1, .nuHv .nuHvBar > nav { margin-inline-end: .5rem; }
.nuHv .nuHvBar h1 { font-size: 1.2rem; font-weight: 650; }
.nuHv .nuHvBar .btn:not(.dropdown-item):not(.nuImpIconBtn) { --bs-btn-padding-y: .25rem; --bs-btn-padding-x: .6rem; --bs-btn-font-size: .875rem; }
.nuHv nav[aria-label="breadcrumb"] .breadcrumb { margin-bottom: .25rem !important; }
.nuHv .nuHvBar > nav .breadcrumb { margin-bottom: 0 !important; flex-wrap: nowrap; align-items: center; }
.nuHv .nuHvBar > nav { min-width: 0; }
.nuHv .nuHvBackIcon { border: 0; background: transparent; padding: .1rem .35rem !important; font-size: 0 !important; }
.nuHv .nuHvBackIcon > .bi { font-size: 1.15rem; margin: 0 !important; }
.nuHv .nuHvCrumbTitle { font-size: 1.2rem; font-weight: 650; color: var(--bs-emphasis-color) !important; display: inline-flex; align-items: center; gap: .35rem; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nuHv .nuHvCrumbTitle .nuBreadcrumb { font-weight: 650 !important; }
.nuHv .nuHvCrumbTitle .nuImpIconBtn { font-size: 1.1rem; padding: 0 .2rem; }
.nuHv .nuHvBar .breadcrumb-item a { text-decoration: none; }
.nuHv .nuHvBar .breadcrumb-item + .breadcrumb-item.nuHvCrumbTitle::before { align-self: center; }
.nuHv .nuHvPlain h1 { font-size: 1.15rem; }
.nuHv .nuListHead.nuHvPlain { padding: .6rem 1rem; }
.nuHv .nuHvGroupMoved:not(:has(> :not(.nuHvHidden))) { display: none !important; }
.nuHvMoreBtn { padding-inline: .45rem !important; }
.nuHv-c .nuFormHeader .btn-group:has(> .nuHvHidden), .nuHv-d .nuFormHeader .btn-group:has(> .nuHvHidden), .nuHv-e .nuFormHeader .btn-group:has(> .nuHvHidden) { display: none; }
/* D: the header stays under the top bar while scrolling */
.nuHv main.nuContainer { padding-top: .9rem !important; }
.nuHv .nuHvSticky { position: sticky; top: var(--nu-nav-h, 56px); z-index: 1010; background: var(--nu-page); margin-inline: -1rem; padding: .45rem 1rem; border-bottom: 1px solid var(--bs-border-color); }
/* phones (C, D, E): Save in a bar at the bottom of the screen */
@media (max-width: 575.98px) {
	.nuHv-c .nuHvSave, .nuHv-d .nuHvSave, .nuHv-e .nuHvSave { position: fixed; z-index: 1030; inset-inline: .75rem; bottom: .75rem; justify-content: center; padding: .55rem 1rem !important;
		box-shadow: 0 4px 16px rgba(0, 0, 0, .18); background: var(--nu-surface); font-size: 1rem !important; }
	.nuHv-c main, .nuHv-d main, .nuHv-e main { padding-bottom: 4.5rem; }
	.nuHv .nuHvBar .btn:not(.nuHvSave):not(.dropdown-item) .bi { margin: 0 !important; }
	.nuHv .nuHvSave .bi { margin-inline-end: .4rem !important; }
}
/* E: compact density */
.nuHv-e .nu-navbar { --bs-navbar-padding-y: .25rem; min-height: 48px; }
.nuHv-e main.nuContainer, .nuHv-e main.container-fluid { padding-top: .5rem !important; }
.nuHv-e .card-header { padding: .45rem .8rem; }
.nuHv-e .card-body { padding: .7rem .8rem; }
.nuHv-e .row.g-3 { --bs-gutter-y: .55rem; --bs-gutter-x: .8rem; }
.nuHv-e .form-control:not(.nuAbs .form-control), .nuHv-e .form-select:not(.nuAbs .form-select) { padding-top: .25rem; padding-bottom: .25rem; }
.nuHv-e .form-label { margin-bottom: .2rem; }
.nuHv-e .nav-tabs .nav-link { padding: .4rem .75rem; }
.nuHv-e .mb-3 { margin-bottom: .6rem !important; }

/* sections of a tab (0.8.638, nuapp.js): long tap / right-click on a tab; the card jumped to lights up briefly */
.nuTabSections { min-width: 12rem; max-width: calc(100vw - 16px); }
.card.nuSectionFlash { box-shadow: 0 0 0 .2rem rgba(var(--bs-primary-rgb), .35) !important; transition: box-shadow .3s; }
.nav-tabs [data-bs-toggle="tab"] { -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; }
.nuTabSecArrow { display: inline-flex; align-items: center; margin-inline-start: .3rem; padding: .1rem .2rem; border-radius: .3rem; font-size: .7rem; opacity: .7; cursor: pointer; }
.nuTabSecArrow:hover { opacity: 1; background: var(--bs-secondary-bg); }

/* light mode (0.8.640): pressed / selected grey buttons (pin of the ☰ menu, Active · Archived · All, Basic · Advanced …) and grey badges
   in a lighter grey than Bootstrap's #6c757d */
:root:not([data-bs-theme="dark"]) .btn.btn-outline-secondary:not(.nuSearchBtn),
:root:not([data-bs-theme="dark"]) .btn.btn-outline-secondary.nuRowBtn,
:root:not([data-bs-theme="dark"]) .btn.btn-outline-secondary.nuToolBtn { --bs-btn-active-bg: #8a939b; --bs-btn-active-border-color: #8a939b; --bs-btn-active-color: #fff; }
:root:not([data-bs-theme="dark"]) .text-bg-secondary { background-color: #8a939b !important; color: #fff !important; }
:root:not([data-bs-theme="dark"]) .btn-group > .btn-check:checked + .btn-outline-secondary { background-color: #8a939b; border-color: #8a939b; color: #fff; }
/* pin of the ☰ menu when pinned (0.8.641): grey pin on a light background instead of the filled grey button */
.btn.btn-outline-secondary#nuNavPin.active { background-color: #e9ecef; border-color: #ced4da; color: #6c757d; }
[data-bs-theme="dark"] .btn.btn-outline-secondary#nuNavPin.active { background-color: #2b3138; border-color: #4a535c; color: #adb5bd; }

/* ---------------------------------------------------------------- sticky button row (0.8.642): header row of form and record pages stays
   under the top bar; once stuck a box-shadow paints the page colour around it (no layout shift) plus a hairline below */
.nuStickyBar { position: sticky; top: calc(var(--nu-sticky-top, var(--nu-nav-h, 57px)) + .5rem); z-index: 1010; background: var(--nu-page); }
.nu-bare .nuStickyBar { top: .5rem; }
.nuStickyBar.nuStuck { box-shadow: 0 0 0 .5rem var(--nu-page), 0 1px 0 .5rem var(--bs-border-color); }
@media print { .nuStickyBar { position: static; box-shadow: none !important; } }
html { scroll-padding-top: calc(var(--nu-sticky-top, 57px) + var(--nu-sticky-h, 0px) + .5rem); }   /* anchors / scrollIntoView land below the sticky rows */

/* welcome e-mail preview of the user form (0.8.684, assets/js/nuuser.js) – the mail in an iframe of its own, editable */
.nuWpvFrame { display: block; width: 100%; height: min(60vh, 34rem); border: 1px solid var(--bs-border-color); border-radius: var(--bs-border-radius); background: #f4f6f9; }
.nuWpvSource { height: min(60vh, 34rem); font-size: .8125rem; }

/* system list filters: per list (class nuLvFlt-<list key> on #nuLvFilters, core/nulistview.php) – permission items: the group filter (0.8.685) */
.nuLvFlt-permissions #lvf_group, .nuLvFlt-permissions #lvf_group + .ts-wrapper { max-width: 450px; }
/* users: Position, Department, Team, Status at most 280 px; admin roles: Has users at most 200 px (0.8.693) */
.nuLvFlt-users :is(#lvf_pos, #lvf_dept, #lvf_team, #lvf_state), .nuLvFlt-users :is(#lvf_pos, #lvf_dept, #lvf_team, #lvf_state) + .ts-wrapper { max-width: 280px; }
.nuLvFlt-adminroles #lvf_has_users, .nuLvFlt-adminroles #lvf_has_users + .ts-wrapper { max-width: 200px; }
#userPermGroup { max-width: 450px; }   /* user form permission items: group filter (0.8.687) */
/* [hidden] wins over Bootstrap's display utilities (.d-flex / .d-inline-flex / .d-block are !important too; 0.8.687 – list rows hidden by a filter) */
.d-flex[hidden], .d-inline-flex[hidden], .d-block[hidden], .d-inline-block[hidden], .d-grid[hidden] { display: none !important; }

/* long list cells fold to three lines (0.8.690, .nuLvClamp – the log's details) */
.nuLvClamp.nuLvClamped { max-height: 4.6em; overflow: hidden; position: relative; }
.nuLvClamp.nuLvClamped::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 1.4em; background: linear-gradient(to bottom, transparent, var(--bs-body-bg)); pointer-events: none; }
.nuLvMore { font-size: inherit; text-decoration: none; }

/* Security check: the state badges filter the list (0.8.693) */
.secFlt { cursor: pointer; } .secFlt:focus-visible { outline: 2px solid var(--bs-primary); outline-offset: 2px; }
.secFlt.secFltOn { box-shadow: 0 0 0 2px var(--bs-body-bg), 0 0 0 4px var(--bs-primary); } .secFlt.secFltOff { opacity: .55; }

/* themes: "Per access level" folds (0.8.695) */
.thLevelsToggle .thChevron { display: inline-block; transition: transform .15s; } .thLevelsToggle:not(.collapsed) .thChevron { transform: rotate(90deg); }
/* dashboard form, Access levels tab: group filter (0.8.697) */
.dashAccGroup { width: auto; max-width: 280px; }
/* integrity check (0.8.698): long lists wrap */
.nuIcRows code { white-space: normal; word-break: break-word; }
.nuIcItem > summary { cursor: pointer; }
/* settings centre (0.8.702, core/nusettingshub.php): side bar of sections + search, the page to the right */
main.nuSetPage { max-width: 1500px; }
.nuSetFrame { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: 1.5rem; align-items: start; }
.nuSetNav { position: sticky; top: calc(var(--nu-sticky-top, 64px) + .5rem); z-index: 1012; padding-bottom: .5rem; }
.nuSetNav .nuSetSections { max-height: calc(100vh - var(--nu-sticky-top, 64px) - 5rem); overflow-y: auto; flex-wrap: nowrap; }
.nuSetNav .nav-link { color: var(--bs-body-color); border-radius: var(--bs-border-radius); padding: .4rem .65rem; font-size: .925rem; }
.nuSetNav .nav-link:hover { background: var(--bs-tertiary-bg); }
.nuSetNav .nav-link.active { background: var(--bs-primary-bg-subtle); color: var(--bs-primary-text-emphasis); font-weight: 600; }
.nuSetNav .nuSetSub { margin: .15rem 0 .35rem 1.65rem; border-left: 2px solid var(--bs-border-color); }
.nuSetNav .nuSetSub .nav-link { font-size: .85rem; padding: .25rem .6rem; border-radius: 0 var(--bs-border-radius) var(--bs-border-radius) 0; }
.nuSetNav .nuSetSub .nav-link.active { background: transparent; color: var(--bs-primary-text-emphasis); }
.nuSetSearch { position: relative; margin-bottom: .75rem; }
.nuSetSearch > .bi-search { position: absolute; left: .6rem; top: .45rem; color: var(--bs-secondary-color); pointer-events: none; font-size: .85rem; }
.nuSetSearch input { padding-left: 1.9rem; }
.nuSetResults { position: absolute; z-index: 1030; left: 0; top: calc(100% + 4px); width: min(480px, calc(100vw - 2rem)); max-height: 60vh; overflow-y: auto; box-shadow: var(--bs-box-shadow); }
.nuSetResults .nuSetHitDesc { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.nuSetResults .list-group-item.active .text-body-secondary, .nuSetResults .list-group-item.active .nuSetHitVal { color: inherit !important; }
.nuSetHitVal { color: var(--bs-secondary-color); }
.nuSetHit { animation: nuSetHit 2.4s ease-out; border-radius: var(--bs-border-radius); }
@keyframes nuSetHit { 0%, 40% { box-shadow: 0 0 0 3px var(--bs-warning); background-color: var(--bs-warning-bg-subtle); } 100% { box-shadow: 0 0 0 0 transparent; } }
fieldset.contents { display: contents; }
.nuSetSecCard:hover { border-color: var(--bs-primary-border-subtle); }
.nuSetSecPages { color: var(--bs-secondary-color); }
.shBkNum { width: 6rem; }
@media (max-width: 991.98px) {
	.nuSetFrame { grid-template-columns: minmax(0, 1fr); gap: .75rem; }
	.nuSetNav { position: static; }
	.nuSetNav .nuSetSections { max-height: none; }
	.nuSetNav .nuSetSections { flex-direction: row !important; flex-wrap: nowrap; overflow-x: auto; gap: .25rem; padding-bottom: .25rem; }
	.nuSetNav .nuSetSections > .nav-item > .nav-link { white-space: nowrap; }
	.nuSetNav .nuSetSub { display: none; }
}
.shBkKeepGrp { max-width: 14rem; }