catppuccin / logseq Goto Github PK

@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,300;0,400;0,500;1,300;1,400;1,500&display=swap');

.cp__sidebar-main-content .logseq-tools-multiple-calendars {
    display: flex;
    flex-wrap: wrap;
    padding: 0 15px;
}

.cp__sidebar-main-content .logseq-tools-multiple-calendars .logseq-tools-calendar {
    flex: 0 50%;
    box-sizing: border-box;
    padding: 0 15px;
}

.logseq-tools-calendar tr {
    background: none !important;
}

.logseq-tools-calendar th,
.logseq-tools-calendar td,
.logseq-tools-calendar tr {
    border: none;
}

.logseq-tools-calendar th,
.logseq-tools-calendar td {
    text-align: center;
}


/* Calendar - pages from other months */

.logseq-tools-calendar .outofmonth {
    opacity: .3;
}

:root {
  --color-base-00: rgb(var(--ctp-crust));
  --color-base-10: rgb(var(--ctp-mantle));
  --color-base-20: rgb(var(--ctp-base));
  --color-base-30: rgb(var(--ctp-surface0));
  --color-base-40: rgb(var(--ctp-surface1));
  --color-base-50: rgb(var(--ctp-surface2));
  --color-base-60: rgb(var(--ctp-overlay0));
  --color-base-70: rgb(var(--ctp-overlay1));
  --color-base-80: rgb(var(--ctp-overlay2));
  --color-base-90: rgb(var(--ctp-subtext0));
  --color-base-100: rgb(var(--ctp-text));
  /*whiteboard*/
  --wb-color-base-00: rgb(var(--wb-ctp-crust));
  --wb-color-base-10: rgb(var(--wb-ctp-mantle));
  --wb-color-base-20: rgb(var(--wb-ctp-base));
  --wb-color-base-30: rgb(var(--wb-ctp-surface0));
  --wb-color-base-40: rgb(var(--wb-ctp-surface1));
  --wb-color-base-50: rgb(var(--wb-ctp-surface2));
  --wb-color-base-60: rgb(var(--wb-ctp-overlay0));
  --wb-color-base-70: rgb(var(--wb-ctp-overlay1));
  --wb-color-base-80: rgb(var(--wb-ctp-overlay2));
  --wb-color-base-90: rgb(var(--wb-ctp-subtext0));
  --wb-color-base-100: rgb(var(--wb-ctp-text));
}

