/*@import url('https://piotrsss.github.io/logseq-tools/public/bujo-css/main.css');*/
/*
pre, code {
  white-space : pre-wrap !important;
}*/
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@500;700&display=swap');

@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;1,100;1,200;1,300;1,400;1,500;1,600;1,700&display=swap');

/*你已经有在 :root 中设定 --ls-font-family 变量的习惯了，就把这里换成你想要的字体即可。比如：*/
:root {
    --ls-font-family: "PingFang SC", 'Open Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
    --ls-main-content-max-width: 900px;
    --ls-tag-text-opacity: 0.6;
    --ls-tag-text-hover-opacity: 0.8;
    --ls-page-text-size: 1em;
    --ls-page-title-size: 36px;
}
/*.  font-family: STZhongsong, sans-serif;

* {

  font-size:19px;
}
*/

.cp__sidebar-main-layout {
    background: none;
}


/***************************************************************
***************************** TOP ******************************
***************************************************************/

#head .repos {
    font-size: 12px;
    font-weight: 700;
}

#head {
    background: none;
}


/* import (arrows) icon */

#head .ml-2.mr-1 svg {
    height: 17px;
}


/* gradient on top and bottom for aesthetics */

.cp__sidebar-main-content:before {
    content: "";
    display: block;
    position: fixed;
    width: 100%;
    height: 80px;
    top: 0;
    left: 0;
    z-index: 1;
}

.cp__sidebar-main-content:after {
    content: "";
    display: block;
    position: fixed;
    width: 100%;
    height: 40px;
    bottom: 0;
    left: 0;
    z-index: 1;
}


/* < > buttons */

a[title="Go Back"],
a[title="Go Forward"] {
    border-radius: 3px;
    opacity: 1;
    transition: .3s;
}


/* search-field */

#search-wrapper {
    opacity: 0;
    transition: .3s;
}

#search-wrapper:hover,
#search-wrapper:focus-within {
    opacity: 1;
}

#search-wrapper>div:first-child {
    left: 10px;
}

#search>.inner {
    max-width: 100%;
    border-radius: 4px;
}

#search_field:focus {
    background: var(--ls-search-background-color);
}


/***************************************************************
************************** MAIN AREA ***************************
***************************************************************/


/* blocks with background */

[style="background-color: rgb(73, 125, 70); padding-left: 6px; padding-right: 6px; color: rgb(255, 255, 255);"],
[style="background-color: rgb(83, 62, 125); padding-left: 6px; padding-right: 6px; color: rgb(255, 255, 255);"],
[style="background-color: rgb(120, 127, 151); padding-left: 6px; padding-right: 6px; color: rgb(255, 255, 255);"],
[style="background-color: rgb(151, 134, 38); padding-left: 6px; padding-right: 6px; color: rgb(255, 255, 255);"],
[style="background-color: rgb(73, 118, 123); padding-left: 6px; padding-right: 6px; color: rgb(255, 255, 255);"],
[style="background-color: rgb(121, 62, 62); padding-left: 6px; padding-right: 6px; color: rgb(255, 255, 255);"] {
    border-radius: 3px;
    padding: 5px 6px;
}


/* vertical lines */

.block-children {
    border-left: 1px solid var(--ls-guideline-color);
}


/* weird vertical border on the left side of the screen */

#sidebar-nav-wrapper {
    border: none !important;
}


/* text mark/highlight */

mark {
    padding: 3px 5px;
    border-radius: 3px;
}


/* page title */

h1.title {
    font-weight: 900;
}


/* page reference */

.page-reference {
    border-radius: 3px;
    padding: 2px 0px;
    transition: .3s;
}

.page-reference .text-gray-500 {
    opacity: .5;
}


/* block references */

.block-ref {
    padding: 2px 5px;
    border-radius: 3px;
    font-style: italic;
}

.block-ref .block-ref {
    padding: 6px 5px;
    border: none;
}


/* checkbox */

.form-checkbox {
    border-radius: 2px;
    z-index: 1;
    position: relative;
}

.marker-switch {
    border: none;
    opacity: 1;
    padding: 0;
    height: 20px;
    font-weight: 700;
    margin: 0 5px 0 2px;
    line-height: 20px;
    transition: .3s;
}

