/* ============================================================================
   TASKFLOW UNIFIED UI V10 — GLOBAL MODERNIZATION + TASK WORKFLOW COLORS
   Loaded after the legacy styles to normalize old screens into the current UI.
   ============================================================================ */
:root{
  --tf-v10-bg:#f6f8fc;
  --tf-v10-surface:#fff;
  --tf-v10-surface-2:#f9fbfe;
  --tf-v10-border:#e4e9f2;
  --tf-v10-border-strong:#d8dfeb;
  --tf-v10-text:#17233b;
  --tf-v10-muted:#748199;
  --tf-v10-primary:#5d5af0;
  --tf-v10-primary-2:#4a7cf6;
  --tf-v10-radius:16px;
  --tf-stage-important-bg:#c92f3a;
  --tf-stage-important-fg:#fff;
  --tf-stage-accepted-bg:#2866e8;
  --tf-stage-accepted-fg:#fff;
  --tf-stage-working-bg:#f2c94c;
  --tf-stage-working-fg:#182230;
  --tf-stage-halfway-bg:#ef8b2c;
  --tf-stage-halfway-fg:#182230;
  --tf-stage-ready-bg:#21965b;
  --tf-stage-ready-fg:#fff;
}
body.taskflow-app{background:var(--tf-v10-bg)!important;color:var(--tf-v10-text)!important}
body.taskflow-app .content-wrapper,body.taskflow-app .container-xxl,body.taskflow-app .container-fluid{min-width:0}
body.taskflow-app .card:not(.taskflow-ref-task-card):not(.tcard){border:1px solid var(--tf-v10-border)!important;border-radius:var(--tf-v10-radius)!important;box-shadow:0 7px 24px rgba(20,39,74,.045)!important;background:var(--tf-v10-surface)!important}
body.taskflow-app .card-header{background:transparent!important;border-bottom:1px solid #edf0f5!important;padding:16px 18px!important}
body.taskflow-app .card-body{min-width:0}
body.taskflow-app .modal-content,body.taskflow-app .offcanvas{border:1px solid var(--tf-v10-border)!important;border-radius:20px!important;box-shadow:0 24px 70px rgba(17,34,68,.18)!important;background:#fff!important}
body.taskflow-app .modal-header,body.taskflow-app .offcanvas-header{border-bottom:1px solid #edf0f5!important;padding:16px 20px!important}
body.taskflow-app .modal-footer{border-top:1px solid #edf0f5!important;padding:14px 20px!important}
body.taskflow-app .form-control,body.taskflow-app .form-select,body.taskflow-app .tk-input,body.taskflow-app .tk-select,body.taskflow-app textarea{min-height:44px;border:1px solid var(--tf-v10-border-strong)!important;border-radius:11px!important;background:#fff!important;color:var(--tf-v10-text)!important;box-shadow:none!important}
body.taskflow-app textarea{min-height:90px}
body.taskflow-app .form-control:focus,body.taskflow-app .form-select:focus,body.taskflow-app .tk-input:focus,body.taskflow-app .tk-select:focus,body.taskflow-app textarea:focus{border-color:#7c80f5!important;box-shadow:0 0 0 3px rgba(93,90,240,.10)!important}
body.taskflow-app .form-label{font-size:12px;font-weight:700;color:#33415a;margin-bottom:6px}
body.taskflow-app .btn{min-height:40px;border-radius:10px;font-weight:700;box-shadow:none!important}
body.taskflow-app .btn-primary{border-color:transparent!important;background:linear-gradient(135deg,var(--tf-v10-primary),var(--tf-v10-primary-2))!important}
body.taskflow-app .btn-light,body.taskflow-app .btn-outline-secondary{background:#fff!important;border-color:var(--tf-v10-border)!important;color:#536078!important}
body.taskflow-app .dropdown-menu{border:1px solid var(--tf-v10-border)!important;border-radius:13px!important;padding:7px!important;box-shadow:0 18px 48px rgba(20,39,74,.14)!important}
body.taskflow-app .dropdown-item{border-radius:8px;padding:9px 10px}
body.taskflow-app .nav-tabs{gap:4px;border-bottom:1px solid var(--tf-v10-border)!important}
body.taskflow-app .nav-tabs .nav-link{border:0!important;border-radius:9px 9px 0 0!important;color:#6f7c93;font-weight:650}
body.taskflow-app .nav-tabs .nav-link.active{background:#f0f1ff!important;color:#5653e4!important}
body.taskflow-app .alert{border:1px solid var(--tf-v10-border)!important;border-radius:12px!important}
body.taskflow-app .badge{border-radius:999px;font-weight:700;padding:.42em .68em}
body.taskflow-app .table-responsive{border-radius:14px}
body.taskflow-app table.table,body.taskflow-app .bootstrap-table .fixed-table-container{border-color:var(--tf-v10-border)!important}
body.taskflow-app .bootstrap-table .fixed-table-toolbar{padding:10px 12px}
body.taskflow-app .bootstrap-table thead th,body.taskflow-app table.table thead th{background:#f8faff!important;color:#66738b!important;font-size:11px!important;font-weight:800!important;text-transform:uppercase;letter-spacing:.03em;border-color:#edf0f5!important}
body.taskflow-app .bootstrap-table tbody td,body.taskflow-app table.table tbody td{vertical-align:middle!important;border-color:#edf0f5!important}
body.taskflow-app .pagination .page-link{border:1px solid var(--tf-v10-border)!important;border-radius:8px!important;margin-inline:2px;color:#5e6b82}
body.taskflow-app .breadcrumb{font-size:12px}
body.taskflow-app .breadcrumb a{color:#77849a}
body.taskflow-app .kanban-board{gap:14px!important}
body.taskflow-app .kcol{border:1px solid var(--tf-v10-border)!important;border-radius:16px!important;background:#f8faff!important;box-shadow:none!important}
body.taskflow-app .kcol-head{padding:13px 14px!important}
body.taskflow-app .tcard{border:1px solid var(--tf-v10-border)!important;border-radius:14px!important;box-shadow:0 6px 18px rgba(20,39,74,.05)!important}

/* Important selector in create/edit task. */
.taskflow-important-control{margin-top:12px;padding:10px 11px;display:flex;align-items:center;gap:10px;border:1px solid #f0c9cd;border-radius:13px;background:#fff8f8;cursor:pointer;user-select:none}
.taskflow-important-control>input[type=checkbox]{position:absolute;opacity:0;pointer-events:none}
.taskflow-important-control-icon{width:34px;height:34px;display:grid;place-items:center;flex:none;border-radius:10px;background:#fde7e9;color:#c92f3a;font-size:19px}
.taskflow-important-control-copy{display:flex;flex-direction:column;min-width:0;line-height:1.18;flex:1}
.taskflow-important-control-copy strong{font-size:12px;color:#8f2630}
.taskflow-important-control-copy small{font-size:10px;color:#9a6670;margin-top:2px}
.taskflow-important-switch{width:38px;height:22px;flex:none;border-radius:999px;background:#dce2eb;position:relative;transition:.18s ease}
.taskflow-important-switch:before{content:"";position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 4px rgba(15,23,42,.18);transition:.18s ease}
.taskflow-important-checkbox:checked~.taskflow-important-switch{background:#c92f3a}
.taskflow-important-checkbox:checked~.taskflow-important-switch:before{transform:translateX(16px)}
.taskflow-important-control:has(.taskflow-important-checkbox:checked){background:#fff1f2;border-color:#e9a6ad}

/* Lifecycle controls. */
.taskflow-lifecycle-panel{margin:12px 18px 0;padding:14px 15px;display:grid;grid-template-columns:minmax(180px,1fr) minmax(340px,1.4fr) auto;align-items:center;gap:14px;border:1px solid var(--tf-v10-border);border-radius:15px;background:#fff}
.taskflow-lifecycle-copy{display:flex;flex-direction:column;min-width:0}.taskflow-lifecycle-kicker{font-size:9px;font-weight:850;text-transform:uppercase;letter-spacing:.08em;color:#8490a5}.taskflow-lifecycle-copy strong{font-size:16px;color:#18243b}.taskflow-lifecycle-copy small{font-size:9.5px;color:#7b879c;margin-top:2px}
.taskflow-lifecycle-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.taskflow-lifecycle-steps span{min-height:40px;padding:6px;display:flex;align-items:center;justify-content:center;gap:5px;border:1px solid #e7ebf2;border-radius:10px;background:#fafbfe;color:#98a2b4;font-size:10px;font-weight:750;white-space:nowrap}.taskflow-lifecycle-steps span.done{background:#eef6ff;border-color:#cfe1fb;color:#37659e}.taskflow-lifecycle-steps span i{font-size:14px}
.taskflow-workflow-action-btn,.wg-task-workflow-btn{border:0;border-radius:10px;font-weight:800;cursor:pointer;transition:transform .15s ease,filter .15s ease}.taskflow-workflow-action-btn{min-height:42px;padding:0 14px;display:flex;align-items:center;gap:7px;color:#fff;background:#2866e8}.taskflow-workflow-action-btn.stage-working{background:#f2c94c;color:#182230}.taskflow-workflow-action-btn.stage-ready{background:#21965b}.taskflow-workflow-action-btn:hover,.wg-task-workflow-btn:hover{filter:brightness(.97);transform:translateY(-1px)}
.taskflow-visual-stage-chip{display:inline-flex;align-items:center;gap:5px;margin-top:6px;font-size:10px;font-weight:750;opacity:.94}

/* Full task colors: cards and rows are filled, with readable foreground colors. */
.taskflow-stage-important{--task-stage-bg:var(--tf-stage-important-bg);--task-stage-fg:var(--tf-stage-important-fg)}
.taskflow-stage-accepted{--task-stage-bg:var(--tf-stage-accepted-bg);--task-stage-fg:var(--tf-stage-accepted-fg)}
.taskflow-stage-working{--task-stage-bg:var(--tf-stage-working-bg);--task-stage-fg:var(--tf-stage-working-fg)}
.taskflow-stage-halfway{--task-stage-bg:var(--tf-stage-halfway-bg);--task-stage-fg:var(--tf-stage-halfway-fg)}
.taskflow-stage-ready{--task-stage-bg:var(--tf-stage-ready-bg);--task-stage-fg:var(--tf-stage-ready-fg)}

.taskflow-ref-task-card[class*="taskflow-stage-"]:not(.taskflow-stage-new),
.tcard[class*="taskflow-stage-"]:not(.taskflow-stage-new),
.wg-task-row[class*="taskflow-stage-"]:not(.taskflow-stage-new){background:var(--task-stage-bg)!important;border-color:color-mix(in srgb,var(--task-stage-bg) 82%,#000 18%)!important;color:var(--task-stage-fg)!important;box-shadow:0 9px 22px color-mix(in srgb,var(--task-stage-bg) 24%,transparent)!important}
.taskflow-ref-task-card[class*="taskflow-stage-"]:not(.taskflow-stage-new) *,
.tcard[class*="taskflow-stage-"]:not(.taskflow-stage-new) *,
.wg-task-row[class*="taskflow-stage-"]:not(.taskflow-stage-new) *{color:var(--task-stage-fg)!important}
.taskflow-ref-task-card[class*="taskflow-stage-"]:not(.taskflow-stage-new) .taskflow-ref-progress-track,
.tcard[class*="taskflow-stage-"]:not(.taskflow-stage-new) .tag,
.wg-task-row[class*="taskflow-stage-"]:not(.taskflow-stage-new) .wg-progress i{background:color-mix(in srgb,var(--task-stage-fg) 22%,transparent)!important;border-color:color-mix(in srgb,var(--task-stage-fg) 35%,transparent)!important}
.taskflow-ref-task-card[class*="taskflow-stage-"]:not(.taskflow-stage-new) .taskflow-ref-progress-track span,
.wg-task-row[class*="taskflow-stage-"]:not(.taskflow-stage-new) .wg-progress em{background:var(--task-stage-fg)!important}
.tcard[class*="taskflow-stage-"]:not(.taskflow-stage-new) .av,.taskflow-ref-task-card[class*="taskflow-stage-"]:not(.taskflow-stage-new) img{border-color:color-mix(in srgb,var(--task-stage-fg) 72%,transparent)!important}
.taskflow-stage-tag{display:inline-flex!important;align-items:center;gap:4px}

/* Bootstrap-table / grouped table full-row stage colors. */
body.taskflow-app tr.taskflow-stage-row[class*="taskflow-stage-"]:not(.taskflow-stage-new)>td{background:var(--task-stage-bg)!important;color:var(--task-stage-fg)!important;border-color:color-mix(in srgb,var(--task-stage-bg) 78%,#000 22%)!important}
body.taskflow-app tr.taskflow-stage-row[class*="taskflow-stage-"]:not(.taskflow-stage-new)>td *,body.taskflow-app tr.taskflow-stage-row[class*="taskflow-stage-"]:not(.taskflow-stage-new)>td a{color:var(--task-stage-fg)!important}
body.taskflow-app tr.taskflow-stage-row[class*="taskflow-stage-"]:not(.taskflow-stage-new)>td .badge{background:color-mix(in srgb,var(--task-stage-fg) 16%,transparent)!important;color:var(--task-stage-fg)!important;border:1px solid color-mix(in srgb,var(--task-stage-fg) 32%,transparent)!important}

/* Task details keep the full color in the task header/lifecycle identity, while forms remain readable. */
.taskflow-task-detail-stage[class*="taskflow-stage-"]:not(.taskflow-stage-new)>.task-ref-details-header{background:var(--task-stage-bg)!important;color:var(--task-stage-fg)!important;border-bottom-color:color-mix(in srgb,var(--task-stage-fg) 24%,transparent)!important}.taskflow-task-detail-stage[class*="taskflow-stage-"]:not(.taskflow-stage-new)>.task-ref-details-header *{color:var(--task-stage-fg)!important}.taskflow-task-detail-stage[class*="taskflow-stage-"]:not(.taskflow-stage-new)>.task-ref-details-header .task-ref-icon-button,.taskflow-task-detail-stage[class*="taskflow-stage-"]:not(.taskflow-stage-new)>.task-ref-details-header .task-ref-outline-btn{border-color:color-mix(in srgb,var(--task-stage-fg) 38%,transparent)!important;background:color-mix(in srgb,var(--task-stage-fg) 10%,transparent)!important}

/* Work groups task row after converting the old anchor row into a row + action. */
.wg-task-row{display:flex!important;align-items:stretch!important;gap:6px!important}.wg-task-row-link{display:grid;grid-template-columns:8px minmax(0,1fr) minmax(80px,130px);align-items:center;gap:10px;flex:1;min-width:0;padding:10px 11px;text-decoration:none;color:inherit}.wg-task-workflow-form{display:flex;align-items:center;padding:6px 7px 6px 0}.wg-task-workflow-btn{min-width:66px;min-height:34px;padding:5px 8px;display:flex;align-items:center;justify-content:center;gap:4px;background:rgba(255,255,255,.18);color:inherit;border:1px solid rgba(255,255,255,.28)}.wg-task-workflow-btn i{font-size:14px}.wg-task-workflow-btn span{font-size:9px}

@media(max-width:991.98px){body.taskflow-app .modal-dialog{margin:10px}.taskflow-lifecycle-panel{grid-template-columns:1fr;margin:10px 12px 0}.taskflow-lifecycle-steps{grid-template-columns:repeat(2,1fr)}.taskflow-workflow-action-form{width:100%}.taskflow-workflow-action-btn{width:100%;justify-content:center}.wg-task-row-link{grid-template-columns:7px minmax(0,1fr)}.wg-progress{display:none!important}.wg-task-workflow-btn span{display:none}.wg-task-workflow-btn{min-width:38px;width:38px;padding:0}}
@media(max-width:575.98px){body.taskflow-app .card{border-radius:13px!important}.taskflow-lifecycle-steps{grid-template-columns:1fr 1fr}.taskflow-important-control-copy small{display:none}.taskflow-important-control{padding:9px}.taskflow-ref-task-card{border-radius:14px!important}}

/* Ensure the lifecycle color fills the whole task surface, not only its outer shell. */
.taskflow-ref-task-card[class*="taskflow-stage-"]:not(.taskflow-stage-new) .taskflow-ref-task-rail,
.taskflow-ref-task-card[class*="taskflow-stage-"]:not(.taskflow-stage-new) .taskflow-ref-task-main,
.taskflow-ref-task-card[class*="taskflow-stage-"]:not(.taskflow-stage-new) .taskflow-ref-task-meta,
.taskflow-ref-task-card[class*="taskflow-stage-"]:not(.taskflow-stage-new) .taskflow-ref-task-title-row,
.tcard[class*="taskflow-stage-"]:not(.taskflow-stage-new) .tcard-meta,
.tcard[class*="taskflow-stage-"]:not(.taskflow-stage-new) .tcard-tags,
.tcard[class*="taskflow-stage-"]:not(.taskflow-stage-new) .tcard-foot,
.wg-task-row[class*="taskflow-stage-"]:not(.taskflow-stage-new) .wg-task-row-link,
.wg-task-row[class*="taskflow-stage-"]:not(.taskflow-stage-new) .wg-task-workflow-form{
  background:transparent!important;
}
.taskflow-ref-task-card[class*="taskflow-stage-"]:not(.taskflow-stage-new)::before,
.taskflow-ref-task-card[class*="taskflow-stage-"]:not(.taskflow-stage-new)::after,
.tcard[class*="taskflow-stage-"]:not(.taskflow-stage-new)::before,
.tcard[class*="taskflow-stage-"]:not(.taskflow-stage-new)::after{
  border-color:color-mix(in srgb,var(--task-stage-fg) 35%,transparent)!important;
}