a.imgButtonSm:link,a.imgButtonSm:visited { display:block; width:auto; text-align:center; border:1px solid black; color:black; text-decoration:none; padding:2px; margin:1px; background-color:white; height:20px; float:left; clear:both }
a.imgButtonSm:hover { border:2px solid black; padding:1px }
a.imgButtonSm img { display:inline; height:20px }

a.imgButtonVsm:link,a.imgButtonVsm:visited { display:block; width:auto; text-align:center; border:1px solid black; color:black; text-decoration:none; padding:2px; margin:1px; background-color:white; height:10px; font-size:5pt; float:left; clear:both }
a.imgButtonVsm:hover { border:2px solid black; padding:1px }
a.imgButtonVsm img { display:inline; height:10px }

.very_small { font-size:8pt }
.bigger { font-size:14pt }
form { padding:0px !important;margin:0px !important }
fieldset { padding:2px;margin:0px }
.noprint {}
.print_only {}

.menuButton {
	min-width: 120px;
	text-align: left !important;
}

@media handheld, screen, projection, tv {
.print_only { display:none !important }

.mainbody { position:absolute;overflow:hidden;padding:0px;width:100%;height:100%;margin:0px }
#browsemain { position:absolute;overflow:auto;bottom:0px;right:0px;padding:1px 20px 0px 5px }
}

@media print {
.noprint { display:none !important }
.listtable { font-size:8pt }

.mainbody { padding:0px;margin:0px }
#browsenav,#overlay { display:none }
}

 .blockAlignLeft {margin-left:0;margin-right:auto}
.blockAlignCenter {margin-left:auto;margin-right:auto}
.blockAlignRight {margin-left:auto;margin-right:0}

table.triAlign { width:100%;padding:0px }
table.triAlign td {border:0px solid black; width:33%;padding:0px }
table.noborder { padding-top:0px;padding-bottom:0px;margin-top:0px;margin-bottom:0px; }
table.noborder > * > tr > td { border:0px solid black;padding:0px;margin:0px;width:auto;border-collapse:separate }
/* table.line_20 td { height:26px;overflow:hidden }*/

table.twoAlign { width:100% }
table.twoAlign td {border:0px solid black; width:50% }

table.subitemlist { margin:1px 5px;width:100%;border-collapse:collapse }
table.subitemlist > * > tr > td { border:1px solid black;margin:5px;padding:5px }
table.subitemlist td.firstCol { border-left-width:2px }
table.subitemlist input,table.subitemlist textarea { vertical-align:middle; margin:3px; background-color:transparent;border:0px solid black }

table.chemlist { margin:1px 5px;width:100%;border-collapse:collapse }
table.chemlist > * > tr > td { border:1px solid black;font-size:8pt }

a.buttonActive { border:2px solid red !important; padding:1px !important; background-color:white !important }

a.imgButton:link,a.imgButton:visited { border:1px solid black; padding:2px; margin:3px; display:block; height:27px;line-height:25px;text-align:center; color:black;background-color:white;font-size:9pt }
a.imgButton:hover { border:2px solid black; padding:1px; background-color:white }