.marker-switch {
    margin-left: -23px;
    padding-left: 24px;
    padding-right: 14px;
}


/* inline code */

:not(pre)>code {
    border-radius: 3px;
    font-size: .9em;
    font-family: MonoLisa, "Fira Code", Monaco, Menlo, Consolas, "COURIER NEW", monospace;
    padding: 3px 5px !important;
}



.cm-s-solarized.cm-s-light .CodeMirror-gutters {
    background-color: #dedee1;
}


.cm-s-solarized.cm-s-light {
    background-color: #dfe5eb8a;
    color: #3c4043;
}


.CodeMirror {
    border-radius: 7.5px;
    height: auto;
    line-height: 1.45em;
    width: 100%;
}


.cm-s-solarized.cm-s-dark {
    background-color: #1f1f21;
    color: #839496;
}

.cm-s-solarized.cm-s-dark .CodeMirror-gutters {
    background-color: #2b2e2f;
}


/***************************************************************
************************ RIGHT SIDEBAR *************************
***************************************************************/

.cp__right-sidebar-topbar {
    background: none;
}

.cp__right-sidebar .sidebar-item {
    padding: 10px 20px 10px 2px;
    border: none;
    margin-bottom: 10px;
    border-radius: 4px;
}


/***************************************************************
**************************** MISC ******************************
***************************************************************/

a {
    transition: .3s;
}


/* Calendar */

.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;
}

/*@import url('https://piotrsss.github.io/logseq-tools/public/bujo-css/dark-black.css');*/

/***************************************************************
****************************************************************
****************************************************************
************************ DARK - BLACK **************************
****************************************************************
****************************************************************
***************************************************************/

.dark-theme,
html[data-theme=dark] {
    --ls-primary-background-color: #181818;
    --ls-secondary-background-color: #202020;
    --ls-tertiary-background-color: #303030;
    --ls-quaternary-background-color: #404040;
    --ls-table-tr-even-background-color: #36232b;
    --ls-active-primary-color: #c28eaa;
    --ls-active-secondary-color: #e8d0dc;
    --ls-block-properties-background-color: #272727;
    --ls-block-ref-link-text-color: #761a3f;
    --ls-search-background-color: var(--ls-primary-background-color);
    --ls-border-color: #292323;
    --ls-guideline-color: #232323;
    --ls-menu-hover-color: var(--ls-secondary-background-color);
    --ls-primary-text-color: #ffe0a7;
    --ls-secondary-text-color: #dfdfdf;
    --ls-title-text-color: #FFE27C;
    --ls-link-text-color: #b7dc6e;
    --ls-link-text-hover-color: #d6f991;
    --ls-link-ref-text-color: #cc515c;
    --ls-link-ref-text-hover-color: #EF515F;
    --ls-tag-text-color: var(--ls-link-ref-text-color);
    --ls-tag-text-hover-color: var(--ls-link-ref-text-hover-color);
    --ls-slide-background-color: var(--ls-primary-background-color);
    --ls-block-bullet-border-color: #b187a5;
    --ls-block-bullet-color: #4c3841;
    --ls-block-highlight-color: #cc515c;
    --ls-selection-background-color: #AB3641;
    --ls-page-checkbox-color: #935c62;
    --ls-page-checkbox-border-color: var(--ls-primary-background-color);
    --ls-page-blockquote-color: var(--ls-primary-text-color);
    --ls-page-blockquote-bg-color: var(--ls-secondary-background-color);
    --ls-page-blockquote-border-color: #5d1f3d;
    --ls-page-inline-code-color: var(--ls-primary-text-color);
    --ls-page-inline-code-bg-color: #31282c;
    --ls-scrollbar-foreground-color: rgba(255, 255, 255, 0.05);
    --ls-scrollbar-background-color: rgba(67, 30, 41, 0.9);
    --ls-scrollbar-thumb-hover-color: rgba(255, 255, 255, 0.2);
    --ls-head-text-color: #FFE27C;
    --ls-icon-color: var(--ls-quaternary-background-color);
    --ls-search-icon-color: var(--ls-quaternary-background-color);
    --ls-a-chosen-bg: var(--ls-secondary-background-color);
    --ls-right-sidebar-code-bg-color: #3c041f;
    --color-level-1: var(--ls-secondary-background-color);
    --color-level-2: var(--ls-tertiary-background-color);
    --color-level-3: var(--ls-quaternary-background-color);
    --color-level-4: #632f46;
    --color-level-5: #865673;
    --color-level-6: #9e6889;
}


