/**
 * TaskBuilder - Edit Task Details dialog, SaaS theme
 * Form styles are scoped to .wppm-etd (the #frm_get_edit_task_deatils form).
 * The shared popup frame is only restyled while it contains that form
 * (:has(.wppm-etd)), so every other dialog keeps its current look.
 * Colors from Settings > Appearance > Modal (header/body/footer backgrounds,
 * label/text colors, action button) are applied inline and are never overridden.
 */

/* ===================== Popup frame (only for this dialog) ===================== */
#wppm_task_popup:has(.wppm-etd),
#wppm_popup:has(.wppm-etd) {
  height: auto !important;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 24px 64px -12px rgba(15,23,42,.35), 0 2px 8px rgba(15,23,42,.08);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
#wppm_task_popup:has(.wppm-etd) #wppm_task_popup_title,
#wppm_popup:has(.wppm-etd) #wppm_popup_title {
  margin: 0;
  padding: 18px 24px !important;
  border-bottom: 1px solid #e5e7eb;
}
#wppm_task_popup:has(.wppm-etd) #wppm_task_popup_title h3,
#wppm_popup:has(.wppm-etd) #wppm_popup_title h3 {
  font: 700 17px/1.3 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  letter-spacing: -0.01em;
}
#wppm_task_popup:has(.wppm-etd) #wppm_task_popup_body,
#wppm_popup:has(.wppm-etd) #wppm_popup_body {
  margin: 0;
  max-height: calc(100vh - 210px);
  padding: 18px 24px 8px !important;
}
#wppm_task_popup:has(.wppm-etd) #wppm_task_popup_footer,
#wppm_popup:has(.wppm-etd) #wppm_popup_footer {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin: 0;
  padding: 14px 24px !important;
  border-top: 1px solid #e5e7eb;
}
#wppm_task_popup:has(.wppm-etd) #wppm_task_popup_footer button,
#wppm_popup:has(.wppm-etd) #wppm_popup_footer button {
  width: auto;
  min-width: 96px;
  height: 38px;
  margin: 0;
  padding: 0 18px;
  border-radius: 9px !important;
  font: 600 13px/1 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  box-shadow: none;
}
#wppm_task_popup:has(.wppm-etd) .wppm_task_popup_close,
#wppm_popup:has(.wppm-etd) .wppm_popup_close {
  border: 1px solid #e5e7eb;
}
#wppm_task_popup:has(.wppm-etd) .wppm_task_popup_action:hover,
#wppm_popup:has(.wppm-etd) .wppm_popup_action:hover {
  filter: brightness(.94);
}

/* ===================== Form ===================== */
.wppm-etd,
.wppm-etd *,
.wppm-etd *::before,
.wppm-etd *::after {
  box-sizing: border-box;
}
.wppm-etd {
  --etd-primary: #4f46e5;
  --etd-primary-light: #eef2ff;
  --etd-ink: #111827;
  --etd-muted: #6b7280;
  --etd-border: #e5e7eb;
  --etd-soft: #f8fafc;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-size: 13.5px;
  line-height: 1.5;
}
.wppm-etd .dashicons {
  font-size: 16px;
  width: 16px;
  height: 16px;
  line-height: 1;
}
.wppm-etd-context {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 14px;
}
.wppm-etd-id {
  font-size: 12px;
  font-weight: 600;
  color: var(--etd-muted);
  font-variant-numeric: tabular-nums;
}
.wppm-etd-crumb {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  max-width: 100%;
  padding: 3px 10px;
  border-radius: 999px;
  background: var(--etd-primary-light);
  color: #4338ca;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.wppm-etd-crumb .dashicons {
  font-size: 13px;
  width: 13px;
  height: 13px;
}
.wppm-etd-field {
  margin: 0 0 16px;
}
.wppm-etd-field > label {
  display: block;
  margin: 0 0 6px !important;
  font: 600 11px/1.4 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.wppm-etd .form-control,
.wppm-etd input[type="text"],
.wppm-etd input[type="number"],
.wppm-etd select {
  width: 100% !important;
  max-width: 100% !important;
  height: 40px;
  min-height: 40px;
  margin: 0 !important;
  padding: 0 12px !important;
  border: 1px solid var(--etd-border) !important;
  border-radius: 9px !important;
  box-shadow: none !important;
  font-family: inherit;
  font-size: 13.5px !important;
  transition: border-color .12s ease, box-shadow .12s ease;
}
.wppm-etd .form-control:focus,
.wppm-etd input[type="text"]:focus,
.wppm-etd input[type="number"]:focus,
.wppm-etd select:focus {
  outline: none;
  border-color: var(--etd-primary) !important;
  box-shadow: 0 0 0 3px var(--etd-primary-light) !important;
}
/* Task name reads as the dialog's headline field. */
.wppm-etd .wppm-etd-title-field input#wppm_edit_task_label {
  height: 46px;
  font-size: 16px !important;
  font-weight: 600;
}
/* Project (select2). Only the field itself (the container right after the select) —
   the options list is also a .select2-container, now rendered inside this form. */
.wppm-etd select + .select2-container {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}
.wppm-etd .select2-dropdown {
  border: 1px solid var(--etd-border);
  border-radius: 9px;
  box-shadow: 0 12px 28px -8px rgba(16,24,40,.22);
  overflow: hidden;
}
.wppm-etd .select2-search--dropdown .select2-search__field {
  height: 34px;
  padding: 0 10px;
  border: 1px solid var(--etd-border);
  border-radius: 7px;
}
.wppm-etd .select2-container .select2-selection--single {
  height: 40px !important;
  border: 1px solid var(--etd-border);
  border-radius: 9px;
}
.wppm-etd .select2-container .select2-selection__rendered {
  margin-top: 0 !important;
  padding-left: 12px;
  line-height: 38px !important;
  font: 13.5px/38px -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
}
.wppm-etd .select2-container .select2-selection__arrow {
  height: 38px !important;
  right: 6px;
}
.wppm-etd .select2-container--open .select2-selection--single,
.wppm-etd .select2-container--focus .select2-selection--single {
  border-color: var(--etd-primary);
  box-shadow: 0 0 0 3px var(--etd-primary-light);
}
/* Start / End dates side by side */
.wppm-etd-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 0 14px;
}
.wppm-etd-input-icon {
  position: relative;
}
.wppm-etd-input-icon .dashicons {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: #94a3b8;
  pointer-events: none;
  z-index: 1;
}
/* flatpickr marks these readonly; they're still clickable, so don't show Bootstrap's disabled grey. */
.wppm-etd-input-icon input.form-control,
.wppm-etd-input-icon input.form-control[readonly] {
  padding-left: 36px !important;
  background-color: #fff;
  font-variant-numeric: tabular-nums;
  cursor: pointer;
}
/* Priority chips (drive the visually hidden select) */
.wppm-etd-priority {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.wppm-etd-chip {
  --chip-bg: #f1f5f9;
  --chip-fg: #334155;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 34px;
  margin: 0;
  padding: 0 14px;
  border: 1px solid var(--etd-border);
  border-radius: 999px;
  background: #fff;
  color: #334155;
  font: 600 12.5px/1 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  cursor: pointer;
  transition: border-color .12s ease, background-color .12s ease, box-shadow .12s ease;
}
.wppm-etd-chip:hover {
  border-color: #cbd5e1;
  background: var(--etd-soft);
}
.wppm-etd-chip-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--chip-bg);
  box-shadow: 0 0 0 1px rgba(15,23,42,.08);
}
.wppm-etd-chip.is-active {
  border-color: transparent;
  background: var(--chip-bg);
  color: var(--chip-fg);
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--chip-bg);
}
.wppm-etd-chip.is-active .wppm-etd-chip-dot {
  background: var(--chip-fg);
  box-shadow: none;
}
.wppm-etd-chip:focus-visible {
  outline: 2px solid var(--etd-primary);
  outline-offset: 3px;
}
.wppm-etd-sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  min-height: 0 !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  border: 0 !important;
  white-space: nowrap !important;
}
/* Description (TinyMCE) */
.wppm-etd .mce-tinymce,
.wppm-etd .tox-tinymce {
  border: 1px solid var(--etd-border) !important;
  border-radius: 9px !important;
  overflow: hidden;
  box-shadow: none !important;
}
.wppm-etd .mce-tinymce .mce-toolbar-grp,
.wppm-etd .mce-top-part::before {
  background: var(--etd-soft) !important;
  box-shadow: none !important;
  border-bottom: 1px solid var(--etd-border) !important;
}
.wppm-etd textarea#wppm_edit_task_description {
  height: auto;
  min-height: 140px;
  padding: 10px 12px !important;
}
/* Add-on fields (e.g. Custom Fields) */
.wppm-etd-addons:empty {
  display: none;
}
.wppm-etd-addons .row {
  margin-left: 0;
  margin-right: 0;
}
.wppm-etd-addons [class*="col-"] {
  padding-left: 0;
  padding-right: 0;
}
.wppm-etd-addons .wppm_edit_custom_field_container[style*="inline"] {
  display: block !important;
  margin-top: 4px;
  padding-top: 14px;
  border-top: 1px dashed var(--etd-border);
}
.wppm-etd-addons .wppm_custom_field_label {
  display: inline-block;
  margin-bottom: 10px;
  font-size: 13px;
}
.wppm-etd-addons .wppm_task_details_label {
  float: none !important;
  width: auto !important;
  margin: 8px 0 6px !important;
  font: 600 11px/1.4 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  letter-spacing: .05em;
  text-transform: uppercase;
}

/* ===================== Polished layout ===================== */
/* Wider, centered dialog */
#wppm_task_popup:has(.wppm-etd),
#wppm_popup:has(.wppm-etd) {
  width: 100%;
  max-width: 760px;
  left: 0;
  right: 0;
  float: none;
  margin-right: auto !important;
  margin-left: auto !important;
}
/* Header: gradient pencil badge before the title */
#wppm_task_popup:has(.wppm-etd) #wppm_task_popup_title h3,
#wppm_popup:has(.wppm-etd) #wppm_popup_title h3 {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
}
#wppm_task_popup:has(.wppm-etd) #wppm_task_popup_title h3::before,
#wppm_popup:has(.wppm-etd) #wppm_popup_title h3::before {
  content: "\f464"; /* dashicons-edit */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 36px;
  height: 36px;
  border-radius: 11px;
  background: linear-gradient(135deg, #4f46e5, #7c3aed);
  box-shadow: 0 6px 14px -6px rgba(79,70,229,.6);
  color: #fff;
  font: normal 18px/1 dashicons;
}
#wppm_task_popup:has(.wppm-etd) #wppm_task_popup_body,
#wppm_popup:has(.wppm-etd) #wppm_popup_body {
  padding: 18px 24px 6px !important;
  scrollbar-width: thin;
}

