:root {
    --primary-col: #0053f0;
    --back-col: #f8f9fb;
    --red-col: #ff4d4f;
    --darker-col: #262d34;
}

.logs-header {
    padding: 16px 0px 0px 0px;
    background-color: var(--back-col);
}

.logs-header h2 {
    color: var(--darker-col) !important;
}

.logs-dash-cards {
    box-shadow: 0 7px 14px 0 rgba(59, 65, 94, 0.1),
        0 3px 6px 0 rgba(0, 0, 0, 0.07) !important;
    background-color: white !important;
    padding: 12px;
    height: 110px;
    display: flex !important;
    align-items: center !important;
    width: 100%;
    border-radius: 7px !important;
}

.logs-dash-cards .logs-icon-con {
    height: 65px;
    width: 65px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 1000px !important;
}
.logs-dash-cards .logs-icon-con i {
    font-size: 32px !important;
}

.logs-dash-cards h2 {
    color: var(--darker-col);
    font-size: 22px !important;
}

.logs-dash-cards p {
    margin-bottom: 0 !important;
    color: #646464;
}

/* Dash Cards Type */
.all-dash,
.all-dash i {
    background-color: #0053f03a !important;
    color: var(--primary-col) !important;
}

.emergency-dash,
.emergency-dash i {
    background-color: #f165343a;
    color: #f16534 !important;
}

.alert-dash,
.alert-dash i {
    background-color: #fdb81f3a;
    color: #fdb81f !important;
}

.critical-dash,
.critical-dash i {
    background-color: #ff40403a;
    color: #ff4040 !important;
}

.error-dash,
.error-dash i {
    background-color: #f700003a;
    color: #f70000 !important;
}

.warning-dash,
.warning-dash i {
    background-color: #f75c1e3a;
    color: #f75c1e !important;
}

.notice-dash,
.notice-dash i {
    background-color: #26547f3a;
    color: #26547f !important;
}

.info-dash,
.info-dash i {
    background-color: #1976d23a;
    color: #1976d2 !important;
}

.debug-dash,
.debug-dash i {
    background-color: #4c3da33a;
    color: #4c3da3 !important;
}

/* Logs */

.log-table-card {
    box-shadow: 0 7px 14px 0 rgba(59, 65, 94, 0.1),
        0 3px 6px 0 rgba(0, 0, 0, 0.07) !important;
}

.json-container {
    padding: 20px;
}

.vjs-tree {
    font-size: 12px !important;
    font-family: myFont !important;
}

.vjs-tree .vjs-value__string {
    color: var(--primary-col) !important;
}

.log-detail-card {
    margin-top: 20px;
    background-color: #eee;
    border-radius: 7px;
}

.log-detail-card h4 {
    color: black;
}

.log-detail-card span {
    color: #000000e6;
}

.log-detail-card p {
    font-size: 15px;
    margin-bottom: 0px !important;
}

.log-detail-card .v-chip .v-chip__content {
    color: white !important;
}