/***************************************************************
***************************** TOP ******************************
***************************************************************/


/* gradient on top and bottom for aesthetics */

.dark-theme .cp__sidebar-main-content:before {
    background: linear-gradient(to bottom, rgba(24, 24, 24, .7) 0%, rgba(24, 24, 24, 0) 100%);
}

.dark-theme .cp__sidebar-main-content:after {
    background: linear-gradient(to top, rgba(24, 24, 24, .7) 0%, rgba(24, 24, 24, 0) 100%);
}


/* < > buttons */

.dark-theme a[title="Go Back"],
.dark-theme a[title="Go Forward"] {
    background: rgba(24, 24, 24, 1);
}

.dark-theme a[title="Go Back"]:hover,
.dark-theme a[title="Go Forward"]:hover {
    background: rgb(35, 35, 35);
}


/* search-field */

.dark-theme #search_field {
    background: linear-gradient(to right, rgba(24, 24, 24, 1) 0%, rgba(24, 24, 24, .7) 200px, rgba(24, 24, 24, 0) 100%);
    transition: background .3s;
}

.dark-theme #search_field:focus {
    box-shadow: 0px 0px 20px 0px rgba(18, 18, 18, .8);
}


/***************************************************************
************************** MAIN AREA ***************************
***************************************************************/


/* title menu ... */

.dark-theme [title="More options"] svg {
    color: #854653;
}


/* text mark/highlight */

.dark-theme mark {
    background: #AB3641;
    color: var(--ls-primary-text-color);
}


/* bold and italics */

.dark-theme b,
.dark-theme strong,
.dark-theme i {
    color: #e4e0de;
}


/* page reference */

.dark-theme .page-reference:hover {
    background: var(--ls-secondary-background-color);
}

.dark-theme .references-blocks .page-reference:hover {
    background: var(--ls-tertiary-background-color);
}

.dark-theme .page-reference .text-gray-500 {
    /* page brackets */
    opacity: .3;
}


/* block reference */

.dark-theme .block-ref {
    background: rgba(70, 56, 61, .5);
    color: var(--ls-primary-text-color);
    border-bottom-color: rgba(121, 85, 106, .5);
}


/* selected block or higlighted page link */

.dark-theme .ls-block.selected .page-ref,
.dark-theme mark .page-ref {
    color: #EEB8BD;
}

.dark-theme .ls-block.selected .page-ref:hover,
.dark-theme mark .page-ref:hover {
    color: #F2DDDF;
}


/* checkbox */

.dark-theme .marker-switch {
    color: #000;
    background: #52373a;
}

.dark-theme .marker-switch:hover {
    background: #5d3e41;
}


/***************************************************************
************************ RIGHT SIDEBAR *************************
***************************************************************/

.dark-theme .cp__right-sidebar.is-open {
    background: rgba(92, 112, 128, 0.05);
}


/***************************************************************
**************************** MISC ******************************
***************************************************************/

.dark-theme textarea {
    caret-color: #cc515c;
}

.dark-theme ::selection {
    background: #EA989F;
}

/*@import url('https://piotrsss.github.io/logseq-tools/public/bujo-css/dark-black-dots.css');*/

/* dotted bg */

.dark-theme #app-container {
    background-image: radial-gradient(#373737 5%, #181818 5%);
    background-position: 0 0;
    background-size: 25px 25px;
}

/*@import url('https://piotrsss.github.io/logseq-tools/public/bujo-css/light-white.css');*/

/***************************************************************
****************************************************************
****************************************************************
************************ LIGHT - WHITE *************************
****************************************************************
****************************************************************
***************************************************************/

