:root {
    --sdlt-accent: #8BA4CC;
    --sdlt-accent-muted: #304F80;
    --sdlt-accent-muted-transparent: rgba(48, 79, 128, 0.3);
    --sdlt-accent-muted-selection: rgba(48, 79, 128, 0.99);
    --sdlt-text-on-accent: #000000;
    --sdlt-text-muted: #cacaca;
    --sdlt-text-faint: #909090;

    /* Sizing */
    --sdlt-header-height: 48px;
    --sdlt-markdown-header-height: 56px;
    --sdlt-ribbon-width: 48px;

    
    --sdlt-gradient-base: linear-gradient(135deg, var(--sdlt-base-bg-start), var(--sdlt-base-bg-end));
    --sdlt-gradient-content: linear-gradient(135deg, var(--sdlt-content-bg-start), var(--sdlt-content-bg-end));
    --sdlt-gradient-subtle: linear-gradient(160deg, transparent, rgba(255, 255, 255, 0.02));

    
    --sdlt-overlay-bg: rgba(255, 255, 255, 0.05);
    --sdlt-overlay-border: rgba(255, 255, 255, 0.08);
    --sdlt-shadow-active: 0 0 3px 1px rgba(0, 0, 0, 0.5);

    
    --sdlt-tag-indicator: #caca00;
    --sdlt-graph-line: #404050;
    --sdlt-graph-line-highlight: #507090;
    --sdlt-search-border: #404040;

    --sdlt-base-bg-start: #202028;
    --sdlt-base-bg-end: #1B2020;
    --sdlt-content-bg-start: #222832;
    --sdlt-content-bg-start-transparent: rgba(34, 40, 50, 0.3);
    --sdlt-content-bg-end: #212223;
    --sdlt-content-bg-end-transparent: rgba(33, 34, 35, 0.3);
    --sdlt-border: #1A1F28;
}



body {
    background: var(--sdlt-gradient-base);

    --file-header-justify: left;
    --file-line-width: 100%;
}

.workspace-tabs,
.workspace-ribbon,
.workspace-ribbon.is-collapsed,
.workspace-ribbon.mod-left.is-collapsed,
.workspace-ribbon.mod-right.is-collapsed,
.titlebar,
.workspace-tabs .workspace-leaf,
.workspace-tab-header-container,
.workspace-tab-container-before,
.workspace-tab-container-before.is-before-active,
.workspace-tab-container-before.is-before-active .workspace-tab-header-inner,
.workspace-tab-container-after,
.workspace-tab-container-after.is-after-active,
.workspace-tab-container-after.is-after-active .workspace-tab-header-inner,
.workspace-tab-header.is-before-active,
.workspace-tab-header.is-before-active .workspace-tab-header-inner,
.workspace-tab-header.is-after-active,
.workspace-tab-header.is-after-active .workspace-tab-header-inner,
.workspace-leaf .view-header-title-container:after,
.workspace-leaf.mod-active .view-header-title-container:after,
.status-bar,
::-webkit-scrollbar {
    background: transparent;
    border: 0;
}



.workspace-tab-header-container {
    height: var(--sdlt-header-height);
    border-bottom: 2px solid var(--sdlt-border);
    background: var(--sdlt-gradient-subtle);
}

.workspace-ribbon {
    width: var(--sdlt-ribbon-width);
}

.side-dock-ribbon {
    flex: 0 0 48px;
}

.workspace-ribbon.mod-right {
    position: absolute;
    right: 0;
}

.workspace-ribbon.is-collapsed {
    border: none !important;
}

.workspace-ribbon-collapse-btn {
    margin-top: -4px;
}

.workspace-tab-header.is-active {
    color: white;
}



.workspace-leaf-resize-handle {
    background: transparent;
}

.workspace {
    padding-top: 24px;
}

.workspace-ribbon.mod-left {
    margin-top: var(--sdlt-header-height);
}

.workspace-split {
    background: var(--sdlt-gradient-content);
    background-attachment: fixed;
}

.workspace-split.mod-left-split {
    border-top-left-radius: 8px;
    border-left: 2px solid var(--sdlt-border);
    border-top: 2px solid var(--sdlt-border);
}

