/* External style imports */
/* Rose Pine */
@import url("https://cdn.jsdelivr.net/gh/ebarruel/logseq-rose-pine-theme@1.1.1/src/rose-pine.css");
/* Rose Pine Dawn */
@import url("https://cdn.jsdelivr.net/gh/ebarruel/logseq-rose-pine-theme@1.1.1/src/rose-pine-dawn.css"); 
/* Logseq Monokai */
/* @import url('https://cdn.jsdelivr.net/gh/tzcl/logseq-monokai@main/custom.css'); */

/* External files */
/* Icon Bullets */
/* Original: https://codeberg.org/alexl/for-logseq/src/branch/main/css/icon-bullets.css */

/*Icons as bullet points. All blocks with a tag like #@folder, #@query etc get an icon. Icons for each tag are defined at the end*/
.light-theme, html[data-theme=light] {--shadow-rgb: 0, 0, 0;--link-rgb: 10, 114, 167;}
.dark-theme, html[data-theme=dark] {--shadow-rgb: 255, 255, 255;--link-rgb: 62, 164, 218;}

.ls-block[data-refs-self*='"@'] > .flex.flex-row.pr-2 .bullet-container .bullet:before {
    font-family: 'tabler-icons';
    color: var(--awSt-content-text-user, var(--ls-primary-text-color));
    background-color: var(--awSt-content-bg-user, var(--ls-primary-background-color));
    border-radius: 100%;
    position: relative;
    top: -8.5px;
    left: -6px;
    letter-spacing: 1px;
    padding-top: 1px;
    padding-bottom: 2px;
    padding-left: 2px;
    padding-right: 1px;}
.ls-block[data-refs-self*='"@']>.flex.flex-row.pr-2>.block-control-wrap a>.bullet-container.bullet-closed>.bullet:before {
    background-color: var(--ls-primary-background-color);
    border-radius: 20%;
    opacity: 100%;
    box-shadow: 0px 0.35px 0.7px 1px rgba(var(--shadow-rgb), 0.4);
}
.ls-block[data-refs-self*='"@']>.flex.flex-row.pr-2>.block-control-wrap a>.bullet-container.bullet-closed>.bullet {background-color: transparent;}
.ls-block[data-refs-self*='"@']:not(:focus-within) .bullet {transform: none;}
.ls-block[data-refs-self*='"@']>.flex.flex-row.pr-2>.block-control-wrap a:hover>.bullet-container {background-color: transparent;}
.ls-block[data-refs-self*='"@']>.flex.flex-row.pr-2>.block-control-wrap a:hover>.bullet-container .bullet {background-color: transparent;}
.ls-block[data-refs-self*='"@']>.flex.flex-row.pr-2>.block-control-wrap a:hover>.bullet-container .bullet {transform: none;}
.ls-block[data-refs-self*='"@']>.flex.flex-row.pr-2>.block-control-wrap a:focus>.bullet-container .bullet {background-color: transparent;}
.ls-block[data-refs-self*='"@']>.flex.flex-row.pr-2>.block-control-wrap a>.bullet-container.bullet-closed {background-color: transparent;}
.ls-block[data-refs-self*='"@'] > div > .flex.flex-col.block-content-wrapper {padding-left: 2px;}

/*Optional: hide tags with @*/
a.tag[data-ref*="@"] {display: none;}