/* Section cards */
.wppm-etd-section {
  margin: 0 0 14px;
  padding: 16px 16px 2px;
  border: 1px solid var(--etd-border);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(16,24,40,.04);
}
.wppm-etd-section .wppm-etd-grid .wppm-etd-field,
.wppm-etd-section > .wppm-etd-field:last-child {
  margin-bottom: 14px;
}
.wppm-etd-section-title {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 14px !important;
  padding: 0;
  color: var(--etd-ink);
  font: 700 13px/1.3 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  letter-spacing: 0;
  text-transform: none;
}
/* Priority / Description: their own field label doubles as the section title */
.wppm-etd-sec-priority > .wppm-etd-field > label,
.wppm-etd-sec-description > .wppm-etd-field > label {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px !important;
  font: 700 13px/1.3 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  letter-spacing: 0;
  text-transform: none;
}
.wppm-etd-section-title .dashicons,
.wppm-etd-sec-priority > .wppm-etd-field > label::before,
.wppm-etd-sec-description > .wppm-etd-field > label::before {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 26px;
  height: 26px;
  border-radius: 8px;
  background: var(--etd-primary-light);
  color: var(--etd-primary);
  font-size: 15px;
  line-height: 26px;
}
.wppm-etd-sec-priority > .wppm-etd-field > label::before {
  content: "\f227"; /* dashicons-flag */
  font: normal 15px/26px dashicons;
  background: #fff7ed;
  color: #ea580c;
}
.wppm-etd-sec-description > .wppm-etd-field > label::before {
  content: "\f121"; /* dashicons-text-page */
  font: normal 15px/26px dashicons;
  background: #f0fdf4;
  color: #16a34a;
}
.wppm-etd-sec-schedule .wppm-etd-section-title .dashicons {
  background: #eff6ff;
  color: #2563eb;
}

/* Schedule duration chip */
.wppm-etd-duration {
  margin-left: auto;
  font-weight: 600;
  font-size: 12px;
}
.wppm-etd-duration.is-ok,
.wppm-etd-duration.is-error {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: 24px;
  padding: 0 10px;
  border-radius: 999px;
}
.wppm-etd-duration.is-ok {
  background: #eff6ff;
  color: #1d4ed8;
}
.wppm-etd-duration.is-ok::before {
  content: "\f469"; /* dashicons-clock */
  font: normal 13px/1 dashicons;
}
.wppm-etd-duration.is-error {
  background: #fef2f2;
  color: #b91c1c;
}
.wppm-etd-duration.is-error::before {
  content: "\f534"; /* dashicons-warning */
  font: normal 13px/1 dashicons;
}
.wppm-etd-sec-schedule:has(.wppm-etd-duration.is-error) #wppm_edit_task_end_date {
  border-color: #fca5a5 !important;
}

/* Inputs: subtle hover so fields feel interactive */
.wppm-etd .form-control:hover:not(:focus),
.wppm-etd .select2-container .select2-selection--single:hover {
  border-color: #cbd5e1 !important;
}
/* Task name: tinted until focused, so it reads as the headline field */
.wppm-etd .wppm-etd-title-field input#wppm_edit_task_label {
  background: var(--etd-soft);
}
.wppm-etd .wppm-etd-title-field input#wppm_edit_task_label:focus {
  background: #fff;
}

/* Context row above the sections */
.wppm-etd-id {
  display: inline-flex;
  align-items: center;
  height: 22px;
  padding: 0 8px;
  border: 1px solid var(--etd-border);
  border-radius: 6px;
  background: #fff;
}

@media (max-width: 600px) {
  #wppm_task_popup:has(.wppm-etd),
  #wppm_popup:has(.wppm-etd) {
    border-radius: 12px;
  }
  .wppm-etd-section {
    padding: 14px 12px 0;
  }
  .wppm-etd-section-title {
    flex-wrap: wrap;
  }
  #wppm_task_popup:has(.wppm-etd) #wppm_task_popup_body,
  #wppm_popup:has(.wppm-etd) #wppm_popup_body {
    padding: 16px 16px 6px !important;
  }
  #wppm_task_popup:has(.wppm-etd) #wppm_task_popup_footer,
  #wppm_popup:has(.wppm-etd) #wppm_popup_footer {
    padding: 12px 16px !important;
  }
  .wppm-etd-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* =====================================================================
   Edit Project Details dialog (includes/admin/projects/open_project/wppm_edit_project_details.php)
   The form carries .wppm-etd too, so it shares the Edit Task look above;
   these rules only cover the project's own field ids and the category chips.
   ===================================================================== */
#wppm_popup:has(.wppm-epd) #wppm_popup_title h3::before {
  content: "\f322"; /* dashicons-portfolio */
}
.wppm-epd .wppm-etd-title-field input#wppm_edit_project_label {
  height: 46px;
  background: var(--etd-soft);
  font-size: 16px !important;
  font-weight: 600;
}
.wppm-epd .wppm-etd-title-field input#wppm_edit_project_label:focus {
  background: #fff;
}
.wppm-epd textarea#wppm_edit_project_description {
  height: auto;
  min-height: 140px;
  padding: 10px 12px !important;
}
.wppm-epd .wppm-etd-sec-schedule:has(.wppm-etd-duration.is-error) #wppm_edit_project_end_date {
  border-color: #fca5a5 !important;
}
/* Category: the field label doubles as the section title (same as Priority on tasks) */
.wppm-epd-sec-category > .wppm-etd-field > label {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px !important;
  font: 700 13px/1.3 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  letter-spacing: 0;
  text-transform: none;
}
.wppm-epd-sec-category > .wppm-etd-field > label::before {
  content: "\f318"; /* dashicons-category */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 26px;
  height: 26px;
  border-radius: 8px;
  background: #faf5ff;
  color: #9333ea;
  font: normal 15px/26px dashicons;
}
.wppm-epd-category .wppm-etd-chip {
  --chip-bg: var(--etd-primary-light);
  --chip-fg: #3730a3;
}
.wppm-epd-category .wppm-etd-chip .dashicons {
  width: 14px;
  height: 14px;
  font-size: 14px;
  color: #94a3b8;
}
.wppm-epd-category .wppm-etd-chip.is-active .dashicons {
  color: currentColor;
}

/* =====================================================================
   Task sidebar dialogs: Edit Status, Edit Task Creator, Add Users
   Creator / Users forms carry .wppm-tpd (wppm_edit_task_creator.php,
   wppm_get_task_users.php); the Status dialog body is the shared picker
   (.wppm-cs, wppm-change-status-saas.css) and only gets the header badge here.
   Frames are restyled only while they hold these forms, so every other dialog
   keeps its look. Field names / ids and the autocomplete JS are unchanged.
   ===================================================================== */

/* ---------- Frame ---------- */
#wppm_task_popup:has(.wppm-tpd),
#wppm_popup:has(.wppm-tpd) {
  width: 100%;
  max-width: 520px;
  height: auto !important;
  left: 0;
  right: 0;
  float: none;
  margin-right: auto !important;
  margin-left: auto !important;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 24px 64px -12px rgba(15,23,42,.35), 0 2px 8px rgba(15,23,42,.08);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
#wppm_task_popup:has(.wppm-tpd) #wppm_task_popup_title,
#wppm_popup:has(.wppm-tpd) #wppm_popup_title {
  margin: 0;
  padding: 18px 24px !important;
  border-bottom: 1px solid #e5e7eb;
}
#wppm_task_popup:has(.wppm-tpd) #wppm_task_popup_body,
#wppm_popup:has(.wppm-tpd) #wppm_popup_body {
  min-height: 0;
  max-height: calc(100vh - 210px);
  margin: 0;
  padding: 20px 24px 16px !important;
}
#wppm_task_popup:has(.wppm-tpd) #wppm_task_popup_footer,
#wppm_popup:has(.wppm-tpd) #wppm_popup_footer {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin: 0;
  padding: 14px 24px !important;
  border-top: 1px solid #e5e7eb;
}
#wppm_task_popup:has(.wppm-tpd) #wppm_task_popup_footer button,
#wppm_popup:has(.wppm-tpd) #wppm_popup_footer button {
  width: auto;
  min-width: 96px;
  height: 38px;
  margin: 0;
  padding: 0 18px;
  border-radius: 9px !important;
  font: 600 13px/1 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  box-shadow: none;
}
#wppm_task_popup:has(.wppm-tpd) .wppm_task_popup_close,
#wppm_popup:has(.wppm-tpd) .wppm_popup_close {
  border: 1px solid #e5e7eb;
}
#wppm_task_popup:has(.wppm-tpd) .wppm_task_popup_action:hover,
#wppm_popup:has(.wppm-tpd) .wppm_popup_action:hover {
  filter: brightness(.94);
}

/* ---------- Header badge (Creator, Users, Status) ---------- */
#wppm_task_popup:has(.wppm-tpd) #wppm_task_popup_title h3,
#wppm_popup:has(.wppm-tpd) #wppm_popup_title h3,
#wppm_task_popup:has(#frm_get_task_change_status) #wppm_task_popup_title h3,
#wppm_popup:has(#frm_get_task_change_status) #wppm_popup_title h3,
#wppm_popup:has(#frm_get_project_change_status) #wppm_popup_title h3 {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  font: 700 17px/1.3 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  letter-spacing: -0.01em;
}
#wppm_task_popup:has(.wppm-tpd) #wppm_task_popup_title h3::before,
#wppm_popup:has(.wppm-tpd) #wppm_popup_title h3::before,
#wppm_task_popup:has(#frm_get_task_change_status) #wppm_task_popup_title h3::before,
#wppm_popup:has(#frm_get_task_change_status) #wppm_popup_title h3::before,
#wppm_popup:has(#frm_get_project_change_status) #wppm_popup_title h3::before {
  content: "\f110"; /* dashicons-admin-users */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 36px;
  height: 36px;
  border-radius: 11px;
  background: linear-gradient(135deg, #4f46e5, #7c3aed);
  box-shadow: 0 6px 14px -6px rgba(79,70,229,.6);
  color: #fff;
  font: normal 18px/1 dashicons;
}
#wppm_task_popup:has(#frm_get_task_users) #wppm_task_popup_title h3::before,
#wppm_popup:has(#frm_get_task_users) #wppm_popup_title h3::before,
#wppm_popup:has(#frm_get_project_users) #wppm_popup_title h3::before {
  content: "\f307"; /* dashicons-groups */
  background: linear-gradient(135deg, #0ea5e9, #6366f1);
  box-shadow: 0 6px 14px -6px rgba(14,165,233,.6);
}
#wppm_task_popup:has(#frm_get_task_change_status) #wppm_task_popup_title h3::before,
#wppm_popup:has(#frm_get_task_change_status) #wppm_popup_title h3::before,
#wppm_popup:has(#frm_get_project_change_status) #wppm_popup_title h3::before {
  content: "\f503"; /* dashicons-randomize */
  background: linear-gradient(135deg, #10b981, #0ea5e9);
  box-shadow: 0 6px 14px -6px rgba(16,185,129,.6);
}

