﻿/* how to expand the default NoDataTemplate */
.dropgrid .k-grid-norecords {
  height: 260px; /* Grid Height - 40px */
}

.k-window {
  border: 6px solid #ababab;
  color: #212529;
  background-color: #fff;
  border-radius: 25px !important;
  padding: 5px;
}

.locgreen {
  color: green;
  font-size: 28px;
}

.locred {
  color: red;
  font-size: 28px;
}

#qrCode {
  padding: 20px;
  background-color: white;
  max-width: 280px;
}
/*
.submenu {
    padding-top: 10px;
}

    .submenu > li > a {
        border-top: 1px solid transparent;
        color: #012547;
        font-family: "Poppins", sans-serif;
        font-size: 14px;
        min-height: 30px;
        display: block;
        position: relative;
        margin: 0;
        border: 0px;
        padding: 5px 0px 0px 20px;
        text-decoration: none;
        font-weight: 300;
    }*/
/*
    .submenu > li:hover > a {
        background: #f2ddc8;
        color: #012547;
    }
*/
.leadrow_leftborder {
  padding-bottom: 13px;
  padding-top: 13px;
  border-left: 5px solid orange;
  margin-right: 10px;
}

.detailrow_leftborder {
  padding-bottom: 3px;
  padding-top: 3px;
  border-left: 5px solid orange;
  margin-right: 10px;
}

.checkbox input[type='checkbox'] {
  margin-left: 0px !important;
  margin-right: 10px;
}

#grdAiCalls {
    font-size: clamp(12px, 1.3vw, 14px) !important;
    overflow-x: hidden !important;
}

    #grdAiCalls .k-badge {
        padding-top: 1px;
        padding-bottom: 1px;
        padding-left: 5px;
        padding-right: 5px;
    }

    #grdAiCalls .k-badge-rounded.k-badge-md {
        border-radius: 5px !important;
    }

.assistentp{
    padding:0 !important;
    margin:0;
}

#grdResults .k-grid-header .k-header {
    vertical-align: middle;
}

#grdResults tr {
  height: 60px;
}

#grdResults .k-alt {
  background-color: #f8f9fa;
}

#grdResults .k-master-row {
  background-color: white;
}

/*.nav-link.submenutitle {
    margin-left: 15px;
    margin-right: 15px;
    border-bottom: 1px solid #012547;
    padding-top: 10px;
    color: #012547;
    font-weight: 600;
}*/

.highlight {
  background-color: #e2ffe0 !important;
}

.pr-25 {
  padding-right: 25px;
}

.phoneTemplateAgentType {
    background-repeat: no-repeat;
    height: 16px;
    width: 16px;
    vertical-align: middle;
    margin-top: 5px;
    padding-left:5px;
}

.phonein {
    background-image: url('../images/voiceagent/phonein.png');
}

.phoneout {
    background-image: url('../images/voiceagent/phoneout.png');
}

.webvoice {
    background-image: url('../images/voiceagent/web.png');
}

.websocketvoice {
    background-image: url('../images/voiceagent/websocket.png');
}

.k-badge-solid.k-badge-bordergreen {
    border-color: #30A46C;
    border-width: 1px;
    background-color: #ffffff00;
}

.k-badge-solid.k-badge-borderyellow {
    border-color: #FFD60A;
    border-width: 1px;
    background-color: #ffffff00;
}

.k-badge-solid.k-badge-borderwebsocket {
    border-color: #0BD8B6;
    border-width: 1px;
    background-color: #ffffff00;
}

.k-badge-solid.k-badge-borderweb {
    border-color: #7D66D9;
    border-width: 1px;
    background-color: #ffffff00;
}

.k-badge-solid.k-badge-success {
    border-color: var(--success-main);
    color: #fff;
    background-color: var(--success-main);
}

.k-badge-solid.k-badge-endedsuccess {
    border-color: var(--endedsuccess);
    color: var(--endedsuccesstext); /*#0afed5d6*/
    background-color: var(--endedsuccess);
}

.k-badge-solid.k-badge-endedsilence {
    border-color: #FB6A0025;
    color: #FFA057;
    background-color: #FB6A0025;
}

.k-badge-solid.k-badge-endederror {
    border-color: #ff173f2e;
    color: #FF9592;
    background-color: #ff173f2e;
}

.k-badge-solid.k-badge-evaluationchecklist {
    border-color: #FB6A0025;
    color: #FFA057;
    background-color: #FB6A0025;
}

.k-badge-solid.k-badge-yellow {
  border-color: var(--warning-500);
  color: #fff;
  background-color: var(--warning-500);
}