/*Icons to be specified below. Choose a name like @foo
and replace the content value like "\eaad" with the code
of the desired icon. To find the code use TablerPicker plugin*/
.ls-block[data-refs-self*='"@page'] > .flex.flex-row.pr-2 .bullet-container .bullet:before {content: "\eaa4" !important;}
.ls-block[data-refs-self*='"@folder'] > .flex.flex-row.pr-2 .bullet-container .bullet:before {content: "\eaad" !important;}
.ls-block[data-refs-self*='"@tag'] > .flex.flex-row.pr-2 .bullet-container .bullet:before {content: "\eb34" !important;}
.ls-block[data-refs-self*='"@query'] > .flex.flex-row.pr-2 .bullet-container .bullet:before {content: "\eb1c" !important;}
.ls-block[data-refs-self*='"@url'] > .flex.flex-row.pr-2 .bullet-container .bullet:before {content: "\eade" !important;}
.ls-block[data-refs-self*='"@index'] > .flex.flex-row.pr-2 .bullet-container .bullet:before {content: "\eb6b" !important;}
.ls-block[data-refs-self*='"@idea'] > .flex.flex-row.pr-2 .bullet-container .bullet:before {content: "\ea51" !important;}
.ls-block[data-refs-self*='"@person'] > .flex.flex-row.pr-2 .bullet-container .bullet:before {content: "\ef68" !important;}
.ls-block[data-refs-self*='"@book'] > .flex.flex-row.pr-2 .bullet-container .bullet:before {content: "\ea39" !important;}


/*Additionally #@page tag color the icon. Use both #@page and #@folder to color the folder icon
.ls-block[data-refs-self*='"@pagina']>.flex.flex-row.pr-2>.block-control-wrap a>.bullet-container.bullet-closed>.bullet:before {
    box-shadow: 0px 0.35px 0.7px 1px rgba(var(--link-rgb), 0.6);} */
.ls-block[data-refs-self*='"@page']>.flex.flex-row.pr-2>.block-control-wrap a>.bullet-container.bullet-closed>.bullet:before {
    background-color: var(--ls-primary-background-color);
    border-radius: 20%;
    opacity: 100%;
    box-shadow: 0px 0.35px 0.7px 1px rgba(var(--link-rgb), 0.6);
}
.ls-block[data-refs-self*='"@page'] > .flex.flex-row.pr-2 .bullet-container .bullet:before {
    color: var(--awSt-link, var(--ls-link-text-color));}
.ls-block[data-refs-self*='"@page']>.flex.flex-row.pr-2>.block-control-wrap a>.bullet-container.bullet-closed>.bullet:before {
    box-shadow: 0px 0.35px 0.7px 1px rgba(var(--link-rgb), 0.6);}

/* Theme overrides */
/* Rose Pine (Dawn) */
/* Attempting to overwrite inherited custom.css rules
html:not(html[data-color]) .menu-link:hover, html[data-theme="light"][data-color="logseq"] .menu-link:hover, html[data-theme="dark"][data-color="logseq"] .menu-link:hover, html[data-color="none"] .menu-link:hover {
    background-color: var(--ls-menu-hover-color);
}

html:not(html[data-color]) .menu-links-wrapper, html:not(html[data-color]) .menu-link, html[data-theme="light"][data-color="logseq"] .menu-links-wrapper, html[data-theme="light"][data-color="logseq"] .menu-link, html[data-theme="dark"][data-color="logseq"] .menu-links-wrapper, html[data-theme="dark"][data-color="logseq"] .menu-link, html[data-color="none"] .menu-links-wrapper, html[data-color="none"] .menu-link {
    background-color: var(--ls-secondary-background-color);
} */

/* Icon Bullets */
/* @unexplored: pencil-minus */
.ls-block[data-refs-self*='"@unexplored'] > .flex.flex-row.pr-2 .bullet-container .bullet:before {
    content: "\f1eb" !important;
}

/* Custom styles */
/* Use the browser's sans serif font for toki pona*/
.toki {
    font-family: sans-serif;
    font-feature-settings: "kern" 1;
    font-size: 20px;
}

/* Format Generative AI questions like they're code */
.gai {
  	font-family: 'SpaceMono Nerd Font', monospace !important;
  	background-color: var(--ls-secondary-background-color);
  	padding: 4px 14px;
  	margin: 8px 0 !important;
}

.gai > p {
    margin: 0;
}

:root {
    --ct-text-size: 14px;
    --ct-line-height: 1.6;
  	--ls-font-family: "Inter", "tabler-icons", sans-serif;
  	--ct-page-title-font-family: var(--ls-font-family);
  	--ct-code-font-family: monospace; 
}

.macro {
    display: inline-block;
}