/* ---------- Shared form bits ---------- */
.wppm-tpd {
  --tpd-primary: #4f46e5;
  --tpd-primary-light: #eef2ff;
  --tpd-ink: #111827;
  --tpd-muted: #6b7280;
  --tpd-border: #e5e7eb;
  --tpd-soft: #f8fafc;
  position: relative;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-size: 13.5px;
}
.wppm-tpd .row {
  margin: 0;
  padding: 0 !important;
}
.wppm-tpd .row > .col-sm-12 {
  padding: 0;
}
.wppm-tpd .wppm_ct_field_label {
  display: block;
  margin: 0 0 2px !important;
  font: 600 13px/1.4 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
}
.wppm-tpd .wppm-tpd-note {
  margin: 0 0 10px;
  padding: 0;
  color: var(--tpd-muted);
  font-size: 12.5px;
  line-height: 1.5;
}
/* Search inputs (creator name, user search; task + project dialogs) */
.wppm-tpd #user_name,
.wppm-tpd #wppm_task_user_name,
.wppm-tpd #project_creator_name,
.wppm-tpd #wppm_user_name {
  box-sizing: border-box;
  width: 100% !important;
  height: 42px;
  margin: 0 0 4px;
  padding: 0 12px 0 38px !important;
  border: 1px solid var(--tpd-border) !important;
  border-radius: 10px !important;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239ca3af' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") no-repeat 12px 50% / 16px 16px !important;
  box-shadow: none !important;
  color: var(--tpd-ink);
  font-size: 14px;
  transition: border-color .12s ease, box-shadow .12s ease;
}
.wppm-tpd #user_name:focus,
.wppm-tpd #wppm_task_user_name:focus,
.wppm-tpd #project_creator_name:focus,
.wppm-tpd #wppm_user_name:focus {
  outline: none;
  border-color: var(--tpd-primary) !important;
  box-shadow: 0 0 0 3px var(--tpd-primary-light) !important;
}
/* Autocomplete suggestions (appended next to the input). Kept in the normal flow so the
   popup grows to show the whole list; floating, it was clipped by the short popup body
   and could not be scrolled into view. */
.wppm-tpd .ui-autocomplete {
  position: static !important;
  margin: 6px 0 10px !important;
  z-index: 10;
  max-height: 240px;
  margin: 0;
  padding: 6px;
  overflow-x: hidden;
  overflow-y: auto;
  border: 1px solid var(--tpd-border);
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 16px 36px -12px rgba(16,24,40,.28);
  list-style: none;
}
/* Users popups: the list is appended after the assigned users; show it right under the search */
.wppm-tpd #wppm_get_task_users,
.wppm-tpd #wppm_get_users {
  display: flex;
  flex-direction: column;
}
.wppm-tpd #wppm_get_task_users > *,
.wppm-tpd #wppm_get_users > * {
  order: 3;
}
.wppm-tpd #wppm_get_task_users > .wppm-tpd-note,
.wppm-tpd #wppm_get_users > .wppm-tpd-note {
  order: 0;
}
.wppm-tpd #wppm_get_task_users > input[type="text"],
.wppm-tpd #wppm_get_users > input[type="text"] {
  order: 1;
}
.wppm-tpd #wppm_get_task_users > .ui-autocomplete,
.wppm-tpd #wppm_get_users > .ui-autocomplete {
  order: 2;
}
.wppm-tpd .ui-autocomplete .ui-menu-item {
  margin: 0;
  padding: 0;
  border: none;
  list-style: none;
}
.wppm-tpd .ui-autocomplete .ui-menu-item-wrapper,
.wppm-tpd .ui-autocomplete .ui-menu-item > a {
  display: block;
  margin: 0;
  padding: 8px 10px;
  border: none !important;
  border-radius: 8px;
  background: transparent;
  font-size: 13.5px;
  line-height: 1.35;
  cursor: pointer;
}
.wppm-tpd .ui-autocomplete .ui-state-active,
.wppm-tpd .ui-autocomplete .ui-menu-item-wrapper:hover {
  margin: 0;
  background: var(--tpd-primary-light) !important;
  color: #3730a3 !important;
}

/* ---------- Task Creator: current creator card ---------- */
.wppm-tpd-current {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 18px;
  padding: 12px 14px;
  border: 1px solid var(--tpd-border);
  border-radius: 12px;
  background: linear-gradient(135deg, #f8fafc, #eef2ff);
  transition: opacity .15s ease;
}
/* Dimmed once a different user has been picked */
.wppm-tpd-current.is-changed {
  opacity: .55;
}
.wppm-tpd-avatar img {
  display: block;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  box-shadow: 0 0 0 2px #fff, 0 0 0 3px #c7d2fe;
}
.wppm-tpd-current-text {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.wppm-tpd-current-label {
  color: var(--tpd-muted);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.wppm-tpd-current-name {
  overflow: hidden;
  color: var(--tpd-ink);
  font-size: 14.5px;
  font-weight: 700;
  white-space: nowrap;
  text-overflow: ellipsis;
}

/* ---------- Users: assigned list ---------- */
#frm_get_task_users #wppm_get_task_users {
  position: relative;
}
#frm_get_task_users #wppm_task_users_display_container {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 12px;
}
#frm_get_task_users .wppm_task_user_display_container {
  display: flex !important;
  align-items: center;
  gap: 10px;
  margin: 0 !important;
  padding: 8px 8px 8px 10px !important;
  border: 1px solid var(--tpd-border);
  border-radius: 11px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(16,24,40,.04);
  transition: border-color .12s ease, background-color .12s ease;
}
#frm_get_task_users .wppm_task_user_display_container:hover {
  border-color: #d1d5db;
  background: var(--tpd-soft);
}
#frm_get_task_users .wppm_task_user_display_container::before,
#frm_get_task_users .wppm_task_user_display_container::after {
  display: none; /* bootstrap .row clearfix */
}
#frm_get_task_users .wppm_task_user_display_container > [class*="col-"] {
  width: auto;
  float: none;
  padding: 0;
}
#frm_get_task_users .wppm_task_user_display_container .flex-container {
  display: flex !important;
  align-items: center;
  gap: 10px;
  flex: 1 1 auto !important;
  min-width: 0;
  max-width: none;
  height: auto;
  margin: 0;
  padding: 0 !important;
  border: none !important;
  background: transparent !important;
  color: var(--tpd-ink) !important;
  font-size: 13.5px;
  font-weight: 600;
}
#frm_get_task_users .wppm_task_user_display_container .flex-container::before {
  content: "\f110"; /* dashicons-admin-users */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--tpd-primary-light);
  color: var(--tpd-primary);
  font: normal 17px/1 dashicons;
}
#frm_get_task_users .wppm_task_user_display_container .wppm_filter_display_text {
  min-width: 0;
  padding: 0;
  overflow: hidden;
  background: transparent;
  white-space: nowrap;
  text-overflow: ellipsis;
}
#frm_get_task_users .wppm_task_user_display_container .wppm_delete_user_icon {
  display: flex !important;
  flex: 0 0 auto !important;
  align-items: center;
  justify-content: center;
}
#frm_get_task_users .wppm_task_user_display_container .wppm_delete_user_icon span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  cursor: pointer;
  transition: background-color .12s ease;
}
#frm_get_task_users .wppm_task_user_display_container .wppm_delete_user_icon img {
  width: 13px;
  height: 13px;
  opacity: .55;
  transition: opacity .12s ease;
}
#frm_get_task_users .wppm_task_user_display_container .wppm_delete_user_icon span:hover {
  background: #fee2e2;
}
#frm_get_task_users .wppm_task_user_display_container .wppm_delete_user_icon span:hover img {
  opacity: 1;
}
/* "None" = empty state (the JS hides it with an inline display:none) */
#frm_get_task_users #wppm_assign_to_none_task:not([style*="none"]) {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 18px 12px;
  border: 1px dashed #cbd5e1;
  border-radius: 11px;
  background: var(--tpd-soft);
  color: var(--tpd-muted);
  font-size: 13px;
  font-weight: 600;
}
#frm_get_task_users #wppm_assign_to_none_task::before {
  content: "\f307"; /* dashicons-groups */
  font: normal 18px/1 dashicons;
  opacity: .7;
}

@media (max-width: 600px) {
  #wppm_task_popup:has(.wppm-tpd) #wppm_task_popup_title,
  #wppm_popup:has(.wppm-tpd) #wppm_popup_title,
  #wppm_task_popup:has(.wppm-tpd) #wppm_task_popup_footer,
  #wppm_popup:has(.wppm-tpd) #wppm_popup_footer {
    padding-right: 16px !important;
    padding-left: 16px !important;
  }
  #wppm_task_popup:has(.wppm-tpd) #wppm_task_popup_body,
  #wppm_popup:has(.wppm-tpd) #wppm_popup_body {
    padding: 16px !important;
  }
}

/* =====================================================================
   Edit Thread / Delete Thread dialogs (task + project comments)
   Forms carry .wppm-thr (+ .wppm-thr-edit / .wppm-thr-delete). Delete reuses the
   shared delete-dialog look (.wppm-bdp, wppm-bulk-delete-project-saas.css); the
   author strip comes from includes/admin/wppm_thread_meta.php. Frames are restyled
   only while they hold these forms; ids, fields and handlers are unchanged.
   ===================================================================== */

/* ---------- Edit frame ---------- */
#wppm_task_popup:has(.wppm-thr-edit),
#wppm_popup:has(.wppm-thr-edit) {
  width: 100%;
  max-width: 680px;
  height: auto !important;
  left: 0;
  right: 0;
  float: none;
  margin-right: auto !important;
  margin-left: auto !important;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 24px 64px -12px rgba(15,23,42,.35), 0 2px 8px rgba(15,23,42,.08);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
