:root { --bg:#008080; --panel:#c0c0c0; --dark:#808080; --light:#ffffff; --text:#000; --blue:#000080; }
* { box-sizing: border-box; }
body { margin:0; font: 14px/1.35 "MS Sans Serif", Tahoma, Arial, sans-serif; background: var(--bg); color: var(--text); }
a { color:#000080; }
button, .button-link, input, textarea, select { font: inherit; }
button, .button-link { background: var(--panel); border:2px solid; border-color: var(--light) var(--dark) var(--dark) var(--light); padding:4px 10px; color:#000; text-decoration:none; display:inline-block; cursor:pointer; }
button:active, .button-link:active { border-color: var(--dark) var(--light) var(--light) var(--dark); }
button.full { width:100%; margin-bottom:8px; }
input, textarea, select { width:100%; background:#fff; border:2px solid; border-color: var(--dark) var(--light) var(--light) var(--dark); padding:4px; margin:3px 0 7px; }
textarea { min-height:70px; resize: vertical; }
label { display:block; margin:4px 0; }
input[type="checkbox"] { width:auto; }
.app-shell { display:grid; grid-template-columns: 160px minmax(260px, 340px) minmax(520px, 1fr); gap:6px; height:100vh; padding:6px; }
.win-panel { background:var(--panel); border:2px solid; border-color: var(--light) #404040 #404040 var(--light); overflow:auto; }
.main-menu { padding:8px; display:flex; flex-direction:column; gap:5px; }
.app-title { background:var(--blue); color:#fff; padding:5px 6px; font-weight:bold; margin-bottom:8px; }
.menu-item, .list-item { display:block; color:#000; text-decoration:none; padding:5px 6px; border:1px solid transparent; }
.menu-item.active, .list-item.selected, .switches a.active, .tabs a.active { background:var(--blue); color:#fff; }
.menu-item:hover, .list-item:hover { border-color:#000; }
.logout-form { margin-top:auto; }
.entity-list { padding:8px; }
.workspace { padding:8px; }
.window-title { background:var(--blue); color:#fff; padding:4px 6px; font-weight:bold; margin:-2px -2px 8px -2px; }
.block { border:2px solid; border-color: var(--dark) var(--light) var(--light) var(--dark); background:#d4d0c8; padding:8px; margin:0 0 10px; }
.flash { background:#ffffcc; border:1px solid #808000; padding:8px; margin-bottom:10px; }
.muted { color:#555; }
.search { margin:8px 0; }
.items { display:flex; flex-direction:column; gap:2px; }
.list-item { border-bottom:1px solid #999; }
.list-item span { display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.list-item small { display:block; color:inherit; opacity:.85; }
.switches, .tabs, .tabs-mini, .toolbar { display:flex; gap:4px; flex-wrap:wrap; margin:8px 0; }
.switches a, .tabs a { background:var(--panel); border:2px solid; border-color:var(--light) var(--dark) var(--dark) var(--light); padding:3px 7px; text-decoration:none; color:#000; }
.task-row, .file-row, .settings-row { display:flex; gap:8px; align-items:center; justify-content:space-between; border-bottom:1px dotted #888; padding:5px 0; }
.task-row form, .file-row form, .settings-row form { margin:0; }
.done, .done a { text-decoration: line-through; color:#555; }
.note { background:#fff; border:2px solid; border-color:var(--dark) var(--light) var(--light) var(--dark); padding:8px; margin:8px 0; }
.note.pinned { background:#fffde0; }
.note-meta { font-size:12px; color:#555; border-bottom:1px solid #aaa; margin-bottom:6px; padding-bottom:4px; }
.markdown table { border-collapse: collapse; }
.markdown td, .markdown th { border:1px solid #999; padding:3px 6px; }
.grid-form { display:grid; grid-template-columns: repeat(2, minmax(180px, 1fr)); gap:8px; }
.grid-form .wide { grid-column:1 / -1; }
.two-cols { display:grid; grid-template-columns: 1fr 1fr; gap:10px; }
.checkbox-list { max-height:160px; overflow:auto; background:#eee; border:1px inset #fff; padding:4px; margin:4px 0 8px; }
.legal-row { display:block; }
.danger { color:#900; }
.login-screen { min-height:100vh; display:flex; justify-content:center; align-items:center; }
.login-box { width:340px; padding:18px; }
@media (max-width: 1000px) { .app-shell { grid-template-columns:130px 260px minmax(420px,1fr); } }

/* Modal (Win98) */
.modal-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.35);
  z-index: 1000;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding: 40px 20px;
  overflow: auto;
}
.modal-overlay[hidden] { display: none; }
.modal-overlay.confirm-overlay { z-index: 1100; }
.modal-window {
  background: var(--panel);
  border: 2px solid;
  border-color: var(--light) #404040 #404040 var(--light);
  box-shadow: 2px 2px 0 #000;
  width: 780px;
  max-width: 100%;
  max-height: calc(100vh - 80px);
  display: flex;
  flex-direction: column;
}
.modal-window.maximized {
  width: 100vw !important;
  height: 100vh !important;
  max-width: 100vw !important;
  max-height: 100vh !important;
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  transform: none !important;
  margin: 0 !important;
  box-shadow: none;
}
.modal-overlay.maximized { padding: 0; }
.modal-titlebar {
  background: var(--blue);
  color: #fff;
  padding: 3px 4px 3px 8px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-weight: bold;
  cursor: move;
  user-select: none;
  flex: 0 0 auto;
}
.modal-window.maximized .modal-titlebar { cursor: default; }
.modal-title { font-size: 13px; }
.modal-window-buttons { display: flex; gap: 2px; }
.modal-btn {
  background: var(--panel);
  border: 2px solid;
  border-color: var(--light) var(--dark) var(--dark) var(--light);
  width: 22px;
  height: 20px;
  padding: 0;
  cursor: pointer;
  color: #000;
  font-family: "MS Sans Serif", Tahoma, Arial, sans-serif;
  font-size: 11px;
  line-height: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
}
.modal-btn:active { border-color: var(--dark) var(--light) var(--light) var(--dark); }
.modal-content {
  flex: 1 1 auto;
  overflow: auto;
  padding: 8px;
  background: var(--panel);
}
.modal-confirm { width: 420px; }
.modal-confirm .modal-content { padding: 14px 16px; }
.modal-buttons-row {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  margin-top: 12px;
}
.modal-content .window-title { margin: -2px -2px 8px -2px; }


/* Day task picker */
.day-task-add-toolbar { align-items: flex-end; }
.day-project-filter {
  display: flex;
  align-items: center;
  gap: 5px;
  margin: 0;
}
.day-project-filter select {
  width: 220px;
  margin: 0;
}
.day-task-search-results {
  background: #fff;
  border: 2px solid;
  border-color: var(--dark) var(--light) var(--light) var(--dark);
  max-height: 220px;
  overflow: auto;
  margin: 0 0 7px;
  padding: 2px;
}
.day-task-result {
  display: block;
  width: 100%;
  text-align: left;
  margin: 1px 0;
  padding: 3px 5px;
  border-width: 1px;
}
.day-task-result:hover { background: var(--blue); color: #fff; }
.day-task-selected-label, .day-task-empty {
  padding: 5px;
  border: 1px dotted #888;
  background: #efefef;
}

/* Notes collapse */
.note-body.is-collapsed {
  max-height: 300px;
  overflow: hidden;
  border-bottom: 1px dotted #aaa;
  margin-bottom: 5px;
}
.note-collapse-controls {
  text-align: left;
  margin: 5px 0 7px;
}
.note-collapse-controls button {
  padding: 2px 8px;
  font-size: 12px;
}

/* Task day detach links */
.task-day-link-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  border-bottom: 1px dotted #888;
  padding: 4px 0;
}
.task-day-link-row form { margin: 0; }
.tiny-danger {
  color: #900;
  min-width: 24px;
  padding: 0 5px;
  line-height: 18px;
  height: 22px;
  font-weight: bold;
}

/* Day payments widget */
.payment-row {
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: space-between;
  border-bottom: 1px dotted #888;
  padding: 5px 0;
}
.payment-row a { color: #000080; }

/* Completed date filters in task list */
.task-completed-search label {
  font-size: 12px;
  margin: 2px 0;
}
.task-completed-search input[type="date"] {
  margin-bottom: 4px;
}

/* Reports / users / notifications */
.menu-bottom{margin-top:auto;display:flex;gap:6px;align-items:center;flex-wrap:wrap}.notify-link{display:inline-block;border:2px outset #fff;background:#c0c0c0;color:#000;text-decoration:none;padding:3px 6px;min-width:26px;text-align:center}.notify-link span{display:inline-block;margin-left:3px;background:#800;color:#fff;border:1px solid #000;padding:0 3px;font-size:11px}.inline-form{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.user-settings-row{border:2px inset #fff;background:#ddd;margin:8px 0;padding:8px}.report-head .toolbar{margin-top:8px}.report-users-list{columns:2}.report-company{margin-top:14px;background:#000080;color:#fff;padding:3px 5px}.report-user{margin:8px 0 4px;padding:2px 4px;background:#d6d6d6;border:1px solid #888}.report-site{margin:8px 0 4px 18px;padding:2px 4px;background:#eee;border:1px solid #999}.report-task-list{margin-top:4px}.report-task-list li{margin:6px 0}.report-task-line{display:flex;gap:8px;align-items:baseline;flex-wrap:wrap}.report-task-edit{margin:4px 0 8px 0;border:1px dotted #777;padding:4px;background:#eee}.task-report-fields{grid-column:1/-1;border:1px inset #fff;background:#d9d9d9;padding:6px;margin:4px 0}.task-report-fields label{display:block;margin:3px 0}.notifications-list{display:flex;flex-direction:column;gap:6px}.notification-row{display:block;color:#000;text-decoration:none;border:2px inset #fff;background:#ddd;padding:8px}.notification-row.unread{background:#fff}.notification-row small{display:block;color:#555;margin-top:4px}.danger{color:#800}.button-link{display:inline-block;border:2px outset #fff;background:#c0c0c0;color:#000;text-decoration:none;padding:4px 8px}.full{width:100%}


/* Stable custom file picker for report task forms */
.win98-file-field {
  display: flex;
  align-items: center;
  gap: 6px;
  width: 100%;
  min-height: 32px;
  background: #fff;
  border: 2px solid;
  border-color: var(--dark) var(--light) var(--light) var(--dark);
  padding: 4px;
  margin: 3px 0 7px;
}
.win98-file-button {
  position: relative;
  overflow: hidden;
  flex: 0 0 auto;
  display: inline-block;
  background: var(--panel);
  border: 2px solid;
  border-color: var(--light) var(--dark) var(--dark) var(--light);
  padding: 4px 10px;
  color: #000;
  cursor: pointer;
  white-space: nowrap;
}
.win98-file-button:active {
  border-color: var(--dark) var(--light) var(--light) var(--dark);
}
.win98-file-field .native-file-input {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0;
  cursor: pointer;
  margin: 0;
  padding: 0;
  font-size: 100px;
}
.file-picker-name {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: #000;
}

/* Menu bottom: logout first, notifications to the right */
.menu-bottom {
  margin-top: auto;
  display: flex;
  gap: 6px;
  align-items: center;
  flex-wrap: nowrap;
}
.menu-bottom .logout-form {
  margin: 0;
  flex: 1 1 auto;
}
.menu-bottom .logout-form button {
  width: 100%;
}
.menu-bottom .notify-link {
  flex: 0 0 auto;
}