/* V208 - Modern checkbox UI for task table AND compact column popover
   UI-only. Does not change backend, task data, filters, export, permissions or workflow. */

#taskDataGrid th.select-col,
#taskDataGrid td.select-col{
  width:48px!important;
  min-width:48px!important;
  max-width:48px!important;
  padding-left:12px!important;
  padding-right:12px!important;
  text-align:center!important;
  vertical-align:middle!important;
  overflow:visible!important;
  text-overflow:clip!important;
  white-space:normal!important;
}

#taskDataGrid th.select-col{
  background:#ffffff!important;
}

#taskDataGrid th.select-col::before,
#taskDataGrid th.select-col::after,
#taskDataGrid td.select-col::before,
#taskDataGrid td.select-col::after{
  content:none!important;
}

/* Table checkbox keeps 16px for easy row selection. */
#taskDataGrid input[type="checkbox"]{
  appearance:none!important;
  -webkit-appearance:none!important;
  box-sizing:border-box!important;
  width:16px!important;
  height:16px!important;
  min-width:16px!important;
  min-height:16px!important;
  max-width:16px!important;
  max-height:16px!important;
  margin:0!important;
  padding:0!important;
  cursor:pointer!important;
  border:1.5px solid #cbd5e1!important;
  border-radius:4px!important;
  background:#ffffff!important;
  background-image:none!important;
  display:inline-grid!important;
  place-content:center!important;
  vertical-align:middle!important;
  box-shadow:none!important;
  transform:none!important;
  transition:background-color .15s ease,border-color .15s ease,box-shadow .15s ease,transform .08s ease!important;
}

#taskDataGrid input[type="checkbox"]:hover{
  border-color:#2563eb!important;
  box-shadow:0 0 0 3px rgba(37,99,235,.08)!important;
}

#taskDataGrid input[type="checkbox"]:focus{outline:none!important;}
#taskDataGrid input[type="checkbox"]:focus-visible{
  outline:none!important;
  box-shadow:0 0 0 3px rgba(37,99,235,.18)!important;
}
#taskDataGrid input[type="checkbox"]:active{transform:scale(.96)!important;}
#taskDataGrid input[type="checkbox"]:checked,
#taskDataGrid input[type="checkbox"]:indeterminate{
  background:#2563eb!important;
  border-color:#2563eb!important;
}
#taskDataGrid input[type="checkbox"]:checked::after{
  content:""!important;
  width:4px!important;
  height:8px!important;
  border:solid #ffffff!important;
  border-width:0 2px 2px 0!important;
  transform:rotate(45deg)!important;
  margin-top:-1px!important;
}
#taskDataGrid input[type="checkbox"]:indeterminate::after{
  content:""!important;
  width:8px!important;
  height:2px!important;
  border-radius:999px!important;
  background:#ffffff!important;
}
#taskDataGrid input[type="checkbox"]:disabled{
  cursor:not-allowed!important;
  opacity:.9!important;
}

/* Column popover polish: compact checklist, not switch/toggle UI. */
.column-menu{
  width:236px!important;
  max-width:236px!important;
  border:1px solid #dbe4f0!important;
  border-radius:12px!important;
  background:#ffffff!important;
  box-shadow:0 14px 34px rgba(15,23,42,.12),0 4px 10px rgba(15,23,42,.06)!important;
  padding:9px!important;
}

.column-menu .column-menu-head{
  padding:1px 4px 8px!important;
  border-bottom:1px solid #eef2f7!important;
  margin-bottom:5px!important;
}

.column-menu .column-menu-head b{
  color:#111827!important;
  font-size:13px!important;
  font-weight:700!important;
  line-height:1.25!important;
}

.column-menu .column-menu-head small{
  display:block!important;
  margin-top:2px!important;
  color:#64748b!important;
  font-size:11px!important;
  font-weight:400!important;
  line-height:1.3!important;
}

.column-menu .column-menu-list{
  display:flex!important;
  flex-direction:column!important;
  gap:0!important;
  max-height:300px!important;
  overflow-y:auto!important;
  padding:2px 1px 5px!important;
  scrollbar-width:thin!important;
  scrollbar-color:#cbd5e1 transparent!important;
}