#wppm_task_popup:has(.wppm-thr-edit) #wppm_task_popup_title,
#wppm_popup:has(.wppm-thr-edit) #wppm_popup_title {
  margin: 0;
  padding: 18px 24px !important;
  border-bottom: 1px solid #e5e7eb;
}
#wppm_task_popup:has(.wppm-thr-edit) #wppm_task_popup_title h3,
#wppm_popup:has(.wppm-thr-edit) #wppm_popup_title h3 {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  font: 700 17px/1.3 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  letter-spacing: -0.01em;
}
#wppm_task_popup:has(.wppm-thr-edit) #wppm_task_popup_title h3::before,
#wppm_popup:has(.wppm-thr-edit) #wppm_popup_title h3::before {
  content: "\f101"; /* dashicons-admin-comments */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 36px;
  height: 36px;
  border-radius: 11px;
  background: linear-gradient(135deg, #4f46e5, #7c3aed);
  box-shadow: 0 6px 14px -6px rgba(79,70,229,.6);
  color: #fff;
  font: normal 18px/1 dashicons;
}
#wppm_task_popup:has(.wppm-thr-edit) #wppm_task_popup_body,
#wppm_popup:has(.wppm-thr-edit) #wppm_popup_body {
  min-height: 0;
  max-height: calc(100vh - 210px);
  margin: 0;
  padding: 18px 24px 20px !important;
}

/* ---------- Footer (edit + delete; their Close buttons use other class names) ---------- */
#wppm_task_popup:has(.wppm-thr) #wppm_task_popup_footer,
#wppm_popup:has(.wppm-thr) #wppm_popup_footer {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin: 0;
  padding: 14px 24px !important;
  border-top: 1px solid #e5e7eb;
}
#wppm_task_popup:has(.wppm-thr) #wppm_task_popup_footer button,
#wppm_popup:has(.wppm-thr) #wppm_popup_footer button {
  width: auto;
  min-width: 96px;
  height: 38px;
  margin: 0;
  padding: 0 18px;
  border-radius: 9px !important;
  font: 600 13px/1 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  box-shadow: none;
}
#wppm_task_popup:has(.wppm-thr) .wppm_modal_close,
#wppm_task_popup:has(.wppm-thr) .wppm_task_modal_close,
#wppm_popup:has(.wppm-thr) .wppm_modal_close,
#wppm_popup:has(.wppm-thr) .wppm_popup_close {
  border: 1px solid #e5e7eb;
  background: #fff;
  color: #111827;
}
#wppm_task_popup:has(.wppm-thr) .wppm_modal_close:hover,
#wppm_task_popup:has(.wppm-thr) .wppm_task_modal_close:hover,
#wppm_popup:has(.wppm-thr) .wppm_modal_close:hover,
#wppm_popup:has(.wppm-thr) .wppm_popup_close:hover {
  background: #f8fafc;
}
#wppm_task_popup:has(.wppm-thr) .wppm_task_popup_action:hover,
#wppm_popup:has(.wppm-thr) .wppm_popup_action:hover {
  filter: brightness(.94);
}

/* ---------- Author strip (both dialogs) ---------- */
.wppm-thr .wppm-thr-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  margin: 0 0 14px;
  text-align: left;
}
.wppm-thr .wppm-thr-avatar {
  flex: 0 0 34px;
  width: 34px;
  height: 34px;
  overflow: hidden;
  border-radius: 50%;
  line-height: 0;
  box-shadow: 0 0 0 2px #fff, 0 0 0 3px #e0e7ff;
}
.wppm-thr .wppm-thr-avatar img {
  display: block !important;
  float: none !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  border-radius: 50%;
  object-fit: cover;
}
.wppm-thr .wppm-thr-who {
  display: flex;
  flex-direction: column;
  min-width: 0;
}
.wppm-thr .wppm-thr-name {
  overflow: hidden;
  color: #111827;
  font: 700 13.5px/1.3 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.wppm-thr .wppm-thr-date {
  color: #6b7280;
  font-size: 12px;
  line-height: 1.4;
}

/* ---------- Edit: editor card ---------- */
.wppm-thr-edit .wppm-thr-editor .mce-tinymce,
.wppm-thr-edit .wppm-thr-editor .tox-tinymce {
  border: 1px solid #e5e7eb !important;
  border-radius: 10px !important;
  overflow: hidden;
  box-shadow: none !important;
}
.wppm-thr-edit .wppm-thr-editor .mce-tinymce .mce-toolbar-grp,
.wppm-thr-edit .wppm-thr-editor .mce-top-part::before {
  border-bottom: 1px solid #e5e7eb !important;
  background: #f8fafc !important;
  box-shadow: none !important;
}
.wppm-thr-edit .wppm-thr-editor .mce-tinymce:focus-within {
  border-color: #4f46e5 !important;
  box-shadow: 0 0 0 3px #eef2ff !important;
}
/* Plain-textarea mode (rich text editor turned off) */
.wppm-thr-edit .wppm-thr-editor textarea {
  box-sizing: border-box;
  display: block;
  width: 100%;
  min-height: 160px;
  padding: 12px 14px;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  background: #fff;
  color: #111827;
  font: 13.5px/1.6 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  resize: vertical;
  transition: border-color .12s ease, box-shadow .12s ease;
}
.wppm-thr-edit .wppm-thr-editor textarea:focus {
  outline: none;
  border-color: #4f46e5;
  box-shadow: 0 0 0 3px #eef2ff;
}
/* ---------- Edit: attachments (includes/admin/wppm_thread_edit_attachments.php) ---------- */
.wppm-thr-edit .wppm-thr-files {
  margin-top: 16px;
  text-align: left;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
.wppm-thr-edit .wppm-thr-files-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}
.wppm-thr-edit .wppm-thr-files-title {
  color: #374151;
  font-weight: 700;
  font-size: 12px;
  line-height: 1.3;
  font-family: inherit;
  letter-spacing: .04em;
  text-transform: uppercase;
}
.wppm-thr-edit .wppm-thr-files-add {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 32px;
  margin: 0;
  padding: 0 12px;
  border: 1px solid #e2e8f0;
  border-radius: 9px;
  background: #fff;
  color: #1f2937;
  font-weight: 600;
  font-size: 12.5px;
  line-height: 1;
  font-family: inherit;
  cursor: pointer;
  box-shadow: 0 1px 2px rgba(15,23,42,.05);
  transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
.wppm-thr-edit .wppm-thr-files-add::before {
  content: "";
  width: 14px;
  height: 14px;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m21.44 11.05-9.19 9.19a6 6 0 0 1-8.49-8.49l8.57-8.57A4 4 0 1 1 18 8.84l-8.59 8.57a2 2 0 0 1-2.83-2.83l8.49-8.48'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m21.44 11.05-9.19 9.19a6 6 0 0 1-8.49-8.49l8.57-8.57A4 4 0 1 1 18 8.84l-8.59 8.57a2 2 0 0 1-2.83-2.83l8.49-8.48'/%3E%3C/svg%3E") center / contain no-repeat;
  opacity: .7;
}
.wppm-thr-edit .wppm-thr-files-add:hover {
  border-color: #c7d2fe;
  background: #eef2ff;
  color: #4f46e5;
}
.wppm-thr-edit .wppm-thr-files-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.wppm-thr-edit .wppm-thr-file {
  position: relative;
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  margin: 0;
  padding: 8px 10px 8px 12px;
  overflow: hidden;
  border: 1px solid #e5e7eb;
  border-radius: 9px;
  background: #f8fafc;
}
.wppm-thr-edit .wppm-thr-file-name {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  color: #111827;
  font-size: 13px;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.wppm-thr-edit .wppm-thr-file-remove {
  flex: none;
  height: 26px;
  margin: 0;
  padding: 0 10px;
  border: 1px solid transparent;
  border-radius: 7px;
  background: transparent;
  color: #dc2626;
  font-weight: 600;
  font-size: 12px;
  line-height: 1;
  font-family: inherit;
  cursor: pointer;
}
.wppm-thr-edit .wppm-thr-file-remove:hover {
  border-color: #fecaca;
  background: #fef2f2;
}
/* Marked for removal: struck through until Save; the button reads "Undo" */
.wppm-thr-edit .wppm-thr-file.is-removed {
  border-style: dashed;
  background: #fff;
}
.wppm-thr-edit .wppm-thr-file.is-removed .wppm-thr-file-name {
  color: #9ca3af;
  text-decoration: line-through;
}
.wppm-thr-edit .wppm-thr-file.is-removed .wppm-thr-file-remove {
  color: #4f46e5;
}
.wppm-thr-edit .wppm-thr-file.is-removed .wppm-thr-file-remove:hover {
  border-color: #c7d2fe;
  background: #eef2ff;
}
/* New upload: indigo tint, thin progress bar along the bottom while uploading */
.wppm-thr-edit .wppm-thr-file.is-new {
  border-color: #c7d2fe;
  background: #eef2ff;
}
.wppm-thr-edit .wppm-thr-file-progress {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 3px;
  background: transparent;
}
.wppm-thr-edit .wppm-thr-file-progress span {
  display: block;
  width: 0;
  height: 100%;
  background: #4f46e5;
  transition: width .15s ease;
}
.wppm-thr-edit .wppm-thr-file:not(.is-uploading) .wppm-thr-file-progress {
  display: none;
}
.wppm-thr-edit .wppm-thr-file.is-failed {
  border-color: #fecaca;
  background: #fef2f2;
}
.wppm-thr-edit .wppm-thr-file.is-failed .wppm-thr-file-name {
  color: #b91c1c;
}
.wppm-thr-edit .wppm-thr-files-empty {
  margin: 0;
  padding: 10px 12px;
  border: 1px dashed #e5e7eb;
  border-radius: 9px;
  color: #6b7280;
  font-size: 12.5px;
}

/* ---------- Delete: comment preview under the warning ---------- */
.wppm-thr-delete .wppm-bdp {
  margin-bottom: 18px;
}
.wppm-thr-delete .wppm-thr-meta {
  margin: 0;
  padding: 12px 14px 0;
  border: 1px solid #e5e7eb;
  border-bottom: none;
  border-radius: 12px 12px 0 0;
  background: #f8fafc;
}
.wppm-thr-delete .wppm-thr-meta:last-child {
  padding-bottom: 12px;
  border-bottom: 1px solid #e5e7eb;
  border-radius: 12px;
}
.wppm-thr-delete .wppm-thr-quote {
  margin: 0;
  padding: 10px 14px 12px 58px;
  border: 1px solid #e5e7eb;
  border-top: none;
  border-radius: 0 0 12px 12px;
  background: #f8fafc;
  color: #475569;
  font: italic 13px/1.55 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  text-align: left;
  word-break: break-word;
}

@media (max-width: 600px) {
  #wppm_task_popup:has(.wppm-thr-edit) #wppm_task_popup_title,
  #wppm_popup:has(.wppm-thr-edit) #wppm_popup_title,
  #wppm_task_popup:has(.wppm-thr) #wppm_task_popup_footer,
  #wppm_popup:has(.wppm-thr) #wppm_popup_footer {
    padding-right: 16px !important;
    padding-left: 16px !important;
  }
  #wppm_task_popup:has(.wppm-thr-edit) #wppm_task_popup_body,
  #wppm_popup:has(.wppm-thr-edit) #wppm_popup_body {
    padding: 16px !important;
  }
  .wppm-thr-delete .wppm-thr-quote {
    padding-left: 14px;
  }
}

/* =====================================================================
   Task list > Quick Edit dialog (includes/admin/tasks/wppm_get_task_quick_edit.php)
   Scoped to .wppm-qe; the shared task popup is restyled only while it holds it.
   ===================================================================== */
#wppm_task_popup:has(.wppm-qe),
#wppm_popup:has(.wppm-qe) {
  width: 100%;
  max-width: 600px;
  height: auto !important;
  left: 0;
  right: 0;
  float: none;
  margin-right: auto !important;
  margin-left: auto !important;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 24px 64px -12px rgba(15,23,42,.35), 0 2px 8px rgba(15,23,42,.08);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
#wppm_task_popup:has(.wppm-qe) #wppm_task_popup_title,
#wppm_popup:has(.wppm-qe) #wppm_popup_title {
  margin: 0;
  padding: 16px 22px !important;
  border-bottom: 1px solid #e5e7eb;
}
#wppm_task_popup:has(.wppm-qe) #wppm_task_popup_title h3,
#wppm_popup:has(.wppm-qe) #wppm_popup_title h3 {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  font: 700 16px/1.3 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  letter-spacing: -0.01em;
}
#wppm_task_popup:has(.wppm-qe) #wppm_task_popup_title h3::before,
#wppm_popup:has(.wppm-qe) #wppm_popup_title h3::before {
  content: "\f327"; /* dashicons-edit-large */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  background: linear-gradient(135deg, #4f46e5, #7c3aed);
  box-shadow: 0 6px 14px -6px rgba(79,70,229,.6);
  color: #fff;
  font: normal 17px/1 dashicons;
}
#wppm_task_popup:has(.wppm-qe) #wppm_task_popup_body,
#wppm_popup:has(.wppm-qe) #wppm_popup_body {
  min-height: 0;
  max-height: calc(100vh - 200px);
  margin: 0;
  padding: 16px 22px 6px !important;
}
#wppm_task_popup:has(.wppm-qe) #wppm_task_popup_footer,
#wppm_popup:has(.wppm-qe) #wppm_popup_footer {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  padding: 12px 22px !important;
  border-top: 1px solid #e5e7eb;
}
#wppm_task_popup:has(.wppm-qe) #wppm_task_popup_footer button,
#wppm_popup:has(.wppm-qe) #wppm_popup_footer button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: auto;
  min-width: 88px;
  height: 38px;
  margin: 0;
  padding: 0 16px;
  border-radius: 9px !important;
  font: 600 13px/1 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  box-shadow: none;
}
#wppm_task_popup:has(.wppm-qe) #wppm_task_popup_footer button:disabled,
#wppm_popup:has(.wppm-qe) #wppm_popup_footer button:disabled {
  opacity: .65;
  cursor: wait;
}
#wppm_task_popup:has(.wppm-qe) .wppm-qe-footer-spacer,
#wppm_popup:has(.wppm-qe) .wppm-qe-footer-spacer {
  flex: 1;
}
#wppm_task_popup:has(.wppm-qe) .wppm-qe-cancel,
#wppm_popup:has(.wppm-qe) .wppm-qe-cancel {
  border: 1px solid #e5e7eb;
  background: #fff;
  color: #111827;
}
#wppm_task_popup:has(.wppm-qe) .wppm-qe-cancel:hover,
#wppm_popup:has(.wppm-qe) .wppm-qe-cancel:hover {
  background: #f8fafc;
}
#wppm_task_popup:has(.wppm-qe) .wppm_task_popup_action:hover,
#wppm_popup:has(.wppm-qe) .wppm_popup_action:hover {
  filter: brightness(.94);
}
/* "Open Task": the way into the full workspace */
#wppm_task_popup:has(.wppm-qe) .wppm-qe-open,
#wppm_popup:has(.wppm-qe) .wppm-qe-open {
  border: 1px solid #c7d2fe !important;
  background: #eef2ff !important;
  color: #4338ca !important;
}
#wppm_task_popup:has(.wppm-qe) .wppm-qe-open:hover,
#wppm_popup:has(.wppm-qe) .wppm-qe-open:hover {
  background: #e0e7ff !important;
}
#wppm_task_popup:has(.wppm-qe) .wppm-qe-open .dashicons,
#wppm_popup:has(.wppm-qe) .wppm-qe-open .dashicons {
  width: 15px;
  height: 15px;
  font-size: 15px;
}