:root {
  --ctp-primary-background-color: rgb(var(--ctp-base));
  --ctp-secondary-background-color: rgb(var(--ctp-mantle));
  --ctp-tertiary-background-color: rgb(var(--ctp-crust));
  --ctp-quaternary-background-color: rgb(var(--ctp-surface0));
  --ctp-color-level-1: var(--color-base-10);
  --ctp-color-level-2: var(--color-base-20);
  --ctp-color-level-3: var(--color-base-30);
  --ctp-color-level-4: var(--color-base-40);
  --ctp-color-level-5: var(--color-base-50);
  --ctp-color-level-6: var(--color-base-60);
  --ctp-active-primary-color: rgb(var(--ctp-accent));
  --ctp-active-secondary-color: rgb(var(--ctp-accent), 0.9);
  --ctp-table-tr-even-background-color: var(--ctp-secondary-background-color);
  --ctp-block-properties-background-color: var(--ctp-secondary-background-color);
  --ctp-page-properties-background-color: var(--ctp-secondary-background-color);
  --ctp-block-ref-link-text-color: rgb(var(--ctp-subtext0));
  --ctp-search-background-color: var(--ctp-primary-background-color);
  --ctp-border-color: rgb(var(--ctp-surface0));
  --ctp-secondary-border-color: rgb(var(--ctp-surface0));
  --ctp-tertiary-border-color: rgba(var(--ctp-surface0), 0.10);
  --ctp-guideline-color: rgb(var(--ctp-surface1));
  --ctp-menu-hover-color: var(--ctp-color-level-3);
  --ctp-primary-text-color: rgb(var(--ctp-text));
  --ctp-secondary-text-color: rgb(var(--ctp-subtext0));
  --ctp-title-text-color: rgb(var(--ctp-subtext1));
  --ctp-link-text-color: rgb(var(--ctp-accent, var(--ctp-teal)));
  --ctp-link-text-hover-color: rgb(var(--ctp-accent, var(--ctp-mauve)));
  --ctp-link-ref-text-color: rgb(var(--ctp-accent, var(--ctp-blue)));
  --ctp-link-ref-text-hover-color: rgb(var(--ctp-accent, var(--ctp-blue)));
  --ctp-tag-text-color: rgb(var(--ctp-accent, var(--ctp-maroon)));
  --ctp-tag-text-hover-color: rgb(var(--ctp-accent, var(--ctp-maroon)));
  --ctp-slide-background-color: var(--ctp-primary-background-color);
  --ctp-block-bullet-border-color: rgba(var(--ctp-accent, var(--ctp-sky)), 0.4);
  --ctp-block-bullet-color: rgb(var(--ctp-accent, var(--ctp-sky)));
  --ctp-block-highlight-color: var(--color-base-30);
  --ctp-selection-background-color: rgba(var(--ctp-yellow, 0.9));
  --ctp-selection-text-color: rgb(var(--color-base-00));
  --ctp-page-checkbox-color: rgb(var(--ctp-accent, var(--ctp-blue)));
  --ctp-page-checkbox-border-color: var(--ctp-primary-background-color);
  --ctp-page-blockquote-color: var(--ctp-primary-text-color);
  --ctp-page-blockquote-bg-color: var(--ctp-secondary-background-color);
  --ctp-page-blockquote-border-color: var(--ctp-border-color);
  --ctp-page-inline-code-color: rgb(var(--ctp-green));
  --ctp-page-inline-code-bg-color: var(--color-base-10);
  --ctp-scrollbar-foreground-color: rgba(var(--ctp-text), 0.2);
  --ctp-scrollbar-background-color: rgba(var(--ctp-text), 0.05);
  --ctp-scrollbar-thumb-hover-color: rgba(var(--ctp-text), 0.2);
  --ctp-head-text-color: var(--ctp-link-text-color);
  --ctp-cloze-text-color: rgb(var(--ctp-accent));
  --ctp-icon-color: var(--ctp-link-text-color);
  --ctp-search-icon-color: var(--ctp-link-text-color);
  --ctp-a-chosen-bg: var(--ctp-quaternary-background-color);
  --ctp-right-sidebar-code-bg-color: var(--color-base-30);
  --ctp-pie-bg-color: var(--ctp-primary-background-color);
  --ctp-pie-fg-color: var(--ctp-secondary-background-color);
  --ctp-highlight-color-gray: rgb(var(--ctp-overlay2));
  --ctp-highlight-color-red: rgb(var(--ctp-red));
  --ctp-highlight-color-yellow: rgb(var(--ctp-yellow));
  --ctp-highlight-color-green: rgb(var(--ctp-green));
  --ctp-highlight-color-blue: rgb(var(--ctp-blue));
  --ctp-highlight-color-purple: rgb(var(--ctp-mauve));
  --ctp-highlight-color-pink: rgb(var(--ctp-pink));
  --ctp-error-text-color: var(--color-red-100);
  --ctp-error-background-color: var(--color-red-900);
  --ctp-warning-text-color: var(--color-yellow-100);
  --ctp-warning-background-color: var(--color-yellow-900);
  --ctp-success-text-color: var(--color-green-100);
  --ctp-success-background-color: var(--color-green-900);
  --ctp-focus-ring-color: rgb(var(--ctp-overlay2));
  --ctp-header-button-background: rgb(var(--ctp-text));
  --ctp-error-color: var(--ctp-red);
  --ctp-warning-color: var(--ctp-peach);
  --ctp-success-color: var(--ctp-green);
  --ctp-info-color: var(--ctp-yellow);
  /* Whiteboard */
  /* Whiteboard object colors */
  --ctp-wb-background-color-gray: color-mix(in srgb, rgb(var(--wb-ctp-gray)), rgb(var(--wb-ctp-base)) 60%);
  --ctp-wb-background-color-red: color-mix(in srgb, rgb(var(--wb-ctp-red)), rgb(var(--wb-ctp-base)) 60%);
  --ctp-wb-background-color-yellow: color-mix(in srgb, rgb(var(--wb-ctp-yellow)), rgb(var(--wb-ctp-base)) 60%);
  --ctp-wb-background-color-green: color-mix(in srgb, rgb(var(--wb-ctp-green)), rgb(var(--wb-ctp-base)) 60%);
  --ctp-wb-background-color-blue: color-mix(in srgb, rgb(var(--wb-ctp-blue)), rgb(var(--wb-ctp-base)) 60%);
  --ctp-wb-background-color-purple: color-mix(in srgb, rgb(var(--wb-ctp-mauve)), rgb(var(--wb-ctp-base)) 60%);
  --ctp-wb-background-color-pink: color-mix(in srgb, rgb(var(--wb-ctp-pink)), rgb(var(--wb-ctp-base)) 60%);
  --ctp-wb-stroke-color-gray: rgb(var(--wb-ctp-overlay2));
  --ctp-wb-stroke-color-red: rgb(var(--wb-ctp-red));
  --ctp-wb-stroke-color-yellow: rgb(var(--wb-ctp-yellow));
  --ctp-wb-stroke-color-green: rgb(var(--wb-ctp-green));
  --ctp-wb-stroke-color-blue: rgb(var(--wb-ctp-blue));
  --ctp-wb-stroke-color-purple: rgb(var(--wb-ctp-mauve));
  --ctp-wb-stroke-color-pink: rgb(var(--wb-ctp-pink));
  --ctp-wb-text-color-gray: rgb(var(--wb-ctp-overlay2));
  --ctp-wb-text-color-red: rgb(var(--wb-ctp-red));
  --ctp-wb-text-color-yellow: rgb(var(--wb-ctp-yellow));
  --ctp-wb-text-color-green: rgb(var(--wb-ctp-green));
  --ctp-wb-text-color-blue: rgb(var(--wb-ctp-blue));
  --ctp-wb-text-color-purple: rgb(var(--wb-ctp-mauve));
  --ctp-wb-text-color-pink: rgb(var(--wb-ctp-pink));
  --ctp-wb-shape-label-color-gray: rgb(var(--wb-ctp-gray));
  --ctp-wb-shape-label-color-red: rgb(var(--wb-ctp-red));
  --ctp-wb-shape-label-color-yellow: rgb(var(--wb-ctp-yellow));
  --ctp-wb-shape-label-color-green: rgb(var(--wb-ctp-green));
  --ctp-wb-shape-label-color-blue: var(--wb-ctp-blue);
  --ctp-wb-shape-label-color-purple: rgb(var(--wb-ctp-purple));
  --ctp-wb-shape-label-color-pink: rgb(var(--wb-ctp-pink));
  --ctp-switch-background: var(--wb-color-base-50);
  --ctp-switch-handle-color: var(--wb-ctp-accent, var(--wb-ctp-blue));
  --ctp-button-background: var(--wb-ctp-accent, var(--wb-ctp-blue));
  --ctp-button-text: var(--wb-color-base-10);
  --ctp-tooltip-background: var(--wb-ctp-tertiary-background-color);
  --ctp-tooltip-text: rgb(var(--wb-ctp-text));
  --ctp-search-input-placeholder: rgb(var(--wb-ctp-text));
  --ctp-header-icon: rgb(var(--wb-ctp-accent));
  --ctp-header-icon-background: var(--wb-ctp-menu-hover-color);
  --ctp-text-highlight: rgb(var(--wb-ctp-yellow));
  --ctp-bullet-thread-color: rgb(var(--wb-ctp-accent, var(--wb-ctp-teal)));
  --ctp-dropdown-border-color: var(--wb-color-base-50);
  --ctp-text-bold: var(var(--wb-ctp-primary-text-color));
  --ctp-text-heading: var(--wb-ctp-accent, var(--wb-ctp-lavender));
  --ctp-text-italics: var(--wb-ctp-accent, var(--wb-ctp-green));
  --ctp-text-underline: var(--wb-ctp-primary-text-color);
  --ctp-text-strikethrough: var(--wb-ctp-accent, var(--wb-ctp-maroon));
  --ctp-blockquote-line: var(--wb-ctp-accent);
  --ctp-active-setting: var(--wb-ctp-accent, var(--wb-ctp-blue));
  --ctp-wb-button-selected-foreground: var(--wb-ctp-accent, var(--wb-ctp-mauve));
  --ctp-wb-button-selected-background: var(--wb-ctp-surface0);
  --ctp-wb-button-foreground: var(--wb-ctp-text);
  --ctp-wb-button-menu-foreground: var(--wb-ctp-accent, var(--wb-ctp-teal));
  --ctp-wb-button-type-tag-background-active: var(--wb-ctp-accent, var(--wb-ctp-mauve));
  --ctp-wb-button-type-tag-background-inactive: var(--wb-ctp-surface0);
  --ctp-wb-button-type-tag-foreground: var(--wb-ctp-text);
  --ctp-wb-quick-links-button: var(--wb-ctp-accent, var(--wb-ctp-blue));
  --ctp-wb-quick-links-button-hover: var(--wb-ctp-sky);
  --ctp-wb-layout-button-foreground: var(--wb-ctp-accent, var(--wb-ctp-teal));
  --ctp-tl-select-input-select-item: var(--wb-ctp-surface2);
  --ctp-tl-selectFill: var(--wb-ctp-accent, var(--wb-ctp-blue));
  --ctp-tl-selectStroke: var(--wb-ctp-accent, var(--wb-ctp-blue));
  --ctp-priority-bg-color: var(--wb-ctp-crust);
  --ctp-priority-todo: var(--wb-ctp-teal);
  --ctp-priority-doing: var(--wb-ctp-blue);
  --ctp-priority-done: var(--wb-ctp-green);
  --ctp-priority-now: var(--wb-ctp-teal);
  --ctp-priority-later: var(--wb-ctp-yellow);
  --ctp-priority-waiting: var(--wb-ctp-maroon);
  --ctp-priority-a: var(--wb-ctp-red);
  --ctp-priority-b: var(--wb-ctp-yellow);
  --ctp-priority-c: var(--wb-ctp-green);
  --ctp-marker-border-radius: 4px;
  --ctp-checkbox-color: var(--wb-ctp-accent, var(--wb-ctp-teal));
  --ctp-marker-size: 16px;
}