.column-menu .column-menu-list::-webkit-scrollbar{width:5px!important;}
.column-menu .column-menu-list::-webkit-scrollbar-thumb{
  background:#cbd5e1!important;
  border-radius:999px!important;
}

.column-menu .column-check{
  display:grid!important;
  grid-template-columns:14px minmax(0,1fr)!important;
  align-items:center!important;
  column-gap:10px!important;
  min-height:28px!important;
  padding:4px 7px!important;
  border-radius:8px!important;
  cursor:pointer!important;
  color:#374151!important;
  font-size:12px!important;
  font-weight:400!important;
  line-height:1.25!important;
  background:transparent!important;
  border:0!important;
  letter-spacing:0!important;
}

.column-menu .column-check:hover{background:#f8fafc!important;}

.column-menu .column-check input[type="checkbox"]{
  appearance:none!important;
  -webkit-appearance:none!important;
  box-sizing:border-box!important;
  width:14px!important;
  height:14px!important;
  min-width:14px!important;
  min-height:14px!important;
  max-width:14px!important;
  max-height:14px!important;
  margin:0!important;
  padding:0!important;
  cursor:pointer!important;
  border:1.4px solid #cbd5e1!important;
  border-radius:3.5px!important;
  background:#ffffff!important;
  background-image:none!important;
  display:inline-grid!important;
  place-content:center!important;
  vertical-align:middle!important;
  box-shadow:none!important;
  transform:none!important;
  transition:background-color .15s ease,border-color .15s ease,box-shadow .15s ease,transform .08s ease!important;
}

.column-menu .column-check input[type="checkbox"]:hover{
  border-color:#2563eb!important;
  box-shadow:0 0 0 3px rgba(37,99,235,.07)!important;
}
.column-menu .column-check input[type="checkbox"]:focus{outline:none!important;}
.column-menu .column-check input[type="checkbox"]:focus-visible{
  outline:none!important;
  box-shadow:0 0 0 3px rgba(37,99,235,.16)!important;
}
.column-menu .column-check input[type="checkbox"]:active{transform:scale(.96)!important;}
.column-menu .column-check input[type="checkbox"]:checked,
.column-menu .column-check input[type="checkbox"]:indeterminate{
  background:#2563eb!important;
  border-color:#2563eb!important;
}
.column-menu .column-check input[type="checkbox"]:checked::after{
  content:""!important;
  width:3.5px!important;
  height:7px!important;
  border:solid #ffffff!important;
  border-width:0 1.8px 1.8px 0!important;
  transform:rotate(45deg)!important;
  margin-top:-1px!important;
}
.column-menu .column-check input[type="checkbox"]:indeterminate::after{
  content:""!important;
  width:7px!important;
  height:1.8px!important;
  border-radius:999px!important;
  background:#ffffff!important;
}
.column-menu .column-check input[type="checkbox"]:disabled{
  cursor:not-allowed!important;
  opacity:.9!important;
}

.column-menu .column-check span{
  display:block!important;
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  color:#374151!important;
  font-size:12px!important;
  font-weight:400!important;
  line-height:1.25!important;
}

.column-menu .column-check input[type="checkbox"]:checked + span,
.column-menu .column-check input[type="checkbox"]:disabled + span{
  color:#111827!important;
  font-size:12px!important;
  font-weight:500!important;
}

.column-menu .column-menu-actions{
  padding:7px 1px 0!important;
  border-top:1px solid #eef2f7!important;
  margin-top:4px!important;
}

.column-menu .column-menu-actions .btn,
.column-menu #resetCols{
  width:100%!important;
  height:30px!important;
  border-radius:8px!important;
  font-size:11.5px!important;
  font-weight:700!important;
  color:#1d4ed8!important;
  background:#eef4ff!important;
  border:1px solid #c7d7fe!important;
}

.column-menu .column-menu-actions .btn:hover,
.column-menu #resetCols:hover{
  background:#dfe9ff!important;
}