/* xxx nice stuff from org.css */
blockquote {
    /* TODO not sure what margin is for here */
    margin: 1em 2em;
    padding-left: 1em;
    border-left: 3px solid #ccc;
}

/* xxx */

/* mm. a bit ugly that 3 and 4 are hardcoded. just to tabulate subtasts */
.outline-3 {
    padding-left: 0.5em;
    border-left-width: 3px;
    border-left-style: dotted;

    border-left-color: transparent;
}
.outline-3:hover {
    border-left-color: #ccc;
}
/* TODO ugh. copy pasting */
.outline-4 {
    padding-left: 0.5em;
    border-left-width: 3px;
    border-left-style: dotted;

    border-left-color: transparent;
}
.outline-4:hover {
    border-left-color: #ccc;
}


/* hack to get around emacs always adding title to org mode export.. */
.content .title {
    display: none;
}

.content .tag {
    float: right;
}

.timestamp {
    font-family: "Source Code Pro", monospace;
    font-size: small;
    color: #000; /* override org-default.css */
}

.properties {
    margin-top: -1em; /* TODO meh */

    font-family: monospace;
    font-size: small;
}

.property.CREATED .property-name {
    text-transform: lowercase;
}

/* hide 'Table of Contents' words, couldn't control it via org... */
#table-of-contents h2 {
    display: none;
}

#table-of-contents .timestamp-wrapper {
    display: none;
}

.todo,.done {
    display: inline-block;
    width: 4ch;
}


tbody tr:nth-child(2n+1) {
    background: #EEE;
}
tbody tr:nth-child(2n+2) {
    background: #FFF;
}

tbody tr td a {
    text-decoration: underline !important; /* meh.... */
}



/* by default p marging is 16px and emacs emits standalon p tags which messes with spacing between list items.. */

.org-ul li {
    margin-top: 0.5em;
}

.org-ul li p {
    margin-bottom: 0;
    margin-top: 0.5em;
}

.org-ul li p:first-child {
    margin-top: 0;
}

/* end */



/* fix overflowing source blocks on mobile (https://github.com/karlicoss/beepb00p/issues/1) */
.org-src-container {
    position: relative;
}

pre.src {
    position: unset;
    overflow: auto;
}

pre.src:before {
    right: 30px;
}
/* end */



/* tweak todo keywords  */

.todo,.done {
    font-weight: bold;
}

.TODO {
    color: orangered;

}

.STRT,.START,.WIP {
    color: magenta;
}

.CNCL {
    color: black;
}

/* end */


/* tweak tags  */
.tag {
    background-color: initial; /* undo default grey */
}

/* not sure about this one... */
.tag a::before {
    content: "#";
}

/*  */


/* tweak TOC */

/* highlight tags on hovering */
#table-of-contents li:hover > .tag a {
    background-color: #dddddd;
}

/* underline link on hovering  */
#table-of-contents li:hover > a {
    text-decoration: underline;
    color: darkgreen; /* eh, not sure about it */
}

#table-of-contents li {
    /* need inline-block for proper responsivenes... othervise list elements overlap on mobile */
    /* that makes list markers go... but whatever  */
    display: inline-block;
    /* width so elements are not piling up on the same line in wide layout */
    width: 100%;
}

#table-of-contents ul {
    /* otherwise the default is quite big and it ends up wasting lots of horizontal space, especially on phones */
    padding-left: 1em;
}

/*  */


/* todo use single .state selector? */
.todo, .done {
    margin-right: 1ch;
}

.priority {
    /* not sure how it works, but in prevents underlining the priority in heading link */
    /* I just borrowed it from default .todo style  */
    display: inline-block;

    margin-right: 1ch;
    font-weight: bold;
}

/* borrowed from Doom config */
.priority-A {
    color: #ff6c6b;
}
.priority-B {
    color: #da8548;
}
.priority-C {
    color: #ecbe7b
}
.priority-D {
    color: #51afef;
}

.tag {
    /* default is 80, bit too small esp in TOC? */
    font-size: 100%;
}

/* todo not very reliable... perhaps add a css specifically for tags? */
.tag a {
    margin-left: 1ch;
}

.tag a:hover {
    /* todo hmm bold looks nice, but active are already bold.. */
    /* font-weight: bold; */

    text-decoration: underline;
}