/* ---------- Form ---------- */
.wppm-qe,
.wppm-qe *,
.wppm-qe *::before,
.wppm-qe *::after {
  box-sizing: border-box;
}
.wppm-qe {
  --qe-primary: #4f46e5;
  --qe-primary-light: #eef2ff;
  --qe-ink: #111827;
  --qe-muted: #6b7280;
  --qe-border: #e5e7eb;
  --qe-soft: #f8fafc;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-size: 13.5px;
  line-height: 1.5;
}
.wppm-qe-context {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
}
.wppm-qe-id {
  display: inline-flex;
  align-items: center;
  height: 22px;
  padding: 0 8px;
  border: 1px solid var(--qe-border);
  border-radius: 6px;
  color: var(--qe-muted);
  font-size: 12px;
  font-weight: 600;
  font-variant-numeric: tabular-nums;
}
.wppm-qe-crumb {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  max-width: 100%;
  padding: 3px 10px;
  overflow: hidden;
  border-radius: 999px;
  background: var(--qe-primary-light);
  color: #4338ca;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.wppm-qe-crumb .dashicons {
  width: 13px;
  height: 13px;
  font-size: 13px;
}
.wppm-qe-field {
  min-width: 0;
  margin: 0 0 14px;
}
.wppm-qe-field > label {
  display: block;
  margin: 0 0 6px !important;
  color: var(--qe-muted);
  font: 600 11px/1.4 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.wppm-qe-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 0 12px;
}
.wppm-qe .wppm-qe-input {
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  height: 40px;
  min-height: 40px;
  margin: 0 !important;
  padding: 0 12px !important;
  border: 1px solid var(--qe-border) !important;
  border-radius: 9px !important;
  background-color: #fff;
  box-shadow: none !important;
  color: var(--qe-ink);
  font: 13.5px/1.2 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  transition: border-color .12s ease, box-shadow .12s ease;
}
.wppm-qe .wppm-qe-input:hover:not(:focus):not(:disabled) {
  border-color: #cbd5e1 !important;
}
.wppm-qe .wppm-qe-input:focus {
  outline: none;
  border-color: var(--qe-primary) !important;
  box-shadow: 0 0 0 3px var(--qe-primary-light) !important;
}
.wppm-qe .wppm-qe-input:disabled,
.wppm-qe .wppm-qe-chip:disabled {
  background-color: var(--qe-soft);
  color: var(--qe-muted);
  cursor: not-allowed;
}
.wppm-qe #wppm_qe_title {
  height: 44px;
  font-size: 15.5px !important;
  font-weight: 600 !important;
}
.wppm-qe #wppm_qe_title.is-invalid {
  border-color: #f87171 !important;
  box-shadow: 0 0 0 3px #fee2e2 !important;
}
/* Selects with a leading dot / icon */
.wppm-qe-select-wrap,
.wppm-qe-input-icon {
  position: relative;
}
.wppm-qe .wppm-qe-select-wrap .wppm-qe-select,
.wppm-qe .wppm-qe-input-icon .wppm-qe-input {
  padding-left: 34px !important;
}
.wppm-qe .wppm-qe-select {
  padding-right: 30px !important;
  cursor: pointer;
}
.wppm-qe-dot {
  position: absolute;
  z-index: 1;
  left: 13px;
  top: 50%;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #94a3b8;
  box-shadow: 0 0 0 3px rgba(148,163,184,.18);
  transform: translateY(-50%);
  pointer-events: none;
}
.wppm-qe-select-icon,
.wppm-qe-input-icon .dashicons {
  position: absolute;
  z-index: 1;
  left: 11px;
  top: 50%;
  width: 16px;
  height: 16px;
  color: #94a3b8;
  font-size: 16px;
  transform: translateY(-50%);
  pointer-events: none;
}
.wppm-qe-input-icon .wppm-qe-input,
.wppm-qe-input-icon .wppm-qe-input[readonly] {
  background-color: #fff;
  font-variant-numeric: tabular-nums;
  cursor: pointer;
}
/* Priority chips */
.wppm-qe-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.wppm-qe-chip {
  --chip-bg: #f1f5f9;
  --chip-fg: #334155;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 32px;
  margin: 0;
  padding: 0 13px;
  border: 1px solid var(--qe-border);
  border-radius: 999px;
  background: #fff;
  color: #334155;
  font: 600 12.5px/1 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  cursor: pointer;
  transition: border-color .12s ease, background-color .12s ease, box-shadow .12s ease;
}
.wppm-qe-chip:hover:not(:disabled) {
  border-color: #cbd5e1;
  background: var(--qe-soft);
}
.wppm-qe-chip-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--chip-bg);
  box-shadow: 0 0 0 1px rgba(15,23,42,.08);
}
.wppm-qe-chip.is-active {
  border-color: transparent;
  background: var(--chip-bg);
  color: var(--chip-fg);
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px var(--chip-bg);
}
.wppm-qe-chip.is-active .wppm-qe-chip-dot {
  background: var(--chip-fg);
  box-shadow: none;
}
.wppm-qe-chip:focus-visible {
  outline: 2px solid var(--qe-primary);
  outline-offset: 3px;
}
/* Assignees: avatar chips + search */
.wppm-qe-people {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 8px;
}
.wppm-qe-person {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 100%;
  height: 30px;
  padding: 0 4px 0 3px;
  border: 1px solid var(--qe-border);
  border-radius: 999px;
  background: var(--qe-soft);
  color: var(--qe-ink);
  font-size: 12.5px;
  font-weight: 600;
}
.wppm-qe-person img,
.wppm-qe-person .wppm-qe-initial {
  flex: none;
  display: block;
  width: 22px !important;
  height: 22px !important;
  margin: 0 !important;
  border-radius: 50%;
  object-fit: cover;
}
.wppm-qe-person .wppm-qe-initial {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--qe-primary-light);
  color: var(--qe-primary);
  font-size: 11px;
  font-weight: 700;
}
.wppm-qe-person-name {
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.wppm-qe-person-remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 20px;
  height: 20px;
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 50%;
  background: transparent;
  color: #94a3b8;
  font-size: 15px;
  line-height: 1;
  cursor: pointer;
}
.wppm-qe-person-remove:hover {
  background: #fee2e2;
  color: #dc2626;
}
.wppm-qe-people-empty {
  display: none;
  align-items: center;
  height: 30px;
  padding: 0 12px;
  border: 1px dashed #cbd5e1;
  border-radius: 999px;
  color: var(--qe-muted);
  font-size: 12.5px;
}
.wppm-qe-people:not(:has(.wppm-qe-person)) .wppm-qe-people-empty {
  display: inline-flex;
}
.wppm-qe-search {
  position: relative;
}
.wppm-qe #wppm_qe_user_search {
  padding-left: 36px !important;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239ca3af' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") no-repeat 12px 50% / 15px 15px;
}
.wppm-qe .ui-autocomplete {
  z-index: 10;
  max-height: 220px;
  margin: 0;
  padding: 6px;
  overflow-x: hidden;
  overflow-y: auto;
  border: 1px solid var(--qe-border);
  border-radius: 11px;
  background: #fff;
  box-shadow: 0 16px 36px -12px rgba(16,24,40,.28);
  list-style: none;
}
.wppm-qe .ui-autocomplete .ui-menu-item {
  margin: 0;
  padding: 0;
  list-style: none;
}
.wppm-qe .ui-autocomplete .ui-menu-item-wrapper {
  display: block;
  padding: 8px 10px;
  border: none !important;
  border-radius: 8px;
  color: var(--qe-ink);
  cursor: pointer;
}
.wppm-qe .ui-autocomplete .ui-state-active {
  margin: 0;
  background: var(--qe-primary-light) !important;
  color: #3730a3 !important;
}