.k-badge-solid.k-badge-warning {
  border-color: var(--warning-800);
  color: #fff;
  background-color: var(--warning-800);
}

.k-badge-solid.k-badge-danger {
  border-color: var(--danger-main);
  color: #fff;
  background-color: var(--danger-main);
}

.k-badge-solid.k-badge-error {
  border-color: var(--danger-600);
  color: #fff;
  background-color: var(--danger-600);
}

.k-badge-rounded.k-badge-md {
  border-radius: 10px !important;
}

.k-badge-md {
  padding: 4px 4px;
  border-width: 1px;
  font-size: 10px;
  line-height: 1;
}

.k-badge {
  padding-top: 2px;
  padding-bottom: 2px;
  padding-left: 10px;
  padding-right: 10px;
  border-width: 0;
  border-style: solid;
  border-color: transparent;
  box-sizing: border-box;
  color: inherit;
  background-color: transparent;
  font: inherit;
  text-align: center;
  white-space: nowrap;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  vertical-align: middle;
  overflow: hidden;
  text-overflow: ellipsis;
}

.k-state-selected,
.k-state-selected:link,
.k-state-selected:visited,
.k-list > .k-state-selected,
.k-list > .k-state-highlight,
.k-panel > .k-state-selected,
.k-ghost-splitbar-vertical,
.k-ghost-splitbar-horizontal,
.k-draghandle.k-state-selected:hover,
.k-scheduler .k-scheduler-toolbar .k-state-selected,
.k-scheduler .k-today.k-state-selected,
.k-marquee-color {
  background-color: #db3a1b !important;
  border-color: #db3a1b !important;
}

.k-pager-sizes .k-dropdown,
.k-pager-sizes .k-dropdown-list,
.k-pager-sizes .k-dropdownlist,
.k-pager-sizes > select {
  width: 7em !important;
}

.k-button {
  background-color: var(--white);
  border-color: var(--primary-500) !important;
  color: var(--primary-500) !important;
}

.k-button:hover {
  background-color: var(--primary-500);
  border-color: var(--primary-500) !important;
  color: #fff !important;
}

.k-primary,
.k-overflow-container .k-primary {
  background-color: var(--primary-500) !important;
  border-color: var(--primary-500) !important;
  color: #fff !important;
}

.k-primary:hover {
  background-color: #a72a12 !important;
  border-color: #a72a12 !important;
  color: #fff !important;
}

.k-tabstrip > .k-content,
.k-panelbar .k-tabstrip > .k-content {
  border: 0px solid #c5c5c5 !important;
  padding: 0 !important;
}

.k-state-active,
.k-state-active:hover,
.k-active-filter,
.k-tabstrip .k-state-active {
  /*border-color: #db3a1b !important;*/
}

.k-tabstrip-items .k-state-active,
.k-panelbar .k-tabstrip-items .k-state-active,
.k-ie7 .k-tabstrip-items .k-state-active .k-loading {
  border-left-color: #52666f !important;
  border-right-color: #52666f !important;
}

.addButton {
  padding-right: 10px;
  margin-bottom: -20px;
  height: 50px;
  width: 240px;
  background-color: #ff5e2b !important;
  /*font-weight:bold;*/
  font-size: 22px !important;
  color: #fff !important;
  z-index: 999;
  position: relative;
}

.addButton:hover {
  padding-right: 10px;
  margin-bottom: -20px;
  height: 50px;
  width: 240px;
  background-color: #ca6500 !important;
  /*font-weight:bold;*/
  font-size: 22px !important;
  color: #fff !important;
  z-index: 999;
  position: relative;
}

.removeButton {
  padding-right: 10px;
  margin-bottom: -20px;
  height: 50px;
  width: 240px;
  background-color: #ff0000 !important;
  /*font-weight:bold;*/
  font-size: 22px !important;
  color: #fff !important;
  z-index: 999;
  position: relative;
}

.removeButton:hover {
  padding-right: 10px;
  margin-bottom: -20px;
  height: 50px;
  width: 240px;
  background-color: #b70000 !important;
  /*font-weight:bold;*/
  font-size: 22px !important;
  color: #fff !important;
  z-index: 999;
  position: relative;
}

/* Accounts Treeview */
#availableAaccountsDb .k-widget.k-treeview,
#selectedAaccountsDb .k-widget.k-treeview {
  background-color: #fff;
  border: 1px solid #c5c5c5;
  color: #2e2e2e;
  height: 150px;
}

