@import url('open-iconic/font/css/open-iconic-bootstrap.min.css');


html, body {
    font-family: 'Font Awesome 5 Free','Helvetica Neue', Helvetica, Arial, sans-serif;
}

.charity-label {
    background-color: #6f42c1;
    color: white;
}

.tag-label {
    background-color: #007bff;
    color: white;
}

.memo-label {
    background-color: #212529;
    color: white;
}

.category-label {
    background-color: #b1c68c;
    color: white;
}

.holding-label {
    background-color: #8cb1c6;
    color: white;
}

.investment-label {
    background-color: #e05d7c;
    color: white;
}

.register-label {
    background-color: #ecb29d;
    color: white;
}

.amount-label {
    background-color: #dc4a48;
    color: white;
}

/*Category Muted Indigo (#9e9ac8) or Slate Purple (#8c94c6) Organizational, structural grouping
Holding Deep Teal (#4ca3af) or Muted Blue-Green (#6aa3a9) Represents assets/positions — more financial in tone*/


.fa span, .fas span {
    font-weight: normal;
}

a, .btn-link {
    color: #0366d6;
}

.btn-primary {
    color: #fff;
    background-color: #1b6ec2;
    border-color: #1861ac;
}

.page {
    font-family: 'Font Awesome 5 Free';
}

.content {
    padding-top: 1.1rem;
}

.valid.modified:not([type=checkbox]) {
    outline: 1px solid #26b050;
}

.invalid {
    outline: 1px solid red;
}

.validation-message {
    color: red;
}

#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;
    }

.switch {
    position: relative;
    display: inline-block;
    width: 44px;
    height: 22px;
}

    .switch input {
        opacity: 0;
        width: 0;
        height: 0;
    }

.slider {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

    .slider:before {
        position: absolute;
        content: "";
        height: 18px;
        width: 18px;
        left: 2px;
        bottom: 2px;
        background-color: white;
        -webkit-transition: .4s;
        transition: .4s;
    }

input:checked + .slider {
    background-color: #2196F3;
}

input:focus + .slider {
    box-shadow: 0 0 1px #2196F3;
}

input:checked + .slider:before {
    -webkit-transform: translateX(22px);
    -ms-transform: translateX(22px);
    transform: translateX(22px);
}

/* Rounded sliders */
.slider.round {
    border-radius: 22px;
}

.slider.round:before {
    border-radius: 50%;
}

/* Report Controls */
.btn-pdf, .btn-pdf.disabled, .btn-pdf:disabled {
    color: #a30900;
    background-color: transparent;
    border-color: #a30900;
}

.btn-pdf:not(:disabled):not(.disabled):hover {
    color: #fff;
    background-color: #c90b00;
    border-color: #a30900;
}

.btn-pdf:not(:disabled):not(.disabled):active {
    color: #fff;
    background-color: #a30900;
    border-color: #700701;
}

.btn-csv, .btn-csv.disabled, .btn-csv:disabled {
    color: #006100;
    background-color: transparent;
    border-color: #006100;
}

.btn-csv:not(:disabled):not(.disabled):hover {
    color: #fff;
    background-color: #008000;
    border-color: #006100;
}

.btn-csv:not(:disabled):not(.disabled):active {
    color: #fff;
    background-color: #006100;
    border-color: #014201;
}

.input-group-text.inverted-colors {
    color: #e9ecef;
    background-color: #495057;
}


/* 
    The standard zblazor css has some weirdly overagressive rules for every single div under it.
    This ensures that the divs under the selected item in the list are styled with the appropriate highlight.
*/
.zb-quick-autocomplete-items-scrollable div.zb-quick-autocomplete-active div,
.zb-quick-autocomplete-items-scrollable div.zb-quick-autocomplete-active.zb-quick-autocomplete-active:hover div {
    background-color: #5791F5;
    color: #ffffff;
}
.zb-quick-autocomplete-items-scrollable div.zb-quick-autocomplete-item:hover div {
    background-color: #e9e9e9;
}
/* Make autocompletes just a little transparent to get a sense of what's under them */
.zb-quick-autocomplete-items-scrollable div {
    background-color: rgba(255,255,255,0.9);
}
/* Don't force padding and border on the special divs that show up atop the items list */
    .zb-quick-autocomplete-items-scrollable div.zb-quick-autocomplete-nonitem {
        padding: 0;
        border-bottom: 0;
    }

/* Since Sharon likes that sidebar color so much */
.purple-gradient {
    background-image: linear-gradient(to right, rgb(5, 39, 103) 0%, #3a0647 70%);
}

/* 
    prevent mat dialogs from cutting off autocomplete dropdowns
    (because the attribute options aren't robust enough to do it that way)
*/
.mdc-dialog__surface, .mdc-dialog__content {
    overflow: unset !important;
}

/* set minimum pixel width */
.mw-500px {
    min-width: 500px;
}

/* convenience for setting relative font size */
.font-75 {
    font-size: 75%;
}

/* hide these checkmarks by default, then show when their row is selected */
td.selected-checkmark {
    font-size: 0;
}
.table-active td.selected-checkmark {
    font-size: inherit;
}

/* the default highlight color when selecting a BlazorTable row SUCKS (grey-against-grey) */
.table-active, .table-active > td, .table-active > th {
    background-color: rgba(34, 21, 85, .30) !important;
    font-weight: bold;
}

/* Give user the finger */
.table-selectable tr {
    cursor: pointer;
}

/* better hover highlighting when a row is selectable */
.table-selectable .table-hover tbody tr:hover {
    color: #eee;
    background-color: rgba(34, 21, 85, .70);
}

/* the icons for various things in blazortable headers are chunky; shrink them down */
.table-responsive th img {
    scale: 50%;
}

/* word-wrapping preferences */
.pre-wrap {
    white-space: pre-wrap;
}

.badge {
    font-weight: inherit;
}

/* 
    workaround for disappearing scrollbars due to MatDialog 
    see https://github.com/SamProf/MatBlazor/issues/829
*/
body.mdc-dialog-scroll-lock {
    overflow: inherit;
}

/* the default pagination elements on BlazorTables are too damn big */
.pagination {
    font-size: .75rem;
}

/* make text in calendar selectors a little smaller than default */
.flatpickr-calendar {
    font-size: 12px;
}

/* Highlight background - for table rows */
.bgyellow {
    background-color: yellow!important;
}

.float-right{
    float: right;
}

.k-loader-custom-color .k-loader-segment {
    background-color: mediumpurple;
}