@media (max-width: 600px) {
  #wppm_task_popup:has(.wppm-qe) #wppm_task_popup_title,
  #wppm_task_popup:has(.wppm-qe) #wppm_task_popup_footer,
  #wppm_popup:has(.wppm-qe) #wppm_popup_title,
  #wppm_popup:has(.wppm-qe) #wppm_popup_footer {
    padding-right: 14px !important;
    padding-left: 14px !important;
  }
  #wppm_task_popup:has(.wppm-qe) #wppm_task_popup_body,
  #wppm_popup:has(.wppm-qe) #wppm_popup_body {
    padding: 14px 14px 4px !important;
  }
  .wppm-qe-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  #wppm_task_popup:has(.wppm-qe) #wppm_task_popup_footer,
  #wppm_popup:has(.wppm-qe) #wppm_popup_footer {
    flex-wrap: wrap;
  }
  #wppm_task_popup:has(.wppm-qe) .wppm-qe-open,
  #wppm_popup:has(.wppm-qe) .wppm-qe-open {
    flex: 1 1 100%;
  }
}

/* =====================================================================
   Project overview dialogs: Edit Project Creator + Add Users
   (wppm_edit_project_creator.php, get_users.php — forms carry .wppm-tpd, so the
   frame, header badge, search input, suggestions and current-creator card come from
   the "Task sidebar dialogs" section above). Edit Project Status is the shared
   status picker (.wppm-cs) and only gets the header badge there.
   Only the project user rows (name + role + remove) are added here.
   ===================================================================== */
#wppm_popup:has(#frm_get_project_users) {
  max-width: 580px;
}
#frm_get_project_users #wppm_get_users {
  position: relative;
}
#frm_get_project_users #wppm_proj_users_display_container {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 12px;
}
#frm_get_project_users .wppm_user_display_container {
  display: flex !important;
  align-items: center;
  gap: 10px;
  margin: 0 !important;
  padding: 8px 8px 8px 10px !important;
  border: 1px solid var(--tpd-border);
  border-radius: 11px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(16,24,40,.04);
  transition: border-color .12s ease, background-color .12s ease;
}
#frm_get_project_users .wppm_user_display_container:hover {
  border-color: #d1d5db;
  background: var(--tpd-soft);
}
#frm_get_project_users .wppm_user_display_container::before,
#frm_get_project_users .wppm_user_display_container::after {
  display: none; /* bootstrap .row clearfix */
}
#frm_get_project_users .wppm_user_display_container > [class*="col-"] {
  width: auto;
  float: none;
  margin: 0;
  padding: 0;
}
/* Name with an avatar circle */
#frm_get_project_users .wppm_user_display_container .flex-container {
  display: flex !important;
  align-items: center;
  gap: 10px;
  flex: 1 1 auto !important;
  min-width: 0;
  max-width: none;
  height: auto;
  margin: 0;
  padding: 0 !important;
  border: none !important;
  background: transparent !important;
  color: var(--tpd-ink) !important;
  font-size: 13.5px;
  font-weight: 600;
}
#frm_get_project_users .wppm_user_display_container .flex-container::before {
  content: "\f110"; /* dashicons-admin-users */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--tpd-primary-light);
  color: var(--tpd-primary);
  font: normal 17px/1 dashicons;
}
#frm_get_project_users .wppm_user_display_container .wppm_filter_display_text {
  min-width: 0;
  padding: 0;
  overflow: hidden;
  background: transparent;
  white-space: nowrap;
  text-overflow: ellipsis;
}
/* Role select */
#frm_get_project_users .wppm_user_display_container .wppm_user_role {
  flex: 0 0 150px;
  margin: 0 !important;
}
#frm_get_project_users .wppm_user_display_container .wppm_user_role select {
  width: 100% !important;
  height: 34px !important;
  min-height: 34px !important;
  margin: 0;
  padding: 0 28px 0 10px !important;
  border: 1px solid var(--tpd-border) !important;
  border-radius: 8px !important;
  background-color: #fff;
  box-shadow: none !important;
  color: var(--tpd-ink);
  font-size: 12.5px !important;
  cursor: pointer;
}
#frm_get_project_users .wppm_user_display_container .wppm_user_role select:focus {
  outline: none;
  border-color: var(--tpd-primary) !important;
  box-shadow: 0 0 0 3px var(--tpd-primary-light) !important;
}
/* Remove */
#frm_get_project_users .wppm_user_display_container .wppm_delete_user_icon {
  display: flex !important;
  flex: 0 0 auto !important;
  align-items: center;
  justify-content: center;
  margin: 0 !important;
}
#frm_get_project_users .wppm_user_display_container .wppm_delete_user_icon span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  cursor: pointer;
  transition: background-color .12s ease;
}
#frm_get_project_users .wppm_user_display_container .wppm_delete_user_icon img {
  width: 13px;
  height: 13px;
  opacity: .55;
  transition: opacity .12s ease;
}
#frm_get_project_users .wppm_user_display_container .wppm_delete_user_icon span:hover {
  background: #fee2e2;
}
#frm_get_project_users .wppm_user_display_container .wppm_delete_user_icon span:hover img {
  opacity: 1;
}
/* "None" = empty state (the JS hides it with an inline display:none) */
#frm_get_project_users .wppm_project_users_not_assign_label:not([style*="none"]) {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 18px 12px;
  border: 1px dashed #cbd5e1;
  border-radius: 11px;
  background: var(--tpd-soft);
  color: var(--tpd-muted);
  font-size: 13px;
  font-weight: 600;
}
#frm_get_project_users .wppm_project_users_not_assign_label::before {
  content: "\f307"; /* dashicons-groups */
  font: normal 18px/1 dashicons;
  opacity: .7;
}
@media (max-width: 600px) {
  #frm_get_project_users .wppm_user_display_container {
    flex-wrap: wrap;
  }
  #frm_get_project_users .wppm_user_display_container .flex-container {
    flex-basis: calc(100% - 42px) !important;
  }
  #frm_get_project_users .wppm_user_display_container .wppm_user_role {
    flex: 1 1 auto;
    order: 3;
  }
}

/* =====================================================================
   Project Visibility dialog (open_project/wppm_get_project_visibility.php)
   Private / Public as selectable cards; saves on change, as before.
   ===================================================================== */
#wppm_popup:has(.wppm-vis) {
  width: 100%;
  max-width: 480px;
  height: auto !important;
  left: 0;
  right: 0;
  float: none;
  margin-right: auto !important;
  margin-left: auto !important;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 24px 64px -12px rgba(15,23,42,.35), 0 2px 8px rgba(15,23,42,.08);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
#wppm_popup:has(.wppm-vis) #wppm_popup_title {
  margin: 0;
  padding: 18px 24px !important;
  border-bottom: 1px solid #e5e7eb;
}
#wppm_popup:has(.wppm-vis) #wppm_popup_title h3 {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  font: 700 17px/1.3 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  letter-spacing: -0.01em;
}
#wppm_popup:has(.wppm-vis) #wppm_popup_title h3::before {
  content: "\f177"; /* dashicons-visibility */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 36px;
  height: 36px;
  border-radius: 11px;
  background: linear-gradient(135deg, #0ea5e9, #4f46e5);
  box-shadow: 0 6px 14px -6px rgba(14,165,233,.6);
  color: #fff;
  font: normal 18px/1 dashicons;
}
#wppm_popup:has(.wppm-vis) #wppm_popup_body {
  min-height: 0;
  margin: 0;
  padding: 20px 24px 16px !important;
}
#wppm_popup:has(.wppm-vis) #wppm_popup_footer {
  display: flex;
  justify-content: flex-end;
  margin: 0;
  padding: 14px 24px !important;
  border-top: 1px solid #e5e7eb;
}
#wppm_popup:has(.wppm-vis) #wppm_popup_footer button {
  min-width: 96px;
  height: 38px;
  margin: 0;
  padding: 0 18px;
  border: 1px solid #e5e7eb;
  border-radius: 9px !important;
  font: 600 13px/1 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  box-shadow: none;
}