.white-theme,
html[data-theme=light] {
    --ls-search-background-color: #fff;
    --ls-secondary-background-color: #f7f6f4;
    --ls-tertiary-background-color: #f1eee8;
    --ls-quaternary-background-color: #e8e5de;
    --ls-block-properties-background-color: #f7f6f4;
    --ls-block-bullet-border-color: #dedede;
    --ls-block-bullet-color: rgba(67, 63, 56, 0.25);
    --ls-guideline-color: rgba(46, 27, 5, 0.08);
    --ls-primary-text-color: #433F38;
    --ls-title-text-color: var(--ls-primary-text-color);
    --ls-link-text-color: #c95f68;
    --ls-link-text-hover-color: #ac434c;
    --ls-link-ref-text-color: #3d88ce;
    --ls-link-ref-text-hover-color: #5d9cd6;
    --ls-tag-text-color: var(--ls-link-ref-text-color);
    --ls-tag-text-hover-color: var(--ls-link-ref-text-hover-color);
    --ls-icon-color: #c1bdb7;
    --ls-page-inline-code-bg-color: #f7f6f4;
    --ls-page-blockquote-bg-color: #fbfaf8;
    --ls-page-blockquote-border-color: #799bbc;
    --ls-page-checkbox-color: #9dbbd8;
    --ls-page-checkbox-border-color: var(--ls-page-checkbox-color);
    --color-level-1: var(--ls-secondary-background-color);
    --color-level-2: var(--ls-tertiary-background-color);
}

html[data-theme=light] .cp__right-sidebar .block-content {
    --ls-page-inline-code-bg-color: var(--ls-page-inline-code-bg-color);
}


/***************************************************************
***************************** TOP ******************************
***************************************************************/


/* gradient on top and bottom for aesthetics */

.white-theme .cp__sidebar-main-content:before {
    background: linear-gradient(to bottom, rgba(255, 255, 255, .7) 0%, rgba(255, 255, 255, 0) 100%);
}

.white-theme .cp__sidebar-main-content:after {
    background: linear-gradient(to top, rgba(255, 255, 255, .7) 0%, rgba(255, 255, 255, 0) 100%);
}


/* < > buttons */

.white-theme a[title="Go Back"],
.white-theme a[title="Go Forward"] {
    background: rgba(255, 255, 255, 1);
}

.white-theme a[title="Go Back"]:hover,
.white-theme a[title="Go Forward"]:hover {
    background: #f7f6f4;
}


/* search-field */

.white-theme #search_field {
    background: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, .7) 200px, rgba(255, 255, 255, 0) 100%);
    transition: background .3s;
}

.white-theme #search_field:focus {
    box-shadow: 0px 0px 20px 0px rgba(255, 255, 255, .8);
}


/***************************************************************
************************** MAIN AREA ***************************
***************************************************************/


/* title menu ... */

.white-theme [title="More options"] svg {
    color: #7b7b7b;
}


/* page reference */

.white-theme .page-reference {
    padding: 2px 0px;
    transition: .3s;
}

.white-theme .page-reference:hover {
    background: #f6f5f3;
    border-radius: 3px;
}

.white-theme .page-reference .text-gray-500 {
    opacity: 1;
    color: #e6e4df;
}


/* block reference */

.white-theme .block-ref {
    background: rgba(40, 142, 111, 0.1);
    color: var(--ls-primary-text-color);
    border-bottom-color: rgba(40, 142, 111, .3);
}

.white-theme .block-ref a {
    color: var(--ls-primary-text-color);
}


/* checkbox */

.white-theme .form-checkbox {
    background-color: var(--ls-page-checkbox-color);
}

.white-theme .marker-switch {
    color: #504d47;
    background: #f3f2ed;
}

.white-theme .marker-switch:hover {
    background: #eae8e0;
}


/***************************************************************
************************ RIGHT SIDEBAR *************************
***************************************************************/

.white-theme .cp__right-sidebar.is-open {
    background: rgba(128, 122, 92, 0.05);
}


/***************************************************************
**************************** MISC ******************************
***************************************************************/

.white-theme textarea {
    caret-color: #0075E1;
}

/*@import url('https://piotrsss.github.io/logseq-tools/public/bujo-css/light-white-dots.css');*/

/* dotted bg */

.white-theme #app-container {
    background-image: radial-gradient(#e0e0e0 5%, #fff 5%);
    background-position: 0 0;
    background-size: 25px 25px;
}



.block-content[data-type=annotation] a.prefix-link:before {
    content: "-";
}

.block-content[data-type=annotation] .prefix-link:before {
    content: "- ";
}