.workspace-split.mod-left-split.is-collapsed + .workspace-split.mod-root {
    border-top-left-radius: 8px;
}

.workspace-split.mod-root, .workspace-split.mod-right-split {
    border-top: 2px solid var(--sdlt-border);
}

.workspace-split .workspace-tabs {
    border-bottom: 2px solid var(--sdlt-border);
}

.workspace-split.mod-root {
    border-left: 2px solid var(--sdlt-border);
    border-right: 2px solid var(--sdlt-border);
}

.workspace-split .nav-header {
    height: var(--sdlt-header-height);
    padding: 4px 6px;
    border-bottom: 2px solid var(--sdlt-border);
}

.workspace-tabs {
    padding-right: 0;
}

.nav-action-button {
    margin-top: 4px;
}

.workspace-leaf-content .nav-header + * {
    padding: 6px 0;
}

.workspace-tab-container-before {
    width: 6px;
}



.workspace-split.mod-root .view-header {
    border-bottom: 2px solid var(--sdlt-border) !important;
}

.workspace-split.mod-root .view-content {
    background: transparent;
}

.workspace-split.mod-root > .workspace-leaf .view-header-title-container:after {
    background: transparent !important;
}

.workspace-leaf-content .view-actions {
    margin-right: 12px;
}

.workspace-leaf-content .view-actions .view-action svg {
    margin-top: 4px;
}

body:not(.is-mobile) .workspace-leaf-content[data-type="markdown"] .view-actions .view-action svg,
body:not(.is-mobile) .workspace-leaf-content[data-type="bases"] .view-actions .view-action svg {
    margin-top: 8px;
}

.workspace > .workspace-split {
    padding-bottom: 0;
}


.workspace-leaf-content .view-header {
    background: transparent !important;
    border: none !important;
}



body:not(.native-scrollbars) ::-webkit-scrollbar {
    width: 6px;
}

body:not(.native-scrollbars) .workspace-leaf-content .nav-header + *:hover::-webkit-scrollbar-thumb {
    border: none;
    
}

body:not(.native-scrollbars) .workspace-leaf-content .view-content:hover *::-webkit-scrollbar-thumb {
    border: none;
    
}

body:not(.native-scrollbars) ::-webkit-scrollbar-thumb {
    border-radius: 0;
    background-clip: content-box;
    border-left: 4px solid transparent;
    
    transition: background-color 0.2s;
}

body:not(.native-scrollbars) .modal-container ::-webkit-scrollbar-thumb {
    
    border: none;
}



.view-header {
    height: var(--sdlt-header-height);
    max-height: var(--sdlt-header-height);
    min-height: var(--sdlt-header-height);
}

.view-header-title-parent {
    display: none;
}



.mod-windows .sidebar-toggle-button.mod-left {
    top: 28px;
}

.mod-macos.is-hidden-frameless:not(.is-popout-window) .sidebar-toggle-button.mod-right {
    position: relative;
    background-color: transparent;
}

.workspace-ribbon.mod-left:before {
    display: none;
}

.is-hidden-frameless:not(.is-fullscreen) .titlebar-button-container.mod-right,
.is-hidden-frameless:not(.is-fullscreen) .titlebar-button-container.mod-left,
.is-hidden-frameless:not(.is-fullscreen).is-focused .titlebar-button-container.mod-right,
.is-hidden-frameless:not(.is-fullscreen).is-focused .titlebar-button-container.mod-left {
    background-color: transparent;
}

.titlebar-button {
    height: 24px;
}



.mod-root .workspace-tab-header {
    border-radius: 0;
}

.mod-root .workspace-tab-header-container-inner {
    padding: 0;
    border-radius: 0;
    margin: 0;
}

.mod-root .workspace-tab-header-container-inner::before, .mod-root .workspace-tab-header-container-inner::after,
.workspace-split.mod-root .workspace-tab-header.is-active::before, .workspace-split.mod-root .workspace-tab-header.is-active::after {
    display: none;
}

.workspace .mod-root .workspace-tab-header-container-inner .workspace-tab-header {
    padding-left: 8px;
}