.wppm-vis {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-size: 13.5px;
}
.wppm-vis-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
}
.wppm-vis-label {
  color: #6b7280;
  font: 600 11px/1.4 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  letter-spacing: .05em;
  text-transform: uppercase;
}
/* Saving... / Saved / Not saved */
.wppm-vis-status {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-height: 22px;
  font-size: 12px;
  font-weight: 600;
}
.wppm-vis-status:empty {
  display: none;
}
.wppm-vis-status.is-saving {
  color: #6b7280;
}
.wppm-vis-status.is-saved,
.wppm-vis-status.is-error {
  padding: 0 9px;
  border-radius: 999px;
}
.wppm-vis-status.is-saved {
  background: #ecfdf5;
  color: #047857;
}
.wppm-vis-status.is-saved::before {
  content: "\f147"; /* dashicons-yes */
  font: normal 15px/1 dashicons;
}
.wppm-vis-status.is-error {
  background: #fef2f2;
  color: #b91c1c;
}
/* Option cards */
.wppm-vis-options {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.wppm-vis-option {
  position: relative;
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  padding: 14px 14px 14px 12px;
  border: 1.5px solid #e5e7eb;
  border-radius: 12px;
  background: #fff;
  font-weight: 400;
  cursor: pointer;
  transition: border-color .12s ease, background-color .12s ease, box-shadow .12s ease;
}
.wppm-vis-option:hover {
  border-color: #c7d2fe;
  background: #fafbff;
}
/* The real radio stays in the DOM (keyboard + the save function) but is visually hidden */
.wppm-vis-option input[type="radio"] {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: 0;
  opacity: 0;
  pointer-events: none;
}
.wppm-vis-option:has(input:checked) {
  border-color: #4f46e5;
  background: #eef2ff;
  box-shadow: 0 0 0 3px rgba(79,70,229,.10);
}
.wppm-vis-option:has(input:focus-visible) {
  box-shadow: 0 0 0 3px #c7d2fe;
}
.wppm-vis-icon {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 11px;
}
.wppm-vis-icon .dashicons {
  width: 20px;
  height: 20px;
  font-size: 20px;
}
.wppm-vis-icon.is-private {
  background: #fff7ed;
  color: #ea580c;
}
.wppm-vis-icon.is-public {
  background: #ecfeff;
  color: #0891b2;
}
.wppm-vis-text {
  display: flex;
  flex: 1;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.wppm-vis-title {
  color: #111827;
  font-size: 14px;
  font-weight: 700;
}
.wppm-vis-desc {
  color: #6b7280;
  font-size: 12.5px;
  line-height: 1.45;
}
/* Radio indicator on the right */
.wppm-vis-check {
  position: relative;
  flex: none;
  width: 20px;
  height: 20px;
  border: 1.5px solid #cbd5e1;
  border-radius: 50%;
  background: #fff;
  transition: border-color .12s ease, background-color .12s ease;
}
.wppm-vis-option:has(input:checked) .wppm-vis-check {
  border-color: #4f46e5;
  background: #4f46e5;
}
.wppm-vis-option:has(input:checked) .wppm-vis-check::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #fff;
  transform: translate(-50%, -50%);
}
.wppm-vis-note {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 14px 0 0;
  color: #6b7280;
  font-size: 12px;
}
.wppm-vis-note .dashicons {
  width: 14px;
  height: 14px;
  font-size: 14px;
}
@media (max-width: 600px) {
  #wppm_popup:has(.wppm-vis) #wppm_popup_title,
  #wppm_popup:has(.wppm-vis) #wppm_popup_footer {
    padding-right: 16px !important;
    padding-left: 16px !important;
  }
  #wppm_popup:has(.wppm-vis) #wppm_popup_body {
    padding: 16px !important;
  }
}

/* =====================================================================
   Archive / Restore Project confirmation (wppm_get_archive_project in admin.js)
   Frame, icon ring, question, note and buttons come from the shared delete-dialog
   look (.wppm-bdp, wppm-bulk-delete-project-saas.css); recolored here: amber for
   Archive, green for Restore, plus the project-name chip.
   ===================================================================== */
.wppm-bdp.wppm-arc .wppm-bdp-icon {
  background: #fef3c7;
  box-shadow: 0 0 0 8px #fffbeb;
}
.wppm-bdp.wppm-arc .wppm-bdp-icon svg {
  stroke: #d97706;
}
.wppm-bdp.wppm-arc.is-restore .wppm-bdp-icon {
  background: #d1fae5;
  box-shadow: 0 0 0 8px #ecfdf5;
}
.wppm-bdp.wppm-arc.is-restore .wppm-bdp-icon svg {
  stroke: #059669;
}
.wppm-bdp.wppm-arc .wppm-arc-name {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 100%;
  margin: 2px 0 12px;
  padding: 5px 12px;
  overflow: hidden;
  border: 1px solid #e5e7eb;
  border-radius: 999px;
  background: #f8fafc;
  color: #111827;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
  white-space: nowrap;
  text-overflow: ellipsis;
  box-sizing: border-box;
}
.wppm-bdp.wppm-arc .wppm-arc-name::before {
  content: "\f322"; /* dashicons-portfolio */
  flex: none;
  color: #94a3b8;
  font: normal 14px/1 dashicons;
}
#wppm_popup:has(.wppm-arc) #wppm_popup_footer button[disabled],
#wppm_task_popup:has(.wppm-arc) #wppm_task_popup_footer button[disabled] {
  opacity: .65;
  cursor: wait;
}
/* Archive / Restore Task: same dialog, task icon in the name chip */
.wppm-bdp.wppm-arc.wppm-arc-task .wppm-arc-name::before {
  content: "\f163"; /* dashicons-list-view */
}

/* ---------- Compact size: narrow frame, Private / Public as two side-by-side tiles ---------- */
#wppm_popup:has(.wppm-vis) {
  max-width: 400px;
  border-radius: 14px;
}
#wppm_popup:has(.wppm-vis) #wppm_popup_title {
  padding: 12px 16px !important;
}
#wppm_popup:has(.wppm-vis) #wppm_popup_title h3 {
  gap: 10px;
  font-size: 15px;
}
#wppm_popup:has(.wppm-vis) #wppm_popup_title h3::before {
  width: 28px;
  height: 28px;
  border-radius: 8px;
  font-size: 15px;
}
#wppm_popup:has(.wppm-vis) #wppm_popup_body {
  padding: 14px 16px 12px !important;
}
#wppm_popup:has(.wppm-vis) #wppm_popup_footer {
  padding: 10px 16px !important;
}
#wppm_popup:has(.wppm-vis) #wppm_popup_footer button {
  min-width: 80px;
  height: 32px;
  padding: 0 14px;
  font-size: 12.5px;
}
.wppm-vis-head {
  margin-bottom: 8px;
}
.wppm-vis-options {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.wppm-vis-option {
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  padding: 10px 10px 10px;
  border-radius: 10px;
}
.wppm-vis-icon {
  width: 28px;
  height: 28px;
  border-radius: 8px;
}
.wppm-vis-icon .dashicons {
  width: 16px;
  height: 16px;
  font-size: 16px;
}
.wppm-vis-title {
  font-size: 13px;
}
.wppm-vis-desc {
  font-size: 11.5px;
  line-height: 1.35;
}
.wppm-vis-check {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 16px;
  height: 16px;
}
.wppm-vis-option:has(input:checked) .wppm-vis-check::after {
  width: 6px;
  height: 6px;
}
.wppm-vis-note {
  margin-top: 10px;
  font-size: 11.5px;
}
@media (max-width: 360px) {
  .wppm-vis-options {
    grid-template-columns: 1fr;
  }
}

/* =====================================================================
   Clone Task dialog (open_task/wppm_clone_task.php, form .wppm-cln)
   Works in both task contexts: #wppm_task_popup (Tasks page) and #wppm_popup
   (task opened inside a project). Frames are restyled only while they hold it.
   ===================================================================== */
#wppm_task_popup:has(.wppm-cln),
#wppm_popup:has(.wppm-cln) {
  width: 100%;
  max-width: 480px;
  height: auto !important;
  left: 0;
  right: 0;
  float: none;
  margin-right: auto !important;
  margin-left: auto !important;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 24px 64px -12px rgba(15,23,42,.35), 0 2px 8px rgba(15,23,42,.08);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
#wppm_task_popup:has(.wppm-cln) #wppm_task_popup_title,
#wppm_popup:has(.wppm-cln) #wppm_popup_title {
  margin: 0;
  padding: 16px 22px !important;
  border-bottom: 1px solid #e5e7eb;
}
#wppm_task_popup:has(.wppm-cln) #wppm_task_popup_title h3,
#wppm_popup:has(.wppm-cln) #wppm_popup_title h3 {
  margin: 0;
  font: 700 16px/1.3 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  letter-spacing: -0.01em;
}
#wppm_task_popup:has(.wppm-cln) #wppm_task_popup_body,
#wppm_popup:has(.wppm-cln) #wppm_popup_body {
  min-height: 0;
  margin: 0;
  padding: 18px 22px 14px !important;
}
#wppm_task_popup:has(.wppm-cln) #wppm_task_popup_footer,
#wppm_popup:has(.wppm-cln) #wppm_popup_footer {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin: 0;
  padding: 12px 22px !important;
  border-top: 1px solid #e5e7eb;
}
#wppm_task_popup:has(.wppm-cln) #wppm_task_popup_footer button,
#wppm_popup:has(.wppm-cln) #wppm_popup_footer button {
  width: auto;
  min-width: 96px;
  height: 38px;
  margin: 0;
  padding: 0 18px;
  border-radius: 9px !important;
  font: 600 13px/1 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  box-shadow: none;
}
#wppm_task_popup:has(.wppm-cln) .wppm_task_popup_close,
#wppm_popup:has(.wppm-cln) .wppm_popup_close {
  border: 1px solid #e5e7eb;
}
#wppm_task_popup:has(.wppm-cln) .wppm-cln-confirm:hover,
#wppm_popup:has(.wppm-cln) .wppm-cln-confirm:hover {
  filter: brightness(.94);
}

.wppm-cln {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  font-size: 13.5px;
}
/* Hero: icon + what this does */
.wppm-cln-hero {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 16px;
  padding: 12px 14px;
  border: 1px solid #e0e7ff;
  border-radius: 12px;
  background: linear-gradient(135deg, #f8fafc, #eef2ff);
}
.wppm-cln-icon {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 11px;
  background: linear-gradient(135deg, #4f46e5, #7c3aed);
  box-shadow: 0 6px 14px -6px rgba(79,70,229,.6);
}
.wppm-cln-icon svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: #fff;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.wppm-cln-hero-text {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}
.wppm-cln-hero-title {
  color: #111827;
  font-size: 14px;
  font-weight: 700;
}
.wppm-cln-hero-sub {
  color: #6b7280;
  font-size: 12.5px;
}
/* Name field */
.wppm-cln .wppm-cln-field {
  margin: 0 0 16px;
}
.wppm-cln .wppm-cln-field label {
  display: block;
  margin: 0 0 6px !important;
  color: #6b7280;
  font: 600 11px/1.4 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.wppm-cln #task_name {
  box-sizing: border-box;
  width: 100% !important;
  height: 44px;
  margin: 0;
  padding: 0 12px !important;
  border: 1px solid #e5e7eb !important;
  border-radius: 10px !important;
  background: #fff;
  box-shadow: none !important;
  color: #111827;
  font-size: 15px !important;
  font-weight: 600;
  transition: border-color .12s ease, box-shadow .12s ease;
}
.wppm-cln #task_name:focus {
  outline: none;
  border-color: #4f46e5 !important;
  box-shadow: 0 0 0 3px #eef2ff !important;
}
/* What gets copied */
.wppm-cln-copies-label {
  display: block;
  margin: 0 0 8px;
  color: #6b7280;
  font: 600 11px/1.4 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  letter-spacing: .05em;
  text-transform: uppercase;
}
.wppm-cln-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}
.wppm-cln-chips li {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  height: 26px;
  margin: 0;
  padding: 0 10px 0 8px;
  border: 1px solid #d1fae5;
  border-radius: 999px;
  background: #ecfdf5;
  color: #065f46;
  font-size: 12px;
  font-weight: 600;
}
.wppm-cln-chips li::before {
  content: "\f147"; /* dashicons-yes */
  color: #10b981;
  font: normal 15px/1 dashicons;
}
.wppm-cln-note {
  display: flex;
  align-items: center;
  gap: 6px;
  margin: 12px 0 0;
  color: #6b7280;
  font-size: 12px;
}
.wppm-cln-note .dashicons {
  width: 14px;
  height: 14px;
  font-size: 14px;
}
@media (max-width: 600px) {
  #wppm_task_popup:has(.wppm-cln) #wppm_task_popup_title,
  #wppm_popup:has(.wppm-cln) #wppm_popup_title,
  #wppm_task_popup:has(.wppm-cln) #wppm_task_popup_footer,
  #wppm_popup:has(.wppm-cln) #wppm_popup_footer {
    padding-right: 16px !important;
    padding-left: 16px !important;
  }
  #wppm_task_popup:has(.wppm-cln) #wppm_task_popup_body,
  #wppm_popup:has(.wppm-cln) #wppm_popup_body {
    padding: 16px !important;
  }
}

