/* Taskly v8 — Requested violet and interactive, accessible sortable task table.
   Source of truth: #8C78EB -> #4F39F6. Layout measurements are inherited from v7. */
html[data-theme="dark"] {
  --purple:#8C78EB;--purple-dark:#4F39F6;--accent:#8C78EB;
  --brand-a:#8C78EB;--brand-b:#4F39F6;--tone-violet:#AB9BFF;
  --brand-gradient:linear-gradient(125deg,#8C78EB 0%,#4F39F6 100%);
}
html[data-theme="light"] {
  --purple:#5941D4;--purple-dark:#4F39F6;--accent:#5941D4;
  --brand-a:#8C78EB;--brand-b:#4F39F6;--tone-violet:#4F39F6;
  --brand-gradient:linear-gradient(125deg,#8C78EB 0%,#4F39F6 100%);
}
/* Branded controls have bright pigment with a readable foreground. */
.brand-symbol,.stat-card.lavender .stat-icon,
.btn-primary,.login-logo,
html[data-theme="dark"] .btn-primary:not(.detail-cta .btn),
html[data-theme="light"] .btn-primary:not(.detail-cta .btn) {
  background:var(--brand-gradient)!important;color:#fff!important;
}
html[data-theme="dark"] .btn-primary:hover:not(:disabled),
html[data-theme="light"] .btn-primary:hover:not(:disabled) {
  box-shadow:0 0 0 1px rgba(140,120,235,.5),0 0 21px rgba(79,57,246,.35)!important;
  filter:none!important;transform:none!important;
}
.brand-dot {color:#8C78EB!important;}
html[data-theme="dark"] .welcome-line h2 span {color:#B2A6FF!important;}
html[data-theme="light"] .welcome-line h2 span {color:#4F39F6!important;}
html[data-theme="dark"] .sidebar .nav-link.active {
  background:linear-gradient(105deg,rgba(140,120,235,.22),rgba(79,57,246,.12))!important;
  color:#E6E1FF!important;
  box-shadow:inset 0 0 0 1px rgba(140,120,235,.36)!important;
}
html[data-theme="light"] .sidebar .nav-link.active {
  background:linear-gradient(105deg,#EFECFF,#E4E0FF)!important;
  color:#4931CE!important;
  box-shadow:inset 0 0 0 1px #CECAFC!important;
}
html[data-theme="dark"] .sidebar .nav-link:hover:not(.active){background:#191934!important;color:#C5BBFF!important;}
html[data-theme="light"] .sidebar .nav-link:hover:not(.active){background:#F0EEFF!important;color:#503ACA!important;}
html[data-theme="dark"] .sidebar-collapse {background:#26244C!important;color:#D6CEFF!important;border-color:#655BA7!important;}
html[data-theme="light"] .sidebar-collapse {background:#EEEBFF!important;color:#4F39F6!important;border-color:#CFC8FB!important;}
html[data-theme="dark"] .total-pill {background:#29264F!important;color:#C8BEFF!important;}
html[data-theme="light"] .total-pill {background:#EEEAFE!important;color:#4F39F6!important;}
html[data-theme="dark"] .stat-card.lavender {
  background:linear-gradient(145deg,#231E40,#191B34 60%,#12192A)!important;
  border-color:#45406E!important;
  --skill-rgb:140,120,235;
}
html[data-theme="light"] .stat-card.lavender {
  background:linear-gradient(145deg,#F8F7FF,#ECE9FF)!important;
  border-color:#DCD7FB!important;
  --skill-rgb:140,120,235;
}
html[data-theme="dark"] .stat-card.progress-card {
  background:linear-gradient(140deg,#1B1D39,#131A2B)!important;
  border-color:#373659!important;
  --skill-rgb:140,120,235;
}
html[data-theme="light"] .stat-card.progress-card {
  background:linear-gradient(140deg,#FFF,#F6F4FF)!important;
  border-color:#E1DFFA!important;
  --skill-rgb:140,120,235;
}
/* No inset shadow or box shadow on the circular progress / its card. Rounded SVG ends remain. */
#progressRing,#progressRing:hover,.stat-card.progress-card,
html[data-theme="dark"] .stat-card.progress-card:hover,
html[data-theme="light"] .stat-card.progress-card:hover {box-shadow:none!important;filter:none!important;}
html[data-theme="dark"] .ring .progress-ring-track {stroke:#383454!important;}
html[data-theme="light"] .ring .progress-ring-track {stroke:#E7E4FA!important;}
.ring .progress-ring-value {stroke:url(#bestuiLogoProgress);stroke-linecap:round;}
#detailBar {background:var(--brand-gradient)!important;}
html[data-theme="dark"] .detail-tabs button.selected {color:#B9AAFF!important;border-bottom-color:#8C78EB!important;}
html[data-theme="light"] .detail-tabs button.selected {color:#4F39F6!important;border-bottom-color:#4F39F6!important;}
html[data-theme="dark"] .pagination button.current,
html[data-theme="light"] .pagination button.current {background:#4F39F6!important;border-color:#4F39F6!important;color:#fff!important;}
html[data-theme="dark"] .pagination button:hover:not(.current){border-color:#8C78EB;color:#CABFFF;}
html[data-theme="light"] .pagination button:hover:not(.current){border-color:#8C78EB;color:#4F39F6;}
html[data-theme="dark"] .theme-toggle:hover,html[data-theme="dark"] .icon-btn:hover{color:#B7ABFF!important;}
html[data-theme="light"] .theme-toggle:hover,html[data-theme="light"] .icon-btn:hover{color:#4F39F6!important;}
html[data-theme="dark"] .row-action:not([data-status="doing"]),
html[data-theme="dark"] .detail-cta #detailAction:not([data-status="doing"]):not([data-status="done"]){
  --skill-rgb:140,120,235;--action-dark-bg:#30276B;--action-dark-text:#E6E0FF;
}
html[data-theme="light"] .row-action:not([data-status="doing"]),
html[data-theme="light"] .detail-cta #detailAction:not([data-status="doing"]):not([data-status="done"]){
  --skill-rgb:79,57,246;--action-light-bg:#ECE8FF;--action-light-text:#4430C4;
}
.pill.status-todo {--skill-rgb:140,120,235;--ink-chip-dark:#C7BDFF;--ink-chip-light:#4E3ABB;--chip-light:#EFEAFF;}
html[data-theme="light"] .pill.status-todo {border-color:#CCC4FD!important;}
html[data-theme="dark"] .pill.status-todo {border-color:#675AC1!important;}
html[data-theme="dark"] .detail-tag {color:#CBBFFF;border-color:#4A447D;background:#24213D;}
html[data-theme="light"] .detail-tag {color:#4F39F6;border-color:#DAD4FB;background:#F5F2FF;}
html[data-theme="dark"] .table-wrap .selected-row td:first-child {box-shadow:inset -3px 0 0 #8C78EB!important;}
html[data-theme="light"] .table-wrap .selected-row td:first-child {box-shadow:inset -3px 0 0 #4F39F6!important;}
.row-action:focus-visible,.detail-cta .btn:focus-visible,.btn:focus-visible,
.table-sort:focus-visible{outline:2px solid #8C78EB!important;outline-offset:3px;}
/* Table design: Task # is column 1; clickable labels with a two-way sort glyph.
   Keep the actual <th> and buttons keyboard-accessible. */
.table-wrap .tasks-table {border-collapse:separate;border-spacing:0;table-layout:auto;}
.table-wrap .tasks-table thead th {vertical-align:middle;}
.table-wrap .tasks-table tbody::before {
  content:"";display:table-row;height:10px;
}
.table-wrap .tasks-table thead th {padding-inline:7px;}
.table-wrap .tasks-table tbody td {padding-inline:7px;}
.table-wrap .tasks-table tbody td:first-child {padding-inline-start:11px;}
.table-wrap .tasks-table th:first-child {min-width:94px;}
.table-wrap .tasks-table th:last-child {min-width:55px;}
.table-wrap .tasks-table th:nth-child(2){min-width:125px;}
.table-wrap .tasks-table th:nth-child(5){min-width:108px;}
.table-wrap .tasks-table th:nth-child(6){min-width:102px;}
.table-sort {
  display:inline-flex;align-items:center;justify-content:flex-start;gap:7px;
  padding:4px 1px;max-width:100%;border:0;border-radius:5px;
  color:inherit!important;background:transparent!important;
  font:inherit;font-weight:750;white-space:nowrap;text-align:right;
  transition:color .2s ease!important;transform:none!important;
}
.table-sort:hover {transform:none!important;}
.table-sort .sort-indicator {display:inline-flex;align-items:center;justify-content:center;flex:0 0 17px;width:17px;height:19px;border-radius:5px;}
.table-sort .sort-indicator svg{width:15px;height:15px;stroke:none!important;fill:none!important;overflow:visible;}
.table-sort .sort-indicator svg path {opacity:.40;transition:opacity .2s ease,color .2s ease;}
.table-sort[data-direction="asc"] .sort-up,
.table-sort[data-direction="desc"] .sort-down {opacity:1;}
.table-sort.is-active{font-weight:850;}
html[data-theme="dark"] .table-sort:hover,html[data-theme="dark"] .table-sort.is-active{color:#C5B9FF!important;}
html[data-theme="light"] .table-sort:hover,html[data-theme="light"] .table-sort.is-active{color:#4F39F6!important;}
html[data-theme="dark"] .table-sort.is-active .sort-indicator {background:rgba(140,120,235,.13);}
html[data-theme="light"] .table-sort.is-active .sort-indicator {background:rgba(79,57,246,.09);}
html[data-theme="dark"] .table-wrap .task-id-text {color:#C5B9FF;font-weight:850;font-variant-numeric:tabular-nums;}
html[data-theme="light"] .table-wrap .task-id-text {color:#4F39F6;font-weight:850;font-variant-numeric:tabular-nums;}
html[data-theme="dark"] .tasks-table thead th{border-bottom:1px solid #303656;}
html[data-theme="light"] .tasks-table thead th{border-bottom:1px solid #DEE2F0;}
@media(max-width:780px){
  /* Native table is replaced by mobile cards. Existing filtering/sorting also sorts cards. */
  .table-wrap .tasks-table tbody::before{display:none;}
}
@media(prefers-reduced-motion:reduce){.table-sort,.table-sort .sort-indicator svg path{transition:none!important;}}

/* ===== v9 follow-up polish: liquid glass, stronger action buttons, personal space ===== */
html[data-theme="dark"] {
  --brand-gradient: linear-gradient(135deg,#4F39F6 0%, #5E47F6 72%, #8C78EB 100%);
  --brand-gradient-soft: linear-gradient(135deg,rgba(79,57,246,.96) 0%, rgba(94,71,246,.92) 70%, rgba(140,120,235,.85) 100%);
}
html[data-theme="light"] {
  --brand-gradient: linear-gradient(135deg,#4F39F6 0%, #654DF7 72%, #8C78EB 100%);
  --brand-gradient-soft: linear-gradient(135deg,rgba(79,57,246,.96) 0%, rgba(101,77,247,.92) 70%, rgba(140,120,235,.84) 100%);
}
.brand-symbol,.stat-card.lavender .stat-icon,
.btn-primary,.login-logo,
html[data-theme="dark"] .btn-primary:not(.detail-cta .btn),
html[data-theme="light"] .btn-primary:not(.detail-cta .btn) {background:var(--brand-gradient)!important;color:#fff!important;}

/* Stronger glossy controls without lift */
.row-action,
.detail-cta .btn,
.sidebar .nav-link,
.sidebar-bottom .nav-link,
.theme-toggle,
.notify-btn,
.profile-toggle,
#taskFiles::file-selector-button,
#taskFiles::-webkit-file-upload-button {
  position:relative;overflow:hidden;
}
.row-action,
.detail-cta .btn,
html[data-theme="dark"] .sidebar .nav-link,
html[data-theme="light"] .sidebar .nav-link {
  transition:background .25s ease, box-shadow .25s ease, border-color .25s ease, color .25s ease!important;
}
.row-action::before,
.detail-cta .btn::before,
#taskFiles::file-selector-button,
#taskFiles::-webkit-file-upload-button {
  box-shadow:inset 0 1px 0 rgba(255,255,255,.26);
}
html[data-theme="dark"] .row-action,
html[data-theme="dark"] .detail-cta .btn,
html[data-theme="dark"] #taskFiles::file-selector-button,
html[data-theme="dark"] #taskFiles::-webkit-file-upload-button {
  background:linear-gradient(180deg,rgba(27,34,58,.98),rgba(20,27,48,.94))!important;
  border:1px solid rgba(122,108,255,.34)!important;
  color:#eef1ff!important;
  box-shadow:0 10px 28px rgba(8,14,30,.35), inset 0 1px 0 rgba(255,255,255,.1), 0 0 0 1px rgba(79,57,246,.05);
}
html[data-theme="light"] .row-action,
html[data-theme="light"] .detail-cta .btn,
html[data-theme="light"] #taskFiles::file-selector-button,
html[data-theme="light"] #taskFiles::-webkit-file-upload-button {
  background:linear-gradient(180deg,#fff,#f4f6ff)!important;
  border:1px solid rgba(79,57,246,.17)!important;
  color:#263455!important;
  box-shadow:0 10px 24px rgba(79,57,246,.08), inset 0 1px 0 rgba(255,255,255,.96);
}
html[data-theme="dark"] .row-action:hover,
html[data-theme="dark"] .detail-cta .btn:hover,
html[data-theme="dark"] #taskFiles:hover::file-selector-button,
html[data-theme="dark"] #taskFiles:hover::-webkit-file-upload-button {
  background:linear-gradient(180deg,rgba(31,39,70,.98),rgba(23,31,56,.96))!important;
  box-shadow:0 0 0 1px rgba(95,85,255,.34),0 0 24px rgba(95,85,255,.24),0 12px 28px rgba(10,12,28,.38), inset 0 1px 0 rgba(255,255,255,.16)!important;
  transform:none!important;
}
html[data-theme="light"] .row-action:hover,
html[data-theme="light"] .detail-cta .btn:hover,
html[data-theme="light"] #taskFiles:hover::file-selector-button,
html[data-theme="light"] #taskFiles:hover::-webkit-file-upload-button {
  background:linear-gradient(180deg,#fff,#f6f8ff)!important;
  box-shadow:0 0 0 1px rgba(79,57,246,.18),0 0 22px rgba(79,57,246,.11),0 12px 24px rgba(94,81,194,.08), inset 0 1px 0 rgba(255,255,255,1)!important;
  transform:none!important;
}
html[data-theme="dark"] .detail-cta #detailFinish{color:#e9fffb!important;border-color:rgba(29,193,146,.35)!important;background:linear-gradient(180deg,rgba(13,77,66,.92),rgba(11,55,47,.94))!important;}
html[data-theme="light"] .detail-cta #detailFinish{color:#0c6b5a!important;border-color:rgba(29,193,146,.22)!important;background:linear-gradient(180deg,#effcf7,#ddf7ee)!important;}
html[data-theme="dark"] .detail-cta #detailAction{color:#f3f1ff!important;}
html[data-theme="light"] .detail-cta #detailAction{color:#2a2d63!important;}

/* Sidebar button color refinements */
html[data-theme="dark"] .sidebar .nav-link{background:rgba(23,30,52,.72)!important;border:1px solid rgba(86,102,151,.12)!important;color:#ced6f3!important;}
html[data-theme="light"] .sidebar .nav-link{background:rgba(255,255,255,.74)!important;border:1px solid rgba(208,216,243,.55)!important;color:#3a486e!important;}
html[data-theme="dark"] .sidebar .nav-link:hover:not(.active){background:linear-gradient(135deg,rgba(28,35,61,.98),rgba(23,28,50,.94))!important;color:#eef0ff!important;box-shadow:0 8px 18px rgba(8,14,30,.22), 0 0 0 1px rgba(95,85,255,.08)!important;transform:none!important;}
html[data-theme="light"] .sidebar .nav-link:hover:not(.active){background:linear-gradient(135deg,#ffffff,#f4f6ff)!important;color:#283761!important;box-shadow:0 10px 20px rgba(61,76,125,.08)!important;transform:none!important;}
html[data-theme="dark"] .sidebar .nav-link.active{background:linear-gradient(135deg,rgba(79,57,246,.28),rgba(79,57,246,.16))!important;color:#f5f6ff!important;box-shadow:inset 0 0 0 1px rgba(120,102,255,.32), 0 16px 26px rgba(11,14,35,.28)!important;}
html[data-theme="light"] .sidebar .nav-link.active{background:linear-gradient(135deg,#f1eeff,#ebe8ff)!important;color:#3c29c7!important;box-shadow:inset 0 0 0 1px rgba(79,57,246,.16), 0 12px 22px rgba(79,57,246,.08)!important;}

/* Profile and notification liquid-glass panels */
.topbar-popover-wrap{position:relative;display:flex;align-items:center;}
.glass-popover{
  position:absolute;top:calc(100% + 14px);left:0;min-width:280px;max-width:min(340px,84vw);z-index:60;
  padding:14px;border-radius:22px;backdrop-filter:blur(22px) saturate(160%);-webkit-backdrop-filter:blur(22px) saturate(160%);
  box-shadow:0 18px 44px rgba(11,15,35,.18), inset 0 1px 0 rgba(255,255,255,.42);
}
.notify-wrap .glass-popover{left:auto;right:0;min-width:300px;}
.profile-wrap .glass-popover{left:auto;right:0;min-width:290px;}
html[data-theme="dark"] .glass-popover{background:linear-gradient(180deg,rgba(21,27,47,.76),rgba(17,22,40,.72));border:1px solid rgba(255,255,255,.09);color:#eef2ff;}
html[data-theme="light"] .glass-popover{background:linear-gradient(180deg,rgba(255,255,255,.78),rgba(247,249,255,.68));border:1px solid rgba(255,255,255,.66);color:#253353;}
.glass-popover-head,.profile-head,.personal-toolbar-head{display:flex;align-items:center;justify-content:space-between;gap:10px;}
.glass-popover-body{display:grid;gap:8px;margin-top:12px;max-height:280px;overflow:auto;padding-inline-end:4px;}
.notice-item,
.mini-link,
.space-btn,
.folder-chip{
  border:0;background:none;font:inherit;cursor:pointer;
}
.notice-item{width:100%;text-align:right;padding:11px 12px;border-radius:14px;line-height:1.9;}
html[data-theme="dark"] .notice-item{background:rgba(255,255,255,.04);color:#e4e7fb;border:1px solid rgba(255,255,255,.04);}
html[data-theme="light"] .notice-item{background:rgba(255,255,255,.44);color:#304163;border:1px solid rgba(79,57,246,.05);}
html[data-theme="dark"] .notice-item:hover{background:rgba(255,255,255,.07);}
html[data-theme="light"] .notice-item:hover{background:rgba(255,255,255,.66);}
.glass-empty{padding:18px 10px;text-align:center;color:inherit;opacity:.8;}
.mini-link{padding:4px 8px;border-radius:10px;color:inherit;opacity:.78;}
.profile-head{padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.10);}
.profile-head small{display:block;margin-top:3px;opacity:.72;}
.mini-avatar{width:44px;height:44px;font-size:16px;flex:none;}
.space-switch{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0 12px;}
.space-btn{padding:10px 12px;border-radius:14px;font-weight:700;transition:background .2s ease,color .2s ease, box-shadow .2s ease;}
html[data-theme="dark"] .space-btn{background:rgba(255,255,255,.05);color:#d6dcf9;}
html[data-theme="light"] .space-btn{background:rgba(255,255,255,.58);color:#37486e;}
.space-btn.active{background:var(--brand-gradient-soft)!important;color:#fff!important;box-shadow:0 10px 22px rgba(79,57,246,.22), inset 0 1px 0 rgba(255,255,255,.2)!important;}
.profile-note{font-size:12px;line-height:1.95;opacity:.84;margin-bottom:12px;}
.profile-logout{width:100%;justify-content:center;}
#notifyBadge{min-width:18px;height:18px;padding-inline:5px;border-radius:999px;position:absolute;top:-4px;inset-inline-start:-4px;background:var(--brand-gradient);color:#fff;font-size:10px;font-weight:800;display:grid;place-items:center;box-shadow:0 6px 16px rgba(79,57,246,.26);}
#notifyBadge[hidden]{display:none!important;}
.profile-toggle{padding:0;border:0;background:none!important;box-shadow:none!important;cursor:pointer;}

/* Personal space */
.personal-toolbar{margin:0 0 16px;padding:14px;border-radius:18px;}
html[data-theme="dark"] .personal-toolbar{background:linear-gradient(180deg,rgba(19,25,43,.92),rgba(16,21,37,.9));border:1px solid rgba(255,255,255,.06);}
html[data-theme="light"] .personal-toolbar{background:linear-gradient(180deg,#fcfcff,#f4f6ff);border:1px solid rgba(222,227,245,.88);}
.personal-toolbar-head{margin-bottom:12px;}
.personal-toolbar-head small{display:block;margin-top:4px;opacity:.78;}
.folder-strip{display:flex;flex-wrap:wrap;gap:8px;}
.folder-chip{padding:9px 14px;border-radius:999px;font-weight:700;}
html[data-theme="dark"] .folder-chip{background:rgba(255,255,255,.05);color:#d9e0fb;border:1px solid rgba(255,255,255,.08);}
html[data-theme="light"] .folder-chip{background:#fff;color:#415176;border:1px solid #e1e7f5;box-shadow:0 6px 14px rgba(79,57,246,.05);}
.folder-chip.active{background:var(--brand-gradient-soft)!important;color:#fff!important;border-color:transparent!important;box-shadow:0 10px 22px rgba(79,57,246,.18)!important;}
.folder-empty{padding:12px 0 0;font-size:12px;opacity:.78;}
.task-folder-inline{display:block;font-size:11px;font-weight:600;color:#8f97af;margin-top:4px;}
.task-folder-line{font-size:11px;color:#8f97af;margin-top:-5px;margin-bottom:10px;}
.detail-folder-tag{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;font-size:11px;font-weight:700;margin-inline-start:6px;}
html[data-theme="dark"] .detail-folder-tag{background:rgba(79,57,246,.14);color:#d8d0ff;border:1px solid rgba(125,110,255,.14);}
html[data-theme="light"] .detail-folder-tag{background:#f1edff;color:#513fcb;border:1px solid #ddd7ff;}

/* Form tweaks */
.field-title{display:flex;align-items:center;gap:6px;font-weight:800;}
.field .req{display:inline-flex;align-items:center;justify-content:center;color:#f05f72;line-height:1;}
#taskFiles{padding:10px 12px!important;background:var(--surface-subtle)!important;}
#taskFiles::file-selector-button,
#taskFiles::-webkit-file-upload-button{
  margin-inline-start:10px;padding:10px 16px;border-radius:12px;border:1px solid rgba(79,57,246,.14);cursor:pointer;font:inherit;font-weight:800;
}
.file-hint{margin-top:6px;display:block;}

/* Toast to liquid glass */
.toast{
  left:24px;bottom:24px;padding:12px 18px;border-radius:18px;backdrop-filter:blur(18px) saturate(160%);-webkit-backdrop-filter:blur(18px) saturate(160%);
  border:1px solid rgba(255,255,255,.18);box-shadow:0 16px 42px rgba(7,12,28,.24), inset 0 1px 0 rgba(255,255,255,.22)!important;
}
html[data-theme="dark"] .toast{background:linear-gradient(180deg,rgba(17,23,41,.76),rgba(17,22,38,.7));color:#f3f5ff;}
html[data-theme="light"] .toast{background:linear-gradient(180deg,rgba(255,255,255,.74),rgba(246,248,255,.66));color:#283759;}

@media(max-width:780px){
  .notify-wrap .glass-popover,.profile-wrap .glass-popover{right:0;left:auto;min-width:min(300px,92vw);}
  .topbar-popover-wrap{position:static;}
  .notify-wrap .glass-popover,.profile-wrap .glass-popover{position:fixed;top:72px;right:12px;}
}