/* NEW CSS */
.k-grid {
  font-size: inherit;
}

.k-widget,
.k-grid,
.k-header,
.k-grid-header,
.k-grid-header-wrap,
.rowgroup,
.k-footer-template,
.k-footer-template > td,
.k-grid-footer,
.k-grid-footer-wrap,
.k-group,
.k-pager-numbers-wrap .k-pager-numbers .k-link,
.k-grouping-row > td,
.k-group-cell,
.k-grid tr td,
.k-tooltip {
  background-color: var(--neutral-100) !important;
  border-color: var(--border-color) !important;
  color: var(--black) !important;
}

.k-master-row:hover > td {
  background-color: var(--neutral-200) !important;
}

.k-master-row {
  background-color: var(--neutral-100) !important;
  cursor: pointer;
}

.k-pager-wrap.k-grid-pager.k-widget.k-floatwrap {
  border-top: 0;
}

div.k-grid-footer {
  border-bottom: 0;
}

.k-master-row.k-grid-edit-row > td > input {
  border: 1px solid var(--border-color);
  border-radius: 4px;
  padding: 2px;
  padding-left: 10px;
  cursor: text;
}

.k-master-row.k-grid-edit-row > td > input:hover {
  border: 1px solid var(--black);
}

.k-master-row.k-grid-edit-row > td > input:focus-within {
  border: 1px solid var(--primary-500);
}

.k-alt {
  background-color: var(--white) !important;
}

.k-pager-numbers-wrap .k-pager-numbers .k-link.k-selected {
  background-color: var(--primary-500) !important;
  border-color: var(--border-color) !important;
  color: var(--white) !important;
}

html[data-theme='dark'] .k-pager-numbers-wrap .k-pager-numbers .k-link.k-selected {
  color: var(--black) !important;
}

.k-pager-wrap .k-link {
  color: var(--primary-500);
}

html[data-theme='dark'] .k-dropdownlist,
.k-picker,
.k-widget.k-picker {
  border-color: var(--border-color) !important;
  background-color: var(--neutral-100) !important;
  color: var(--black) !important;
}

.k-picker.k-hover,
.k-picker:hover,
.k-widget.k-picker.k-hover,
.k-widget.k-picker:hover {
  border-color: var(--border-color) !important;
  background-color: var(--white) !important;
}

.k-list,
.k-list-group-sticky-header {
  border-color: var(--border-color) !important;
}

.k-list-content {
  background-color: var(--white) !important;
  color: var(--black);
}

.k-list-item.k-focus,
.k-list-item.k-hover {
  background-color: var(--neutral-100);
  color: var(--black);
  box-shadow: inset 0 0 14px 0 var(--primary-500);
}

.k-list-item.k-focus,
.k-list-item:focus {
  box-shadow: inset 0 0 7px 0 var(--primary-500);
}

html[data-theme='dark'] .k-master-row > td {
  background-color: var(--white);
  border-color: var(--border-color);
}

html[data-theme='dark'] .k-widget,
html[data-theme='dark'] .k-header,
html[data-theme='dark'] .k-grouping-header,
html[data-theme='dark'] .k-grouping-row {
  background-color: var(--white);
  border-color: var(--border-color);
}

html[data-theme='dark'] .k-widget > *:not(.k-pager-nav, .k-pager-refresh),
html[data-theme='dark'] .k-header > *,
html[data-theme='dark'] .k-column-title {
  color: var(--black);
}

html[data-theme='dark'] .k-widget > .k-pager-nav {
  color: var(--primary-500);
}

.k-pager-wrap .k-link {
  color: var(--primary-500);
  background-color: var(--neutral-100) !important;
  border-color: var(--border-color) !important;
}

.k-gantt-toolbar .k-state-default,
.k-grid .k-grouping-header,
.k-grid-header,
.k-grid-header-wrap,
.k-grouping-header .k-group-indicator,
.k-header {
  border-color: var(--border-color);
}

.k-grid-header .k-link,
.k-grid-header .k-link:link,
.k-grid-header .k-link:visited,
.k-grouping-header .k-link {
  color: var(--black);
}

.k-drag-clue,
.k-grid-header,
.k-grouping-header,
.k-header,
.k-menu,
.k-panelbar > .k-panelbar-header > .k-link,
.k-progressbar,
.k-state-highlight,
.k-tabstrip,
.k-tabstrip-items .k-item,
.k-toolbar {
  background-color: var(--white);
}

.h-380 {
  height: 434px;
}

.h-314 {
  height: 314px;
}

