/* UMWE task detail checklist layout fix.
   Global form input styles set width:100%, which made checkbox inputs consume
   the entire checklist row and pushed instruction text outside the panel. */
.checklist label {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0;
  width: 100%;
  color: var(--text);
  font-size: 14px;
  font-weight: 500;
  line-height: 1.45;
  cursor: pointer;
}

.checklist label input[type="checkbox"] {
  width: 18px;
  height: 18px;
  min-width: 18px;
  flex: 0 0 18px;
  margin: 1px 0 0;
  padding: 0;
  accent-color: var(--green);
  cursor: pointer;
}

.checklist label span {
  display: block;
  flex: 1 1 auto;
  min-width: 0;
  overflow-wrap: anywhere;
  color: var(--text);
}

.checklist label:has(input:disabled) {
  cursor: default;
}

/* Approved tasks are finished, not editable forms. Collapse the obsolete
   submission form and present the task as a clean read-only completion card. */
.task-detail-grid:has(.pill.approved) {
  grid-template-columns: minmax(0, 1fr) !important;
}

.task-detail-grid:has(.pill.approved) > .panel:first-child {
  max-width: 920px;
  width: 100%;
}

.task-detail-grid:has(.pill.approved) > .panel:nth-child(2) {
  display: none !important;
}

.task-detail-grid:has(.pill.approved) .checklist label {
  opacity: .82;
}

.task-detail-grid:has(.pill.approved) .closed-card.success {
  margin-top: 22px;
  padding: 18px 20px;
  border-radius: 16px;
  font-weight: 600;
}

.task-detail-grid:has(.pill.approved) .closed-card.success::after {
  content: "  Reward earned. View the original report and uploaded files in My Submissions.";
  font-weight: 500;
}

/* Safari-safe navigation hit target.
   WebKit can mis-hit-test a fixed element that itself uses backdrop-filter.
   Keep the closed menu button above the page, but let the opened drawer cover
   it so the hamburger never overlaps the UMWE logo/header. */
.menu-fab,
.menu-fab.glass-circle {
  position: fixed !important;
  left: 24px !important;
  top: 18px !important;
  width: 54px !important;
  height: 54px !important;
  z-index: 2000 !important;
  pointer-events: auto !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  transform: translate3d(0,0,1px) !important;
  -webkit-transform: translate3d(0,0,1px) !important;
  touch-action: manipulation;
  user-select: none;
  -webkit-user-select: none;
}

.menu-fab::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: rgba(255,255,255,.78);
  z-index: -1;
}

:root[data-theme="dark"] .menu-fab::before {
  background: rgba(16,38,57,.92);
}

/* Empty topbar space must never consume clicks. Only actual controls do. */
.topbar { pointer-events: none !important; }
.topbar .nav-back,
.topbar .top-actions,
.topbar .top-actions * { pointer-events: auto !important; }

/* Drawer must sit above the hamburger once open; the drawer's X is then the
   only close control in the upper-left area. */
.sidebar { z-index: 2200 !important; }
.scrim { z-index: 2100 !important; }

@media(max-width:640px){
  .menu-fab,.menu-fab.glass-circle{left:16px !important;top:10px !important}
}