styles.css

/* ---------------------------------------------------------------------------
Zen for Obsidian by (@Maxymillion)

A focus mode Obsidian plugin.

Readme:
https://github.com/Maxymillion/zen

----------------------------------------------------------------------------- */


.zen-header {
	-webkit-app-region: no-drag;
	position: absolute;
	left: var(--size-4-2);
	top: 0;
	height: auto !important;
	width: auto !important;
	align-items: center;
	display: none;
	cursor: pointer;
	padding: var(--size-4-2) 0 7px 0;
	opacity: 0.5;
	transition: ease opacity 0.250s;
}
.zen-enabled .zen-header{
	display: flex;
}
.zen-header:hover {
	opacity: 0.8;
}

.zen-header-inner svg {
	--icon-size: var(--icon-l);
	--icon-stroke: var(--icon-l-stroke-width);
}

.zen-header-inner {
	display: inline-flex;
	padding: var(--size-2-2) var(--size-2-3);
}

.zen-int--author {
	opacity: 0.5;
}

.zen-int--link, .zen-int--link:hover {
	color: inherit;
	text-decoration: inherit;
}

.zen-int-block {
	background: var(--background-secondary);
	border-radius: calc(var(--modal-radius) / 2);
	border: 1px solid var(--divider-color);
	padding: 0.75em;
	transition: ease border-color var(--anim-duration-fast), ease opacity var(--anim-duration-fast);
	margin-bottom: 0.75em;
}

.zen-int-block[data-enabled="false"] .setting-item-info {
	opacity: 0.6;
}
.zen-int-block[data-enabled="false"]{
	background-color: var(--background-primary);
}


.zen-int-block:hover {
	border-color: var(--background-modifier-border-focus);
}

.zen-int-block > div.setting-item {
	padding: 0;
}

.zen-int-block[data-enabled="true"].options-open .zen-int-block--options {
	margin-top: 0.75em;
	display: block;
}

.zen-int-block[data-enabled="true"] .zen-int-block--options-trigger {
	display: flex;
}

.zen-int-block--options {
	padding: 0.75em;
	background-color: var(--background-primary);
	display: none;
}

.zen-int-block--options .setting-item-name {
	color: var(--text-muted);
	font-size: var(--font-ui-smaller);
}

.zen-int-block--options .setting-item:last-child {
	padding-bottom: 0;
}

.zen-int-block--options .setting-item:hover .setting-item-name {
	color: var(--text-normal) !important;
}

.zen-int-block--options .setting-item,
.zen-int-block--options .checkbox-container {
	--toggle-width: 25px;
	--toggle-thumb-width: 10px;
	height: calc(10px + var(--toggle-border-width));
}

.zen-int-block--options .setting-item-control {
	order: -1;
	width: auto;
	justify-content: flex-start;
	flex: 0;
	padding-right: 0.75em;
}

.zen-int-block--options .checkbox-container::after {
	height: calc(10px - var(--toggle-border-width));
}

.zen-int--link:hover {
	opacity: 0.7;
}

.zen-int-block--options-trigger {
	display: none;
	align-items: center;
	color: var(--text-muted);
	font-size: var(--font-ui-smaller);
	padding-top: var(--size-4-4);
	line-height: var(--line-height-tight);
}

.options-open .zen-int-block--options-trigger svg {
	transform: rotate(180deg);
}

.zen-int-block--options-trigger span {
	cursor: pointer;
}

.zen-int-block--options-trigger svg {
	cursor: pointer;
	width: 14px;
	height: 14px;
	display: inline-block;
	margin-right: 4px;
}

.mod-macos .zen-header {
	left: calc(var(--frame-left-space) + var(--ribbon-width));
}
.zen-enabled.is-fullscreen.zen-module--ribbon .zen-header {
	left: var(--size-4-2);
}

/*
 * Ribbon Styling, originally from the "Hider" Obsidian plugin.
 */

.zen-enabled.zen-module--ribbon.mod-macos.is-hidden-frameless:not(.is-fullscreen):not(.is-popout-window) .workspace-tabs.mod-top-left-space .workspace-tab-header-container {
	padding-left: calc(var(--frame-left-space) + var(--ribbon-width));
}

.zen-enabled.zen-module--ribbon .workspace-ribbon.mod-left {
	display: none;
}

