/* Taskly v11 — verified glass surfaces, clamped popovers and controls */
:root{--v11-brand:linear-gradient(120deg,#4F39F6 0%,#563EF7 78%,#8C78EB 100%)}
/* Space switch is accessible from both the profile and the sidebar. */
.sidebar .personal-lock{margin-inline-start:auto;font-weight:800;font-size:13px;opacity:.55}
html[data-theme="dark"] .sidebar .nav-link,
html[data-theme="dark"] .sidebar-bottom .nav-link{
  background:linear-gradient(145deg,#18233d,#131d33)!important;
  border:1px solid #2a3958!important;color:#ced8f3!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05)!important;transform:none!important;
}
html[data-theme="dark"] .sidebar .nav-link:hover,
html[data-theme="dark"] .sidebar-bottom .nav-link:hover{
  background:linear-gradient(145deg,#222b50,#182440)!important;
  color:#f5f3ff!important;border-color:rgba(110,97,255,.5)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 0 18px rgba(79,57,246,.17)!important;transform:none!important;
}
html[data-theme="dark"] .sidebar .nav-link.active{
  background:linear-gradient(110deg,rgba(79,57,246,.43),rgba(75,58,216,.24))!important;
  border-color:rgba(123,107,255,.57)!important;color:#fff!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.17),0 0 19px rgba(79,57,246,.21)!important;
}
html[data-theme="light"] .sidebar .nav-link,
html[data-theme="light"] .sidebar-bottom .nav-link{background:linear-gradient(145deg,#fff,#f5f7ff)!important;border-color:#e1e7f5!important;color:#41516e!important;transform:none!important;}
html[data-theme="light"] .sidebar .nav-link:hover{border-color:#b9affb!important;color:#4F39F6!important;background:linear-gradient(145deg,#fff,#f1efff)!important;transform:none!important;}
html[data-theme="light"] .sidebar .nav-link.active{background:linear-gradient(120deg,#eeebff,#e9e5ff)!important;color:#4830e8!important;border-color:#c6baff!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.84),0 8px 22px rgba(79,57,246,.10)!important;}

/* Left-side details — the rest of the buttons stay as they were. */
html[data-theme="dark"] .detail-cta #detailAction,
html[data-theme="dark"] .row-action[data-status="todo"]{
  background:linear-gradient(150deg,#5441e1,#352891)!important;
  border-color:#796af7!important;color:#fff!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 4px 14px rgba(79,57,246,.15)!important;
}
html[data-theme="dark"] .detail-cta #detailFinish{background:linear-gradient(150deg,#126d5a,#11483d)!important;border-color:#24a78c!important;color:#e9fff8!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 4px 15px rgba(11,159,119,.13)!important;}
html[data-theme="dark"] .detail-cta #detailAction:hover,
html[data-theme="dark"] .row-action[data-status="todo"]:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 0 0 1px rgba(135,124,255,.42),0 0 23px rgba(79,57,246,.38)!important;transform:none!important;}
html[data-theme="dark"] .detail-cta #detailFinish:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.26),0 0 0 1px rgba(41,200,163,.3),0 0 22px rgba(11,159,119,.27)!important;transform:none!important;}
html[data-theme="light"] .detail-cta #detailAction{color:#452cdb!important;background:linear-gradient(155deg,#f4f2ff,#e4dfff)!important;border-color:#b8b0ff!important;}
html[data-theme="light"] .detail-cta #detailFinish{color:#047e62!important;background:linear-gradient(155deg,#effcf7,#dcf9ed)!important;border-color:#9ed8c3!important;}
.detail-cta .btn:hover,.row-action:hover{transform:none!important;}

/* Do not allow a popover to be clipped by page edges, even in RTL + collapsed sidebar. */
.topbar,.header-actions,.topbar-popover-wrap{overflow:visible!important;}
.topbar{position:relative;z-index:35;}
.topbar-popover-wrap .glass-popover,
.notify-wrap .glass-popover,.profile-wrap .glass-popover{
  position:fixed!important;top:var(--glass-top,78px)!important;
  left:var(--glass-left,12px)!important;right:auto!important;
  width:min(324px,calc(100vw - 24px))!important;
  min-width:0!important;max-width:calc(100vw - 24px)!important;
  max-height:calc(100dvh - 26px)!important;
  overflow-y:auto!important;overflow-x:hidden!important;
  padding:17px 16px 14px!important;border-radius:26px!important;
  isolation:isolate;
  background:linear-gradient(156deg,rgba(255,255,255,.13),rgba(255,255,255,.016) 42%,rgba(255,255,255,.055))!important;
  backdrop-filter:blur(28px) saturate(195%) brightness(1.02)!important;
  -webkit-backdrop-filter:blur(28px) saturate(195%) brightness(1.02)!important;
  box-shadow:0 22px 65px rgba(1,7,25,.29),inset 0 1px 0 rgba(255,255,255,.25),inset 0 -1px 0 rgba(255,255,255,.07)!important;
}
html[data-theme="dark"] .topbar-popover-wrap .glass-popover{
  background:linear-gradient(151deg,rgba(66,78,119,.54),rgba(21,29,58,.43) 52%,rgba(39,44,85,.47))!important;
  border:1px solid rgba(220,229,255,.32)!important;color:#fbfbff!important;
}
html[data-theme="light"] .topbar-popover-wrap .glass-popover{
  background:linear-gradient(151deg,rgba(255,255,255,.68),rgba(236,243,255,.43) 55%,rgba(246,241,255,.47))!important;
  border:1px solid rgba(255,255,255,.90)!important;color:#253350!important;
}
.glass-popover:before{
  content:"";pointer-events:none;position:absolute;inset:1px 1px auto;height:46%;border-radius:25px 25px 56% 56%;
  background:linear-gradient(172deg,rgba(255,255,255,.18),rgba(255,255,255,0) 74%);z-index:-1;
}
.glass-popover-head{padding-bottom:10px;border-bottom:1px solid rgba(255,255,255,.15);}
.glass-popover-body{position:relative;z-index:1;}
html[data-theme="dark"] .notice-item,
html[data-theme="dark"] .space-btn:not(.active){background:rgba(7,13,30,.28)!important;border:1px solid rgba(232,238,255,.13)!important;color:#f5f6ff!important;}
html[data-theme="light"] .notice-item,
html[data-theme="light"] .space-btn:not(.active){background:rgba(255,255,255,.36)!important;border:1px solid rgba(255,255,255,.44)!important;color:#293a59!important;}
#profileToggle{display:grid!important;place-items:center;flex:none;cursor:pointer;overflow:hidden!important;}
#profilePanel .space-switch{position:relative;z-index:2;}
.space-btn{min-height:41px;line-height:1.6;}
/* Fix badge being pushed under the bell by the inherited small red-dot CSS. */
#notifyBtn{position:relative!important;overflow:visible!important;isolation:isolate;}
#notifyBtn #notifyBadge{
  display:grid;place-items:center;position:absolute!important;inset:auto!important;top:-8px!important;right:-8px!important;
  width:auto!important;min-width:20px!important;height:20px!important;
  padding:0 4px!important;margin:0!important;box-sizing:border-box!important;
  color:#fff!important;font-size:10px!important;font-weight:900!important;line-height:1!important;
  border:2px solid #11192d!important;border-radius:999px!important;
  background:var(--v11-brand)!important;z-index:6!important;
  box-shadow:0 3px 10px rgba(79,57,246,.35)!important;pointer-events:none!important;
}
html[data-theme="light"] #notifyBtn #notifyBadge{border-color:#fff!important;}
#notifyBtn #notifyBadge[hidden]{display:none!important;}
/* iOS-like glass toasts */
.toast{
  overflow:hidden;isolation:isolate;max-width:min(420px,calc(100vw - 28px));
  padding:15px 20px!important;border-radius:23px!important;
  backdrop-filter:blur(28px) saturate(200%)!important;
  -webkit-backdrop-filter:blur(28px) saturate(200%)!important;
  box-shadow:0 16px 42px rgba(2,8,28,.24),inset 0 1px 0 rgba(255,255,255,.27)!important;
}
html[data-theme="dark"] .toast{background:linear-gradient(145deg,rgba(65,75,110,.54),rgba(18,29,61,.43),rgba(45,39,83,.38))!important;border:1px solid rgba(232,238,255,.31)!important;color:#fbfbff!important;}
html[data-theme="light"] .toast{background:linear-gradient(145deg,rgba(255,255,255,.70),rgba(234,242,255,.50),rgba(249,245,255,.43))!important;border:1px solid rgba(255,255,255,.95)!important;color:#273653!important;}
.toast:before{content:"";pointer-events:none;position:absolute;inset:1px 1px auto;height:48%;background:linear-gradient(180deg,rgba(255,255,255,.12),transparent);border-radius:23px 23px 60% 60%;}
/* Confirm save/delete and create-folder operations are real modals, not browser confirm/prompt. */
.modal-overlay.glass-modal-overlay{
  position:fixed;inset:0;display:grid;place-items:center;z-index:150;
  padding:20px;background:rgba(7,12,26,.36)!important;
  backdrop-filter:blur(18px) saturate(145%)!important;
  -webkit-backdrop-filter:blur(18px) saturate(145%)!important;
}
html[data-theme="light"] .modal-overlay.glass-modal-overlay{background:rgba(30,41,72,.22)!important;}
.glass-confirm-card{
  width:min(100%,420px);max-height:calc(100dvh - 40px);padding:28px 27px;
  overflow-y:auto;border-radius:28px!important;
  backdrop-filter:blur(29px) saturate(175%)!important;
  -webkit-backdrop-filter:blur(29px) saturate(175%)!important;
  box-shadow:0 25px 70px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.25)!important;
}
html[data-theme="dark"] .glass-confirm-card{background:linear-gradient(148deg,rgba(59,70,109,.75),rgba(20,28,51,.74))!important;border:1px solid rgba(224,234,255,.22)!important;color:#fbfcff!important;}
html[data-theme="light"] .glass-confirm-card{background:linear-gradient(148deg,rgba(255,255,255,.85),rgba(238,242,255,.77))!important;border:1px solid rgba(255,255,255,.95)!important;color:#253451!important;}
.glass-confirm-card h2{font-size:20px;line-height:1.9;margin:12px 0 5px;}
.glass-confirm-card p{line-height:1.95;margin-bottom:20px;}
html[data-theme="dark"] .glass-confirm-card p{color:#d3dbf0!important;}
html[data-theme="light"] .glass-confirm-card p{color:#52627e!important;}
.confirmation-emblem{width:52px;height:52px;border-radius:18px;display:grid;place-items:center;background:var(--v11-brand);color:#fff;box-shadow:0 10px 24px rgba(79,57,246,.25);}
.confirmation-emblem svg{width:24px;height:24px;stroke:currentColor;stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.confirmation-emblem.danger{background:linear-gradient(140deg,#ef577d,#b62b57);box-shadow:0 10px 24px rgba(239,87,125,.19);}
.confirm-actions{display:flex;gap:12px;justify-content:flex-end;align-items:center;margin-top:22px;}
.confirm-actions .btn{flex:1;min-height:45px;transform:none!important;}
.confirm-actions .confirm-danger{background:linear-gradient(120deg,#de3d69,#b9234f)!important;border:1px solid #ed7596!important;color:#fff!important;}
.glass-folder-card form{margin-top:20px;}
.glass-folder-card .field{margin-bottom:0;}
/* Responsive: profile must stay visible and popovers remain inset from the viewport. */
@media(max-width:780px){.topbar-popover-wrap .glass-popover{position:fixed!important;top:var(--glass-top,72px)!important;left:var(--glass-left,12px)!important;right:auto!important;}}
@media(max-width:450px){.profile-wrap .top-avatar{display:grid!important;}.header-actions{gap:7px!important;}.topbar{gap:8px!important;}.notify-wrap #notifyBadge{min-width:20px!important;}}
@media(prefers-reduced-motion:reduce){.glass-popover,.toast,.glass-confirm-card{transition:none!important;animation:none!important;}}