:root {
  --ls-error-color: var(--ctp-error-color);
  --ls-warning-color: var(--ctp-warning-color);
  --ls-success-color: var(--ctp-success-color);
  --ls-text-on-accent: rgb(var(--ctp-base));
}
:root .logseq-tldraw {
  --tl-selectFill: rgba(var(--ctp-tl-selectFill), 0.05);
  --tl-selectStroke: rgb(var(--ctp-tl-selectStroke));
}
:root .tl-text-label-inner-wrapper {
  --ls-wb-text-color-gray: var(--ctp-wb-shape-label-color-gray);
  --ls-wb-text-color-red: var(--ctp-wb-shape-label-color-red);
  --ls-wb-text-color-yellow: var(--ctp-wb-shape-label-color-yellow);
  --ls-wb-text-color-green: var(--ctp-wb-shape-label-color-green);
  --ls-wb-text-color-blue: var(--ctp-wb-shape-label-color-blue);
  --ls-wb-text-color-purple: var(--ctp-wb-shape-label-color-purple);
  --ls-wb-text-color-pink: var(--ctp-wb-shape-label-color-pink);
}

@media (prefers-color-scheme: dark) {
  html {
    background-color: rgb(var(--ctp-primary-background-color));
  }
  html[data-theme=light] {
    background-color: transparent;
  }
}
.light-theme,
.dark-theme,
html[data-theme=light],
html[data-theme=dark] {
  --ls-primary-background-color: var(--ctp-primary-background-color);
  --ls-secondary-background-color: var(--ctp-secondary-background-color);
  --ls-tertiary-background-color: var(--ctp-tertiary-background-color);
  --ls-quaternary-background-color: var(--ctp-quaternary-background-color);
  --color-level-1: var(--ctp-color-level-1);
  --color-level-2: var(--ctp-color-level-2);
  --color-level-3: var(--ctp-color-level-3);
  --color-level-4: var(--ctp-color-level-4);
  --color-level-5: var(--ctp-color-level-5);
  --color-level-6: var(--ctp-color-level-6);
  --ls-active-primary-color: var(--ctp-active-primary-color);
  --ls-active-secondary-color: var(--ctp-active-secondary-color);
  --ls-table-tr-even-background-color: var(--ctp-table-tr-even-background-color);
  --ls-block-properties-background-color: var(--ctp-block-properties-background-color);
  --ls-page-properties-background-color: var(--ctp-page-properties-background-color);
  --ls-block-ref-link-text-color: var(--ctp-block-ref-link-text-color);
  --ls-search-background-color: var(--ctp-search-background-color);
  --ls-border-color: var(--ctp-border-color);
  --ls-secondary-border-color: var(--ctp-secondary-border-color);
  --ls-tertiary-border-color: var(--ctp-tertiary-border-color);
  --ls-guideline-color: var(--ctp-guideline-color);
  --ls-menu-hover-color: var(--ctp-menu-hover-color);
  --ls-primary-text-color: var(--ctp-primary-text-color);
  --ls-secondary-text-color: var(--ctp-secondary-text-color);
  --ls-title-text-color: var(--ctp-title-text-color);
  --ls-link-text-color: var(--ctp-link-text-color);
  --ls-link-text-hover-color: var(--ctp-link-text-hover-color);
  --ls-link-ref-text-color: var(--ctp-link-ref-text-color);
  --ls-link-ref-text-hover-color: var(--ctp-link-ref-text-hover-color);
  --ls-tag-text-color: var(--ctp-tag-text-color);
  --ls-tag-text-hover-color: var(--ctp-tag-text-hover-color);
  --ls-slide-background-color: var(--ctp-slide-background-color);
  --ls-block-bullet-border-color: var(--ctp-block-bullet-border-color);
  --ls-block-bullet-color: var(--ctp-block-bullet-color);
  --ls-block-highlight-color: var(--ctp-block-highlight-color);
  --ls-selection-background-color: var(--ctp-selection-background-color);
  --ls-selection-text-color: var(--ctp-selection-text-color);
  --ls-page-checkbox-color: var(--ctp-page-checkbox-color);
  --ls-page-checkbox-border-color: var(--ctp-page-checkbox-border-color);
  --ls-page-blockquote-color: var(--ctp-page-blockquote-color);
  --ls-page-blockquote-bg-color: var(--ctp-page-blockquote-bg-color);
  --ls-page-blockquote-border-color: var(--ctp-page-blockquote-border-color);
  --ls-page-inline-code-color: var(--ctp-page-inline-code-color);
  --ls-page-inline-code-bg-color: var(--ctp-page-inline-code-bg-color);
  --ls-scrollbar-foreground-color: var(--ctp-scrollbar-foreground-color);
  --ls-scrollbar-background-color: var(--ctp-scrollbar-background-color);
  --ls-scrollbar-thumb-hover-color: var(--ctp-scrollbar-thumb-hover-color);
  --ls-head-text-color: var(--ctp-head-text-color);
  --ls-cloze-text-color: var(--ctp-cloze-text-color);
  --ls-icon-color: var(--ctp-icon-color);
  --ls-search-icon-color: var(--ctp-search-icon-color);
  --ls-a-chosen-bg: var(--ctp-a-chosen-bg);
  --ls-right-sidebar-code-bg-color: var(--ctp-right-sidebar-code-bg-color);
  --ls-pie-bg-color: var(--ctp-pie-bg-color);
  --ls-pie-fg-color: var(--ctp-pie-fg-color);
  --ls-highlight-color-gray: var(--ctp-highlight-color-gray);
  --ls-highlight-color-red: var(--ctp-highlight-color-red);
  --ls-highlight-color-yellow: var(--ctp-highlight-color-yellow);
  --ls-highlight-color-green: var(--ctp-highlight-color-green);
  --ls-highlight-color-blue: var(--ctp-highlight-color-blue);
  --ls-highlight-color-purple: var(--ctp-highlight-color-purple);
  --ls-highlight-color-pink: var(--ctp-highlight-color-pink);
  --ls-error-text-color: var(--ctp-error-text-color);
  --ls-error-background-color: var(--ctp-error-background-color);
  --ls-warning-text-color: var(--ctp-warning-text-color);
  --ls-warning-background-color: var(--ctp-warning-background-color);
  --ls-success-text-color: var(--ctp-success-text-color);
  --ls-success-background-color: var(--ctp-success-background-color);
  --ls-focus-ring-color: var(--ctp-focus-ring-color);
  --ls-header-button-background: var(--ctp-header-button-background);
  /* Whiteboard */
  /* Whiteboard object colors */
  --ls-wb-background-color-gray: var(--ctp-wb-background-color-gray);
  --ls-wb-background-color-red: var(--ctp-wb-background-color-red);
  --ls-wb-background-color-yellow: var(--ctp-wb-background-color-yellow);
  --ls-wb-background-color-green: var(--ctp-wb-background-color-green);
  --ls-wb-background-color-blue: var(--ctp-wb-background-color-blue);
  --ls-wb-background-color-purple: var(--ctp-wb-background-color-purple);
  --ls-wb-background-color-pink: var(--ctp-wb-background-color-pink);
  --ls-wb-stroke-color-gray: var(--ctp-wb-stroke-color-gray);
  --ls-wb-stroke-color-red: var(--ctp-wb-stroke-color-red);
  --ls-wb-stroke-color-yellow: var(--ctp-wb-stroke-color-yellow);
  --ls-wb-stroke-color-green: var(--ctp-wb-stroke-color-green);
  --ls-wb-stroke-color-blue: var(--ctp-wb-stroke-color-blue);
  --ls-wb-stroke-color-purple: var(--ctp-wb-stroke-color-purple);
  --ls-wb-stroke-color-pink: var(--ctp-wb-stroke-color-pink);
  --ls-wb-text-color-gray: var(--ctp-wb-text-color-gray);
  --ls-wb-text-color-red: var(--ctp-wb-text-color-red);
  --ls-wb-text-color-yellow: var(--ctp-wb-text-color-yellow);
  --ls-wb-text-color-green: var(--ctp-wb-text-color-green);
  --ls-wb-text-color-blue: var(--ctp-wb-text-color-blue);
  --ls-wb-text-color-purple: var(--ctp-wb-text-color-purple);
  --ls-wb-text-color-pink: var(--ctp-wb-text-color-pink);
}