.workspace-tab-header.is-active {
    box-shadow: none;
    background: var(--sdlt-base-bg-start);
}

.workspace-tab-header-new-tab {
    margin-left: 8px;
}



.nav-header .nav-buttons-container {
    justify-content: flex-start;
}





.nav-file-title, .nav-folder-title {
    --text-muted: var(--sdlt-text-muted);
    min-width: calc(100% - 12px);
    border-radius: 0px;
}

.tree-item-self {
    --text-muted: var(--sdlt-text-muted);
    --interactive-accent: var(--sdlt-accent-muted);
    --text-on-accent: var(--sdlt-text-on-accent);
}

.nav-file-title:hover, .nav-folder-title:hover {

}

.nav-files-container .nav-folder.mod-root {
    padding: 0 4px;
}

body:not(.is-phone) .workspace-leaf.mod-active .tree-item-self.has-focus {
    box-shadow: none;
}

.nav-file-title.is-active {
    margin: 4px 0px;
    background: var(--sdlt-overlay-bg);
    border: 1px solid var(--sdlt-overlay-border);
    box-shadow: var(--sdlt-shadow-active);
    font-weight: bold;
}

.nav-file-title.is-active:hover {
    font-weight: bold !important;
}

.nav-file-tag {
    border-radius: 0;
    font-size: 10px;
    padding: 0px 2px;
    color: var(--sdlt-text-muted);
}

.nav-file-tag::before {
    content: '● ';
    color: var(--sdlt-tag-indicator);
}



.side-dock-ribbon-action {
    --text-faint: var(--sdlt-text-faint);
    --text-muted: var(--sdlt-text-muted);
}

.workspace-tab-header {
    --text-faint: var(--sdlt-text-faint);
    --text-muted: var(--sdlt-text-muted);
}

.nav-action-button {
    --text-faint: var(--sdlt-text-faint);
    --text-muted: var(--sdlt-text-muted);
    --interactive-accent: var(--sdlt-accent-muted);
    --text-on-accent: var(--sdlt-text-on-accent);
    --text-accent: var(--sdlt-accent-muted);
}



.is-flashing {
    mix-blend-mode: normal;
}

.is-flashing.nav-file-title::after {
    content: ' ';
    display: block;
    position: absolute;
    width: 200%;
    height: 100%;
    margin-top: -4px;
    margin-left: -100%;
    margin-right: -100%;
    background: linear-gradient(90deg, 
        rgba(255, 255, 255, 0.05) 0%,
        rgba(255, 255, 255, 0.05) 30%,
        rgba(255, 255, 255, 0.3) 50%,
        rgba(255, 255, 255, 0.05) 70%,
        rgba(255, 255, 255, 0.05) 100%);
    animation: flashing 3s infinite;
    animation-timing-function: linear;
    background-size: 200px 100%;
}

@keyframes flashing {
    0% {
        background-position: 0% 0;
    }
    100%{
        background-position: 400px 0;
    }
}



.mod-windows {
    --frame-right-space: 0;
}



.workspace-tabs.mod-top-right-space .workspace-tab-header-container {
    padding-right: 8px !important;
}



body:not(.plugin-sliding-panes):not(.is-mobile) .workspace-leaf-content[data-type="markdown"] .view-header,
body:not(.plugin-sliding-panes):not(.is-mobile) .workspace-leaf-content[data-type="bases"] .view-header {
    height: var(--sdlt-markdown-header-height);
}

