﻿@font-face {
    font-family: 'InstrumentSans';
    src: url('../fonts/instrumentsans/instrumentsans-variablefont_wdth,wght.ttf') format('truetype');
}

html {
    font-size: var(--pcx-default-font-size);
    position: relative;
    min-height: 100%;
    height: 100%;
}


body {
    font-family: 'InstrumentSans', Helvetica, sans-serif;
    color: var(--pcx-default-font-color);
    background-color: var(--pcx-default-bg-color);
    margin-top: var(--pcx-header-height);
    height: calc(100% - var(--pcx-header-height));
    overflow-y: hidden;
    overflow: auto;
}


[class^="ri-"],
[class*=" ri-"] {
    font-size: 1.2rem;
}


a {
    color: var(--pcx-default-font-color);
}

    a:hover {
        color: var(--pcx-accent-hover-color);
    }


    a.disabled {
        pointer-events: none;
        cursor: default;
        color: #ccc !important;
    }

        a.disabled i {
            color: #ccc !important;
        }

button {
    white-space: nowrap;
}


.no-pointer-events {
    pointer-events: none;
}

.default-box-shadow {
    box-shadow: var(--pcx-default-box-shadow);
}

.pcx-panel {
    border: solid 1px #575a5b;
    background-color: #d8d9da;
    border-radius: 6px;
    padding: 20px;
    min-width: 200px;
    overflow: hidden;
}


.pcx-bg-accent {
    background-color: var(--pcx-default-accent-color);
    color: #ffffff;
}

.pcx-text-primary {
    color: var(--pcx-default-accent-color);
}


.fa, .far, .fas, .fal,
.fa-light, .fa-solid,
[class^="ri-"], [class*=" ri-"] {
    margin-right: 5px;
}


select.form-control {
    height: var(--pcx-input-height);
    padding-right: 5px;
}

.pcx-panel,
.k-content.k-active.k-tabstrip-content {
    background-color: var(--pcx-panel-bg);
    color: var(--pcx-panel-font-color);
    border: var(--pcx-panel-border);
    box-shadow: var(--pcx-panel-shadow);
    padding: 15px;
    border-radius: 8px;
    min-width: 300px;
}

.pcx-panel-chart {
    padding: 0 10px 10px;
}

.button-container {
    white-space: nowrap;
}

    .button-container > .btn-link {
        display: none;
    }


.pcx-search {
    min-width: 150px;
    max-width: 300px;
}

.search-box {
    max-width: 300px;
}




.cursor-help {
    cursor: help;
}




.customer-dropdown {
    max-height: 400px;
    overflow-y: auto;
}


.footer-button-bar {
    width: 100%;
    text-align: center;
    background-color: var(--pcx-default-bg-color);
    padding: 10px;
    z-index: 5;
    border-radius: 6px;
    margin-top: 15px;
    transition: 0.5s;
    position: relative;
    bottom: 5px;
}

    .footer-button-bar.sticky {
        position: sticky;
        bottom: 5px;
        box-shadow: 2px 2px 16px #ccc;
        box-shadow: 2px 2px 16px rgba(0, 0, 0, .4);
    }


.agent-status {
    display: flex;
    align-items: center;
    justify-content: center;
}

.agent-icon {
    width: 8px;
    height: 8px;
    border-radius: 4px;
    margin-right: 4px;
    display: inline-block;
}

    .agent-icon.online {
        background: rgba(16,124,16,1);
        background: var(--status-success-foreground,rgba(16, 124, 16, 1));
    }

    .agent-icon.offline {
        background: rgba(205,74,69,1);
        background: var(--status-error-foreground,rgba(205, 74, 69, 1));
    }

    .agent-icon.busy {
        background: purple;
    }

    .agent-icon.disabled {
        background: rgba(205,74,69,1);
        background: #888;
    }

label.label-checkbox {
}

    label.label-checkbox input[type="checkbox"],
    label.label-checkbox input[type="radio"] {
        position: relative;
        top: 2px;
        margin-right: 5px;
    }

select.disabled {
    pointer-events: none;
    opacity: .7;
}