div.input-wrap > input::placeholder {
  color: var(--ctp-search-input-placeholder);
}

.recent-search a > div > div {
  border-color: rgb(var(--ctp-text));
}

a.ui__toggle .wrapper:focus {
  --tw-shadow: 0 0 0 3px rgba(var(--ctp-switch-handle-color), 0.5) ;
}
a.ui__toggle > span {
  background-color: var(--ctp-switch-background);
}
a.ui__toggle > span > span.switcher {
  background-color: rgb(var(--ctp-switch-handle-color));
}

button.ui__button {
  color: var(--ctp-button-text);
  background-color: rgb(var(--ctp-button-background));
}
button.ui__button[intent=logseq]:hover:not(.active) {
  color: var(--ctp-button-text);
  background-color: rgb(var(--ctp-button-background));
}
button.ui__button:hover {
  background-color: rgb(var(--ctp-button-background));
}

.tippy-tooltip {
  background: var(--ctp-tooltip-background);
  color: var(--ctp-tooltip-text);
}

.tippy-popper .arrow-regular {
  display: none;
  /* Hide the arrow */
}

.dark .ui__button[intent=logseq]:hover {
  color: var(--ls-link-text-color);
}

svg.warning {
  fill: rgb(var(--ctp-warning-color));
}

svg.important {
  fill: rgb(var(--ctp-error-color));
}