body:not(.plugin-sliding-panes):not(.is-mobile) .workspace-leaf-content[data-type="markdown"] .view-header .view-header-title,
body:not(.plugin-sliding-panes):not(.is-mobile) .workspace-leaf-content[data-type="bases"] .view-header .view-header-title {
    font-size: 38px;
    line-height: var(--sdlt-markdown-header-height);
    font-family: "Futura Md BT", Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

body:not(.plugin-sliding-panes):not(.is-mobile) .workspace-leaf-content[data-type="markdown"] .view-header .view-header-icon,
body:not(.plugin-sliding-panes):not(.is-mobile) .workspace-leaf-content[data-type="bases"] .view-header .view-header-icon {
    padding-top: 17px;
    width: var(--sdlt-ribbon-width);
    text-align: center;
}



.plugin-sliding-panes .workspace-leaf-content[data-type="markdown"],
.plugin-sliding-panes .workspace-leaf-content[data-type="bases"] {
    background: var(--sdlt-gradient-content);
    background-attachment: fixed;
}

 

.nav-folder.mod-root > .nav-folder-title .nav-folder-title-content {
    font-size: 22px;
    padding-bottom: 10px;
    font-family: "Futura Md BT", Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}



.titlebar {
    -webkit-app-region: drag !important;
}

.titlebar .titlebar-text, 
.is-hidden-frameless .titlebar .titlebar-text {
    display: block;
    text-align: left;
    width: auto;
    left: 64px;
    line-height: 24px;
    z-index: 5;
    font-weight: normal;
    padding: 0;
}

.mod-macos .titlebar .titlebar-text {
    left: 136px;
}

.titlebar .titlebar-text::after {
    z-index: 5;
    opacity: 0.5;
    content: " - https://tmz.io/sodalite v0.9.0";
}



.status-bar {
    bottom: auto;
    top: 0;
    right: 136px;
    font-size: 12px;
}

.mod-macos .status-bar {
    right: 0;
}

@media only screen and (max-width: 1280px) {
    .status-bar {
        display: none;
    }
}



button.mod-cta {
    background: var(--sdlt-accent-muted);
}

button.mod-cta:hover {
    background: var(--sdlt-accent);
}



.suggestion-container, .menu {
    margin-top: 6px;
    border-radius: 8px;
    background: 
        rgba(0,0,0,0.3)
        linear-gradient(160deg, transparent, rgba(255, 255, 255, 0.02));
    border: 2px solid var(--sdlt-border);
    backdrop-filter: blur(12px);
    box-shadow: 0 3.2px 7.2px 0 rgba(0,0,0,.132),0 .6px 1.8px 0 rgba(0,0,0,.108);
}



body:not(.is-mobile) .modal-container .modal-bg {
    background-color: rgba(0, 0, 0, .3);
    backdrop-filter: blur(12px);
}

.modal-container .modal {
    background: var(--sdlt-gradient-base);
    box-shadow: 0 6.4px 14.4px 0 rgba(0,0,0,.132),0 1.2px 3.6px 0 rgba(0,0,0,.108);
    overflow: visible !important;
}

.modal-container .modal .modal-content {
    padding: 0;
}

.modal-container .modal .modal-title {
    font-family: "Futura Md BT", Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    font-size: 32px;
}

.modal-container .modal .vertical-tab-content {
    background: transparent;
    padding-top: 20px;
}

.modal-container .modal .vertical-tab-header {
    background: transparent;
    padding-top: 0;
}

.modal-container .modal .vertical-tab-content-container {
    background: var(--sdlt-gradient-content);
    padding: 0;
    border-left: 2px solid var(--sdlt-border);
}

.modal-container .modal .vertical-tab-nav-item {
    background: transparent;
}

.modal-container .modal .vertical-tab-nav-item.is-active {
    background: var(--sdlt-overlay-bg);
    border: 1px solid var(--sdlt-overlay-border);
    box-shadow: var(--sdlt-shadow-active);
    border-radius: 6px;
    margin: 0 8px;
    font-weight: bold;
}

.modal-container .modal .modal-close-button {
    right: -40px;
}

.modal-container .prompt {
    background: transparent;
}

.modal-container .prompt .suggestion-item.is-selected {
    background: linear-gradient(160deg, transparent, rgba(255, 255, 255, 0.1));
}



.tooltip {
    background: 
        rgba(0,0,0,0.4)
        linear-gradient(160deg, transparent, rgba(255,255,255,0.05));
    backdrop-filter: blur(18px);
    font-size: 1em;
    padding: 6px 12px;
}

.tooltip .tooltip-arrow {
    backdrop-filter: blur(18px);
    border-bottom: 5px solid rgba(0,0,0,0.4);
}

.tooltip.mod-right .tooltip-arrow {
    border-right: 5px solid rgba(0,0,0,0.4);
}

.tooltip.mod-left .tooltip-arrow {
    border-left: 5px solid rgba(0,0,0,0.4);
}

.tooltip.mod-top .tooltip-arrow {
    border-top: 5px solid rgba(0,0,0,0.4);
}



.notice-container .notice {
    background: 
        var(--sdlt-accent-muted-transparent)
        linear-gradient(160deg, transparent, rgba(255,255,255,0.05));
    backdrop-filter: blur(18px);
}



.view-content {
    height: 100%;
}



::selection, .CodeMirror-line::selection, .CodeMirror-line > span::selection, .CodeMirror-line > span > span::selection, .CodeMirror-selected, .CodeMirror-focused .CodeMirror-selected {
    background: var(--sdlt-accent-muted-selection);
    color: white;
}



body:not(.is-mobile) .workspace-leaf-content > .nav-header,
body:not(.plugin-sliding-panes):not(.is-mobile) .workspace-leaf-content > .view-header {
    position: absolute;
    z-index: 90;
    width: 100%;
    backdrop-filter: blur(18px);
    background: 
        linear-gradient(135deg, var(--sdlt-content-bg-start-transparent),
        var(--sdlt-content-bg-end-transparent)) !important;
    background-attachment: fixed !important;
}

body:not(.is-mobile) .workspace-leaf-content > .nav-header + * {
    padding-top: calc(var(--sdlt-header-height) + 6px);
}

body:not(.is-mobile) .workspace-leaf-content > .nav-header + *::-webkit-scrollbar-track {
    margin-top: var(--sdlt-header-height);
}

body:not(.is-mobile) .workspace-leaf-content[data-type="bookmarks"] .view-content,
body:not(.is-mobile) .workspace-leaf-content[data-type="outline"] .view-content,
body:not(.is-mobile) .workspace-leaf-content[data-type="all-properties"] .view-content {
    padding-top: var(--sdlt-markdown-header-height);
}

body:not(.plugin-sliding-panes):not(.is-mobile) .workspace-leaf-content[data-type="markdown"] .markdown-preview-sizer {
    padding-top: var(--sdlt-markdown-header-height);
}

body:not(.plugin-sliding-panes):not(.is-mobile) .workspace-leaf-content[data-type="markdown"] .markdown-preview-view::-webkit-scrollbar-track {
    margin-top: var(--sdlt-markdown-header-height);
}

body:not(.plugin-sliding-panes):not(.is-mobile) .workspace-leaf-content[data-type="markdown"] .CodeMirror-scroll {
    padding-top: var(--sdlt-markdown-header-height);
}

body:not(.plugin-sliding-panes):not(.is-mobile) .workspace-leaf-content[data-type="markdown"] .CodeMirror-vscrollbar::-webkit-scrollbar-track {
    margin-top: var(--sdlt-markdown-header-height);
}

body:not(.plugin-sliding-panes):not(.is-mobile) .workspace-leaf-content[data-type="markdown"] .cm-scroller {
    padding-top: var(--sdlt-markdown-header-height);
}

body:not(.plugin-sliding-panes):not(.is-mobile) .workspace-leaf-content[data-type="markdown"] .cm-scroller::-webkit-scrollbar-track {
    margin-top: var(--sdlt-markdown-header-height);
}

body:not(.plugin-sliding-panes):not(.is-mobile) .workspace-leaf-content[data-type="bases"] .view-content {
    padding-top: calc(var(--sdlt-markdown-header-height) + 8px);
}

body:not(.plugin-sliding-panes):not(.is-mobile) .workspace-leaf-content[data-type="bases"] .bases-view::-webkit-scrollbar-track {
    margin-top: calc(var(--sdlt-markdown-header-height) + 8px);
}



body:not(.is-mobile) .workspace-leaf-content .document-search-container {
    position: absolute;
    top: 64px;
    right: 0;
    background: transparent;
    backdrop-filter: blur(18px);
    background: 
        linear-gradient(135deg, var(--sdlt-content-bg-start-transparent),
        var(--sdlt-content-bg-end-transparent)) !important;
    background-attachment: fixed !important;
    min-width: 400px;
    padding: 12px;
    border: 1px solid var(--sdlt-search-border);
}

.document-search-close-button {
    padding: 0;
    margin-top: -4px;
    margin-right: -8px;
    margin-left: 8px;
}



.graph-controls {
    border-radius: 0 0 8px 0;
    border: none;
    border-right: 2px solid var(--sdlt-border);
    border-bottom: 2px solid var(--sdlt-border);
    top: 0;
    left: 0;
    background: var(--sdlt-gradient-subtle);
    backdrop-filter: blur(10px);
}

body:not(.is-mobile) .workspace-split.mod-root .graph-controls {
    top: var(--sdlt-header-height);
}

.graph-controls.is-close {
    background: var(--sdlt-gradient-subtle);
    width: var(--sdlt-ribbon-width);
}

.graph-controls .setting-item-name {
    --text-muted: var(--sdlt-text-muted);
}

body.is-mobile .graph-controls {
    background: var(--sdlt-gradient-content);
    background-attachment: fixed;
    backdrop-filter: none;
}

.graph-view.color-line {
    color: var(--sdlt-graph-line);
}

.graph-view.color-line-highlight {
    color: var(--sdlt-graph-line-highlight);
}

 

.frontmatter-container {
    background: var(--sdlt-gradient-subtle);
    border-radius: 8px;
    border: 1px solid var(--sdlt-overlay-bg);
    margin-bottom: 20px;
}



.side-dock-settings {
    margin-bottom: 0;
}



.setting-item-control .checkbox-container.is-enabled {
    background: var(--sdlt-accent-muted);
}



.status-bar-item .status-bar-item-icon.sync-status-icon {
    position: relative;
}

.status-bar-item .status-bar-item-icon.sync-status-icon svg {
    width: 21px;
    height: 21px;
}

.status-bar-item .status-bar-item-icon.sync-status-icon::after {
    display: block;
    width: 100%;
    height: 26px;
    position: fixed;
    content: ' ';
    left: 0;
    top: 0;
    z-index: -1;
    pointer-events: none;
    -webkit-mask-image: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 20%, rgba(0,0,0,1) 80%, rgba(0,0,0,0) 100%);
}



