/* Soft, brief settling motion across the navigation controls. */
:root{--spring-ease:cubic-bezier(.22,1.38,.45,1)}
.view-switch:before,.theme-switch:before{transition:transform 420ms var(--spring-ease),background-color 180ms ease}
.view-switch:has(#tree-view.active):before{transform:translateX(100%)}
.view-switch:has(#grid-view.active):before{transform:translateX(200%)}
.sidebar .brand.contenthub-brand{height:132px;padding-top:27px;padding-bottom:15px}
.sidebar .contenthub-logo{width:118px}
.login-brand .contenthub-logo{width:124px}
.login-card:has(.login-brand){padding-top:42px}
.sidebar nav{position:relative;isolation:isolate;display:flow-root}
.sidebar .nav-item{position:relative;z-index:1}
.sidebar .nav-item.active{background:transparent;box-shadow:none}
.sidebar .nav-item.active:before{opacity:0}
.nav-indicator{position:absolute;pointer-events:none;z-index:0;left:0;right:0;top:0;border-radius:6px;background:var(--hover);transition:transform 420ms var(--spring-ease),height 250ms var(--spring-ease),background-color 180ms ease}
/* Navigation and appearance controls stay neutral; orange is reserved for actions. */
.nav-indicator:before{content:none}
.sidebar .nav-item.active>i{color:inherit}
html[data-appearance=system] .theme-switch [data-resolved=true]{box-shadow:none}
.theme-switch{width:108px}
.inspector-content .upload-section[hidden],.inspector-content #details[hidden]{display:none!important}
.inspector-content{overflow-x:hidden}
.inspector-content #details{border-top:0;padding-top:0;margin-top:0}
.inspector-content #details>.detail-label{display:flex;align-items:center;justify-content:space-between;min-height:58px;margin:0}
.detail-close{font-size:22px;font-weight:300;color:var(--muted);width:28px;min-height:28px;height:28px;padding:0}
.inspector-content .detail-preview{margin-top:0}
@media(max-width:780px){.sidebar .brand.contenthub-brand{height:70px;padding:15px 1px 5px}.sidebar .contenthub-logo{width:34px}.login-card:has(.login-brand){padding-top:36px}.inspector-content #details>.detail-label{min-height:44px}}
@media(prefers-reduced-motion:reduce){.view-switch:before,.theme-switch:before,.nav-indicator{transition:none!important}}

/* File type labels sit centrally inside the document outline at every icon size. */
.file-icon.file-document svg{opacity:1}
.file-icon.file-document path{opacity:.55}
.file-icon.file-document text{fill:currentColor;stroke:none;font-weight:700;font-family:inherit}

/* Device access settings use the existing account-card surfaces. */
.device-create-row{display:flex;gap:8px;align-items:center;margin:7px 0 16px}
.device-create-row input{min-width:0;flex:1;margin:0!important}
.device-create-row button{flex-shrink:0;white-space:nowrap}
#device-token-result{padding:16px 0 0;border-top:1px solid var(--line);margin-top:14px}
#device-token-result[hidden],#device-token-form[hidden]{display:none}
#device-token-result .field-hint{margin-bottom:12px}
#device-token-list{margin-top:20px}
#device-token-list h4{font-size:13px;font-weight:500;margin:0 0 10px}
.device-token-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;border-top:1px solid var(--line)}
.device-token-row>div{min-width:0}
.device-token-row strong{display:block;font-size:13px;font-weight:500;overflow-wrap:anywhere}
.device-token-row span{display:block;font-size:12px;color:var(--muted);margin-top:4px}
.device-token-row button,#device-token-copy,#device-token-done{border:1px solid var(--line);font-size:12px}
@media(max-width:600px){.device-create-row{flex-wrap:wrap}.device-create-row input{flex-basis:100%}}

/* Match the public download logo at the same mobile breakpoint. */
@media(max-width:480px){.login-brand .contenthub-logo{width:114px}}

/* Group file actions while keeping one flat keyboard-navigation order. */
#context .context-group + .context-group{border-top:1px solid var(--line);margin-top:5px;padding-top:5px}
#context .context-heading{padding:5px 10px 3px;color:var(--muted);font-size:10px;font-weight:500;line-height:1.3}
/* Selection uses the same neutral surface as hover in every file view. */
.file-row.selected,.file-row.selected:hover,.grid-files .file-row.selected,.grid-files .file-row.selected:hover{background:var(--hover)}