.zen-enabled.zen-module--ribbon .workspace-ribbon.mod-right {
	visibility: hidden;
	position: absolute;
}

.zen-enabled.zen-module--ribbon .workspace-split.mod-right-split {
	margin-right: 0;
}

.zen-enabled.zen-module--ribbon .workspace-split.mod-left-split {
	margin-left: 0;
}

/*
 * Side-dock: RIGHT
 */

.zen-enabled.zen-module--sideDockRight .is-right-sidedock-open .workspace-split.mod-horizontal.mod-right-split {
	width: 0 !important;
}

.zen-enabled.zen-module--sideDockRight .sidebar-toggle-button.mod-right {
	display: none;
}

/*
 * Side-dock: LEFT
 */

.zen-enabled.zen-module--sideDockLeft .is-left-sidedock-open .workspace-split.mod-horizontal.mod-left-split {
	width: 0 !important;
}

.zen-enabled.zen-module--sideDockLeft .workspace-tabs:first-of-type .workspace-tab-header-container {
	padding-left: 30px;
}

.zen-enabled.zen-module--sideDockLeft.mod-macos.is-hidden-frameless:not(.is-fullscreen):not(.is-popout-window) .workspace-tabs:first-of-type .workspace-tab-header-container {
	padding-left: calc(var(--frame-left-space) + 30px);
}

.zen-enabled.zen-module--ribbon.zen-module--sideDockRight .workspace-tab-header-container {
	padding-right: 3px !important;
}

.zen-enabled.zen-module--ribbon.zen-module--sideDockLeft .workspace-tabs:first-of-type .workspace-tab-header-container {
	padding-left: calc(var(--ribbon-width) + 30px);
}

.zen-enabled.zen-module--ribbon.is-fullscreen.zen-module--sideDockLeft .workspace-tabs:first-of-type .workspace-tab-header-container {
	padding-left: var(--ribbon-width);
}

.mod-windows.zen-enabled.zen-module--ribbon.zen-module--sideDockLeft .workspace-tabs:first-of-type .workspace-tab-header-container {
	padding-left: 36px;
}

.zen-enabled.zen-module--ribbon.zen-global--hideZenButton.zen-module--sideDockLeft.mod-macos.is-hidden-frameless:not(.is-fullscreen):not(.is-popout-window) .workspace-tabs:first-of-type .workspace-tab-header-container {
	padding-left: calc(var(--frame-left-space) + var(--ribbon-width));
}

.zen-enabled.zen-module--ribbon:not(.zen-global--hideZenButton).zen-module--sideDockLeft.mod-macos.is-hidden-frameless:not(.is-fullscreen):not(.is-popout-window) .workspace-tabs:first-of-type .workspace-tab-header-container {
	padding-left: calc(var(--frame-left-space) + var(--ribbon-width) + 30px);
}


/*
 * Fileheader
 */

.zen-enabled.zen-module--fileHeader .workspace-split.mod-vertical.mod-root .view-header {
	display: none;
}

/*
 * Tabs
 */

.zen-enabled.zen-module--tabs .workspace-split.mod-vertical.mod-root .workspace-tab-header-container {
	background: transparent;
	border-color: transparent;
	box-shadow: none;
}

.zen-enabled.zen-module--tabs .workspace-split.mod-vertical.mod-root .workspace-tab-header-container > div {
	visibility: hidden;
}

/*
 * Status Bar
 */

.zen-enabled.zen-module--statusBar .status-bar {
	display: none;
}

/*
 * Settings Highlights
 */

.zen-highlight-el {
	position: relative;
}

.zen-highlight-el::after, .zen-highlight-el-ab::after {
	content: "";
	left: 0;
	top: 0;
	position: absolute;
	z-index: var(--layer-popover);
	background: rgba(208, 255, 0, 0.4);
	width: 100%;
	height: 100%;
}

.zen-highlight-el--exception {
	background: rgba(255, 98, 0, 0.8) !important;
	z-index: var(--layer-popover);
}

/*
 * ICON Styles
 */

[data-type="com.maxymillion.zen"] .workspace-tab-header-status-icon.mod-pinned {
	display: none;
}

.zen-module--autoHideShow__hide .zen-header{
	display: none;
}

.zen-global--hideZenButton .workspace-tab-header[data-type="com.maxymillion.zen"], .zen-global--hideZenButton .zen-header  {
	display: none;
}