.status-bar-item .status-bar-item-icon.sync-status-icon.mod-working::after {
    background: linear-gradient(90deg, 
        transparent 0%,
        transparent 30%,
        rgba(40, 40, 255, 0.2),
        transparent 70%,
        transparent 100%);
    animation: sync-flashing 5s infinite, sync-fadein 1s 1;
    animation-timing-function: linear;
    background-size: 500px 100%;
    background-repeat: repeat-x;
}

@keyframes sync-flashing {
    0% {
        background-position: 0% 0;
    }
    100%{
        background-position: 1000px 0;
    }
}

@keyframes sync-fadein {
    0% {
        opacity: 0;
    }
    50% {
        opacity: 0;
    }
    100%{
        opacity: 1;
    }
}



.CodeMirror-gutter.CodeMirror-linenumbers, .CodeMirror-gutter.CodeMirror-foldgutter {
    background: transparent;
}

.markdown-source-view.mod-cm6 .cm-gutters {
    background: transparent !important;
}



.cm-s-obsidian span.cm-hashtag {
    color: var(--text-accent);
}



.nav-folder .nav-folder-title-content::before {
    content: '📂 ';
}

.nav-folder.is-collapsed .nav-folder-title-content::before {
    content: '📁 ';
}

.workspace-leaf-content[data-type="file-explorer"] .nav-folder.mod-root > .nav-folder-title .nav-folder-title-content::before {
    content: '🏠 '
}

.workspace-leaf-content[data-type="file-explorer"] .nav-file .nav-file-title-content::before {
    content: '📝 '
}



.workspace-leaf-content[data-type="file-explorer"] .nav-file-title[data-path^="samplepaththatdoesntexist"] .nav-file-title-content::before {
    content: '⚡ ';
}



body {
    --callout-radius: 0;
    --callout-padding: 18px;
}

.callout .callout-content > :last-child {
    margin-block-end: 0;
}

.callout .callout-title .callout-icon {
    margin-top: 0;
    margin-right: 0.15em;
}