svg.note {
  fill: rgb(var(--ctp-info-color));
}

div.nav-content-item:not(.is-expand) .header {
  background-color: var(--ls-tertiary-background-color);
}
div.nav-content-item:not(.is-expand) .header a {
  color: var(--ctp-link-text-hover-color);
}

.left-sidebar-inner a.item.active,
.left-sidebar-inner a.item:active {
  color: var(--ctp-link-text-hover-color);
}

.left-sidebar-inner a.item:hover {
  background: var(--ctp-color-level-3);
}
.left-sidebar-inner a.item:hover span {
  color: var(--ctp-blue);
}

.cp__sidebar-left-layout .header:hover a {
  color: var(--ctp-link-text-hover-color);
}

.ui__modal-panel {
  border: 1px solid;
  border-color: var(--ctp-dropdown-border-color);
}

.dropdown-wrapper {
  border: 1px solid;
  border-color: var(--ctp-dropdown-border-color);
}

.block-children-left-border:hover {
  width: 2px;
  background-color: var(--ctp-bullet-thread-color);
}

mark {
  background: var(--ctp-text-highlight);
}

.form-input:focus {
  box-shadow: 0 0 0 2px rgba(var(--ctp-accent, var(--ctp-sapphire)), 0.5);
  border-color: rgba(var(--ctp-accent, var(--ctp-sapphire)), 0.5);
}

.bullet-container.bullet-closed {
  background-color: rgb(var(--ctp-accent, var(--ctp-blue)), 0.15);
}
.bullet-container.bullet-closed:hover {
  background-color: rgb(var(--ctp-accent, var(--ctp-blue)), 0.65);
}

.bullet-container:hover {
  background-color: rgb(var(--ctp-accent, var(--ctp-blue)), 0.15);
}

button.button.icon:hover {
  color: rgb(var(--ctp-accent, var(--ctp-pink)));
  background-color: var(--ctp-header-icon-background);
}
button.button.icon:hover > i {
  color: var(--ctp-header-icon);
}

.cp__sidebar-left-layout a {
  color: inherit;
}

.left-sidebar-inner .nav-content-item .header {
  background-color: var(--ls-tertiary-background-color);
}

html[data-theme=dark] .cp__header a,
html[data-theme=dark] .cp__header button,
html[data-theme=dark] .cp__right-sidebar-topbar button {
  opacity: 1;
}

::selection {
  color: var(--ls-text-on-accent);
}

.inline.with-bg-color {
  color: var(--ctp-primary-background-color);
}
.inline.with-bg-color b, .inline.with-bg-color .page-ref {
  color: var(--ctp-primary-background-color);
}
.inline.with-bg-color .page-reference:hover {
  color: var(--ctp-primary-text-color);
}
.inline.with-bg-color .page-reference:hover b, .inline.with-bg-color .page-reference:hover .page-ref, .inline.with-bg-color .page-reference:hover span {
  color: var(--ctp-primary-text-color);
}

.ls-block .with-bg-color:is(h1, h2, h3, h4, h5, h6) {
  color: var(--ctp-primary-background-color);
}

.menu-links-wrapper,
.menu-link {
  background-color: var(--ctp-secondary-background-color);
}

.menu-link,
.menu-link:hover {
  margin-left: 0.5rem;
  margin-right: 0.5rem;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  border-radius: 5px;
}

.cp__settings-inner > aside ul > li > a > strong {
  color: rgb(var(--ctp-primary-text-color));
}

.cp__settings-inner > aside ul > li.active .ui__icon, .cp__settings-inner > aside ul > li.active strong {
  color: rgb(var(--ctp-active-setting));
}

.cp__all_pages_table td > span {
  color: rgb(var(--ctp-primary-text-color));
}

