/* ============================================================================
   TASKFLOW SYSTEM — production design layer
   Applies the reference Design Specification to the existing Taskify/Laravel UI
   without replacing business logic, routes, permissions, APIs, or DB models.
   ============================================================================ */
:root{
  --tf-primary:#5b5cf6;
  --tf-primary-2:#2f6bff;
  --tf-primary-soft:#f0efff;
  --tf-indigo:#4f46e5;
  --tf-violet:#7c3aed;
  --tf-success:#16a34a;
  --tf-success-soft:#eaf8ef;
  --tf-warning:#f59e0b;
  --tf-warning-soft:#fff7e6;
  --tf-danger:#ef4444;
  --tf-danger-soft:#fff0f1;
  --tf-info:#2563eb;
  --tf-info-soft:#eef5ff;
  --tf-bg:#f7f8fc;
  --tf-surface:#ffffff;
  --tf-surface-2:#fbfcff;
  --tf-text:#111827;
  --tf-text-2:#334155;
  --tf-muted:#7b849b;
  --tf-line:#e6e9f2;
  --tf-line-strong:#d7dcea;
  --tf-sidebar-w:248px;
  --tf-header-h:70px;
  --tf-radius-xs:8px;
  --tf-radius-sm:10px;
  --tf-radius:14px;
  --tf-radius-lg:18px;
  --tf-shadow-xs:0 1px 2px rgba(15,23,42,.035);
  --tf-shadow-sm:0 6px 18px rgba(15,23,42,.045);
  --tf-shadow:0 14px 38px rgba(15,23,42,.07);
  --tf-focus:0 0 0 3px rgba(91,92,246,.14);
  --tf-font:"Inter","Plus Jakarta Sans","Segoe UI",Roboto,Arial,sans-serif;
}