/* =====================================================================
   Delete Task confirmation (includes/admin/tasks/wppm_get_delete_task.php)
   Frame, icon, question, note and buttons come from the shared delete-dialog
   look (.wppm-bdp); added here: task-name chip and the "also deleted" list.
   ===================================================================== */
.wppm-bdp.wppm-dtask .wppm-dtask-name {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  max-width: 100%;
  margin: 2px 0 12px;
  padding: 5px 12px;
  overflow: hidden;
  border: 1px solid #fecaca;
  border-radius: 999px;
  background: #fef2f2;
  color: #991b1b;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
  white-space: nowrap;
  text-overflow: ellipsis;
  box-sizing: border-box;
}
.wppm-bdp.wppm-dtask .wppm-dtask-id {
  flex: none;
  color: #dc2626;
  font-size: 11.5px;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
  opacity: .8;
}
.wppm-bdp.wppm-dtask .wppm-dtask-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 6px;
  margin: 0 0 12px;
  padding: 0;
  list-style: none;
}
.wppm-bdp.wppm-dtask .wppm-dtask-list li {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 24px;
  margin: 0;
  padding: 0 9px 0 7px;
  border: 1px solid #e5e7eb;
  border-radius: 999px;
  background: #f8fafc;
  color: #475569;
  font-size: 11.5px;
  font-weight: 600;
}
.wppm-bdp.wppm-dtask .wppm-dtask-list li::before {
  content: "\f335"; /* dashicons-no-alt */
  color: #ef4444;
  font: normal 14px/1 dashicons;
}

/* Delete Project confirmation (includes/admin/projects/wppm_get_delete_project.php):
   reuses the Delete Task chip + list (.wppm-dtask); adds the "archive instead" tip. */
.wppm-bdp.wppm-dproj .wppm-dproj-tip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 12px 0 0;
  padding: 6px 12px;
  border: 1px solid #fde68a;
  border-radius: 999px;
  background: #fffbeb;
  color: #92400e;
  font-size: 12px;
  font-weight: 600;
}
.wppm-bdp.wppm-dproj .wppm-dproj-tip .dashicons {
  width: 14px;
  height: 14px;
  font-size: 14px;
}

/* =====================================================================
   Edit Checklist Item dialog (includes/admin/tasks/open_task/checklist/wppm_edit_checklist_item.php)
   The form carries .wppm-cli.wppm-cli-edit. Frames are restyled only while they hold it;
   ids, field names, add-on hook output and Save/Close handlers are unchanged.
   ===================================================================== */
#wppm_task_popup:has(.wppm-cli-edit),
#wppm_popup:has(.wppm-cli-edit) {
  width: 100%;
  max-width: 520px;
  height: auto !important;
  left: 0;
  right: 0;
  float: none;
  margin-right: auto !important;
  margin-left: auto !important;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 24px 64px -12px rgba(15,23,42,.35), 0 2px 8px rgba(15,23,42,.08);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
#wppm_task_popup:has(.wppm-cli-edit) #wppm_task_popup_title,
#wppm_popup:has(.wppm-cli-edit) #wppm_popup_title {
  margin: 0;
  padding: 18px 24px !important;
  border-bottom: 1px solid #e5e7eb;
}
#wppm_task_popup:has(.wppm-cli-edit) #wppm_task_popup_title h3,
#wppm_popup:has(.wppm-cli-edit) #wppm_popup_title h3 {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  font: 700 17px/1.3 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  letter-spacing: -0.01em;
}
#wppm_task_popup:has(.wppm-cli-edit) #wppm_task_popup_title h3::before,
#wppm_popup:has(.wppm-cli-edit) #wppm_popup_title h3::before {
  content: "\f163"; /* dashicons-list-view */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  width: 36px;
  height: 36px;
  border-radius: 11px;
  background: linear-gradient(135deg, #4f46e5, #7c3aed);
  box-shadow: 0 6px 14px -6px rgba(79,70,229,.6);
  color: #fff;
  font: normal 18px/1 dashicons;
}
#wppm_task_popup:has(.wppm-cli-edit) #wppm_task_popup_body,
#wppm_popup:has(.wppm-cli-edit) #wppm_popup_body {
  min-height: 0;
  max-height: calc(100vh - 210px);
  margin: 0;
  padding: 20px 24px 22px !important;
}

/* ---------- Footer ---------- */
#wppm_task_popup:has(.wppm-cli-edit) #wppm_task_popup_footer,
#wppm_popup:has(.wppm-cli-edit) #wppm_popup_footer {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin: 0;
  padding: 14px 24px !important;
  border-top: 1px solid #e5e7eb;
  background: #f8fafc;
}
#wppm_task_popup:has(.wppm-cli-edit) #wppm_task_popup_footer button,
#wppm_popup:has(.wppm-cli-edit) #wppm_popup_footer button {
  width: auto;
  min-width: 96px;
  height: 38px;
  margin: 0;
  padding: 0 18px;
  border-radius: 9px !important;
  font: 600 13px/1 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  box-shadow: none;
}
#wppm_task_popup:has(.wppm-cli-edit) .wppm_popup_close,
#wppm_task_popup:has(.wppm-cli-edit) .wppm_task_popup_close,
#wppm_popup:has(.wppm-cli-edit) .wppm_popup_close,
#wppm_popup:has(.wppm-cli-edit) .wppm_task_popup_close {
  border: 1px solid #e5e7eb;
  background: #fff;
  color: #111827;
}
#wppm_task_popup:has(.wppm-cli-edit) .wppm_popup_close:hover,
#wppm_task_popup:has(.wppm-cli-edit) .wppm_task_popup_close:hover,
#wppm_popup:has(.wppm-cli-edit) .wppm_popup_close:hover,
#wppm_popup:has(.wppm-cli-edit) .wppm_task_popup_close:hover {
  background: #f1f5f9;
}
#wppm_task_popup:has(.wppm-cli-edit) .wppm_task_popup_action:hover,
#wppm_task_popup:has(.wppm-cli-edit) .wppm_popup_action:hover,
#wppm_popup:has(.wppm-cli-edit) .wppm_task_popup_action:hover,
#wppm_popup:has(.wppm-cli-edit) .wppm_popup_action:hover {
  filter: brightness(.94);
}

/* ---------- Body ---------- */
.wppm-cli {
  margin: 0;
  text-align: left;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
.wppm-cli .wppm-cli-context {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  margin: 0 0 16px;
  padding: 9px 12px;
  border: 1px solid #e0e7ff;
  border-radius: 10px;
  background: #eef2ff;
  color: #3730a3;
  font-size: 12.5px;
  line-height: 1.4;
}
.wppm-cli .wppm-cli-context .dashicons {
  flex: none;
  width: 16px;
  height: 16px;
  color: #4f46e5;
  font-size: 16px;
}
.wppm-cli .wppm-cli-context-label {
  flex: none;
  color: #6366f1;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: .04em;
  font-size: 11px;
}
.wppm-cli .wppm-cli-context-name {
  min-width: 0;
  overflow: hidden;
  color: #1e1b4b;
  font-weight: 600;
  white-space: nowrap;
  text-overflow: ellipsis;
}
.wppm-cli .wppm-cli-label {
  display: block;
  margin: 0 0 6px;
  color: #374151;
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1.4;
}
.wppm-cli .wppm-cli-field {
  position: relative;
}
.wppm-cli .wppm-cli-field .dashicons {
  position: absolute;
  top: 50%;
  left: 12px;
  width: 18px;
  height: 18px;
  margin-top: -9px;
  color: #9ca3af;
  font-size: 18px;
  pointer-events: none;
  transition: color .12s ease;
}
.wppm-cli .wppm-cli-field input.form-control {
  box-sizing: border-box;
  display: block;
  width: 100%;
  max-width: none;
  height: 44px;
  margin: 0;
  padding: 0 14px 0 40px;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(15,23,42,.04);
  color: #111827;
  font: 14px/1.4 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  transition: border-color .12s ease, box-shadow .12s ease;
}
.wppm-cli .wppm-cli-field input.form-control::placeholder {
  color: #9ca3af;
}
.wppm-cli .wppm-cli-field input.form-control:focus {
  outline: none;
  border-color: #4f46e5;
  box-shadow: 0 0 0 3px #eef2ff;
}
.wppm-cli .wppm-cli-field:focus-within .dashicons {
  color: #4f46e5;
}

@media (max-width: 600px) {
  #wppm_task_popup:has(.wppm-cli-edit),
  #wppm_popup:has(.wppm-cli-edit) {
    max-width: calc(100% - 24px);
  }
  #wppm_task_popup:has(.wppm-cli-edit) #wppm_task_popup_title,
  #wppm_popup:has(.wppm-cli-edit) #wppm_popup_title,
  #wppm_task_popup:has(.wppm-cli-edit) #wppm_task_popup_footer,
  #wppm_popup:has(.wppm-cli-edit) #wppm_popup_footer {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
  #wppm_task_popup:has(.wppm-cli-edit) #wppm_task_popup_body,
  #wppm_popup:has(.wppm-cli-edit) #wppm_popup_body {
    padding: 16px !important;
  }
  #wppm_task_popup:has(.wppm-cli-edit) #wppm_task_popup_footer button,
  #wppm_popup:has(.wppm-cli-edit) #wppm_popup_footer button {
    flex: 1 1 0;
  }
}