.h-265 {
  height: 265px;
}

.w-430 {
  width: 454px;
}

.gauge {
  height: 100%;
  width: 100%;
  margin-top: 5%;
}

.gaugewrapper {
  height: 100%;
}

.border-width-25-px {
  border: 25px solid var(--primary-50);
  border-bottom-color: var(--primary-600);
  border-right-color: var(--primary-600);
}

.k-header .k-grid-filter,
.k-header .k-header-column-menu {
  height: 100%;
}

.k-grouping-header {
  color: var(--black);
  padding: 0.22em 0.5em 0.28em;
}

.resultpdfviewer {
  height: 1200px;
  width: 100%;
}

.k-group-indicator .k-button-flat {
  color: var(--primary-500);
}

.filtered {
  background-color: var(--primary-500) !important;
  color: var(--black) !important;
  font-weight: 800;
}

.k-block,
.k-content,
.k-dropzone-active,
.k-filter-row > th,
.k-footer-template td,
.k-grid td,
.k-grid td.k-selected,
.k-grid td.k-state-selected,
.k-grid-content-locked,
.k-grid-footer,
.k-grid-footer-locked,
.k-grid-footer-wrap,
.k-grid-header,
.k-grid-header-locked,
.k-grid-header-wrap,
.k-group,
.k-group-footer td,
.k-grouping-header,
.k-grouping-header .k-group-indicator,
.k-header,
.k-panel > .k-item > .k-link,
.k-separator,
.k-splitbar,
.k-state-default,
.k-state-disabled,
.k-toolbar,
.k-treemap-tile,
.k-upload .k-action-buttons,
.k-upload-files,
.k-widget {
  border-color: var(--border-color);
}

.k-grid-filter.k-active,
.k-grid-filter.k-state-active {
  background-color: var(--neutral-300);
  color: var(--black);
}

.k-grid-filter:hover,
.k-grid-filter:hover {
  color: var(--neutral-500);
}

.k-detail-cell > canvas {
  background-color: red;
}

.k-tooltip {
  padding: 10px;
  box-shadow: 2px 2px 10px -3px var(--neutral-500);
  font-family: 'Lato', sans-serif;
  font-size: 14px;
}

  
.k-alt.success td,
.k-master-row.success td {
    background-color: var(--success-focus) !important;
}

.k-alt.blue td,
.k-master-row.blue td {
    background-color: var(--primary-light) !important;
}

.k-alt.yellow td,
.k-master-row.yellow td {
    background-color: var(--warning-surface) !important;
}

.k-alt.warning td,
.k-master-row.warning td {
    background-color: var(--warning-100) !important;
}

.k-alt.danger td,
.k-master-row.danger td {
    background-color: var(--danger-surface) !important;
}

.k-alt.error td,
.k-master-row.error td {
    background-color: var(--danger-border) !important;
}

i.ri-alarm-warning-fill.success {
    color: limegreen !important;
    font-size: 12px;
}

i.ri-alarm-warning-fill.blue {
    color: deepskyblue !important;
    font-size: 14px;
}

i.ri-alarm-warning-fill.yellow {
    color: orange !important;
    font-size: 16px;
}

i.ri-alarm-warning-fill.warning {
    color: darkorange !important;
    font-size: 18px;
}

i.ri-alarm-warning-fill.danger {
    color: orangered !important;
    font-size: 22px;
}

i.ri-alarm-warning-fill.error {
    color: red !important;
    font-size: 36px;
}


.warn,
.warn::before,
.warn::after {
    position: relative;
    padding: 0;
    margin: 0;
}

.warn {
    font-size: 36px;
    color: transparent;
}

    .warn.warning {
        display: inline-block;
        top: 0.125em;
        margin-left: 0.3em;
        right: 0.29em;
        width: 1.35em;
        height: 1.15em;
        overflow: hidden;
        border: none;
        background-color: transparent;
        border-radius: 0.625em;
    }

        .warn.warning::before {
            content: "";
            display: block;
            top: -0.08em;
            left: 0.0em;
            position: absolute;
            border: transparent 0.6em solid;
            border-bottom-color: #fd3;
            border-bottom-width: 1em;
            border-top-width: 0;
            box-shadow: #999 0 1px 1px;
        }

        .warn.warning::after {
            display: block;
            position: absolute;
            top: 0.3em;
            left: 0;
            width: 100%;
            padding: 0 1px;
            text-align: center;
            font-family: "Garamond";
            content: "!";
            font-size: 0.65em;
            font-weight: bold;
            color: #333;
        }
