@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');

:root {
    --dotnet-purple: #512bd4;
    --dotnet-purple-hover: #4411BB;
    --dotnet-purple-border-hover: #3311BB;
}

.bg-dotnet {
    background-color: var(--dotnet-purple) !important;
}

.btn-dotnet {
    color: #fff;
    background-color: var(--dotnet-purple);
    border-color: var(--dotnet-purple);
}

    .btn-dotnet:hover {
        color: #fff;
        background-color: var(--dotnet-purple-hover);
        border-color: var(--dotnet-purple-border-hover);
    }

#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

.breadcrumb {
    border-radius: 0rem;
}

/* General */

.nofocus:focus {
    outline: none;
}

tr.no-border-top th,
tr.no-border-top td {
    border-top: none;
}

code {
    color: unset !important;
}

/* Stats */

.statistics-table.table td:nth-child(2) {
    text-align: right;
}

/* Search */

.modal {
    display: none;
}

.modal.show {
    display: block;
}

.modal-dialog.modal-full {
    max-width: unset !important;
    margin-top: 30px auto;
    margin-bottom: 30px auto;
    margin-left: 5%;
    margin-right: 5%;
}

.search-results {
    overflow-y: auto;
    max-height: 400px;
}

.search-result-row {
    color: var(--color-text-primary);
    border-radius: 0.25rem;
    padding: 0.25rem;
    padding-left: 0.5rem;
    background-color: transparent;
    white-space: nowrap;
    cursor: pointer;
}

    .search-result-row.selected {
        color: white;
        background-color: #007bff;
    }

/* Diff */

.diff-details {
    margin-left: 5px;
    color: rebeccapurple;
}

.diff-added {
    border-radius: 3px;
    background: darkseagreen;
    color: darkgreen;
}

.diff-removed {
    border-radius: 3px;
    background: pink;
    color: darkred;
}

.diff-changed {
    border-radius: 3px;
    background: palegoldenrod;
    color: darkgoldenrod;
}

@media (prefers-color-scheme: dark) {
    .diff-details {
        color: dodgerblue;
    }

    .diff-added {
        border-radius: unset;
        background: unset;
        color: forestgreen;
    }

    .diff-removed {
        border-radius: unset;
        background: unset;
        color: rgba(255, 0, 0, 0.66);
    }

    .diff-changed {
        border-radius: unset;
        background: unset;
        color: orange;
    }
}

/* Code */

.syntax-view {
    display: block;
    font-size: larger;
    background-color: #e9ecef;
    border-radius: 0.25rem;
    padding: 1rem;
    position: relative;
}

.syntax-view .fx-version.fx-version-inbox,
.syntax-view .fx-version.fx-version-package {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
}

.syntax-view.diff-added, .syntax-view .diff-added {
    background: rgba(46, 139, 87, 0.2);
}

.syntax-view.diff-removed, .syntax-view .diff-removed {
    background: rgba(178, 34, 34, 0.2);
}

.syntax-view pre {
    margin-bottom: 0;
    color: black;
}

.syntax-view .keyword {
    color: blue;
}

.syntax-view .annotation {
    border-radius: 0.25rem;
    margin-left: 0.4rem;
    margin-right: 0.4rem;
    padding-left: 0.4rem;
    padding-right: 0.4rem;
    font-size: smaller;
    background-color: lightgray;
    color: black;
}

.syntax-view .punctuation {
    color: black;
}

.syntax-view .string {
    color: #a31515;
}

.syntax-view .number {
    color: #3876c2;
}

.syntax-view .class a {
    color: #2b91af
}

.syntax-view .delegate a {
    color: #2b91af
}

.syntax-view .enum a {
    color: #2b91af
}

.syntax-view .struct a {
    color: #2b91af
}

.syntax-view .interface a {
    color: #2b91af
}

.syntax-view .reference a {
    color: black;
}

.syntax-view .reference {
    color: black;
}

.syntax-view .reference-current {
    font-weight: 800
}

@media (prefers-color-scheme: dark) {
    .syntax-view {
        background-color: rgb(40, 40, 40);
    }

    .syntax-view.diff-added, .syntax-view .diff-added {
        background: rgba(46, 139, 87, 0.3);
    }

    .syntax-view.diff-removed, .syntax-view .diff-removed {
        background: rgba(178, 34, 34, 0.3);
    }

        .syntax-view pre {
            color: rgb(220, 220, 220);
        }

        .syntax-view .keyword {
            color: rgb(86, 156, 214);
        }

        .syntax-view .annotation {
            background-color: rgb(75, 75, 75);
            color: rgb(220, 220, 220);
        }

        .syntax-view .punctuation {
            color: rgb(220, 220, 220);
        }

        .syntax-view .string {
            color: rgb(214, 157, 133);
        }

        .syntax-view .number {
            color: rgb(181, 206, 168);
        }

        .syntax-view .class a {
            color: rgb(78, 201, 176);
        }

        .syntax-view .delegate a {
            color: rgb(78, 201, 176);
        }

        .syntax-view .enum a {
            color: rgb(184, 215, 163);
        }

        .syntax-view .struct a {
            color: rgb(134, 198, 145);
        }

        .syntax-view .interface a {
            color: rgb(184, 215, 163);
        }

        .syntax-view .reference a {
            color: rgb(220, 220, 220);
        }

        .syntax-view .reference {
            color: rgb(220, 220, 220);
        }
}

/* Section Row */

.section-row {
    background-color: #e9ecef;
}

@media (prefers-color-scheme: dark) {
    .section-row {
        background-color: rgb(52, 58, 64);
    }
}

/* Reference requirements */

.reference-requirement p {
    margin-bottom: 0;
}

/* Version table */

.fx-version {
    border-radius: .5rem;
    padding-left: .5rem;
    padding-right: .5rem;
    padding-top: .10rem;
    padding-bottom: .10rem;
    font-size: smaller;
    text-wrap: none;
    cursor: pointer !important;
    position: relative;
}

.fx-version.fx-version-inbox {
    background-color: #512CD4;
    color: white;
}

    .fx-version.fx-version-inbox a:link, .fx-version.fx-version-inbox a:visited {
        color: white;
    }

.fx-version.fx-version-package {
    background-color: hsl(253, 56%, 80%);
    color: black;
}

    .fx-version.fx-version-package a:link, .fx-version.fx-version-package a:visited {
        color: black;
    }

.fx-version.fx-selected {
    font-weight: bolder;
    text-decoration-line: underline;
}

.fx-version.fx-left::after {
    position: absolute;
    content: "";
    border-radius: 0 0 3px 3px;
    border-style: solid;
    border-color: slategray;
    border-width: 1px;
    border-top-color: transparent;
    bottom: -3px;
    height: 10px;
    left: -3px;
    right: -3px;
    z-index: -1;
}

.fx-version.fx-right::before {
    position: absolute;
    content: "";
    border-radius: 3px 3px 0 0;
    border-style: solid;
    border-color: slategray;
    border-width: 1px;
    border-bottom-color: transparent;
    top: -3px;
    height: 10px;
    left: -3px;
    right: -3px;
    z-index: -1;
}

.popover {
    max-width: 100%;
}