/* Original Dawnby Health presentation, enhanced with small native interactions.
   21st.dev: designali-in/liquid-glass-button, educalvolpz/animated-tabs,
   unlumen/sidebar-001, arihantcodes_1f7b8c4d/avatar-stack, skovhm/data-table-toolbar.
   Layout, type scale, palette, card styling and content order come from health-workspace.css. */
body[data-dashboard-studio]{--studio-border:var(--studio-line);--studio-tint:color-mix(in srgb,var(--studio-accent) 9%,var(--studio-surface));--refine-hover:color-mix(in srgb,var(--studio-accent) 11%,var(--studio-surface));--refine-sheen:inset 0 1px 0 color-mix(in srgb,var(--studio-surface) 70%,transparent),0 3px 12px color-mix(in srgb,var(--studio-accent) 9%,transparent)}
body[data-dashboard-studio] [hidden]{display:none!important}
/* Glass rims and gentle press feedback, without moving button labels or distorting text. */
body[data-dashboard-studio] :is(.topbar .icon-button,.workspace-search,#main[data-health-view] .button){transition:background-color 160ms ease,border-color 160ms ease,box-shadow 160ms ease,filter 160ms ease}
body[data-dashboard-studio] .topbar .icon-button:hover,body[data-dashboard-studio] .topbar .icon-button:focus-visible,#main[data-health-view] .button.secondary:hover:not(:disabled){background:var(--refine-hover);border-color:color-mix(in srgb,var(--studio-accent) 24%,transparent);color:var(--studio-accent);box-shadow:var(--refine-sheen)}
#main[data-health-view] .button.primary:hover:not(:disabled){filter:brightness(1.06);box-shadow:inset 0 1px 0 #ffffff32,0 5px 18px color-mix(in srgb,var(--studio-accent) 20%,transparent)}
#main[data-health-view] .button.primary:active:not(:disabled){filter:brightness(.96);box-shadow:inset 0 2px 4px #00000012}
body[data-dashboard-studio] .workspace-search:focus-within{outline:2px solid var(--studio-accent);outline-offset:2px;box-shadow:var(--refine-sheen)}
body[data-dashboard-studio] #notices-bell-count{background:#ad304d;color:#fff}
/* A single travelling surface sits beneath the original navigation labels. */
body[data-dashboard-studio] #navigation{position:relative;isolation:isolate}
body[data-dashboard-studio] #navigation .nav-item{position:relative;z-index:1}
body[data-dashboard-studio] #navigation::before{content:'';position:absolute;left:0;top:0;width:var(--hover-width,0px);height:var(--hover-height,0px);transform:translate(var(--hover-x,0px),var(--hover-y,0px));border-radius:24px;background:var(--refine-hover);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--studio-accent) 14%,transparent),var(--refine-sheen);pointer-events:none;z-index:0;opacity:0;transition:opacity 140ms ease}
body[data-dashboard-studio] #navigation.refine-hover-ready::before{transition:transform 200ms cubic-bezier(.2,.8,.2,1),width 200ms ease,height 200ms ease,opacity 140ms ease}
body[data-dashboard-studio] #navigation.refine-hover-on::before{opacity:1}
body[data-dashboard-studio] #navigation.refine-hover-on .nav-item:hover:not(.active){background:transparent;box-shadow:none}
.refine-indicator{position:absolute;left:0;top:0;z-index:0;pointer-events:none;border-radius:24px;background:var(--studio-surface);border:1px solid var(--studio-line);box-shadow:none;transform-origin:0 0}
body[data-dashboard-studio] #navigation.refine-moving .nav-item.active{background:transparent;box-shadow:none;backdrop-filter:none}
/* Status choices keep their familiar pill shape. Only the background glides. */
.studio-schedule-toolbar{display:flex;gap:12px 16px;align-items:center;flex-wrap:wrap;margin:0 0 14px}
#main[data-health-view="today"] .hw-schedule-filters{position:relative;isolation:isolate;flex:1 1 auto;margin:0;padding:3px;gap:6px;min-width:0}
#main[data-health-view="today"] .hw-schedule-filters button{position:relative;z-index:1;display:flex;align-items:center;gap:7px;transition:box-shadow 160ms ease,border-color 160ms ease;white-space:nowrap}
#main[data-health-view="today"] .hw-schedule-filters button:hover{background:var(--refine-hover);color:var(--studio-accent)}
#main[data-health-view="today"] .hw-schedule-filters button[aria-pressed="true"]{background:var(--studio-tint);color:var(--studio-accent);border-color:color-mix(in srgb,var(--studio-accent) 23%,transparent);box-shadow:var(--refine-sheen)}
#main[data-health-view="today"] .hw-schedule-filters.refine-moving button[aria-pressed="true"]{background:transparent;box-shadow:none;border-color:transparent}
.hw-schedule-filters>.refine-indicator{background:var(--studio-tint);border-color:color-mix(in srgb,var(--studio-accent) 23%,transparent);box-shadow:var(--refine-sheen)}
.studio-filter-count{display:inline-grid;place-items:center;min-width:22px;min-height:22px;padding:0 5px;border-radius:11px;background:color-mix(in srgb,var(--studio-muted) 7%,var(--studio-surface));color:var(--studio-text);font-family:var(--dawnby-font);font-size:12px;font-weight:700}
.studio-schedule-search{display:flex;align-items:center;gap:10px;min-height:48px;flex:1 1 240px;max-width:320px;padding:0 8px 0 16px;border:1px solid var(--studio-line);border-radius:24px;background:var(--studio-surface);box-shadow:inset 0 1px 0 var(--studio-line);color:var(--studio-muted)}
.studio-schedule-search>svg{width:18px;height:18px;flex:0 0 18px}
.studio-schedule-search:focus-within{outline:2px solid var(--studio-accent);outline-offset:2px;box-shadow:var(--refine-sheen)}
.studio-schedule-search input{width:100%;min-width:0;outline:0;border:0;padding:8px 0;box-shadow:none;background:none;color:var(--studio-text);font:inherit;font-size:13px}
.studio-schedule-search input::-webkit-search-cancel-button{-webkit-appearance:none}
#studio-clear-search{display:grid;place-items:center;flex:0 0 var(--dawnby-interaction-comfortable-touch-target);width:var(--dawnby-interaction-comfortable-touch-target);height:var(--dawnby-interaction-comfortable-touch-target);border:0;border-radius:50%;background:transparent;color:var(--studio-muted);cursor:pointer}
#studio-clear-search:hover{color:var(--studio-accent);background:var(--refine-hover)}
#studio-clear-search svg{width:16px;height:16px}
.studio-schedule-footer{padding:10px 4px;color:var(--studio-muted);font-size:13px}
.studio-schedule-footer p{margin:0}
#main[data-health-view="today"] .studio-next-open{display:grid;place-items:center;width:48px;height:48px;min-width:48px;flex:0 0 48px;margin-left:auto;padding:0;border:0;background:var(--studio-surface);color:var(--studio-accent);border-radius:24px;font-size:0}
#main[data-health-view="today"] .studio-next-open::after{content:'↗';font-size:22px;line-height:1}
/* Names on hover/focus retain the current consent-scoped portraits and actions. */
#main[data-health-view="today"] .hw-avatar-button .avatar{transition:box-shadow 180ms ease,outline-color 180ms ease;outline:2px solid transparent;outline-offset:2px}
#main[data-health-view="today"] .hw-avatar-button:hover .avatar,#main[data-health-view="today"] .hw-avatar-button:focus-visible .avatar{outline-color:color-mix(in srgb,var(--studio-accent) 50%,transparent);box-shadow:0 4px 12px color-mix(in srgb,var(--studio-accent) 14%,transparent)}
/* One short entrance for opened surfaces; no replaying rows or animated numbers. */
body[data-dashboard-studio] #health-person-card{animation:refine-surface-in 150ms ease-out}
body[data-dashboard-studio] #toast:not([hidden]){animation:refine-surface-in 160ms ease-out}
@keyframes refine-surface-in{from{opacity:0;translate:0 4px}to{opacity:1;translate:0 0}}
.studio-eyebrow{margin:0 0 8px;color:var(--studio-muted);font-size:12px;letter-spacing:.08em;font-weight:600}
/* Native modal: focus containment and Escape are supplied by <dialog>. */
#studio-command{width:min(590px,calc(100vw - 32px));max-height:min(740px,85dvh);margin:auto;padding:0;border:1px solid var(--studio-border);border-radius:24px;color:var(--studio-text);background:var(--studio-surface);box-shadow:0 40px 100px #19132940;overflow:hidden;font-family:var(--dawnby-font)}
#studio-command[open]{display:flex;flex-direction:column;animation:studio-dialog-in .18s ease-out}
#studio-command::backdrop{background:#17112162;backdrop-filter:blur(5px)}
.studio-command-head{display:flex;justify-content:space-between;align-items:center;padding:24px 24px 20px;gap:16px}
.studio-command-head .studio-eyebrow{font-size:.59rem;margin:0 0 7px;color:var(--studio-accent)}
.studio-command-head h2{margin:0;font-size:1.15rem;font-weight:600;letter-spacing:-.04em}
#studio-command-close{width:var(--dawnby-interaction-comfortable-touch-target);height:var(--dawnby-interaction-comfortable-touch-target);flex:0 0 var(--dawnby-interaction-comfortable-touch-target);display:grid;place-items:center;border:1px solid var(--studio-border);border-radius:12px;color:var(--studio-muted);background:none;font-size:24px;cursor:pointer}
.studio-command-search{display:flex;align-items:center;gap:12px;margin:0 20px 12px;padding:0 14px;border:1px solid var(--studio-border);border-radius:12px;background:var(--studio-page);min-height:50px}
.studio-command-search:focus-within{border-color:var(--studio-accent);box-shadow:0 0 0 3px var(--studio-tint)}
.studio-command-search svg{width:20px;height:20px;flex:0 0 20px;color:var(--studio-accent)}
#studio-command-input{width:100%;min-width:0;background:none;border:0;outline:0;box-shadow:none;padding:12px 0;font:inherit;font-size:.82rem;color:inherit}
#studio-command-list{overflow:auto;overscroll-behavior:contain;padding:0 12px 12px;min-height:0}
.studio-command-group{padding:12px 12px 8px;font-size:.61rem;letter-spacing:.08em;text-transform:uppercase;color:var(--studio-muted);font-weight:600}
.studio-command-option{display:flex;align-items:center;gap:12px;min-height:48px;padding:8px 14px;border-radius:10px;font-size:.78rem;cursor:pointer;transition:background-color .12s,color .12s}
.studio-command-option[aria-selected="true"]{background:var(--studio-tint);color:var(--studio-accent)}
.studio-command-icon{display:grid;place-items:center;width:24px;height:24px;color:var(--studio-muted)}
.studio-command-icon svg{width:20px;height:20px}
.studio-command-arrow{margin-left:auto;opacity:0;font-size:18px}
[aria-selected="true"]>.studio-command-arrow{opacity:1}
#studio-command-empty{padding:16px 24px;font-size:.78rem;color:var(--studio-muted)}
.studio-command-foot{display:flex;flex-wrap:wrap;gap:18px;padding:14px 24px;border-top:1px solid var(--studio-border);font-size:.6rem;color:var(--studio-muted)}
.studio-command-foot kbd{display:inline-block;font:inherit;border:1px solid var(--studio-border);padding:2px 4px;border-radius:4px;margin-right:3px}
@keyframes studio-dialog-in{from{opacity:0;transform:translateY(8px) scale(.99)}to{opacity:1;transform:none}}

#studio-command-trigger:focus-visible,#studio-command button:focus-visible,#studio-clear-search:focus-visible{outline:2px solid var(--studio-accent);outline-offset:2px}
#studio-command .studio-command-head h2{font-size:20px}
#studio-command .studio-command-option,#studio-command-input{font-size:15px}
#studio-command .studio-command-group,#studio-command .studio-command-foot{font-size:12px}
#studio-command-close{min-width:48px;min-height:48px}
@media(max-width:1100px){.studio-schedule-search{max-width:none}.studio-schedule-toolbar{align-items:stretch}}
@media(max-width:640px){.studio-schedule-search{flex-basis:100%}.studio-schedule-toolbar{gap:12px}#main[data-health-view="today"] .hw-schedule-filters{width:100%;gap:5px;padding:3px}#main[data-health-view="today"] .hw-schedule-filters button{flex:1 1 auto;padding:8px 11px}.studio-command-head{padding:20px 16px 16px}.studio-command-foot{gap:10px;padding:12px 16px}}
@media(prefers-reduced-motion:reduce){body[data-dashboard-studio] *,body[data-dashboard-studio] *::before,body[data-dashboard-studio] *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

#main[data-health-view="today"] .refine-live-filter{display:flex;align-items:center;gap:10px;min-height:var(--dawnby-interaction-comfortable-touch-target);padding:0;border:0;border-radius:10px;background:transparent;color:inherit;font:inherit;text-align:left;cursor:pointer;transition:background-color 160ms ease,box-shadow 160ms ease}
#main[data-health-view="today"] .refine-live-filter:hover,#main[data-health-view="today"] .refine-live-filter:focus-visible{background:var(--studio-tint);box-shadow:0 0 0 5px var(--studio-tint)}
#main[data-health-view="today"] .refine-live-filter:focus-visible{outline:2px solid var(--studio-accent);outline-offset:4px}
/* Small contrast corrections keep the same neutral palette. */
#main[data-health-view="today"] .hw-count{color:var(--studio-text)}
#main[data-health-view="today"] .hw-schedule-filters button:not([aria-pressed="true"]){color:color-mix(in srgb,var(--studio-muted) 85%,var(--studio-text))}
