/* ============================================================
   Wiwo Neo — Coverage completion (the "long tail" from the audit).
   Closes the remaining dark-mode gaps that inline styles / hardcoded
   colors / plugin themes left behind. Loaded LAST (after bridge/dark).
   Almost all rules are dark-scoped and use !important to beat the
   inline !important rules they override.
   ============================================================ */

/* ===== 1. Project Overview (head.php inline block forces #fff/#1e293b) ===== */
html[data-theme="dark"] .project-overview-left,
html[data-theme="dark"] .project-overview-right {
  background: var(--wiwo-almost-white) !important;
  border-color: var(--line) !important;
}
html[data-theme="dark"] .project-overview-left h4,
html[data-theme="dark"] .project-overview-right > div > h4,
html[data-theme="dark"] .project-overview-right h4.tw-font-semibold,
html[data-theme="dark"] .project-overview-left dd { color: var(--ink) !important; }
html[data-theme="dark"] .project-overview-left dl > div {
  background: var(--surface-2) !important;
  border-color: var(--line) !important;
}
html[data-theme="dark"] .project-overview-left dl > div:hover {
  background: var(--surface-3) !important;
  border-color: var(--wiwo-blue) !important;
}
html[data-theme="dark"] .project-overview-left dt,
html[data-theme="dark"] .project-overview-description dt { color: var(--muted) !important; }
html[data-theme="dark"] .project-overview-description {
  background: var(--surface-2) !important;
  border-color: var(--line) !important;
  color: var(--ink) !important;
}
html[data-theme="dark"] .project-overview-left .text-muted,
html[data-theme="dark"] .project-overview-left a.text-muted {
  background: var(--control-surface) !important;
  color: var(--muted) !important;
  border-color: var(--line) !important;
}
html[data-theme="dark"] .project-overview-left a.text-muted:hover {
  background: var(--control-surface-hover) !important;
  color: var(--ink) !important;
}
html[data-theme="dark"] .project-overview-open-tasks,
html[data-theme="dark"] .project-overview-days-left {
  background: var(--surface-2) !important;
  border-color: var(--line) !important;
}

/* ===== 2. Bootstrap .progress tracks (overview mini-bars + portal stat bars) ===== */
html[data-theme="dark"] .progress,
html[data-theme="dark"] .progress.progress-bar-mini,
html[data-theme="dark"] .project-progress-bar-container .progress {
  background-color: var(--surface-2) !important;
}
/* keep the colored .progress-bar fills as-is */

/* ===== 3. E-signature pad — white "paper" so the (black) stroke always reads ===== */
#signature,
.signature-pad--body canvas {
  background: #ffffff !important;
  border: 1px solid var(--line);
  border-radius: 8px;
}

/* ===== 4. Tailwind light gradient washes (background-IMAGE, not color) =====
   e.g. ticket sticky header (tw-from-neutral-50 tw-to-white), invoice/import
   panels. Neo's background-COLOR remap can't cover a gradient image. */
html[data-theme="dark"] [class*="tw-to-white"],
html[data-theme="dark"] [class*="tw-to-neutral-50"],
html[data-theme="dark"] [class*="tw-from-white"],
html[data-theme="dark"] [class*="tw-from-neutral-50"] {
  background-image: none !important;
  background-color: var(--wiwo-almost-white) !important;
}

/* ===== 5. Data-driven status/priority label chips (inline light tint) =====
   adjust_hex_brightness() bakes a near-white bg regardless of theme. Give the
   pill a dark surface; the (colored) text keeps its meaning. */
html[data-theme="dark"] .label[style],
html[data-theme="dark"] .horizontal-scrollable-tabs .label[style],
html[data-theme="dark"] td .label[style] {
  background-color: var(--surface-container-high) !important;
  border-color: var(--line) !important;
}

/* ===== 6. Off-palette light hairlines / hovers (dark) ===== */
html[data-theme="dark"] .hover\:tw-bg-neutral-100:hover,
html[data-theme="dark"] [class*="hover:tw-bg-neutral-100"]:hover { background-color: var(--state-hover) !important; }
html[data-theme="dark"] [class*="tw-border-neutral-100"],
html[data-theme="dark"] [class*="tw-border-neutral-200"] { border-color: var(--line) !important; }
/* admin proposal preview content border (inline #d2d2d2) */
html[data-theme="dark"] #proposal_content_area { border-color: var(--line) !important; }

/* ===== 7. Media library (elFinder Material light theme) ===== */
html[data-theme="dark"] .elfinder,
html[data-theme="dark"] .elfinder-navbar,
html[data-theme="dark"] .elfinder-cwd,
html[data-theme="dark"] .elfinder-toolbar,
html[data-theme="dark"] .elfinder-statusbar,
html[data-theme="dark"] .elfinder-contextmenu,
html[data-theme="dark"] .elfinder-dialog {
  background: var(--surface-container) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}
html[data-theme="dark"] .elfinder-cwd-file:hover,
html[data-theme="dark"] .elfinder-navbar-dir:hover { background: var(--state-hover) !important; }
html[data-theme="dark"] .elfinder-cwd-file.ui-selected,
html[data-theme="dark"] .elfinder-navbar-dir.ui-selected { background: var(--state-press) !important; }
html[data-theme="dark"] .elfinder-button,
html[data-theme="dark"] .elfinder-toolbar .ui-icon { filter: invert(1) hue-rotate(180deg); }

/* ===== 8. prchat live-chat widget (only present if module active) ===== */
html[data-theme="dark"] #pusherChat,
html[data-theme="dark"] .pusherChatBox,
html[data-theme="dark"] #membersContent,
html[data-theme="dark"] .pusher-chat-window,
html[data-theme="dark"] .prchat-conversation {
  background: var(--surface-container) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}
html[data-theme="dark"] .pusherChatBox .chatBoxInput,
html[data-theme="dark"] .prchat-message-input {
  background: var(--control-surface) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}

/* ===== 9. PME (project_management_enhancements) task modal — inline #fff strip ===== */
html[data-theme="dark"] #task-comment-form { background-color: transparent !important; }

/* ===== 10. form_sync settings — light accordion headings / injected table headers ===== */
html[data-theme="dark"] .form-sync-accordion-header,
html[data-theme="dark"] .fs-provider-heading,
html[data-theme="dark"] #field-mapping-table th,
html[data-theme="dark"] .field-mapping-table th {
  background-color: var(--surface-2) !important;
  color: var(--ink) !important;
  border-color: var(--line) !important;
}
