html, body { margin:0; height:100%; width:100%; font:var(--body-font); color:var(--body-inverse); background:var(--body-background); fill:var(--body-inverse); }
textarea, input, select { padding:var(--input-padding); width:100%; font:var(--input-font); color:var(--input-inverse);  border:var(--input-border); border-radius:var(--input-radius); box-sizing:border-box; background:var(--input-background); outline:none; -webkit-appearance: none; -moz-appearance: none; appearance: none; }
::placeholder { color:var(--input-inverse); opacity:0.5; }
pre { white-space: pre-line; font:var(--body-font); color:var(--body-inverse); }
a { text-decoration:none; color:var(--primary-background); }
h1, h2, h3, h4, h5, h6 { margin-top: 0px; margin-bottom: 0px; user-select:none; text-align: center; vertical-align: middle; }
button, input[type=button], input[type=submit] { cursor:pointer; min-width:100px; display:inline-flex; align-items:center; justify-content:center; font:var(--button-font); transition:opacity 0.5s; width:auto; text-transform:var(--button-text-transform); background:var(--button-background); padding:var(--button-padding); font-size:var(--input-font-size); border:var(--button-border); color:var(--button-inverse); border-radius:var(--button-radius); fill:var(--button-inverse); }
button:hover, input[type=button]:hover, input[type=submit]:hover { opacity: 0.8; }
button bright-icon { height:16px; width:16px; }
table { border-collapse: collapse; table-layout: fixed; width:100%; }
table:not(:has(td)) tr { display:none; }
table:not(:has(td))::after { content:"None"; margin:16px; display:block; opacity:0.3; }
caption { user-select:none; background:var(--label-background); color:var(--label-inverse); margin:1px 0px; padding:16px; text-align:left; }
th, label { user-select: none; ; border-radius:var(--label-radius); background:var(--label-background); border:var(--label-border); text-transform:var(--label-text-transform); padding:var(--label-padding); color:var(--label-inverse); font:var(--label-font); }
th:not(:last-child) { border-right: 1px solid var(--body-background);}
tbody tr:not(:last-child) { border-bottom: 1px solid var(--label-background); }
td { box-sizing:border-box; padding:8px 8px; }
label { display:block; }
.primary, input[type=button].primary, input[type=submit].primary { color:var(--primary-inverse); fill:var(--primary-inverse); background:var(--primary-background); }
p { margin: 0px 0px 16px 0px; }
figure { margin:0px; padding:0px; background:black; }
figure img { max-width:100%; height:100%; }
figure figcaption { display:none; }
form { display:flex; flex-wrap:wrap; gap:4px; }
form * { flex:1 1 180px; }
input[type=file]::file-selector-button { display:none; }
input[type=file] { cursor:pointer }
.mobileshow { display:none; }
.mobilehide { display:table-cell; }
span.mobilehide { display:inline-block; }
.trimmer { height:1.2em; overflow-y:hidden; word-break: break-all; }
.ellipsis { white-space:nowrap; text-overflow: ellipsis; overflow: hidden; max-width: 100%; }
.nowrap { white-space: nowrap; }
.datecol { width:80px }
.numcol { width:80px } td.numcol { text-align:center; }
.moneycol { width:60px; } td.moneycol { text-align:right; }
.iconcol { width:40px; } td.iconcol { text-align:right; }
.clickrow { cursor:pointer }
.clickrow:hover {  background:var(--button-background); color:var(--button-color); }
.strikethrough, .strike, .strikeout { text-decoration:line-through; }
button:disabled { opacity:0.2; }
bright-card.table::part(body) { margin:-16px -32px -32px -32px;  }
bright-card.table { padding:32px 32px 0px 32px; }
@media only screen and (max-width: 600px) 
{
    .mobilehide, span.mobilehide { display:none; }
    .mobileshow { display:table-cell; }
}