body { font-family: Arial, Helvetica, sans-serif; margin: 0; background: #eef2f5; color: #223; }
.pageclass { display: flex; flex-direction: column; min-height: 100vh; }
.heading { background-color: #9AB; padding: 4px 10px; display: flex; align-items: center; justify-content: space-between; }
.menubar { background-color: #456; }
table.menubar td { color: #def; font-size: 13px; padding: 6px 10px; }
.baritem a, .baritemselected a { color: #def; text-decoration: none; font-weight: bold; }
.baritemselected { background-color: #234; }
.panel { background: #fff; }
#content { padding: 10px; min-height: 60vh; transition: opacity 0.18s ease; opacity: 1; }
#content.spa-fading { opacity: 0; }
table { border-collapse: collapse; }
table td, table th { padding: 4px 8px; }
h1, h2 { color: #234; }
.button, button, input[type=button] {
  background: #345; color: #def; border: none; border-radius: 4px;
  padding: 6px 14px; cursor: pointer; font-size: 14px;
}
.button:hover, button:hover { background: #456; }
.footer { text-align: center; padding: 10px; color: #789; font-size: 12px; }
a { color: #234; }

.card { background: #f4f6f8; border: 1pt solid #ccc; border-radius: 6px; padding: 10px; margin-bottom: 10px; }
.card table th { text-align: left; color: #567; width: 140px; }
.sider { background: #fff; padding: 8px; margin-bottom: 8px; box-sizing: border-box; }
.note_job { color: #567; padding-top: 6px !important; }

#filemgr-panel { position: fixed; bottom: 20px; right: 20px; z-index: 9000; font-size: 9pt; }
#filemgr-toggle {
  width: 44px; height: 44px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  position: relative; cursor: pointer;
  border: 1px solid #345; background: #234; color: #def;
  box-shadow: 0 0 0.6em rgba(35, 52, 68, 0.35);
  transition: box-shadow 0.2s ease, background 0.2s ease;
  margin-left: auto;
}
#filemgr-toggle:hover { background: #345; }
#filemgr-toggle svg { width: 20px; height: 20px; }
#filemgr-badge {
  position: absolute; top: -4px; right: -4px;
  min-width: 16px; height: 16px; padding: 0 3px; border-radius: 8px;
  background: #def; color: #234; font-size: 8pt; font-weight: bold;
  display: flex; align-items: center; justify-content: center;
}
#filemgr-badge:empty { display: none; }
#filemgr-body {
  display: none; width: 320px; max-height: 400px; margin-bottom: 10px; margin-left: auto;
  border-radius: 8px; border: 1px solid #ccc; background: #fff;
  box-shadow: 0 10px 40px rgba(0,0,0,0.3); flex-direction: column;
}
#filemgr-panel.filemgr-expanded #filemgr-body { display: flex; }
#filemgr-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 8px 12px; border-bottom: 1pt solid #eee; color: #234; font-weight: 600;
}
#filemgr-clear { font-weight: normal; font-size: 8pt; color: #789; cursor: pointer; }
#filemgr-clear:hover { color: #234; }
#filemgr-list { overflow-y: auto; padding: 6px; }
#filemgr-empty { color: #789; padding: 10px; text-align: center; }
.filemgr-item { padding: 8px; border-radius: 6px; margin-bottom: 4px; background: #f4f6f8; }
.filemgr-item-row { display: flex; align-items: center; gap: 6px; margin-bottom: 4px; }
.filemgr-item-icon { flex-shrink: 0; width: 14px; height: 14px; color: #345; }
.filemgr-item-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.filemgr-item-status { flex-shrink: 0; font-size: 8pt; color: #789; }
.filemgr-item.filemgr-failed .filemgr-item-status { color: #c66; }
.filemgr-item.filemgr-done .filemgr-item-status { color: #2a2; }
.filemgr-progress-track { height: 4px; border-radius: 2px; background: #e5e5e5; overflow: hidden; }
.filemgr-progress-fill { height: 100%; width: 0%; background: #345; transition: width 0.15s ease; }
.filemgr-item.filemgr-done .filemgr-progress-fill { background: #2a2; }
.filemgr-item.filemgr-failed .filemgr-progress-fill { background: #c66; }

#jobdocs-dropzone {
  border: 2px dashed #99a; border-radius: 8px; padding: 20px; text-align: center;
  color: #789; margin-top: 10px; cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
}
#jobdocs-dropzone:hover, #jobdocs-dropzone.jobdocs-dropzone-active { border-color: #345; background: #eef2f5; }
#jobdocs-list { width: 100%; border-collapse: collapse; margin-top: 10px; }
#jobdocs-list th, #jobdocs-list td { padding: 5px 8px; border-bottom: 1pt solid #eee; text-align: left; }
#jobdocs-list th { color: #789; font-weight: normal; font-size: 9pt; }
#jobdocs-list td a, #jobdocs-list td .jobdocs-action { color: #345; cursor: pointer; text-decoration: none; }
#jobdocs-list td a:hover, #jobdocs-list td .jobdocs-action:hover { text-decoration: underline; }
#jobdocs-empty { color: #789; padding: 8px 0; }