body.taskflow-app{
  font-family:var(--tf-font)!important;
  background:var(--tf-bg)!important;
  color:var(--tf-text-2)!important;
  font-size:14px!important;
  line-height:1.5!important;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
body.taskflow-app *{box-sizing:border-box}
body.taskflow-app a{color:inherit}
body.taskflow-app a:hover{color:var(--tf-primary)}
body.taskflow-app .text-muted{color:var(--tf-muted)!important}
body.taskflow-app h1,body.taskflow-app h2,body.taskflow-app h3,body.taskflow-app h4,body.taskflow-app h5,body.taskflow-app h6{
  color:var(--tf-text)!important;font-weight:700;letter-spacing:-.02em;
}
body.taskflow-app .layout-wrapper{min-height:100vh;background:var(--tf-bg)!important}
body.taskflow-app .layout-container{display:flex;min-height:100vh;align-items:stretch}
body.taskflow-app .layout-page{min-width:0;flex:1 1 auto;margin-inline-start:var(--tf-sidebar-w)!important;width:calc(100% - var(--tf-sidebar-w))!important;background:var(--tf-bg)!important}
body.taskflow-app .content-wrapper{min-width:0;padding:0!important;background:transparent!important}
body.taskflow-app .content-wrapper>.container-fluid,
body.taskflow-app .content-wrapper>.container-xxl,
body.taskflow-app .content-wrapper>.container,
body.taskflow-app .container-p-y{
  width:100%;max-width:1600px;margin-inline:auto!important;padding:24px 28px 32px!important;
}

/* ========================= Unified sidebar ========================= */
.taskflow-sidebar-shell{position:fixed!important;inset-block:0;inset-inline-start:0;width:var(--tf-sidebar-w)!important;z-index:1040!important;background:transparent!important;border:0!important;visibility:visible!important;transform:none!important}
.taskflow-sidebar{width:var(--tf-sidebar-w);height:100vh;background:rgba(255,255,255,.96);border-inline-end:1px solid var(--tf-line);display:flex;flex-direction:column;overflow:hidden;box-shadow:var(--tf-shadow-xs);backdrop-filter:blur(14px)}
.taskflow-sidebar-head{height:76px;display:flex;align-items:center;justify-content:space-between;padding:14px 18px 10px;flex:none}
.taskflow-brand{display:flex;align-items:center;gap:11px;min-width:0;text-decoration:none!important}
.taskflow-brand-mark{width:36px;height:36px;display:grid;place-items:center;border-radius:11px;background:linear-gradient(145deg,#eef0ff,#faf8ff);border:1px solid #dde1ff;overflow:hidden;flex:none}
.taskflow-brand-mark img{width:25px;height:25px;object-fit:contain}
.taskflow-brand-name{font-size:19px;font-weight:800;color:var(--tf-text);letter-spacing:-.03em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.taskflow-sidebar-close{width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--tf-line);background:#fff;border-radius:10px;color:var(--tf-text-2);font-size:22px}
.taskflow-create-task{margin:0 16px 12px;height:46px;border:0;border-radius:11px;background:linear-gradient(135deg,var(--tf-primary),var(--tf-primary-2));color:#fff;display:flex;align-items:center;justify-content:center;gap:9px;font-size:14px;font-weight:700;box-shadow:0 8px 20px rgba(65,83,255,.19);cursor:pointer;transition:.18s ease}
.taskflow-create-task:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(65,83,255,.24)}
.taskflow-create-task i{font-size:20px}
.taskflow-workspace-switcher{margin:0 16px 12px}
.taskflow-workspace-button{width:100%;min-height:54px;border:1px solid var(--tf-line);background:var(--tf-surface-2);border-radius:11px;padding:8px 10px;display:flex;align-items:center;gap:9px;text-align:start;color:var(--tf-text-2)}
.taskflow-workspace-button:after{margin-inline-start:auto}
.taskflow-workspace-icon{width:32px;height:32px;display:grid;place-items:center;border-radius:9px;background:var(--tf-primary-soft);color:var(--tf-primary);font-size:17px;flex:none}
.taskflow-workspace-copy{min-width:0;display:flex;flex-direction:column;line-height:1.2}
.taskflow-workspace-copy small{font-size:10px;text-transform:uppercase;letter-spacing:.07em;color:var(--tf-muted);font-weight:700}
.taskflow-workspace-copy strong{font-size:12px;color:var(--tf-text);max-width:132px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.taskflow-workspace-menu{min-width:270px;border:1px solid var(--tf-line)!important;border-radius:12px!important;box-shadow:var(--tf-shadow)!important}
.taskflow-dropdown-row{display:flex!important;justify-content:space-between;align-items:center;gap:8px}
.taskflow-sidebar-nav{flex:1 1 auto;min-height:0;overflow-y:auto;padding:0 12px 18px;scrollbar-width:thin;scrollbar-color:#dfe3ec transparent}
.taskflow-nav-section{padding:10px 4px 4px}
.taskflow-nav-label{padding:5px 9px 7px;font-size:10px;line-height:1;text-transform:uppercase;letter-spacing:.085em;color:#9aa2b4;font-weight:800}
.taskflow-nav-item,.taskflow-nav-subitem{min-height:40px;border-radius:10px;color:#4b5670!important;text-decoration:none!important;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px;transition:background .16s ease,color .16s ease;margin:1px 0;cursor:pointer}
.taskflow-nav-item:hover,.taskflow-nav-subitem:hover{background:#f4f5fb;color:var(--tf-text)!important}
.taskflow-nav-item.is-active,.taskflow-nav-subitem.is-active{background:linear-gradient(90deg,#eeefff 0%,#f7f7ff 100%);color:var(--tf-indigo)!important;font-weight:700;box-shadow:inset 3px 0 0 var(--tf-primary)}
[dir="rtl"] .taskflow-nav-item.is-active,[dir="rtl"] .taskflow-nav-subitem.is-active{box-shadow:inset -3px 0 0 var(--tf-primary)}
.taskflow-nav-leading{display:flex;align-items:center;gap:10px;min-width:0}
.taskflow-nav-leading>i,.taskflow-nav-subitem>i{width:19px;font-size:19px;display:grid;place-items:center;flex:none}
.taskflow-nav-leading>span,.taskflow-nav-subitem>span:not(.ms-auto){min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.taskflow-nav-trailing{display:flex;align-items:center;gap:4px;margin-inline-start:auto}
.taskflow-nav-group>summary{list-style:none}
.taskflow-nav-group>summary::-webkit-details-marker{display:none}
.taskflow-nav-chevron{transition:transform .16s ease;font-size:18px}
.taskflow-nav-group[open] .taskflow-nav-chevron{transform:rotate(180deg)}
.taskflow-nav-submenu{padding-inline-start:20px;padding-block:2px 6px}
.taskflow-nav-subitem{min-height:36px;padding-block:6px;font-size:12.5px}
.taskflow-sidebar-foot{padding:12px 14px 16px;border-top:1px solid var(--tf-line);background:#fff;flex:none}
.taskflow-sidebar-profile{display:flex;align-items:center;gap:10px;padding:8px;border-radius:11px;text-decoration:none!important}
.taskflow-sidebar-profile:hover{background:#f7f8fc}
.taskflow-sidebar-profile img{width:36px;height:36px;border-radius:50%;object-fit:cover;flex:none}
.taskflow-sidebar-profile-copy{min-width:0;display:flex;flex:1;flex-direction:column}
.taskflow-sidebar-profile-copy strong{font-size:12.5px;color:var(--tf-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.taskflow-sidebar-profile-copy small{font-size:10.5px;color:var(--tf-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.taskflow-sidebar-profile-arrow{font-size:18px;color:#9aa2b4}
[dir="rtl"] .taskflow-sidebar-profile-arrow{transform:rotate(180deg)}

/* ========================= Header / navbar ========================= */
body.taskflow-app #section-not-to-print{position:sticky;top:0;z-index:1025}
body.taskflow-app .tk-cbar{height:var(--tf-header-h)!important;min-height:var(--tf-header-h)!important;width:100%!important;display:flex!important;align-items:center!important;gap:14px!important;padding:12px 28px!important;background:rgba(255,255,255,.9)!important;border-bottom:1px solid var(--tf-line)!important;box-shadow:none!important;backdrop-filter:blur(16px)!important}
body.taskflow-app .tk-cbar-crumb{display:none!important}
body.taskflow-app .tk-cbar-burger{width:40px;height:40px;border:1px solid var(--tf-line);background:#fff;border-radius:10px;color:var(--tf-text);display:grid;place-items:center;flex:none}
body.taskflow-app .tk-cbar-search{width:min(540px,48vw)!important;height:42px!important;border:1px solid var(--tf-line)!important;border-radius:11px!important;background:#fbfcff!important;padding:0 13px!important;gap:9px!important;display:flex!important;align-items:center!important;color:var(--tf-muted)!important;box-shadow:none!important;transition:.18s ease!important}
body.taskflow-app .tk-cbar-search:hover{border-color:#ccd2e2!important;background:#fff!important}
body.taskflow-app .tk-cbar-search-text{flex:1;text-align:start;font-size:13px}
body.taskflow-app .tk-kbd{border:1px solid var(--tf-line);background:#fff;border-radius:6px;font-size:9px;font-weight:700;color:#99a2b5;padding:2px 5px}
body.taskflow-app .tk-cbar-actions{margin-inline-start:auto;display:flex;align-items:center;gap:7px}
body.taskflow-app .tk-icon-btn{width:40px!important;height:40px!important;border-radius:10px!important;border:1px solid var(--tf-line)!important;background:#fff!important;color:#334155!important;display:grid!important;place-items:center!important;position:relative!important}
body.taskflow-app .tk-icon-btn:hover{background:#f7f8fc!important;color:var(--tf-primary)!important}
body.taskflow-app .tk-cbar-divider{height:28px;width:1px;background:var(--tf-line);margin:0 2px}
body.taskflow-app .tk-cbar-user{height:42px!important;display:flex!important;align-items:center!important;gap:9px!important;border:1px solid transparent!important;border-radius:11px!important;padding:3px 7px!important;text-decoration:none!important}
body.taskflow-app .tk-cbar-user:hover{background:#f7f8fc!important;border-color:var(--tf-line)!important}
body.taskflow-app .tk-cbar-user img{width:34px!important;height:34px!important;border-radius:50%!important;object-fit:cover!important}
body.taskflow-app .tk-cbar-username{font-size:12.5px!important;color:var(--tf-text)!important;font-weight:700!important}

/* ========================= Global page chrome ========================= */
body.taskflow-app .breadcrumb{margin:0}
body.taskflow-app .breadcrumb-item,body.taskflow-app .breadcrumb-item a{font-size:12px;color:#8d96aa;text-decoration:none}
body.taskflow-app .breadcrumb-item.active{color:#4c5870}
body.taskflow-app .page-title,body.taskflow-app .content-wrapper h4:first-child{letter-spacing:-.025em}
body.taskflow-app .card{
  background:var(--tf-surface)!important;border:1px solid var(--tf-line)!important;border-radius:var(--tf-radius)!important;box-shadow:var(--tf-shadow-xs)!important;color:var(--tf-text-2)!important;
}
body.taskflow-app .card-header{background:transparent!important;border-bottom:1px solid var(--tf-line)!important;padding:16px 18px!important}
body.taskflow-app .card-body{padding:18px!important}
body.taskflow-app .card-footer{background:#fff!important;border-top:1px solid var(--tf-line)!important;padding:13px 18px!important}
body.taskflow-app .row{--bs-gutter-x:1rem;--bs-gutter-y:1rem}
body.taskflow-app .shadow-sm,body.taskflow-app .shadow{box-shadow:var(--tf-shadow-sm)!important}

/* Buttons */
body.taskflow-app .btn{min-height:40px;border-radius:10px!important;font-size:13px!important;font-weight:650!important;display:inline-flex;align-items:center;justify-content:center;gap:7px;box-shadow:none!important;padding:0 14px!important;transition:.16s ease}
body.taskflow-app .btn-sm{min-height:34px!important;padding-inline:11px!important;font-size:12px!important;border-radius:9px!important}
body.taskflow-app .btn-lg{min-height:46px!important;padding-inline:18px!important}
body.taskflow-app .btn-primary{background:linear-gradient(135deg,var(--tf-primary),var(--tf-primary-2))!important;border-color:transparent!important;color:#fff!important}
body.taskflow-app .btn-primary:hover{filter:brightness(1.03);transform:translateY(-1px)}
body.taskflow-app .btn-outline-primary{border-color:#cbd0ff!important;color:var(--tf-indigo)!important;background:#fff!important}
body.taskflow-app .btn-outline-primary:hover{background:var(--tf-primary-soft)!important;color:var(--tf-indigo)!important}
body.taskflow-app .btn-light,body.taskflow-app .btn-secondary{background:#fff!important;border-color:var(--tf-line)!important;color:var(--tf-text-2)!important}
body.taskflow-app .btn-danger{background:var(--tf-danger)!important;border-color:var(--tf-danger)!important}

/* Form system */
body.taskflow-app label,body.taskflow-app .form-label{font-size:12.5px!important;color:var(--tf-text)!important;font-weight:650!important;margin-bottom:7px!important}
body.taskflow-app .form-control,body.taskflow-app .form-select,body.taskflow-app .form-control-sm,
body.taskflow-app .select2-container--default .select2-selection--single,
body.taskflow-app .select2-container--default .select2-selection--multiple,
body.taskflow-app .ts-wrapper .ts-control{
  min-height:42px!important;border:1px solid var(--tf-line-strong)!important;border-radius:10px!important;background:#fff!important;color:var(--tf-text-2)!important;font-size:13px!important;box-shadow:none!important;
}
body.taskflow-app .form-control,body.taskflow-app .form-select{padding:9px 12px!important}
body.taskflow-app textarea.form-control{min-height:96px;resize:vertical}
body.taskflow-app .form-control::placeholder{color:#a2a9b8!important}
body.taskflow-app .form-control:focus,body.taskflow-app .form-select:focus,
body.taskflow-app .select2-container--focus .select2-selection,
body.taskflow-app .ts-wrapper.focus .ts-control{border-color:#7a7cff!important;box-shadow:var(--tf-focus)!important}
body.taskflow-app .input-group-text{border-color:var(--tf-line-strong)!important;background:#fafbfe!important;color:#64748b!important}
body.taskflow-app .form-check-input{width:18px;height:18px;border-color:#cdd3df!important}
body.taskflow-app .form-check-input:checked{background-color:var(--tf-primary)!important;border-color:var(--tf-primary)!important}
body.taskflow-app .select2-dropdown,body.taskflow-app .ts-dropdown{border:1px solid var(--tf-line)!important;border-radius:10px!important;box-shadow:var(--tf-shadow)!important;background:#fff!important;overflow:hidden}

/* Tabs / pills */
body.taskflow-app .nav-tabs{border-bottom:1px solid var(--tf-line)!important;gap:4px}
body.taskflow-app .nav-tabs .nav-link{border:0!important;border-bottom:2px solid transparent!important;border-radius:0!important;color:#667085!important;font-weight:650!important;font-size:12.5px!important;padding:10px 13px!important;background:transparent!important}
body.taskflow-app .nav-tabs .nav-link.active{color:var(--tf-primary)!important;border-bottom-color:var(--tf-primary)!important}
body.taskflow-app .nav-pills{gap:5px}
body.taskflow-app .nav-pills .nav-link{border-radius:9px!important;font-size:12.5px!important;color:#59657a!important;padding:8px 12px!important}
body.taskflow-app .nav-pills .nav-link.active{background:var(--tf-primary-soft)!important;color:var(--tf-indigo)!important;font-weight:700!important}
body.taskflow-app .seg{border:1px solid var(--tf-line)!important;border-radius:10px!important;background:#fff!important;padding:3px!important;display:flex;gap:2px}
body.taskflow-app .seg-btn{width:34px!important;height:32px!important;border-radius:8px!important;display:grid!important;place-items:center!important;color:#788298!important}
body.taskflow-app .seg-btn.on,body.taskflow-app .seg-btn:hover{background:var(--tf-primary-soft)!important;color:var(--tf-primary)!important}

/* Tables: desktop + safe overflow */
body.taskflow-app .table-responsive{border-radius:12px;border:1px solid var(--tf-line);background:#fff;overflow:auto}
body.taskflow-app table{color:var(--tf-text-2)!important;margin-bottom:0!important}
body.taskflow-app .table>:not(caption)>*>*{padding:12px 13px!important;border-bottom-color:#edf0f5!important;vertical-align:middle!important;font-size:12.5px!important}
body.taskflow-app .table thead th{height:44px;background:#fafbfe!important;color:#667085!important;font-size:10.5px!important;text-transform:uppercase;letter-spacing:.04em;font-weight:800!important;white-space:nowrap}
body.taskflow-app .table tbody tr{background:#fff;transition:background .14s ease}
body.taskflow-app .table tbody tr:hover{background:#fafbff!important}
body.taskflow-app .bootstrap-table .fixed-table-container{border:1px solid var(--tf-line)!important;border-radius:12px!important;overflow:hidden!important;background:#fff!important}
body.taskflow-app .bootstrap-table .fixed-table-toolbar{margin-bottom:10px}
body.taskflow-app .bootstrap-table .fixed-table-container .table thead th{border-color:var(--tf-line)!important}
body.taskflow-app .bootstrap-table .fixed-table-pagination{padding:12px 4px 0;color:var(--tf-muted);font-size:12px}
body.taskflow-app .page-link{min-width:34px;height:34px;border-radius:8px!important;margin:0 2px;border:1px solid var(--tf-line)!important;color:#64748b!important;display:grid;place-items:center;font-size:12px}
body.taskflow-app .page-item.active .page-link{background:var(--tf-primary)!important;border-color:var(--tf-primary)!important;color:#fff!important}

/* Generic status + priority badges */
body.taskflow-app .badge{border-radius:999px!important;padding:5px 9px!important;font-size:10.5px!important;font-weight:750!important;line-height:1.1!important;max-width:100%;overflow:hidden;text-overflow:ellipsis}
body.taskflow-app .bg-primary{background:var(--tf-primary)!important}
body.taskflow-app .bg-success{background:var(--tf-success)!important}
body.taskflow-app .bg-warning{background:var(--tf-warning)!important}
body.taskflow-app .bg-danger{background:var(--tf-danger)!important}
body.taskflow-app .bg-info{background:var(--tf-info)!important}
body.taskflow-app .text-primary{color:var(--tf-primary)!important}
body.taskflow-app .text-success{color:var(--tf-success)!important}
body.taskflow-app .text-warning{color:#c77b00!important}
body.taskflow-app .text-danger{color:var(--tf-danger)!important}

/* Dropdowns, modals, offcanvas */
body.taskflow-app .dropdown-menu{border:1px solid var(--tf-line)!important;border-radius:12px!important;box-shadow:var(--tf-shadow)!important;padding:7px!important;background:#fff!important}
body.taskflow-app .dropdown-item{min-height:36px;border-radius:8px!important;display:flex;align-items:center;gap:8px;font-size:12.5px;color:#4a556a!important;padding:8px 10px!important}
body.taskflow-app .dropdown-item:hover,body.taskflow-app .dropdown-item:focus{background:#f5f6fb!important;color:var(--tf-text)!important}
body.taskflow-app .modal-backdrop.show{opacity:.36!important;backdrop-filter:blur(2px)}
body.taskflow-app .modal-dialog{max-width:min(720px,calc(100vw - 28px))}
body.taskflow-app .modal-content,body.taskflow-app .offcanvas{border:1px solid var(--tf-line)!important;border-radius:16px!important;box-shadow:0 28px 80px rgba(15,23,42,.16)!important;background:#fff!important;color:var(--tf-text-2)!important;overflow:hidden}
body.taskflow-app .modal-header,body.taskflow-app .offcanvas-header{padding:16px 18px!important;border-bottom:1px solid var(--tf-line)!important;background:linear-gradient(90deg,#fbfcff,#faf8ff)!important}
body.taskflow-app .modal-title,body.taskflow-app .offcanvas-title{font-size:17px!important;font-weight:800!important;color:var(--tf-text)!important}
body.taskflow-app .modal-body,body.taskflow-app .offcanvas-body{padding:18px!important}
body.taskflow-app .modal-footer{padding:13px 18px!important;border-top:1px solid var(--tf-line)!important}
body.taskflow-app .btn-close{width:32px;height:32px;border:1px solid var(--tf-line);border-radius:9px;background-color:#fff!important;opacity:1}

/* Alerts, accordion, list groups */
body.taskflow-app .alert{border:1px solid var(--tf-line)!important;border-radius:11px!important;font-size:12.5px!important}
body.taskflow-app .accordion-item{border:1px solid var(--tf-line)!important;border-radius:11px!important;overflow:hidden;margin-bottom:8px;background:#fff}
body.taskflow-app .accordion-button{font-size:13px!important;font-weight:700!important;color:var(--tf-text)!important;background:#fff!important;box-shadow:none!important}
body.taskflow-app .accordion-button:not(.collapsed){background:#f8f8ff!important;color:var(--tf-primary)!important}
body.taskflow-app .list-group{border-radius:12px!important;overflow:hidden;border:1px solid var(--tf-line)!important}
body.taskflow-app .list-group-item{border-color:var(--tf-line)!important;padding:11px 13px!important;background:#fff!important}

/* FullCalendar */
body.taskflow-app .fc{background:#fff;border:1px solid var(--tf-line);border-radius:14px;padding:14px;color:var(--tf-text-2)}
body.taskflow-app .fc .fc-toolbar-title{font-size:18px!important;color:var(--tf-text)!important;font-weight:800!important}
body.taskflow-app .fc .fc-button{background:#fff!important;border:1px solid var(--tf-line)!important;color:#556176!important;border-radius:8px!important;box-shadow:none!important;text-transform:none!important;font-size:12px!important}
body.taskflow-app .fc .fc-button-primary:not(:disabled).fc-button-active{background:var(--tf-primary)!important;color:#fff!important;border-color:var(--tf-primary)!important}
body.taskflow-app .fc-theme-standard td,body.taskflow-app .fc-theme-standard th{border-color:#edf0f6!important}
body.taskflow-app .fc .fc-daygrid-event{border:0!important;border-radius:6px!important;padding:2px 5px!important;font-size:10.5px!important}

/* Kanban / draggable layouts */
body.taskflow-app .kanban-board,body.taskflow-app .board,body.taskflow-app .kanban-container{gap:12px!important}
body.taskflow-app .kanban-column,body.taskflow-app .kanban-board .kanban-drag,body.taskflow-app .board-column{background:#f7f8fc!important;border:1px solid var(--tf-line)!important;border-radius:12px!important;padding:10px!important}
body.taskflow-app .kanban-item,body.taskflow-app .task-card,body.taskflow-app .project-card{border:1px solid var(--tf-line)!important;border-radius:11px!important;background:#fff!important;box-shadow:none!important}

/* Priority coloration: clear full-card tones without losing readable text */
body.taskflow-app .priority-critical,body.taskflow-app .priority-danger,body.taskflow-app [data-priority-tone="danger"]{background:linear-gradient(135deg,#fff5f5,#ffe9ea)!important;border-color:#ffb8bd!important}
body.taskflow-app .priority-urgent,body.taskflow-app .priority-warning,body.taskflow-app [data-priority-tone="warning"]{background:linear-gradient(135deg,#fffaf0,#fff0cf)!important;border-color:#ffd58a!important}
body.taskflow-app .priority-medium,body.taskflow-app .priority-success,body.taskflow-app [data-priority-tone="success"]{background:linear-gradient(135deg,#f2fcf5,#e5f8eb)!important;border-color:#b8e8c6!important}
body.taskflow-app .priority-low,body.taskflow-app .priority-info,body.taskflow-app [data-priority-tone="info"]{background:linear-gradient(135deg,#f3f7ff,#e9f0ff)!important;border-color:#bed0ff!important}

/* ========================= Dashboard reference UI ========================= */
body.taskflow-app .ref-dashboard{max-width:1500px!important;padding:24px 28px 34px!important}
body.taskflow-app .ref-dashboard-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px}
body.taskflow-app .ref-dashboard-welcome{display:flex;align-items:center;gap:12px}
body.taskflow-app .ref-user-avatar-wrap{position:relative}
body.taskflow-app .ref-user-avatar{width:48px;height:48px;border-radius:50%;object-fit:cover}
body.taskflow-app .ref-online-dot{position:absolute;width:11px;height:11px;border-radius:50%;background:#12b76a;border:2px solid #fff;inset-inline-end:0;bottom:1px}
body.taskflow-app .ref-dashboard-welcome h1{font-size:24px!important;margin:0 0 2px!important}
body.taskflow-app .ref-dashboard-welcome p{margin:0;color:var(--tf-muted);font-size:12.5px}
body.taskflow-app .ref-search-button{width:42px;height:42px;border:1px solid var(--tf-line);background:#fff;border-radius:10px;display:grid;place-items:center;font-size:19px;color:#59657a}
body.taskflow-app .ref-stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:0 0 24px}
body.taskflow-app .ref-stat-card{min-height:118px;border:1px solid var(--tf-line);background:#fff;border-radius:15px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:18px 20px;text-decoration:none!important;box-shadow:var(--tf-shadow-xs);position:relative}
body.taskflow-app .ref-stat-icon{position:absolute;top:16px;inset-inline-end:16px;width:34px;height:34px;border-radius:9px;display:grid;place-items:center;font-size:19px}
body.taskflow-app .ref-stat-card strong{font-size:28px;line-height:1;color:var(--tf-text);font-weight:800;margin-top:12px}
body.taskflow-app .ref-stat-card>span:last-child{font-size:12px;color:var(--tf-muted);margin-top:7px}
body.taskflow-app .ref-stat-purple .ref-stat-icon{background:#f0efff;color:var(--tf-primary)}
body.taskflow-app .ref-stat-green .ref-stat-icon{background:var(--tf-success-soft);color:var(--tf-success)}
body.taskflow-app .ref-stat-orange .ref-stat-icon{background:var(--tf-warning-soft);color:var(--tf-warning)}
body.taskflow-app .ref-stat-red .ref-stat-icon{background:var(--tf-danger-soft);color:var(--tf-danger)}
body.taskflow-app .ref-section{margin-top:8px}
body.taskflow-app .ref-section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:12px;margin-bottom:14px}
body.taskflow-app .ref-section-kicker{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#9ca4b6;font-weight:800}
body.taskflow-app .ref-section-heading h2{font-size:22px!important;margin:4px 0 0!important}
body.taskflow-app .ref-section-actions{display:flex;align-items:center;gap:8px}
body.taskflow-app .ref-add-task,body.taskflow-app .ref-filter-button{height:40px;border-radius:10px;padding:0 13px;display:flex;align-items:center;gap:7px;text-decoration:none!important;font-size:12px;font-weight:700}
body.taskflow-app .ref-add-task{background:linear-gradient(135deg,var(--tf-primary),var(--tf-primary-2));color:#fff!important}
body.taskflow-app .ref-filter-button{background:#fff;border:1px solid var(--tf-line);color:#506078!important}
body.taskflow-app .ref-task-list{display:flex;flex-direction:column;gap:10px}
body.taskflow-app .ref-task-card{position:relative;display:grid;grid-template-columns:146px 1fr;min-width:0;border-radius:13px!important;border:1px solid var(--tf-line)!important;overflow:hidden!important;box-shadow:var(--tf-shadow-xs);color:var(--tf-text-2)!important}
body.taskflow-app .ref-task-card.ref-priority-danger{background:linear-gradient(90deg,#fff5f5,#ffecec)!important;border-color:#ffbfc3!important}
body.taskflow-app .ref-task-card.ref-priority-warning{background:linear-gradient(90deg,#fffaf0,#fff1d6)!important;border-color:#ffd98d!important}
body.taskflow-app .ref-task-card.ref-priority-success{background:linear-gradient(90deg,#f2fbf5,#e6f8ec)!important;border-color:#bae8c7!important}
body.taskflow-app .ref-task-card.ref-priority-info{background:linear-gradient(90deg,#f3f7ff,#eaf1ff)!important;border-color:#c2d2ff!important}
body.taskflow-app .ref-priority-strip{position:absolute;inset-block:0;inset-inline-start:0;width:4px;background:currentColor}
body.taskflow-app .ref-priority-danger .ref-priority-strip{background:var(--tf-danger)}
body.taskflow-app .ref-priority-warning .ref-priority-strip{background:var(--tf-warning)}
body.taskflow-app .ref-priority-success .ref-priority-strip{background:var(--tf-success)}
body.taskflow-app .ref-priority-info .ref-priority-strip{background:var(--tf-info)}
body.taskflow-app .ref-task-countdown{padding:14px 12px 14px 16px;border-inline-end:1px solid rgba(148,163,184,.25);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;min-width:0}
body.taskflow-app .ref-priority-badge{max-width:100%;padding:4px 8px;border-radius:999px;background:rgba(17,24,39,.86);color:#fff;font-size:10px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.taskflow-app .ref-countdown-ring{width:74px;height:74px;border:2px solid rgba(15,23,42,.16);border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;text-align:center}
body.taskflow-app .ref-countdown-display{max-width:62px;display:flex;flex-direction:column;align-items:center;line-height:1.02;color:var(--tf-text);font-size:13px;overflow:hidden}
body.taskflow-app .ref-countdown-value{max-width:100%;font-size:15px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.taskflow-app .ref-countdown-unit{font-size:9px;font-weight:700;margin-top:2px;white-space:nowrap}
body.taskflow-app .ref-countdown-ring small{font-size:8px;color:#6b7280;margin-top:4px}
body.taskflow-app .ref-task-main{padding:14px 18px;min-width:0}
body.taskflow-app .ref-task-title-row{display:flex;justify-content:space-between;gap:10px;min-width:0}
body.taskflow-app .ref-task-title-row>div{min-width:0}
body.taskflow-app .ref-task-title{display:block;color:var(--tf-text)!important;font-size:14px;font-weight:800;text-decoration:none!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.taskflow-app .ref-task-title-row p{margin:3px 0 0;font-size:11.5px;color:#7d8698;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.taskflow-app .ref-task-more{font-size:19px;color:#657188!important}
body.taskflow-app .ref-task-meta-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px}
body.taskflow-app .ref-due-date{display:flex;align-items:center;gap:8px}.ref-due-date>i{font-size:19px}.ref-due-date>div{display:flex;flex-direction:column}.ref-due-date small{font-size:9px;color:#8b94a7}.ref-due-date span{font-size:11.5px;color:var(--tf-text);font-weight:700}

/* ========================= Task reference pages ========================= */
body.taskflow-app .task-ref-create,body.taskflow-app .task-ref-details-shell{border-color:var(--tf-line)!important;box-shadow:var(--tf-shadow)!important;background:#fff!important}
body.taskflow-app .task-ref-create-header,body.taskflow-app .task-ref-details-header{background:linear-gradient(90deg,#fbfcff 0%,#faf8ff 100%)!important;border-bottom:1px solid var(--tf-line)!important}
body.taskflow-app .task-ref-create-heading-copy h2,body.taskflow-app .task-ref-details-title-copy h1{color:var(--tf-text)!important;font-weight:800!important;letter-spacing:-.03em!important}
body.taskflow-app .task-ref-priority-card{border:1px solid!important;box-shadow:none!important}
body.taskflow-app .task-ref-priority-card.tone-danger,body.taskflow-app .task-ref-priority-card.tone-red{background:#fff3f4!important;color:#dc2626!important;border-color:#ff8d96!important}
body.taskflow-app .task-ref-priority-card.tone-warning,body.taskflow-app .task-ref-priority-card.tone-orange{background:#fff8eb!important;color:#d97706!important;border-color:#ffba52!important}
body.taskflow-app .task-ref-priority-card.tone-success,body.taskflow-app .task-ref-priority-card.tone-green{background:#eefaf2!important;color:#15803d!important;border-color:#87d89f!important}
body.taskflow-app .task-ref-priority-card.tone-primary,body.taskflow-app .task-ref-priority-card.tone-info,body.taskflow-app .task-ref-priority-card.tone-blue,body.taskflow-app .task-ref-priority-card.tone-secondary{background:#eff5ff!important;color:#1d4ed8!important;border-color:#80a9ff!important}
body.taskflow-app .task-ref-priority-card.is-active{box-shadow:var(--tf-focus)!important}
body.taskflow-app .task-ref-input-wrap,body.taskflow-app .task-ref-select-shell,body.taskflow-app .task-ref-date-input,body.taskflow-app .task-ref-editor,body.taskflow-app .task-ref-attachments-box,body.taskflow-app .task-ref-reference-link{border-color:var(--tf-line-strong)!important}

/* ========================= Work Groups ========================= */
body.taskflow-app .work-groups-page,body.taskflow-app .wg-page{max-width:1500px;margin-inline:auto}
body.taskflow-app .wg-card,body.taskflow-app .work-group-card{border:1px solid var(--tf-line)!important;border-radius:14px!important;background:#fff!important;box-shadow:var(--tf-shadow-xs)!important}
body.taskflow-app .wg-chat-panel,body.taskflow-app .work-group-chat{border:1px solid var(--tf-line)!important;border-radius:14px!important;background:#fff!important;overflow:hidden}

/* ========================= Auth screens ========================= */
body.taskflow-app[data-route="login"],body.taskflow-app[data-route="/"]{background:linear-gradient(135deg,#f7f9ff 0%,#fbfaff 45%,#f8f9fd 100%)!important}
body.taskflow-app .authentication-wrapper{min-height:100vh!important;padding:26px!important}
body.taskflow-app .authentication-inner{width:min(1080px,100%)!important;max-width:1080px!important;margin:auto!important}
body.taskflow-app .authentication-inner .card{border-radius:20px!important;box-shadow:0 24px 70px rgba(15,23,42,.1)!important}
body.taskflow-app .authentication-inner .card-body{padding:32px!important}
body.taskflow-app .app-brand{margin-bottom:24px!important}.app-brand-text{font-weight:800!important;color:var(--tf-text)!important}

/* ========================= Empty / loading / error states ========================= */
.taskflow-empty,.taskflow-loading,.taskflow-error{min-height:220px;border:1px dashed #d9deea;border-radius:14px;background:#fcfcff;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:28px;color:var(--tf-muted)}
.taskflow-empty i,.taskflow-error i{font-size:36px;color:#aab2c1;margin-bottom:8px}.taskflow-loading .spinner-border{color:var(--tf-primary)}

/* ========================= Floating chat / timer ========================= */
body.taskflow-app .timer-img,body.taskflow-app .chat-img,body.taskflow-app .embed-icon{width:44px!important;height:44px!important;object-fit:contain;bottom:18px!important;box-shadow:var(--tf-shadow-sm)!important;border:1px solid var(--tf-line)!important;background:#fff!important;padding:7px!important}
body.taskflow-app .timer-img{inset-inline-end:18px!important;right:auto!important}
body.taskflow-app .chat-img{inset-inline-end:70px!important;right:auto!important}
body.taskflow-app .embed-icon{inset-inline-end:122px!important;right:auto!important}
body.taskflow-app .chat-iframe-container{inset-inline-end:18px!important;right:auto!important;width:min(380px,calc(100vw - 24px))!important;border-radius:14px!important;overflow:hidden!important;box-shadow:var(--tf-shadow)!important}

/* ========================= RTL ========================= */
html[dir="rtl"] body.taskflow-app .layout-page{margin-inline-start:var(--tf-sidebar-w)!important}
html[dir="rtl"] .taskflow-sidebar{border-inline-end:1px solid var(--tf-line);border-inline-start:0}
html[dir="rtl"] body.taskflow-app .dropdown-menu-end{--bs-position:end}
html[dir="rtl"] body.taskflow-app .form-control,html[dir="rtl"] body.taskflow-app .form-select,html[dir="rtl"] body.taskflow-app .dropdown-item{text-align:right}
html[dir="rtl"] body.taskflow-app .table{text-align:right}
html[dir="rtl"] body.taskflow-app .bx-chevron-right{transform:rotate(180deg)}

/* ========================= Responsive ========================= */
@media(max-width:1199.98px){
  :root{--tf-sidebar-w:224px}
  body.taskflow-app .content-wrapper>.container-fluid,body.taskflow-app .content-wrapper>.container-xxl,body.taskflow-app .content-wrapper>.container,body.taskflow-app .container-p-y{padding-inline:20px!important}
  body.taskflow-app .tk-cbar{padding-inline:20px!important}
  body.taskflow-app .ref-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:991.98px){
  :root{--tf-sidebar-w:284px;--tf-header-h:64px}
  body.taskflow-app .layout-page{margin-inline-start:0!important;width:100%!important}
  .taskflow-sidebar-shell{width:var(--tf-sidebar-w)!important;transform:translateX(-100%)!important;visibility:hidden!important;transition:transform .2s ease!important}
  html[dir="rtl"] .taskflow-sidebar-shell{transform:translateX(100%)!important}
  .taskflow-sidebar-shell.show{transform:translateX(0)!important;visibility:visible!important}
  .taskflow-sidebar{width:100%;box-shadow:0 18px 60px rgba(15,23,42,.2)}
  body.taskflow-app .tk-cbar{padding-inline:14px!important}
  body.taskflow-app .tk-cbar-search{width:min(500px,60vw)!important}
  body.taskflow-app .content-wrapper>.container-fluid,body.taskflow-app .content-wrapper>.container-xxl,body.taskflow-app .content-wrapper>.container,body.taskflow-app .container-p-y{padding:18px 16px 26px!important}
  body.taskflow-app .modal-dialog{max-width:calc(100vw - 20px)!important;margin:10px auto!important}
  body.taskflow-app .offcanvas{border-radius:14px 0 0 14px!important}
  html[dir="rtl"] body.taskflow-app .offcanvas{border-radius:0 14px 14px 0!important}
  body.taskflow-app .ref-task-card{grid-template-columns:125px 1fr}
}
@media(max-width:767.98px){
  body.taskflow-app{font-size:13px!important}
  body.taskflow-app .tk-cbar-search{flex:1!important;width:auto!important;max-width:none!important}
  body.taskflow-app .tk-kbd{display:none}
  body.taskflow-app .tk-cbar-actions{gap:4px}
  body.taskflow-app .tk-cbar-divider{display:none}
  body.taskflow-app .tk-cbar-user{padding:3px!important}.nav-mobile-hidden{display:none!important}
  body.taskflow-app .ref-dashboard{padding:16px 12px 24px!important}
  body.taskflow-app .ref-dashboard-welcome h1{font-size:20px!important}
  body.taskflow-app .ref-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  body.taskflow-app .ref-stat-card{min-height:100px;padding:14px}.ref-stat-card strong{font-size:24px!important}
  body.taskflow-app .ref-section-heading{align-items:flex-start;flex-direction:column}
  body.taskflow-app .ref-task-card{grid-template-columns:1fr}
  body.taskflow-app .ref-task-countdown{border-inline-end:0;border-bottom:1px solid rgba(148,163,184,.22);flex-direction:row;justify-content:flex-start;padding:11px 14px}
  body.taskflow-app .ref-countdown-ring{width:auto;height:auto;border:0;border-radius:0;display:flex;flex-direction:row;gap:5px;text-align:start}
  body.taskflow-app .ref-countdown-display{display:inline-flex;flex-direction:row;gap:3px;max-width:150px}.ref-countdown-ring small{margin:0!important}
  body.taskflow-app .table-responsive{overflow-x:auto;-webkit-overflow-scrolling:touch}
  body.taskflow-app .table{min-width:760px}
  body.taskflow-app .modal-body,body.taskflow-app .offcanvas-body{padding:14px!important}
  body.taskflow-app .card-body{padding:14px!important}
  body.taskflow-app .fc{padding:8px}.fc .fc-toolbar{gap:8px;flex-wrap:wrap}.fc .fc-toolbar-chunk{display:flex;gap:4px;align-items:center}.fc .fc-toolbar-title{font-size:15px!important}
}
@media(max-width:575.98px){
  body.taskflow-app .content-wrapper>.container-fluid,body.taskflow-app .content-wrapper>.container-xxl,body.taskflow-app .content-wrapper>.container,body.taskflow-app .container-p-y{padding:14px 10px 22px!important}
  body.taskflow-app .tk-cbar{padding:10px!important;gap:7px!important}
  body.taskflow-app .tk-cbar-search{height:40px!important;padding-inline:10px!important}.tk-cbar-search-text{max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  body.taskflow-app .tk-icon-btn{width:38px!important;height:38px!important}
  body.taskflow-app .ref-stat-grid{grid-template-columns:1fr 1fr}
  body.taskflow-app .ref-stat-card{min-height:92px;padding:12px}.ref-stat-icon{width:30px!important;height:30px!important;top:11px!important;inset-inline-end:11px!important}.ref-stat-card strong{font-size:22px!important}
  body.taskflow-app .btn{min-height:38px!important}
  body.taskflow-app .form-control,body.taskflow-app .form-select{min-height:40px!important}
  body.taskflow-app .task-ref-split-row,body.taskflow-app .task-ref-form-grid{grid-template-columns:1fr!important}
}

/* Avoid UI leakage into print/PDF views */
@media print{
  body.taskflow-app{background:#fff!important}.taskflow-sidebar-shell,#section-not-to-print,.taskflow-create-task{display:none!important}.layout-page{margin:0!important;width:100%!important}.content-wrapper>.container-fluid{max-width:none!important;padding:0!important}
}

/* ========================= TaskFlow login ========================= */
.taskflow-auth-page{min-height:100vh;padding:24px;background:radial-gradient(circle at 18% 18%,rgba(91,92,246,.08),transparent 36%),radial-gradient(circle at 82% 26%,rgba(124,58,237,.07),transparent 32%),#f8f9fd;display:grid;place-items:center}
.taskflow-auth-shell{width:min(1180px,100%);min-height:min(760px,calc(100vh - 48px));display:grid;grid-template-columns:minmax(0,1.12fr) minmax(420px,.88fr);background:#fff;border:1px solid var(--tf-line);border-radius:24px;box-shadow:0 28px 90px rgba(15,23,42,.1);overflow:hidden}
.taskflow-auth-visual{position:relative;padding:34px 40px;display:flex;flex-direction:column;background:linear-gradient(145deg,#f8f9ff 0%,#f2f5ff 52%,#faf7ff 100%);overflow:hidden}
.taskflow-auth-visual:before,.taskflow-auth-visual:after{content:"";position:absolute;border-radius:50%;filter:blur(2px);pointer-events:none}.taskflow-auth-visual:before{width:460px;height:460px;background:rgba(91,92,246,.07);inset-inline-start:-180px;bottom:-210px}.taskflow-auth-visual:after{width:330px;height:330px;background:rgba(124,58,237,.06);inset-inline-end:-120px;top:70px}
.taskflow-auth-brand{position:relative;z-index:1;display:inline-flex;align-items:center;gap:12px;text-decoration:none!important;width:max-content}.taskflow-auth-brand-mark{width:40px;height:40px;border-radius:12px;background:#fff;border:1px solid #dfe3ff;display:grid;place-items:center;box-shadow:0 6px 18px rgba(91,92,246,.09)}.taskflow-auth-brand-mark img{width:28px;height:28px;object-fit:contain}.taskflow-auth-brand>span:last-child{font-size:21px;font-weight:800;color:var(--tf-text);letter-spacing:-.03em}
.taskflow-auth-message{position:relative;z-index:1;margin:auto 0;max-width:650px}.taskflow-auth-eyebrow{display:block;color:var(--tf-primary);font-size:11px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;margin-bottom:16px}.taskflow-auth-message h1{font-size:clamp(38px,4vw,58px)!important;line-height:1.05!important;max-width:620px;margin:0 0 18px!important;letter-spacing:-.055em!important}.taskflow-auth-message>p{font-size:16px;line-height:1.65;color:#65718a;max-width:580px;margin:0}
.taskflow-auth-features{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:36px}.taskflow-auth-features>div{display:flex;align-items:flex-start;gap:10px;min-width:0}.taskflow-auth-features i{width:38px;height:38px;border-radius:10px;background:#fff;border:1px solid var(--tf-line);color:var(--tf-primary);display:grid;place-items:center;font-size:19px;flex:none}.taskflow-auth-features span{display:flex;flex-direction:column;gap:3px}.taskflow-auth-features strong{font-size:12.5px;color:var(--tf-text)}.taskflow-auth-features small{font-size:10.5px;line-height:1.45;color:#7c8699}
.taskflow-auth-art{position:relative;z-index:1;display:flex;gap:10px;flex-wrap:wrap;padding-top:24px;border-top:1px solid rgba(216,222,238,.7)}.taskflow-auth-mini-stat{height:38px;border-radius:10px;background:rgba(255,255,255,.8);border:1px solid #e6e9f3;display:flex;align-items:center;gap:7px;padding:0 12px;color:#5a6680;font-size:11px;font-weight:700}.taskflow-auth-mini-stat i{font-size:17px;color:var(--tf-primary)}
.taskflow-auth-form-panel{display:grid;place-items:center;padding:38px;background:#fff}.taskflow-auth-form-card{width:min(430px,100%)}.taskflow-auth-form-head{text-align:center;margin-bottom:28px}.taskflow-auth-logo{height:54px;align-items:center;justify-content:center;margin-bottom:16px}.taskflow-auth-logo img{max-width:220px;max-height:52px;object-fit:contain}.taskflow-auth-form-head h2{font-size:27px!important;margin:0 0 5px!important}.taskflow-auth-form-head p{margin:0;color:var(--tf-muted);font-size:13px}.taskflow-auth-input{position:relative;display:flex;align-items:center;border:1px solid var(--tf-line-strong);border-radius:11px;background:#fff;transition:.16s ease}.taskflow-auth-input>i{position:absolute;inset-inline-start:13px;color:#7a8499;font-size:18px;z-index:2;pointer-events:none}.taskflow-auth-input>.form-control{border:0!important;box-shadow:none!important;padding-inline-start:42px!important;background:transparent!important;height:46px!important}.taskflow-auth-input>.input-group-text{border:0!important;background:transparent!important;padding-inline-end:12px!important}.taskflow-auth-input:focus-within{border-color:#7779ff;box-shadow:var(--tf-focus)}.taskflow-auth-link{font-size:11.5px;color:var(--tf-primary)!important;font-weight:650;text-decoration:none}.taskflow-auth-submit{height:46px!important;margin-top:4px;font-size:13.5px!important}.taskflow-auth-signup{text-align:center;margin-top:18px!important;font-size:12px;color:#7d8699}.taskflow-auth-signup a{color:var(--tf-primary)!important;font-weight:700;text-decoration:none}.taskflow-demo-logins{display:grid;grid-template-columns:1fr;gap:8px;margin-top:16px;padding-top:16px;border-top:1px solid var(--tf-line)}.taskflow-auth-mobile-brand{text-align:center;margin-bottom:20px}.taskflow-auth-mobile-brand img{max-width:210px;max-height:54px;object-fit:contain}.taskflow-auth-captcha{overflow:auto;padding-bottom:2px}
@media(max-width:991.98px){.taskflow-auth-page{padding:16px}.taskflow-auth-shell{grid-template-columns:1fr;min-height:auto;max-width:620px}.taskflow-auth-visual{display:none}.taskflow-auth-form-panel{padding:34px 28px}.taskflow-auth-mobile-brand{display:block!important}}
@media(max-width:575.98px){.taskflow-auth-page{padding:0;background:#fff}.taskflow-auth-shell{min-height:100vh;border:0;border-radius:0;box-shadow:none}.taskflow-auth-form-panel{padding:28px 18px}.taskflow-auth-form-head h2{font-size:24px!important}}

/* ========================= Shared TaskFlow Blade components ========================= */
.taskflow-page-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin:0 0 18px}.taskflow-page-title-wrap{display:flex;align-items:flex-start;gap:12px;min-width:0}.taskflow-page-icon{width:46px;height:46px;border-radius:12px;background:var(--tf-primary-soft);border:1px solid #dfe1ff;color:var(--tf-primary);display:grid;place-items:center;font-size:23px;flex:none}.taskflow-page-title{font-size:26px!important;line-height:1.1;margin:0!important}.taskflow-page-subtitle{font-size:12.5px;color:var(--tf-muted);margin:5px 0 0}.taskflow-page-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.taskflow-stat-card{min-height:105px;border:1px solid var(--tf-line);border-radius:14px;background:#fff;box-shadow:var(--tf-shadow-xs);display:flex;align-items:center;gap:13px;padding:15px 17px;text-decoration:none!important}.taskflow-stat-icon{width:42px;height:42px;border-radius:11px;display:grid;place-items:center;font-size:21px;flex:none}.taskflow-stat-copy{display:flex;flex-direction:column;min-width:0}.taskflow-stat-copy strong{font-size:24px;line-height:1;color:var(--tf-text);font-weight:800}.taskflow-stat-copy>span{font-size:11.5px;color:#667085;margin-top:6px}.taskflow-stat-copy small{font-size:9.5px;color:#98a0b0;margin-top:2px}.taskflow-stat-card.tone-primary .taskflow-stat-icon{background:var(--tf-primary-soft);color:var(--tf-primary)}.taskflow-stat-card.tone-success .taskflow-stat-icon{background:var(--tf-success-soft);color:var(--tf-success)}.taskflow-stat-card.tone-warning .taskflow-stat-icon{background:var(--tf-warning-soft);color:var(--tf-warning)}.taskflow-stat-card.tone-danger .taskflow-stat-icon{background:var(--tf-danger-soft);color:var(--tf-danger)}.taskflow-stat-card.tone-info .taskflow-stat-icon{background:var(--tf-info-soft);color:var(--tf-info)}
.taskflow-status-badge,.taskflow-priority-badge{display:inline-flex;align-items:center;gap:5px;max-width:100%;min-height:24px;border-radius:999px;padding:4px 8px;font-size:10px;font-weight:800;line-height:1;border:1px solid transparent;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.taskflow-status-badge.tone-success,.taskflow-priority-badge.tone-success{background:#e9f8ee;color:#15803d;border-color:#ccefd7}.taskflow-status-badge.tone-danger,.taskflow-priority-badge.tone-danger{background:#fff0f1;color:#dc2626;border-color:#ffd0d3}.taskflow-status-badge.tone-warning,.taskflow-priority-badge.tone-warning{background:#fff7e7;color:#c76d00;border-color:#ffe1aa}.taskflow-status-badge.tone-info,.taskflow-priority-badge.tone-info,.taskflow-status-badge.tone-primary,.taskflow-priority-badge.tone-primary{background:#eef4ff;color:#1d4ed8;border-color:#d3e0ff}.taskflow-status-badge.tone-secondary,.taskflow-priority-badge.tone-secondary{background:#f1f3f6;color:#667085;border-color:#e3e7ee}
.taskflow-progress-wrap{display:flex;align-items:center;gap:8px;min-width:0}.taskflow-progress{height:7px;border-radius:999px;background:#edf0f5;overflow:hidden;flex:1;min-width:50px}.taskflow-progress>span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--tf-primary-2),var(--tf-primary));transition:width .2s ease}.taskflow-progress-wrap>strong{font-size:10px;color:#667085;min-width:28px;text-align:end}
.taskflow-search-input{height:42px;border:1px solid var(--tf-line-strong);background:#fff;border-radius:10px;display:flex;align-items:center;gap:8px;padding:0 11px;color:#7a8499;min-width:0}.taskflow-search-input:focus-within{border-color:#7b7dff;box-shadow:var(--tf-focus)}.taskflow-search-input i{font-size:18px;flex:none}.taskflow-search-input input{border:0;outline:0;background:transparent;width:100%;min-width:0;color:var(--tf-text-2);font-size:12.5px}.taskflow-search-input input::placeholder{color:#a2a9b8}
.taskflow-empty strong{font-size:14px;color:#4d596f;margin-bottom:3px}.taskflow-empty span{font-size:11.5px;max-width:420px}
@media(max-width:767.98px){.taskflow-page-header{flex-direction:column}.taskflow-page-actions{width:100%;justify-content:flex-start}.taskflow-page-title{font-size:22px!important}.taskflow-page-icon{width:42px;height:42px;font-size:21px}.taskflow-stat-card{min-height:92px;padding:12px}.taskflow-stat-copy strong{font-size:21px}}

/* Full-width priority colors for real task tables (Bootstrap Table row classes). */
body.taskflow-app #task_table tbody tr.task-row-priority-danger>td{background:#fff1f2!important;border-color:#ffd1d5!important}
body.taskflow-app #task_table tbody tr.task-row-priority-warning>td{background:#fff8e8!important;border-color:#ffe0a8!important}
body.taskflow-app #task_table tbody tr.task-row-priority-success>td{background:#eefaf2!important;border-color:#d2f0dc!important}
body.taskflow-app #task_table tbody tr.task-row-priority-info>td{background:#eff5ff!important;border-color:#d6e3ff!important}
body.taskflow-app #task_table tbody tr.task-row-priority-neutral>td{background:#fff!important}
body.taskflow-app #task_table tbody tr.task-row-priority-danger:hover>td{background:#ffe7e9!important}
body.taskflow-app #task_table tbody tr.task-row-priority-warning:hover>td{background:#fff1d1!important}
body.taskflow-app #task_table tbody tr.task-row-priority-success:hover>td{background:#e5f7eb!important}
body.taskflow-app #task_table tbody tr.task-row-priority-info:hover>td{background:#e7efff!important}

/* ========================= Dashboard vNext ========================= */
.taskflow-dashboard-page{max-width:1500px!important}.taskflow-dashboard-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:18px}.taskflow-dashboard-kicker{font-size:10px;text-transform:uppercase;letter-spacing:.1em;color:#9ca4b6;font-weight:800}.taskflow-dashboard-hero h1{font-size:27px!important;margin:4px 0 2px!important}.taskflow-dashboard-hero p{font-size:12.5px;color:var(--tf-muted);margin:0}.taskflow-dashboard-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:14px}.taskflow-dashboard-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(310px,.8fr);gap:14px}.taskflow-dashboard-recent{grid-column:1}.taskflow-dashboard-progress{grid-column:2}.taskflow-dashboard-quick{grid-column:1}.taskflow-dashboard-groups{grid-column:2}.taskflow-dashboard-deadlines{grid-column:1}.taskflow-dashboard-activity{grid-column:2}.taskflow-card-head{min-height:58px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;border-bottom:1px solid var(--tf-line)}.taskflow-card-head h2{font-size:15px!important;margin:0!important}.taskflow-card-head p{font-size:10.5px;color:var(--tf-muted);margin:2px 0 0}.taskflow-text-link{font-size:11px;font-weight:700;color:var(--tf-primary)!important;text-decoration:none!important;display:inline-flex;align-items:center;gap:4px;white-space:nowrap}.taskflow-recent-list{display:flex;flex-direction:column}.taskflow-recent-task{min-height:62px;display:grid;grid-template-columns:26px minmax(0,1fr) auto 94px 92px;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid rgba(226,230,239,.9);text-decoration:none!important;transition:.14s ease}.taskflow-recent-task:last-child{border-bottom:0}.taskflow-recent-task:hover{filter:brightness(.99);transform:none}.taskflow-recent-task.tone-danger{background:#fff4f5}.taskflow-recent-task.tone-warning{background:#fffaf0}.taskflow-recent-task.tone-success{background:#f2fbf5}.taskflow-recent-task.tone-info{background:#f3f7ff}.taskflow-recent-check{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;color:#8190a7;font-size:18px}.taskflow-recent-copy{min-width:0;display:flex;flex-direction:column}.taskflow-recent-copy strong{font-size:12.5px;color:var(--tf-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.taskflow-recent-copy small{font-size:10px;color:var(--tf-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.taskflow-recent-date{font-size:10.5px;color:#64748b;white-space:nowrap}.taskflow-recent-avatars,.taskflow-group-avatars{display:flex;align-items:center;justify-content:flex-end}.taskflow-recent-avatars img,.taskflow-group-avatars img{width:27px;height:27px;border-radius:50%;object-fit:cover;border:2px solid #fff;margin-inline-start:-7px}.taskflow-recent-avatars img:first-child,.taskflow-group-avatars img:first-child{margin-inline-start:0}.taskflow-recent-avatars em{width:27px;height:27px;border-radius:50%;background:#f0f2f6;border:2px solid #fff;margin-inline-start:-7px;display:grid;place-items:center;font-size:9px;font-style:normal;color:#667085}.taskflow-progress-chart-wrap{display:grid;grid-template-columns:148px 1fr;align-items:center;gap:16px;padding:20px 18px 22px}.taskflow-donut{width:142px;aspect-ratio:1;border-radius:50%;background:conic-gradient(var(--tf-success) 0 var(--tf-chart-a),var(--tf-info) var(--tf-chart-a) var(--tf-chart-b),#d7dce8 var(--tf-chart-b) 100%);position:relative;display:grid;place-items:center}.taskflow-donut:after{content:"";position:absolute;width:94px;height:94px;background:#fff;border-radius:50%}.taskflow-donut>div{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center}.taskflow-donut strong{font-size:25px;color:var(--tf-text);line-height:1}.taskflow-donut span{font-size:9.5px;color:var(--tf-muted);margin-top:4px}.taskflow-chart-legend{display:flex;flex-direction:column;gap:10px}.taskflow-chart-legend>div{display:grid;grid-template-columns:10px 1fr 26px 34px;gap:7px;align-items:center;font-size:10.5px}.taskflow-chart-legend .dot{width:8px;height:8px;border-radius:50%}.taskflow-chart-legend .success{background:var(--tf-success)}.taskflow-chart-legend .progress{background:var(--tf-info)}.taskflow-chart-legend .pending{background:#cfd5e1}.taskflow-chart-legend .overdue{background:var(--tf-danger)}.taskflow-chart-legend strong{font-size:10.5px;color:var(--tf-text)}.taskflow-chart-legend em{font-size:9.5px;color:var(--tf-muted);font-style:normal;text-align:end}.taskflow-quick-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;padding:14px}.taskflow-quick-action{min-height:88px;border:1px solid var(--tf-line);background:#fbfcff;border-radius:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-decoration:none!important;color:#4f5b73!important;font-size:11px;font-weight:700}.taskflow-quick-action:hover{background:#f6f7ff;color:var(--tf-primary)!important;border-color:#d9dcff}.taskflow-quick-action i{width:34px;height:34px;border-radius:10px;background:var(--tf-primary-soft);color:var(--tf-primary);display:grid;place-items:center;font-size:19px}.taskflow-group-list,.taskflow-deadline-list,.taskflow-activity-list{display:flex;flex-direction:column}.taskflow-group-row,.taskflow-deadline-row{min-height:66px;display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--tf-line);text-decoration:none!important}.taskflow-group-row:last-child,.taskflow-deadline-row:last-child{border-bottom:0}.taskflow-group-row:hover,.taskflow-deadline-row:hover{background:#fafbff}.taskflow-group-icon{width:34px;height:34px;border-radius:10px;background:var(--tf-primary-soft);color:var(--tf-primary);display:grid;place-items:center;font-size:18px;flex:none}.taskflow-group-copy,.taskflow-deadline-copy{min-width:0;display:flex;flex:1;flex-direction:column}.taskflow-group-copy strong,.taskflow-deadline-copy strong{font-size:11.5px;color:var(--tf-text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.taskflow-group-copy small,.taskflow-deadline-copy small{font-size:9.5px;color:var(--tf-muted);margin-top:2px}.taskflow-deadline-row time{width:42px;height:44px;border-radius:9px;background:#f7f8fc;border:1px solid var(--tf-line);display:flex;flex-direction:column;align-items:center;justify-content:center;flex:none}.taskflow-deadline-row time span{font-size:8px;color:var(--tf-danger);font-weight:800}.taskflow-deadline-row time strong{font-size:15px;color:var(--tf-text);line-height:1.05}.taskflow-activity-row{min-height:62px;display:grid;grid-template-columns:32px minmax(0,1fr) auto;gap:9px;align-items:center;padding:10px 14px;border-bottom:1px solid var(--tf-line)}.taskflow-activity-row:last-child{border-bottom:0}.taskflow-activity-icon{width:30px;height:30px;border-radius:9px;background:#f2f4f8;color:#768197;display:grid;place-items:center;font-size:16px}.taskflow-activity-row>span:nth-child(2){min-width:0;display:flex;flex-direction:column}.taskflow-activity-row>span:nth-child(2) strong{font-size:11.5px;color:var(--tf-text)}.taskflow-activity-row>span:nth-child(2) small{font-size:9.5px;color:var(--tf-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.taskflow-activity-row time{font-size:9px;color:#98a0b0;white-space:nowrap}.taskflow-empty-compact{min-height:150px!important;border:0!important;border-radius:0!important;background:#fff!important}
@media(max-width:1199.98px){.taskflow-dashboard-grid{grid-template-columns:1fr 1fr}.taskflow-dashboard-recent,.taskflow-dashboard-quick,.taskflow-dashboard-deadlines{grid-column:1}.taskflow-dashboard-progress,.taskflow-dashboard-groups,.taskflow-dashboard-activity{grid-column:2}.taskflow-recent-task{grid-template-columns:24px minmax(0,1fr) auto 80px}.taskflow-recent-avatars{display:none}.taskflow-progress-chart-wrap{grid-template-columns:118px 1fr}.taskflow-donut{width:116px}.taskflow-donut:after{width:76px;height:76px}}
@media(max-width:991.98px){.taskflow-dashboard-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.taskflow-dashboard-grid{grid-template-columns:1fr}.taskflow-dashboard-recent,.taskflow-dashboard-progress,.taskflow-dashboard-quick,.taskflow-dashboard-groups,.taskflow-dashboard-deadlines,.taskflow-dashboard-activity{grid-column:1}}
@media(max-width:767.98px){.taskflow-dashboard-hero{align-items:flex-start;flex-direction:column}.taskflow-dashboard-stats{gap:10px}.taskflow-quick-actions{grid-template-columns:repeat(2,minmax(0,1fr))}.taskflow-recent-task{grid-template-columns:24px minmax(0,1fr) auto}.taskflow-recent-date{display:none}.taskflow-progress-chart-wrap{grid-template-columns:110px 1fr;padding:14px}.taskflow-donut{width:106px}.taskflow-donut:after{width:70px;height:70px}.taskflow-donut strong{font-size:20px}}
@media(max-width:520px){.taskflow-dashboard-stats{grid-template-columns:1fr 1fr}.taskflow-stat-card{min-height:86px}.taskflow-stat-icon{width:36px;height:36px}.taskflow-stat-copy strong{font-size:20px}.taskflow-progress-chart-wrap{grid-template-columns:1fr}.taskflow-donut{margin:auto}.taskflow-recent-task{padding-inline:10px;gap:7px}.taskflow-priority-badge{max-width:88px}}

/* ============================================================================
   TASKFLOW FULL-SYSTEM HARMONIZATION — 2026-09-08
   The declarations below intentionally target legacy Bootstrap/Taskify markup so
   every existing route inherits the same official Design Specification without
   rewriting controllers, data sources or permissions.
   ============================================================================ */

/* ---------- Page header / breadcrumb compatibility ---------- */
body.taskflow-app .taskflow-page-container{min-width:0}
body.taskflow-app .taskflow-page-toolbar{
  min-height:64px;margin:4px 0 16px!important;padding:0!important;display:flex!important;
  align-items:center!important;justify-content:space-between!important;gap:12px!important;
}
body.taskflow-app .taskflow-page-toolbar>.d-flex{gap:8px!important}
body.taskflow-app .taskflow-breadcrumb{display:flex;align-items:center;gap:4px;flex-wrap:wrap}
body.taskflow-app .taskflow-breadcrumb .breadcrumb-item{font-size:11px!important;font-weight:600;color:#8b95a8!important}
body.taskflow-app .taskflow-breadcrumb .breadcrumb-item.active{font-size:22px!important;font-weight:800!important;line-height:1.15;color:var(--tf-text)!important;letter-spacing:-.035em}
body.taskflow-app .taskflow-breadcrumb .breadcrumb-item.active:before{display:none!important}
body.taskflow-app .taskflow-breadcrumb .breadcrumb-item:not(.active){align-self:center}
body.taskflow-app .taskflow-page-toolbar .badge{align-self:center}
body.taskflow-app .taskflow-page-toolbar .btn-group,body.taskflow-app .taskflow-page-toolbar .seg{flex:none}

/* ---------- Generic surfaces / cards ---------- */
body.taskflow-app .taskflow-ui-card{overflow:visible}
body.taskflow-app .taskflow-data-card{box-shadow:none!important}
body.taskflow-app .taskflow-data-card>.card-body:has(+ .card-datatable),
body.taskflow-app .taskflow-data-card>.card-header+ .card-datatable{border-top:0}
body.taskflow-app .card-title{font-size:15px!important;line-height:1.3!important;font-weight:800!important;color:var(--tf-text)!important}
body.taskflow-app .card-subtitle{font-size:11.5px!important;color:var(--tf-muted)!important}
body.taskflow-app .card .border,body.taskflow-app .card [class*="border-"]{border-color:var(--tf-line)!important}
body.taskflow-app .rounded{border-radius:var(--tf-radius-sm)!important}
body.taskflow-app hr{border-color:var(--tf-line)!important;opacity:1}

/* ---------- Forms / editors / filter bars ---------- */
body.taskflow-app .taskflow-filter-panel,
body.taskflow-app .tk-filter-row{
  background:#fff;border:1px solid var(--tf-line);border-radius:12px;padding:12px!important;
  box-shadow:var(--tf-shadow-xs);align-items:end!important
}
body.taskflow-app .taskflow-form-card .card-body{padding:18px!important}
body.taskflow-app .taskflow-field{max-width:100%}
body.taskflow-app .taskflow-textarea{line-height:1.55!important}
body.taskflow-app .tox.tox-tinymce{border:1px solid var(--tf-line-strong)!important;border-radius:11px!important;overflow:hidden!important;box-shadow:none!important}
body.taskflow-app .tox .tox-editor-header{box-shadow:none!important;border-bottom:1px solid var(--tf-line)!important;background:#fbfcff!important}
body.taskflow-app .tox .tox-toolbar__primary{background:#fbfcff!important}
body.taskflow-app .tagify{min-height:42px;border:1px solid var(--tf-line-strong)!important;border-radius:10px!important;background:#fff!important}
body.taskflow-app .daterangepicker{border:1px solid var(--tf-line)!important;border-radius:12px!important;box-shadow:var(--tf-shadow)!important}
body.taskflow-app .daterangepicker td.active,body.taskflow-app .daterangepicker td.active:hover{background:var(--tf-primary)!important}
body.taskflow-app .iti{width:100%}

/* ---------- Table toolbar / bootstrap-table ---------- */
body.taskflow-app .taskflow-table-toolbar{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
body.taskflow-app .fixed-table-toolbar .search{margin:0!important;min-width:min(320px,100%)}
body.taskflow-app .taskflow-table-search,
body.taskflow-app .fixed-table-toolbar .search input{
  height:40px!important;min-height:40px!important;border:1px solid var(--tf-line-strong)!important;
  border-radius:10px!important;padding:8px 12px 8px 38px!important;background:#fff!important;font-size:12.5px!important;
}
[dir="rtl"] body.taskflow-app .taskflow-table-search,[dir="rtl"] body.taskflow-app .fixed-table-toolbar .search input{padding:8px 38px 8px 12px!important}
body.taskflow-app .fixed-table-toolbar .columns-right{margin-top:0!important}
body.taskflow-app .fixed-table-toolbar .btn-group>.btn{min-width:38px!important;padding-inline:9px!important}
body.taskflow-app .bootstrap-table .fixed-table-body{border-radius:0 0 12px 12px}
body.taskflow-app .bootstrap-table .table td,body.taskflow-app .bootstrap-table .table th{max-width:340px}
body.taskflow-app .bootstrap-table .table td{overflow-wrap:anywhere}
body.taskflow-app .taskflow-table-loading{background:rgba(255,255,255,.94)!important;color:var(--tf-muted)!important;border:0!important}
body.taskflow-app .taskflow-table-empty td{padding:40px 16px!important;color:var(--tf-muted)!important;text-align:center!important}

/* ---------- Data chips / avatars / media ---------- */
body.taskflow-app .avatar img,body.taskflow-app img.rounded-circle{object-fit:cover}
body.taskflow-app .avatar-xs{width:28px!important;height:28px!important}.avatar-sm{width:32px!important;height:32px!important}
body.taskflow-app .avatar{flex:none}
body.taskflow-app .avatar-group .avatar{margin-inline-start:-8px!important;border:2px solid #fff;border-radius:50%}
body.taskflow-app .avatar-group .avatar:first-child{margin-inline-start:0!important}
body.taskflow-app .progress{height:7px!important;border-radius:999px!important;background:#edf0f6!important;overflow:hidden!important}
body.taskflow-app .progress-bar{border-radius:999px!important;background:linear-gradient(90deg,var(--tf-primary),var(--tf-primary-2))!important}

/* ---------- Modal / offcanvas sizing from official spec ---------- */
body.taskflow-app .modal-sm{max-width:min(420px,calc(100vw - 24px))!important}
body.taskflow-app .modal-lg{max-width:min(760px,calc(100vw - 28px))!important}
body.taskflow-app .modal-xl{max-width:min(960px,calc(100vw - 28px))!important}
body.taskflow-app .offcanvas.offcanvas-end,body.taskflow-app .offcanvas.offcanvas-start{width:min(660px,92vw)!important}
body.taskflow-app .offcanvas.task-create-offcanvas,body.taskflow-app #create_task_offcanvas{width:min(980px,96vw)!important}
body.taskflow-app .modal-content form>.modal-body:last-child{padding-bottom:18px!important}

/* ---------- Settings / administration pages ---------- */
body.taskflow-app[data-taskflow-module="settings"] .content-wrapper .nav-pills,
body.taskflow-app.taskflow-module-settings .content-wrapper .nav-pills{
  background:#fff;border:1px solid var(--tf-line);border-radius:12px;padding:6px!important;box-shadow:var(--tf-shadow-xs)
}
body.taskflow-app.taskflow-module-settings .content-wrapper .nav-pills .nav-link{justify-content:flex-start;min-height:38px}
body.taskflow-app.taskflow-module-settings .content-wrapper .card{margin-bottom:14px!important}
body.taskflow-app.taskflow-module-settings .content-wrapper .card-header{min-height:54px;display:flex;align-items:center}
body.taskflow-app.taskflow-module-settings .content-wrapper .card-header h5,
body.taskflow-app.taskflow-module-settings .content-wrapper .card-header h6{margin:0!important}

/* ---------- Projects ---------- */
body.taskflow-app.taskflow-module-projects .project-card,
body.taskflow-app.taskflow-module-projects .tk-project-card{min-height:100%;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}
body.taskflow-app.taskflow-module-projects .project-card:hover,
body.taskflow-app.taskflow-module-projects .tk-project-card:hover{transform:translateY(-2px);border-color:#d8dcff!important;box-shadow:var(--tf-shadow-sm)!important}
body.taskflow-app.taskflow-module-projects .project-card .progress{margin-top:8px}
body.taskflow-app.taskflow-module-projects .tk-proj-head{background:#fff;border:1px solid var(--tf-line);border-radius:15px;padding:18px!important;box-shadow:var(--tf-shadow-xs)}
body.taskflow-app.taskflow-module-projects .tk-proj-title{font-size:25px!important;margin:3px 0!important}
body.taskflow-app.taskflow-module-projects .tk-proj-meta{display:flex;gap:12px;flex-wrap:wrap;color:var(--tf-muted);font-size:11.5px}
body.taskflow-app.taskflow-module-projects .gantt-container,body.taskflow-app.taskflow-module-projects .gantt-chart{background:#fff;border:1px solid var(--tf-line);border-radius:14px;padding:12px;overflow:auto}
body.taskflow-app.taskflow-module-projects .mind-map-container,body.taskflow-app.taskflow-module-projects #mind-map{background:#fff!important;border:1px solid var(--tf-line)!important;border-radius:14px!important;overflow:hidden}

/* ---------- Tasks / Kanban ---------- */
body.taskflow-app.taskflow-module-tasks .task-card,
body.taskflow-app.taskflow-module-tasks .kanban-item{overflow:hidden;transition:transform .14s ease,box-shadow .14s ease}
body.taskflow-app.taskflow-module-tasks .task-card:hover,
body.taskflow-app.taskflow-module-tasks .kanban-item:hover{transform:translateY(-1px);box-shadow:var(--tf-shadow-sm)!important}
body.taskflow-app.taskflow-module-tasks .kanban-board,body.taskflow-app.taskflow-module-tasks .board{min-width:0}
body.taskflow-app.taskflow-module-tasks .kanban-column{min-width:260px;max-width:330px}

/* ---------- CRM / Leads ---------- */
body.taskflow-app.taskflow-module-crm .lead-card,
body.taskflow-app.taskflow-module-crm .kanban-item{border:1px solid var(--tf-line)!important;border-radius:11px!important;background:#fff!important;box-shadow:none!important}
body.taskflow-app.taskflow-module-crm .kanban-board .kanban-drag{background:#f8f9fc!important}
body.taskflow-app.taskflow-module-crm .lead-stage,body.taskflow-app.taskflow-module-crm .lead-source{border-radius:999px!important;font-size:10.5px!important}
body.taskflow-app.taskflow-module-crm iframe{border:1px solid var(--tf-line);border-radius:12px;background:#fff}

/* ---------- Finance ---------- */
body.taskflow-app.taskflow-module-finance .content-wrapper .card .display-6,
body.taskflow-app.taskflow-module-finance .content-wrapper .card h2{font-variant-numeric:tabular-nums}
body.taskflow-app.taskflow-module-finance .invoice-preview-card,
body.taskflow-app.taskflow-module-finance .estimate-preview-card{background:#fff;border:1px solid var(--tf-line);border-radius:14px;box-shadow:var(--tf-shadow-xs)}
body.taskflow-app.taskflow-module-finance .table td,body.taskflow-app.taskflow-module-finance .table th{font-variant-numeric:tabular-nums}

/* ---------- HRMS ---------- */
body.taskflow-app.taskflow-module-hrms .candidate-card,
body.taskflow-app.taskflow-module-hrms .payslip-card{border:1px solid var(--tf-line)!important;border-radius:13px!important;background:#fff!important}
body.taskflow-app.taskflow-module-hrms .timeline,body.taskflow-app.taskflow-module-hrms .interview-timeline{border-color:var(--tf-line)!important}
body.taskflow-app.taskflow-module-hrms .leave-status{border-radius:999px}

/* ---------- Reports / charts ---------- */
body.taskflow-app.taskflow-module-reports .apexcharts-canvas,
body.taskflow-app.taskflow-module-reports .chart-container{max-width:100%!important}
body.taskflow-app.taskflow-module-reports .card:has(.apexcharts-canvas){overflow:hidden}
body.taskflow-app.taskflow-module-reports .apexcharts-tooltip{border:1px solid var(--tf-line)!important;border-radius:9px!important;box-shadow:var(--tf-shadow-sm)!important}
body.taskflow-app.taskflow-module-reports .apexcharts-legend-text{color:var(--tf-text-2)!important;font-family:var(--tf-font)!important}

/* ---------- Calendar / Meetings / Todos / Time ---------- */
body.taskflow-app.taskflow-module-calendar #color-legend,
body.taskflow-app.taskflow-module-calendars #color-legend{background:#fff;border:1px solid var(--tf-line);border-radius:11px;padding:10px 12px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
body.taskflow-app #color-legend .legend-container{display:flex;gap:10px;flex-wrap:wrap}
body.taskflow-app #color-legend .legend-item{display:flex;align-items:center;gap:5px;font-size:10.5px;color:var(--tf-muted)}
body.taskflow-app #color-legend .legend-box{width:9px;height:9px;border-radius:3px}
body.taskflow-app.taskflow-module-meetings .meeting-card,body.taskflow-app.taskflow-module-todos .todo-card{border:1px solid var(--tf-line);border-radius:12px;background:#fff}

/* ---------- Files / notes / activity / notifications ---------- */
body.taskflow-app.taskflow-module-files .fm-container{border:1px solid var(--tf-line);border-radius:12px;overflow:hidden;background:#fff}
body.taskflow-app.taskflow-module-files #fm{min-height:520px!important;height:min(70vh,760px)!important}
body.taskflow-app.taskflow-module-notes .note-card{border:1px solid var(--tf-line)!important;border-radius:13px!important;box-shadow:none!important}
body.taskflow-app.taskflow-module-notifications .notification-item,
body.taskflow-app.taskflow-module-activity .activity-item{border-bottom:1px solid var(--tf-line);padding:12px 14px}
body.taskflow-app.taskflow-module-notifications .notification-item:last-child,body.taskflow-app.taskflow-module-activity .activity-item:last-child{border-bottom:0}

/* ---------- Users / Clients / Workspaces / Roles ---------- */
body.taskflow-app.taskflow-module-users .user-card,body.taskflow-app.taskflow-module-clients .client-card,
body.taskflow-app.taskflow-module-workspaces .workspace-card{border:1px solid var(--tf-line)!important;border-radius:13px!important;background:#fff!important}
body.taskflow-app.taskflow-module-profile .profile-header-card{border:1px solid var(--tf-line);border-radius:14px;background:#fff}

/* ---------- System / migration / plugin pages ---------- */
body.taskflow-app.taskflow-module-system code,body.taskflow-app.taskflow-module-settings code{border-radius:6px;background:#f5f6fa;color:#475569;padding:2px 5px;font-size:11px}
body.taskflow-app.taskflow-module-system pre,body.taskflow-app.taskflow-module-settings pre{border:1px solid var(--tf-line);border-radius:11px;background:#0f172a;color:#e2e8f0;padding:14px;overflow:auto}

/* ---------- Toasts / popovers / tooltips ---------- */
body.taskflow-app #toast-container>div{border-radius:11px!important;box-shadow:var(--tf-shadow)!important;opacity:1!important;font-size:12px!important}
body.taskflow-app .popover{border:1px solid var(--tf-line)!important;border-radius:11px!important;box-shadow:var(--tf-shadow-sm)!important}
body.taskflow-app .tooltip-inner{border-radius:7px!important;font-size:10.5px!important;padding:5px 8px!important}

/* ---------- Authentication family: login, signup, reset, forgot ---------- */
body.taskflow-app .authentication-wrapper.authentication-basic{background:linear-gradient(135deg,#f7f9ff,#fbfaff)!important}
body.taskflow-app .authentication-wrapper .authentication-inner:not(.taskflow-auth-shell){max-width:520px!important}
body.taskflow-app .authentication-wrapper .authentication-inner .app-brand-logo img{max-width:210px!important;width:auto!important;max-height:54px!important;object-fit:contain}
body.taskflow-app .signup-form{max-width:620px!important}

/* ---------- Dark mode safety ---------- */
html[data-theme="dark"] body.taskflow-app{
  --tf-bg:#0f1420;--tf-surface:#171d2a;--tf-surface-2:#1b2230;--tf-text:#f4f6fb;--tf-text-2:#d4dae6;
  --tf-muted:#98a3b7;--tf-line:#2a3343;--tf-line-strong:#364154;--tf-primary-soft:#25274a;
  background:var(--tf-bg)!important;color:var(--tf-text-2)!important
}
html[data-theme="dark"] body.taskflow-app .taskflow-sidebar,
html[data-theme="dark"] body.taskflow-app .tk-cbar,
html[data-theme="dark"] body.taskflow-app .card,
html[data-theme="dark"] body.taskflow-app .modal-content,
html[data-theme="dark"] body.taskflow-app .offcanvas,
html[data-theme="dark"] body.taskflow-app .dropdown-menu,
html[data-theme="dark"] body.taskflow-app .form-control,
html[data-theme="dark"] body.taskflow-app .form-select,
html[data-theme="dark"] body.taskflow-app .ts-control,
html[data-theme="dark"] body.taskflow-app .select2-selection{background:var(--tf-surface)!important;color:var(--tf-text-2)!important;border-color:var(--tf-line)!important}
html[data-theme="dark"] body.taskflow-app .table thead th{background:#1b2230!important;color:#a9b3c5!important}
html[data-theme="dark"] body.taskflow-app .table tbody tr,html[data-theme="dark"] body.taskflow-app .table-responsive{background:var(--tf-surface)!important}
html[data-theme="dark"] body.taskflow-app .table tbody tr:hover{background:#1c2433!important}

/* ---------- Numeric / content overflow safety everywhere ---------- */
body.taskflow-app .card,body.taskflow-app .modal-content,body.taskflow-app .offcanvas,body.taskflow-app td,body.taskflow-app th,
body.taskflow-app .dropdown-item,body.taskflow-app .list-group-item,body.taskflow-app .task-card,body.taskflow-app .project-card{min-width:0}
body.taskflow-app .card-body,body.taskflow-app td,body.taskflow-app .taskflow-recent-copy,body.taskflow-app .taskflow-group-copy{overflow-wrap:anywhere}
body.taskflow-app [data-count],body.taskflow-app .stat-value,body.taskflow-app .count,body.taskflow-app .percentage,body.taskflow-app .progress-value{font-variant-numeric:tabular-nums;max-width:100%}
body.taskflow-app .text-truncate{min-width:0}

/* ---------- Responsive completion ---------- */
@media(max-width:991.98px){
  body.taskflow-app .taskflow-page-toolbar{min-height:auto;align-items:flex-start!important;flex-direction:column!important}
  body.taskflow-app .taskflow-page-toolbar>div:last-child{width:100%;justify-content:flex-start!important}
  body.taskflow-app .taskflow-filter-panel{overflow-x:auto;flex-wrap:nowrap!important}
  body.taskflow-app .taskflow-filter-panel>[class*="col-"]{min-width:200px;flex:0 0 auto}
  body.taskflow-app .modal-lg,body.taskflow-app .modal-xl{max-width:calc(100vw - 20px)!important}
}
@media(max-width:767.98px){
  body.taskflow-app .taskflow-breadcrumb .breadcrumb-item:not(.active){display:none}
  body.taskflow-app .taskflow-breadcrumb .breadcrumb-item.active{font-size:20px!important}
  body.taskflow-app .taskflow-page-toolbar{margin-top:0!important;margin-bottom:12px!important}
  body.taskflow-app .card-header{padding:13px 14px!important}.card-body{padding:14px!important}.card-footer{padding:11px 14px!important}
  body.taskflow-app .table>:not(caption)>*>*{padding:10px 10px!important;font-size:11.5px!important}
  body.taskflow-app .bootstrap-table .fixed-table-container{min-width:720px}
  body.taskflow-app .bootstrap-table{overflow-x:auto;overscroll-behavior-inline:contain}
  body.taskflow-app .offcanvas.offcanvas-end,body.taskflow-app .offcanvas.offcanvas-start{width:100vw!important;max-width:100vw!important;border-radius:0!important}
  body.taskflow-app #create_task_offcanvas{width:100vw!important;max-width:100vw!important}
  body.taskflow-app .modal-dialog{margin:10px auto!important;max-width:calc(100vw - 20px)!important}
  body.taskflow-app .modal-content{max-height:calc(100vh - 20px);overflow:auto}
  body.taskflow-app .fc{padding:8px}.fc .fc-toolbar{gap:8px;align-items:flex-start}.fc .fc-toolbar-chunk{display:flex;gap:4px;flex-wrap:wrap}
  body.taskflow-app .fc .fc-toolbar-title{font-size:15px!important}
  body.taskflow-app .fc .fc-button{padding:5px 7px!important;font-size:10px!important}
  body.taskflow-app.taskflow-module-files #fm{min-height:440px!important;height:62vh!important}
}
@media(max-width:575.98px){
  body.taskflow-app .taskflow-page-container{padding-inline:12px!important}
  body.taskflow-app .btn{min-height:38px;font-size:12px!important;padding-inline:11px!important}
  body.taskflow-app .form-control,body.taskflow-app .form-select,body.taskflow-app .select2-selection,body.taskflow-app .ts-control{min-height:40px!important;font-size:12px!important}
  body.taskflow-app .taskflow-filter-panel{padding:9px!important}
  body.taskflow-app .taskflow-filter-panel>[class*="col-"]{min-width:170px}
  body.taskflow-app .nav-tabs{overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}.nav-tabs::-webkit-scrollbar{display:none}.nav-tabs .nav-link{white-space:nowrap}
  body.taskflow-app .dropdown-menu{max-width:calc(100vw - 24px)}
}

/* ---------- RTL completion ---------- */
html[dir="rtl"] body.taskflow-app .taskflow-page-toolbar,html[dir="rtl"] body.taskflow-app .card-header,html[dir="rtl"] body.taskflow-app .modal-header{text-align:right}
html[dir="rtl"] body.taskflow-app .fixed-table-toolbar .search input{direction:rtl}
html[dir="rtl"] body.taskflow-app .dropdown-menu{direction:rtl}
html[dir="rtl"] body.taskflow-app .fc{direction:rtl}
html[dir="rtl"] body.taskflow-app .bx-left-arrow-alt,html[dir="rtl"] body.taskflow-app .bx-chevron-left{transform:rotate(180deg)}
html[dir="rtl"] body.taskflow-app .bx-right-arrow-alt,html[dir="rtl"] body.taskflow-app .bx-chevron-right{transform:rotate(180deg)}
body.taskflow-app .wg-page-head{margin-bottom:12px}
body.taskflow-app .wg-filterbar{box-shadow:none!important}.wg-filterbar .card-body{padding:9px 10px!important}.wg-filterbar .wg-search{width:min(300px,100%)}.wg-filterbar .wg-sort{width:150px!important;min-height:38px!important}.wg-filterbar .wg-scope-tabs{border:0!important;background:transparent!important;padding:0!important;box-shadow:none!important}.wg-filterbar .wg-scope-tabs .nav-link{min-height:36px;display:flex;align-items:center}
@media(max-width:767.98px){body.taskflow-app .wg-filterbar .card-body{align-items:stretch!important}.wg-filterbar .wg-scope-tabs{width:100%;overflow-x:auto;flex-wrap:nowrap}.wg-filterbar .wg-search,.wg-filterbar .wg-sort,.wg-filterbar .btn{width:100%!important}}
body.taskflow-app .wg-load-previous{display:flex;align-items:center;justify-content:center;gap:6px;margin:8px auto 12px;padding:7px 12px;border:1px solid var(--tf-line);border-radius:9px;background:#fff;color:#667085;font-size:10.5px;font-weight:700;cursor:pointer}body.taskflow-app .wg-load-previous:hover{background:#f7f8fc;color:var(--tf-primary)}body.taskflow-app .wg-load-previous:disabled{opacity:.6;cursor:wait}

/* ============================================================================
   TASKFLOW MODULE COMPLETION — 2026-09-08
   Specialized visual adapters for every legacy module family. These selectors
   intentionally target existing markup and do not change CRUD/API behavior.
   ============================================================================ */

/* Work groups / collaboration */
body.taskflow-app.taskflow-module-groups .wg-shell{background:transparent!important;gap:14px!important}
body.taskflow-app.taskflow-module-groups .wg-sidebar,
body.taskflow-app.taskflow-module-groups .wg-main,
body.taskflow-app.taskflow-module-groups .wg-card{border-color:var(--tf-line)!important;box-shadow:var(--tf-shadow-xs)!important}
body.taskflow-app.taskflow-module-groups .wg-group-card{border-radius:11px!important;transition:.16s ease}
body.taskflow-app.taskflow-module-groups .wg-group-card:hover{transform:translateY(-1px);background:#fafbff!important}
body.taskflow-app.taskflow-module-groups .wg-group-card.active{background:var(--tf-primary-soft)!important;border-color:#d8dcff!important}
body.taskflow-app.taskflow-module-groups .wg-messages{background:linear-gradient(180deg,#fcfdff,#f8f9fc)!important;border-radius:11px!important}
body.taskflow-app.taskflow-module-groups .wg-message{max-width:min(78%,680px)}
body.taskflow-app.taskflow-module-groups .wg-compose{background:#fff!important;border-top:1px solid var(--tf-line)!important}
body.taskflow-app.taskflow-module-groups .wg-compose textarea,
body.taskflow-app.taskflow-module-groups .wg-task-select{border-color:var(--tf-line-strong)!important;border-radius:10px!important}

/* Email center + templates */
body.taskflow-app.taskflow-module-email .tab-content>.card,
body.taskflow-app.taskflow-module-email .tab-pane.card{border:1px solid var(--tf-line)!important;border-radius:14px!important;background:#fff!important;box-shadow:var(--tf-shadow-xs)!important;padding:18px!important}
body.taskflow-app.taskflow-module-email .nav.nav-tabs.nav-fill{background:#fff;border:1px solid var(--tf-line)!important;border-radius:12px;padding:5px;gap:4px}
body.taskflow-app.taskflow-module-email .nav.nav-tabs.nav-fill .nav-link{border:0!important;border-radius:9px!important;padding:9px 12px!important}
body.taskflow-app.taskflow-module-email .nav.nav-tabs.nav-fill .nav-link.active{background:var(--tf-primary-soft)!important;color:var(--tf-indigo)!important;border:0!important}
body.taskflow-app.taskflow-module-email .email-history-card,
body.taskflow-app.taskflow-module-email .email-template-card{border:1px solid var(--tf-line)!important;border-radius:12px!important;background:#fff!important}

/* Todos */
body.taskflow-app.taskflow-module-todos .todo-progress{background:#fff!important;border:1px solid var(--tf-line)!important;border-radius:13px!important;padding:14px 16px!important;margin-bottom:14px!important}
body.taskflow-app.taskflow-module-todos .todo-card{border:1px solid var(--tf-line)!important;border-radius:13px!important;box-shadow:var(--tf-shadow-xs)!important;overflow:hidden!important}
body.taskflow-app.taskflow-module-todos .todo-card-header{padding:14px 16px!important;border-bottom:1px solid var(--tf-line)!important;background:#fbfcff!important}
body.taskflow-app.taskflow-module-todos .todo-card-body{padding:12px 14px!important}
body.taskflow-app.taskflow-module-todos .todo-item{min-height:42px;border-bottom:1px solid #eff1f6;padding:8px 4px}
body.taskflow-app.taskflow-module-todos .todo-item:last-child{border-bottom:0}

/* Time tracker / timesheets */
body.taskflow-app.taskflow-module-time .timesheet-card,
body.taskflow-app.taskflow-module-time .time-entry-card{border:1px solid var(--tf-line)!important;border-radius:13px!important;background:#fff!important;box-shadow:var(--tf-shadow-xs)!important}
body.taskflow-app.taskflow-module-time .timer-display,
body.taskflow-app.taskflow-module-time .elapsed-time{font-variant-numeric:tabular-nums;font-weight:750;color:var(--tf-text)!important}

/* Roles / permissions */
body.taskflow-app.taskflow-module-roles .card{overflow:hidden}
body.taskflow-app.taskflow-module-roles .card-header{background:#fbfcff!important}
body.taskflow-app.taskflow-module-roles .form-check{min-height:36px;display:flex;align-items:center;gap:8px}
body.taskflow-app.taskflow-module-roles .permission-group,
body.taskflow-app.taskflow-module-roles [class*="permission"] .card{border-color:var(--tf-line)!important}

/* Workspaces, users and clients */
body.taskflow-app.taskflow-module-users .tk-filter-row,
body.taskflow-app.taskflow-module-clients .tk-filter-row,
body.taskflow-app.taskflow-module-workspaces .tk-filter-row{background:#fff;border:1px solid var(--tf-line);border-radius:12px;padding:12px!important;margin:0 0 12px!important}
body.taskflow-app.taskflow-module-users .table-responsive,
body.taskflow-app.taskflow-module-clients .table-responsive,
body.taskflow-app.taskflow-module-workspaces .table-responsive{box-shadow:var(--tf-shadow-xs)}
body.taskflow-app.taskflow-module-users .user-profile-card,
body.taskflow-app.taskflow-module-clients .client-profile-card{border:1px solid var(--tf-line)!important;border-radius:14px!important;background:#fff!important}
body.taskflow-app.taskflow-module-users .profile-header img,
body.taskflow-app.taskflow-module-clients .profile-header img{width:76px!important;height:76px!important;object-fit:cover;border-radius:50%!important}

/* CRM details, lead forms, source/stage administration */
body.taskflow-app.taskflow-module-crm .lead-profile-card,
body.taskflow-app.taskflow-module-crm .lead-detail-card{border:1px solid var(--tf-line)!important;border-radius:14px!important;background:#fff!important;box-shadow:var(--tf-shadow-xs)!important}
body.taskflow-app.taskflow-module-crm .card-datatable{overflow:hidden}
body.taskflow-app.taskflow-module-crm .form-submit-event .row{row-gap:4px}
body.taskflow-app.taskflow-module-crm .kanban-board{overflow-x:auto;padding-bottom:8px;scrollbar-width:thin}
body.taskflow-app.taskflow-module-crm .kanban-board .kanban-drag{min-width:280px}

/* Finance: invoices, contracts, payments, expenses, catalog */
body.taskflow-app.taskflow-module-finance .form-submit-event>.row,
body.taskflow-app.taskflow-module-finance form>.row{row-gap:5px}
body.taskflow-app.taskflow-module-finance .invoice-preview-card,
body.taskflow-app.taskflow-module-finance .estimate-preview-card,
body.taskflow-app.taskflow-module-finance .invoice-preview,
body.taskflow-app.taskflow-module-finance .estimate-preview{overflow:hidden}
body.taskflow-app.taskflow-module-finance .summary-card,
body.taskflow-app.taskflow-module-finance .stats-card{border:1px solid var(--tf-line)!important;border-radius:13px!important;background:#fff!important}
body.taskflow-app.taskflow-module-finance input[type="number"]{font-variant-numeric:tabular-nums}
body.taskflow-app.taskflow-module-finance .table tfoot td{font-weight:750;background:#fafbfe!important}

/* HRMS */
body.taskflow-app.taskflow-module-hrms .tk-card,
body.taskflow-app.taskflow-module-hrms .leave-balance-card{border:1px solid var(--tf-line)!important;border-radius:14px!important;background:#fff!important;box-shadow:var(--tf-shadow-xs)!important}
body.taskflow-app.taskflow-module-hrms .candidate-card:hover{border-color:#d9ddff!important;box-shadow:var(--tf-shadow-sm)!important}
body.taskflow-app.taskflow-module-hrms .interview-card,
body.taskflow-app.taskflow-module-hrms .candidate-status-card{border-radius:12px!important;box-shadow:none!important}
body.taskflow-app.taskflow-module-hrms .tk-metric-strip{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px!important}
body.taskflow-app.taskflow-module-hrms .tk-metric{border:1px solid var(--tf-line);border-radius:11px;padding:10px 12px;background:#fbfcff}
body.taskflow-app.taskflow-module-hrms .payslip-card table td,
body.taskflow-app.taskflow-module-hrms .payslip-card table th{font-variant-numeric:tabular-nums}

/* Reports */
body.taskflow-app.taskflow-module-reports .report-filters,
body.taskflow-app.taskflow-module-reports .tk-filter-row{background:#fff;border:1px solid var(--tf-line);border-radius:12px;padding:12px!important;margin-bottom:14px!important}
body.taskflow-app.taskflow-module-reports .summary-card,
body.taskflow-app.taskflow-module-reports [class*="summary"]>.card{border:1px solid var(--tf-line)!important;border-radius:13px!important}
body.taskflow-app.taskflow-module-reports .apexcharts-canvas svg{max-width:100%!important}

/* Calendar */
body.taskflow-app.taskflow-module-calendar .fc,
body.taskflow-app.taskflow-module-meetings .fc,
body.taskflow-app.taskflow-module-activity .fc{background:#fff;border:1px solid var(--tf-line);border-radius:14px;padding:14px;box-shadow:var(--tf-shadow-xs)}
body.taskflow-app .fc .fc-scrollgrid{border-color:var(--tf-line)!important;border-radius:10px;overflow:hidden}
body.taskflow-app .fc-theme-standard td,body.taskflow-app .fc-theme-standard th{border-color:#edf0f5!important}
body.taskflow-app .fc .fc-daygrid-day-number{color:#475569;font-size:11px;text-decoration:none}
body.taskflow-app .fc .fc-event{border:0!important;border-radius:6px!important;padding:2px 5px!important;font-size:10px!important}

/* Meetings */
body.taskflow-app.taskflow-module-meetings .filter-section{background:#fff!important;border:1px solid var(--tf-line)!important;border-radius:12px!important;padding:12px!important;margin-bottom:14px!important}
body.taskflow-app.taskflow-module-meetings .meeting-card{transition:transform .15s ease,box-shadow .15s ease}
body.taskflow-app.taskflow-module-meetings .meeting-card:hover{transform:translateY(-1px);box-shadow:var(--tf-shadow-sm)!important}

/* File manager */
body.taskflow-app.taskflow-module-files .fm-container{box-shadow:var(--tf-shadow-xs)}
body.taskflow-app.taskflow-module-files #fm{background:#fff!important}

/* Notes */
body.taskflow-app.taskflow-module-notes .tk-note-card,
body.taskflow-app.taskflow-module-notes .tcard{border:1px solid var(--tf-line)!important;border-radius:13px!important;background:#fff!important;box-shadow:var(--tf-shadow-xs)!important;transition:.15s ease}
body.taskflow-app.taskflow-module-notes .tk-note-card:hover,
body.taskflow-app.taskflow-module-notes .tcard:hover{transform:translateY(-1px);box-shadow:var(--tf-shadow-sm)!important}

/* Notifications + activity */
body.taskflow-app.taskflow-module-notifications .card,
body.taskflow-app.taskflow-module-activity .card{overflow:hidden}
body.taskflow-app.taskflow-module-notifications .notification-item.unread{background:#f6f7ff!important}
body.taskflow-app.taskflow-module-notifications .notification-item:hover,
body.taskflow-app.taskflow-module-activity .activity-item:hover{background:#fafbff!important}

/* System/settings admin utilities */
body.taskflow-app.taskflow-module-settings .alert,
body.taskflow-app.taskflow-module-system .alert{border-radius:11px!important;border-width:1px!important}
body.taskflow-app.taskflow-module-settings .accordion-item,
body.taskflow-app.taskflow-module-system .accordion-item{border:1px solid var(--tf-line)!important;border-radius:11px!important;overflow:hidden;margin-bottom:8px;background:#fff!important}
body.taskflow-app.taskflow-module-settings .accordion-button,
body.taskflow-app.taskflow-module-system .accordion-button{background:#fff!important;color:var(--tf-text)!important;box-shadow:none!important;font-size:12.5px;font-weight:700}
body.taskflow-app.taskflow-module-settings .accordion-button:not(.collapsed){background:#f8f9ff!important;color:var(--tf-primary)!important}

/* Common legacy breadcrumb/toolbar normalization */
body.taskflow-app .content-wrapper .container-fluid>.d-flex.justify-content-between.mt-4,
body.taskflow-app .content-wrapper .container-fluid>.d-flex.justify-content-between.mb-2.mt-4,
body.taskflow-app .content-wrapper .container-fluid>.d-flex.justify-content-between.align-items-center.mb-4.mt-4,
body.taskflow-app .content-wrapper .container-fluid>.d-flex.flex-column.flex-md-row.justify-content-between{min-height:48px;margin-top:0!important;margin-bottom:14px!important;align-items:center!important;gap:10px!important}
body.taskflow-app .breadcrumb-style1{background:transparent!important;padding:0!important;margin:0!important}
body.taskflow-app .breadcrumb-style1 .breadcrumb-item.active{font-size:22px!important;font-weight:800!important;color:var(--tf-text)!important;letter-spacing:-.025em}
body.taskflow-app .breadcrumb-style1 .breadcrumb-item:not(.active){font-size:11px!important;color:#98a1b4!important}

/* Authentication pages other than the bespoke Login screen */
body.taskflow-app.taskflow-module-auth .authentication-wrapper{min-height:calc(100vh - 24px)!important;padding:24px!important;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 20% 10%,#eef3ff 0,transparent 32%),radial-gradient(circle at 90% 90%,#f7efff 0,transparent 30%),#f8f9fc!important}
body.taskflow-app.taskflow-module-auth .authentication-inner{width:min(540px,100%)!important;margin:auto!important}
body.taskflow-app.taskflow-module-auth .authentication-inner.signup-form{width:min(760px,100%)!important;max-width:760px!important}
body.taskflow-app.taskflow-module-auth .authentication-inner>.card{border:1px solid var(--tf-line)!important;border-radius:18px!important;box-shadow:0 22px 60px rgba(15,23,42,.09)!important}
body.taskflow-app.taskflow-module-auth .authentication-inner>.card .card-body{padding:28px!important}
body.taskflow-app.taskflow-module-auth .app-brand{margin-bottom:22px!important}
body.taskflow-app.taskflow-module-auth .app-brand-logo img{width:auto!important;max-width:200px!important;max-height:48px!important}

/* Error / unauthorized */
body.taskflow-app.taskflow-module-auth .misc-wrapper,
body.taskflow-app.taskflow-module-errors .misc-wrapper{max-width:720px;margin:0 auto;text-align:center;padding:28px}
body.taskflow-app.taskflow-module-auth .misc-wrapper img,
body.taskflow-app.taskflow-module-errors .misc-wrapper img{max-width:min(420px,80vw)!important}

/* More compact, consistent desktop density like the reference specification */
@media(min-width:1200px){
  body.taskflow-app .content-wrapper>.container-fluid,
  body.taskflow-app .content-wrapper>.container-xxl,
  body.taskflow-app .content-wrapper>.container{padding-top:20px!important;padding-bottom:26px!important}
  body.taskflow-app .card-body{padding:16px!important}
  body.taskflow-app .card-header{padding:14px 16px!important}
}

@media(max-width:991.98px){
  body.taskflow-app.taskflow-module-groups .wg-shell{grid-template-columns:1fr!important}
  body.taskflow-app.taskflow-module-groups .wg-sidebar{max-height:none!important}
  body.taskflow-app.taskflow-module-groups .wg-group-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  body.taskflow-app.taskflow-module-groups .wg-grid{grid-template-columns:1fr!important}
}
@media(max-width:575.98px){
  body.taskflow-app.taskflow-module-groups .wg-group-list{grid-template-columns:1fr}
  body.taskflow-app.taskflow-module-groups .wg-message{max-width:92%}
  body.taskflow-app.taskflow-module-auth .authentication-wrapper{padding:12px!important}
  body.taskflow-app.taskflow-module-auth .authentication-inner>.card .card-body{padding:20px!important}
  body.taskflow-app .breadcrumb-style1 .breadcrumb-item.active{font-size:19px!important}
}

/* Floating runtime tools: icon-only, no fragile storage image dependencies. */
body.taskflow-app .taskflow-floating-chat,body.taskflow-app .taskflow-floating-timer{position:fixed;z-index:1032;inset-block-end:22px}
body.taskflow-app .taskflow-floating-chat{inset-inline-end:22px}
body.taskflow-app .taskflow-floating-timer{inset-inline-end:72px}
body.taskflow-app .taskflow-floating-btn{width:42px;height:42px;border-radius:12px;border:1px solid var(--tf-line);background:#fff;color:var(--tf-primary);box-shadow:var(--tf-shadow-sm);display:grid;place-items:center;font-size:21px;cursor:pointer;transition:.15s ease}
body.taskflow-app .taskflow-floating-btn:hover{transform:translateY(-1px);background:var(--tf-primary);color:#fff;border-color:var(--tf-primary)}
@media(max-width:767.98px){body.taskflow-app .taskflow-floating-chat{inset-inline-end:14px;inset-block-end:14px}body.taskflow-app .taskflow-floating-timer{inset-inline-end:62px;inset-block-end:14px}}

/* Missing documentation/media assets from legacy packages must never render as
   broken-image glyphs. Avatar failures are replaced by JS with a bundled avatar;
   non-critical guide illustrations collapse cleanly without affecting forms. */
body.taskflow-app img.taskflow-image-unavailable{display:none!important}

/* ============================================================================
   TASKFLOW RESPONSIVE CLOSURE V6 — 2026-09-08
   Final layer: neutralizes legacy v2-shell offsets, fixes task-row contrast,
   and makes every major shell/table/filter adapt cleanly from phones to 4K.
   ============================================================================ */

/* The legacy v2-shell used a rail + panel and left behind a second page offset.
   The unified TaskFlow sidebar already owns the only horizontal offset. */
body.v2-shell.taskflow-app,
body.v2-shell.taskflow-app .layout-wrapper,
body.v2-shell.taskflow-app .layout-container{
  background:var(--tf-bg)!important;
}
body.v2-shell.taskflow-app .layout-page{
  padding-inline:0!important;
  padding-left:0!important;
  padding-right:0!important;
  border-radius:0!important;
  overflow:visible!important;
  min-width:0!important;
}
body.v2-shell.taskflow-app .content-wrapper{
  background:var(--tf-bg)!important;
  min-width:0!important;
}
body.taskflow-app .content-wrapper>.container-fluid,
body.taskflow-app .content-wrapper>.container-xxl,
body.taskflow-app .content-wrapper>.container,
body.taskflow-app .container-p-y{
  max-width:1680px!important;
  padding-inline:clamp(16px,2vw,30px)!important;
}

/* Keep the header aligned with the page instead of with legacy rail geometry. */
body.v2-shell.taskflow-app .tk-cbar{
  margin:0!important;
  border-radius:0!important;
}

/* Priority rows are intentionally pale in the new UI. Override legacy rules
   that still forced white text/icons for the old solid priority backgrounds. */
body.v2-shell.taskflow-app #task_table tbody tr[class*="task-row-priority-"]>td,
body.v2-shell.taskflow-app #task_table tbody tr[class*="task-row-priority-"]>td a,
body.v2-shell.taskflow-app #task_table tbody tr[class*="task-row-priority-"]>td i{
  color:var(--tf-text-2)!important;
}
body.v2-shell.taskflow-app #task_table tbody tr[class*="task-row-priority-"]>td{
  border-color:var(--tf-line)!important;
}
body.v2-shell.taskflow-app #task_table tbody tr[class*="task-row-priority-"] .text-danger,
body.v2-shell.taskflow-app #task_table tbody tr[class*="task-row-priority-"] .text-danger i{color:var(--tf-danger)!important}
body.v2-shell.taskflow-app #task_table tbody tr[class*="task-row-priority-"] .text-success,
body.v2-shell.taskflow-app #task_table tbody tr[class*="task-row-priority-"] .text-success i{color:var(--tf-success)!important}
body.v2-shell.taskflow-app #task_table tbody tr[class*="task-row-priority-"] .text-warning,
body.v2-shell.taskflow-app #task_table tbody tr[class*="task-row-priority-"] .text-warning i{color:#b76b00!important}
body.v2-shell.taskflow-app #task_table tbody tr[class*="task-row-priority-"] .text-primary,
body.v2-shell.taskflow-app #task_table tbody tr[class*="task-row-priority-"] .text-primary i{color:var(--tf-primary)!important}
body.v2-shell.taskflow-app #task_table tbody tr[class*="task-row-priority-"] .badge,
body.v2-shell.taskflow-app #task_table tbody tr[class*="task-row-priority-"] .taskflow-status-badge,
body.v2-shell.taskflow-app #task_table tbody tr[class*="task-row-priority-"] .taskflow-priority-badge{
  color:inherit;
}

/* Generic content containment: no card, form or toolbar may force page overflow. */
body.taskflow-app .row>*{min-width:0}
body.taskflow-app .card,
body.taskflow-app .card-body,
body.taskflow-app .card-header,
body.taskflow-app .card-footer,
body.taskflow-app .fixed-table-container,
body.taskflow-app .fixed-table-toolbar,
body.taskflow-app .ts-wrapper,
body.taskflow-app .ts-control,
body.taskflow-app .form-control,
body.taskflow-app .form-select{max-width:100%}
body.taskflow-app .fixed-table-toolbar{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
body.taskflow-app .fixed-table-toolbar .search{margin-inline-start:auto!important}
body.taskflow-app .fixed-table-toolbar .columns-right{margin-inline-start:0!important}

/* Tablet filter grid: two useful columns instead of tiny 4-up fields. */
@media (min-width:768px) and (max-width:1199.98px){
  body.taskflow-app .tk-filter-row>[class*="col-"]{
    flex:0 0 50%!important;
    max-width:50%!important;
    width:50%!important;
  }
}

/* Sidebar gets slightly narrower on medium desktop screens. */
@media (min-width:992px) and (max-width:1199.98px){
  :root{--tf-sidebar-w:224px}
  .taskflow-sidebar-shell,.taskflow-sidebar{width:var(--tf-sidebar-w)!important}
  body.taskflow-app .layout-page{margin-inline-start:var(--tf-sidebar-w)!important;width:calc(100% - var(--tf-sidebar-w))!important}
  body.taskflow-app .tk-cbar{padding-inline:20px!important}
  body.taskflow-app .content-wrapper>.container-fluid,
  body.taskflow-app .content-wrapper>.container-xxl,
  body.taskflow-app .content-wrapper>.container,
  body.taskflow-app .container-p-y{padding-inline:20px!important}
}

/* Bootstrap's large-screen offcanvas sidebar becomes a true drawer on tablet/phone. */
@media (max-width:991.98px){
  body.taskflow-app .layout-page,
  body.v2-shell.taskflow-app .layout-page{
    margin-inline-start:0!important;
    width:100%!important;
    padding-inline:0!important;
  }
  .taskflow-sidebar-shell{
    width:min(300px,88vw)!important;
    transform:translateX(-105%)!important;
    visibility:hidden!important;
  }
  [dir="rtl"] .taskflow-sidebar-shell{transform:translateX(105%)!important}
  .taskflow-sidebar-shell.show,
  .taskflow-sidebar-shell.showing{
    transform:translateX(0)!important;
    visibility:visible!important;
  }
  .taskflow-sidebar{width:100%!important}
  body.taskflow-app .tk-cbar{
    padding-inline:16px!important;
    gap:10px!important;
  }
  body.taskflow-app .tk-cbar-search{width:min(420px,50vw)!important}
  body.taskflow-app .content-wrapper>.container-fluid,
  body.taskflow-app .content-wrapper>.container-xxl,
  body.taskflow-app .content-wrapper>.container,
  body.taskflow-app .container-p-y{
    padding:18px 16px 28px!important;
  }
  body.taskflow-app .taskflow-page-toolbar>div:last-child{
    display:flex!important;
    flex-wrap:wrap!important;
    gap:8px!important;
  }
  /* undo legacy horizontal filter scrollers */
  body.taskflow-app .taskflow-filter-panel,
  body.taskflow-app .tk-filter-row{
    overflow:visible!important;
    flex-wrap:wrap!important;
  }
  body.taskflow-app .taskflow-filter-panel>[class*="col-"],
  body.taskflow-app .tk-filter-row>[class*="col-"]{
    min-width:0!important;
  }
}

/* Phone table mode: JS switches Bootstrap Table to cardView. These styles make
   the generated cards touch-friendly and remove the old 720px minimum width. */
@media (max-width:767.98px){
  body.taskflow-app .tk-filter-row>[class*="col-"],
  body.taskflow-app .taskflow-filter-panel>[class*="col-"]{
    flex:0 0 100%!important;
    max-width:100%!important;
    width:100%!important;
    min-width:0!important;
  }
  body.taskflow-app .bootstrap-table,
  body.taskflow-app .bootstrap-table .fixed-table-container,
  body.taskflow-app .bootstrap-table .fixed-table-body{
    min-width:0!important;
    width:100%!important;
    overflow:visible!important;
  }
  body.taskflow-app .bootstrap-table .fixed-table-toolbar{
    padding:10px!important;
    align-items:stretch!important;
  }
  body.taskflow-app .bootstrap-table .fixed-table-toolbar .search{
    width:100%!important;
    max-width:none!important;
    min-width:0!important;
    order:-1;
  }
  body.taskflow-app .bootstrap-table .fixed-table-toolbar .search input{width:100%!important}
  body.taskflow-app .bootstrap-table .fixed-table-toolbar .columns,
  body.taskflow-app .bootstrap-table .fixed-table-toolbar .columns-right{margin:0!important}
  body.taskflow-app .bootstrap-table .fixed-table-pagination{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:8px!important;
  }
  body.taskflow-app .bootstrap-table .fixed-table-pagination>div{float:none!important;margin:0!important}
  body.taskflow-app .bootstrap-table .fixed-table-pagination .pagination{flex-wrap:wrap!important}
  body.taskflow-app .bootstrap-table table.taskflow-card-table .card-view{border:0!important}
  body.taskflow-app .bootstrap-table table.taskflow-card-table tbody>tr{
    display:block!important;
    margin:10px!important;
    border:1px solid var(--tf-line)!important;
    border-radius:13px!important;
    background:#fff!important;
    box-shadow:var(--tf-shadow-xs)!important;
    overflow:hidden!important;
  }
  body.taskflow-app .bootstrap-table table.taskflow-card-table tbody>tr>td{
    display:block!important;
    width:100%!important;
    max-width:none!important;
    border:0!important;
    background:transparent!important;
    padding:0!important;
  }
  body.taskflow-app .bootstrap-table table.taskflow-card-table .card-views{display:grid!important;gap:0!important}
  body.taskflow-app .bootstrap-table table.taskflow-card-table .card-view{
    display:grid!important;
    grid-template-columns:minmax(92px,34%) minmax(0,1fr)!important;
    align-items:start!important;
    gap:10px!important;
    padding:9px 12px!important;
    border-bottom:1px solid #f0f2f6!important;
  }
  body.taskflow-app .bootstrap-table table.taskflow-card-table .card-view:last-child{border-bottom:0!important}
  body.taskflow-app .bootstrap-table table.taskflow-card-table .card-view .title{
    width:auto!important;
    float:none!important;
    color:#7b849b!important;
    font-size:10px!important;
    font-weight:800!important;
    text-transform:uppercase!important;
    letter-spacing:.04em!important;
  }
  body.taskflow-app .bootstrap-table table.taskflow-card-table .card-view .value{
    width:auto!important;
    float:none!important;
    min-width:0!important;
    color:var(--tf-text-2)!important;
    font-size:12px!important;
    overflow-wrap:anywhere!important;
  }
  body.taskflow-app .bootstrap-table table.taskflow-card-table .card-view .value img{max-width:36px!important}
  body.taskflow-app .bootstrap-table table.taskflow-card-table .card-view .value .dropdown-menu{position:fixed!important}

  body.taskflow-app .content-wrapper>.container-fluid,
  body.taskflow-app .content-wrapper>.container-xxl,
  body.taskflow-app .content-wrapper>.container,
  body.taskflow-app .container-p-y{padding:14px 12px 24px!important}
  body.taskflow-app .tk-cbar{height:62px!important;min-height:62px!important;padding:9px 12px!important}
  body.taskflow-app .tk-cbar-search{width:100%!important;max-width:320px!important}
  body.taskflow-app .card{border-radius:12px!important}
  body.taskflow-app .card-header{flex-wrap:wrap!important;gap:8px!important}
  body.taskflow-app .btn-group{max-width:100%;flex-wrap:wrap}
  body.taskflow-app .fc .fc-toolbar{display:flex!important;flex-direction:column!important;align-items:stretch!important}
  body.taskflow-app .fc .fc-toolbar-chunk{justify-content:center!important}
  body.taskflow-app.taskflow-module-files #fm{height:calc(100dvh - 190px)!important;min-height:420px!important}
  body.taskflow-app .taskflow-floating-chat{inset-inline-end:12px!important;inset-block-end:12px!important}
  body.taskflow-app .taskflow-floating-timer{inset-inline-end:62px!important;inset-block-end:12px!important}
}

@media (max-width:575.98px){
  body.taskflow-app .tk-cbar-search{display:none!important}
  body.taskflow-app .tk-cbar-actions{margin-inline-start:auto!important;gap:5px!important}
  body.taskflow-app .tk-cbar-actions .btn,
  body.taskflow-app .tk-cbar-actions>button,
  body.taskflow-app .tk-cbar-actions>a{min-width:38px!important;width:38px!important;height:38px!important;padding:0!important}
  body.taskflow-app .taskflow-page-toolbar h1,
  body.taskflow-app .breadcrumb-style1 .breadcrumb-item.active{font-size:18px!important}
  body.taskflow-app .card-body{padding:12px!important}
  body.taskflow-app .modal-dialog{margin:0!important;max-width:100vw!important;width:100%!important;min-height:100dvh!important}
  body.taskflow-app .modal-dialog-centered{min-height:100dvh!important}
  body.taskflow-app .modal-content{min-height:100dvh!important;max-height:100dvh!important;border-radius:0!important;border:0!important}
  body.taskflow-app .dropdown-menu{max-width:calc(100vw - 16px)!important}
}

@media (max-width:420px){
  body.taskflow-app .taskflow-brand-name{font-size:17px}
  body.taskflow-app .tk-cbar{padding-inline:9px!important}
  body.taskflow-app .tk-cbar-burger{width:38px;height:38px}
  body.taskflow-app .bootstrap-table table.taskflow-card-table .card-view{grid-template-columns:82px minmax(0,1fr)!important;padding:8px 10px!important}
}

/* RTL mobile drawer and generated card-view values remain naturally aligned. */
html[dir="rtl"] body.taskflow-app .bootstrap-table table.taskflow-card-table .card-view{text-align:right!important}
html[dir="rtl"] body.taskflow-app .fixed-table-toolbar .search{margin-inline-start:0!important;margin-inline-end:auto!important}

/* ============================================================================
   TASKFLOW REFERENCE UI V7 — SIDEBAR + DASHBOARD ONLY
   Visual-only layer based on the supplied mobile reference. Business logic,
   routes, permissions, APIs, forms and database behavior are unchanged.
   ============================================================================ */

:root{
  --tf-sidebar-w:112px;
  --tf-ref-navy:#061b3d;
  --tf-ref-navy-2:#0b244b;
  --tf-ref-purple:#6c57f5;
  --tf-ref-purple-2:#3f6cff;
  --tf-ref-page:#f7f8fc;
}

/* ----- reference rail sidebar ----- */
@media (min-width:992px){
  body.taskflow-app .layout-page,
  body.v2-shell.taskflow-app .layout-page{
    margin-left:var(--tf-sidebar-w)!important;
    margin-right:0!important;
    width:calc(100% - var(--tf-sidebar-w))!important;
  }
  .taskflow-sidebar-shell{
    left:0!important;
    right:auto!important;
    inset-inline-start:auto!important;
    width:var(--tf-sidebar-w)!important;
  }
}

.taskflow-sidebar{
  width:var(--tf-sidebar-w)!important;
  background:linear-gradient(180deg,var(--tf-ref-navy) 0%,#031630 100%)!important;
  border:0!important;
  box-shadow:8px 0 28px rgba(3,22,48,.09)!important;
  color:#fff!important;
  backdrop-filter:none!important;
}
.taskflow-sidebar-head{
  min-height:78px!important;
  height:auto!important;
  justify-content:center!important;
  padding:14px 10px 8px!important;
}
.taskflow-brand{justify-content:center!important;width:100%!important}
.taskflow-brand-mark{
  width:48px!important;height:48px!important;border-radius:16px!important;
  background:rgba(255,255,255,.075)!important;border:1px solid rgba(255,255,255,.13)!important;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.02)!important;
}
.taskflow-brand-mark img{width:29px!important;height:29px!important;filter:drop-shadow(0 3px 8px rgba(0,0,0,.16))}
.taskflow-brand-name{display:none!important}
.taskflow-sidebar-close{
  position:absolute!important;top:10px!important;right:8px!important;
  width:28px!important;height:28px!important;border-radius:9px!important;
  border-color:rgba(255,255,255,.18)!important;background:rgba(255,255,255,.08)!important;color:#fff!important;
}
html[dir="rtl"] .taskflow-sidebar-close{right:8px!important;left:auto!important}

.taskflow-create-task{
  width:78px!important;min-height:82px!important;height:auto!important;
  margin:8px auto 12px!important;padding:10px 7px!important;
  border-radius:19px!important;flex-direction:column!important;gap:5px!important;
  background:linear-gradient(155deg,#8a62f5 0%,#5b57f4 50%,#3c6dff 100%)!important;
  box-shadow:0 11px 24px rgba(50,79,255,.34)!important;font-size:10.5px!important;line-height:1.25!important;text-align:center!important;
}
.taskflow-create-task i{
  width:42px!important;height:42px!important;border-radius:13px!important;
  background:#fff!important;color:#655cf6!important;font-size:31px!important;display:grid!important;place-items:center!important;
  box-shadow:0 5px 14px rgba(10,24,56,.12)!important;
}
.taskflow-create-task span{max-width:66px!important;white-space:normal!important}
.taskflow-create-task:hover{transform:translateY(-2px)!important;filter:none!important}

/* The reference rail has no large workspace card. Workspace switching stays
   available from the rest of the application; only this sidebar card is hidden. */
.taskflow-workspace-switcher{display:none!important}
.taskflow-sidebar-nav{
  padding:2px 9px 14px!important;overflow-y:auto!important;overflow-x:hidden!important;
  scrollbar-width:thin!important;scrollbar-color:rgba(255,255,255,.18) transparent!important;
}
.taskflow-nav-section{padding:1px 0!important}
.taskflow-nav-label{display:none!important}
.taskflow-nav-group{display:block!important;margin:3px 0!important}
.taskflow-nav-item,
.taskflow-nav-subitem{
  width:88px!important;min-height:67px!important;margin:4px auto!important;padding:7px 5px!important;
  border:1px solid rgba(255,255,255,.13)!important;border-radius:16px!important;
  background:rgba(255,255,255,.025)!important;color:rgba(255,255,255,.91)!important;
  flex-direction:column!important;justify-content:center!important;gap:5px!important;
  text-align:center!important;line-height:1.1!important;box-shadow:none!important;
}
.taskflow-nav-leading{
  width:100%!important;flex-direction:column!important;justify-content:center!important;gap:5px!important;overflow:visible!important;
}
.taskflow-nav-leading>i,
.taskflow-nav-subitem>i{
  width:auto!important;height:auto!important;font-size:27px!important;color:#fff!important;
}
.taskflow-nav-leading>span,
.taskflow-nav-subitem>span:not(.ms-auto){
  width:100%!important;max-width:78px!important;overflow:hidden!important;text-overflow:ellipsis!important;
  white-space:normal!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;
  font-size:10.5px!important;color:rgba(255,255,255,.92)!important;font-weight:600!important;
}
.taskflow-nav-item:hover,
.taskflow-nav-subitem:hover{
  background:rgba(255,255,255,.09)!important;border-color:rgba(255,255,255,.24)!important;color:#fff!important;
}
.taskflow-nav-item.is-active,
.taskflow-nav-subitem.is-active{
  background:linear-gradient(155deg,rgba(119,89,247,.98),rgba(58,106,255,.98))!important;
  border-color:rgba(255,255,255,.24)!important;color:#fff!important;font-weight:700!important;
  box-shadow:0 9px 22px rgba(26,63,185,.32)!important;
}
[dir="rtl"] .taskflow-nav-item.is-active,
[dir="rtl"] .taskflow-nav-subitem.is-active{box-shadow:0 9px 22px rgba(26,63,185,.32)!important}
.taskflow-nav-trailing{
  position:absolute!important;top:3px!important;right:4px!important;margin:0!important;display:flex!important;z-index:2!important;
}
.taskflow-nav-group>summary{position:relative!important}
.taskflow-nav-chevron{display:none!important}
.taskflow-nav-trailing .badge,
.taskflow-nav-item>.taskflow-nav-trailing .badge,
.taskflow-nav-trailing>span.badge{
  min-width:20px!important;height:20px!important;padding:2px 5px!important;border-radius:10px!important;
  background:#f22d45!important;color:#fff!important;border:2px solid var(--tf-ref-navy)!important;
  font-size:9px!important;line-height:12px!important;box-shadow:none!important;
}
.taskflow-nav-submenu{
  padding:2px 0 5px!important;background:rgba(255,255,255,.035)!important;border-radius:16px!important;margin:2px 0 6px!important;
}
.taskflow-nav-subitem{
  width:80px!important;min-height:56px!important;border-color:transparent!important;background:transparent!important;margin:2px auto!important;
}
.taskflow-nav-subitem>i{font-size:21px!important;color:#cbd8ef!important}
.taskflow-nav-subitem>span:not(.ms-auto){font-size:9.5px!important;color:#dbe5f4!important}
.taskflow-nav-subitem.is-active{background:rgba(92,102,255,.42)!important;box-shadow:none!important}

.taskflow-sidebar-foot{
  padding:8px 9px 13px!important;border-top:1px solid rgba(255,255,255,.08)!important;background:transparent!important;
}
.taskflow-sidebar-profile{
  width:88px!important;margin:auto!important;padding:7px 5px!important;border-radius:16px!important;
  flex-direction:column!important;gap:4px!important;color:#fff!important;text-align:center!important;
}
.taskflow-sidebar-profile:hover{background:rgba(255,255,255,.08)!important}
.taskflow-sidebar-profile img{width:36px!important;height:36px!important;border:2px solid rgba(255,255,255,.9)!important}
.taskflow-sidebar-profile-copy{width:100%!important;align-items:center!important}
.taskflow-sidebar-profile-copy strong{max-width:78px!important;color:#fff!important;font-size:9.5px!important}
.taskflow-sidebar-profile-copy small{color:#aabbd6!important;font-size:8.5px!important}
.taskflow-sidebar-profile-arrow{display:none!important}

/* ----- dashboard matching the reference ----- */
body.taskflow-app .taskflow-dashboard-reference{
  max-width:1420px!important;background:transparent!important;
}
.taskflow-ref-hero{
  min-height:92px;display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin:2px 0 14px;
}
.taskflow-ref-greeting{display:flex;align-items:center;gap:13px;min-width:0}
.taskflow-ref-hero-avatar{
  width:58px;height:58px;border-radius:50%;object-fit:cover;border:3px solid #fff;
  box-shadow:0 3px 12px rgba(18,31,57,.12);flex:none;
}
.taskflow-ref-greeting h1{margin:0!important;font-size:26px!important;line-height:1.2!important;font-weight:800!important;color:#111827!important}
.taskflow-ref-greeting p{margin:7px 0 0!important;color:#858da0!important;font-size:12.5px!important}
.taskflow-ref-search-button{
  width:43px;height:43px;border:1px solid #e1e5ee;border-radius:13px;background:#fff;color:#111827!important;
  display:grid;place-items:center;text-decoration:none!important;font-size:23px;box-shadow:0 3px 12px rgba(15,23,42,.035);
}
.taskflow-ref-search-button:hover{background:#f7f8fc!important;color:#4f46e5!important}

.taskflow-ref-stats{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:14px!important;margin-bottom:20px!important;
}
.taskflow-ref-stats .taskflow-stat-card{
  min-height:126px!important;padding:18px 12px!important;border-radius:15px!important;
  flex-direction:column!important;justify-content:center!important;gap:8px!important;text-align:center!important;
  box-shadow:0 5px 18px rgba(15,23,42,.045)!important;
}
.taskflow-ref-stats .taskflow-stat-icon{
  width:39px!important;height:39px!important;border-radius:50%!important;font-size:25px!important;background:transparent!important;
}
.taskflow-ref-stats .taskflow-stat-copy{align-items:center!important}
.taskflow-ref-stats .taskflow-stat-copy strong{font-size:27px!important;line-height:1!important}
.taskflow-ref-stats .taskflow-stat-copy>span{font-size:11.5px!important;margin-top:3px!important;color:#737d91!important}
.taskflow-ref-stats .taskflow-stat-copy small{display:none!important}
.taskflow-ref-stats .tone-primary .taskflow-stat-icon{color:#6f4df4!important}
.taskflow-ref-stats .tone-success .taskflow-stat-icon{color:#16a34a!important}
.taskflow-ref-stats .tone-warning .taskflow-stat-icon{color:#f59e0b!important}
.taskflow-ref-stats .tone-danger .taskflow-stat-icon{color:#ef5a78!important}

.taskflow-ref-board{margin-top:2px}
.taskflow-ref-board-head{
  min-height:60px;display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:10px;
}
.taskflow-ref-board-head h2{font-size:20px!important;margin:2px 0 0!important;font-weight:800!important}
.taskflow-ref-board-actions{display:flex;align-items:center;gap:8px}
.taskflow-ref-filter-button{
  min-height:40px;padding:0 13px;border:1px solid #e1e5ee;border-radius:11px;background:#fff;color:#3f495e!important;
  display:inline-flex;align-items:center;gap:7px;text-decoration:none!important;font-size:11px;font-weight:700;
}
.taskflow-ref-filter-button:hover{background:#f8f9fd!important;color:#4f46e5!important}
.taskflow-ref-add-button{
  width:42px;height:42px;border:0;border-radius:12px;background:linear-gradient(145deg,#6c56f4,#3f6cff);color:#fff;
  display:grid;place-items:center;font-size:23px;box-shadow:0 8px 18px rgba(72,83,235,.24);
}
.taskflow-ref-task-list{display:flex;flex-direction:column;gap:11px}
.taskflow-ref-task-card{
  --tf-task-tone:#4f6fff;--tf-task-soft:#f7f9ff;
  min-height:144px;display:grid;grid-template-columns:112px minmax(0,1fr);gap:16px;
  padding:12px 16px 12px 13px;border:1px solid #e5e8ef;border-inline-end:5px solid var(--tf-task-tone);
  border-radius:15px;background:linear-gradient(90deg,var(--tf-task-soft),#fff 34%,#fff 100%);
  box-shadow:0 5px 16px rgba(15,23,42,.045);overflow:hidden;
}
.taskflow-ref-task-card.tone-danger{--tf-task-tone:#ef3340;--tf-task-soft:#fff4f5}
.taskflow-ref-task-card.tone-warning{--tf-task-tone:#ff8a00;--tf-task-soft:#fff9f1}
.taskflow-ref-task-card.tone-success{--tf-task-tone:#22a967;--tf-task-soft:#f2fbf6}
.taskflow-ref-task-card.tone-info{--tf-task-tone:#2469e8;--tf-task-soft:#f3f7ff}
.taskflow-ref-task-card.tone-secondary{--tf-task-tone:#6b7280;--tf-task-soft:#f7f7f8}
.taskflow-ref-task-rail{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-width:0}
.taskflow-ref-priority-label{
  max-width:105px;min-height:23px;padding:3px 8px;border-radius:7px;background:color-mix(in srgb,var(--tf-task-tone) 9%,white);
  color:var(--tf-task-tone);font-size:9.5px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;gap:4px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.taskflow-ref-due-ring{
  width:73px;height:73px;border-radius:50%;border:2px solid var(--tf-task-tone);
  display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:#fff;
  color:var(--tf-task-tone);padding:8px;box-shadow:inset 0 0 0 4px color-mix(in srgb,var(--tf-task-tone) 5%,white);
}
.taskflow-ref-due-ring strong{font-size:11.5px;line-height:1.1;color:var(--tf-task-tone)}
.taskflow-ref-due-ring small{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:8.3px;line-height:1.15;margin-top:4px;color:var(--tf-task-tone)}
.taskflow-ref-task-main{min-width:0;display:flex;flex-direction:column;justify-content:center;gap:10px}
.taskflow-ref-task-title-row{display:flex;align-items:flex-start;gap:10px;min-width:0}
.taskflow-ref-task-copy{min-width:0;flex:1}
.taskflow-ref-task-title{
  display:block;max-width:100%;color:#111827!important;text-decoration:none!important;font-size:14px;font-weight:800;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.taskflow-ref-task-title:hover{color:var(--tf-task-tone)!important}
.taskflow-ref-task-copy p{margin:4px 0 0!important;color:#8a92a3!important;font-size:10.5px!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.taskflow-ref-task-more{
  width:31px;height:31px;border-radius:9px;display:grid;place-items:center;color:#111827!important;text-decoration:none!important;font-size:21px;flex:none;
}
.taskflow-ref-task-more:hover{background:#f3f4f7!important;color:var(--tf-task-tone)!important}
.taskflow-ref-task-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;min-width:0}
.taskflow-ref-date-meta{display:flex;align-items:center;gap:7px;min-width:0;color:#1f2937}
.taskflow-ref-date-meta>i{font-size:19px;color:#303a4f}
.taskflow-ref-date-meta>span{display:flex;flex-direction:column;line-height:1.15}
.taskflow-ref-date-meta small{font-size:8.5px;color:#9aa2b2}
.taskflow-ref-date-meta strong{font-size:9.5px;color:#505a6e;font-weight:700;margin-top:2px}
.taskflow-ref-assignees{display:flex;align-items:center;justify-content:flex-end;padding-inline-end:3px}
.taskflow-ref-assignees img{
  width:30px;height:30px;border-radius:50%;object-fit:cover;border:2px solid #fff;margin-inline-start:-7px;box-shadow:0 1px 3px rgba(15,23,42,.08)
}
.taskflow-ref-assignees img:first-child{margin-inline-start:0}
.taskflow-ref-assignees em{
  width:30px;height:30px;border-radius:50%;display:grid;place-items:center;margin-inline-start:-7px;background:#f0f1f4;border:2px solid #fff;
  color:#667085;font-size:8.5px;font-style:normal;font-weight:700;
}
.taskflow-ref-progress-row{display:grid;grid-template-columns:minmax(0,1fr) 38px;align-items:center;gap:9px}
.taskflow-ref-progress-track{height:4px;border-radius:999px;background:#e8eaf0;overflow:hidden}
.taskflow-ref-progress-track>span{display:block;height:100%;border-radius:inherit;background:var(--tf-task-tone)}
.taskflow-ref-progress-row>strong{font-size:10px;color:#667085;text-align:end}

.taskflow-ref-secondary-grid{
  margin-top:18px!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important;
}
.taskflow-ref-secondary-grid>section{grid-column:auto!important}
.taskflow-ref-secondary-grid .taskflow-ref-activity-card{grid-column:1/-1!important}

/* Reference RTL: sidebar remains on the left, while dashboard copy stays RTL. */
html[dir="rtl"] .taskflow-sidebar-shell{left:0!important;right:auto!important;inset-inline-start:auto!important;inset-inline-end:auto!important}
html[dir="rtl"] .taskflow-ref-task-card{direction:ltr}
html[dir="rtl"] .taskflow-ref-task-main{direction:rtl;text-align:right}
html[dir="rtl"] .taskflow-ref-task-rail{direction:rtl}
html[dir="rtl"] .taskflow-ref-task-progress-row{text-align:right}
html[dir="rtl"] .taskflow-ref-board-head,
html[dir="rtl"] .taskflow-ref-hero{direction:rtl}

@media (max-width:1199.98px){
  .taskflow-ref-task-card{grid-template-columns:102px minmax(0,1fr)}
  .taskflow-ref-stats{gap:10px!important}
}

@media (max-width:991.98px){
  .taskflow-sidebar-shell,
  html[dir="rtl"] .taskflow-sidebar-shell{
    left:0!important;right:auto!important;width:112px!important;transform:translateX(-105%)!important;
  }
  .taskflow-sidebar-shell.show,
  .taskflow-sidebar-shell.showing{transform:translateX(0)!important;visibility:visible!important}
  .taskflow-sidebar{width:112px!important}
  .taskflow-ref-hero{min-height:76px}
  .taskflow-ref-secondary-grid{grid-template-columns:1fr!important}
  .taskflow-ref-secondary-grid .taskflow-ref-activity-card{grid-column:auto!important}
}

@media (max-width:767.98px){
  .taskflow-dashboard-reference{padding-inline:12px!important}
  .taskflow-ref-hero-avatar{width:50px;height:50px}
  .taskflow-ref-greeting h1{font-size:21px!important}
  .taskflow-ref-greeting p{font-size:11px!important}
  .taskflow-ref-stats{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:7px!important}
  .taskflow-ref-stats .taskflow-stat-card{min-height:105px!important;padding:12px 5px!important;border-radius:13px!important;gap:5px!important}
  .taskflow-ref-stats .taskflow-stat-icon{width:32px!important;height:32px!important;font-size:22px!important}
  .taskflow-ref-stats .taskflow-stat-copy strong{font-size:21px!important}
  .taskflow-ref-stats .taskflow-stat-copy>span{font-size:9.5px!important;line-height:1.15!important}
  .taskflow-ref-task-card{grid-template-columns:88px minmax(0,1fr);gap:10px;padding:10px 11px 10px 8px;min-height:132px}
  .taskflow-ref-due-ring{width:64px;height:64px}
  .taskflow-ref-priority-label{font-size:8.5px;max-width:82px;padding-inline:5px}
  .taskflow-ref-task-title{font-size:12.5px}
  .taskflow-ref-task-copy p{font-size:9.5px!important}
  .taskflow-ref-assignees img,.taskflow-ref-assignees em{width:27px;height:27px}
}

@media (max-width:575.98px){
  .taskflow-ref-hero{align-items:center;margin-bottom:10px}
  .taskflow-ref-search-button{width:39px;height:39px;font-size:20px}
  .taskflow-ref-greeting{gap:9px}
  .taskflow-ref-hero-avatar{width:44px;height:44px}
  .taskflow-ref-greeting h1{font-size:18px!important}
  .taskflow-ref-greeting p{font-size:9.5px!important;margin-top:4px!important}
  .taskflow-ref-stats{grid-template-columns:repeat(4,minmax(0,1fr))!important;overflow-x:auto!important;padding-bottom:4px!important;scrollbar-width:none!important}
  .taskflow-ref-stats::-webkit-scrollbar{display:none!important}
  .taskflow-ref-stats .taskflow-stat-card{min-width:92px!important}
  .taskflow-ref-board-head h2{font-size:18px!important}
  .taskflow-ref-filter-button{padding-inline:10px;font-size:10px}
  .taskflow-ref-task-card{grid-template-columns:76px minmax(0,1fr);gap:8px;border-radius:13px;padding:9px 9px 9px 6px}
  .taskflow-ref-priority-label{max-width:74px}
  .taskflow-ref-due-ring{width:58px;height:58px;padding:5px}
  .taskflow-ref-due-ring strong{font-size:10px}
  .taskflow-ref-due-ring small{font-size:7.5px}
  .taskflow-ref-task-meta{gap:6px}
  .taskflow-ref-date-meta>i{font-size:16px}
  .taskflow-ref-date-meta small{display:none}
  .taskflow-ref-date-meta strong{font-size:8.8px}
  .taskflow-ref-assignees img,.taskflow-ref-assignees em{width:24px;height:24px;margin-inline-start:-6px}
  .taskflow-ref-progress-row{grid-template-columns:minmax(0,1fr) 31px;gap:5px}
  .taskflow-ref-progress-row>strong{font-size:8.5px}
}

@media (max-width:420px){
  .taskflow-ref-stats .taskflow-stat-card{min-width:84px!important;min-height:98px!important}
  .taskflow-ref-task-card{grid-template-columns:68px minmax(0,1fr)}
  .taskflow-ref-due-ring{width:54px;height:54px}
  .taskflow-ref-priority-label{max-width:66px;font-size:7.8px}
  .taskflow-ref-task-copy p{max-width:180px}
}
/* V7 micro-fix: badge positioning on every rail item. */
.taskflow-nav-item{position:relative!important}
/* V7 workspace rail item: keep switching functionality, only compact its design. */
.taskflow-workspace-switcher{display:block!important;margin:3px 9px 7px!important}
.taskflow-workspace-button{
  width:88px!important;min-height:67px!important;padding:7px 5px!important;margin:auto!important;
  border:1px solid rgba(255,255,255,.13)!important;border-radius:16px!important;
  background:rgba(255,255,255,.025)!important;color:#fff!important;
  flex-direction:column!important;justify-content:center!important;gap:4px!important;text-align:center!important;
}
.taskflow-workspace-button:hover{background:rgba(255,255,255,.09)!important;border-color:rgba(255,255,255,.24)!important}
.taskflow-workspace-button:after{display:none!important}
.taskflow-workspace-icon{width:auto!important;height:auto!important;background:transparent!important;color:#fff!important;font-size:26px!important}
.taskflow-workspace-copy{width:100%!important;align-items:center!important;line-height:1.05!important}
.taskflow-workspace-copy small{display:none!important}
.taskflow-workspace-copy strong{
  max-width:78px!important;color:rgba(255,255,255,.92)!important;font-size:9px!important;font-weight:650!important;
  text-align:center!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;
}
.taskflow-workspace-menu{left:100%!important;right:auto!important;margin-left:8px!important}
html[dir="rtl"] .taskflow-workspace-menu{left:100%!important;right:auto!important;margin-left:8px!important;margin-right:0!important}


/* ============================================================================
   TASKFLOW SIDEBAR UI V8 — REFINED COMPACT RAIL
   UI/UX ONLY. No routes, permissions, controllers, APIs, models or DB logic.
   ============================================================================ */

:root{
  --tf-sidebar-w:96px;
  --tf-side-bg:#071a38;
  --tf-side-bg-2:#03152f;
  --tf-side-card:rgba(255,255,255,.045);
  --tf-side-card-hover:rgba(255,255,255,.095);
  --tf-side-border:rgba(255,255,255,.105);
  --tf-side-text:#eef4ff;
  --tf-side-muted:#9fb0ca;
  --tf-side-accent:#7166ff;
  --tf-side-accent-2:#477dff;
}

@media (min-width:992px){
  body.taskflow-app .layout-page,
  body.v2-shell.taskflow-app .layout-page{
    margin-left:var(--tf-sidebar-w)!important;
    margin-right:0!important;
    width:calc(100% - var(--tf-sidebar-w))!important;
  }
  .taskflow-sidebar-shell,
  html[dir="rtl"] .taskflow-sidebar-shell{
    left:0!important;
    right:auto!important;
    inset-inline-start:auto!important;
    inset-inline-end:auto!important;
    width:var(--tf-sidebar-w)!important;
  }
}

.taskflow-sidebar{
  width:var(--tf-sidebar-w)!important;
  background:
    radial-gradient(circle at 50% -5%,rgba(105,111,255,.15),transparent 25%),
    linear-gradient(180deg,var(--tf-side-bg) 0%,var(--tf-side-bg-2) 100%)!important;
  border:0!important;
  box-shadow:8px 0 28px rgba(1,12,30,.08)!important;
  color:var(--tf-side-text)!important;
}

.taskflow-sidebar-head{
  min-height:64px!important;
  height:64px!important;
  padding:10px 8px 6px!important;
  justify-content:center!important;
}
.taskflow-brand{
  width:auto!important;
  justify-content:center!important;
}
.taskflow-brand-mark{
  width:38px!important;
  height:38px!important;
  border-radius:12px!important;
  background:rgba(255,255,255,.07)!important;
  border:1px solid rgba(255,255,255,.12)!important;
  box-shadow:0 5px 14px rgba(0,0,0,.08),inset 0 1px 0 rgba(255,255,255,.04)!important;
}
.taskflow-brand-mark img{
  width:23px!important;
  height:23px!important;
}
.taskflow-brand-name{display:none!important}

.taskflow-create-task{
  width:72px!important;
  min-height:68px!important;
  height:68px!important;
  margin:5px auto 10px!important;
  padding:7px 5px!important;
  border:1px solid rgba(255,255,255,.13)!important;
  border-radius:16px!important;
  flex-direction:column!important;
  gap:4px!important;
  background:linear-gradient(145deg,var(--tf-side-accent) 0%,var(--tf-side-accent-2) 100%)!important;
  box-shadow:0 8px 18px rgba(62,86,235,.28)!important;
  font-size:9.5px!important;
  line-height:1.15!important;
  font-weight:700!important;
}
.taskflow-create-task i{
  width:30px!important;
  height:30px!important;
  border-radius:10px!important;
  background:#fff!important;
  color:#615af6!important;
  font-size:23px!important;
  display:grid!important;
  place-items:center!important;
  box-shadow:0 3px 9px rgba(14,28,67,.12)!important;
}
.taskflow-create-task span{
  max-width:62px!important;
  white-space:normal!important;
  display:-webkit-box!important;
  -webkit-line-clamp:2!important;
  -webkit-box-orient:vertical!important;
  overflow:hidden!important;
}
.taskflow-create-task:hover{
  transform:translateY(-1px)!important;
  filter:brightness(1.045)!important;
  box-shadow:0 10px 22px rgba(62,86,235,.34)!important;
}

.taskflow-workspace-switcher{
  display:block!important;
  margin:0 8px 7px!important;
}
.taskflow-workspace-button{
  width:72px!important;
  min-height:54px!important;
  margin:auto!important;
  padding:6px 4px!important;
  border:1px solid var(--tf-side-border)!important;
  border-radius:14px!important;
  background:var(--tf-side-card)!important;
  color:#fff!important;
  flex-direction:column!important;
  justify-content:center!important;
  gap:3px!important;
  text-align:center!important;
  transition:background .16s ease,border-color .16s ease,transform .16s ease!important;
}
.taskflow-workspace-button:hover{
  background:var(--tf-side-card-hover)!important;
  border-color:rgba(255,255,255,.19)!important;
  transform:translateY(-1px)!important;
}
.taskflow-workspace-button:after{display:none!important}
.taskflow-workspace-icon{
  width:auto!important;
  height:auto!important;
  background:transparent!important;
  color:#b9c8ff!important;
  font-size:19px!important;
}
.taskflow-workspace-copy{
  width:100%!important;
  align-items:center!important;
  line-height:1!important;
}
.taskflow-workspace-copy small{display:none!important}
.taskflow-workspace-copy strong{
  max-width:64px!important;
  color:#e9f0fb!important;
  font-size:8.2px!important;
  line-height:1.1!important;
  font-weight:650!important;
  text-align:center!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}
.taskflow-workspace-menu{
  left:100%!important;
  right:auto!important;
  margin-left:8px!important;
  margin-right:0!important;
}

.taskflow-sidebar-nav{
  padding:2px 8px 12px!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  scrollbar-width:none!important;
  overscroll-behavior:contain;
}
.taskflow-sidebar-nav::-webkit-scrollbar{width:0!important;height:0!important}
.taskflow-nav-section{padding:1px 0!important}
.taskflow-nav-label{display:none!important}
.taskflow-nav-group{display:block!important;margin:2px 0!important}
.taskflow-nav-group>summary{position:relative!important}

.taskflow-nav-item,
.taskflow-nav-subitem{
  position:relative!important;
  width:72px!important;
  min-height:56px!important;
  margin:3px auto!important;
  padding:6px 4px!important;
  border:1px solid transparent!important;
  border-radius:14px!important;
  background:transparent!important;
  color:var(--tf-side-text)!important;
  flex-direction:column!important;
  justify-content:center!important;
  gap:4px!important;
  text-align:center!important;
  line-height:1.05!important;
  box-shadow:none!important;
  transition:background .16s ease,border-color .16s ease,transform .16s ease,box-shadow .16s ease!important;
}
.taskflow-nav-leading{
  width:100%!important;
  min-width:0!important;
  flex-direction:column!important;
  justify-content:center!important;
  gap:4px!important;
  overflow:visible!important;
}
.taskflow-nav-leading>i,
.taskflow-nav-subitem>i{
  width:24px!important;
  height:24px!important;
  font-size:20px!important;
  line-height:24px!important;
  display:grid!important;
  place-items:center!important;
  color:#f5f8ff!important;
  opacity:.94!important;
  flex:none!important;
}
.taskflow-nav-leading>span,
.taskflow-nav-subitem>span:not(.ms-auto){
  width:100%!important;
  max-width:66px!important;
  min-width:0!important;
  color:#d9e3f2!important;
  font-size:9px!important;
  font-weight:600!important;
  line-height:1.15!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:normal!important;
  display:-webkit-box!important;
  -webkit-line-clamp:2!important;
  -webkit-box-orient:vertical!important;
}
.taskflow-nav-item:hover,
.taskflow-nav-subitem:hover{
  background:var(--tf-side-card-hover)!important;
  border-color:var(--tf-side-border)!important;
  color:#fff!important;
  transform:translateY(-1px)!important;
}
.taskflow-nav-item:hover .taskflow-nav-leading>i,
.taskflow-nav-subitem:hover>i{color:#fff!important;opacity:1!important}

.taskflow-nav-item.is-active,
.taskflow-nav-subitem.is-active{
  background:linear-gradient(145deg,rgba(113,102,255,.98),rgba(71,125,255,.96))!important;
  border-color:rgba(255,255,255,.17)!important;
  color:#fff!important;
  font-weight:700!important;
  box-shadow:0 7px 17px rgba(39,65,180,.27)!important;
}
.taskflow-nav-item.is-active::before,
.taskflow-nav-subitem.is-active::before{
  content:"";
  position:absolute;
  left:-5px;
  top:50%;
  width:3px;
  height:22px;
  transform:translateY(-50%);
  border-radius:999px;
  background:#9ca8ff;
  box-shadow:0 0 10px rgba(139,153,255,.55);
}
html[dir="rtl"] .taskflow-nav-item.is-active::before,
html[dir="rtl"] .taskflow-nav-subitem.is-active::before{
  left:-5px!important;
  right:auto!important;
}
.taskflow-nav-item.is-active .taskflow-nav-leading>i,
.taskflow-nav-subitem.is-active>i,
.taskflow-nav-item.is-active .taskflow-nav-leading>span,
.taskflow-nav-subitem.is-active>span:not(.ms-auto){
  color:#fff!important;
  opacity:1!important;
}

.taskflow-nav-trailing{
  position:absolute!important;
  top:4px!important;
  right:4px!important;
  margin:0!important;
  z-index:2!important;
}
.taskflow-nav-trailing .badge,
.taskflow-nav-item>.taskflow-nav-trailing .badge,
.taskflow-nav-trailing>span.badge{
  min-width:16px!important;
  height:16px!important;
  padding:1px 4px!important;
  border-radius:999px!important;
  border:2px solid var(--tf-side-bg)!important;
  background:#f43f5e!important;
  color:#fff!important;
  font-size:7.3px!important;
  line-height:10px!important;
  font-weight:750!important;
}
.taskflow-nav-chevron{display:none!important}

.taskflow-nav-submenu{
  margin:2px 0 5px!important;
  padding:3px 0!important;
  border:1px solid rgba(255,255,255,.055)!important;
  border-radius:13px!important;
  background:rgba(255,255,255,.028)!important;
}
.taskflow-nav-subitem{
  width:66px!important;
  min-height:47px!important;
  margin:2px auto!important;
  padding:5px 3px!important;
  border-radius:11px!important;
}
.taskflow-nav-subitem>i{
  width:20px!important;
  height:20px!important;
  font-size:16px!important;
  color:#bed0e9!important;
}
.taskflow-nav-subitem>span:not(.ms-auto){
  max-width:60px!important;
  font-size:8.2px!important;
  color:#cbd8e9!important;
}
.taskflow-nav-subitem.is-active{
  background:rgba(97,103,255,.34)!important;
  border-color:rgba(145,153,255,.2)!important;
  box-shadow:none!important;
}

.taskflow-sidebar-foot{
  padding:7px 8px 10px!important;
  border-top:1px solid rgba(255,255,255,.07)!important;
  background:linear-gradient(180deg,rgba(3,20,45,0),rgba(3,20,45,.45))!important;
}
.taskflow-sidebar-profile{
  width:72px!important;
  margin:auto!important;
  padding:6px 4px!important;
  border-radius:14px!important;
  flex-direction:column!important;
  gap:3px!important;
  color:#fff!important;
  text-align:center!important;
  transition:background .16s ease!important;
}
.taskflow-sidebar-profile:hover{background:rgba(255,255,255,.075)!important}
.taskflow-sidebar-profile img{
  width:30px!important;
  height:30px!important;
  border:2px solid rgba(255,255,255,.88)!important;
  box-shadow:0 3px 9px rgba(0,0,0,.13)!important;
}
.taskflow-sidebar-profile-copy{
  width:100%!important;
  align-items:center!important;
  line-height:1.05!important;
}
.taskflow-sidebar-profile-copy strong{
  max-width:64px!important;
  color:#fff!important;
  font-size:8.5px!important;
  font-weight:700!important;
}
.taskflow-sidebar-profile-copy small{
  max-width:64px!important;
  color:var(--tf-side-muted)!important;
  font-size:7.6px!important;
}
.taskflow-sidebar-profile-arrow{display:none!important}

.taskflow-sidebar-close{
  top:8px!important;
  right:6px!important;
  width:26px!important;
  height:26px!important;
  border-radius:9px!important;
  font-size:18px!important;
  border-color:rgba(255,255,255,.16)!important;
  background:rgba(255,255,255,.075)!important;
  color:#fff!important;
}

@media (max-width:991.98px){
  :root{--tf-sidebar-w:96px}
  .taskflow-sidebar-shell,
  html[dir="rtl"] .taskflow-sidebar-shell{
    left:0!important;
    right:auto!important;
    width:var(--tf-sidebar-w)!important;
    transform:translateX(-105%)!important;
  }
  .taskflow-sidebar-shell.show,
  .taskflow-sidebar-shell.showing{
    transform:translateX(0)!important;
    visibility:visible!important;
  }
  .taskflow-sidebar{width:var(--tf-sidebar-w)!important}
}

@media (max-height:740px){
  .taskflow-sidebar-head{height:54px!important;min-height:54px!important;padding-top:7px!important}
  .taskflow-brand-mark{width:34px!important;height:34px!important}
  .taskflow-brand-mark img{width:20px!important;height:20px!important}
  .taskflow-create-task{min-height:60px!important;height:60px!important;margin-bottom:6px!important}
  .taskflow-create-task i{width:27px!important;height:27px!important;font-size:20px!important}
  .taskflow-workspace-button{min-height:48px!important}
  .taskflow-nav-item{min-height:50px!important;margin-block:2px!important}
  .taskflow-nav-leading>i{font-size:18px!important;height:21px!important}
  .taskflow-nav-leading>span{font-size:8.4px!important}
  .taskflow-sidebar-profile img{width:27px!important;height:27px!important}
}