.editor-inner .multiline-block:is(.h1, .h2, .h3, .h4, .h5, .h6):first-line,
.editor-inner .uniline-block:is(.h1, .h2, .h3, .h4, .h5, .h6),
.ls-block :is(h1, h2, h3, h4, h5, h6) {
  color: rgb(var(--ctp-text-heading));
}

b, strong {
  color: rgb(var(--ctp-text-bold));
}

i {
  color: rgb(var(--ctp-text-italics));
}

del {
  color: rgb(var(--ctp-text-strikethrough));
}

blockquote {
  border-left: 2px solid;
  border-left-color: rgb(var(--ctp-blockquote-line));
}

a[title=Yellow].shadow-sm > .heading-bg {
  background-color: var(--ls-highlight-color-yellow) !important;
}

a[title=Red].shadow-sm > .heading-bg {
  background-color: var(--ls-highlight-color-red) !important;
}

a[title=Pink].shadow-sm > .heading-bg {
  background-color: var(--ls-highlight-color-pink) !important;
}

a[title=Green].shadow-sm > .heading-bg {
  background-color: var(--ls-highlight-color-green) !important;
}

a[title=Blue].shadow-sm > .heading-bg {
  background-color: var(--ls-highlight-color-blue) !important;
}

a[title=Purple].shadow-sm > .heading-bg {
  background-color: var(--ls-highlight-color-purple) !important;
}

a[title=Gray].shadow-sm > .heading-bg {
  background-color: var(--ls-highlight-color-gray) !important;
}

#ui__ac-inner {
  background: var(--ctp-secondary-background-color);
}

.ui__ac-group-name {
  background: var(--ctp-tertiary-background-color);
}

.tl-button[data-selected=true] {
  background: rgb(var(--ctp-wb-button-selected-background));
}
.tl-button[data-selected=true] i {
  color: rgb(var(--ctp-wb-button-selected-foreground));
}

.ti, .tie {
  color: rgb(var(--ctp-wb-button-foreground));
}

.tl-context-bar .ti, .tl-context-bar .tie {
  color: rgb(var(--ctp-wb-button-menu-foreground));
}

.tl-type-tag {
  background-color: rgb(var(--ctp-wb-button-type-tag-background-inactive));
  border-color: rgb(var(--ctp-wb-button-type-tag-background-inactive));
}
.tl-type-tag .tie {
  color: rgb(var(--ctp-wb-button-type-tag-foreground));
}

html[data-theme=dark] .tl-type-tag[data-active=true] {
  background-color: rgba(var(--ctp-wb-button-type-tag-background-active), 0.8);
  border-color: rgb(var(--ctp-wb-button-type-tag-background-active));
}
html[data-theme=dark] .tl-type-tag[data-active=true] .tie {
  color: rgb(var(--ctp-wb-button-type-tag-foreground));
}

.tl-menu-item i {
  color: rgb(var(--ctp-wb-button-menu-foreground));
}

.tl-quick-links-row:first-child {
  background-color: rgb(var(--ctp-wb-quick-links-button));
}
.tl-quick-links-row:first-child :hover {
  background-color: rgb(var(--ctp-wb-quick-links-button-hover));
}

.tl-select-input-select-item[data-state=checked] {
  background: rgb(var(--ctp-tl-select-input-select-item));
}

i[class*=ti-layout-] {
  color: rgb(var(--ctp-wb-layout-button-foreground));
}

.bg-gray-500 {
  background-color: rgb(var(--ctp-gray));
}

.bg-red-500 {
  background-color: rgb(var(--ctp-red));
}

.bg-yellow-500 {
  background-color: rgb(var(--ctp-yellow));
}

.bg-green-500 {
  background-color: rgb(var(--ctp-green));
}

.bg-blue-500 {
  background-color: rgb(var(--ctp-blue));
}

.bg-purple-500 {
  background-color: rgb(var(--ctp-mauve));
}

.bg-pink-500 {
  background-color: rgb(var(--ctp-pink));
}

.block-marker {
  background-color: rgb(var(--ctp-priority-bg-color));
  border-radius: var(--ctp-marker-border-radius);
  font-size: 75%;
}
.block-marker.TODO {
  color: rgb(var(--ctp-priority-todo));
}
.block-marker.DOING {
  color: rgb(var(--ctp-priority-doing));
}
.block-marker.NOW {
  color: rgb(var(--ctp-priority-now));
}
.block-marker.LATER {
  color: rgb(var(--ctp-priority-later));
}
.block-marker.waiting {
  color: rgb(var(--ctp-priority-waiting));
}

.form-checkbox, .form-checkbox:focus {
  border-radius: var(--ctp-marker-border-radius);
  border: 2px solid rgb(var(--ctp-checkbox-color)) !important;
  background-color: transparent !important;
  height: var(--ctp-marker-size);
  width: var(--ctp-marker-size);
}

.form-checkbox:checked {
  background-color: rgb(var(--ctp-checkbox-color)) !important;
}

.form-checkbox:hover {
  transform: scale(1.1);
}

a[priority], a.priority {
  font-size: 0px;
}

a.priority[href="#/page/A" i], [href="#/page/B" i], [href="#/page/C" i] {
  display: inline-flex;
  opacity: 1 !important;
}

