/* archive style: one place for colours, the classes are used by all pages (also admin.php, settings.php) */

:root {
  --ink:#222;  --muted:#888;  --faint:#c0c0c0;  --line:#ccc;  --head:#eee;  --hover:#f4f6f9;
  --link:#0433D9;  --tag:#5422cc;  --title:#356;
  --btn:#3b5464;  --btn-hover:#4B6B7F;  --btn-off:#bbb;  --btn-off-hover:#999;
  --primary:#1f7a5a;  --primary-hover:#25936c;  --admin:#6D45A7;  --danger:#c0392b;  --field:#D8D8D8;
}

body {
  background-color:#FFFFFF;color:var(--ink);
  margin:20px;
  font-size: 11pt;font-family: sans-serif;
}

img { border: none; }

a       { color: var(--link);text-decoration: none; }
a:hover { color: var(--link);text-decoration: underline; }

#tags a       { color: var(--tag);text-decoration: none; }
#tags a:hover { color: var(--tag);text-decoration: underline; }

textarea,input,search,form { font-size: 12pt;font-family: sans-serif; }

input[type="password"],input[type="text"],input[type="search"],textarea {
  background-color:var(--field);
  border:0px;
  border-radius:6px;
  padding:2px 8px;
  box-sizing:border-box;
  max-width:100%;
}
input[type="search"] { height:24px;margin-top:2px;margin-bottom:2px; }
input:focus,textarea:focus,select:focus { outline:2px solid #9fb6c8; }

input.mand,textarea.mand { background-color:#FFD8D8; }

h1 { white-space:nowrap;font-size:135%;font-weight:500;margin:0px;color:var(--title);display:inline; }
h2 { white-space:nowrap;font-size:100%;margin:0px;color:var(--title);display:inline; }
h3 { white-space:nowrap;font-size:90%;margin:0px;color:var(--title);display:inline; }

hr { border:0px;width:100%;background-color:#DDD;height:1px;margin-top:5px;margin-bottom:5px; }

table {
  border:1px solid var(--line);
  border-spacing: 0px;
  border-collapse: collapse;
  background-color: white;
}
th {
  vertical-align:middle;
  border:1px solid var(--line);
  background-color: var(--head);
  padding:0px 6px;
}
td {
  vertical-align:middle;
  border:1px solid var(--line);
  background-color: white;
  padding:1px 6px;
}

#head table { border-width:0px;border-style:none;background-color:white; }
#head td    { border-width:0px;border-style:none;background-color:white;padding:1px; }

p { margin-top:15px;margin-bottom:15px; }

/* ------------------------------------------------------------------------------------------- select boxes */
.select { position:relative;display:inline-block;margin-bottom:0px; }
.select select {
  font-family:sans-serif;display:inline-block;width:100%;cursor:pointer;
  padding:2px 28px 2px 12px;outline:0;border:0px;border-radius:8px;
  background:var(--btn);color:#ffffff;
  appearance:none;-webkit-appearance:none;-moz-appearance:none;
}
.select select:hover,.select select:focus { color:#FFFFFF;background:var(--btn); }
.select select:disabled { opacity:0.5;pointer-events:none; }
.select_arrow {
  position:absolute;top:6px;right:9px;pointer-events:none;
  border-style:solid;border-width:8px 5px 0px 5px;border-color:#ffffff transparent transparent transparent;
}

/* ------------------------------------------------------------------------------------------------ buttons */
.button,.ubutton,.abutton,.xbutton,.pbutton,.minibutton {
  display:inline-block;
  border-radius:14px;border:0px;
  font-family:Arial,sans-serif;font-size:12px;line-height:1.5;
  color:#ffffff;background:var(--btn);
  padding:0px 8px;
  text-decoration:none;white-space:nowrap;cursor:pointer;
}
.button:hover,.ubutton:hover,.abutton:hover,.xbutton:hover,.pbutton:hover,.minibutton:hover {
  color:#FFFFFF;text-decoration:none;
}
.button:hover     { background:var(--btn-hover); }
.ubutton          { background:var(--btn-off); }
.ubutton:hover    { background:var(--btn-off-hover); }
.abutton          { background:var(--admin); }
.abutton:hover    { background:#7d55b7; }
.xbutton          { background:#fe6e66; }
.pbutton          { background:var(--primary); }                                     /* main action: NEW, SAVE */
.pbutton:hover    { background:var(--primary-hover); }
.minibutton       { font-size:10px;padding:0px 6px; }
.minibutton:hover { background:var(--btn-hover); }
.button:disabled,.pbutton:disabled { opacity:0.5;cursor:default; }

.icon { padding: 0px 3px 0px 3px; }

/* -------------------------------------------------------------------------------- top bar and navigation */
.banner {                                     /* instance banner ($BANNER in archive.conf), e.g. test and dev */
  margin:-20px -20px 12px -20px;padding:3px 20px;
  background:#f6c445;color:#3a2a00;font-size:90%;font-weight:bold;letter-spacing:0.03em;
}
.topbar { display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px; }
.topbar .brand { flex:1 1 auto;white-space:nowrap; }
.topbar .brand a { color:inherit;text-decoration:none; }
.topbar .version { font-size:50%;color:var(--faint); }
.topbar .qsearch input { width:180px;text-align:left; }
.nav { display:flex;flex-wrap:wrap;align-items:center;gap:4px; }
.nav a.cur { background:var(--btn-hover);box-shadow:inset 0 -2px 0 #9fb6c8; }

.menu { position:relative;display:inline-block; }
.menu > summary { list-style:none;cursor:pointer; }
.menu > summary::-webkit-details-marker { display:none; }
.menu > summary::after { content:" \25BE"; }
.menu .menubox {
  position:absolute;right:0;top:24px;z-index:10;min-width:220px;
  background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:0 4px 14px rgba(0,0,0,0.15);
  padding:6px 0px;
}
.menu .menubox a,.menu .menubox div { display:block;padding:4px 14px;white-space:nowrap; }
.menu .menubox a:hover { background:var(--hover);text-decoration:none; }
.menu .menubox .who { color:var(--muted);font-size:90%;border-bottom:1px solid #eee;margin-bottom:4px;padding-bottom:6px; }

.subhead { display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px 20px;
           font-size:80%;color:var(--muted);min-height:20px;margin:2px 0px 6px 0px; }
.hint { color:var(--muted);font-size:85%; }

/* ---------------------------------------------------------------------------------------- lists of entries */
.filters { display:grid;grid-template-columns:max-content 1fr;gap:6px 10px;align-items:baseline;margin-bottom:10px; }
.filters .chips { display:flex;flex-wrap:wrap;gap:4px; }
.listinfo { display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:6px;margin:6px 0px; }
.pager { display:flex;flex-wrap:wrap;gap:3px;align-items:center; }
.pager span.gap { color:var(--muted);padding:0px 3px; }
.scroll { overflow-x:auto; }
table.list { width:100%; }
table.list td { vertical-align:top;padding-top:2px;padding-bottom:2px; }
table.list tr:hover td { background:var(--hover); }
table.list th a { color:inherit; }
table.list td.prj { font-size:80%;padding-top:4px;white-space:nowrap; }
table.list td.date { font-size:80%;padding-top:4px;white-space:nowrap;color:#555; }
table.list td.act { text-align:center;white-space:nowrap;vertical-align:middle; }
table.list td.idc { white-space:nowrap;width:1%; }

a.id { display:inline-block;padding:0px 6px;border-radius:9px;font-weight:bold;font-size:95%;
       background:#e8eef6;color:#2d4f7c;text-decoration:none; }
a.id:hover { text-decoration:underline; }
a.id.t-data        { background:#e3edf9;color:#24508c; }
a.id.t-publication { background:#f6ecd9;color:#7a4f00; }
a.id.t-sample      { background:#dff2ea;color:#1d6b4f; }
a.id.t-equipment   { background:#ece5f6;color:#5b3a8f; }
a.id.t-instrument  { background:#f7e3e1;color:#933a32; }
a.id.t-chemicals   { background:#f6f1d7;color:#6e5c00; }
a.id.t-gas         { background:#e0f1f4;color:#28707f; }
a.id.t-project     { background:#e9e9e9;color:#444; }

/* -------------------------------------------------------------------------------------------- entry page */
.entryhead { margin:4px 0px 8px 0px; }
.entryhead .etitle { font-size:150%;color:var(--title);font-weight:500;margin:4px 0px; }
.crumbs { font-size:90%;color:var(--muted); }
.actions { display:flex;flex-wrap:wrap;gap:5px;align-items:center;margin:8px 0px 14px 0px; }
.actions a,.actions span.act {
  display:inline-flex;align-items:center;gap:4px;
  border:1px solid var(--line);border-radius:14px;padding:1px 10px 1px 7px;
  font-size:12px;color:#333;background:#fafafa;text-decoration:none;white-space:nowrap;
}
.actions a:hover { background:var(--hover);border-color:#9fb6c8; }
.actions a img { height:14px; }
.actions a.danger { color:var(--danger); }
.actions .sep { width:10px; }
.lockinfo { color:var(--muted);font-size:85%; }
.thumbs { display:flex;flex-wrap:wrap;gap:10px;margin:8px 0px 14px 0px; }
.thumbs a { display:block;border:1px solid var(--line);border-radius:6px;padding:4px;background:#fff;
            text-align:center;font-size:80%;color:#555;max-width:220px; }
.thumbs img { display:block;max-width:210px;max-height:160px;margin:0px auto 3px auto; }
.thumbs a:hover { border-color:#9fb6c8;text-decoration:none; }

/* ------------------------------------------------------------------------------------------ edit forms */
.form,.form td { border:0px; }
.form td { vertical-align:top;padding:3px 4px !important; }
.dropzone { max-width:760px; }
.form td.lbl { width:150px;padding-top:6px !important;white-space:nowrap; }
.form input[type="text"],.form textarea { width:600px; }
.form .req::after { content:" *";color:var(--danger); }
.form details summary { cursor:pointer;color:var(--title);font-weight:bold; }
.formbar { display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;margin:10px 0px; }
.accesshelp { color:var(--muted);font-size:85%;margin-top:4px; }

/* ----------------------------------------------------------------------------------------- small screens */
@media only screen and (max-width: 700px) {
  body { margin:8px 8px 16px 8px; }
  .banner { margin:-8px -8px 8px -8px;padding:3px 8px; }
  .topbar .qsearch { flex:1 1 100%; }
  .topbar .qsearch input { width:100%; }
  .form td.lbl { width:auto; }
  .form input[type="text"],.form textarea { width:100%; }
  .filters { grid-template-columns:1fr; }
  table.list td.date,table.list th.date,table.list td.prj,table.list th.prj { display:none; }
  h3 { font-size:120%; }
}