.list_options { position:absolute;background-color:#EDF0FF;border:1px solid black }

table.kleinauftrag { margin:0 }
table.kleinauftrag td { border:0.05mm solid black;font-size:7pt;line-height:7.5pt }
table.kleinauftrag .normal { font-size:8pt;line-height:8.5pt }
table.kleinauftrag .big { font-size:13pt;line-height:13.5pt }

.scombobox-list { color: black; }

body { font-size:9pt;font-family:Verdana,Arial,Helvetica,sans-serif;padding:4px }
@media handheld, screen, projection, tv {
	body {background-color:#EDF0FF}
}
@media print {

}
p { font-size:11pt;margin-left:0px; padding-left:0px; margin-top:8px; margin-right:24px }
#overlay { background-color:#EDF0FF;position:absolute;left:0px;top:0px;width:auto;height:auto }
#perPageOverlay,#showColumnOverlay { background-color:#0e3292;position:absolute;left:0px;top:0px;width:auto;height:auto;padding:5px }
#perPageOverlay a,#showColumnOverlay a { text-decoration:none;color:white;font-weight:bold }
#grand_total {width:100%;text-align:right}
.structureOverlay { position:relative;top:-1px;left:-1px;border:1px solid black;display:block }
.structureButtons { position:absolute;border:0px solid black;display:block;width:auto;z-index:3 }

.searchRxnTable > * > tr > td {vertical-align:top }

.printTable { background-color:white;table-layout:fixed }
.printTable td { vertical-align:top }

/* Tabelle login */
table.blind input { margin:5px }

/* tabMode!="" */
table.formAlign { border-collapse:collapse }
table.formAlign > * > tr > td { vertical-align:middle; padding:5px }

/* tabMode="h" Spalten Name und Wert */
table.formAlignH > * > tr > td { margin:0px;border:1px solid black }
td.formAlignName {  }
td.formAlignValue { cursor:text }

/* Table in list.php // clear:left; */
table.listtable { width:100%;border-collapse:collapse }
table.listtable > * > tr > td { padding:0px 5px; border:1px solid black }
table.listtable > thead > tr > td { padding:5px; border-top-width:0px }
td.literature { vertical-align:top }

/* Table in searchExtAsync.php */
table.exttable { width:100%;border-collapse:collapse }
table.exttable > * > tr > td { padding:3px; border:1px solid black }

/* Trennzeile in list.php */
td.separatorLine { font-weight:bold }

/* Tabs */
#tab_bar,#tab_bar tbody,#tab_bar td { border:0px solid black;padding:0px;margin:0px }

/* interner Link:margin-right:6px; */
a.tab_light { background:transparent url('lib/tab_blue_right.png') no-repeat scroll top right;display:block;float:left;height:18px;margin-right:2px;
margin-bottom:2px;
padding-right:11px;text-decoration:none}
a.tab_light span {background:transparent url('lib/tab_blue.png') no-repeat;display:block;line-height:14px;padding: 3px 0px 1px 11px;color:black}

a.tab_light:hover,a.tab_ext:hover { background:transparent url('lib/tab_blue_over_right.png') no-repeat scroll top right; }
a.tab_light:hover span,a.tab_ext:hover span { background:transparent url('lib/tab_blue_over.png') no-repeat;color:white }

/* externer Link: margin-right:6px; */
a.tab_ext { background:transparent url('lib/tab_red_right.png') no-repeat scroll top right;display:block;float:left;height:18px;margin-right:2px;
margin-bottom:2px;
padding-right:11px;text-decoration:none}
a.tab_ext span {background:transparent url('lib/tab_red.png') no-repeat;display:block;line-height:14px;padding: 3px 0px 1px 11px;color:black}

a.tab_ext:hover,a.tab_ext:hover { background:transparent url('lib/tab_red_over_right.png') no-repeat scroll top right; }
a.tab_ext:hover span,a.tab_ext:hover span { background:transparent url('lib/tab_red_over.png') no-repeat;color:white }

/* aktiver Link: margin-right:6px; */
a.tab_selected { background:transparent url('lib/tab_blue_selected_right.png') no-repeat scroll top right;display:block;float:left;height: 20px;margin-right: 2px;padding-right: 11px;text-decoration: none}
a.tab_selected span {background:transparent url('lib/tab_blue_selected.png') no-repeat;font-weight:bold;display:block;line-height:14px;padding: 3px 0px 3px 11px;color:black}

ul.compare_rxn { padding-left:12px;margin:0px }

a.button_very_small { border:1px solid black;background-color:white;margin:1px;padding:1px } /* mal noch etwas schöner machen */
a.button_very_small:hover { border:2px solid black;margin:0px }

/* edit_reaction */
.text_ansatzzettel { font-size:18pt;text-align:center }
.lj_code { font-size:18pt }
tr.block_head > td {vertical-align:top;border-bottom:1px solid black !important;padding:2px;margin:0px }

/* #reaction_table { position:relative }  ;left:0mm;top:15mm;width:176mm */

.overlayMenu { position:absolute;background-color:#EDF0FF;border:1px solid black;padding:1px;overflow:auto;z-index:5 }
#printMenu,#exportMenu { position:absolute;top:38px;right:16px;width:auto;background-color:#EDF0FF;border:1px solid black;padding:8px;overflow:auto;z-index:5 }
#pdfMenu { position:absolute;top:38px;left:16px;width:auto;background-color:#EDF0FF;border:1px solid black;padding:8px;overflow:auto;z-index:5 }
#listOptions { position:absolute;width:auto;background-color:#EDF0FF;border:1px solid black;padding:8px;overflow:auto;z-index:5 }
table.hidden td { padding:0px; margin:0px; border-collapse:collapse }
thead { font-weight:bold }

 .formTitle { font-size:24pt }
 .barcodeBig { font-size:18pt }

label.trans { margin:1px;padding:1px }
input.trans,select.trans,textarea.trans { margin:1px;padding:1px;background-color:transparent;border:0px solid black }
input.trans,select.trans { vertical-align:middle; }

input.small_input,select.small_input,textarea.small_input { vertical-align:middle; margin:3px; font-size:9pt; padding:0px; margin:0px }
#idx { border:0px solid black }
td.numeric { text-align:right }
td.measured { font-weight:bold }
img { vertical-align:middle }

table.rxnlabel { border-collapse:collapse }
table.rxnlabel > * > tr > td { border:1px solid black; padding:1px;font-size:7pt}
table.rxnlabel > * > tr > td.big { font-size:8pt}
.medium_small { font-size:8pt;line-height:8.5pt;}
.small { font-size:6pt;line-height:6.5pt;}

span.analytical_data_interpretation { display:block;max-width:100%;max-height:5cm;overflow:auto }

table.diagram_table { table-layout:fixed;border-collapse:collapse }
table.diagram_table td { border:1px solid black;vertical-align:top }

table.diagram { table-layout:fixed }
td.diagram { padding:0;margin:0;font-size:1px;line-height:1px }

/* HTML-Diff */
table.diff { width:100% }
table.diff > * > tr > td { vertical-align:top;width:50% }
.diff em { background-color:lightblue;font-style:normal }
.diff em * { background-color:lightblue }

/* ===== Kit theme: tokens ===== */
:root {
	--ink:#16232b; --muted:#667784; --faint:#8a97a2;
	--line:#e1e6eb; --line-strong:#cfd7de;
	--page:#f3f6f8; --surface:#ffffff; --soft:#f7f9fa;
	--accent:#0b7a95; --accent-dark:#095f74; --accent-tint:#e5f2f6;
	--danger:#b83227; --radius:6px;
	--font:"Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,Roboto,"Helvetica Neue",Arial,sans-serif;
}

/* ===== Base ===== */
html, body { background:var(--page) !important; background-image:none !important; color:var(--ink) !important; font-family:var(--font) !important; font-size:13px !important; line-height:1.4; -webkit-font-smoothing:antialiased }
body { padding:0 !important }
a { color:var(--accent) }
a:hover { color:var(--accent-dark) }
b, strong, thead, td.separatorLine { font-weight:600 }
p { font-size:13px !important; margin:8px 0 !important }
table, td, th, input, select, textarea, label, legend, div, span, button { font-family:var(--font) }
td, th, label, legend { font-size:13px }
hr { border:0; border-top:1px solid var(--line); margin:8px 0 }
img { vertical-align:middle }

/* ===== Forms ===== */
input[type=text], input[type=password], input[type=number], input[type=search], input[type=email], input[type=date], input:not([type]), select, textarea {
	font-family:var(--font) !important; font-size:13px !important; color:var(--ink); background:var(--surface);
	border:1px solid var(--line-strong); border-radius:var(--radius); padding:4px 8px; margin:2px; box-sizing:border-box;
	transition:border-color .12s, box-shadow .12s;
}
select { padding-right:4px }
input:focus, select:focus, textarea:focus { outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(11,122,149,.15) }
input.trans, select.trans, textarea.trans, .blind { border:0 !important; background:transparent !important; box-shadow:none !important; padding:1px 2px; border-radius:2px }
input.trans:focus, select.trans:focus, textarea.trans:focus { background:var(--accent-tint) !important; box-shadow:none !important }
/* The app marks its fill-in fields "trans" (upstream gives them a coloured background). Flat and borderless they cannot be found, so every field you can type in gets a
   visible box again; read-only and disabled fields stay flat. */
input.trans:not([readonly]):not([disabled]):not([type=checkbox]):not([type=radio]):not([type=button]):not([type=submit]):not([type=reset]):not([type=hidden]):not([type=image]),
select.trans:not([disabled]), textarea.trans:not([readonly]):not([disabled]) {
	border:1px solid var(--line-strong) !important; background:var(--surface) !important; border-radius:var(--radius) !important; padding:3px 7px !important; min-height:24px; box-sizing:border-box;
}
input.trans:not([readonly]):not([disabled]):hover, select.trans:not([disabled]):hover, textarea.trans:not([readonly]):not([disabled]):hover { border-color:var(--accent) !important }
input.trans:not([readonly]):not([disabled]):focus, select.trans:not([disabled]):focus, textarea.trans:not([readonly]):not([disabled]):focus { background:var(--surface) !important; border-color:var(--accent) !important; box-shadow:0 0 0 3px rgba(11,122,149,.15) !important }
input[type=checkbox], input[type=radio] { accent-color:var(--accent); margin:2px 4px; vertical-align:middle }
input[type=button], input[type=submit], input[type=reset], button {
	font-family:var(--font) !important; font-size:13px !important; font-weight:500; color:var(--ink); background:var(--surface);
	border:1px solid var(--line-strong); border-radius:var(--radius); padding:5px 12px; margin:2px; cursor:pointer;
	transition:background .12s, border-color .12s;
}
input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover, button:hover { background:var(--accent-tint); border-color:var(--accent) }
input[type=submit], input.primary { background:var(--accent); border-color:var(--accent); color:#fff }
input[type=submit]:hover { background:var(--accent-dark); border-color:var(--accent-dark) }
fieldset { border:1px solid var(--line) !important; border-radius:var(--radius); padding:6px 8px !important; margin:0 0 8px !important }
legend { color:var(--muted) !important; font-size:11px !important; font-weight:600 !important; letter-spacing:.04em; text-transform:uppercase; padding:0 4px }

/* ===== Icon buttons ===== */
a.imgButton:link, a.imgButton:visited, a.imgButtonSm:link, a.imgButtonSm:visited, a.imgButtonVsm:link, a.imgButtonVsm:visited,
img.imgButtonSm, a.button_very_small {
	background:var(--surface) !important; border:1px solid var(--line-strong) !important; border-radius:var(--radius);
	color:var(--ink) !important; text-decoration:none; padding:3px 6px !important; margin:2px !important; box-shadow:none;
}
a.imgButton:hover, a.imgButtonSm:hover, a.imgButtonVsm:hover, a.button_very_small:hover {
	background:var(--accent-tint) !important; border:1px solid var(--accent) !important; padding:3px 6px !important; margin:2px !important;
}
/* labeled Edit / Save / Cancel (text added by kit_patch_theme.php); Edit and Save are the filled, obvious ones */
a.imgButtonSm .kit-btn-label { margin-left:6px; font-size:13px; font-weight:600; vertical-align:middle; white-space:nowrap }
a.imgButtonSm#btn_edit:link, a.imgButtonSm#btn_edit:visited, a.imgButtonSm#btn_save:link, a.imgButtonSm#btn_save:visited {
	background:var(--accent) !important; border-color:var(--accent) !important; color:#fff !important; padding:5px 14px !important }
a.imgButtonSm#btn_edit:hover, a.imgButtonSm#btn_save:hover { background:var(--accent-dark) !important; border-color:var(--accent-dark) !important; padding:5px 14px !important }
a.imgButtonSm#btn_edit img, a.imgButtonSm#btn_save img { filter:brightness(0) invert(1) }
a.imgButtonSm#btn_save_disabled { opacity:.55; padding-left:12px !important; padding-right:12px !important }
a.buttonActive, a.imgButtonA { border:1px solid var(--accent) !important; background:var(--accent-tint) !important; padding:3px 6px !important }

/* ===== Tables ===== */
table { border-collapse:collapse }
td, th { border-color:var(--line) }
table.listtable > * > tr > td, table.formAlignH > * > tr > td, table.subitemlist > * > tr > td, table.chemlist > * > tr > td,
table.exttable > * > tr > td, table.diagram_table td, table.rxnlabel > * > tr > td, table.kleinauftrag td {
	border:1px solid var(--line) !important;
}
table.listtable > * > tr > td { padding:3px 8px !important; vertical-align:middle }
/* the personal "Custom" view tab is not offered */
#tab_bar td:has(> a#view_custom_view) { display:none }
/* Files / Chromatograms switch inside the Analytics tab (kit/entry.js) */
#kit_subtabs { display:none; align-items:center; gap:6px; padding:10px 0 12px }
#kit_subtabs a { padding:5px 14px; border:1px solid var(--line-strong); border-radius:999px; font-size:12px; font-weight:500; color:var(--muted); text-decoration:none; background:var(--surface) }
#kit_subtabs a:hover { background:var(--accent-tint); color:var(--accent-dark) }
#kit_subtabs a.on { background:var(--accent-tint); border-color:var(--accent); color:var(--accent-dark); font-weight:600 }
/* Chromatograms view of a notebook entry (kit/entry.js): data.php in an iframe that takes the place of the entry's sheet */
.mainbody > #kit_data_frame, .mainbody > #kit_nmr_frame, .mainbody > #kit_lcms_frame { display:none; flex:1 1 auto; min-height:0; width:calc(100% - 32px); max-width:1400px; align-self:center; margin:16px 0; border:1px solid var(--line); border-radius:12px; background:var(--surface); box-shadow:0 1px 3px rgba(22,35,43,.06) }

/* drag-to-resize columns (kit/colresize.js): fixed layout once the script has frozen the widths */
table.listtable.kit-fixed { table-layout:fixed; width:auto }
table.listtable.kit-fixed > tbody > tr > td, table.listtable.kit-fixed > thead > tr > td { overflow:hidden; text-overflow:ellipsis }
table.listtable > thead > tr > td { position:relative }
.kit-colhandle { position:absolute; top:0; right:-3px; width:7px; height:100%; cursor:col-resize; z-index:3 }
.kit-colhandle::after { content:""; position:absolute; left:3px; top:22%; height:56%; width:1px; background:var(--line-strong); opacity:0; transition:opacity .12s }
table.listtable > thead > tr > td:hover > .kit-colhandle::after { opacity:1 }
.kit-colhandle:hover::after, .kit-colhandle.active::after { opacity:1; background:var(--accent); width:2px; left:2px }
body.kit-resizing, body.kit-resizing * { cursor:col-resize !important; user-select:none !important }
/* compact rows: small structure images, hazard pictograms side by side instead of stacked */
/* structures are trimmed to the drawing by getGif.php?fit=1: shown at their own size, scaled down only when large */
table.listtable img[src*="getGif.php"] { width:150px; height:54px; object-fit:contain; display:block; margin:0 auto }
/* reaction schemes (notebook table view) are trimmed too and fill their cell: as wide as the column, as tall as the drawing needs */
table.listtable img[src*="getGif.php"][src*="reaction_id"] { width:100%; min-width:460px; height:auto; max-height:160px; object-fit:contain }
/* notebook table view: the entry code is a link and the whole row opens the entry (kit/colresize.js) */
table.listtable.kit-fixed img[src*="getGif.php"][src*="reaction_id"] { min-width:0 }
table.listtable a.kit-entry { font-weight:600; white-space:nowrap }
table.listtable > tbody > tr.kit-rowlink { cursor:pointer }
/* name cell: main name only, synonyms in the tooltip */
table.listtable .kit-name { cursor:help }
/* hazard / precautionary statements: short summary, click for the full text */
a.kit-stmts { display:inline-flex; align-items:center; gap:8px; padding:3px 10px; border:1px solid var(--line-strong); border-radius:999px; background:var(--soft); color:var(--ink) !important; font-size:12px; text-decoration:none; white-space:nowrap }
a.kit-stmts:hover { background:var(--accent-tint); border-color:var(--accent); color:var(--accent-dark) !important }
a.kit-stmts b { color:var(--muted); font-weight:600 }
a.kit-stmts i { font-style:normal; color:var(--faint) }
.kit-stmts-p { padding-left:8px; border-left:1px solid var(--line-strong) }
table.listtable td:has(> img[src*="GHS-pictogram"]) { white-space:nowrap }
table.listtable td:has(> img[src*="GHS-pictogram"]) wbr { display:none }
table.listtable img[src*="GHS-pictogram"] { display:inline-block; width:22px; height:22px; margin:0 1px }
/* the per-row link buttons (containers, offers, reactions, details, delete) sit in a row, not one above the other */
table.listtable > tbody > tr > td:has(> table.noborder) { white-space:nowrap }
table.listtable > tbody > tr > td > table.noborder { display:inline-flex !important; vertical-align:middle; margin:0 2px 0 0 }
table.listtable a.imgButtonSm { float:none !important; clear:none !important; display:inline-block }
table.listtable td { line-height:1.3 }
table.listtable > thead > tr > td { background:var(--soft); color:var(--muted); font-size:12px; font-weight:600; border-top:0 !important; padding:8px !important }
table.listtable > tbody > tr:hover > td { background:#f4fafc }
tr.block_head > td { border-bottom:1px solid var(--line-strong) !important; padding:6px 4px }
.list_options, .overlayMenu, #printMenu, #exportMenu, #pdfMenu, #listOptions {
	background:var(--surface) !important; border:1px solid var(--line-strong) !important; border-radius:8px; box-shadow:0 8px 24px rgba(22,35,43,.14); padding:8px;
}
#perPageOverlay, #showColumnOverlay { background:var(--ink) !important; border-radius:8px; box-shadow:0 8px 24px rgba(22,35,43,.2) }

/* ===== Tabs ===== */
a.tab_light, a.tab_ext, a.tab_selected, a.tab_light:hover, a.tab_ext:hover {
	background:none !important; height:auto !important; padding:0 !important; margin:0 4px 0 0 !important; border-radius:6px 6px 0 0;
}
a.tab_light span, a.tab_ext span, a.tab_selected span, a.tab_light:hover span, a.tab_ext:hover span {
	background:none !important; display:block; line-height:1.2 !important; padding:7px 14px !important; color:var(--muted) !important;
	border-bottom:2px solid transparent; font-weight:500 !important; text-decoration:none;
}
a.tab_light span, a.tab_ext span, a.tab_selected span { white-space:nowrap }
a.tab_light:hover span, a.tab_ext:hover span { color:var(--accent-dark) !important; background:var(--accent-tint) !important }
a.tab_selected span { color:var(--accent-dark) !important; border-bottom-color:var(--accent) !important; font-weight:600 !important }

/* ===== Content pages ===== */
#overlay { background:var(--surface) !important }

/* ===== Page frame: toolbar + tabs on top, scrolling "sheet" below (edit.php, list.php, settings ...) =====
   Upstream positions #browsenav at a fixed 82 px and #browsemain below it; here the toolbar grows with its content. */
.mainbody { display:flex !important; flex-direction:column; background:var(--page) !important }
/* list pages wrap toolbar and content in a form: that form is the column that must fill the page and keep #browsemain scrolling */
.mainbody > form:has(> #browsemain) { display:flex; flex-direction:column; flex:1 1 auto; min-height:0; margin:0 !important; padding:0 !important }
#browsenav { position:relative !important; top:auto !important; left:auto !important; height:auto !important; width:auto !important; flex:none;
	background:var(--surface) !important; background-image:none !important; border-bottom:1px solid var(--line); padding:10px 20px 0 !important; box-sizing:border-box; z-index:4 }
#browsemain { position:static !important; top:auto !important; right:auto !important; bottom:auto !important; flex:1 1 auto; min-height:0; overflow:auto;
	box-sizing:border-box; padding:20px 28px 28px !important }
.mainbody #browsemain { background:var(--surface); max-width:1400px; width:calc(100% - 32px); align-self:center; margin:16px 0; border:1px solid var(--line); border-radius:12px; box-shadow:0 1px 3px rgba(22,35,43,.06) }
#tab_bar { position:static !important; left:auto !important; bottom:auto !important; margin-top:8px; border-collapse:separate }
#tab_bar td { vertical-align:bottom }
/* toolbar row: actions left, record navigator and more actions right */
#browsenav > table.triAlign { width:100%; table-layout:auto }
#browsenav > table.triAlign > tbody > tr { display:flex; flex-wrap:wrap; align-items:center; gap:4px 18px }
#browsenav > table.triAlign > tbody > tr > td { display:block; width:auto !important; padding:0 !important; border:0 !important; flex:0 0 auto }
#browsenav > table.triAlign > tbody > tr > td:first-child { flex:1 1 auto }
#browsenav > table.triAlign > tbody > tr > td:last-child { margin-left:auto }
#browsenav table.noborder.blockAlignLeft, #browsenav table.noborder.blockAlignRight, #browsenav table.noborder.blockAlignCenter { margin:0 }
#browsenav table.noborder > * > tr > td { vertical-align:middle }

/* ===== Login page (lib_global_funcs.php showLogin: #bg #header #wrapper) ===== */
#bg, #header { display:none !important }
html:has(#wrapper), html:has(#wrapper) body { position:relative !important; height:auto !important; min-height:100%; width:auto !important; text-align:center }
#wrapper { position:relative !important; left:auto !important; top:auto !important; width:400px !important; max-width:92vw; height:auto !important; margin:9vh auto 24px !important }
#wrapper > tbody > tr > td, #wrapper > tr > td {
	display:block; background:var(--surface); border:1px solid var(--line) !important; border-radius:14px; padding:36px 36px 28px !important;
	box-shadow:0 12px 40px rgba(22,35,43,.08); text-align:left !important; vertical-align:top !important;
}
#wrapper > tbody > tr > td::before, #wrapper > tr > td::before { content:""; display:block; height:46px; margin-bottom:26px; background:url(kit/cel_logo.png) no-repeat left center; background-size:contain }
#wrapper b { font-weight:400; color:var(--danger) }
.kit-login { margin-bottom:6px }
a.kit-google { display:block; text-align:center; padding:11px 16px; border-radius:8px; background:var(--accent); color:#fff !important; font-weight:600; font-size:14px; text-decoration:none }
a.kit-google:hover { background:var(--accent-dark); color:#fff !important }
.kit-login-note { margin-top:8px; text-align:center; font-size:12px; color:var(--faint) }
.kit-login-divider { margin:20px 0 4px; display:flex; align-items:center; gap:10px; text-transform:uppercase; letter-spacing:.06em; font-size:11px }
.kit-login-divider::before, .kit-login-divider::after { content:""; flex:1; border-top:1px solid var(--line) }
#wrapper b { display:block; margin-bottom:14px }
/* database name, "please logon" lines and language picker are not needed: one database, one language (values still submit) */
table#login tr:nth-child(1), table#login tr:nth-child(2), table#login tr:nth-child(3), table#login tr:nth-child(6) { display:none }
table#login { width:100%; margin-top:6px }
table#login td { padding:5px 0 !important; border:0 !important; color:var(--muted) }
table#login input[type=text], table#login input[type=password], table#login select { width:100%; margin:2px 0 }
/* the notebook is the main entry point: its button comes first and is the filled one, inventory is the quiet alternative */
table#login tr:last-child td { display:flex !important; flex-direction:row-reverse; justify-content:flex-end; gap:8px }
table#login input[type=submit] { margin:10px 0 0 }
table#login input[type=submit][onclick*="inventory"] { background:var(--surface); color:var(--ink); border-color:var(--line-strong) }
table#login input[type=submit][onclick*="inventory"]:hover { background:var(--accent-tint); border-color:var(--accent); color:var(--accent-dark) }
#wrapper div[style*="justify"] { margin-top:22px; padding-top:14px; border-top:1px solid var(--line); color:var(--faint) !important; font-size:10px; line-height:1.35 }
#wrapper div[style*="justify"] small { font-size:10px }