a[priority]::before, a.priority::before {
  transform: translateY(-1px);
  border: 1px solid rgb(var(--ctp-priority-bg-color));
  border-radius: var(--ctp-marker-border-radius);
  font-size: 12px;
  font-weight: 600;
  height: calc(var(--ctp-marker-size) + 4px);
  width: calc(var(--ctp-marker-size) + 4px);
  line-height: 1.5;
  text-align: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

a[priority=A]::before, a.priority[href="#/page/A" i]:before {
  content: "A";
  background: rgb(var(--ctp-priority-a));
  color: var(--ctp-primary-background-color);
}

a[priority=B]::before, a.priority[href="#/page/B" i]:before {
  content: "B";
  background: rgb(var(--ctp-priority-b));
  color: var(--ctp-primary-background-color);
}

a[priority=C]::before, a.priority[href="#/page/C" i]:before {
  content: "C";
  background: rgb(var(--ctp-priority-c));
  color: var(--ctp-primary-background-color);
}

a.priority:hover {
  transform: scale(1.1);
}

div.cm-s-solarized.CodeMirror {
  --bg0: rgb(var(--ctp-base));
  --bg1: rgb(var(--ctp-overlay1));
  --bg4: rgb(var(--ctp-overlay0));
  --fg: rgb(var(--ctp-text));
  --fg3: rgb(var(--ctp-subtext0));
  --gray: rgb(var(--ctp-subtext1));
  --blue: rgb(var(--ctp-blue));
  --yellow: rgb(var(--ctp-yellow));
  --aqua: rgb(var(--ctp-blue));
  --orange: rgb(var(--ctp-peach));
  --primary-bg: rgb(var(--ctp-base));
  --current-line: rgb(var(--ctp-surface0));
  --selection: rgb(var(--ctp-surface2));
  --atom: rgb(var(--ctp-lavender));
  --cursor: rgb(var(--ctp-overlay1));
  --keyword: rgb(var(--ctp-red));
  --operator: rgb(var(--ctp-sky));
  --number: rgb(var(--ctp-peach));
  --definition: rgb(var(--ctp-blue));
  --string: rgb(var(--ctp-green));
}

.cm-s-solarized.cm-s-light, .cm-s-solarized.cm-s-dark {
  text-shadow: unset;
  box-shadow: inset 7px 0 12px -6px var(--ctp-secondary-background-color);
}
.cm-s-solarized.cm-s-light.CodeMirror,
.cm-s-solarized.cm-s-light .CodeMirror-gutters, .cm-s-solarized.cm-s-dark.CodeMirror,
.cm-s-solarized.cm-s-dark .CodeMirror-gutters {
  background-color: var(--primary-bg);
  color: var(--fg3);
}
.cm-s-solarized.cm-s-light .CodeMirror-gutters, .cm-s-solarized.cm-s-dark .CodeMirror-gutters {
  background: var(--primary-bg);
  border-right: 0px;
}
.cm-s-solarized.cm-s-light .CodeMirror-linenumber, .cm-s-solarized.cm-s-dark .CodeMirror-linenumber {
  color: var(--bg4);
}
.cm-s-solarized.cm-s-light .CodeMirror-cursor, .cm-s-solarized.cm-s-dark .CodeMirror-cursor {
  border-left: 1px solid var(--fg);
}
.cm-s-solarized.cm-s-light.cm-fat-cursor .CodeMirror-cursor, .cm-s-solarized.cm-s-dark.cm-fat-cursor .CodeMirror-cursor {
  background-color: var(--cursor) !important;
}
.cm-s-solarized.cm-s-light .cm-animate-fat-cursor, .cm-s-solarized.cm-s-dark .cm-animate-fat-cursor {
  background-color: var(--cursor) !important;
}
.cm-s-solarized.cm-s-light div.CodeMirror-selected, .cm-s-solarized.cm-s-dark div.CodeMirror-selected {
  background: var(--selection);
}
.cm-s-solarized.cm-s-light span.cm-meta, .cm-s-solarized.cm-s-dark span.cm-meta {
  color: var(--blue);
}
.cm-s-solarized.cm-s-light span.cm-comment, .cm-s-solarized.cm-s-dark span.cm-comment {
  color: var(--gray);
}
.cm-s-solarized.cm-s-light span.cm-number, .cm-s-solarized.cm-s-dark span.cm-number {
  color: var(--number);
}
.cm-s-solarized.cm-s-light span.cm-atom, .cm-s-solarized.cm-s-dark span.cm-atom {
  color: var(--atom);
}
.cm-s-solarized.cm-s-light span.cm-keyword, .cm-s-solarized.cm-s-dark span.cm-keyword {
  color: var(--keyword);
}
.cm-s-solarized.cm-s-light span.cm-variable, .cm-s-solarized.cm-s-dark span.cm-variable {
  color: var(--fg);
}
.cm-s-solarized.cm-s-light span.cm-variable-2, .cm-s-solarized.cm-s-dark span.cm-variable-2 {
  color: var(--fg);
}
.cm-s-solarized.cm-s-light span.cm-variable-3,
.cm-s-solarized.cm-s-light .cm-s-gruvbox-dark span.cm-type, .cm-s-solarized.cm-s-dark span.cm-variable-3,
.cm-s-solarized.cm-s-dark .cm-s-gruvbox-dark span.cm-type {
  color: var(--yellow);
}
.cm-s-solarized.cm-s-light span.cm-operator, .cm-s-solarized.cm-s-dark span.cm-operator {
  color: var(--operator);
}
.cm-s-solarized.cm-s-light span.cm-callee, .cm-s-solarized.cm-s-dark span.cm-callee {
  color: var(--fg);
}
.cm-s-solarized.cm-s-light span.cm-def, .cm-s-solarized.cm-s-dark span.cm-def {
  color: var(--definition);
}
.cm-s-solarized.cm-s-light span.cm-property, .cm-s-solarized.cm-s-dark span.cm-property {
  color: var(--fg);
}
.cm-s-solarized.cm-s-light span.cm-string, .cm-s-solarized.cm-s-dark span.cm-string {
  color: var(--string);
}
.cm-s-solarized.cm-s-light span.cm-string-2, .cm-s-solarized.cm-s-dark span.cm-string-2 {
  color: var(--aqua);
}
.cm-s-solarized.cm-s-light span.cm-qualifier, .cm-s-solarized.cm-s-dark span.cm-qualifier {
  color: var(--aqua);
}
.cm-s-solarized.cm-s-light span.cm-attribute, .cm-s-solarized.cm-s-dark span.cm-attribute {
  color: var(--aqua);
}
.cm-s-solarized.cm-s-light .CodeMirror-activeline-background, .cm-s-solarized.cm-s-dark .CodeMirror-activeline-background {
  background: var(--current-line);
}
.cm-s-solarized.cm-s-light .CodeMirror-matchingbracket, .cm-s-solarized.cm-s-dark .CodeMirror-matchingbracket {
  background: var(--gray);
  color: var(--bg0) !important;
}
.cm-s-solarized.cm-s-light span.cm-builtin, .cm-s-solarized.cm-s-dark span.cm-builtin {
  color: var(--orange);
}
.cm-s-solarized.cm-s-light span.cm-tag, .cm-s-solarized.cm-s-dark span.cm-tag {
  color: var(--orange);
}
.cm-s-solarized.cm-s-light.CodeMirror, .cm-s-solarized.cm-s-light .CodeMirror-gutters, .cm-s-solarized.cm-s-dark.CodeMirror, .cm-s-solarized.cm-s-dark .CodeMirror-gutters {
  background-color: var(--ctp-secondary-background-color);
}
.cm-s-solarized.cm-s-light .CodeMirror-linenumber, .cm-s-solarized.cm-s-dark .CodeMirror-linenumber {
  text-shadow: unset;
}

.embed.embed-page .cm-s-solarized.cm-s-dark.CodeMirror, .embed.embed-page .cm-s-solarized.cm-s-dark .CodeMirror-gutters, .embed.embed-page .cm-s-solarized.cm-s-light.CodeMirror, .embed.embed-page .cm-s-solarized.cm-s-light .CodeMirror-gutters {
  background-color: var(--ctp-tertiary-background-color);
}

:root {
  --ctp-cm-theme: "ctp-frappe";
}

:root,
.theme-dark,
.theme-dark.ctp-frappe {
  --ctp-rosewater: 242, 213, 207;
  --ctp-flamingo: 238, 190, 190;
  --ctp-pink: 244, 184, 228;
  --ctp-mauve: 202, 158, 230;
  --ctp-red: 231, 130, 132;
  --ctp-maroon: 234, 153, 156;
  --ctp-peach: 239, 159, 118;
  --ctp-yellow: 229, 200, 144;
  --ctp-green: 166, 209, 137;
  --ctp-teal: 129, 200, 190;
  --ctp-sky: 153, 209, 219;
  --ctp-sapphire: 133, 193, 220;
  --ctp-blue: 140, 170, 238;
  --ctp-lavender: 186, 187, 241;
  --ctp-text: 198, 206, 239;
  --ctp-subtext1: 181, 189, 220;
  --ctp-subtext0: 165, 172, 201;
  --ctp-overlay2: 148, 155, 183;
  --ctp-overlay1: 131, 138, 164;
  --ctp-overlay0: 115, 120, 145;
  --ctp-surface2: 98, 103, 126;
  --ctp-surface1: 81, 86, 108;
  --ctp-surface0: 65, 69, 89;
  --ctp-base: 48, 52, 70;
  --ctp-mantle: 41, 44, 60;
  --ctp-crust: 35, 38, 52;
  /*WHITBOARD COLORS*/
  --wb-ctp-rosewater: 222, 149, 132;
  --wb-ctp-flamingo: 221, 120, 120;
  --wb-ctp-pink: 236, 131, 208;
  --wb-ctp-mauve: 136, 57, 239;
  --wb-ctp-red: 210, 15, 57;
  --wb-ctp-maroon: 230, 69, 83;
  --wb-ctp-peach: 254, 100, 11;
  --wb-ctp-yellow: 228, 147, 32;
  --wb-ctp-green: 64, 160, 43;
  --wb-ctp-teal: 23, 146, 153;
  --wb-ctp-sky: 4, 165, 229;
  --wb-ctp-sapphire: 32, 159, 181;
  --wb-ctp-blue: 42, 110, 245;
  --wb-ctp-lavender: 114, 135, 253;
  --wb-ctp-text: 76, 79, 105;
  --wb-ctp-subtext1: 92, 95, 119;
  --wb-ctp-subtext0: 108, 111, 133;
  --wb-ctp-overlay2: 124, 127, 147;
  --wb-ctp-overlay1: 140, 143, 161;
  --wb-ctp-overlay0: 156, 160, 176;
  --wb-ctp-surface2: 172, 176, 190;
  --wb-ctp-surface1: 188, 192, 204;
  --wb-ctp-surface0: 204, 208, 218;
  --wb-ctp-base: 239, 241, 245;
  --wb-ctp-mantle: 230, 233, 239;
  --wb-ctp-crust: 220, 224, 232;
}

.form-checkbox:checked {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 16 16' fill='rgb(48, 52, 70)' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12.207 4.793a1 1 0 0 1 0 1.414l-5 5a1 1 0 0 1-1.414 0l-2-2a1 1 0 0 1 1.414-1.414L6.5 9.086l4.293-4.293a1 1 0 0 1 1.414 0z'/%3E%3C/svg%3E") !important;
}

*, :after, :before {

}