
/*
 * @version 2023-10-30
 * @author Patrik Harag
 */

/* every tab */

.finance-component .tab-content > .tab-pane {
    margin: 10pt 0 0 0;
}

/* tab panel data */

.finance-component .panel-data h2 {
    padding-top: 6pt;
    font-size: 1.2rem;
}

.finance-component .panel-data table {
    margin-bottom: 1rem;
}

.finance-component .panel-data table thead {
    font-weight: 500;
}

.finance-component .panel-data .drag-and-drop-hint {
    font-style: italic;
    font-size: small;
    color: gray;
}

.finance-component .panel-data.drag-and-drop-highlight {
    outline: rgba(0, 129, 255, 0.76) dashed thick;
    outline-offset: 2px;
}

.finance-component .panel-data .chart-panel {
    max-height: 200pt;
}

.finance-component .panel-data .chart-panel canvas {
    margin: 3em 0;
}

.finance-component .dataset-form .cm-editor {
    height: 350pt;
}

.finance-component .dataset-form .cm-scroller {
    overflow: auto;
}

/* tab panel filters */

.finance-component .panel-filters .cm-editor {
    height: 350pt;
    margin-bottom: 1em;
}

.finance-component .panel-filters .cm-scroller {
    overflow: auto;
}

.finance-component .panel-filters .alert {
    margin: 0 0 16pt 0;
}

/* tab panel analysis */

.finance-component .panel-analysis .summary-panel {
    font-size: small;
    color: gray;
    float: right;
}

/* options bar */

.finance-component .panel-analysis .options-bar .grouping-component,
.finance-component .panel-analysis .options-bar .ceil-component,
.finance-component .panel-analysis .options-bar .categories-component,
.finance-component .panel-analysis .options-bar .filter-component select,
.finance-component .panel-analysis .options-bar .filter-component input {
    margin-bottom: 4pt;
    margin-right: 6pt;
    vertical-align: top;
}
.finance-component .panel-analysis .options-bar .filter-component,
.finance-component .panel-analysis .options-bar .filter-component select,
.finance-component .panel-analysis .options-bar .filter-component input,
.finance-component .panel-analysis .options-bar .ceil-component,
.finance-component .panel-analysis .options-bar .categories-component {
    display: inline;
}

.finance-component .panel-analysis .options-bar .ceil-component .form-control,
.finance-component .panel-analysis .options-bar .categories-component .form-control {
    /* default bootstrap width: 100% breaks page layout */
    width: unset;
}

.finance-component .panel-analysis .options-bar .filter-component select {
    margin-right: 6pt;
}

.finance-component .panel-analysis .options-bar .filter-component select.btn {
    text-align: left;
}

.finance-component .panel-analysis .options-bar .filter-component input {
    width: 20em;
}

/* table */

.finance-component .panel-analysis .hide-value-floating-part .value-floating-part {
    display: none;
}

.finance-component .table td, .table th {
    padding: 0.25rem 0.75rem;
}

.finance-component .table td.group-key-cell span {
    white-space: nowrap;
}

.finance-component .table td.label-cell {
    font-weight: normal;
    text-align: right;
}

.finance-component .table td.value-cell {
    text-align: right;
}

.finance-component .table td.negative {
    color: darkred;
}

.finance-component .table td.positive {
    color: darkgreen;
}

.finance-component .table td.result {
    font-weight: bold;
}

.finance-component .table td.options-cell {
    text-align: right;
    white-space: nowrap;
}

.finance-component .table td.options-cell .fa {
    text-align: center;
    text-decoration: none;
    color: black;
    margin-left: 0.5em;
}

.finance-component .table td.options-cell .fa:hover {
    opacity: 0.7;
    color: gray;
    text-decoration: none;
}

/* charts */

.finance-component .panel-analysis .chart-panel canvas {
    margin: 3em 0;
}

/* tab panel persistence */

.finance-component .panel-persistence .btn {
    margin-top: 2em;
    margin-right: 0.5em;
}

/* actions */

.finance-component .actions-bar .btn {
    margin-bottom: 4pt;
}
